From 0559fe1aee5839804af0a29f891f32b7975a2ac0 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Mon, 16 Dec 2024 18:30:15 +0530
Subject: [PATCH] NTP-7916 | coach mark extendible

---
 src/action/filterActions.ts                      | 11 ++++++++---
 .../allCasesFilters/FiltersContainer.tsx         | 16 +++++++++++-----
 2 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/action/filterActions.ts b/src/action/filterActions.ts
index 3ec68b9b..cf76c004 100644
--- a/src/action/filterActions.ts
+++ b/src/action/filterActions.ts
@@ -10,7 +10,12 @@ import { GLOBAL } from '@constants/Global';
 dayjs.extend(utc);
 dayjs.extend(timezone);
 
+export const CoachMarkFeatures = {
+  CASE_STATUS_FILTERS: 'caseStatusFilters',
+};
+
 export const showCoachMark = async (
+  featureName: string,
   agentId: string,
   serverTimestamp: string,
   callback: () => Promise<unknown>
@@ -20,7 +25,7 @@ export const showCoachMark = async (
   }
   const coachMarkDoc = firestore().collection('coachMarks').doc(agentId);
   const userSnapshot = await coachMarkDoc.get();
-  let coachMarkData = userSnapshot.data()?.coachMarkData;
+  let coachMarkData = userSnapshot.data()?.[featureName];
   const dayJsTime = dayjs().tz(TIMEZONE_ASIA).format(TIMESTAMP_IST);
   const timestamp = serverTimestamp || dayJsTime;
 
@@ -33,7 +38,7 @@ export const showCoachMark = async (
     callback().then(
       async () => {
         addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_FILTER_COACHMARKS_LOADED);
-        await coachMarkDoc.set({ coachMarkData }, { merge: true });
+        await coachMarkDoc.set({ [featureName]: coachMarkData }, { merge: true });
       },
       (error) => {
         addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_FILTER_COACHMARKS_FAILED);
@@ -54,7 +59,7 @@ export const showCoachMark = async (
     callback().then(
       async () => {
         addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_FILTER_COACHMARKS_LOADED);
-        await coachMarkDoc.set({ coachMarkData }, { merge: true });
+        await coachMarkDoc.set({ [featureName]: coachMarkData }, { merge: true });
       },
       (error) => {
         addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_FILTER_COACHMARKS_FAILED);
diff --git a/src/components/screens/allCases/allCasesFilters/FiltersContainer.tsx b/src/components/screens/allCases/allCasesFilters/FiltersContainer.tsx
index bbd85c4b..b4dbea5b 100644
--- a/src/components/screens/allCases/allCasesFilters/FiltersContainer.tsx
+++ b/src/components/screens/allCases/allCasesFilters/FiltersContainer.tsx
@@ -23,7 +23,7 @@ import { getSelectedFilters } from '../../../../screens/Dashboard/utils';
 import { CopilotStep } from '@components/Tour/components/CopilotStep';
 import { useCopilot } from '@components/Tour/contexts/CopilotProvider';
 import { ENABLE_COACHMARK } from './constants';
-import { showCoachMark } from '@actions/filterActions';
+import { CoachMarkFeatures, showCoachMark } from '@actions/filterActions';
 
 const FiltersContainer: React.FC<FilterContainerProps> = (props) => {
   const { closeFilterModal, isVisitPlan, isAgentDashboard } = props;
@@ -109,10 +109,10 @@ const FiltersContainer: React.FC<FilterContainerProps> = (props) => {
   };
 
   const startCoachMark = async () => {
-    if(onLayoutHandled.current) return;
+    if (onLayoutHandled.current) return;
     if (userId) {
       onLayoutHandled.current = true;
-      showCoachMark(userId, serverTimestamp, copilot.start);
+      showCoachMark(CoachMarkFeatures.CASE_STATUS_FILTERS, userId, serverTimestamp, copilot.start);
     }
   };
 
@@ -207,7 +207,10 @@ const FiltersContainer: React.FC<FilterContainerProps> = (props) => {
                             text={ENABLE_COACHMARK[filterKey]?.description}
                           >
                             <Text
-                              style={[filterKey === selectedFilterKey.filterKey && styles.blueText, GenericStyles.flex80]}
+                              style={[
+                                filterKey === selectedFilterKey.filterKey && styles.blueText,
+                                GenericStyles.flex80,
+                              ]}
                               dark
                             >
                               {filters[filterGroupKey].filters[filterKey].displayText}
@@ -215,7 +218,10 @@ const FiltersContainer: React.FC<FilterContainerProps> = (props) => {
                           </CopilotStep>
                         ) : (
                           <Text
-                            style={[filterKey === selectedFilterKey.filterKey && styles.blueText, GenericStyles.flex80]}
+                            style={[
+                              filterKey === selectedFilterKey.filterKey && styles.blueText,
+                              GenericStyles.flex80,
+                            ]}
                             dark
                           >
                             {filters[filterGroupKey].filters[filterKey].displayText}