From b22f1488a6bf89670c464ad65f949601c9b988d9 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Thu, 23 Jun 2022 18:35:37 +0200
Subject: [PATCH] fix(ui) - icon button

---
 .../components/FilterSeries/FilterSeries.tsx       | 14 +++++++-------
 .../Dashboard/components/WidgetForm/WidgetForm.tsx |  6 ------
 frontend/app/mstore/types/widget.ts                |  4 ++--
 3 files changed, 9 insertions(+), 15 deletions(-)

diff --git a/frontend/app/components/Dashboard/components/FilterSeries/FilterSeries.tsx b/frontend/app/components/Dashboard/components/FilterSeries/FilterSeries.tsx
index 181a3c8ee..67e39ed49 100644
--- a/frontend/app/components/Dashboard/components/FilterSeries/FilterSeries.tsx
+++ b/frontend/app/components/Dashboard/components/FilterSeries/FilterSeries.tsx
@@ -9,7 +9,7 @@ import {
   editSeriesFilter,
 } from 'Duck/customMetrics';
 import { connect } from 'react-redux';
-import { IconButton, Icon } from 'UI';
+import { Button, Icon } from 'UI';
 import FilterSelection from 'Shared/Filters/FilterSelection';
 import SeriesName from './SeriesName';
 import cn from 'classnames';
@@ -20,7 +20,7 @@ interface Props {
   series: any;
   edit: typeof edit;
   updateSeries: typeof updateSeries;
-  onRemoveSeries: (seriesIndex) => void;
+  onRemoveSeries: (seriesIndex: any) => void;
   canDelete?: boolean; 
   addSeriesFilterFilter: typeof addSeriesFilterFilter;
   editSeriesFilterFilter: typeof editSeriesFilterFilter;
@@ -38,19 +38,19 @@ function FilterSeries(props: Props) {
 
   useEffect(observeChanges, [series.filter]);
 
-  const onAddFilter = (filter) => {
+  const onAddFilter = (filter: any) => {
     series.filter.addFilter(filter)
   }
 
-  const onUpdateFilter = (filterIndex, filter) => {
+  const onUpdateFilter = (filterIndex: any, filter: any) => {
     series.filter.updateFilter(filterIndex, filter)
   }
 
-  const onChangeEventsOrder = (e, { name, value }) => {
+  const onChangeEventsOrder = (e, { name, value }: any) => {
     series.filter.updateKey(name, value)
   }
 
-  const onRemoveFilter = (filterIndex) => {
+  const onRemoveFilter = (filterIndex: any) => {
     series.filter.removeFilter(filterIndex)
   }
 
@@ -92,7 +92,7 @@ function FilterSeries(props: Props) {
                 filter={undefined}
                 onFilterClick={onAddFilter}
               >
-                <IconButton primaryText label="ADD STEP" icon="plus" />
+                <Button variant="text-primary" icon="plus">ADD STEP</Button>
               </FilterSelection>
             </div>
           </div>
diff --git a/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx b/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
index d2635f24a..31f78c8e7 100644
--- a/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
+++ b/frontend/app/components/Dashboard/components/WidgetForm/WidgetForm.tsx
@@ -88,10 +88,6 @@ function WidgetForm(props: Props) {
         }
     }
 
-    const onObserveChanges = () => {
-        // metricStore.fetchMetricChartData(metric);
-    }
-
     return useObserver(() => (
         <div className="p-6">
             <div className="form-group">
@@ -177,14 +173,12 @@ function WidgetForm(props: Props) {
                             hideHeader={ isTable }
                             seriesIndex={index}
                             series={series}
-                            // onRemoveSeries={() => removeSeries(index)}
                             onRemoveSeries={() => metric.removeSeries(index)}
                             canDelete={metric.series.length > 1}
                             emptyMessage={isTable ?
                                 'Filter data using any event or attribute. Use Add Step button below to do so.' :
                                 'Add user event or filter to define the series by clicking Add Step.'
                             }
-                            // observeChanges={onObserveChanges}
                         />
                     </div>
                 ))}
diff --git a/frontend/app/mstore/types/widget.ts b/frontend/app/mstore/types/widget.ts
index fe01631f3..fe0ecb0c5 100644
--- a/frontend/app/mstore/types/widget.ts
+++ b/frontend/app/mstore/types/widget.ts
@@ -38,10 +38,9 @@ export interface IWidget {
     
     page: number
     limit: number
-
     params: any
-
     period: any
+    hasChanges: boolean
 
     updateKey(key: string, value: any): void
     removeSeries(index: number): void
@@ -81,6 +80,7 @@ export default class Widget implements IWidget {
     params: any = { density: 70 }
     
     period: any = Period({ rangeName: LAST_24_HOURS }) // temp value in detail view
+    hasChanges: boolean = false
 
     sessionsLoading: boolean = false