From 68c5700aa1dbfa1e454a3e62308a631a6ff94447 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Tue, 31 Jan 2023 17:01:05 +0100
Subject: [PATCH] fix(ui) - reset drilldown filter

---
 .../components/WidgetChart/WidgetChart.tsx          |  6 ++++++
 frontend/app/mstore/dashboardStore.ts               | 13 +++++++++----
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx
index d4ed53324..0663268a1 100644
--- a/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx
+++ b/frontend/app/components/Dashboard/components/WidgetChart/WidgetChart.tsx
@@ -47,6 +47,12 @@ function WidgetChart(props: Props) {
     const isTableWidget = metric.metricType === 'table' && metric.viewType === 'table';
     const isPieChart = metric.metricType === 'table' && metric.viewType === 'pieChart';
 
+    useEffect(() => {
+        return () => {
+            dashboardStore.resetDrillDownFilter();
+        }
+    }, [])
+
     const onChartClick = (event: any) => {
         if (event) {
             if (isTableWidget || isPieChart) { // get the filter of clicked row
diff --git a/frontend/app/mstore/dashboardStore.ts b/frontend/app/mstore/dashboardStore.ts
index 530948466..bd8681c2f 100644
--- a/frontend/app/mstore/dashboardStore.ts
+++ b/frontend/app/mstore/dashboardStore.ts
@@ -52,10 +52,7 @@ export default class DashboardStore {
   constructor() {
     makeAutoObservable(this);
 
-    this.drillDownPeriod = Period({ rangeName: LAST_7_DAYS });
-    const timeStamps = this.drillDownPeriod.toTimestamps();
-    this.drillDownFilter.updateKey('startTimestamp', timeStamps.startTimestamp);
-    this.drillDownFilter.updateKey('endTimestamp', timeStamps.endTimestamp);
+    this.resetDrillDownFilter();
   }
 
   get sortedDashboards() {
@@ -65,6 +62,14 @@ export default class DashboardStore {
     );
   }
 
+  resetDrillDownFilter() {
+    this.drillDownFilter = new Filter();
+    this.drillDownPeriod = Period({ rangeName: LAST_7_DAYS });
+    const timeStamps = this.drillDownPeriod.toTimestamps();
+    this.drillDownFilter.updateKey('startTimestamp', timeStamps.startTimestamp);
+    this.drillDownFilter.updateKey('endTimestamp', timeStamps.endTimestamp);
+  }
+
   get filteredList() {
     const filterRE = this.filter.query ? getRE(this.filter.query, 'i') : null;
     return this.dashboards