diff --git a/frontend/.env.sample b/frontend/.env.sample index cbc846772..d7c4c8dc6 100644 --- a/frontend/.env.sample +++ b/frontend/.env.sample @@ -23,4 +23,4 @@ MINIO_SECRET_KEY = '' # APP and TRACKER VERSIONS VERSION = 1.20.0 -TRACKER_VERSION = '14.0.6' +TRACKER_VERSION = '14.0.13' diff --git a/frontend/app/components/Dashboard/Widgets/CardSessionsByList.tsx b/frontend/app/components/Dashboard/Widgets/CardSessionsByList.tsx index 9032dc917..5f2efe77d 100644 --- a/frontend/app/components/Dashboard/Widgets/CardSessionsByList.tsx +++ b/frontend/app/components/Dashboard/Widgets/CardSessionsByList.tsx @@ -2,7 +2,6 @@ import React, { useEffect } from 'react'; import { Avatar, List, Progress, Typography, Pagination } from 'antd'; import cn from 'classnames'; import { useStore } from '@/mstore'; -import { WEB_VITALS } from '@/constants/card'; import { observer } from 'mobx-react-lite'; import { metricService } from '@/services'; @@ -18,8 +17,7 @@ interface Props { function CardSessionsByList({ list, selected, paginated, onClickHandler = () => null, metric, total }: Props) { const { dashboardStore, metricStore, sessionStore } = useStore(); const drillDownPeriod = dashboardStore.drillDownPeriod; - const isOverviewWidget = metric?.metricType === WEB_VITALS; - const params = { density: isOverviewWidget ? 7 : 70 }; + const params = { density: 70 }; const metricParams = { ...params }; const [loading, setLoading] = React.useState(false); const data = paginated ? metric?.data[0]?.values : list; diff --git a/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/ExampleCards.tsx b/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/ExampleCards.tsx index c76b5a77c..83aa38c58 100644 --- a/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/ExampleCards.tsx +++ b/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/ExampleCards.tsx @@ -11,28 +11,20 @@ import { ERRORS, FUNNEL, INSIGHTS, - PERFORMANCE, TABLE, TIMESERIES, USER_PATH, - WEB_VITALS } from 'App/constants/card'; import { FilterKey } from 'Types/filter/filterType'; -import { Activity, BarChart, TableCellsMerge, SearchSlash, TrendingUp } from 'lucide-react'; -import WebVital from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/WebVital'; +import { BarChart, TrendingUp, SearchSlash } from 'lucide-react'; import ByIssues from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/SessionsBy/ByIssues'; import InsightsExample from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/InsightsExample'; import ByUser from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/SessionsBy/ByUser'; import BarChartCard from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/BarChart'; -import AreaChartCard from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/AreaChartCard'; import CallsWithErrorsExample from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/CallsWithErrorsExample'; -import SessionsPerBrowserExample - from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/SessionsPerBrowserExample'; import SlowestDomains from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/SessionsBy/SlowestDomains'; -import SpeedIndexByLocationExample - from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/SpeedIndexByLocationExample'; import HeatmapsExample from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/HeatmapsExample'; import ByReferrer from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/SessionsBy/ByRferrer'; import ByFetch from 'Components/Dashboard/components/DashboardList/NewDashModal/Examples/SessionsBy/ByFecth'; @@ -40,18 +32,14 @@ import TableOfErrors from 'Components/Dashboard/components/DashboardList/NewDash export const CARD_CATEGORY = { PRODUCT_ANALYTICS: 'product-analytics', - PERFORMANCE_MONITORING: 'performance-monitoring', WEB_ANALYTICS: 'web-analytics', ERROR_TRACKING: 'error-tracking', - WEB_VITALS: 'web-vitals' }; export const CARD_CATEGORIES = [ { key: CARD_CATEGORY.PRODUCT_ANALYTICS, label: 'Product Analytics', icon: TrendingUp, types: [USER_PATH, ERRORS] }, - { key: CARD_CATEGORY.PERFORMANCE_MONITORING, label: 'Performance Monitoring', icon: Activity, types: [TIMESERIES] }, { key: CARD_CATEGORY.WEB_ANALYTICS, label: 'Web Analytics', icon: BarChart, types: [TABLE] }, - { key: CARD_CATEGORY.ERROR_TRACKING, label: 'Errors Tracking', icon: SearchSlash, types: [WEB_VITALS] }, - { key: CARD_CATEGORY.WEB_VITALS, label: 'Web Vitals', icon: TableCellsMerge, types: [WEB_VITALS] } + { key: CARD_CATEGORY.ERROR_TRACKING, label: 'Errors Tracking', icon: SearchSlash, types: [] }, ]; export interface CardType { @@ -157,188 +145,6 @@ export const CARD_LIST: CardType[] = [ example: ByIssues }, - // Performance Monitoring - { - title: 'CPU Load', - key: FilterKey.CPU, - cardType: PERFORMANCE, - metricOf: FilterKey.CPU, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - label: 'CPU Load (%)', - namesMap: [ - 'Series 1' - ] - }, - example: AreaChartCard - }, - - { - title: 'Crashes', - key: FilterKey.CRASHES, - cardType: PERFORMANCE, - metricOf: FilterKey.CRASHES, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - namesMap: [ - 'Series 1' - ] - }, - example: AreaChartCard - }, - - { - title: 'Framerate', - key: FilterKey.FPS, - cardType: PERFORMANCE, - metricOf: FilterKey.FPS, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - label: 'Frames Per Second', - namesMap: [ - 'Series 1' - ] - }, - example: AreaChartCard - }, - - { - title: 'DOM Building Time', - key: FilterKey.PAGES_DOM_BUILD_TIME, - cardType: PERFORMANCE, - metricOf: FilterKey.PAGES_DOM_BUILD_TIME, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - label: 'DOM Build Time (ms)', - namesMap: [ - 'Series 1' - ] - }, - example: AreaChartCard - }, - - { - title: 'Memory Consumption', - key: FilterKey.MEMORY_CONSUMPTION, - cardType: PERFORMANCE, - metricOf: FilterKey.MEMORY_CONSUMPTION, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - label: 'JS Heap Size (MB)', - unit: 'mb', - namesMap: [ - 'Series 1' - ] - }, - example: AreaChartCard - }, - - { - title: 'Page Response Time', - key: FilterKey.PAGES_RESPONSE_TIME, - cardType: PERFORMANCE, - metricOf: FilterKey.PAGES_RESPONSE_TIME, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - label: 'Page Response Time (ms)', - namesMap: [ - 'Series 1' - ] - }, - example: AreaChartCard - }, - - { - title: 'Page Response Time Distribution', - key: FilterKey.PAGES_RESPONSE_TIME_DISTRIBUTION, - cardType: PERFORMANCE, - metricOf: FilterKey.PAGES_RESPONSE_TIME_DISTRIBUTION, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateStackedBarChartData(['Page Response Time (ms)']), - label: 'Number of Calls', - unit: 'ms', - namesMap: [ - 'Series 1' - ] - }, - example: BarChartCard - }, - - { - title: 'Sessions by Browser & Version', - key: FilterKey.SESSIONS_PER_BROWSER, - cardType: PERFORMANCE, - metricOf: FilterKey.SESSIONS_PER_BROWSER, - category: CARD_CATEGORIES[1].key, - data: generateRandomBarsData(), - example: SessionsPerBrowserExample - }, - - { - title: 'Slowest Domains', - key: FilterKey.SLOWEST_DOMAINS, - cardType: PERFORMANCE, - metricOf: FilterKey.SLOWEST_DOMAINS, - category: CARD_CATEGORIES[1].key, - // data: generateRandomBarsData(), - example: SlowestDomains - }, - - { - title: 'Speed Index by Location', - key: FilterKey.SPEED_LOCATION, - cardType: PERFORMANCE, - metricOf: FilterKey.SPEED_LOCATION, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - namesMap: [ - 'Series 1' - ] - }, - example: SpeedIndexByLocationExample - }, - - { - title: 'Time to Render', - key: FilterKey.TIME_TO_RENDER, - cardType: PERFORMANCE, - metricOf: FilterKey.TIME_TO_RENDER, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - label: 'Time to Render (ms)', - unit: 'ms', - namesMap: [ - 'Series 1' - ] - }, - example: AreaChartCard - }, - - { - title: 'Sessions Impacted by Slow Pages', - key: FilterKey.IMPACTED_SESSIONS_BY_SLOW_PAGES, - cardType: PERFORMANCE, - metricOf: FilterKey.IMPACTED_SESSIONS_BY_SLOW_PAGES, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateAreaData(), - label: 'Number of Sessions', - namesMap: [ - 'Series 1' - ] - }, - example: AreaChartCard - }, - // Web analytics { @@ -346,7 +152,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.USERID, cardType: TABLE, metricOf: FilterKey.USERID, - category: CARD_CATEGORIES[2].key, + category: CARD_CATEGORIES[1].key, example: ByUser }, @@ -355,7 +161,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.USER_BROWSER, cardType: TABLE, metricOf: FilterKey.USER_BROWSER, - category: CARD_CATEGORIES[2].key, + category: CARD_CATEGORIES[1].key, example: ByBrowser }, // { @@ -363,7 +169,7 @@ export const CARD_LIST: CardType[] = [ // key: TYPE.SESSIONS_BY_SYSTEM, // cardType: TABLE, // metricOf: FilterKey.USER_OS, - // category: CARD_CATEGORIES[2].key, + // category: CARD_CATEGORIES[1].key, // example: BySystem, // }, { @@ -371,7 +177,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.USER_COUNTRY, cardType: TABLE, metricOf: FilterKey.USER_COUNTRY, - category: CARD_CATEGORIES[2].key, + category: CARD_CATEGORIES[1].key, example: ByCountry }, @@ -380,7 +186,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.USER_DEVICE, cardType: TABLE, metricOf: FilterKey.USER_DEVICE, - category: CARD_CATEGORIES[2].key, + category: CARD_CATEGORIES[1].key, example: BySystem }, { @@ -388,7 +194,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.LOCATION, cardType: TABLE, metricOf: FilterKey.LOCATION, - category: CARD_CATEGORIES[2].key, + category: CARD_CATEGORIES[1].key, example: ByUrl }, @@ -397,7 +203,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.REFERRER, cardType: TABLE, metricOf: FilterKey.REFERRER, - category: CARD_CATEGORIES[2].key, + category: CARD_CATEGORIES[1].key, example: ByReferrer }, @@ -406,7 +212,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.FETCH, cardType: TABLE, metricOf: FilterKey.FETCH, - category: CARD_CATEGORIES[2].key, + category: CARD_CATEGORIES[1].key, example: ByFetch }, @@ -417,7 +223,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.ERRORS, cardType: TABLE, metricOf: FilterKey.ERRORS, - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, data: { chart: generateBarChartData(), hideLegend: true, @@ -432,7 +238,7 @@ export const CARD_LIST: CardType[] = [ key: INSIGHTS, cardType: INSIGHTS, metricOf: 'issueCategories', - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, width: 4, isEnterprise: true, example: InsightsExample @@ -442,7 +248,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.IMPACTED_SESSIONS_BY_JS_ERRORS, cardType: ERRORS, metricOf: FilterKey.IMPACTED_SESSIONS_BY_JS_ERRORS, - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, data: { chart: generateBarChartData(), hideLegend: true, @@ -455,7 +261,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.RESOURCES_BY_PARTY, cardType: ERRORS, metricOf: FilterKey.RESOURCES_BY_PARTY, - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, data: { chart: generateStackedBarChartData(['1st Party', '3rd Party']) }, @@ -466,16 +272,15 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.ERRORS_PER_DOMAINS, cardType: ERRORS, metricOf: FilterKey.ERRORS_PER_DOMAINS, - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, example: SlowestDomains - // data: generateRandomBarsData(), }, { title: 'Errors by Type', key: FilterKey.ERRORS_PER_TYPE, cardType: ERRORS, metricOf: FilterKey.ERRORS_PER_TYPE, - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, data: { chart: generateStackedBarChartData(['Integrations', '4xx', '5xx']) }, @@ -486,7 +291,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.CALLS_ERRORS, cardType: ERRORS, metricOf: FilterKey.CALLS_ERRORS, - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, width: 4, data: { chart: [ @@ -521,7 +326,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.DOMAINS_ERRORS_4XX, cardType: ERRORS, metricOf: FilterKey.DOMAINS_ERRORS_4XX, - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, data: { chart: generateTimeSeriesData(), label: 'Number of Errors', @@ -538,7 +343,7 @@ export const CARD_LIST: CardType[] = [ key: FilterKey.DOMAINS_ERRORS_5XX, cardType: ERRORS, metricOf: FilterKey.DOMAINS_ERRORS_5XX, - category: CARD_CATEGORIES[3].key, + category: CARD_CATEGORIES[2].key, data: { chart: generateTimeSeriesData(), label: 'Number of Errors', @@ -549,210 +354,8 @@ export const CARD_LIST: CardType[] = [ }, example: ExampleTrend }, - - - // Web vitals - { - title: 'Avg. CPU Load', - key: FilterKey.AVG_CPU, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_CPU, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - { - title: 'Avg. DOM Content Load Time', - key: FilterKey.AVG_DOM_CONTENT_LOADED, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_DOM_CONTENT_LOADED, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. DOM Content Loaded Start', - key: FilterKey.AVG_DOM_CONTENT_LOAD_START, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_DOM_CONTENT_LOAD_START, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. First Meaningful Paint Time', - key: FilterKey.AVG_FIRST_CONTENTFUL_PIXEL, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_FIRST_CONTENTFUL_PIXEL, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. First Paint Time', - key: FilterKey.AVG_FIRST_PAINT, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_FIRST_PAINT, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Frame Rate', - key: FilterKey.AVG_FPS, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_FPS, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Load Time of Images', - key: FilterKey.AVG_IMAGE_LOAD_TIME, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_IMAGE_LOAD_TIME, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Load Time of Pages', - key: FilterKey.AVG_PAGE_LOAD_TIME, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_PAGE_LOAD_TIME, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. DOM Build Time', - key: FilterKey.AVG_PAGES_DOM_BUILD_TIME, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_PAGES_DOM_BUILD_TIME, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Page Response Time', - key: FilterKey.AVG_PAGES_RESPONSE_TIME, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_PAGES_RESPONSE_TIME, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Request Load Time', - key: FilterKey.AVG_REQUEST_LOADT_IME, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_REQUEST_LOADT_IME, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - { - title: 'Avg. Response Time', - key: FilterKey.AVG_RESPONSE_TIME, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_RESPONSE_TIME, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Session Duration', - key: FilterKey.AVG_SESSION_DURATION, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_SESSION_DURATION, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Time Till First Byte', - key: FilterKey.AVG_TILL_FIRST_BYTE, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_TILL_FIRST_BYTE, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Time to be Interactive', - key: FilterKey.AVG_TIME_TO_INTERACTIVE, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_TIME_TO_INTERACTIVE, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. Time to Render', - key: FilterKey.AVG_TIME_TO_RENDER, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_TIME_TO_RENDER, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - }, - - { - title: 'Avg. JS Heap Size', - key: FilterKey.AVG_USED_JS_HEAP_SIZE, - cardType: WEB_VITALS, - metricOf: FilterKey.AVG_USED_JS_HEAP_SIZE, - category: CARD_CATEGORIES[4].key, - data: generateWebVitalData(), - example: WebVital - } ]; - -function generateRandomBarsData(): { total: number, values: { label: string, value: number }[] } { - const labels = ['company.domain.com', 'openreplay.com']; - const values = labels.map(label => ({ - label, - value: Math.floor(Math.random() * 100) - })); - const total = values.reduce((acc, curr) => acc + curr.value, 0); - - return { - total, - values: values.sort((a, b) => b.value - a.value) - }; -} - - -function generateWebVitalData(): { value: number, chart: { timestamp: number, value: number }[], unit: string } { - const chart = Array.from({ length: 7 }, (_, i) => ({ - timestamp: Date.now() + i * 86400000, - value: parseFloat((Math.random() * 10).toFixed(15)) - })); - - const value = chart.reduce((acc, curr) => acc + curr.value, 0) / chart.length; - - return { - value, - chart, - unit: '%' - }; -} - - function generateTimeSeriesData(): any[] { const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul']; const pointsPerMonth = 3; // Number of points for each month diff --git a/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/Examples/PerfBreakdown.tsx b/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/Examples/PerfBreakdown.tsx index 0bb569006..d6c1abfd0 100644 --- a/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/Examples/PerfBreakdown.tsx +++ b/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/Examples/PerfBreakdown.tsx @@ -2,7 +2,6 @@ import { GitCommitHorizontal } from 'lucide-react'; import React from 'react'; import ExCard from './ExCard'; -import {PERFORMANCE} from "App/constants/card"; function PerfBreakdown(props: any) { const rows = [ diff --git a/frontend/app/components/Dashboard/components/DashboardMetricSelection/DashboardMetricSelection.tsx b/frontend/app/components/Dashboard/components/DashboardMetricSelection/DashboardMetricSelection.tsx index c79003322..755968078 100644 --- a/frontend/app/components/Dashboard/components/DashboardMetricSelection/DashboardMetricSelection.tsx +++ b/frontend/app/components/Dashboard/components/DashboardMetricSelection/DashboardMetricSelection.tsx @@ -18,7 +18,6 @@ const ICONS: Record = { resources: 'resources-icon', overview: null, custom: null, - 'web vitals': 'web-vitals', } export function WidgetCategoryItem({ category, isSelected, onClick, selectedWidgetIds }: IWiProps) { diff --git a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx index f2e671d77..960431b35 100644 --- a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx +++ b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx @@ -18,9 +18,6 @@ import { HEATMAP, FUNNEL, ERRORS, - PERFORMANCE, - RESOURCE_MONITORING, - WEB_VITALS, INSIGHTS, USER_PATH, RETENTION @@ -55,8 +52,7 @@ function WidgetChart(props: Props) { const drillDownFilter = dashboardStore.drillDownFilter; const colors = Styles.customMetricColors; const [loading, setLoading] = useState(true); - const isOverviewWidget = metric.metricType === WEB_VITALS; - const params = {density: isOverviewWidget ? 7 : 70}; + const params = {density: 70}; const metricParams = {...params}; const prevMetricRef = useRef(); const isMounted = useIsMounted(); @@ -145,11 +141,8 @@ function WidgetChart(props: Props) { return ; } - if (metricType === 'predefined' || metricType === ERRORS || metricType === PERFORMANCE || metricType === RESOURCE_MONITORING || metricType === WEB_VITALS) { + if (metricType === 'predefined' || metricType === ERRORS) { const defaultMetric = metric.data.chart && metric.data.chart.length === 0 ? metricWithData : metric; - if (isOverviewWidget) { - return ; - } return ; } diff --git a/frontend/app/components/Dashboard/components/WidgetForm/CardBuilder.tsx b/frontend/app/components/Dashboard/components/WidgetForm/CardBuilder.tsx index 977813eee..65009e97c 100644 --- a/frontend/app/components/Dashboard/components/WidgetForm/CardBuilder.tsx +++ b/frontend/app/components/Dashboard/components/WidgetForm/CardBuilder.tsx @@ -15,8 +15,7 @@ import {eventKeys} from 'App/types/filter/newFilter'; import {renderClickmapThumbnail} from './renderMap'; import FilterItem from 'Shared/Filters/FilterItem'; import { - TIMESERIES, TABLE, HEATMAP, FUNNEL, ERRORS, RESOURCE_MONITORING, - PERFORMANCE, WEB_VITALS, INSIGHTS, USER_PATH, RETENTION + TIMESERIES, TABLE, HEATMAP, FUNNEL, ERRORS, INSIGHTS, USER_PATH, RETENTION } from 'App/constants/card'; import {useHistory} from "react-router"; @@ -227,7 +226,7 @@ const CardBuilder = observer((props: CardBuilderProps) => { const metric = metricStore.instance; const timeseriesOptions = metricOf.filter(i => i.type === 'timeseries'); const tableOptions = metricOf.filter(i => i.type === 'table'); - const isPredefined = [ERRORS, PERFORMANCE, RESOURCE_MONITORING, WEB_VITALS].includes(metric.metricType); + const isPredefined = metric.metricType === ERRORS const testingKey = localStorage.getItem('__mauricio_testing_access') === 'true'; diff --git a/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx b/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx index cf664a120..c0de1370c 100644 --- a/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx +++ b/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx @@ -16,9 +16,6 @@ import { HEATMAP, FUNNEL, ERRORS, - RESOURCE_MONITORING, - PERFORMANCE, - WEB_VITALS, INSIGHTS, USER_PATH, RETENTION @@ -61,9 +58,7 @@ function WidgetForm(props: Props) { const eventsLength = metric.series[0].filter.filters.filter((i: any) => i && i.isEvent).length; const cannotSaveFunnel = isFunnel && (!metric.series[0] || eventsLength <= 1); - const isPredefined = [ERRORS, PERFORMANCE, RESOURCE_MONITORING, WEB_VITALS].includes( - metric.metricType - ); + const isPredefined = metric.metricType === ERRORS const excludeFilterKeys = isClickmap || isPathAnalysis ? eventKeys : []; diff --git a/frontend/app/components/Dashboard/components/WidgetForm/WidgetFormNew.tsx b/frontend/app/components/Dashboard/components/WidgetForm/WidgetFormNew.tsx index 5417c21aa..a95b7482e 100644 --- a/frontend/app/components/Dashboard/components/WidgetForm/WidgetFormNew.tsx +++ b/frontend/app/components/Dashboard/components/WidgetForm/WidgetFormNew.tsx @@ -7,11 +7,9 @@ import { ERRORS, FUNNEL, INSIGHTS, - PERFORMANCE, - RESOURCE_MONITORING, RETENTION, TABLE, - USER_PATH, WEB_VITALS, TIMESERIES + USER_PATH } from 'App/constants/card'; import FilterSeries from 'Components/Dashboard/components/FilterSeries/FilterSeries'; import { issueCategories, metricOf } from 'App/constants/filterOptions'; @@ -32,7 +30,7 @@ function WidgetFormNew() { const isPathAnalysis = metric.metricType === USER_PATH; const excludeFilterKeys = isClickMap || isPathAnalysis ? eventKeys : []; const hasFilters = filtersLength > 0 || eventsLength > 0; - const isPredefined = [ERRORS, PERFORMANCE, RESOURCE_MONITORING, WEB_VITALS].includes(metric.metricType); + const isPredefined = metric.metricType === ERRORS return isPredefined ? : ( diff --git a/frontend/app/components/Dashboard/components/WidgetPredefinedChart/WidgetPredefinedChart.tsx b/frontend/app/components/Dashboard/components/WidgetPredefinedChart/WidgetPredefinedChart.tsx index 73ea7ba19..8cf2dbf3c 100644 --- a/frontend/app/components/Dashboard/components/WidgetPredefinedChart/WidgetPredefinedChart.tsx +++ b/frontend/app/components/Dashboard/components/WidgetPredefinedChart/WidgetPredefinedChart.tsx @@ -48,32 +48,6 @@ function WidgetPredefinedChart(props: Props) { case FilterKey.CALLS_ERRORS: return - // PERFORMANCE - case FilterKey.IMPACTED_SESSIONS_BY_SLOW_PAGES: - return - case FilterKey.PAGES_RESPONSE_TIME_DISTRIBUTION: - return - case FilterKey.SPEED_LOCATION: - return - case FilterKey.CPU: - return - case FilterKey.CRASHES: - return - case FilterKey.PAGES_DOM_BUILD_TIME: - return - case FilterKey.FPS: - return - case FilterKey.MEMORY_CONSUMPTION: - return - case FilterKey.PAGES_RESPONSE_TIME: - return - case FilterKey.SESSIONS_PER_BROWSER: - return - case FilterKey.SLOWEST_DOMAINS: - return - case FilterKey.TIME_TO_RENDER: - return - default: return
Widget not supported
} diff --git a/frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx b/frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx index e3cf5e41f..ea7c10fa0 100644 --- a/frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx +++ b/frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx @@ -161,7 +161,7 @@ function LiveSessionList() {
Showing {(currentPage - 1) * PER_PAGE + 1} to{' '} {(currentPage - 1) * PER_PAGE + list.length} of{' '} - {numberWithCommas(total)} sessions. + {numberWithCommas(totalLiveSessions)} sessions.