From e8835d3058b5dcc3efc6d8abbc9697efa833b017 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Fri, 21 Feb 2025 12:40:22 +0100 Subject: [PATCH 01/26] ui: fix button styling for assist --- .../AssistSearchActions.tsx | 24 ++++++++++--------- .../shared/SearchActions/SearchActions.tsx | 16 ++++++------- 2 files changed, 21 insertions(+), 19 deletions(-) diff --git a/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx b/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx index 33f6c23e9..1ec95db9e 100644 --- a/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx +++ b/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Button } from 'antd'; +import { Button, Tooltip } from 'antd'; import { useModal } from 'App/components/Modal'; import { MODULES } from 'Components/Client/Modules'; @@ -27,21 +27,23 @@ function AssistSearchActions() { return (
{isEnterprise && modules.includes(MODULES.OFFLINE_RECORDINGS) - ? : null + ? : null } {isEnterprise && ( - )} - + + +
); } diff --git a/frontend/app/components/shared/SearchActions/SearchActions.tsx b/frontend/app/components/shared/SearchActions/SearchActions.tsx index ddc27c858..305ad52ea 100644 --- a/frontend/app/components/shared/SearchActions/SearchActions.tsx +++ b/frontend/app/components/shared/SearchActions/SearchActions.tsx @@ -40,14 +40,14 @@ function SearchActions() {
- +
{showPanel ? ( From 3a331d266cd5c902f7e374de3c36f2540a125d0e Mon Sep 17 00:00:00 2001 From: Kraiem Taha Yassine Date: Fri, 21 Feb 2025 12:56:05 +0100 Subject: [PATCH 02/26] Dev (#3052) * fix(chalice): support wrong payload for user-journey drill-down * fix(chalice): ignore event's MV for v1.22 refactor(DB): ignore event's MV for v1.22 --- api/schemas/transformers_validators.py | 3 + ee/api/chalicelib/utils/exp_ch_helper.py | 7 +- .../db/init_dbs/clickhouse/1.22.0/1.22.0.sql | 3 + .../clickhouse/create/init_schema.sql | 72 ------------------ .../rollback_dbs/clickhouse/1.22.0/1.22.0.sql | 74 +++++++++++++++++++ 5 files changed, 84 insertions(+), 75 deletions(-) diff --git a/api/schemas/transformers_validators.py b/api/schemas/transformers_validators.py index e50371aa4..106f8747c 100644 --- a/api/schemas/transformers_validators.py +++ b/api/schemas/transformers_validators.py @@ -38,6 +38,9 @@ def force_is_event(events_enum: list[Type[Enum]]): def fn(value: list): if value is not None and isinstance(value, list): for v in value: + if v.get("type") is None: + v["isEvent"] = False + continue r = False for en in events_enum: if en.has_value(v["type"]) or en.has_value(v["type"].lower()): diff --git a/ee/api/chalicelib/utils/exp_ch_helper.py b/ee/api/chalicelib/utils/exp_ch_helper.py index 282351908..1e19bed2c 100644 --- a/ee/api/chalicelib/utils/exp_ch_helper.py +++ b/ee/api/chalicelib/utils/exp_ch_helper.py @@ -13,9 +13,10 @@ if config("EXP_7D_MV", cast=bool, default=True): def get_main_events_table(timestamp=0, platform="web"): if platform == "web": - return "experimental.events_l7d_mv" \ - if config("EXP_7D_MV", cast=bool, default=True) \ - and timestamp and timestamp >= TimeUTC.now(delta_days=-7) else "experimental.events" + return "product_analytics.events" + # return "experimental.events_l7d_mv" \ + # if config("EXP_7D_MV", cast=bool, default=True) \ + # and timestamp and timestamp >= TimeUTC.now(delta_days=-7) else "experimental.events" else: return "experimental.ios_events" diff --git a/ee/scripts/schema/db/init_dbs/clickhouse/1.22.0/1.22.0.sql b/ee/scripts/schema/db/init_dbs/clickhouse/1.22.0/1.22.0.sql index 67231a79f..27aadcf39 100644 --- a/ee/scripts/schema/db/init_dbs/clickhouse/1.22.0/1.22.0.sql +++ b/ee/scripts/schema/db/init_dbs/clickhouse/1.22.0/1.22.0.sql @@ -334,3 +334,6 @@ CREATE TABLE IF NOT EXISTS product_analytics.all_properties _timestamp DateTime DEFAULT now() ) ENGINE = ReplacingMergeTree(_timestamp) ORDER BY (project_id, property_name, is_event_property); + + +DROP TABLE IF EXISTS experimental.events_l7d_mv; \ No newline at end of file diff --git a/ee/scripts/schema/db/init_dbs/clickhouse/create/init_schema.sql b/ee/scripts/schema/db/init_dbs/clickhouse/create/init_schema.sql index 413595d79..1fd1a79e7 100644 --- a/ee/scripts/schema/db/init_dbs/clickhouse/create/init_schema.sql +++ b/ee/scripts/schema/db/init_dbs/clickhouse/create/init_schema.sql @@ -191,78 +191,6 @@ CREATE TABLE IF NOT EXISTS experimental.issues ORDER BY (project_id, issue_id, type) TTL _timestamp + INTERVAL 3 MONTH; -CREATE MATERIALIZED VIEW IF NOT EXISTS experimental.events_l7d_mv - ENGINE = ReplacingMergeTree(_timestamp) - PARTITION BY toYYYYMMDD(datetime) - ORDER BY (project_id, datetime, event_type, session_id, message_id) - TTL datetime + INTERVAL 7 DAY - POPULATE -AS -SELECT session_id, - project_id, - event_type, - datetime, - label, - hesitation_time, - name, - payload, - level, - source, - message, - error_id, - duration, - context, - url, - url_host, - url_path, - url_hostpath, - request_start, - response_start, - response_end, - dom_content_loaded_event_start, - dom_content_loaded_event_end, - load_event_start, - load_event_end, - first_paint, - first_contentful_paint_time, - speed_index, - visually_complete, - time_to_interactive, - ttfb, - ttlb, - response_time, - dom_building_time, - dom_content_loaded_event_time, - load_event_time, - min_fps, - avg_fps, - max_fps, - min_cpu, - avg_cpu, - max_cpu, - min_total_js_heap_size, - avg_total_js_heap_size, - max_total_js_heap_size, - min_used_js_heap_size, - avg_used_js_heap_size, - max_used_js_heap_size, - method, - status, - success, - request_body, - response_body, - issue_type, - issue_id, - error_tags_keys, - error_tags_values, - transfer_size, - selector, - normalized_x, - normalized_y, - message_id, - _timestamp -FROM experimental.events -WHERE datetime >= now() - INTERVAL 7 DAY; CREATE MATERIALIZED VIEW IF NOT EXISTS experimental.sessions_l7d_mv diff --git a/ee/scripts/schema/db/rollback_dbs/clickhouse/1.22.0/1.22.0.sql b/ee/scripts/schema/db/rollback_dbs/clickhouse/1.22.0/1.22.0.sql index c60511f00..5c7f64a56 100644 --- a/ee/scripts/schema/db/rollback_dbs/clickhouse/1.22.0/1.22.0.sql +++ b/ee/scripts/schema/db/rollback_dbs/clickhouse/1.22.0/1.22.0.sql @@ -1 +1,75 @@ CREATE OR REPLACE FUNCTION openreplay_version AS() -> 'v1.21.0-ee'; + + +CREATE MATERIALIZED VIEW IF NOT EXISTS experimental.events_l7d_mv + ENGINE = ReplacingMergeTree(_timestamp) + PARTITION BY toYYYYMMDD(datetime) + ORDER BY (project_id, datetime, event_type, session_id, message_id) + TTL datetime + INTERVAL 7 DAY + POPULATE +AS +SELECT session_id, + project_id, + event_type, + datetime, + label, + hesitation_time, + name, + payload, + level, + source, + message, + error_id, + duration, + context, + url, + url_host, + url_path, + url_hostpath, + request_start, + response_start, + response_end, + dom_content_loaded_event_start, + dom_content_loaded_event_end, + load_event_start, + load_event_end, + first_paint, + first_contentful_paint_time, + speed_index, + visually_complete, + time_to_interactive, + ttfb, + ttlb, + response_time, + dom_building_time, + dom_content_loaded_event_time, + load_event_time, + min_fps, + avg_fps, + max_fps, + min_cpu, + avg_cpu, + max_cpu, + min_total_js_heap_size, + avg_total_js_heap_size, + max_total_js_heap_size, + min_used_js_heap_size, + avg_used_js_heap_size, + max_used_js_heap_size, + method, + status, + success, + request_body, + response_body, + issue_type, + issue_id, + error_tags_keys, + error_tags_values, + transfer_size, + selector, + normalized_x, + normalized_y, + message_id, + _timestamp +FROM experimental.events +WHERE datetime >= now() - INTERVAL 7 DAY; \ No newline at end of file From d63877de1c7459fdc9082f59313c36198496fe43 Mon Sep 17 00:00:00 2001 From: Shekar Siri Date: Fri, 21 Feb 2025 15:05:30 +0100 Subject: [PATCH 03/26] change(ui): condition check for recordings module --- .../Assist/AssistSearchActions/AssistSearchActions.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx b/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx index 1ec95db9e..1af58f7c5 100644 --- a/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx +++ b/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx @@ -26,7 +26,7 @@ function AssistSearchActions() { }; return (
- {isEnterprise && modules.includes(MODULES.OFFLINE_RECORDINGS) + {isEnterprise && !modules.includes(MODULES.OFFLINE_RECORDINGS) ? : null } {isEnterprise && ( From b91d979c987a4196b4e8bb9df0cc62125daa7556 Mon Sep 17 00:00:00 2001 From: Shekar Siri Date: Fri, 21 Feb 2025 15:06:13 +0100 Subject: [PATCH 04/26] change(ui): recordings admin only access --- .../Assist/AssistSearchActions/AssistSearchActions.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx b/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx index 1af58f7c5..53d605aff 100644 --- a/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx +++ b/frontend/app/components/Assist/AssistSearchActions/AssistSearchActions.tsx @@ -29,7 +29,7 @@ function AssistSearchActions() { {isEnterprise && !modules.includes(MODULES.OFFLINE_RECORDINGS) ? : null } - {isEnterprise && ( + {isEnterprise && userStore.account?.admin && ( From c07ad14ffcba769a74bf20728796539026a62756 Mon Sep 17 00:00:00 2001 From: Kraiem Taha Yassine Date: Fri, 21 Feb 2025 15:21:22 +0100 Subject: [PATCH 05/26] Dev (#3053) * fix(chalice): support wrong payload for user-journey drill-down * fix(chalice): ignore event's MV for v1.22 refactor(DB): ignore event's MV for v1.22 * fix(chalice): fixed EE metrics --- ee/api/routers/subs/metrics.py | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/ee/api/routers/subs/metrics.py b/ee/api/routers/subs/metrics.py index 2cf14c885..bbeeaadc1 100644 --- a/ee/api/routers/subs/metrics.py +++ b/ee/api/routers/subs/metrics.py @@ -1,7 +1,7 @@ from typing import Union import schemas -from chalicelib.core.metrics import dashboards, custom_metrics +from chalicelib.core.metrics import custom_metrics, dashboards from fastapi import Body, Depends from or_dependencies import OR_context, OR_scope from routers.base import get_routers @@ -87,7 +87,7 @@ def try_card(projectId: int, data: schemas.CardSchema = Body(...), @app.post('/{projectId}/cards/try/sessions', tags=["cards"]) def try_card_sessions(projectId: int, data: schemas.CardSessionsSchema = Body(...), context: schemas.CurrentContext = Depends(OR_context)): - data = custom_metrics.get_sessions(project_id=projectId, user_id=context.user_id, data=data) + data = custom_metrics.get_sessions(project=context.project, user_id=context.user_id, data=data) return {"data": data} @@ -130,7 +130,7 @@ def get_card(projectId: int, metric_id: Union[int, str], context: schemas.Curren def get_card_sessions(projectId: int, metric_id: int, data: schemas.CardSessionsSchema = Body(...), context: schemas.CurrentContext = Depends(OR_context)): - data = custom_metrics.get_sessions_by_card_id(project_id=projectId, user_id=context.user_id, metric_id=metric_id, + data = custom_metrics.get_sessions_by_card_id(project=context.project, user_id=context.user_id, metric_id=metric_id, data=data) if data is None: return {"errors": ["custom metric not found"]} From c271e01dfc6eaf44de0d1e5c9b532853b656f95a Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Fri, 21 Feb 2025 15:42:59 +0100 Subject: [PATCH 06/26] ui: reload tags on project change --- .../shared/SessionFilters/SessionFilters.tsx | 28 +++++++++++-------- 1 file changed, 17 insertions(+), 11 deletions(-) diff --git a/frontend/app/components/shared/SessionFilters/SessionFilters.tsx b/frontend/app/components/shared/SessionFilters/SessionFilters.tsx index 4e40105ff..84b95a585 100644 --- a/frontend/app/components/shared/SessionFilters/SessionFilters.tsx +++ b/frontend/app/components/shared/SessionFilters/SessionFilters.tsx @@ -23,28 +23,34 @@ function SessionFilters() { projectsStore.instance?.saveRequestPayloads ?? false; const activeProject = projectsStore.active + const reloadTags = async () => { + const tags = await tagWatchStore.getTags(); + if (tags) { + addOptionsToFilter( + FilterKey.TAGGED_ELEMENT, + tags.map((tag) => ({ + label: tag.name, + value: tag.tagId.toString(), + })) + ); + searchStore.refreshFilterOptions(); + } + } + useEffect(() => { // Add default location/screen filter if no filters are present if (searchStore.instance.filters.length === 0) { searchStore.addFilterByKeyAndValue(activeProject?.platform === 'web' ? FilterKey.LOCATION : FilterKey.VIEW_MOBILE , '', 'isAny') } + void reloadTags(); }, [projectsStore.activeSiteId, activeProject]) + useSessionSearchQueryHandler({ appliedFilter, loading: metaLoading, onBeforeLoad: async () => { - const tags = await tagWatchStore.getTags(); - if (tags) { - addOptionsToFilter( - FilterKey.TAGGED_ELEMENT, - tags.map((tag) => ({ - label: tag.name, - value: tag.tagId.toString(), - })) - ); - searchStore.refreshFilterOptions(); - } + await reloadTags(); }, }); From 0533624c2580c4253b1154602cf964ff24ad9714 Mon Sep 17 00:00:00 2001 From: Kraiem Taha Yassine Date: Fri, 21 Feb 2025 16:25:12 +0100 Subject: [PATCH 07/26] fix(chalice): fixed EE create heatmaps card (#3054) --- api/chalicelib/core/metrics/custom_metrics.py | 22 +++++++++---------- .../core/metrics/custom_metrics_ee.py | 14 ++++++------ 2 files changed, 18 insertions(+), 18 deletions(-) diff --git a/api/chalicelib/core/metrics/custom_metrics.py b/api/chalicelib/core/metrics/custom_metrics.py index f5255017f..2eea08b46 100644 --- a/api/chalicelib/core/metrics/custom_metrics.py +++ b/api/chalicelib/core/metrics/custom_metrics.py @@ -55,8 +55,8 @@ def __get_sessions_list(project: schemas.ProjectContext, user_id, data: schemas. return sessions_search.search_sessions(data=data.series[0].filter, project=project, user_id=user_id) -def __get_heat_map_chart(project: schemas.ProjectContext, user_id, data: schemas.CardHeatMap, - include_mobs: bool = True): +def get_heat_map_chart(project: schemas.ProjectContext, user_id, data: schemas.CardHeatMap, + include_mobs: bool = True): if len(data.series) == 0: return None data.series[0].filter.filters += data.series[0].filter.events @@ -156,7 +156,7 @@ def get_chart(project: schemas.ProjectContext, data: schemas.CardSchema, user_id supported = { schemas.MetricType.TIMESERIES: __get_timeseries_chart, schemas.MetricType.TABLE: __get_table_chart, - schemas.MetricType.HEAT_MAP: __get_heat_map_chart, + schemas.MetricType.HEAT_MAP: get_heat_map_chart, schemas.MetricType.FUNNEL: __get_funnel_chart, schemas.MetricType.PATH_ANALYSIS: __get_path_analysis_chart } @@ -201,12 +201,12 @@ def get_issues(project: schemas.ProjectContext, user_id: int, data: schemas.Card return supported.get(data.metric_type, not_supported)() -def __get_global_card_info(data: schemas.CardSchema): +def get_global_card_info(data: schemas.CardSchema): r = {"hideExcess": data.hide_excess, "compareTo": data.compare_to, "rows": data.rows} return r -def __get_path_analysis_card_info(data: schemas.CardPathAnalysis): +def get_path_analysis_card_info(data: schemas.CardPathAnalysis): r = {"start_point": [s.model_dump() for s in data.start_point], "start_type": data.start_type, "excludes": [e.model_dump() for e in data.excludes], @@ -221,8 +221,8 @@ def create_card(project: schemas.ProjectContext, user_id, data: schemas.CardSche if data.session_id is not None: session_data = {"sessionId": data.session_id} else: - session_data = __get_heat_map_chart(project=project, user_id=user_id, - data=data, include_mobs=False) + session_data = get_heat_map_chart(project=project, user_id=user_id, + data=data, include_mobs=False) if session_data is not None: session_data = {"sessionId": session_data["sessionId"]} @@ -235,9 +235,9 @@ def create_card(project: schemas.ProjectContext, user_id, data: schemas.CardSche series_len = len(data.series) params = {"user_id": user_id, "project_id": project.project_id, **data.model_dump(), **_data, "default_config": json.dumps(data.default_config.model_dump()), "card_info": None} - params["card_info"] = __get_global_card_info(data=data) + params["card_info"] = get_global_card_info(data=data) if data.metric_type == schemas.MetricType.PATH_ANALYSIS: - params["card_info"] = {**params["card_info"], **__get_path_analysis_card_info(data=data)} + params["card_info"] = {**params["card_info"], **get_path_analysis_card_info(data=data)} params["card_info"] = json.dumps(params["card_info"]) query = """INSERT INTO metrics (project_id, user_id, name, is_public, @@ -299,9 +299,9 @@ def update_card(metric_id, user_id, project_id, data: schemas.CardSchema): d_series_ids.append(i) params["d_series_ids"] = tuple(d_series_ids) params["session_data"] = json.dumps(metric["data"]) - params["card_info"] = __get_global_card_info(data=data) + params["card_info"] = get_global_card_info(data=data) if data.metric_type == schemas.MetricType.PATH_ANALYSIS: - params["card_info"] = {**params["card_info"], **__get_path_analysis_card_info(data=data)} + params["card_info"] = {**params["card_info"], **get_path_analysis_card_info(data=data)} elif data.metric_type == schemas.MetricType.HEAT_MAP: if data.session_id is not None: params["session_data"] = json.dumps({"sessionId": data.session_id}) diff --git a/ee/api/chalicelib/core/metrics/custom_metrics_ee.py b/ee/api/chalicelib/core/metrics/custom_metrics_ee.py index a450fd736..ca9cfd04f 100644 --- a/ee/api/chalicelib/core/metrics/custom_metrics_ee.py +++ b/ee/api/chalicelib/core/metrics/custom_metrics_ee.py @@ -1,9 +1,7 @@ -import json -import logging - from decouple import config -from chalicelib.utils.storage import extra + from chalicelib.core.sessions import sessions_mobs, sessions_favorite +from chalicelib.utils.storage import extra from .custom_metrics import * @@ -14,8 +12,8 @@ def create_card(project: schemas.ProjectContext, user_id, data: schemas.CardSche if data.session_id is not None: session_data = {"sessionId": data.session_id} else: - session_data = __get_heat_map_chart(project=project, user_id=user_id, - data=data, include_mobs=False) + session_data = get_heat_map_chart(project=project, user_id=user_id, + data=data, include_mobs=False) if session_data is not None: session_data = {"sessionId": session_data["sessionId"]} @@ -42,8 +40,10 @@ def create_card(project: schemas.ProjectContext, user_id, data: schemas.CardSche series_len = len(data.series) params = {"user_id": user_id, "project_id": project.project_id, **data.model_dump(), **_data, "default_config": json.dumps(data.default_config.model_dump()), "card_info": None} + params["card_info"] = get_global_card_info(data=data) if data.metric_type == schemas.MetricType.PATH_ANALYSIS: - params["card_info"] = json.dumps(__get_path_analysis_card_info(data=data)) + params["card_info"] = {**params["card_info"], **get_path_analysis_card_info(data=data)} + params["card_info"] = json.dumps(params["card_info"]) query = """INSERT INTO metrics (project_id, user_id, name, is_public, view_type, metric_type, metric_of, metric_value, From 74f6c2cd66ba374dae5a297429cd28c5722e9ab0 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Fri, 21 Feb 2025 17:15:33 +0100 Subject: [PATCH 08/26] ui: fix autoopen state --- .../components/shared/Filters/FilterValue/FilterValue.tsx | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/frontend/app/components/shared/Filters/FilterValue/FilterValue.tsx b/frontend/app/components/shared/Filters/FilterValue/FilterValue.tsx index 5d4c60ca1..378d9c5a6 100644 --- a/frontend/app/components/shared/Filters/FilterValue/FilterValue.tsx +++ b/frontend/app/components/shared/Filters/FilterValue/FilterValue.tsx @@ -20,6 +20,13 @@ function FilterValue(props: Props) { const { filter } = props; const isAutoOpen = filter.autoOpen; + React.useEffect(() => { + if (isAutoOpen) { + setTimeout(() => { + filter.autoOpen = false; + }, 250) + } + }, [isAutoOpen]) const [durationValues, setDurationValues] = useState({ minDuration: filter.value?.[0], maxDuration: filter.value.length > 1 ? filter.value[1] : filter.value[0], From ed3020dc7e09cb542e9a3ff03f5569f499e85850 Mon Sep 17 00:00:00 2001 From: Kraiem Taha Yassine Date: Fri, 21 Feb 2025 17:31:56 +0100 Subject: [PATCH 09/26] fix(chalice): fixed enumeration based session's filters (including custom events) (#3055) --- api/chalicelib/core/sessions/sessions_ch.py | 2 +- api/chalicelib/utils/sql_helper.py | 9 +++++++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/api/chalicelib/core/sessions/sessions_ch.py b/api/chalicelib/core/sessions/sessions_ch.py index 4ebc8723d..d6de1f6cf 100644 --- a/api/chalicelib/core/sessions/sessions_ch.py +++ b/api/chalicelib/core/sessions/sessions_ch.py @@ -381,7 +381,7 @@ def search_query_parts_ch(data: schemas.SessionsSearchPayloadSchema, error_statu filter_type = f.type f.value = helper.values_for_operator(value=f.value, op=f.operator) f_k = f"f_value{i}" - full_args = {**full_args, f_k: f.value, **sh.multi_values(f.value, value_key=f_k)} + full_args = {**full_args, f_k: sh.single_value(f.value), **sh.multi_values(f.value, value_key=f_k)} op = sh.get_sql_operator(f.operator) \ if filter_type not in [schemas.FilterType.EVENTS_COUNT] else f.operator.value is_any = sh.isAny_opreator(f.operator) diff --git a/api/chalicelib/utils/sql_helper.py b/api/chalicelib/utils/sql_helper.py index 23c0078c4..1de16c70f 100644 --- a/api/chalicelib/utils/sql_helper.py +++ b/api/chalicelib/utils/sql_helper.py @@ -64,3 +64,12 @@ def isAny_opreator(op: schemas.SearchEventOperator): def isUndefined_operator(op: schemas.SearchEventOperator): return op in [schemas.SearchEventOperator.IS_UNDEFINED] + + +def single_value(values): + if values is not None and isinstance(values, list): + for i, v in enumerate(values): + if isinstance(v, Enum): + values[i] = v.value + return values + From 7e4782ae7102ab3af6ce78faa1f68de25ac062a0 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Fri, 21 Feb 2025 17:36:23 +0100 Subject: [PATCH 10/26] ui: hide selection in tablemode --- .../Dashboard/components/WidgetChart/WidgetChart.tsx | 2 ++ .../Dashboard/components/WidgetDatatable/WidgetDatatable.tsx | 3 ++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx index 86cb52759..da8d9e790 100644 --- a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx +++ b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx @@ -538,6 +538,7 @@ function WidgetChart(props: Props) { const showTable = _metric.metricType === TIMESERIES && (props.isPreview || _metric.viewType === TABLE) + const tableMode = _metric.viewType === 'table' && _metric.metricType === TIMESERIES return (
{loading ? stale ? : : ( @@ -549,6 +550,7 @@ function WidgetChart(props: Props) { inBuilder={props.isPreview} defaultOpen={true} data={data} + tableMode={tableMode} enabledRows={enabledRows} setEnabledRows={setEnabledRows} metric={_metric} diff --git a/frontend/app/components/Dashboard/components/WidgetDatatable/WidgetDatatable.tsx b/frontend/app/components/Dashboard/components/WidgetDatatable/WidgetDatatable.tsx index 08637a70d..e9fd1a9b5 100644 --- a/frontend/app/components/Dashboard/components/WidgetDatatable/WidgetDatatable.tsx +++ b/frontend/app/components/Dashboard/components/WidgetDatatable/WidgetDatatable.tsx @@ -31,6 +31,7 @@ interface Props { defaultOpen?: boolean; metric: { name: string; viewType: string }; inBuilder?: boolean; + tableMode?: boolean; } function WidgetDatatable(props: Props) { @@ -161,7 +162,7 @@ function WidgetDatatable(props: Props) { columns={tableProps} dataSource={tableData} pagination={false} - rowSelection={rowSelection} + rowSelection={props.tableMode ? undefined : rowSelection} size={'small'} scroll={{ x: 'max-content' }} /> From 99d6545720e7944df47bcf75b6af80bf96f8b0a4 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Fri, 21 Feb 2025 17:48:38 +0100 Subject: [PATCH 11/26] ui: fix table crash --- .../Dashboard/components/WidgetDatatable/WidgetDatatable.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/app/components/Dashboard/components/WidgetDatatable/WidgetDatatable.tsx b/frontend/app/components/Dashboard/components/WidgetDatatable/WidgetDatatable.tsx index e9fd1a9b5..d145b50cb 100644 --- a/frontend/app/components/Dashboard/components/WidgetDatatable/WidgetDatatable.tsx +++ b/frontend/app/components/Dashboard/components/WidgetDatatable/WidgetDatatable.tsx @@ -43,6 +43,7 @@ function WidgetDatatable(props: Props) { dataObj.chart = dataObj.chart.map((item, i) => { const compItem = props.compData!.chart[i]; const newItem = { ...item }; + if (!compItem) return newItem; Object.keys(compItem).forEach((key) => { if (key !== 'timestamp' && key !== 'time') { newItem[key] = compItem[key]; From 64e08916f97ef399d38b2c240b8607bea7edf733 Mon Sep 17 00:00:00 2001 From: Kraiem Taha Yassine Date: Fri, 21 Feb 2025 18:21:49 +0100 Subject: [PATCH 12/26] fix(chalice): fixed session's clickmap (#3056) --- api/chalicelib/core/metrics/heatmaps_ch.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/api/chalicelib/core/metrics/heatmaps_ch.py b/api/chalicelib/core/metrics/heatmaps_ch.py index 3b78ef551..93afb78cc 100644 --- a/api/chalicelib/core/metrics/heatmaps_ch.py +++ b/api/chalicelib/core/metrics/heatmaps_ch.py @@ -149,7 +149,7 @@ def get_selectors_by_url_and_session_id(project_id, session_id, data: schemas.Ge query_from = f"{exp_ch_helper.get_main_events_table(0)} AS main_events" with ch_client.ClickHouseClient() as cur: - query = cur.format(query=f"""SELECT main_events.selector AS selector, + query = cur.format(query=f"""SELECT CAST(`$properties`.selector AS String) AS selector, COUNT(1) AS count FROM {query_from} WHERE {" AND ".join(constraints)} From fe06f43dd5793a3bbda7513127daa4d3c3a5d29d Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Mon, 24 Feb 2025 10:37:04 +0100 Subject: [PATCH 13/26] ui: date picker and db name improvements --- .../DashboardEditModal/DashboardEditModal.tsx | 2 +- .../Dashboard/components/WidgetName/WidgetName.tsx | 2 +- frontend/app/styles/main.css | 13 ++++++++++++- 3 files changed, 14 insertions(+), 3 deletions(-) diff --git a/frontend/app/components/Dashboard/components/DashboardEditModal/DashboardEditModal.tsx b/frontend/app/components/Dashboard/components/DashboardEditModal/DashboardEditModal.tsx index 3d8cfb44e..1be4a2444 100644 --- a/frontend/app/components/Dashboard/components/DashboardEditModal/DashboardEditModal.tsx +++ b/frontend/app/components/Dashboard/components/DashboardEditModal/DashboardEditModal.tsx @@ -53,7 +53,7 @@ function DashboardEditModal(props: Props) { value={ dashboard.name } onChange={write} placeholder="Title" - maxLength={100} + maxLength={40} autoFocus={focusTitle} /> diff --git a/frontend/app/components/Dashboard/components/WidgetName/WidgetName.tsx b/frontend/app/components/Dashboard/components/WidgetName/WidgetName.tsx index e6d6c7d1a..eb52d7906 100644 --- a/frontend/app/components/Dashboard/components/WidgetName/WidgetName.tsx +++ b/frontend/app/components/Dashboard/components/WidgetName/WidgetName.tsx @@ -55,7 +55,7 @@ function WidgetName(props: Props) { onBlur={() => onBlur()} onKeyDown={onKeyDown} onFocus={() => setEditing(true)} - maxLength={80} + maxLength={40} className="bg-white text-2xl ps-2 rounded-lg h-8" /> ) : ( diff --git a/frontend/app/styles/main.css b/frontend/app/styles/main.css index e7d2b388f..2f074ff3e 100644 --- a/frontend/app/styles/main.css +++ b/frontend/app/styles/main.css @@ -353,11 +353,22 @@ svg { .dateRangeContainer .react-calendar__tile--active{ background-color: rgba(57, 77, 254,.7); + color: #FFF!important; +} + +.dateRangeContainer .react-calendar__tile--rangeStart { + background-color: #394dfe; + color: #FFF!important; } .dateRangeContainer .react-calendar__tile--hasActive, .dateRangeContainer .react-calendar__tile--active:hover, .dateRangeContainer .react-calendar__tile--active:enabled:hover, .dateRangeContainer .react-calendar__tile--active:enabled:focus, .dateRangeContainer .react-calendar__tile--hasActive:enabled:hover, .dateRangeContainer .react-calendar__tile--hasActive:enabled:focus{ background-color: #394dfe; - color: #FFF; + color: #FFF!important; +} + +.react-calendar__tile--now:enabled:hover, .react-calendar__tile--now:enabled:focus { + background-color: #2331A8!important; + color: #FFF!important; } .dateRangeContainer .react-calendar__tile--hasActive:hover{ From 8b2cf031ca8a917fac8b82035b5c9852aa8477c7 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Mon, 24 Feb 2025 13:59:52 +0100 Subject: [PATCH 14/26] ui: chart drilldown -- fix datatable filtering, fix series filtering --- frontend/app/components/Charts/BarChart.tsx | 4 ++++ frontend/app/components/Charts/LineChart.tsx | 7 ++++++- frontend/app/components/Charts/init.ts | 1 + .../components/WidgetChart/WidgetChart.tsx | 18 ++++++++++++++++-- .../WidgetSessions/WidgetSessions.tsx | 8 +++++++- frontend/app/mstore/metricStore.ts | 5 +++++ 6 files changed, 39 insertions(+), 4 deletions(-) diff --git a/frontend/app/components/Charts/BarChart.tsx b/frontend/app/components/Charts/BarChart.tsx index 386770505..2d23dd834 100644 --- a/frontend/app/components/Charts/BarChart.tsx +++ b/frontend/app/components/Charts/BarChart.tsx @@ -13,6 +13,7 @@ echarts.use([BarChart]); interface BarChartProps extends DataProps { label?: string; onClick?: (event: any) => void; + onSeriesFocus?: (event: any) => void; } function ORBarChart(props: BarChartProps) { @@ -81,6 +82,9 @@ function ORBarChart(props: BarChartProps) { const index = event.dataIndex; const timestamp = (window as any).__timestampMap?.[chartUuid.current]?.[index]; props.onClick?.({ activePayload: [{ payload: { timestamp }}]}) + setTimeout(() => { + props.onSeriesFocus?.(event.seriesName) + }, 0) }) return () => { diff --git a/frontend/app/components/Charts/LineChart.tsx b/frontend/app/components/Charts/LineChart.tsx index 0c2d1ead9..9155ed92c 100644 --- a/frontend/app/components/Charts/LineChart.tsx +++ b/frontend/app/components/Charts/LineChart.tsx @@ -12,6 +12,7 @@ interface Props extends DataProps { isArea?: boolean; chartName?: string; onClick?: (event: any) => void; + onSeriesFocus?: (event: any) => void; } function ORLineChart(props: Props) { @@ -73,7 +74,8 @@ function ORLineChart(props: Props) { // nameGap: 40, nameTextStyle: { padding: [0, 0, 0, 15], - } + }, + minInterval: 1 }, tooltip: { ...defaultOptions.tooltip, @@ -91,6 +93,9 @@ function ORLineChart(props: Props) { const index = event.dataIndex; const timestamp = (window as any).__timestampMap?.[chartUuid.current]?.[index]; props.onClick?.({ activePayload: [{ payload: { timestamp }}]}) + setTimeout(() => { + props.onSeriesFocus?.(event.seriesName) + }, 0) }) return () => { diff --git a/frontend/app/components/Charts/init.ts b/frontend/app/components/Charts/init.ts index 5fd5b8ec6..6544dece3 100644 --- a/frontend/app/components/Charts/init.ts +++ b/frontend/app/components/Charts/init.ts @@ -36,6 +36,7 @@ const defaultOptions = { extraCssText: 'box-shadow: none; pointer-events: auto;', axisPointer: { type: 'cross', + snap: true, label: { backgroundColor: '#6a7985' }, diff --git a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx index da8d9e790..6d282096c 100644 --- a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx +++ b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx @@ -65,7 +65,7 @@ function WidgetChart(props: Props) { const prevMetricRef = useRef(); const isMounted = useIsMounted(); const [compData, setCompData] = useState(null); - const [enabledRows, setEnabledRows] = useState([]); + const [enabledRows, setEnabledRows] = useState(_metric.series.map(s => s.name)); const isTableWidget = _metric.metricType === 'table' && _metric.viewType === 'table'; const isPieChart = @@ -78,6 +78,17 @@ function WidgetChart(props: Props) { }; }, []); + useEffect(() => { + if (enabledRows.length !== _metric.series.length) { + const excluded = _metric.series + .filter((s) => !enabledRows.includes(s.name)) + .map((s) => s.name); + metricStore.setDisabledSeries(excluded); + } else { + metricStore.setDisabledSeries([]); + } + }, [enabledRows]) + useEffect(() => { if (!data.chart) return; const series = data.chart[0] @@ -227,7 +238,7 @@ function WidgetChart(props: Props) { ]); useEffect(loadPage, [_metric.page]); - const onFocus = (seriesName: string)=> { + const onFocus = (seriesName: string) => { metricStore.setFocusedSeriesName(seriesName); metricStore.setDrillDown(true) } @@ -318,6 +329,7 @@ function WidgetChart(props: Props) { inGrid={!props.isPreview} data={chartData} compData={compDataCopy} + onSeriesFocus={onFocus} onClick={onChartClick} label={ _metric.metricOf === 'sessionCount' @@ -335,6 +347,7 @@ function WidgetChart(props: Props) { data={chartData} inGrid={!props.isPreview} onClick={onChartClick} + onSeriesFocus={onFocus} label={ _metric.metricOf === 'sessionCount' ? 'Number of Sessions' @@ -351,6 +364,7 @@ function WidgetChart(props: Props) { compData={compDataCopy} params={params} colors={colors} + onSeriesFocus={onFocus} onClick={onChartClick} label={ _metric.metricOf === 'sessionCount' diff --git a/frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx b/frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx index 73621e383..9600f5c97 100644 --- a/frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx +++ b/frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx @@ -108,7 +108,12 @@ function WidgetSessions(props: Props) { debounceClickMapSearch(customFilter); } else { const hasStartPoint = !!widget.startPoint && widget.metricType === USER_PATH - const activeSeries = focusedSeries ? widget.series.filter((s) => s.name === focusedSeries) : widget.series + const onlyFocused = focusedSeries + ? widget.series.filter((s) => s.name === focusedSeries) + : widget.series + const activeSeries = metricStore.disabledSeries.length + ? onlyFocused.filter((s) => !metricStore.disabledSeries.includes(s.name)) + : onlyFocused const seriesJson = activeSeries.map((s) => s.toJson()); if (hasStartPoint) { seriesJson[0].filter.filters.push(widget.startPoint.toJson()); @@ -132,6 +137,7 @@ function WidgetSessions(props: Props) { metricStore.clickMapSearch, focusedSeries, widget.startPoint, + metricStore.disabledSeries.length ]); useEffect(loadData, [metricStore.sessionsPage]); useEffect(() => { diff --git a/frontend/app/mstore/metricStore.ts b/frontend/app/mstore/metricStore.ts index 694e5d94a..28d57fa0c 100644 --- a/frontend/app/mstore/metricStore.ts +++ b/frontend/app/mstore/metricStore.ts @@ -102,6 +102,7 @@ export default class MetricStore { cardCategory: string | null = CATEGORIES.product_analytics; focusedSeriesName: string | null = null; + disabledSeries: string[] = []; drillDown = false; constructor() { @@ -151,6 +152,10 @@ export default class MetricStore { } } + setDisabledSeries(series: string[]) { + this.disabledSeries = series; + } + setCardCategory(category: string) { this.cardCategory = category; } From b406893d00920b84e9b4881e351073b5dd97edcd Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Mon, 24 Feb 2025 15:57:42 +0100 Subject: [PATCH 15/26] ui: fix funnel table --- .../Funnels/FunnelWidget/FunnelTable.tsx | 31 ++++++++++++------- 1 file changed, 19 insertions(+), 12 deletions(-) diff --git a/frontend/app/components/Funnels/FunnelWidget/FunnelTable.tsx b/frontend/app/components/Funnels/FunnelWidget/FunnelTable.tsx index 97f850b91..777b91a1b 100644 --- a/frontend/app/components/Funnels/FunnelWidget/FunnelTable.tsx +++ b/frontend/app/components/Funnels/FunnelWidget/FunnelTable.tsx @@ -4,7 +4,7 @@ import type { TableProps } from 'antd'; import Widget from 'App/mstore/types/widget'; import Funnel from 'App/mstore/types/funnel'; import { ItemMenu } from 'UI'; -import { EllipsisVertical, FileDown } from 'lucide-react'; +import { EllipsisVertical } from 'lucide-react'; import { exportAntCsv } from '../../../utils'; interface Props { @@ -14,12 +14,7 @@ interface Props { } function FunnelTable(props: Props) { - const tableData = [ - { - conversion: props.data.funnel.totalConversionsPercentage, - }, - ]; - const tableProps: TableProps['columns'] = [ + const defaultTableProps: TableProps['columns'] = [ { title: 'Conversion %', dataIndex: 'conversion', @@ -34,31 +29,43 @@ function FunnelTable(props: Props) { ), }, ]; + const defaultData = [ + { + conversion: props.data.funnel.totalConversionsPercentage, + }, + ] + const [tableProps, setTableProps] = React.useState(defaultTableProps); + const [tableData, setTableData] = React.useState(defaultData); + React.useEffect(() => { - const funnel = props.data.funnel; + const funnel = props.data.funnel + const tablePropsCopy = defaultTableProps; + const tableDataCopy = defaultData; funnel.stages.forEach((st, ind) => { const title = `${st.label} ${st.operator} ${st.value.join(' or ')}`; const wrappedTitle = title.length > 40 ? title.slice(0, 40) + '...' : title; - tableProps.push({ + tablePropsCopy.push({ title: wrappedTitle, dataIndex: 'st_' + ind, key: 'st_' + ind, ellipsis: true, width: 120, }); - tableData[0]['st_' + ind] = st.count; + tableDataCopy[0]['st_' + ind] = st.count; }); if (props.compData) { - tableData.push({ + tableDataCopy.push({ conversion: props.compData.funnel.totalConversionsPercentage, }) const compFunnel = props.compData.funnel; compFunnel.stages.forEach((st, ind) => { - tableData[1]['st_' + ind] = st.count; + tableDataCopy[1]['st_' + ind] = st.count; }); } + setTableProps(tablePropsCopy); + setTableData(tableDataCopy); }, [props.data]); return ( From 1122ced4c3206297d58a35391374dc1e6ab48bd9 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Mon, 24 Feb 2025 16:00:31 +0100 Subject: [PATCH 16/26] ui: remove utm and tagged element from mobile filter --- frontend/app/types/filter/newFilter.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/frontend/app/types/filter/newFilter.js b/frontend/app/types/filter/newFilter.js index 345bbeaa9..48023f8c8 100644 --- a/frontend/app/types/filter/newFilter.js +++ b/frontend/app/types/filter/newFilter.js @@ -1184,7 +1184,8 @@ const MOBILE_EXCLUDE = [ FilterKey.CLICK, FilterKey.INPUT, FilterKey.ERROR, FilterKey.CUSTOM, FilterKey.LOCATION, FilterKey.FETCH, FilterKey.DOM_COMPLETE, FilterKey.LARGEST_CONTENTFUL_PAINT_TIME, FilterKey.TTFB, FilterKey.USER_BROWSER, - FilterKey.PLATFORM + FilterKey.PLATFORM, FilterKey.TAGGED_ELEMENT, FilterKey.STATEACTION, FilterKey.UTM_CAMPAIGN, + FilterKey.UTM_SOURCE, FilterKey.UTM_MEDIUM, FilterKey.SLOW_SESSION ]; /** From 968a3eefde301f22446b25910805e03e26ab9846 Mon Sep 17 00:00:00 2001 From: Delirium Date: Mon, 24 Feb 2025 16:11:44 +0100 Subject: [PATCH 17/26] ui: migrating old components -> ant (#3060) * ui: migrating old components -> ant * ui: moving input, tooltip, toggler, checkbox... -> Toggler\s*(.)? from 'UI * ui: more components moved * ui: move popover to ant --- frontend/app/PrivateRoutes.tsx | 29 -- .../Alerts/Notifications/Notifications.tsx | 5 +- .../Assist/ChatControls/ChatControls.tsx | 12 +- .../RecordingsList/EditRecordingModal.tsx | 5 +- .../RequestingWindow/RequestingWindow.tsx | 5 +- .../AssistActions/AssistActions.tsx | 19 +- .../Client/Audit/AuditView/AuditView.tsx | 6 +- .../Client/CustomFields/ListItem.js | 5 +- .../Client/Integrations/IntegrationForm.tsx | 5 +- .../Integrations/SlackAddForm/SlackAddForm.js | 6 +- .../Client/Integrations/SlackForm.tsx | 5 +- .../Integrations/Teams/TeamsAddForm.tsx | 6 +- .../Client/Integrations/Teams/index.tsx | 7 +- .../Client/Notifications/Notifications.tsx | 9 +- .../Client/ProfileSettings/ChangePassword.tsx | 7 +- .../Client/ProfileSettings/Settings.js | 5 +- .../Client/ProfileSettings/TenantKey.js | 6 +- .../app/components/Client/Roles/Roles.tsx | 6 +- .../Roles/components/RoleForm/RoleForm.tsx | 8 +- .../Roles/components/RoleItem/RoleItem.tsx | 5 +- .../AddProjectButton/AddProjectButton.tsx | 5 +- .../app/components/Client/Sites/BlockedIps.js | 31 -- .../app/components/Client/Sites/GDPRForm.js | 12 +- .../Sites/InstallButton/InstallButton.tsx | 4 +- .../components/Client/Sites/NewSiteForm.tsx | 11 +- .../app/components/Client/Sites/Sites.tsx | 9 +- .../Client/Sites/blockedIps.module.css | 37 -- .../AddUserButton/AddUserButton.tsx | 5 +- .../Users/components/UserForm/UserForm.tsx | 22 +- .../components/UserListItem/UserListItem.tsx | 15 +- .../Dashboard/Widgets/common/Table.js | 4 +- .../Alerts/AlertForm/BottomButtons.tsx | 10 +- .../components/CardIssues/CardIssues.tsx | 8 +- .../components/CardUserList/CardUserList.tsx | 5 +- .../DashboardModal/DashboardModal.tsx | 4 +- .../DashboardSelectionModal.tsx | 83 ----- .../DashboardSelectionModal/index.ts | 0 .../DashboardWidgetGrid/AddMetric.tsx | 7 +- .../AddPredefinedMetric.tsx | 7 +- .../MetricsLibraryModal/FooterContent.tsx | 6 +- .../components/WidgetForm/WidgetForm.tsx | 23 +- .../components/Errors/Error/MainSection.js | 8 +- .../components/FFlags/FFlagItem/FFlagItem.tsx | 35 +- .../components/FFlags/FFlagsListHeader.tsx | 5 +- .../components/FFlags/FlagView/FlagView.tsx | 64 ++-- .../FFlags/NewFFlag/Description.tsx | 7 +- .../app/components/FFlags/NewFFlag/Header.tsx | 6 +- .../FFlags/NewFFlag/Multivariant.tsx | 5 +- .../components/FFlags/NewFFlag/NewFFlag.tsx | 93 +++-- .../ForgotPassword/CreatePassword.tsx | 21 +- .../Funnels/FunnelDetails/FunnelDetails.tsx | 15 - .../components/Funnels/FunnelDetails/index.js | 1 - .../Funnels/FunnelIssueDetails/index.js | 1 - .../Funnels/FunnelList/FunnelList.tsx | 61 ---- .../components/Funnels/FunnelList/index.ts | 1 - .../Funnels/FunnelPage/FunnelPage.tsx | 26 -- .../components/Funnels/FunnelPage/index.ts | 1 - .../HealthStatus/HealthModal/HealthModal.tsx | 8 +- .../IdentifyUsersTab/IdentifyUsersTab.tsx | 12 +- .../InstallOpenReplayTab.tsx | 10 +- .../IntegrationsTab/IntegrationsTab.tsx | 14 +- .../ManageUsersTab/ManageUsersTab.tsx | 16 +- .../components/MetadataList/MetadataList.tsx | 6 +- .../OnboardingNavButton.js | 6 +- .../OnboardingTabs/InstallDocs/InstallDocs.js | 5 +- .../ProjectCodeSnippet/ProjectCodeSnippet.js | 19 +- .../Player/ClipPlayer/AutoPlayTimer.tsx | 8 +- .../Session/Player/PlayerErrorBoundary.tsx | 18 +- .../EventsBlock/Metadata/MetadataItem.js | 5 +- .../EventsBlock/Metadata/MetadataItem.js | 5 +- .../Session_/EventsBlock/UserCard/UserCard.js | 2 - .../components/Session_/Fetch/FetchDetails.js | 7 +- .../AssistSessionsModal.tsx | 8 +- .../components/ControlsComponents.tsx | 11 +- .../Player/Controls/components/CreateNote.tsx | 332 ------------------ .../Controls/components/PlayingTime.tsx | 1 + .../components/Session_/Player/Overlay.tsx | 31 +- .../Session_/Player/Overlay/AutoplayTimer.tsx | 7 +- .../ScreenRecorder/ScreenRecorder.tsx | 11 +- .../Session_/components/HeaderMenu.tsx | 78 ---- .../Session_/components/NotePopup.tsx | 41 --- .../Signup/SignupForm/SignupForm.tsx | 7 +- .../UpdatePassword/UpdatePassword.js | 120 ------- .../UpdatePassword/updatePassword.module.css | 127 ------- .../AlertTriggersModal/AlertTriggersModal.tsx | 4 +- .../AlertTriggersModal/ListItem/ListItem.tsx | 4 +- .../shared/DevTools/TimeTable/TimeTable.tsx | 19 +- .../app/components/shared/DocLink/DocLink.js | 5 +- .../shared/ImageViewer/ImageViewer.js | 30 -- .../components/shared/ImageViewer/index.js | 1 - .../IntegrateSlackButton.js | 5 +- .../shared/LiveSearchBar/LiveSearchBar.tsx | 7 +- .../LiveSessionList/LiveSessionList.tsx | 8 +- .../SaveSearchModal/SaveSearchModal.tsx | 8 +- .../MetaMoreButton/MetaMoreButton.tsx | 5 +- .../ConditionalRecordingSettings.tsx | 5 +- .../components/DefaultTimezone.tsx | 7 +- .../components/ListingVisibility.tsx | 5 +- .../components/SessionList/SessionList.tsx | 8 +- .../SessionSettingButton.tsx | 5 +- .../shared/ToggleContent/ToggleContent.js | 6 +- .../WidgetAutoComplete/WidgetAutoComplete.js | 5 +- frontend/app/components/ui/Avatar/Avatar.js | 5 +- frontend/app/components/ui/Button/Button.tsx | 4 +- .../app/components/ui/Checkbox/Checkbox.tsx | 9 +- .../ui/ErrorDetails/ErrorDetails.tsx | 7 +- .../app/components/ui/HelpText/HelpText.tsx | 20 -- frontend/app/components/ui/HelpText/index.ts | 1 - .../components/ui/IconButton/IconButton.js | 3 +- frontend/app/components/ui/Input/Input.tsx | 6 +- .../app/components/ui/ItemMenu/ItemMenu.tsx | 4 +- .../ui/LinkStyledInput/LinkStyledInput.js | 102 ------ .../components/ui/LinkStyledInput/index.js | 1 - .../linkStyledInput.module.css | 34 -- .../ui/LoadMoreButton/LoadMoreButton.js | 26 -- .../app/components/ui/LoadMoreButton/index.js | 1 - .../NoSessionPermission.tsx | 7 +- frontend/app/components/ui/PopMenu/PopMenu.js | 43 --- frontend/app/components/ui/PopMenu/index.js | 1 - .../components/ui/PopMenu/popMenu.module.css | 83 ----- .../app/components/ui/Popover/Popover.tsx | 112 ++---- .../ui/RandomElement/RandomElement.js | 40 --- .../app/components/ui/RandomElement/index.js | 1 - .../ui/SideMenuItem/SideMenuItem.tsx | 3 +- .../components/ui/SplitButton/SplitButton.js | 19 - .../app/components/ui/SplitButton/index.js | 1 - .../ui/SplitButton/splitButton.module.css | 16 - .../app/components/ui/TagInput/TagInput.js | 3 +- .../app/components/ui/TextLabel/TextLabel.js | 3 +- .../ui/TimelinePointer/TimelinePointer.js | 3 +- .../ui/TimezoneDropdown/TimezoneDropdown.js | 39 -- .../components/ui/TimezoneDropdown/index.js | 1 - .../timezoneDropdown.module.css | 24 -- frontend/app/components/ui/Toggler/Toggler.js | 31 -- frontend/app/components/ui/Toggler/index.js | 1 - .../components/ui/Toggler/toggler.module.css | 97 ----- frontend/app/components/ui/Tooltip.tsx | 1 + .../components/ui/Tooltip/FloatingTooltip.tsx | 173 --------- .../app/components/ui/Tooltip/Tooltip.tsx | 56 --- frontend/app/components/ui/Tooltip/index.ts | 1 - frontend/app/components/ui/index.js | 13 +- frontend/app/routes.ts | 11 - 142 files changed, 525 insertions(+), 2352 deletions(-) delete mode 100644 frontend/app/components/Client/Sites/BlockedIps.js delete mode 100644 frontend/app/components/Client/Sites/blockedIps.module.css delete mode 100644 frontend/app/components/Dashboard/components/DashboardSelectionModal/DashboardSelectionModal.tsx delete mode 100644 frontend/app/components/Dashboard/components/DashboardSelectionModal/index.ts delete mode 100644 frontend/app/components/Funnels/FunnelDetails/FunnelDetails.tsx delete mode 100644 frontend/app/components/Funnels/FunnelDetails/index.js delete mode 100644 frontend/app/components/Funnels/FunnelIssueDetails/index.js delete mode 100644 frontend/app/components/Funnels/FunnelList/FunnelList.tsx delete mode 100644 frontend/app/components/Funnels/FunnelList/index.ts delete mode 100644 frontend/app/components/Funnels/FunnelPage/FunnelPage.tsx delete mode 100644 frontend/app/components/Funnels/FunnelPage/index.ts delete mode 100644 frontend/app/components/Session_/Player/Controls/components/CreateNote.tsx delete mode 100644 frontend/app/components/Session_/components/HeaderMenu.tsx delete mode 100644 frontend/app/components/Session_/components/NotePopup.tsx delete mode 100644 frontend/app/components/UpdatePassword/UpdatePassword.js delete mode 100644 frontend/app/components/UpdatePassword/updatePassword.module.css delete mode 100644 frontend/app/components/shared/ImageViewer/ImageViewer.js delete mode 100644 frontend/app/components/shared/ImageViewer/index.js delete mode 100644 frontend/app/components/ui/HelpText/HelpText.tsx delete mode 100644 frontend/app/components/ui/HelpText/index.ts delete mode 100644 frontend/app/components/ui/LinkStyledInput/LinkStyledInput.js delete mode 100644 frontend/app/components/ui/LinkStyledInput/index.js delete mode 100644 frontend/app/components/ui/LinkStyledInput/linkStyledInput.module.css delete mode 100644 frontend/app/components/ui/LoadMoreButton/LoadMoreButton.js delete mode 100644 frontend/app/components/ui/LoadMoreButton/index.js delete mode 100644 frontend/app/components/ui/PopMenu/PopMenu.js delete mode 100644 frontend/app/components/ui/PopMenu/index.js delete mode 100644 frontend/app/components/ui/PopMenu/popMenu.module.css delete mode 100644 frontend/app/components/ui/RandomElement/RandomElement.js delete mode 100644 frontend/app/components/ui/RandomElement/index.js delete mode 100644 frontend/app/components/ui/SplitButton/SplitButton.js delete mode 100644 frontend/app/components/ui/SplitButton/index.js delete mode 100644 frontend/app/components/ui/SplitButton/splitButton.module.css delete mode 100644 frontend/app/components/ui/TimezoneDropdown/TimezoneDropdown.js delete mode 100644 frontend/app/components/ui/TimezoneDropdown/index.js delete mode 100644 frontend/app/components/ui/TimezoneDropdown/timezoneDropdown.module.css delete mode 100644 frontend/app/components/ui/Toggler/Toggler.js delete mode 100644 frontend/app/components/ui/Toggler/index.js delete mode 100644 frontend/app/components/ui/Toggler/toggler.module.css create mode 100644 frontend/app/components/ui/Tooltip.tsx delete mode 100644 frontend/app/components/ui/Tooltip/FloatingTooltip.tsx delete mode 100644 frontend/app/components/ui/Tooltip/Tooltip.tsx delete mode 100644 frontend/app/components/ui/Tooltip/index.ts diff --git a/frontend/app/PrivateRoutes.tsx b/frontend/app/PrivateRoutes.tsx index 5ddcf8ee4..b9d2cb247 100644 --- a/frontend/app/PrivateRoutes.tsx +++ b/frontend/app/PrivateRoutes.tsx @@ -18,11 +18,6 @@ const components: any = { AssistPure: lazy(() => import('Components/Assist/AssistRouter')), SessionsOverviewPure: lazy(() => import('Components/Overview')), DashboardPure: lazy(() => import('Components/Dashboard/NewDashboard')), - FunnelDetailsPure: lazy(() => import('Components/Funnels/FunnelDetails')), - FunnelIssueDetails: lazy( - () => import('Components/Funnels/FunnelIssueDetails') - ), - FunnelPagePure: lazy(() => import('Components/Funnels/FunnelPage')), MultiviewPure: lazy(() => import('Components/Session_/Multiview/Multiview')), UsabilityTestingPure: lazy( () => import('Components/UsabilityTesting/UsabilityTesting') @@ -47,9 +42,6 @@ const enhancedComponents: any = { Assist: withSiteIdUpdater(components.AssistPure), Client: withSiteIdUpdater(components.ClientPure), Onboarding: withSiteIdUpdater(components.OnboardingPure), - FunnelPage: withSiteIdUpdater(components.FunnelPagePure), - FunnelsDetails: withSiteIdUpdater(components.FunnelDetailsPure), - FunnelIssue: withSiteIdUpdater(components.FunnelIssueDetails), Multiview: withSiteIdUpdater(components.MultiviewPure), UsabilityTesting: withSiteIdUpdater(components.UsabilityTestingPure), UsabilityTestEdit: withSiteIdUpdater(components.UsabilityTestEditPure), @@ -85,9 +77,6 @@ const FFLAG_READ_PATH = routes.fflagRead(); const NOTES_PATH = routes.notes(); const BOOKMARKS_PATH = routes.bookmarks(); const RECORDINGS_PATH = routes.recordings(); -const FUNNEL_PATH = routes.funnels(); -const FUNNEL_CREATE_PATH = routes.funnelsCreate(); -const FUNNEL_ISSUE_PATH = routes.funnelIssue(); const SESSION_PATH = routes.session(); const CLIENT_PATH = routes.client(); const ONBOARDING_PATH = routes.onboarding(); @@ -246,24 +235,6 @@ function PrivateRoutes() { path={withSiteId(HIGHLIGHTS_PATH, siteIdList)} component={enhancedComponents.Highlights} /> - - - void, @@ -35,17 +35,15 @@ function ChatControls({ stream, endCall, videoEnabled, setVideoEnabled, isPresta return (
-
+
-
-
diff --git a/frontend/app/components/Assist/RecordingsList/EditRecordingModal.tsx b/frontend/app/components/Assist/RecordingsList/EditRecordingModal.tsx index 7be5b1dca..6c654d249 100644 --- a/frontend/app/components/Assist/RecordingsList/EditRecordingModal.tsx +++ b/frontend/app/components/Assist/RecordingsList/EditRecordingModal.tsx @@ -1,6 +1,7 @@ import { useObserver } from 'mobx-react-lite'; import React from 'react'; -import { Button, Modal, Form, Icon, Input } from 'UI'; +import { Modal, Form, Icon, Input } from 'UI'; +import { Button } from 'antd' interface Props { show: boolean; @@ -57,7 +58,7 @@ function EditRecordingModal(props: Props) {
{WIN_VARIANTS[windowType].text} -
diff --git a/frontend/app/components/Assist/components/AssistActions/AssistActions.tsx b/frontend/app/components/Assist/components/AssistActions/AssistActions.tsx index 80a49bedd..40281b8a9 100644 --- a/frontend/app/components/Assist/components/AssistActions/AssistActions.tsx +++ b/frontend/app/components/Assist/components/AssistActions/AssistActions.tsx @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; -import { Button, Tooltip } from 'UI'; +import { Button } from 'antd'; import cn from 'classnames'; import ChatWindow from '../../ChatWindow'; import { CallingState, ConnectionStatus, RemoteControlStatus, RequestLocalStream } from 'Player'; @@ -7,7 +7,7 @@ import type { LocalStream } from 'Player'; import { PlayerContext, ILivePlayerContext } from 'App/components/Session/playerContext'; import { observer } from 'mobx-react-lite'; import { toast } from 'react-toastify'; -import { confirm } from 'UI'; +import { confirm, Icon, Tooltip } from 'UI'; import stl from './AassistActions.module.css'; import ScreenRecorder from 'App/components/Session_/ScreenRecorder/ScreenRecorder'; import { audioContextManager } from 'App/utils/screenRecorder'; @@ -213,9 +213,10 @@ function AssistActions({ role="button" > @@ -238,8 +239,9 @@ function AssistActions({ role="button" >
diff --git a/frontend/app/components/Client/CustomFields/ListItem.js b/frontend/app/components/Client/CustomFields/ListItem.js index 9c38e12e9..00c484c6e 100644 --- a/frontend/app/components/Client/CustomFields/ListItem.js +++ b/frontend/app/components/Client/CustomFields/ListItem.js @@ -1,6 +1,7 @@ import React from 'react'; import cn from 'classnames'; -import { Button } from 'UI'; +import { Icon } from 'UI'; +import { Button } from 'antd'; import styles from './listItem.module.css'; const ListItem = ({ field, onEdit, disabled }) => { @@ -17,7 +18,7 @@ const ListItem = ({ field, onEdit, disabled }) => { > {field.key}
-
); diff --git a/frontend/app/components/Client/Integrations/IntegrationForm.tsx b/frontend/app/components/Client/Integrations/IntegrationForm.tsx index 250d5fc08..cdb589429 100644 --- a/frontend/app/components/Client/Integrations/IntegrationForm.tsx +++ b/frontend/app/components/Client/Integrations/IntegrationForm.tsx @@ -3,7 +3,8 @@ import React from 'react'; import { useStore } from 'App/mstore'; import { namedStore } from 'App/mstore/integrationsStore'; -import { Button, Checkbox, Form, Input, Loader } from 'UI'; +import { Checkbox, Form, Input, Loader } from 'UI'; +import { Button } from 'antd' import { toast } from 'react-toastify'; function IntegrationForm(props: any) { @@ -97,7 +98,7 @@ function IntegrationForm(props: any) { onClick={save} disabled={!config?.validate()} loading={loading} - variant="primary" + type="primary" className="float-left mr-2" > {config?.exists() ? 'Update' : 'Add'} diff --git a/frontend/app/components/Client/Integrations/SlackAddForm/SlackAddForm.js b/frontend/app/components/Client/Integrations/SlackAddForm/SlackAddForm.js index b8cdc1981..79feddbc3 100644 --- a/frontend/app/components/Client/Integrations/SlackAddForm/SlackAddForm.js +++ b/frontend/app/components/Client/Integrations/SlackAddForm/SlackAddForm.js @@ -1,6 +1,6 @@ import React from 'react'; -import { Form, Input, Button, Message } from 'UI'; -import { confirm } from 'UI'; +import { Form, Input, Message, confirm } from 'UI'; +import { Button } from 'antd' import { observer } from 'mobx-react-lite' import { useStore } from 'App/mstore' @@ -73,7 +73,7 @@ function SlackAddForm(props) { onClick={save} disabled={!instance.validate()} loading={saving} - variant="primary" + type="primary" className="float-left mr-2" > {instance.exists() ? 'Update' : 'Add'} diff --git a/frontend/app/components/Client/Integrations/SlackForm.tsx b/frontend/app/components/Client/Integrations/SlackForm.tsx index 43a720da4..4c7e97209 100644 --- a/frontend/app/components/Client/Integrations/SlackForm.tsx +++ b/frontend/app/components/Client/Integrations/SlackForm.tsx @@ -1,7 +1,8 @@ import React, { useEffect } from 'react'; import SlackChannelList from './SlackChannelList/SlackChannelList'; import SlackAddForm from './SlackAddForm'; -import { Button } from 'UI'; +import { Icon } from 'UI'; +import { Button } from 'antd'; import { observer } from 'mobx-react-lite' import { useStore } from 'App/mstore' @@ -34,7 +35,7 @@ const SlackForm = () => {

Slack

-
diff --git a/frontend/app/components/Client/Integrations/Teams/TeamsAddForm.tsx b/frontend/app/components/Client/Integrations/Teams/TeamsAddForm.tsx index 0f4b2fb1d..9341b08ef 100644 --- a/frontend/app/components/Client/Integrations/Teams/TeamsAddForm.tsx +++ b/frontend/app/components/Client/Integrations/Teams/TeamsAddForm.tsx @@ -2,8 +2,8 @@ import { observer } from 'mobx-react-lite'; import React from 'react'; import { useStore } from 'App/mstore'; -import { Button, Form, Input, Message } from 'UI'; -import { confirm } from 'UI'; +import { confirm, Form, Input, Message } from 'UI'; +import { Button } from 'antd' interface Props { onClose: () => void; @@ -83,7 +83,7 @@ function TeamsAddForm({ onClose }: Props) { onClick={save} disabled={!instance?.validate()} loading={saving} - variant="primary" + type="primary" className="float-left mr-2" > {instance?.exists() ? 'Update' : 'Add'} diff --git a/frontend/app/components/Client/Integrations/Teams/index.tsx b/frontend/app/components/Client/Integrations/Teams/index.tsx index b85a4f010..21ffec387 100644 --- a/frontend/app/components/Client/Integrations/Teams/index.tsx +++ b/frontend/app/components/Client/Integrations/Teams/index.tsx @@ -1,10 +1,11 @@ import React, { useEffect } from 'react'; -import TeamsChannelList from './TeamsChannelList'; import { useStore } from 'App/mstore'; import { observer } from 'mobx-react-lite'; +import { Icon } from 'UI'; +import { Button } from 'antd' +import TeamsChannelList from './TeamsChannelList'; import TeamsAddForm from './TeamsAddForm'; -import { Button } from 'UI'; const MSTeams = () => { const { integrationsStore } = useStore(); @@ -35,7 +36,7 @@ const MSTeams = () => {

Microsoft Teams

-
diff --git a/frontend/app/components/Client/Notifications/Notifications.tsx b/frontend/app/components/Client/Notifications/Notifications.tsx index 25941db52..0a2d12b23 100644 --- a/frontend/app/components/Client/Notifications/Notifications.tsx +++ b/frontend/app/components/Client/Notifications/Notifications.tsx @@ -1,7 +1,7 @@ import React, { useEffect } from 'react'; import cn from 'classnames'; import stl from './notifications.module.css'; -import { Toggler } from 'UI'; +import { Switch } from 'antd' import { useStore } from "App/mstore"; import { observer } from 'mobx-react-lite' import withPageTitle from 'HOCs/withPageTitle'; @@ -25,12 +25,13 @@ function Notifications() {
Weekly project summary
Receive weekly report for each project on email.
- + + {weeklyReportStore.weeklyReport ? 'Yes' : 'No'} +
); diff --git a/frontend/app/components/Client/ProfileSettings/ChangePassword.tsx b/frontend/app/components/Client/ProfileSettings/ChangePassword.tsx index ce3eaeb38..207525f34 100644 --- a/frontend/app/components/Client/ProfileSettings/ChangePassword.tsx +++ b/frontend/app/components/Client/ProfileSettings/ChangePassword.tsx @@ -1,5 +1,6 @@ import React, { useState, useCallback } from 'react'; -import { Button, Message, Form, Input } from 'UI'; +import { Message, Form, Input } from 'UI'; +import { Button } from 'antd' import styles from './profileSettings.module.css'; import { validatePassword } from 'App/validate'; import { PASSWORD_POLICY } from 'App/constants'; @@ -121,7 +122,7 @@ const ChangePassword = () => { {PASSWORD_POLICY}
- +
); }; diff --git a/frontend/app/components/Client/ProfileSettings/Settings.js b/frontend/app/components/Client/ProfileSettings/Settings.js index 2852fd796..290f8b0f3 100644 --- a/frontend/app/components/Client/ProfileSettings/Settings.js +++ b/frontend/app/components/Client/ProfileSettings/Settings.js @@ -1,5 +1,6 @@ import React from 'react'; -import { Button, Input, Form } from 'UI'; +import { Input, Form } from 'UI'; +import { Button } from 'antd' import styles from './profileSettings.module.css'; import { observer } from 'mobx-react-lite'; import { useStore } from 'App/mstore'; @@ -61,7 +62,7 @@ function Settings() { /> - diff --git a/frontend/app/components/Client/ProfileSettings/TenantKey.js b/frontend/app/components/Client/ProfileSettings/TenantKey.js index 7cd4aece5..937e59b42 100644 --- a/frontend/app/components/Client/ProfileSettings/TenantKey.js +++ b/frontend/app/components/Client/ProfileSettings/TenantKey.js @@ -1,6 +1,7 @@ import React from 'react'; import copy from 'copy-to-clipboard'; -import { Form, Input, Button } from "UI"; +import { Form, Input } from "UI"; +import { Button } from 'antd'; import { observer } from 'mobx-react-lite'; import { useStore } from 'App/mstore'; @@ -29,8 +30,7 @@ function TenantKey() { value={ tenantKey } leadingButton={ diff --git a/frontend/app/components/Client/Roles/components/RoleForm/RoleForm.tsx b/frontend/app/components/Client/Roles/components/RoleForm/RoleForm.tsx index 835e677d0..d952f441a 100644 --- a/frontend/app/components/Client/Roles/components/RoleForm/RoleForm.tsx +++ b/frontend/app/components/Client/Roles/components/RoleForm/RoleForm.tsx @@ -2,10 +2,10 @@ import { observer } from 'mobx-react-lite'; import React, { useEffect, useRef } from 'react'; import { useStore } from 'App/mstore'; -import { Button, Checkbox, Form, Icon, Input } from 'UI'; +import { Checkbox, Form, Icon, Input } from 'UI'; import stl from './roleForm.module.css'; -import { Select } from 'antd'; +import { Select, Button } from 'antd'; import { SelectProps } from 'antd/es/select'; interface Props { @@ -220,7 +220,7 @@ const RoleForm = (props: Props) => { onClick={_save} disabled={!role.validate} loading={saving} - variant="primary" + type="primary" className="float-left mr-2" > {role.exists() ? 'Update' : 'Add'} @@ -228,7 +228,7 @@ const RoleForm = (props: Props) => { {role.exists() && } {role.exists() && ( - )} diff --git a/frontend/app/components/Client/Roles/components/RoleItem/RoleItem.tsx b/frontend/app/components/Client/Roles/components/RoleItem/RoleItem.tsx index c84d30966..429100e30 100644 --- a/frontend/app/components/Client/Roles/components/RoleItem/RoleItem.tsx +++ b/frontend/app/components/Client/Roles/components/RoleItem/RoleItem.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import { Icon, Link, Button } from 'UI'; +import { Icon, Link } from 'UI'; +import { Button } from 'antd' import stl from './roleItem.module.css'; import cn from 'classnames'; import { CLIENT_TABS, client as clientRoute } from 'App/routes'; @@ -46,7 +47,7 @@ function RoleItem({ role, editHandler, isAdmin, permissions, projects }: Props)
{isAdmin && !!editHandler && ( -
diff --git a/frontend/app/components/Client/Sites/AddProjectButton/AddProjectButton.tsx b/frontend/app/components/Client/Sites/AddProjectButton/AddProjectButton.tsx index ea8ca522a..b0e8fd52f 100644 --- a/frontend/app/components/Client/Sites/AddProjectButton/AddProjectButton.tsx +++ b/frontend/app/components/Client/Sites/AddProjectButton/AddProjectButton.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import { Tooltip, Button } from 'UI'; +import { Tooltip } from 'UI'; +import { Button } from 'antd' import { useStore } from 'App/mstore'; import { observer } from 'mobx-react-lite'; import { useModal } from 'App/components/Modal'; @@ -24,7 +25,7 @@ function AddProjectButton({ isAdmin = false }: any) { title={`${!isAdmin ? PERMISSION_WARNING : !canAddProject ? LIMIT_WARNING : 'Add a Project'}`} disabled={isAdmin || canAddProject} > - diff --git a/frontend/app/components/Client/Sites/BlockedIps.js b/frontend/app/components/Client/Sites/BlockedIps.js deleted file mode 100644 index 98f6acfde..000000000 --- a/frontend/app/components/Client/Sites/BlockedIps.js +++ /dev/null @@ -1,31 +0,0 @@ -import React from 'react'; -import { Input, Button, Icon } from 'UI'; -import styles from './blockedIps.module.css'; - -class BlockedIps extends React.PureComponent { - render() { - return ( -
-

{ 'Block IP' }

-
- -
- - -
- -
-
-
{ '192.128.2.1' }
-
- -
-
-
-
-
- ); - } -} - -export default BlockedIps; diff --git a/frontend/app/components/Client/Sites/GDPRForm.js b/frontend/app/components/Client/Sites/GDPRForm.js index fa54f73be..0a35f7399 100644 --- a/frontend/app/components/Client/Sites/GDPRForm.js +++ b/frontend/app/components/Client/Sites/GDPRForm.js @@ -1,7 +1,8 @@ import React from 'react'; import { observer } from 'mobx-react-lite'; import { useStore } from "App/mstore"; -import { Form, Button, Input, Icon } from 'UI'; +import { Form, Input, Icon } from 'UI'; +import { Button } from 'antd' import { validateNumber } from 'App/validate'; import styles from './siteForm.module.css'; import Select from 'Shared/Select'; @@ -115,12 +116,13 @@ function GDPRForm(props) {
+
) diff --git a/frontend/app/components/Client/Sites/InstallButton/InstallButton.tsx b/frontend/app/components/Client/Sites/InstallButton/InstallButton.tsx index da1a2fb44..f3ce8b8df 100644 --- a/frontend/app/components/Client/Sites/InstallButton/InstallButton.tsx +++ b/frontend/app/components/Client/Sites/InstallButton/InstallButton.tsx @@ -1,7 +1,7 @@ import { useModal } from 'App/components/Modal'; import React from 'react'; import TrackingCodeModal from 'Shared/TrackingCodeModal'; -import { Button } from 'UI'; +import { Button } from 'antd'; interface Props { site: any; @@ -16,7 +16,7 @@ function InstallButton(props: Props) { ); }; return ( - ); diff --git a/frontend/app/components/Client/Sites/NewSiteForm.tsx b/frontend/app/components/Client/Sites/NewSiteForm.tsx index fdb380e75..6445fc700 100644 --- a/frontend/app/components/Client/Sites/NewSiteForm.tsx +++ b/frontend/app/components/Client/Sites/NewSiteForm.tsx @@ -3,8 +3,8 @@ import React, { ChangeEvent, FormEvent, useEffect, useState } from 'react'; import { RouteComponentProps, withRouter } from 'react-router-dom'; import { toast } from 'react-toastify'; import { useStore } from 'App/mstore'; -import { Button, Form, Icon, Input } from 'UI'; -import { confirm } from 'UI'; +import { confirm, Form, Icon, Input } from 'UI'; +import { Button } from 'antd' import { observer } from 'mobx-react-lite'; import styles from './siteForm.module.css'; @@ -141,8 +141,8 @@ const NewSiteForm = ({ location: { pathname }, onClose }: Props) => {
{site.exists() && (
- {project.conditionsCount > 0 ? ( diff --git a/frontend/app/components/Client/Users/components/UserForm/UserForm.tsx b/frontend/app/components/Client/Users/components/UserForm/UserForm.tsx index 2c1ee6e2c..dd495a2c8 100644 --- a/frontend/app/components/Client/Users/components/UserForm/UserForm.tsx +++ b/frontend/app/components/Client/Users/components/UserForm/UserForm.tsx @@ -5,8 +5,8 @@ import React from 'react'; import { useModal } from 'App/components/Modal'; import { useStore } from 'App/mstore'; -import { Button, CopyButton, Form, Icon, Input } from 'UI'; -import { confirm } from 'UI'; +import { confirm, CopyButton, Form, Icon, Input } from 'UI'; +import { Button } from 'antd' import Select from 'Shared/Select'; @@ -139,22 +139,20 @@ function UserForm() { onClick={onSave} disabled={!user.valid(isEnterprise) || isSaving} loading={isSaving} - variant="primary" + type="primary" className="float-left mr-2" > {user.exists() ? 'Update' : 'Invite'} {user.exists() && }
-
- -
+ {!user.exists() ? null : +
+ +
+ } {!user.isJoined && user.invitationLink && ( diff --git a/frontend/app/components/Client/Users/components/UserListItem/UserListItem.tsx b/frontend/app/components/Client/Users/components/UserListItem/UserListItem.tsx index c83aa439d..338d2e04b 100644 --- a/frontend/app/components/Client/Users/components/UserListItem/UserListItem.tsx +++ b/frontend/app/components/Client/Users/components/UserListItem/UserListItem.tsx @@ -1,6 +1,7 @@ //@ts-nocheck import React from 'react'; -import { Button, Tooltip } from 'UI'; +import { Tooltip, Icon } from 'UI'; +import { Button } from 'antd' import { checkForRecent } from 'App/date'; import cn from 'classnames'; @@ -79,9 +80,8 @@ function UserListItem(props: Props) { {!user.isJoined && user.invitationLink && !user.isExpiredInvite && ( diff --git a/frontend/app/components/Dashboard/components/Alerts/AlertForm/BottomButtons.tsx b/frontend/app/components/Dashboard/components/Alerts/AlertForm/BottomButtons.tsx index 9a5e716f0..5dbb460bd 100644 --- a/frontend/app/components/Dashboard/components/Alerts/AlertForm/BottomButtons.tsx +++ b/frontend/app/components/Dashboard/components/Alerts/AlertForm/BottomButtons.tsx @@ -1,5 +1,6 @@ import React from 'react' -import { Button, Icon } from 'UI' +import { Icon } from 'UI' +import { Button } from 'antd' interface IBottomButtons { loading: boolean @@ -14,8 +15,7 @@ function BottomButtons({ loading, instance, deleting, onDelete }: IBottomButtons
- {hasFilters && } - + {hasFilters && } +
diff --git a/frontend/app/components/Dashboard/components/CardUserList/CardUserList.tsx b/frontend/app/components/Dashboard/components/CardUserList/CardUserList.tsx index e6d7a1a4d..842184f2e 100644 --- a/frontend/app/components/Dashboard/components/CardUserList/CardUserList.tsx +++ b/frontend/app/components/Dashboard/components/CardUserList/CardUserList.tsx @@ -2,7 +2,8 @@ import { useModal } from 'App/components/Modal'; import { observer } from 'mobx-react-lite'; import React, { useEffect, useState } from 'react'; import { RouteComponentProps, withRouter } from 'react-router'; -import { Loader, Pagination, Button } from 'UI'; +import { Loader, Pagination } from 'UI'; +import { Button } from 'antd' import SessionsModal from './SessionsModal'; import CardUserItem from './CardUserItem'; import { useStore } from 'App/mstore'; @@ -45,7 +46,7 @@ function CardUserList(props: RouteComponentProps) {

Returning users between

- +
diff --git a/frontend/app/components/Dashboard/components/DashboardModal/DashboardModal.tsx b/frontend/app/components/Dashboard/components/DashboardModal/DashboardModal.tsx index 659b4a604..20429e74a 100644 --- a/frontend/app/components/Dashboard/components/DashboardModal/DashboardModal.tsx +++ b/frontend/app/components/Dashboard/components/DashboardModal/DashboardModal.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { useObserver } from 'mobx-react-lite'; import DashboardMetricSelection from '../DashboardMetricSelection'; import DashboardForm from '../DashboardForm'; -import { Button } from 'UI'; +import { Button } from 'antd'; import { withRouter, RouteComponentProps } from 'react-router-dom'; import { useStore } from 'App/mstore'; import { useModal } from 'App/components/Modal'; @@ -67,7 +67,7 @@ function DashboardModal(props: Props) {
- -
- {TAGS.map((tag) => ( - addTag(tag)} - key={tag} - className='cursor-pointer rounded-lg hover:bg-indigo-50' - color={tagActive(tag) ? tagProps[tag] : undefined} - bordered={false} - - > -
- {tagActive(tag) ? ( - - ) : null} - {tag} -
- - ))} -
- -
setPublic(!isPublic)} - > - -
Visible to team members
-
- {slackChannelsOptions.length > 1 ? ( -
-
setSlack(!useSlack)} - > - - Share via Slack -
- - {useSlack && ( -
- -
- )} -
- ) : null} - -
- - -
- - ); -} - -export default observer(CreateNote); diff --git a/frontend/app/components/Session_/Player/Controls/components/PlayingTime.tsx b/frontend/app/components/Session_/Player/Controls/components/PlayingTime.tsx index f666a43a2..393cf3b3b 100644 --- a/frontend/app/components/Session_/Player/Controls/components/PlayingTime.tsx +++ b/frontend/app/components/Session_/Player/Controls/components/PlayingTime.tsx @@ -31,6 +31,7 @@ function PlayingTime({ timeMode, setTimeMode, startedAt, sessionTz }: Props) { distance={20} render={({ close }) => (
, }, { type: 'divider' }, - { - key: ItemKey.AddNote, - label: 'Add Note', - icon: , - }, + // { + // key: ItemKey.AddNote, + // label: 'Add Note', + // icon: , + // }, { key: ItemKey.CopySessionUrl, label: 'Copy Session URL', @@ -131,16 +130,16 @@ function Overlay({ nextId, isClickmap }: Props) { case ItemKey.State: toggleBottomBlock(STORAGE); break; - case ItemKey.AddNote: - showModal( - , - { right: true, width: 380 } - ); - break; + // case ItemKey.AddNote: + // showModal( + // , + // { right: true, width: 380 } + // ); + // break; case ItemKey.CopySessionUrl: copy(window.location.origin + window.location.pathname); toast.success('Session URL copied to clipboard'); diff --git a/frontend/app/components/Session_/Player/Overlay/AutoplayTimer.tsx b/frontend/app/components/Session_/Player/Overlay/AutoplayTimer.tsx index a4180d056..e780a4820 100644 --- a/frontend/app/components/Session_/Player/Overlay/AutoplayTimer.tsx +++ b/frontend/app/components/Session_/Player/Overlay/AutoplayTimer.tsx @@ -2,7 +2,8 @@ import React, { useEffect, useState } from 'react'; import cn from 'classnames'; import { observer } from 'mobx-react-lite'; import { withRouter } from 'react-router-dom'; -import { Button, Link } from 'UI'; +import { Link } from 'UI'; +import { Button } from 'antd' import { session as sessionRoute, withSiteId } from 'App/routes'; import stl from './AutoplayTimer.module.css'; import clsOv from './overlay.module.css'; @@ -50,12 +51,12 @@ function AutoplayTimer({ history }: any) {
-
- +
diff --git a/frontend/app/components/Session_/ScreenRecorder/ScreenRecorder.tsx b/frontend/app/components/Session_/ScreenRecorder/ScreenRecorder.tsx index fbfcce9ae..6df8e775a 100644 --- a/frontend/app/components/Session_/ScreenRecorder/ScreenRecorder.tsx +++ b/frontend/app/components/Session_/ScreenRecorder/ScreenRecorder.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { screenRecorder } from 'App/utils/screenRecorder'; -import { Tooltip } from 'antd' -import { Button } from 'UI'; +import { Tooltip, Button } from 'antd' +import { Icon } from 'UI'; import { SessionRecordingStatus } from 'Player'; let stopRecorderCb: () => void; import { recordingsService } from 'App/services'; @@ -116,7 +116,7 @@ function ScreenRecorder() { - @@ -127,8 +127,9 @@ function ScreenRecorder() { return (
diff --git a/frontend/app/components/Session_/components/HeaderMenu.tsx b/frontend/app/components/Session_/components/HeaderMenu.tsx deleted file mode 100644 index 621334cf7..000000000 --- a/frontend/app/components/Session_/components/HeaderMenu.tsx +++ /dev/null @@ -1,78 +0,0 @@ -import React from 'react'; -import { Button, Icon } from 'UI'; -import styles from './menu.module.css'; -import cn from 'classnames'; -import OutsideClickDetectingDiv from 'Shared/OutsideClickDetectingDiv'; - -interface MenuItem { - key: number; - autoclose?: boolean; - component?: React.ReactElement; -} - -interface Props { - items: MenuItem[]; - useSc?: boolean; -} - -export default class ItemMenu extends React.PureComponent { - state = { - displayed: false, - }; - - handleEsc = (e: KeyboardEvent) => e.key === 'Escape' && this.state.displayed && this.toggleMenu(); - handleSc = (e: KeyboardEvent) => e.key === 'M' && e.shiftKey ? this.toggleMenu() : null; - - componentDidMount() { - document.addEventListener('keydown', this.handleEsc, false); - if (this.props.useSc) { - document.addEventListener('keydown', this.handleSc, false) - } - } - componentWillUnmount() { - document.removeEventListener('keydown', this.handleEsc, false); - if (this.props.useSc) { - document.removeEventListener('keydown', this.handleSc, false) - } - } - - toggleMenu = () => { - this.setState({ displayed: !this.state.displayed }); - }; - - closeMenu = () => { - this.setState({ displayed: false }); - }; - - render() { - const { items } = this.props; - const { displayed } = this.state; - - return ( -
- - -
- {items.map((item) => - item.component ? ( -
- {item.component} -
- ) : null - )} -
- -
- ); - } -} diff --git a/frontend/app/components/Session_/components/NotePopup.tsx b/frontend/app/components/Session_/components/NotePopup.tsx deleted file mode 100644 index 5f38f1ba3..000000000 --- a/frontend/app/components/Session_/components/NotePopup.tsx +++ /dev/null @@ -1,41 +0,0 @@ -import CreateNote from 'Components/Session_/Player/Controls/components/CreateNote'; -import React from 'react'; -import { observer } from 'mobx-react-lite'; -import { useStore } from 'App/mstore'; -import { PlayerContext } from 'App/components/Session/playerContext'; -import { Button, Tooltip } from 'antd'; -import { MessageOutlined } from '@ant-design/icons'; -import { useModal } from 'App/components/Modal'; - -function NotePopup() { - const { sessionStore } = useStore(); - const tooltipActive = sessionStore.createNoteTooltip.isVisible; - const { player, store } = React.useContext(PlayerContext); - const { showModal, hideModal } = useModal(); - const toggleNotePopup = () => { - if (tooltipActive) return; - player.pause(); - showModal( - , - { - right: true, - width: 380, - } - ); - }; - - return ( - - - - ); -} - -export default observer(NotePopup) diff --git a/frontend/app/components/Signup/SignupForm/SignupForm.tsx b/frontend/app/components/Signup/SignupForm/SignupForm.tsx index 36f0f761a..f9d91201b 100644 --- a/frontend/app/components/Signup/SignupForm/SignupForm.tsx +++ b/frontend/app/components/Signup/SignupForm/SignupForm.tsx @@ -15,7 +15,8 @@ import { SITE_ID_STORAGE_KEY } from 'App/constants/storageKeys'; import { useStore } from 'App/mstore'; import { login } from 'App/routes'; import { validatePassword } from 'App/validate'; -import { Button, Form, Input, Link } from 'UI'; +import { Form, Input, Link } from 'UI'; +import { Button } from 'antd' import Select from 'Shared/Select'; @@ -221,8 +222,8 @@ const SignupForm = () => { ) : null} -
- - - ); -} - -export default withPageTitle('Password Change - OpenReplay')( - observer(UpdatePassword) -); diff --git a/frontend/app/components/UpdatePassword/updatePassword.module.css b/frontend/app/components/UpdatePassword/updatePassword.module.css deleted file mode 100644 index 386a99e19..000000000 --- a/frontend/app/components/UpdatePassword/updatePassword.module.css +++ /dev/null @@ -1,127 +0,0 @@ -@import 'icons.css'; - -.form { - position: absolute; - top: 50%; - margin-top: -300px; - width: 520px; - left: 50%; - margin-left: -260px; - - & .passwordPolicy { - color: $gray-medium; - padding: 5px 0 10px; - font-size: 13px; - } - - & form { - padding: 10px 70px; - border: solid 2px $gray-light; - border-radius: 2px; - background-color: white; - } - & h2 { - text-align: center; - font-size: 20px; - color: #555555; - margin: 35px 0; - font-weight: 300; - } -} - -.formFooter { - text-align: center; - padding: 15px 0; -} - -.links { - display: flex; - align-items: center; - justify-content: center; - padding: 10px 0; - margin-top: 20px; - - & .divider { - width: 1px; - height: 12px; - background-color: $gray-medium; - margin: 0 5px; - } -} - -.logo { - background-image: svg-load('logo.svg'); - background-repeat: no-repeat; - background-size: contain; - background-position: center center; - height: 50px; - margin-bottom: 20px; -} - - -.email, .password { - display: block; - margin-top: 15px; - width: 100%; - height: 45px; - line-height: 45px; - border: $gray-light solid 1px; - border-radius: 3px; - font-size: 14px; - padding: 0 10px; - transition: all 0.2s; - - &::placeholder { - color: #AAA; - } - - &:focus { - border-color: $teal; - transition: all 0.2s; - } -} - -.errors { - border-radius: 5px; - width: 400px; - margin: auto; - border: 2px solid $red; - padding: 15px; - background-color: $white; -} - -.submit { - display: block; - border-radius: 5px; - background: $teal; - width: 135px; - height: 45px; - margin: 20px auto; - color: $white; - font-size: 16px; - cursor: pointer; -} - -.inputWithIcon { - position: relative; - - & input { - padding-left: 45px; - } -} - -@define-mixin inputIcon $name { - position: absolute; - left: 15px; - top: calc(50% - 8px); - @mixin icon $name, $gray-medium, 15px; -} - -.inputIconUser { - @mixin inputIcon user-alt; -} - -.inputIconPassword { - @mixin inputIcon lock-alt; -} - diff --git a/frontend/app/components/shared/AlertTriggersModal/AlertTriggersModal.tsx b/frontend/app/components/shared/AlertTriggersModal/AlertTriggersModal.tsx index 3e73b8dad..6815680e4 100644 --- a/frontend/app/components/shared/AlertTriggersModal/AlertTriggersModal.tsx +++ b/frontend/app/components/shared/AlertTriggersModal/AlertTriggersModal.tsx @@ -1,5 +1,6 @@ import React, { useEffect } from 'react'; -import { Button, NoContent, Loader } from 'UI'; +import { NoContent, Loader } from 'UI'; +import { Button } from 'antd' import cn from 'classnames'; import AnimatedSVG, { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG'; import ListItem from './ListItem' @@ -37,7 +38,6 @@ function AlertTriggersModal(props: Props) { { count > 0 && (
diff --git a/frontend/app/components/shared/DevTools/TimeTable/TimeTable.tsx b/frontend/app/components/shared/DevTools/TimeTable/TimeTable.tsx index 47bbf8b78..d4729ecb1 100644 --- a/frontend/app/components/shared/DevTools/TimeTable/TimeTable.tsx +++ b/frontend/app/components/shared/DevTools/TimeTable/TimeTable.tsx @@ -2,7 +2,8 @@ import React from 'react'; import { VList, VListHandle } from 'virtua'; import cn from 'classnames'; import { Duration } from 'luxon'; -import { NoContent, Button } from 'UI'; +import { NoContent, Icon } from 'UI'; +import { Button } from 'antd' import { percentOf } from 'App/utils'; import BarRow from './BarRow'; @@ -214,21 +215,13 @@ function TimeTable(props: Props) { {navigation && (
diff --git a/frontend/app/components/shared/DocLink/DocLink.js b/frontend/app/components/shared/DocLink/DocLink.js index 3647e79e5..c3ae25f11 100644 --- a/frontend/app/components/shared/DocLink/DocLink.js +++ b/frontend/app/components/shared/DocLink/DocLink.js @@ -1,5 +1,6 @@ import React from 'react' -import { Button, Icon } from 'UI' +import { Icon } from 'UI' +import { Button } from 'antd' export default function DocLink({ className = '', url, label }) { const openLink = () => { @@ -8,7 +9,7 @@ export default function DocLink({ className = '', url, label }) { return (
- diff --git a/frontend/app/components/shared/ImageViewer/ImageViewer.js b/frontend/app/components/shared/ImageViewer/ImageViewer.js deleted file mode 100644 index 28d9aadfc..000000000 --- a/frontend/app/components/shared/ImageViewer/ImageViewer.js +++ /dev/null @@ -1,30 +0,0 @@ -import React, { useState } from 'react' -import { Button } from 'UI'; - -export default function ImageViewer( - { source, activeIndex, onClose } -) { - const [currentIndex, setCurrentIndex] = useState(activeIndex) - const onPrevClick = () => { - setCurrentIndex(currentIndex - 1); - } - const onNextClick = () => { - setCurrentIndex(currentIndex + 1); - } - return ( -
-
- - - -
- -
- ) -} diff --git a/frontend/app/components/shared/ImageViewer/index.js b/frontend/app/components/shared/ImageViewer/index.js deleted file mode 100644 index 86ec5cbec..000000000 --- a/frontend/app/components/shared/ImageViewer/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ImageViewer'; \ No newline at end of file diff --git a/frontend/app/components/shared/IntegrateSlackButton/IntegrateSlackButton.js b/frontend/app/components/shared/IntegrateSlackButton/IntegrateSlackButton.js index fa806a0d2..bc1900336 100644 --- a/frontend/app/components/shared/IntegrateSlackButton/IntegrateSlackButton.js +++ b/frontend/app/components/shared/IntegrateSlackButton/IntegrateSlackButton.js @@ -1,5 +1,6 @@ import React from 'react' -import { Button, Icon } from 'UI' +import { Icon } from 'UI' +import { Button } from 'antd' import { CLIENT_TABS, client as clientRoute } from 'App/routes'; import { withRouter } from 'react-router-dom'; @@ -14,7 +15,7 @@ function IntegrateSlackTeamsButton({ history }) {
{savedSearch.exists() && ( - )} diff --git a/frontend/app/components/shared/SessionItem/MetaMoreButton/MetaMoreButton.tsx b/frontend/app/components/shared/SessionItem/MetaMoreButton/MetaMoreButton.tsx index 9253b2de9..c8bdaff61 100644 --- a/frontend/app/components/shared/SessionItem/MetaMoreButton/MetaMoreButton.tsx +++ b/frontend/app/components/shared/SessionItem/MetaMoreButton/MetaMoreButton.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import { Popover, Button } from 'UI'; +import { Popover } from 'UI'; +import { Button } from 'antd' import MetaItem from '../MetaItem'; interface Props { @@ -23,7 +24,7 @@ export default function MetaMoreButton(props: Props) { placement="bottom" >
- +
); diff --git a/frontend/app/components/shared/SessionSettings/components/ConditionalRecordingSettings.tsx b/frontend/app/components/shared/SessionSettings/components/ConditionalRecordingSettings.tsx index 90e9dc2df..a6a710831 100644 --- a/frontend/app/components/shared/SessionSettings/components/ConditionalRecordingSettings.tsx +++ b/frontend/app/components/shared/SessionSettings/components/ConditionalRecordingSettings.tsx @@ -1,7 +1,8 @@ import { Conditions } from 'App/mstore/types/FeatureFlag'; import React from 'react'; import ConditionSet from 'Shared/ConditionSet'; -import { Button } from 'UI'; +import { Icon } from 'UI'; +import { Button } from 'antd'; import { nonConditionalFlagFilters } from 'Types/filter/newFilter'; function ConditionalRecordingSettings({ @@ -43,7 +44,7 @@ function ConditionalRecordingSettings({ />
matching -
diff --git a/frontend/app/components/shared/SessionSettings/components/DefaultTimezone.tsx b/frontend/app/components/shared/SessionSettings/components/DefaultTimezone.tsx index 6d30059c2..a03997648 100644 --- a/frontend/app/components/shared/SessionSettings/components/DefaultTimezone.tsx +++ b/frontend/app/components/shared/SessionSettings/components/DefaultTimezone.tsx @@ -5,8 +5,8 @@ import { toast } from 'react-toastify'; import { useStore } from 'App/mstore'; import { Timezone } from 'App/mstore/types/sessionSettings'; -import { Button, Icon } from 'UI'; - +import { Icon } from 'UI'; +import { Button } from 'antd' import Select from 'Shared/Select'; type TimezonesDropdown = Timezone[]; @@ -104,8 +104,7 @@ function DefaultTimezone() {
- +
diff --git a/frontend/app/components/shared/SessionsTabOverview/components/SessionList/SessionList.tsx b/frontend/app/components/shared/SessionsTabOverview/components/SessionList/SessionList.tsx index 2ede00e77..c6ecbf091 100644 --- a/frontend/app/components/shared/SessionsTabOverview/components/SessionList/SessionList.tsx +++ b/frontend/app/components/shared/SessionsTabOverview/components/SessionList/SessionList.tsx @@ -1,7 +1,8 @@ import React, { useEffect } from 'react'; import { FilterKey } from 'Types/filter/filterType'; import SessionItem from 'Shared/SessionItem'; -import { NoContent, Loader, Pagination, Button } from 'UI'; +import { NoContent, Loader, Pagination, Icon } from 'UI'; +import { Button } from 'antd' import { useLocation, withRouter } from 'react-router-dom'; import AnimatedSVG, { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG'; import { numberWithCommas } from 'App/utils'; @@ -188,10 +189,9 @@ function SessionList() { )} + )} { (focused || !selected) && ( diff --git a/frontend/app/components/ui/Avatar/Avatar.js b/frontend/app/components/ui/Avatar/Avatar.js index 536ee6a62..67a10c550 100644 --- a/frontend/app/components/ui/Avatar/Avatar.js +++ b/frontend/app/components/ui/Avatar/Avatar.js @@ -1,7 +1,8 @@ import React from 'react'; import cn from 'classnames'; import { avatarIconName } from 'App/iconNames'; -import { Icon, Tooltip } from 'UI'; +import { Icon } from 'UI'; +import { Tooltip } from 'antd' const Avatar = ({ isActive = false, @@ -13,7 +14,7 @@ const Avatar = ({ }) => { var iconName = avatarIconName(seed); return ( - +
{ const { className = '', label = '', ...rest } = props; return ( - + + {label} + ); }; diff --git a/frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx b/frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx index 9cd076295..c869a4d18 100644 --- a/frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx +++ b/frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx @@ -1,6 +1,7 @@ import React, { useState } from 'react'; import ErrorFrame from '../ErrorFrame/ErrorFrame'; -import { Button, Icon } from 'UI'; +import { Icon } from 'UI'; +import { Button } from 'antd' import { observer } from 'mobx-react-lite'; import { useStore } from 'App/mstore'; @@ -44,10 +45,10 @@ function ErrorDetails(props: Props) {

Stacktrace

- -
diff --git a/frontend/app/components/ui/HelpText/HelpText.tsx b/frontend/app/components/ui/HelpText/HelpText.tsx deleted file mode 100644 index 0bfdfdc5e..000000000 --- a/frontend/app/components/ui/HelpText/HelpText.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import React from 'react'; -import { Icon, Tooltip } from 'UI'; - -interface Props { - text: string; - className?: string; - position?: string; -} -export default function HelpText(props: Props) { - const { text, className = '', position = 'top center' } = props; - return ( -
- -
- -
- -
- ); -} diff --git a/frontend/app/components/ui/HelpText/index.ts b/frontend/app/components/ui/HelpText/index.ts deleted file mode 100644 index 0868cbffd..000000000 --- a/frontend/app/components/ui/HelpText/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './HelpText'; \ No newline at end of file diff --git a/frontend/app/components/ui/IconButton/IconButton.js b/frontend/app/components/ui/IconButton/IconButton.js index 2d24bd1f5..6e325a016 100644 --- a/frontend/app/components/ui/IconButton/IconButton.js +++ b/frontend/app/components/ui/IconButton/IconButton.js @@ -1,6 +1,7 @@ import React from 'react'; import cn from 'classnames'; -import { CircularLoader, Icon, Tooltip } from 'UI'; +import { Tooltip } from 'antd' +import { CircularLoader, Icon } from 'UI'; import stl from './iconButton.module.css'; const IconButton = React.forwardRef( diff --git a/frontend/app/components/ui/Input/Input.tsx b/frontend/app/components/ui/Input/Input.tsx index 9e93376c8..6bfb67853 100644 --- a/frontend/app/components/ui/Input/Input.tsx +++ b/frontend/app/components/ui/Input/Input.tsx @@ -1,6 +1,6 @@ import cn from 'classnames'; import React from 'react'; - +import { Input as AntInput } from 'antd' import { Icon } from 'UI'; interface Props { @@ -36,7 +36,7 @@ const Input = React.forwardRef((props: Props, ref: any) => { /> )} {type === 'textarea' ? ( -