diff --git a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ErrorsByOrigin/ErrorsByOrigin.tsx b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ErrorsByOrigin/ErrorsByOrigin.tsx
index e405ba422..cd95853fe 100644
--- a/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ErrorsByOrigin/ErrorsByOrigin.tsx
+++ b/frontend/app/components/Dashboard/Widgets/PredefinedWidgets/ErrorsByOrigin/ErrorsByOrigin.tsx
@@ -20,7 +20,7 @@ function ErrorsByOrigin(props: Props) {
         <NoContent
           size="small"
           title={NO_METRIC_DATA}
-          show={ metric.data.chart.length === 0 }
+          show={ metric.data.chart && metric.data.chart.length === 0 }
           style={ { height: '240px' } }
         >
           <ResponsiveContainer height={ 240 } width="100%">
diff --git a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx
index 7cc3cee08..c32d0d498 100644
--- a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx
+++ b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx
@@ -110,7 +110,7 @@ function WidgetChart(props: Props) {
         }
 
         if (metricType === 'predefined' || metricType === ERRORS || metricType === PERFORMANCE || metricType === RESOURCE_MONITORING || metricType === WEB_VITALS) {
-            const defaultMetric = metric.data.chart.length === 0 ? metricWithData : metric
+            const defaultMetric = metric.data.chart && metric.data.chart.length === 0 ? metricWithData : metric
             if (isOverviewWidget) {
                 return <CustomMetricOverviewChart data={data} />
             }
diff --git a/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx b/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
index 35f4be01f..49c3cb208 100644
--- a/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
+++ b/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
@@ -3,14 +3,13 @@ import { metricOf, issueOptions } from 'App/constants/filterOptions';
 import { FilterKey } from 'Types/filter/filterType';
 import { useStore } from 'App/mstore';
 import { observer } from 'mobx-react-lite';
-import { Button, Icon } from 'UI';
+import { Button, Icon, confirm, Tooltip } from 'UI';
 import FilterSeries from '../FilterSeries';
-import { confirm, Tooltip } from 'UI';
 import Select from 'Shared/Select';
 import { withSiteId, dashboardMetricDetails, metricDetails } from 'App/routes';
 import MetricTypeDropdown from './components/MetricTypeDropdown';
 import MetricSubtypeDropdown from './components/MetricSubtypeDropdown';
-import { TIMESERIES, TABLE, CLICKMAP, FUNNEL, ERRORS, RESOURCE_MONITORING } from 'App/constants/card';
+import { TIMESERIES, TABLE, CLICKMAP, FUNNEL, ERRORS, RESOURCE_MONITORING, PERFORMANCE, WEB_VITALS } from 'App/constants/card';
 import { clickmapFilter } from 'App/types/filter/newFilter';
 import { renderClickmapThumbnail } from './renderMap'
 
@@ -39,6 +38,7 @@ function WidgetForm(props: Props) {
   const canAddSeries = metric.series.length < 3;
   const eventsLength = metric.series[0].filter.filters.filter((i: any) => i.isEvent).length;
   const cannotSaveFunnel = isFunnel && (!metric.series[0] || eventsLength <= 1);
+  const isPredefined = metric.metricType === ERRORS || metric.metricType === PERFORMANCE || metric.metricType === RESOURCE_MONITORING || metric.metricType === WEB_VITALS;
 
   const writeOption = ({ value, name }: any) => {
     value = Array.isArray(value) ? value : value.value;
@@ -68,7 +68,7 @@ function WidgetForm(props: Props) {
         obj['viewType'] = 'table';
       } else if (value === FUNNEL) {
         obj['metricOf'] = 'sessionCount';
-      } else if (value === ERRORS || value === RESOURCE_MONITORING) {
+      } else if (value === ERRORS || value === RESOURCE_MONITORING || value === RESOURCE_MONITORING || value === WEB_VITALS) {
         obj['viewType'] = 'chart';
       } 
 
@@ -132,30 +132,6 @@ function WidgetForm(props: Props) {
           <MetricTypeDropdown onSelect={writeOption} />
           <MetricSubtypeDropdown onSelect={writeOption} />
 
-          {/* {metric.metricType === 'timeseries' && (
-                        <>
-                            <span className="mx-3">of</span>
-                            <Select
-                                name="metricOf"
-                                options={timeseriesOptions}
-                                defaultValue={metric.metricOf}
-                                onChange={ writeOption }
-                            />
-                        </>
-                    )} */}
-
-          {/* {metric.metricType === 'table' && (
-                        <>
-                            <span className="mx-3">of</span>
-                            <Select
-                                name="metricOf"
-                                options={tableOptions}
-                                defaultValue={metric.metricOf}
-                                onChange={ writeOption }
-                            />
-                        </>
-                    )} */}
-
           {metric.metricOf === FilterKey.ISSUE && (
             <>
               <span className="mx-3">issue type</span>
@@ -186,6 +162,14 @@ function WidgetForm(props: Props) {
         </div>
       </div>
 
+      {isPredefined && (
+        <div className="flex items-center my-6 justify-center">
+          <Icon name="info-circle" size="18" color="gray-medium" />
+          <div className="ml-2">Filtering or modification of OpenReplay provided metrics isn't supported at the moment.</div>
+        </div>
+      )}
+
+      {!isPredefined && (
       <div className="form-group">
         <div className="flex items-center font-medium py-2">
           {`${isTable || isFunnel || isClickmap ? 'Filter by' : 'Chart Series'}`}
@@ -221,7 +205,8 @@ function WidgetForm(props: Props) {
                 />
               </div>
             ))}
-      </div>
+        </div>
+      )}
 
       <div className="form-groups flex items-center justify-between">
         <Tooltip