diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/BreakdownOfLoadedResources/BreakdownOfLoadedResources.tsx b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/BreakdownOfLoadedResources/BreakdownOfLoadedResources.tsx deleted file mode 100644 index 696c8ff9c..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/BreakdownOfLoadedResources/BreakdownOfLoadedResources.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import React from 'react'; -import { NoContent, Icon } from 'UI'; -import { Styles } from '../../common'; -import { - BarChart, Bar, CartesianGrid, Tooltip, - Legend, ResponsiveContainer, - XAxis, YAxis - } from 'recharts'; - -interface Props { - data: any - metric?: any -} -function BreakdownOfLoadedResources(props: Props) { - const { data, metric } = props; - const gradientDef = Styles.gradientDef(); - - return ( - - - No data available for the selected period. - - } - show={ metric.data.chart && metric.data.chart.length === 0 } - > - - - {gradientDef} - - - Styles.tickFormatter(val)} - /> - - - - - - - - - ); -} - -export default BreakdownOfLoadedResources; diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/BreakdownOfLoadedResources/index.ts b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/BreakdownOfLoadedResources/index.ts deleted file mode 100644 index 5770a63d8..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/BreakdownOfLoadedResources/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './BreakdownOfLoadedResources' \ No newline at end of file diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/Chart.js b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/Chart.js deleted file mode 100644 index 11f184df2..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/Chart.js +++ /dev/null @@ -1,17 +0,0 @@ -import React from 'react'; -import { AreaChart, Area } from 'recharts'; -import { Styles } from '../../common'; - -const Chart = ({ data, compare }) => { - const colors = compare ? Styles.compareColors : Styles.colors; - - return ( - - - - ); -} - -Chart.displayName = 'Chart'; - -export default Chart; diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/CopyPath.js b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/CopyPath.js deleted file mode 100644 index 6b7e709e7..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/CopyPath.js +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react' -import copy from 'copy-to-clipboard' -import { useState } from 'react' - -const CopyPath = ({ data }) => { - const [copied, setCopied] = useState(false) - - const copyHandler = () => { - copy(data.url); - setCopied(true); - setTimeout(function() { - setCopied(false) - }, 500); - } - - return ( -
- { copied ? 'Copied' : 'Copy Path'} -
- ) -} - -export default CopyPath diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/MissingResources.tsx b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/MissingResources.tsx deleted file mode 100644 index 6a2b5ed80..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/MissingResources.tsx +++ /dev/null @@ -1,75 +0,0 @@ -import React, { useEffect } from 'react'; -import { NoContent } from 'UI'; -import { Table } from '../../common'; -import { List } from 'immutable'; - -import Chart from './Chart'; -import ResourceInfo from './ResourceInfo'; -import CopyPath from './CopyPath'; - -const cols: Array = [ - { - key: 'resource', - title: 'Resource', - Component: ResourceInfo, - width: '40%', - }, - { - key: 'sessions', - title: 'Sessions', - toText: (count: number) => - `${count > 1000 ? Math.trunc(count / 1000) : count}${count > 1000 ? 'k' : ''}`, - width: '20%', - }, - { - key: 'trend', - title: 'Trend', - Component: Chart, - width: '20%', - }, -]; - -const copyPathCol = { - key: 'copy-path', - title: '', - Component: CopyPath, - cellClass: 'invisible group-hover:visible text-right', - width: '20%', -}; - -interface Props { - data: any; - metric?: any; - isTemplate?: boolean; -} -function MissingResources(props: Props) { - const { data, metric, isTemplate } = props; - - useEffect(() => { - const lastCol: any = cols[cols.length - 1]; - if (!isTemplate && lastCol && lastCol.key !== 'copy-path') { - cols.push(copyPathCol); - } - }, []); - - return ( - -
- - - - ); -} - -export default MissingResources; diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/ResourceInfo.js b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/ResourceInfo.js deleted file mode 100644 index a7ef3a6ac..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/ResourceInfo.js +++ /dev/null @@ -1,19 +0,0 @@ -import React from 'react'; -import { diffFromNowString } from 'App/date'; -import { TextEllipsis } from 'UI'; - -import styles from './resourceInfo.module.css'; - -export default class ResourceInfo extends React.PureComponent { - render() { - const { data } = this.props; - return ( -
- -
- { data.endedAt && data.startedAt && `${ diffFromNowString(data.endedAt) } ago - ${ diffFromNowString(data.startedAt) } old` } -
-
- ); - } -} diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/index.ts b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/index.ts deleted file mode 100644 index db419a09a..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './MissingResources' \ No newline at end of file diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/resourceInfo.module.css b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/resourceInfo.module.css deleted file mode 100644 index d73d23530..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/MissingResources/resourceInfo.module.css +++ /dev/null @@ -1,10 +0,0 @@ -.name { - letter-spacing: -.04em; - font-size: .9rem; - cursor: pointer; -} - -.timings { - color: $gray-medium; - font-size: 12px; -} \ No newline at end of file diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsResponseEnd/ResourceLoadedVsResponseEnd.tsx b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsResponseEnd/ResourceLoadedVsResponseEnd.tsx deleted file mode 100644 index 5a85af7e3..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsResponseEnd/ResourceLoadedVsResponseEnd.tsx +++ /dev/null @@ -1,77 +0,0 @@ -import React from 'react'; -import { NoContent } from 'UI'; -import { Styles } from '../../common'; -import { - ComposedChart, Bar, CartesianGrid, Line, Legend, ResponsiveContainer, - XAxis, YAxis, Tooltip -} from 'recharts'; -import { NO_METRIC_DATA } from 'App/constants/messages'; -import { InfoCircleOutlined } from '@ant-design/icons'; - -interface Props { - data: any - metric?: any -} -function ResourceLoadedVsResponseEnd(props: Props) { - const { data, metric } = props; - - return ( - - { NO_METRIC_DATA } - - } - > - - - - - Styles.tickFormatter(val, 'ms')} - /> - Styles.tickFormatter(val, 'ms')} - /> - - - - - - - - - ); -} - -export default ResourceLoadedVsResponseEnd; diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsResponseEnd/index.ts b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsResponseEnd/index.ts deleted file mode 100644 index 072096a6f..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsResponseEnd/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ResourceLoadedVsResponseEnd' \ No newline at end of file diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsVisuallyComplete/ResourceLoadedVsVisuallyComplete.tsx b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsVisuallyComplete/ResourceLoadedVsVisuallyComplete.tsx deleted file mode 100644 index a7530b07c..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsVisuallyComplete/ResourceLoadedVsVisuallyComplete.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import React from 'react'; -import { NoContent } from 'UI'; -import { Styles } from '../../common'; -import { - ComposedChart, Bar, CartesianGrid, Line, Legend, ResponsiveContainer, - XAxis, YAxis, Tooltip -} from 'recharts'; -import { NO_METRIC_DATA } from 'App/constants/messages'; -import { InfoCircleOutlined } from '@ant-design/icons'; - -interface Props { - data: any - metric?: any -} -function ResourceLoadedVsVisuallyComplete(props: Props) { - const { metric } = props; - - return ( - - { NO_METRIC_DATA } - - } - > - - - - - Styles.tickFormatter(val, 'ms')} - /> - Styles.tickFormatter(val)} - /> - - - - - - - - - - ); -} - -export default ResourceLoadedVsVisuallyComplete; diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsVisuallyComplete/index.ts b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsVisuallyComplete/index.ts deleted file mode 100644 index af77c13fa..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsVisuallyComplete/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ResourceLoadedVsVisuallyComplete' \ No newline at end of file diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadingTime/ResourceLoadingTime.tsx b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadingTime/ResourceLoadingTime.tsx deleted file mode 100644 index c014672b0..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadingTime/ResourceLoadingTime.tsx +++ /dev/null @@ -1,92 +0,0 @@ -import React from 'react'; -import { NoContent } from 'UI'; -import { Styles, AvgLabel } from '../../common'; -import { withRequest } from 'HOCs' -import { - AreaChart, Area, - CartesianGrid, Tooltip, - ResponsiveContainer, - XAxis, YAxis - } from 'recharts'; -import { toUnderscore } from 'App/utils'; -import { NO_METRIC_DATA } from 'App/constants/messages'; -import { InfoCircleOutlined } from '@ant-design/icons'; - -const WIDGET_KEY = 'resourcesLoadingTime'; -export const RESOURCE_OPTIONS = [ - { text: 'All', value: 'all', }, - { text: 'JS', value: "SCRIPT", }, - { text: 'CSS', value: "STYLESHEET", }, - { text: 'Fetch', value: "REQUEST", }, - { text: 'Image', value: "IMG", }, - { text: 'Media', value: "MEDIA", }, - { text: 'Other', value: "OTHER", }, -]; - -interface Props { - data: any - optionsLoading: any - fetchOptions: any - options: any - metric?: any -} -function ResourceLoadingTime(props: Props) { - const { data, metric } = props; - const gradientDef = Styles.gradientDef(); - - return ( - - { NO_METRIC_DATA } - - } - > - <> -
- -
- - - {gradientDef} - - - Styles.tickFormatter(val)} - label={{ ...Styles.axisLabelLeft, value: "Resource Fetch Time (ms)" }} - /> - - - - - -
- ); -} - -export default withRequest({ - dataName: "options", - initialData: [], - dataWrapper: data => data, - loadingName: 'optionsLoading', - requestName: "fetchOptions", - endpoint: '/dashboard/' + toUnderscore(WIDGET_KEY) + '/search', - method: 'GET' -})(ResourceLoadingTime) diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadingTime/index.ts b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadingTime/index.ts deleted file mode 100644 index 1c9fa51c8..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadingTime/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ResourceLoadingTime' \ No newline at end of file diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/Chart.js b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/Chart.js deleted file mode 100644 index 7833688bb..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/Chart.js +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import { AreaChart, Area } from 'recharts'; -import { Styles } from '../../common'; - -const Chart = ({ data, compare }) => { - const colors = compare ? Styles.compareColors : Styles.colors; - return ( - - - - ); -} - -Chart.displayName = 'Chart'; - -export default Chart; diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/CopyPath.js b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/CopyPath.js deleted file mode 100644 index 6b7e709e7..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/CopyPath.js +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react' -import copy from 'copy-to-clipboard' -import { useState } from 'react' - -const CopyPath = ({ data }) => { - const [copied, setCopied] = useState(false) - - const copyHandler = () => { - copy(data.url); - setCopied(true); - setTimeout(function() { - setCopied(false) - }, 500); - } - - return ( -
- { copied ? 'Copied' : 'Copy Path'} -
- ) -} - -export default CopyPath diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/ImageInfo.js b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/ImageInfo.js deleted file mode 100644 index c8b3890e3..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/ImageInfo.js +++ /dev/null @@ -1,33 +0,0 @@ -import React from 'react'; -import { Tooltip } from 'UI'; -import cn from 'classnames'; -import styles from './imageInfo.module.css'; - -const supportedTypes = ['png', 'jpg', 'jpeg', 'svg']; - -const ImageInfo = ({ data }) => { - const canPreview = supportedTypes.includes(data.type); - return ( -
- - } - > -
-
{data.name}
-
-
-
- ); -}; - -ImageInfo.displayName = 'ImageInfo'; - -export default ImageInfo; diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/ResourceType.js b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/ResourceType.js deleted file mode 100644 index 9803a050f..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/ResourceType.js +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react' -import cn from 'classnames' - -const ResourceType = ({ data : { type = 'js' }, compare }) => { - return ( -
- { type.toUpperCase() } -
- ) -} - -export default ResourceType diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/SlowestResources.tsx b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/SlowestResources.tsx deleted file mode 100644 index a17d91633..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/SlowestResources.tsx +++ /dev/null @@ -1,98 +0,0 @@ -import React, { useEffect } from 'react'; -import { NoContent } from 'UI'; -import { Table } from '../../common'; -import { List } from 'immutable'; -import { numberWithCommas } from 'App/utils'; - -import Chart from './Chart'; -import ImageInfo from './ImageInfo'; -import ResourceType from './ResourceType'; -import CopyPath from './CopyPath'; -import { NO_METRIC_DATA } from 'App/constants/messages'; -import { InfoCircleOutlined } from '@ant-design/icons'; - -export const RESOURCE_OPTIONS = [ - { text: 'All', value: 'ALL' }, - { text: 'CSS', value: 'STYLESHEET' }, - { text: 'JS', value: 'SCRIPT' }, -]; - -const cols: Array = [ - { - key: 'type', - title: 'Type', - Component: ResourceType, - className: 'text-center justify-center', - cellClass: 'ml-2', - width: '8%', - }, - { - key: 'name', - title: 'File Name', - Component: ImageInfo, - cellClass: '-ml-2', - width: '40%', - }, - { - key: 'avg', - title: 'Load Time', - toText: (avg) => `${avg ? numberWithCommas(Math.trunc(avg)) : 0} ms`, - className: 'justify-center', - width: '15%', - }, - { - key: 'trend', - title: 'Trend', - Component: Chart, - width: '15%', - }, -]; - -const copyPathCol = { - key: 'copy-path', - title: '', - Component: CopyPath, - cellClass: 'invisible group-hover:visible text-right', - width: '15%', -}; - -interface Props { - data: any; - metric?: any; - isTemplate?: boolean; -} -function SlowestResources(props: Props) { - const { data, metric, isTemplate } = props; - - useEffect(() => { - const lastCol: any = cols[cols.length - 1]; - if (!isTemplate && lastCol && lastCol.key !== 'copy-path') { - cols.push(copyPathCol); - } - }, []); - - return ( - - { NO_METRIC_DATA } - - } - size="small" - show={metric.data.chart.length === 0} - style={{ minHeight: 220 }} - > -
-
- - - ); -} - -export default SlowestResources; diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/imageInfo.module.css b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/imageInfo.module.css deleted file mode 100644 index 1de36b529..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/imageInfo.module.css +++ /dev/null @@ -1,52 +0,0 @@ -.name { - display: flex; - align-items: center; - - & > span { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - max-width: 60%; - } - - & .label { - max-width: 300px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } -} - -.hasPreview { - /* text-decoration: underline; */ - border-bottom: 1px dotted; - cursor: pointer; -} - -.imagePreview { - max-width: 200px; - max-height: 200px; -} - -.imageWrapper { - display: flex; - flex-flow: column; - align-items: center; - width: 40px; - text-align: center; - margin-right: 10px; - & > span { - height: 16px; - } - & .label { - font-size: 9px; - color: $gray-light; - } -} - -.popup { - background-color: #f5f5f5 !important; - &:before { - background-color: #f5f5f5 !important; - } -} \ No newline at end of file diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/index.ts b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/index.ts deleted file mode 100644 index ca907e9f0..000000000 --- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/SlowestResources/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './SlowestResources' \ No newline at end of file diff --git a/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/ExampleCards.tsx b/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/ExampleCards.tsx index c9e7e721d..c76b5a77c 100644 --- a/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/ExampleCards.tsx +++ b/frontend/app/components/Dashboard/components/DashboardList/NewDashModal/ExampleCards.tsx @@ -271,22 +271,6 @@ export const CARD_LIST: CardType[] = [ example: BarChartCard }, - { - title: 'Resources vs Visually Completed', - key: FilterKey.RESOURCES_VS_VISUALLY_COMPLETE, - cardType: PERFORMANCE, - metricOf: FilterKey.RESOURCES_VS_VISUALLY_COMPLETE, - category: CARD_CATEGORIES[1].key, - data: { - chart: generateStackedBarChartData(['Images', 'Scripts', 'CSS']), - label: 'Visually Completed (ms)', - namesMap: [ - 'Series 1' - ] - }, - example: BarChartCard - }, - { title: 'Sessions by Browser & Version', key: FilterKey.SESSIONS_PER_BROWSER, diff --git a/frontend/app/components/Dashboard/components/WidgetPredefinedChart/WidgetPredefinedChart.tsx b/frontend/app/components/Dashboard/components/WidgetPredefinedChart/WidgetPredefinedChart.tsx index 174bc93f1..73ea7ba19 100644 --- a/frontend/app/components/Dashboard/components/WidgetPredefinedChart/WidgetPredefinedChart.tsx +++ b/frontend/app/components/Dashboard/components/WidgetPredefinedChart/WidgetPredefinedChart.tsx @@ -14,16 +14,10 @@ import MemoryConsumption from 'App/components/Dashboard/Widgets/PredefinedWidget import ResponseTime from 'App/components/Dashboard/Widgets/PredefinedWidgets/ResponseTime'; import TimeToRender from 'App/components/Dashboard/Widgets/PredefinedWidgets/TimeToRender'; import SlowestDomains from 'App/components/Dashboard/Widgets/PredefinedWidgets/SlowestDomains'; -import ResourceLoadedVsVisuallyComplete from 'App/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsVisuallyComplete'; import SessionsImpactedBySlowRequests from 'App/components/Dashboard/Widgets/PredefinedWidgets/SessionsImpactedBySlowRequests'; -import ResourceLoadingTime from 'App/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadingTime'; -import BreakdownOfLoadedResources from 'App/components/Dashboard/Widgets/PredefinedWidgets/BreakdownOfLoadedResources'; -import MissingResources from 'App/components/Dashboard/Widgets/PredefinedWidgets/MissingResources'; -import ResourceLoadedVsResponseEnd from 'App/components/Dashboard/Widgets/PredefinedWidgets/ResourceLoadedVsResponseEnd'; import SessionsPerBrowser from 'App/components/Dashboard/Widgets/PredefinedWidgets/SessionsPerBrowser'; import CallWithErrors from '../../Widgets/PredefinedWidgets/CallWithErrors'; import SpeedIndexByLocation from '../../Widgets/PredefinedWidgets/SpeedIndexByLocation'; -import SlowestResources from '../../Widgets/PredefinedWidgets/SlowestResources'; import ResponseTimeDistribution from '../../Widgets/PredefinedWidgets/ResponseTimeDistribution'; import { FilterKey } from 'Types/filter/filterType'; @@ -73,8 +67,6 @@ function WidgetPredefinedChart(props: Props) { return case FilterKey.PAGES_RESPONSE_TIME: return - case FilterKey.RESOURCES_VS_VISUALLY_COMPLETE: - return case FilterKey.SESSIONS_PER_BROWSER: return case FilterKey.SLOWEST_DOMAINS: @@ -82,18 +74,6 @@ function WidgetPredefinedChart(props: Props) { case FilterKey.TIME_TO_RENDER: return - // Resources - case FilterKey.BREAKDOWN_OF_LOADED_RESOURCES: - return - case FilterKey.MISSING_RESOURCES: - return - case FilterKey.RESOURCE_TYPE_VS_RESPONSE_END: - return - case FilterKey.RESOURCES_LOADING_TIME: - return - case FilterKey.SLOWEST_RESOURCES: - return - default: return
Widget not supported
} diff --git a/frontend/app/components/Dashboard/components/WidgetView/WidgetView.tsx b/frontend/app/components/Dashboard/components/WidgetView/WidgetView.tsx index 7c2809e39..3340b2260 100644 --- a/frontend/app/components/Dashboard/components/WidgetView/WidgetView.tsx +++ b/frontend/app/components/Dashboard/components/WidgetView/WidgetView.tsx @@ -148,11 +148,12 @@ function WidgetView(props: Props) { {widget.metricOf !== FilterKey.SESSIONS && widget.metricOf !== FilterKey.ERRORS && ( - <> - {(widget.metricType === TABLE || widget.metricType === TIMESERIES || widget.metricType === HEATMAP || widget.metricType === INSIGHTS) && - } - {widget.metricType === FUNNEL && } - + (widget.metricType === TABLE + || widget.metricType === TIMESERIES + || widget.metricType === HEATMAP + || widget.metricType === INSIGHTS + || widget.metricType === FUNNEL) ? + : null )} {widget.metricType === USER_PATH && } diff --git a/frontend/app/constants/card.ts b/frontend/app/constants/card.ts index 17e459c59..cc0b408d7 100644 --- a/frontend/app/constants/card.ts +++ b/frontend/app/constants/card.ts @@ -112,11 +112,6 @@ export const TYPES: CardType[] = [ slug: FilterKey.PAGES_RESPONSE_TIME_DISTRIBUTION, description: '', }, - { - title: 'Resources vs Visually Complete', - slug: FilterKey.RESOURCES_VS_VISUALLY_COMPLETE, - description: '', - }, { title: 'Sessions per Browser', slug: FilterKey.SESSIONS_PER_BROWSER, description: '' }, { title: 'Slowest Domains', slug: FilterKey.SLOWEST_DOMAINS, description: '' }, { title: 'Speed Index by Location', slug: FilterKey.SPEED_LOCATION, description: '' }, @@ -128,27 +123,6 @@ export const TYPES: CardType[] = [ }, ], }, - { - title: 'Resource Monitoring', - icon: 'files', - description: 'Identify missing resources and those slowing down your app.', - slug: RESOURCE_MONITORING, - subTypes: [ - { - title: 'Breakdown of Loaded Resources', - slug: FilterKey.BREAKDOWN_OF_LOADED_RESOURCES, - description: '', - }, - { title: 'Missing Resources', slug: FilterKey.MISSING_RESOURCES, description: '' }, - { - title: 'Resource Type vs Response End', - slug: FilterKey.RESOURCE_TYPE_VS_RESPONSE_END, - description: '', - }, - { title: 'Resource Fetch Time', slug: FilterKey.RESOURCE_FETCH_TIME, description: '' }, - { title: 'Slowest Resources', slug: FilterKey.SLOWEST_RESOURCES, description: '' }, - ], - }, { title: 'Web Vitals', icon: 'activity', diff --git a/frontend/app/types/filter/filterType.ts b/frontend/app/types/filter/filterType.ts index 2fbefcc57..0f57a5dcd 100644 --- a/frontend/app/types/filter/filterType.ts +++ b/frontend/app/types/filter/filterType.ts @@ -302,20 +302,12 @@ export enum FilterKey { MEMORY_CONSUMPTION = 'memoryConsumption', PAGES_RESPONSE_TIME = 'pagesResponseTime', PAGES_RESPONSE_TIME_DISTRIBUTION = 'pagesResponseTimeDistribution', - RESOURCES_VS_VISUALLY_COMPLETE = 'resourcesVsVisuallyComplete', SESSIONS_PER_BROWSER = 'sessionsPerBrowser', SLOWEST_DOMAINS = 'slowestDomains', SPEED_LOCATION = 'speedLocation', TIME_TO_RENDER = 'timeToRender', IMPACTED_SESSIONS_BY_SLOW_PAGES = 'impactedSessionsBySlowPages', - // Resources - BREAKDOWN_OF_LOADED_RESOURCES = 'resourcesCountByType', - MISSING_RESOURCES = 'missingResources', - RESOURCE_TYPE_VS_RESPONSE_END = 'resourceTypeVsResponseEnd', - RESOURCE_FETCH_TIME = 'resourcesLoadingTime', - SLOWEST_RESOURCES = 'slowestResources', - CLICKMAP_URL = 'clickMapUrl', FEATURE_FLAG = 'featureFlag', TAGGED_ELEMENT = 'tag', diff --git a/frontend/app/types/session/session.ts b/frontend/app/types/session/session.ts index f1ac1042f..0023111d7 100644 --- a/frontend/app/types/session/session.ts +++ b/frontend/app/types/session/session.ts @@ -424,8 +424,6 @@ export default class Session { this.notesWithEvents = [...this.notesWithEvents, ...mixedEventsWithIssues].sort(sortEvents); this.errors = exceptions; this.issues = issuesList; - // @ts-ignore legacy code? no idea - this.resources = resources; this.stackEvents = stackEventsList; // @ts-ignore this.frustrations = frustrationList;