From 0fadbc11ed130c75ed12c8ef354c32620b20a371 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 31 Aug 2023 23:39:24 +0530
Subject: [PATCH 01/22] TP-34788 | refactor

---
 src/screens/allCases/CaseListHeader.tsx | 22 +++++++++++++++-------
 src/screens/allCases/CasesList.tsx      | 19 +++++++++----------
 src/screens/allCases/HeaderLabel.tsx    | 23 +++++++++++++++++++++++
 3 files changed, 47 insertions(+), 17 deletions(-)
 create mode 100644 src/screens/allCases/HeaderLabel.tsx

diff --git a/src/screens/allCases/CaseListHeader.tsx b/src/screens/allCases/CaseListHeader.tsx
index af0041ce..f59d4263 100644
--- a/src/screens/allCases/CaseListHeader.tsx
+++ b/src/screens/allCases/CaseListHeader.tsx
@@ -5,28 +5,38 @@ import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
 import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import Filters from './Filters';
 import NotificationMenu from '../../components/notificationMenu';
+import { useAppSelector } from '../../hooks';
+import { RootState } from '../../store/store';
+import { VisitPlanStatus } from '../../reducer/userSlice';
+import HeaderLabel from './HeaderLabel';
 
 interface ICaseListHeader {
-  filterCount: number;
   searchQuery: string;
   handleSearchChange: (val: string) => void;
   toggleFilterModal: () => void;
   headerHeight: Animated.AnimatedInterpolation<string | number>;
-  headerLabel: string;
   showFilters: boolean;
   isVisitPlan?: boolean;
 }
 
 const CaseListHeader: React.FC<ICaseListHeader> = ({
   searchQuery,
-  filterCount,
   handleSearchChange,
   toggleFilterModal,
   headerHeight,
-  headerLabel,
   showFilters,
   isVisitPlan,
 }) => {
+  const { filterCount } = useAppSelector((state: RootState) => ({
+    filters: state.filters.filters,
+    filterCount: isVisitPlan ? state.filters.filterCountVisitPlan : state.filters.filterCount,
+    selectedFilters: isVisitPlan
+      ? state.filters.selectedFiltersVisitPlan
+      : state.filters.selectedFilters,
+    quickFiltersPresent: state?.filters?.quickFilters?.length > 0,
+    isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
+  }));
+
   return (
     <Animated.View
       style={[styles.filterContainer, { height: showFilters ? headerHeight : 'auto' }]}
@@ -40,9 +50,7 @@ const CaseListHeader: React.FC<ICaseListHeader> = ({
           GenericStyles.pv10,
         ]}
       >
-        <Heading type="h3" style={[styles.headerLabel]}>
-          {headerLabel}
-        </Heading>
+        <HeaderLabel />
         <NotificationMenu />
       </View>
       {showFilters && (
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index 734350c2..6e3649b3 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -270,6 +270,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
     }
     setShowFilterModal(!showFilterModal);
   };
+
   const getHeaderLabel = () => {
     if (isVisitPlan) {
       if (isLockedVisitPlanStatus) {
@@ -298,25 +299,23 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
     }
   }
 
+  const headerHeightValue = quickFiltersPresent ? headerHeightQuickFilters : headerHeight;
+  const showFilters = isVisitPlan && isLockedVisitPlanStatus ? false : !!casesList.length;
+
   return (
     <View style={[GenericStyles.fill, styles.container]}>
       <CaseListHeader
-        filterCount={filterCount}
+        // filterCount={filterCount}
         searchQuery={searchQuery}
         handleSearchChange={handleSearchChange}
         toggleFilterModal={toggleFilterModal}
-        headerHeight={quickFiltersPresent ? headerHeightQuickFilters : headerHeight}
-        headerLabel={getHeaderLabel()}
-        showFilters={isVisitPlan && isLockedVisitPlanStatus ? false : !!casesList.length}
+        headerHeight={headerHeightValue}
+        // headerLabel={getHeaderLabel()}
+        showFilters={showFilters}
         isVisitPlan={isVisitPlan}
       />
       {visitPlansUpdating ? (
-        <Animated.View
-          style={[
-            styles.fillOverlay,
-            { top: quickFiltersPresent ? headerHeightQuickFilters : headerHeight },
-          ]}
-        ></Animated.View>
+        <Animated.View style={[styles.fillOverlay, { top: headerHeightValue }]}></Animated.View>
       ) : null}
       <View style={GenericStyles.fill}>
         {filteredCasesListWithCTA.length ? (
diff --git a/src/screens/allCases/HeaderLabel.tsx b/src/screens/allCases/HeaderLabel.tsx
new file mode 100644
index 00000000..b8d7d58d
--- /dev/null
+++ b/src/screens/allCases/HeaderLabel.tsx
@@ -0,0 +1,23 @@
+import { StyleSheet, View } from 'react-native';
+import React from 'react';
+import Text from '../../../RN-UI-LIB/src/components/Text';
+import Heading from '../../../RN-UI-LIB/src/components/Heading';
+import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
+
+const HeaderLabel = () => {
+  return (
+    <View>
+      <Heading type="h3" style={[styles.headerLabel]}>
+        {/* {headerLabel} */}
+      </Heading>
+    </View>
+  );
+};
+
+export default HeaderLabel;
+
+const styles = StyleSheet.create({
+  headerLabel: {
+    color: COLORS.BACKGROUND.PRIMARY,
+  },
+});

From 5d0ff2f40b10c87c3d4b0a6e9778015b92d785e4 Mon Sep 17 00:00:00 2001
From: yashmantri <mantri.ramkishor@navi.com>
Date: Mon, 4 Sep 2023 13:07:32 +0530
Subject: [PATCH 02/22] TP-34788 | Select Agent view and bottom screen view

---
 src/assets/icons/ArrowDownOutlineIcon.tsx | 42 +++++++++++
 src/screens/allCases/CaseListHeader.tsx   | 13 +---
 src/screens/allCases/CasesList.tsx        | 87 +++++++++++++++++++++--
 src/screens/allCases/CompletedCase.tsx    |  5 +-
 src/screens/allCases/EmptyList.tsx        | 44 ++++--------
 src/screens/allCases/Filters.tsx          | 23 +++---
 src/screens/allCases/constants.ts         |  2 +
 7 files changed, 155 insertions(+), 61 deletions(-)
 create mode 100644 src/assets/icons/ArrowDownOutlineIcon.tsx

diff --git a/src/assets/icons/ArrowDownOutlineIcon.tsx b/src/assets/icons/ArrowDownOutlineIcon.tsx
new file mode 100644
index 00000000..faac3ec4
--- /dev/null
+++ b/src/assets/icons/ArrowDownOutlineIcon.tsx
@@ -0,0 +1,42 @@
+import React from 'react';
+import { View } from 'react-native';
+import Svg, { Path, Mask, G, Rect } from 'react-native-svg';
+import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
+
+interface IArrowRightOutlineIcon {
+  width?: number;
+  height?: number;
+  fillColor?: string;
+}
+
+const ArrowDownOutlineIcon: React.FC<IArrowRightOutlineIcon> = ({
+  width = 24,
+  height = 24,
+  fillColor = COLORS.TEXT.WHITE,
+}) => {
+  return (
+    <View>
+      <Svg width={width} height={height} viewBox={`0 0 ${width} ${height}`} fill="none">
+        <Mask
+          id="mask0_7859_44896"
+          mask-type="alpha"
+          maskUnits="userSpaceOnUse"
+          x="0"
+          y="0"
+          width={width}
+          height={height}
+        >
+          <Rect width={width} height={height} fill="#D9D9D9" />
+        </Mask>
+        <G mask="url(#mask0_7859_44896)">
+          <Path
+            d="M12 14.9758C11.8667 14.9758 11.7417 14.9549 11.625 14.9133C11.5083 14.8716 11.4 14.8008 11.3 14.7008L6.7 10.1008C6.51667 9.91745 6.425 9.68411 6.425 9.40078C6.425 9.11745 6.51667 8.88411 6.7 8.70078C6.88334 8.51745 7.11667 8.42578 7.4 8.42578C7.68334 8.42578 7.91667 8.51745 8.1 8.70078L12 12.6008L15.9 8.70078C16.0833 8.51745 16.3167 8.42578 16.6 8.42578C16.8833 8.42578 17.1167 8.51745 17.3 8.70078C17.4833 8.88411 17.575 9.11745 17.575 9.40078C17.575 9.68411 17.4833 9.91745 17.3 10.1008L12.7 14.7008C12.6 14.8008 12.4917 14.8716 12.375 14.9133C12.2583 14.9549 12.1333 14.9758 12 14.9758Z"
+            fill={fillColor}
+          />
+        </G>
+      </Svg>
+    </View>
+  );
+};
+
+export default ArrowDownOutlineIcon;
diff --git a/src/screens/allCases/CaseListHeader.tsx b/src/screens/allCases/CaseListHeader.tsx
index af0041ce..3d0397eb 100644
--- a/src/screens/allCases/CaseListHeader.tsx
+++ b/src/screens/allCases/CaseListHeader.tsx
@@ -1,25 +1,22 @@
 import { Animated, StyleSheet, View } from 'react-native';
 import React from 'react';
-import Heading from '../../../RN-UI-LIB/src/components/Heading';
 import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
 import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import Filters from './Filters';
 import NotificationMenu from '../../components/notificationMenu';
 
 interface ICaseListHeader {
-  filterCount: number;
   searchQuery: string;
   handleSearchChange: (val: string) => void;
   toggleFilterModal: () => void;
   headerHeight: Animated.AnimatedInterpolation<string | number>;
-  headerLabel: string;
+  headerLabel: React.ReactNode;
   showFilters: boolean;
   isVisitPlan?: boolean;
 }
 
 const CaseListHeader: React.FC<ICaseListHeader> = ({
   searchQuery,
-  filterCount,
   handleSearchChange,
   toggleFilterModal,
   headerHeight,
@@ -40,15 +37,12 @@ const CaseListHeader: React.FC<ICaseListHeader> = ({
           GenericStyles.pv10,
         ]}
       >
-        <Heading type="h3" style={[styles.headerLabel]}>
-          {headerLabel}
-        </Heading>
+        {headerLabel}
         <NotificationMenu />
       </View>
       {showFilters && (
         <Filters
           searchQuery={searchQuery}
-          filterCount={filterCount}
           handleSearchChange={handleSearchChange}
           toggleFilterModal={toggleFilterModal}
           isVisitPlan={isVisitPlan}
@@ -67,8 +61,5 @@ const styles = StyleSheet.create({
     width: '100%',
     backgroundColor: COLORS.BACKGROUND.INDIGO,
   },
-  headerLabel: {
-    color: COLORS.BACKGROUND.PRIMARY,
-  },
 });
 export default CaseListHeader;
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index 734350c2..fa48e0b6 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -6,6 +6,7 @@ import {
   NativeScrollEvent,
   NativeSyntheticEvent,
   StyleSheet,
+  TouchableOpacity,
   View,
 } from 'react-native';
 import { GenericStyles, SCREEN_HEIGHT, SCREEN_WIDTH } from '../../../RN-UI-LIB/src/styles';
@@ -36,13 +37,20 @@ import { CaseDetail } from '../caseDetails/interface';
 import CaseListHeader from './CaseListHeader';
 import { evaluateFilterForCases } from '../../components/screens/allCases/allCasesFilters/FilterUtils';
 import { debounce } from '../../components/utlis/commonFunctions';
-import { getCurrentScreen } from '../../components/utlis/navigationUtlis';
+import { getCurrentScreen, navigateToScreen } from '../../components/utlis/navigationUtlis';
 import { useFocusEffect } from '@react-navigation/native';
 import { FlashList } from '@shopify/flash-list';
 import { VisitPlanStatus } from '../../reducer/userSlice';
 import { dateFormat, DAY_MONTH_DATE_FORMAT } from '../../../RN-UI-LIB/src/utlis/dates';
 import { getAttemptedList, getNonAttemptedList } from './utils';
 import { GenericType } from '../../common/GenericTypes';
+import Heading from '../../../RN-UI-LIB/src/components/Heading';
+import GeneratingVisitPlan from '../../assets/icons/GeneratingVisitPlanIcon';
+import NoCasesFoundIcon from '../../assets/icons/NoCasesFoundIcon';
+import EmptyPageCheckIcon from '../../assets/icons/EmptyPageCheckIcon';
+import Text from '../../../RN-UI-LIB/src/components/Text';
+import BottomSheet from '../../../RN-UI-LIB/src/components/bottom_sheet/BottomSheet';
+import ArrowDownOutlineIcon from '../../assets/icons/ArrowDownOutlineIcon';
 
 export const getItem = (item: Array<ICaseItem>, index: number) => item[index];
 export const ESTIMATED_ITEM_SIZE = 250; // Average height of List item
@@ -74,7 +82,9 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
     }));
 
   const [showFilterModal, setShowFilterModal] = React.useState<boolean>(false);
+  const [showAgentSelectionBottomSheet, setShowAgentSelectionBottomSheet] = useState(false);
   const flashListRef = useRef<GenericType>(null);
+  const isAgentTLOrAM = true;
 
   const scrollAnimation = useRef(new Animated.Value(0)).current;
 
@@ -159,6 +169,11 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
       if (isVisitPlan) {
         return EmptyListMessages.NO_VISIT_PLANS;
       }
+
+      if (isAgentTLOrAM) {
+        return EmptyListMessages.NO_ACTIVE_ALLOCATIONS;
+      }
+
       return EmptyListMessages.NO_PENDING_CASES;
     };
 
@@ -169,21 +184,71 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
       if (isFilterApplied) {
         return EmptyListMessages.NO_CASES_FOUND_SUB;
       }
+      if (isAgentTLOrAM) {
+        return EmptyListMessages.SELECT_AGENT;
+      }
+    };
+
+    const getBtnDetails = () => {
+      if (isVisitPlan && !isFilterApplied && !isLockedVisitPlanStatus) {
+        return {
+          btnHandler: () => navigateToScreen('Cases'),
+          btnText: 'Create a visit plan',
+        };
+      }
+
+      if (isAgentTLOrAM) {
+        return {
+          btnHandler: () => setShowAgentSelectionBottomSheet(true),
+          btnText: 'Select Agent',
+        };
+      }
+    };
+
+    const renderIcon = () => {
+      if (isLockedVisitPlanStatus && isVisitPlan) {
+        return <GeneratingVisitPlan />;
+      }
+      if (isFilterApplied || !isVisitPlan) {
+        return <NoCasesFoundIcon />;
+      }
+      return <EmptyPageCheckIcon />;
     };
 
     const listEmptyComponent = (
       <EmptyList
         message={getEmptyListMessage()}
-        isVisitPlan={isVisitPlan}
-        isFilterApplied={isFilterApplied}
         subMessage={getSubMessage()}
-        isLockedVisitPlanStatus={isLockedVisitPlanStatus}
+        btnDetails={getBtnDetails()}
+        icon={renderIcon()}
       />
     );
 
     return { filteredCasesList: filteredListAfterQuery, listEmptyComponent };
   }, [casesList, caseDetails, filters, selectedFilters, searchQuery, isLockedVisitPlanStatus]);
 
+  const renderHeaderLabel = () => {
+    if (isAgentTLOrAM && !isVisitPlan) {
+      return (
+        <TouchableOpacity
+          style={GenericStyles.centerAlignedRow}
+          onPress={() => setShowAgentSelectionBottomSheet(true)}
+        >
+          <Heading type="h3" style={[styles.headerLabel]}>
+            {getHeaderLabel()}
+          </Heading>
+          <ArrowDownOutlineIcon />
+        </TouchableOpacity>
+      );
+    }
+
+    return (
+      <Heading type="h3" style={[styles.headerLabel]}>
+        {getHeaderLabel()}
+      </Heading>
+    );
+  };
+
   useEffect(() => {
     if (flashListRef?.current) {
       // @ts-expect-error
@@ -301,12 +366,11 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
   return (
     <View style={[GenericStyles.fill, styles.container]}>
       <CaseListHeader
-        filterCount={filterCount}
         searchQuery={searchQuery}
         handleSearchChange={handleSearchChange}
         toggleFilterModal={toggleFilterModal}
         headerHeight={quickFiltersPresent ? headerHeightQuickFilters : headerHeight}
-        headerLabel={getHeaderLabel()}
+        headerLabel={renderHeaderLabel()}
         showFilters={isVisitPlan && isLockedVisitPlanStatus ? false : !!casesList.length}
         isVisitPlan={isVisitPlan}
       />
@@ -351,6 +415,14 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
           isVisitPlan={isVisitPlan}
         />
       </Modal>
+      <BottomSheet
+        HeaderNode={() => <Text>Select Agent</Text>}
+        heightPercentage={100}
+        visible={showAgentSelectionBottomSheet}
+        setVisible={() => setShowAgentSelectionBottomSheet(!showAgentSelectionBottomSheet)}
+      >
+        <View style={GenericStyles.ph16}></View>
+      </BottomSheet>
     </View>
   );
 };
@@ -394,6 +466,9 @@ const styles = StyleSheet.create({
     paddingTop: VISIT_PLAN_HEADER_HEIGHT_MAX_WITH_QUICK_FILTERS,
     paddingBottom: 10,
   },
+  headerLabel: {
+    color: COLORS.BACKGROUND.PRIMARY,
+  },
 });
 
 export default CasesList;
diff --git a/src/screens/allCases/CompletedCase.tsx b/src/screens/allCases/CompletedCase.tsx
index 6d2e5727..1c4f091c 100644
--- a/src/screens/allCases/CompletedCase.tsx
+++ b/src/screens/allCases/CompletedCase.tsx
@@ -10,6 +10,7 @@ import { goBack } from '../../components/utlis/navigationUtlis';
 import { useAppSelector } from '../../hooks';
 import CaseItem from './CaseItem';
 import { CaseDetail } from '../caseDetails/interface';
+import EmptyPageCheckIcon from '../../assets/icons/EmptyPageCheckIcon';
 
 const getItem = (item: Array<ICaseItem>, index: number) => item[index];
 
@@ -41,7 +42,9 @@ const CompletedCase: React.FC = () => {
         keyExtractor={(item) => item.caseReferenceId}
         getItemCount={(item) => item.length}
         getItem={getItem}
-        ListEmptyComponent={<EmptyList message={EmptyListMessages.NO_COMPLETED_CASES} />}
+        ListEmptyComponent={
+          <EmptyList message={EmptyListMessages.NO_COMPLETED_CASES} icon={<EmptyPageCheckIcon />} />
+        }
       />
     </View>
   );
diff --git a/src/screens/allCases/EmptyList.tsx b/src/screens/allCases/EmptyList.tsx
index b753032a..94346a22 100644
--- a/src/screens/allCases/EmptyList.tsx
+++ b/src/screens/allCases/EmptyList.tsx
@@ -2,46 +2,26 @@ import { StyleSheet, View } from 'react-native';
 import React from 'react';
 import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import Heading from '../../../RN-UI-LIB/src/components/Heading';
-import EmptyPageCheckIcon from '../../assets/icons/EmptyPageCheckIcon';
 import Button from '../../../RN-UI-LIB/src/components/Button';
-import { navigateToScreen } from '../../components/utlis/navigationUtlis';
-import NoCasesFoundIcon from '../../assets/icons/NoCasesFoundIcon';
 import Text from '../../../RN-UI-LIB/src/components/Text';
-import GeneratingVisitPlan from '../../assets/icons/GeneratingVisitPlanIcon';
+
+interface BtnDetails {
+  btnHandler: () => void;
+  btnText: string;
+}
 
 interface IEmptyList {
   message: string;
+  icon: React.ReactNode;
   subMessage?: string;
-  isVisitPlan?: boolean;
-  isFilterApplied?: boolean;
-  isLockedVisitPlanStatus?: boolean;
+  btnDetails?: BtnDetails;
 }
 
-const EmptyList: React.FC<IEmptyList> = ({
-  message,
-  isVisitPlan,
-  isFilterApplied,
-  subMessage,
-  isLockedVisitPlanStatus,
-}) => {
-  const handleCreateVisitPlan = () => {
-    navigateToScreen('Cases');
-  };
-
-  const renderIcon = () => {
-    if (isLockedVisitPlanStatus && isVisitPlan) {
-      return <GeneratingVisitPlan />;
-    }
-    if (isFilterApplied || !isVisitPlan) {
-      return <NoCasesFoundIcon />;
-    }
-    return <EmptyPageCheckIcon />;
-  };
-
+const EmptyList: React.FC<IEmptyList> = ({ message, subMessage, icon, btnDetails }) => {
   return (
     <View>
       <View style={[GenericStyles.w100, styles.centerAbsolute]}>
-        {renderIcon()}
+        {icon}
         <View style={[GenericStyles.mt12, styles.text]}>
           <Heading
             dark
@@ -56,11 +36,11 @@ const EmptyList: React.FC<IEmptyList> = ({
               {subMessage}
             </Text>
           ) : null}
-          {isVisitPlan && !isFilterApplied && !isLockedVisitPlanStatus ? (
+          {btnDetails ? (
             <Button
-              title={'Create a visit plan'}
+              title={btnDetails.btnText}
               style={[GenericStyles.w100, GenericStyles.mt24]}
-              onPress={handleCreateVisitPlan}
+              onPress={btnDetails.btnHandler}
             />
           ) : null}
         </View>
diff --git a/src/screens/allCases/Filters.tsx b/src/screens/allCases/Filters.tsx
index c556df82..a243cb85 100644
--- a/src/screens/allCases/Filters.tsx
+++ b/src/screens/allCases/Filters.tsx
@@ -13,7 +13,6 @@ import { VisitPlanStatus } from '../../reducer/userSlice';
 import { FeedbackStatus } from '../caseDetails/interface';
 
 interface IFilters {
-  filterCount: number;
   searchQuery: string;
   handleSearchChange: (val: string) => void;
   toggleFilterModal: () => void;
@@ -22,20 +21,22 @@ interface IFilters {
 
 const Filters: React.FC<IFilters> = ({
   searchQuery,
-  filterCount,
   handleSearchChange,
   toggleFilterModal,
   isVisitPlan,
 }) => {
-  const { attemptedCount, totalPinnedCount, isVisitPlanStatusLocked } = useAppSelector((state) => ({
-    totalPinnedCount: state.allCases.pinnedList.length,
-    attemptedCount: state.allCases.pinnedList.filter(
-      (item) =>
-        state.allCases.caseDetails[item.caseReferenceId]?.feedbackStatus ===
-        FeedbackStatus.ATTEMPTED
-    )?.length,
-    isVisitPlanStatusLocked: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
-  }));
+  const { attemptedCount, totalPinnedCount, isVisitPlanStatusLocked, filterCount } = useAppSelector(
+    (state) => ({
+      totalPinnedCount: state.allCases.pinnedList.length,
+      attemptedCount: state.allCases.pinnedList.filter(
+        (item) =>
+          state.allCases.caseDetails[item.caseReferenceId]?.feedbackStatus ===
+          FeedbackStatus.ATTEMPTED
+      )?.length,
+      isVisitPlanStatusLocked: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
+      filterCount: isVisitPlan ? state.filters.filterCountVisitPlan : state.filters.filterCount,
+    })
+  );
   const getBarWidth = () => {
     if (!totalPinnedCount) {
       return 0;
diff --git a/src/screens/allCases/constants.ts b/src/screens/allCases/constants.ts
index 5fad1303..99052f0a 100644
--- a/src/screens/allCases/constants.ts
+++ b/src/screens/allCases/constants.ts
@@ -45,6 +45,8 @@ export const EmptyListMessages = {
   NO_CASES_FOUND_SUB: 'Try removing or adding different filters, or search something else',
   GENERATING_VISIT_PLAN: 'Generating a visit plan for',
   GENERATING_VISIT_PLAN_SUB: '*Any pending cases from previous visit plan will be added',
+  NO_ACTIVE_ALLOCATIONS: 'You don’t have any active allocations',
+  SELECT_AGENT: 'Select an agent to view cases',
 };
 
 export const ToastMessages = {

From 3436edf35225a205ea6ff6a9d69b88055c4e5a6f Mon Sep 17 00:00:00 2001
From: yashmantri <mantri.ramkishor@navi.com>
Date: Mon, 4 Sep 2023 15:57:13 +0530
Subject: [PATCH 03/22] TP-34788 | Code Refactored

---
 src/screens/allCases/CaseListHeader.tsx |  13 ++-
 src/screens/allCases/CasesList.tsx      | 123 ++----------------------
 src/screens/allCases/CompletedCase.tsx  |   7 +-
 src/screens/allCases/EmptyList.tsx      | 103 +++++++++++++++++---
 src/screens/allCases/HeaderLabel.tsx    |  59 ++++++++++--
 5 files changed, 163 insertions(+), 142 deletions(-)

diff --git a/src/screens/allCases/CaseListHeader.tsx b/src/screens/allCases/CaseListHeader.tsx
index 3d0397eb..43f74431 100644
--- a/src/screens/allCases/CaseListHeader.tsx
+++ b/src/screens/allCases/CaseListHeader.tsx
@@ -4,14 +4,16 @@ import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
 import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import Filters from './Filters';
 import NotificationMenu from '../../components/notificationMenu';
+import HeaderLabel from './HeaderLabel';
 
 interface ICaseListHeader {
   searchQuery: string;
   handleSearchChange: (val: string) => void;
   toggleFilterModal: () => void;
   headerHeight: Animated.AnimatedInterpolation<string | number>;
-  headerLabel: React.ReactNode;
   showFilters: boolean;
+  setShowAgentSelectionBottomSheet: (val: boolean) => void;
+  filteredListCount: number;
   isVisitPlan?: boolean;
 }
 
@@ -20,8 +22,9 @@ const CaseListHeader: React.FC<ICaseListHeader> = ({
   handleSearchChange,
   toggleFilterModal,
   headerHeight,
-  headerLabel,
   showFilters,
+  setShowAgentSelectionBottomSheet,
+  filteredListCount,
   isVisitPlan,
 }) => {
   return (
@@ -37,7 +40,11 @@ const CaseListHeader: React.FC<ICaseListHeader> = ({
           GenericStyles.pv10,
         ]}
       >
-        {headerLabel}
+        <HeaderLabel
+          setShowAgentSelectionBottomSheet={setShowAgentSelectionBottomSheet}
+          filteredListCount={filteredListCount}
+          isVisitPlan={isVisitPlan}
+        />
         <NotificationMenu />
       </View>
       {showFilters && (
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index 16cba93c..4fbf948e 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -6,14 +6,13 @@ import {
   NativeScrollEvent,
   NativeSyntheticEvent,
   StyleSheet,
-  TouchableOpacity,
   View,
 } from 'react-native';
 import { GenericStyles, SCREEN_HEIGHT, SCREEN_WIDTH } from '../../../RN-UI-LIB/src/styles';
 import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
 import { RootState } from '../../store/store';
 import { CaseTypes, ICaseItem, ICaseItemCaseDetailObj } from './interface';
-import { EmptyListMessages, LIST_HEADER_ITEMS, ListHeaderItems } from './constants';
+import { LIST_HEADER_ITEMS, ListHeaderItems } from './constants';
 import CaseItem from './CaseItem';
 import { Search } from '../../../RN-UI-LIB/src/utlis/search';
 import FiltersContainer from '../../components/screens/allCases/allCasesFilters/FiltersContainer';
@@ -37,20 +36,14 @@ import { CaseDetail } from '../caseDetails/interface';
 import CaseListHeader from './CaseListHeader';
 import { evaluateFilterForCases } from '../../components/screens/allCases/allCasesFilters/FilterUtils';
 import { debounce } from '../../components/utlis/commonFunctions';
-import { getCurrentScreen, navigateToScreen } from '../../components/utlis/navigationUtlis';
+import { getCurrentScreen } from '../../components/utlis/navigationUtlis';
 import { useFocusEffect } from '@react-navigation/native';
 import { FlashList } from '@shopify/flash-list';
 import { VisitPlanStatus } from '../../reducer/userSlice';
-import { dateFormat, DAY_MONTH_DATE_FORMAT } from '../../../RN-UI-LIB/src/utlis/dates';
 import { getAttemptedList, getNonAttemptedList } from './utils';
 import { GenericType } from '../../common/GenericTypes';
-import Heading from '../../../RN-UI-LIB/src/components/Heading';
-import GeneratingVisitPlan from '../../assets/icons/GeneratingVisitPlanIcon';
-import NoCasesFoundIcon from '../../assets/icons/NoCasesFoundIcon';
-import EmptyPageCheckIcon from '../../assets/icons/EmptyPageCheckIcon';
 import Text from '../../../RN-UI-LIB/src/components/Text';
 import BottomSheet from '../../../RN-UI-LIB/src/components/bottom_sheet/BottomSheet';
-import ArrowDownOutlineIcon from '../../assets/icons/ArrowDownOutlineIcon';
 
 export const getItem = (item: Array<ICaseItem>, index: number) => item[index];
 export const ESTIMATED_ITEM_SIZE = 250; // Average height of List item
@@ -84,7 +77,6 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
   const [showFilterModal, setShowFilterModal] = React.useState<boolean>(false);
   const [showAgentSelectionBottomSheet, setShowAgentSelectionBottomSheet] = useState(false);
   const flashListRef = useRef<GenericType>(null);
-  const isAgentTLOrAM = true;
 
   const scrollAnimation = useRef(new Animated.Value(0)).current;
 
@@ -153,102 +145,18 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
         : filteredList;
 
     const isFilterApplied = filterCount > 0 || searchQuery.length > 0;
-    const getEmptyListMessage = () => {
-      if (isLockedVisitPlanStatus && isVisitPlan) {
-        const currentDate = new Date();
-        return (
-          EmptyListMessages.GENERATING_VISIT_PLAN +
-          ' ' +
-          dateFormat(currentDate, DAY_MONTH_DATE_FORMAT) +
-          '...'
-        );
-      }
-      if (isFilterApplied) {
-        return EmptyListMessages.NO_CASES_FOUND;
-      }
-      if (isVisitPlan) {
-        return EmptyListMessages.NO_VISIT_PLANS;
-      }
-
-      if (isAgentTLOrAM) {
-        return EmptyListMessages.NO_ACTIVE_ALLOCATIONS;
-      }
-
-      return EmptyListMessages.NO_PENDING_CASES;
-    };
-
-    const getSubMessage = () => {
-      if (isVisitPlan && isLockedVisitPlanStatus) {
-        return EmptyListMessages.GENERATING_VISIT_PLAN_SUB;
-      }
-      if (isFilterApplied) {
-        return EmptyListMessages.NO_CASES_FOUND_SUB;
-      }
-      if (isAgentTLOrAM) {
-        return EmptyListMessages.SELECT_AGENT;
-      }
-    };
-
-    const getBtnDetails = () => {
-      if (isVisitPlan && !isFilterApplied && !isLockedVisitPlanStatus) {
-        return {
-          btnHandler: () => navigateToScreen('Cases'),
-          btnText: 'Create a visit plan',
-        };
-      }
-
-      if (isAgentTLOrAM) {
-        return {
-          btnHandler: () => setShowAgentSelectionBottomSheet(true),
-          btnText: 'Select Agent',
-        };
-      }
-    };
-
-    const renderIcon = () => {
-      if (isLockedVisitPlanStatus && isVisitPlan) {
-        return <GeneratingVisitPlan />;
-      }
-      if (isFilterApplied || !isVisitPlan) {
-        return <NoCasesFoundIcon />;
-      }
-      return <EmptyPageCheckIcon />;
-    };
 
     const listEmptyComponent = (
       <EmptyList
-        message={getEmptyListMessage()}
-        subMessage={getSubMessage()}
-        btnDetails={getBtnDetails()}
-        icon={renderIcon()}
+        isVisitPlan={isVisitPlan}
+        isFilterApplied={isFilterApplied}
+        setShowAgentSelectionBottomSheet={setShowAgentSelectionBottomSheet}
       />
     );
 
     return { filteredCasesList: filteredListAfterQuery, listEmptyComponent };
   }, [casesList, caseDetails, filters, selectedFilters, searchQuery, isLockedVisitPlanStatus]);
 
-  const renderHeaderLabel = () => {
-    if (isAgentTLOrAM && !isVisitPlan) {
-      return (
-        <TouchableOpacity
-          style={GenericStyles.centerAlignedRow}
-          onPress={() => setShowAgentSelectionBottomSheet(true)}
-        >
-          <Heading type="h3" style={[styles.headerLabel]}>
-            {getHeaderLabel()}
-          </Heading>
-          <ArrowDownOutlineIcon />
-        </TouchableOpacity>
-      );
-    }
-
-    return (
-      <Heading type="h3" style={[styles.headerLabel]}>
-        {getHeaderLabel()}
-      </Heading>
-    );
-  };
-
   useEffect(() => {
     if (flashListRef?.current) {
       // @ts-expect-error
@@ -336,18 +244,6 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
     setShowFilterModal(!showFilterModal);
   };
 
-  const getHeaderLabel = () => {
-    if (isVisitPlan) {
-      if (isLockedVisitPlanStatus) {
-        return 'Generating visit plan';
-      }
-      const currentDate = new Date();
-      const formattedDate = dateFormat(currentDate, DAY_MONTH_DATE_FORMAT);
-      return formattedDate;
-    }
-    return `My Cases (${filteredCasesList.length})`;
-  };
-
   let listStyle = {};
 
   if (isVisitPlan) {
@@ -370,13 +266,13 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
   return (
     <View style={[GenericStyles.fill, styles.container]}>
       <CaseListHeader
-        // filterCount={filterCount}
         searchQuery={searchQuery}
         handleSearchChange={handleSearchChange}
         toggleFilterModal={toggleFilterModal}
         headerHeight={quickFiltersPresent ? headerHeightQuickFilters : headerHeight}
-        headerLabel={renderHeaderLabel()}
-        showFilters={isVisitPlan && isLockedVisitPlanStatus ? false : !!casesList.length}
+        setShowAgentSelectionBottomSheet={setShowAgentSelectionBottomSheet}
+        filteredListCount={filteredCasesList?.length}
+        showFilters={showFilters}
         isVisitPlan={isVisitPlan}
       />
       {visitPlansUpdating ? (
@@ -466,9 +362,6 @@ const styles = StyleSheet.create({
     paddingTop: VISIT_PLAN_HEADER_HEIGHT_MAX_WITH_QUICK_FILTERS,
     paddingBottom: 10,
   },
-  headerLabel: {
-    color: COLORS.BACKGROUND.PRIMARY,
-  },
 });
 
 export default CasesList;
diff --git a/src/screens/allCases/CompletedCase.tsx b/src/screens/allCases/CompletedCase.tsx
index 1c4f091c..5b9a7f9a 100644
--- a/src/screens/allCases/CompletedCase.tsx
+++ b/src/screens/allCases/CompletedCase.tsx
@@ -10,7 +10,6 @@ import { goBack } from '../../components/utlis/navigationUtlis';
 import { useAppSelector } from '../../hooks';
 import CaseItem from './CaseItem';
 import { CaseDetail } from '../caseDetails/interface';
-import EmptyPageCheckIcon from '../../assets/icons/EmptyPageCheckIcon';
 
 const getItem = (item: Array<ICaseItem>, index: number) => item[index];
 
@@ -31,7 +30,7 @@ const CompletedCase: React.FC = () => {
       />
       <VirtualizedList
         contentContainerStyle={[completeCasesList.length ? null : GenericStyles.fill, styles.list]}
-        data={completeCasesList}
+        data={[completeCasesList]}
         initialNumToRender={4}
         renderItem={(row) => {
           const caseDetailItem = caseDetails[row.item.caseReferenceId] as CaseDetail;
@@ -42,9 +41,7 @@ const CompletedCase: React.FC = () => {
         keyExtractor={(item) => item.caseReferenceId}
         getItemCount={(item) => item.length}
         getItem={getItem}
-        ListEmptyComponent={
-          <EmptyList message={EmptyListMessages.NO_COMPLETED_CASES} icon={<EmptyPageCheckIcon />} />
-        }
+        ListEmptyComponent={<EmptyList isCompleted />}
       />
     </View>
   );
diff --git a/src/screens/allCases/EmptyList.tsx b/src/screens/allCases/EmptyList.tsx
index 94346a22..f976ab0b 100644
--- a/src/screens/allCases/EmptyList.tsx
+++ b/src/screens/allCases/EmptyList.tsx
@@ -4,24 +4,105 @@ import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import Heading from '../../../RN-UI-LIB/src/components/Heading';
 import Button from '../../../RN-UI-LIB/src/components/Button';
 import Text from '../../../RN-UI-LIB/src/components/Text';
-
-interface BtnDetails {
-  btnHandler: () => void;
-  btnText: string;
-}
+import { useAppSelector } from '../../hooks';
+import { RootState } from '../../store/store';
+import GeneratingVisitPlan from '../../assets/icons/GeneratingVisitPlanIcon';
+import NoCasesFoundIcon from '../../assets/icons/NoCasesFoundIcon';
+import EmptyPageCheckIcon from '../../assets/icons/EmptyPageCheckIcon';
+import { VisitPlanStatus } from '../../reducer/userSlice';
+import { EmptyListMessages } from './constants';
+import { navigateToScreen } from '../../components/utlis/navigationUtlis';
+import { dateFormat, DAY_MONTH_DATE_FORMAT } from '../../../RN-UI-LIB/src/utlis/dates';
 
 interface IEmptyList {
-  message: string;
-  icon: React.ReactNode;
-  subMessage?: string;
-  btnDetails?: BtnDetails;
+  isCompleted?: boolean;
+  isVisitPlan?: boolean;
+  isFilterApplied?: boolean;
+  setShowAgentSelectionBottomSheet?: (val: boolean) => void;
 }
 
-const EmptyList: React.FC<IEmptyList> = ({ message, subMessage, icon, btnDetails }) => {
+const EmptyList: React.FC<IEmptyList> = (props) => {
+  const { isCompleted, isVisitPlan, isFilterApplied, setShowAgentSelectionBottomSheet } = props;
+
+  const { isLockedVisitPlanStatus } = useAppSelector((state: RootState) => ({
+    isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
+  }));
+
+  const isAgentTLOrAM = true;
+
+  const renderIcon = () => {
+    if (isLockedVisitPlanStatus && isVisitPlan) {
+      return <GeneratingVisitPlan />;
+    }
+    if (isFilterApplied || !isVisitPlan) {
+      return <NoCasesFoundIcon />;
+    }
+    return <EmptyPageCheckIcon />;
+  };
+
+  const getEmptyListMessage = () => {
+    if (isCompleted) {
+      return EmptyListMessages.NO_COMPLETED_CASES;
+    }
+    if (isLockedVisitPlanStatus && isVisitPlan) {
+      const currentDate = new Date();
+      return (
+        EmptyListMessages.GENERATING_VISIT_PLAN +
+        ' ' +
+        dateFormat(currentDate, DAY_MONTH_DATE_FORMAT) +
+        '...'
+      );
+    }
+    if (isFilterApplied) {
+      return EmptyListMessages.NO_CASES_FOUND;
+    }
+    if (isVisitPlan) {
+      return EmptyListMessages.NO_VISIT_PLANS;
+    }
+
+    if (isAgentTLOrAM) {
+      return EmptyListMessages.NO_ACTIVE_ALLOCATIONS;
+    }
+
+    return EmptyListMessages.NO_PENDING_CASES;
+  };
+
+  const getSubMessage = () => {
+    if (isVisitPlan && isLockedVisitPlanStatus) {
+      return EmptyListMessages.GENERATING_VISIT_PLAN_SUB;
+    }
+    if (isFilterApplied) {
+      return EmptyListMessages.NO_CASES_FOUND_SUB;
+    }
+    if (isAgentTLOrAM) {
+      return EmptyListMessages.SELECT_AGENT;
+    }
+  };
+
+  const getBtnDetails = () => {
+    if (isVisitPlan && !isFilterApplied && !isLockedVisitPlanStatus) {
+      return {
+        btnHandler: () => navigateToScreen('Cases'),
+        btnText: 'Create a visit plan',
+      };
+    }
+
+    if (isAgentTLOrAM && setShowAgentSelectionBottomSheet) {
+      return {
+        btnHandler: () => setShowAgentSelectionBottomSheet(true),
+        btnText: 'Select Agent',
+      };
+    }
+  };
+
+  const message = getEmptyListMessage();
+  const subMessage = getSubMessage();
+  const btnDetails = getBtnDetails();
+
   return (
     <View>
       <View style={[GenericStyles.w100, styles.centerAbsolute]}>
-        {icon}
+        {renderIcon()}
         <View style={[GenericStyles.mt12, styles.text]}>
           <Heading
             dark
diff --git a/src/screens/allCases/HeaderLabel.tsx b/src/screens/allCases/HeaderLabel.tsx
index b8d7d58d..f5059c24 100644
--- a/src/screens/allCases/HeaderLabel.tsx
+++ b/src/screens/allCases/HeaderLabel.tsx
@@ -1,16 +1,59 @@
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, TouchableOpacity, View } from 'react-native';
 import React from 'react';
-import Text from '../../../RN-UI-LIB/src/components/Text';
 import Heading from '../../../RN-UI-LIB/src/components/Heading';
 import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
+import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
+import ArrowDownOutlineIcon from '../../assets/icons/ArrowDownOutlineIcon';
+import { useAppSelector } from '../../hooks';
+import { RootState } from '../../store/store';
+import { VisitPlanStatus } from '../../reducer/userSlice';
+import { dateFormat, DAY_MONTH_DATE_FORMAT } from '../../../RN-UI-LIB/src/utlis/dates';
+
+interface HeaderLabelProps {
+  setShowAgentSelectionBottomSheet: (val: boolean) => void;
+  filteredListCount: number;
+  isVisitPlan?: boolean;
+}
+
+const HeaderLabel: React.FC<HeaderLabelProps> = (props) => {
+  const { setShowAgentSelectionBottomSheet, filteredListCount, isVisitPlan } = props;
+
+  const { isLockedVisitPlanStatus } = useAppSelector((state: RootState) => ({
+    isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
+  }));
+
+  const isAgentTLOrAM = true;
+
+  const getHeaderLabel = () => {
+    if (isVisitPlan) {
+      if (isLockedVisitPlanStatus) {
+        return 'Generating visit plan';
+      }
+      const currentDate = new Date();
+      const formattedDate = dateFormat(currentDate, DAY_MONTH_DATE_FORMAT);
+      return formattedDate;
+    }
+    return `My Cases (${filteredListCount})`;
+  };
+
+  if (isAgentTLOrAM && !isVisitPlan) {
+    return (
+      <TouchableOpacity
+        style={GenericStyles.centerAlignedRow}
+        onPress={() => setShowAgentSelectionBottomSheet(true)}
+      >
+        <Heading type="h3" style={[styles.headerLabel]}>
+          {getHeaderLabel()}
+        </Heading>
+        <ArrowDownOutlineIcon />
+      </TouchableOpacity>
+    );
+  }
 
-const HeaderLabel = () => {
   return (
-    <View>
-      <Heading type="h3" style={[styles.headerLabel]}>
-        {/* {headerLabel} */}
-      </Heading>
-    </View>
+    <Heading type="h3" style={[styles.headerLabel]}>
+      {getHeaderLabel()}
+    </Heading>
   );
 };
 

From 70d041a640099f6f3e49ae3a3cbeddeb3a102902 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Tue, 5 Sep 2023 00:11:05 +0530
Subject: [PATCH 04/22] TP-34788 | AM/TL changes

---
 package.json                       |  1 +
 src/screens/allCases/CasesList.tsx | 63 ++++++++++++++++++++++--------
 src/screens/allCases/index.tsx     | 29 ++++++++------
 3 files changed, 63 insertions(+), 30 deletions(-)

diff --git a/package.json b/package.json
index 06bdde64..8b8e1674 100644
--- a/package.json
+++ b/package.json
@@ -41,6 +41,7 @@
     "@react-navigation/native": "6.1.4",
     "@react-navigation/native-stack": "6.9.4",
     "@reduxjs/toolkit": "1.9.1",
+    "@sanar/react-native-highlight-text": "^1.0.2",
     "@sentry/react-native": "5.5.0",
     "@shopify/flash-list": "1.4.3",
     "@supersami/rn-foreground-service": "^2.1.0",
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index 4fbf948e..81ed0405 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -6,6 +6,7 @@ import {
   NativeScrollEvent,
   NativeSyntheticEvent,
   StyleSheet,
+  TouchableOpacity,
   View,
 } from 'react-native';
 import { GenericStyles, SCREEN_HEIGHT, SCREEN_WIDTH } from '../../../RN-UI-LIB/src/styles';
@@ -17,7 +18,7 @@ import CaseItem from './CaseItem';
 import { Search } from '../../../RN-UI-LIB/src/utlis/search';
 import FiltersContainer from '../../components/screens/allCases/allCasesFilters/FiltersContainer';
 import EmptyList from './EmptyList';
-import { useAppSelector } from '../../hooks';
+import { useAppDispatch, useAppSelector } from '../../hooks';
 import { addClickstreamEvent } from '../../services/clickstreamEventService';
 import {
   CLICKSTREAM_EVENT_NAMES,
@@ -44,6 +45,11 @@ import { getAttemptedList, getNonAttemptedList } from './utils';
 import { GenericType } from '../../common/GenericTypes';
 import Text from '../../../RN-UI-LIB/src/components/Text';
 import BottomSheet from '../../../RN-UI-LIB/src/components/bottom_sheet/BottomSheet';
+import Heading from '../../../RN-UI-LIB/src/components/Heading';
+import { row } from '../emiSchedule/constants';
+import CloseIcon from '../../../RN-UI-LIB/src/Icons/CloseIcon';
+import AgentsListContainer from './AgentsListContainer';
+import { setShowAgentSelectionBottomSheet } from '../../reducer/reporteesSlice';
 
 export const getItem = (item: Array<ICaseItem>, index: number) => item[index];
 export const ESTIMATED_ITEM_SIZE = 250; // Average height of List item
@@ -63,19 +69,27 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
     selectedTodoListMap,
   } = useAppSelector((state: RootState) => state.allCases);
   const [searchQuery, setSearchQuery] = useState('');
-  const { filters, filterCount, selectedFilters, quickFiltersPresent, isLockedVisitPlanStatus } =
-    useAppSelector((state: RootState) => ({
-      filters: state.filters.filters,
-      filterCount: isVisitPlan ? state.filters.filterCountVisitPlan : state.filters.filterCount,
-      selectedFilters: isVisitPlan
-        ? state.filters.selectedFiltersVisitPlan
-        : state.filters.selectedFilters,
-      quickFiltersPresent: state?.filters?.quickFilters?.length > 0,
-      isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
-    }));
+  const {
+    filters,
+    filterCount,
+    selectedFilters,
+    quickFiltersPresent,
+    isLockedVisitPlanStatus,
+    showAgentSelectionBottomSheet,
+  } = useAppSelector((state: RootState) => ({
+    filters: state.filters.filters,
+    filterCount: isVisitPlan ? state.filters.filterCountVisitPlan : state.filters.filterCount,
+    selectedFilters: isVisitPlan
+      ? state.filters.selectedFiltersVisitPlan
+      : state.filters.selectedFilters,
+    quickFiltersPresent: state?.filters?.quickFilters?.length > 0,
+    isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
+    showAgentSelectionBottomSheet: state.reportees.showAgentSelectionBottomSheet,
+  }));
+
+  const dispatch = useAppDispatch();
 
   const [showFilterModal, setShowFilterModal] = React.useState<boolean>(false);
-  const [showAgentSelectionBottomSheet, setShowAgentSelectionBottomSheet] = useState(false);
   const flashListRef = useRef<GenericType>(null);
 
   const scrollAnimation = useRef(new Animated.Value(0)).current;
@@ -150,7 +164,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
       <EmptyList
         isVisitPlan={isVisitPlan}
         isFilterApplied={isFilterApplied}
-        setShowAgentSelectionBottomSheet={setShowAgentSelectionBottomSheet}
+        setShowAgentSelectionBottomSheet={toggleAgentSelectionBottomSheet}
       />
     );
 
@@ -263,6 +277,10 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
   const headerHeightValue = quickFiltersPresent ? headerHeightQuickFilters : headerHeight;
   const showFilters = isVisitPlan && isLockedVisitPlanStatus ? false : !!casesList.length;
 
+  const toggleAgentSelectionBottomSheet = () => {
+    dispatch(setShowAgentSelectionBottomSheet(!showAgentSelectionBottomSheet));
+  };
+
   return (
     <View style={[GenericStyles.fill, styles.container]}>
       <CaseListHeader
@@ -270,7 +288,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
         handleSearchChange={handleSearchChange}
         toggleFilterModal={toggleFilterModal}
         headerHeight={quickFiltersPresent ? headerHeightQuickFilters : headerHeight}
-        setShowAgentSelectionBottomSheet={setShowAgentSelectionBottomSheet}
+        setShowAgentSelectionBottomSheet={toggleAgentSelectionBottomSheet}
         filteredListCount={filteredCasesList?.length}
         showFilters={showFilters}
         isVisitPlan={isVisitPlan}
@@ -312,12 +330,23 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan }) => {
         />
       </Modal>
       <BottomSheet
-        HeaderNode={() => <Text>Select Agent</Text>}
+        HeaderNode={() => (
+          <View style={[...row, GenericStyles.ph16]}>
+            <Heading dark type="h4">
+              View team’s assigned cases
+            </Heading>
+            <TouchableOpacity activeOpacity={0.7} onPress={toggleAgentSelectionBottomSheet}>
+              <CloseIcon color={COLORS.TEXT.LIGHT} />
+            </TouchableOpacity>
+          </View>
+        )}
         heightPercentage={100}
         visible={showAgentSelectionBottomSheet}
-        setVisible={() => setShowAgentSelectionBottomSheet(!showAgentSelectionBottomSheet)}
+        setVisible={toggleAgentSelectionBottomSheet}
       >
-        <View style={GenericStyles.ph16}></View>
+        <View style={[GenericStyles.mt16, GenericStyles.fill]}>
+          <AgentsListContainer />
+        </View>
       </BottomSheet>
     </View>
   );
diff --git a/src/screens/allCases/index.tsx b/src/screens/allCases/index.tsx
index a0770892..7797750c 100644
--- a/src/screens/allCases/index.tsx
+++ b/src/screens/allCases/index.tsx
@@ -27,27 +27,30 @@ const AllCasesMain = () => {
   const { pendingList, pinnedList, loading } = useAppSelector((state) => state.allCases);
   const userState = useAppSelector((state: RootState) => state.user);
   const dispatch = useAppDispatch();
+  const isAgentTLOrAM = true;
 
-  const HOME_SCREENS: ITabScreen[] = useMemo(
-    () => [
+  const HOME_SCREENS: ITabScreen[] = useMemo(() => {
+    const bottomSheetScreens = [
       {
         name: BOTTOM_TAB_ROUTES.Cases,
         component: () => <CasesList casesList={pendingList} />,
         icon: CasesIcon,
       },
-      {
+    ];
+    if (!isAgentTLOrAM) {
+      bottomSheetScreens.push({
         name: BOTTOM_TAB_ROUTES.VisitPlan,
         component: () => <CasesList casesList={pinnedList} isVisitPlan />,
         icon: VisitPlanIcon,
-      },
-      {
-        name: BOTTOM_TAB_ROUTES.Profile,
-        component: () => <Profile />,
-        icon: ProfileIcon,
-      },
-    ],
-    [pendingList, pinnedList]
-  );
+      });
+    }
+    bottomSheetScreens.push({
+      name: BOTTOM_TAB_ROUTES.Profile,
+      component: () => <Profile />,
+      icon: ProfileIcon,
+    });
+    return bottomSheetScreens;
+  }, [pendingList, pinnedList, isAgentTLOrAM]);
 
   const onTabPressHandler = (e: any) => {
     addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_TAB_SWITCH, {
@@ -72,7 +75,7 @@ const AllCasesMain = () => {
       <FullScreenLoader loading={loading} />
       <BottomNavigator
         screens={HOME_SCREENS}
-        initialRoute={HOME_SCREENS[1].name}
+        initialRoute={isAgentTLOrAM ? BOTTOM_TAB_ROUTES.Cases : BOTTOM_TAB_ROUTES.VisitPlan}
         onTabPress={(e) => onTabPressHandler(e)}
       />
       <CasesActionButtons />

From 958aa823d1c7a72011cd7e50f0b9380a91017769 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 7 Sep 2023 13:34:19 +0530
Subject: [PATCH 05/22] TP-34788 | Cosmos for AM/TLs

---
 App.tsx                                       |   7 +-
 package.json                                  |   1 -
 src/action/authActions.ts                     |  16 ++-
 src/action/reporteesActions.ts                |  19 ++++
 src/common/TrackingComponent.tsx              |  16 ++-
 src/components/utlis/apiHelper.ts             |   4 +
 src/hooks/useFirestoreUpdates.ts              |  53 +++++++--
 src/reducer/allCasesSlice.ts                  |  28 +----
 src/reducer/reporteesSlice.ts                 |  36 ++++++
 src/reducer/userSlice.ts                      |  22 +++-
 src/screens/Profile/index.tsx                 |  93 +++++++++-------
 src/screens/allCases/AgentListItem.tsx        |  79 ++++++++++++++
 src/screens/allCases/AgentListSearchbar.tsx   |  21 ++++
 src/screens/allCases/AgentListView.tsx        | 103 ++++++++++++++++++
 src/screens/allCases/AgentListViewLoading.tsx |  21 ++++
 src/screens/allCases/AgentsListContainer.tsx  |  72 ++++++++++++
 src/screens/allCases/CasesList.tsx            |   3 +-
 src/screens/allCases/EmptyList.tsx            |  16 ++-
 src/screens/allCases/HeaderLabel.tsx          |  64 +++++++++--
 src/screens/allCases/ListItem.tsx             |   3 +-
 src/screens/allCases/index.tsx                |   8 +-
 src/screens/allCases/interface.ts             |  12 ++
 src/screens/allCases/utils.ts                 |  34 +++++-
 src/screens/auth/ProtectedRouter.tsx          |   4 +
 24 files changed, 625 insertions(+), 110 deletions(-)
 create mode 100644 src/action/reporteesActions.ts
 create mode 100644 src/reducer/reporteesSlice.ts
 create mode 100644 src/screens/allCases/AgentListItem.tsx
 create mode 100644 src/screens/allCases/AgentListSearchbar.tsx
 create mode 100644 src/screens/allCases/AgentListView.tsx
 create mode 100644 src/screens/allCases/AgentListViewLoading.tsx
 create mode 100644 src/screens/allCases/AgentsListContainer.tsx

diff --git a/App.tsx b/App.tsx
index 751c466c..ab69ddbd 100644
--- a/App.tsx
+++ b/App.tsx
@@ -120,11 +120,14 @@ const App = () => {
 
   return (
     <Provider store={store}>
-      <PersistGate loading={<FullScreenLoader loading />} persistor={persistor}>
+      <PersistGate
+        loading={<FullScreenLoader loading isTranslucent={false} />}
+        persistor={persistor}
+      >
         <NavigationContainer ref={navigationRef}>
           <StatusBar backgroundColor={COLORS.BACKGROUND.INDIGO_DARK} />
           <SuspenseLoader
-            fallBack={<FullScreenLoader loading />}
+            fallBack={<FullScreenLoader loading isTranslucent={false} />}
             loading={!isGlobalDocumentMapLoaded}
             children={
               <ErrorBoundary>{permissions ? <AuthRouter /> : <Permissions />}</ErrorBoundary>
diff --git a/package.json b/package.json
index 6db56061..31478239 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,6 @@
     "@react-navigation/native": "6.1.4",
     "@react-navigation/native-stack": "6.9.4",
     "@reduxjs/toolkit": "1.9.1",
-    "@sanar/react-native-highlight-text": "^1.0.2",
     "@sentry/react-native": "5.5.0",
     "@shopify/flash-list": "1.4.3",
     "@supersami/rn-foreground-service": "^2.1.0",
diff --git a/src/action/authActions.ts b/src/action/authActions.ts
index 2613a53a..233cf563 100644
--- a/src/action/authActions.ts
+++ b/src/action/authActions.ts
@@ -1,6 +1,6 @@
 import { ToastMessages } from './../screens/allCases/constants';
 import 'react-native-get-random-values';
-import { IUser, setAuthData } from '../reducer/userSlice';
+import { IUser, IUserRole, setAgentRole, setAuthData } from '../reducer/userSlice';
 import axiosInstance, { ApiKeys, API_STATUS_CODE, getApiUrl } from '../components/utlis/apiHelper';
 import {
   resetLoginForm,
@@ -115,6 +115,7 @@ export const verifyGoogleSignIn = (idToken: string) => async (dispatch: AppDispa
       });
       dispatch(setVerifyOTPSuccess('Login Successfully!'));
       dispatch(resetLoginForm());
+      dispatch(getAgentDetail());
     }
   } catch (error: GenericType) {
     await handleGoogleLogout();
@@ -157,6 +158,7 @@ export const verifyOTP =
         );
         dispatch(setVerifyOTPSuccess('OTP verified'));
         dispatch(resetLoginForm());
+        dispatch(getAgentDetail());
       })
       .catch((err) => {
         dispatch(setVerifyOTPError('Invalid OTP entered. Kindly try again'));
@@ -229,6 +231,7 @@ export const handleImpersonatedUserLogin =
             isImpersonated: true,
           })
         );
+        dispatch(getAgentDetail());
         successCallback?.();
       })
       .catch((err) => {
@@ -241,3 +244,14 @@ export const handleImpersonatedUserLogin =
       })
       .finally(() => finallyCallback?.());
   };
+
+export const getAgentDetail = () => (dispatch: AppDispatch) => {
+  const url = getApiUrl(ApiKeys.GET_AGENT_DETAIL);
+  return axiosInstance.get(url).then((response) => {
+    if (response.status === API_STATUS_CODE.OK) {
+      const roles = response?.data?.roles || [];
+      const isTeamLead = roles?.includes(IUserRole.ROLE_TEAM_LEAD);
+      dispatch(setAgentRole(isTeamLead));
+    }
+  });
+};
diff --git a/src/action/reporteesActions.ts b/src/action/reporteesActions.ts
new file mode 100644
index 00000000..b2345b92
--- /dev/null
+++ b/src/action/reporteesActions.ts
@@ -0,0 +1,19 @@
+import axiosInstance, { ApiKeys, getApiUrl } from '../components/utlis/apiHelper';
+import { setReporteesList, setReporteesLoading } from '../reducer/reporteesSlice';
+import { AppDispatch } from '../store/store';
+
+export const getAgentsList = () => (dispatch: AppDispatch) => {
+  const url = getApiUrl(ApiKeys.REPORTEES); //, null, {pageNo: 1, pageSize: 10, fetchAll: 'true'});
+  dispatch(setReporteesLoading(true));
+  axiosInstance
+    .get(url)
+    .then((res) => {
+      const reporteesList = res.data?.reportees;
+      if (reporteesList) {
+        dispatch(setReporteesList(reporteesList));
+      }
+    })
+    .finally(() => {
+      dispatch(setReporteesLoading(false));
+    });
+};
diff --git a/src/common/TrackingComponent.tsx b/src/common/TrackingComponent.tsx
index 580ea393..4d913b89 100644
--- a/src/common/TrackingComponent.tsx
+++ b/src/common/TrackingComponent.tsx
@@ -55,6 +55,7 @@ const TrackingComponent: React.FC<ITrackingComponent> = ({ children }) => {
   const isOnline = useIsOnline();
   const dispatch = useAppDispatch();
   const appState = useRef(AppState.currentState);
+  const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
 
   const {
     referenceId,
@@ -193,12 +194,6 @@ const TrackingComponent: React.FC<ITrackingComponent> = ({ children }) => {
       delay: 3 * MILLISECONDS_IN_A_MINUTE, // 3 minutes
       onLoop: true,
     },
-    {
-      taskId: FOREGROUND_TASKS.FIRESTORE_FALLBACK,
-      task: handleGetCaseSyncStatus,
-      delay: 5 * MILLISECONDS_IN_A_MINUTE, // 5 minutes
-      onLoop: true,
-    },
     {
       taskId: FOREGROUND_TASKS.UPDATE_AGENT_ACTIVENESS,
       task: handleUpdateActiveness,
@@ -207,6 +202,15 @@ const TrackingComponent: React.FC<ITrackingComponent> = ({ children }) => {
     },
   ];
 
+  if (!isTeamLead) {
+    tasks.push({
+      taskId: FOREGROUND_TASKS.FIRESTORE_FALLBACK,
+      task: handleGetCaseSyncStatus,
+      delay: 5 * MILLISECONDS_IN_A_MINUTE, // 5 minutes
+      onLoop: true,
+    });
+  }
+
   const handleDataSync = () => {
     if (!isOnline) {
       return;
diff --git a/src/components/utlis/apiHelper.ts b/src/components/utlis/apiHelper.ts
index 19422a6c..cea154fa 100644
--- a/src/components/utlis/apiHelper.ts
+++ b/src/components/utlis/apiHelper.ts
@@ -54,6 +54,8 @@ export enum ApiKeys {
   GLOBAL_CONFIG = 'GLOBAL_CONFIG',
   UPLOAD_IMAGE_ID = 'UPLOAD_IMAGE_ID',
   GET_DOCUMENTS = 'GET_DOCUMENTS',
+  REPORTEES = 'REPORTEES',
+  GET_AGENT_DETAIL = 'GET_AGENT_DETAIL',
 }
 
 export const API_URLS: Record<ApiKeys, string> = {} as Record<ApiKeys, string>;
@@ -93,6 +95,8 @@ API_URLS[ApiKeys.UPLOAD_FEEDBACK_IMAGES] = '/feedback/persist-original-images';
 API_URLS[ApiKeys.GLOBAL_CONFIG] = '/global-config';
 API_URLS[ApiKeys.UPLOAD_IMAGE_ID] = '/user/documents/selfie';
 API_URLS[ApiKeys.GET_DOCUMENTS] = '/user/documents';
+API_URLS[ApiKeys.REPORTEES] = '/user/reportees';
+API_URLS[ApiKeys.GET_AGENT_DETAIL] = '/user/role-info';
 
 export const API_STATUS_CODE = {
   OK: 200,
diff --git a/src/hooks/useFirestoreUpdates.ts b/src/hooks/useFirestoreUpdates.ts
index ba7c9825..6b3f1a7c 100644
--- a/src/hooks/useFirestoreUpdates.ts
+++ b/src/hooks/useFirestoreUpdates.ts
@@ -8,7 +8,7 @@ import { FirestoreUpdateTypes } from '../common/Constants';
 import { toast } from '../../RN-UI-LIB/src/components/toast';
 import auth from '@react-native-firebase/auth';
 import { updateAvTemplateData, updateCollectionTemplateData } from '../reducer/caseReducer';
-import { ILockData, setLockData, VisitPlanStatus } from '../reducer/userSlice';
+import { ILockData, MY_CASE_ITEM, setLockData, VisitPlanStatus } from '../reducer/userSlice';
 import { setFilters } from '../reducer/filtersSlice';
 import { FormTemplateV1 } from '../types/template.types';
 import { ToastMessages } from '../screens/allCases/constants';
@@ -33,12 +33,13 @@ const isUserSignedIn = () => {
 
 const useFirestoreUpdates = () => {
   const {
-    user: { user, isLoggedIn, sessionDetails, lock },
-    allCases: { caseDetails, casesList, loading },
+    user: { user, isLoggedIn, sessionDetails, lock, selectedAgent = MY_CASE_ITEM },
+    allCases: { caseDetails, casesList },
   } = useAppSelector((state: RootState) => ({
     user: state.user || {},
     allCases: state.allCases,
   }));
+  const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
   const lockRef = useRef<ILockData | null>(null);
 
   useEffect(() => {
@@ -155,6 +156,7 @@ const useFirestoreUpdates = () => {
   const handleError = (err: any, collectionPath?: string) => {
     const errMsg = `Error while fetching fireStore snapshot: referenceId: ${user?.referenceId} collectionPath: ${collectionPath}`;
     logError(err as Error, errMsg);
+    dispatch(setLoading(false));
   };
 
   const signInUserToFirebase = () => {
@@ -176,12 +178,6 @@ const useFirestoreUpdates = () => {
       });
   };
 
-  const subscribeToCollection = (successCb: GenericFunctionArgs, collectionPath: string) => {
-    return firestore()
-      .collection(collectionPath)
-      .onSnapshot(successCb, (err) => handleError(err, collectionPath));
-  };
-
   const subscribeToDoc = (successCb: GenericFunctionArgs, collectionPath: string) => {
     return firestore()
       .doc(collectionPath)
@@ -189,7 +185,11 @@ const useFirestoreUpdates = () => {
   };
 
   const subscribeToCases = () => {
-    const collectionPath = `allocations/${user?.referenceId}/cases`;
+    let refId = user?.referenceId;
+    if (isTeamLead && selectedAgent?.agentReferenceId !== MY_CASE_ITEM.agentReferenceId) {
+      refId = selectedAgent?.agentReferenceId;
+    }
+    const collectionPath = `allocations/${refId}/cases`;
     return firestore()
       .collection(collectionPath)
       .orderBy('totalOverdueAmount', 'asc') // It is descending order only, but acting weirdly. Need to check.
@@ -212,7 +212,11 @@ const useFirestoreUpdates = () => {
   };
 
   const subscribeToFilters = () => {
-    const collectionPath = `filters/${user?.referenceId}`;
+    let refId = user?.referenceId;
+    if (isTeamLead && selectedAgent?.agentReferenceId !== MY_CASE_ITEM.agentReferenceId) {
+      refId = selectedAgent?.agentReferenceId;
+    }
+    const collectionPath = `filters/${refId}`;
     return subscribeToDoc(handleFilterUpdate, collectionPath);
   };
 
@@ -263,6 +267,33 @@ const useFirestoreUpdates = () => {
     };
   }, [isLoggedIn, user?.referenceId]);
 
+  useEffect(() => {
+    if (!isTeamLead) {
+      return;
+    }
+    if (
+      !selectedAgent?.agentReferenceId ||
+      selectedAgent?.agentReferenceId === MY_CASE_ITEM.agentReferenceId
+    ) {
+      return;
+    }
+    if (!isLoggedIn || !sessionDetails?.firebaseToken) {
+      loggedOutCurrentUser();
+      return;
+    }
+    // unsubscribe from previous agent's cases
+    casesUnsubscribe && casesUnsubscribe();
+    filterUnsubscribe && filterUnsubscribe();
+    dispatch(setLoading(true));
+    // subscribe to new agent's cases
+    subscribeToCases();
+    subscribeToFilters();
+    return () => {
+      casesUnsubscribe && casesUnsubscribe();
+      filterUnsubscribe && filterUnsubscribe();
+    };
+  }, [selectedAgent, isTeamLead]);
+
   useEffect(() => {
     forceUninstallUnsubscribe = subscribeToForceUninstall();
   }, []);
diff --git a/src/reducer/allCasesSlice.ts b/src/reducer/allCasesSlice.ts
index 383f0815..4756b249 100644
--- a/src/reducer/allCasesSlice.ts
+++ b/src/reducer/allCasesSlice.ts
@@ -242,9 +242,6 @@ const allCasesSlice = createSlice({
         isInitialLoad: boolean;
         isVisitPlanLocked: boolean;
       };
-      if (state.loading) {
-        state.loading = false;
-      }
       let newVisitCaseLoanIds: string[] = [];
       let newVisitCollectionCases: string[] = [];
       let removedVisitedCasesLoanIds: string[] = [];
@@ -356,6 +353,9 @@ const allCasesSlice = createSlice({
       state.completedList = completedList;
       state.pinnedList = pinnedList;
       state.newVisitedCases = newVisitCollectionCases;
+      if (state.loading) {
+        state.loading = false;
+      }
 
       if (newVisitCaseLoanIds?.length > 0) {
         addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_VISIT_PLAN_UPDATED, {
@@ -503,26 +503,8 @@ const allCasesSlice = createSlice({
         state.caseDetails[action.payload].isNewlyAdded = false;
       }
     },
-    resetCasesData: (state) => {
-      state.casesList = [];
-      state.casesListMap = {};
-      state.intermediateTodoList = [];
-      state.intermediateTodoListMap = {};
-      state.selectedTodoListCount = 0;
-      state.selectedTodoListMap = {};
-      state.initialPinnedRankCount = 0;
-      state.pinnedRankCount = 0;
-      state.loading = false;
-      state.filterList = [];
-      state.newlyPinnedCases = 0;
-      state.completedCases = 0;
-      state.caseDetails = {};
-      state.searchQuery = '';
-      state.isOnboarded = state.isOnboarded;
-      state.newVisitedCases = [];
-      state.pendingList = [];
-      state.pinnedList = [];
-      state.completedList = [];
+    resetCasesData: () => {
+      return initialState;
     },
     setVisitPlansUpdating: (state, action) => {
       state.visitPlansUpdating = action.payload;
diff --git a/src/reducer/reporteesSlice.ts b/src/reducer/reporteesSlice.ts
new file mode 100644
index 00000000..815dbbc3
--- /dev/null
+++ b/src/reducer/reporteesSlice.ts
@@ -0,0 +1,36 @@
+import { createSlice } from '@reduxjs/toolkit';
+import { IReportee } from '../screens/allCases/interface';
+import { MY_CASE_ITEM } from './userSlice';
+
+interface IReporteesSlice {
+  agentsList: IReportee[];
+  isLoading: boolean;
+  showAgentSelectionBottomSheet: boolean;
+}
+
+const initialState: IReporteesSlice = {
+  agentsList: [],
+  isLoading: false,
+  showAgentSelectionBottomSheet: false,
+};
+
+export const userSlice = createSlice({
+  name: 'reportees',
+  initialState,
+  reducers: {
+    setReporteesList: (state, action) => {
+      state.agentsList = [MY_CASE_ITEM, ...(action.payload || [])];
+    },
+    setReporteesLoading: (state, action) => {
+      state.isLoading = action.payload;
+    },
+    setShowAgentSelectionBottomSheet: (state, action) => {
+      state.showAgentSelectionBottomSheet = action.payload;
+    },
+  },
+});
+
+export const { setReporteesList, setReporteesLoading, setShowAgentSelectionBottomSheet } =
+  userSlice.actions;
+
+export default userSlice.reducer;
diff --git a/src/reducer/userSlice.ts b/src/reducer/userSlice.ts
index 55f3e75c..7acf14fa 100644
--- a/src/reducer/userSlice.ts
+++ b/src/reducer/userSlice.ts
@@ -1,5 +1,6 @@
 import { createSlice } from '@reduxjs/toolkit';
 import { setGlobalUserData } from '../constants/Global';
+import { IReportee } from '../screens/allCases/interface';
 
 interface ISessionDetails {
   sessionToken: string;
@@ -9,8 +10,16 @@ interface ISessionDetails {
 
 export enum IUserRole {
   SUPER_USER = 'ADDRESS_VERIFICATION:API:SUPER_USER',
+  ROLE_TEAM_LEAD = 'ROLE_TEAM_LEAD',
 }
 
+export const MY_CASE_ITEM = {
+  name: 'My Cases',
+  agentReferenceId: 'MY_CASES',
+  agencyCode: '',
+  agencyName: '',
+};
+
 interface IUserDetails {
   emailId: string;
   referenceId: string;
@@ -47,6 +56,8 @@ export interface IUserSlice extends IUser {
   clickstreamEvents: IClickstreamEvents[];
   isImpersonated: boolean;
   lock: ILockData;
+  selectedAgent: IReportee;
+  isTeamLead: boolean;
 }
 
 const initialState: IUserSlice = {
@@ -59,6 +70,8 @@ const initialState: IUserSlice = {
   lock: {
     visitPlanStatus: VisitPlanStatus.UNLOCKED,
   },
+  selectedAgent: MY_CASE_ITEM,
+  isTeamLead: false,
 };
 
 export const userSlice = createSlice({
@@ -86,9 +99,16 @@ export const userSlice = createSlice({
         state.lock = action.payload;
       }
     },
+    setSelectedAgent: (state, action) => {
+      state.selectedAgent = action.payload;
+    },
+    setAgentRole: (state, action) => {
+      state.isTeamLead = action.payload ?? false;
+    },
   },
 });
 
-export const { setAuthData, setDeviceId, setLockData } = userSlice.actions;
+export const { setAuthData, setDeviceId, setLockData, setSelectedAgent, setAgentRole } =
+  userSlice.actions;
 
 export default userSlice.reducer;
diff --git a/src/screens/Profile/index.tsx b/src/screens/Profile/index.tsx
index 6a3d99dd..b7fde190 100644
--- a/src/screens/Profile/index.tsx
+++ b/src/screens/Profile/index.tsx
@@ -30,7 +30,7 @@ import VersionNumber from 'react-native-version-number';
 import { useFocusEffect } from '@react-navigation/native';
 import { CaseDetail } from '../caseDetails/interface';
 import CaseItem from '../allCases/CaseItem';
-import { IUserRole } from '../../reducer/userSlice';
+import { IUserRole, MY_CASE_ITEM } from '../../reducer/userSlice';
 import QuestionMarkIcon from '../../assets/icons/QuestionMarkIcon';
 import IDCardImageCapture from './IDCardImageCapture';
 import AgentIdCard from './AgentIdCard';
@@ -53,6 +53,8 @@ const Profile: React.FC = () => {
     caseDetails,
     supportLink,
     pendingCases,
+    selectedAgent,
+    isTeamLead,
   } = useAppSelector((state: RootState) => ({
     originalImageUri: state.profile.originalImageUri,
     imageUri: state.profile.imageUri,
@@ -65,6 +67,8 @@ const Profile: React.FC = () => {
     supportLink: state.config.data?.supportLink,
     isUploadingImage: state.profile.isUploadingImage,
     pendingCases: state.allCases.pendingList,
+    selectedAgent: state.user.selectedAgent,
+    isTeamLead: state.user.isTeamLead,
   }));
 
   useEffect(() => {
@@ -132,6 +136,9 @@ const Profile: React.FC = () => {
     addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_ID_CARD_CLICKED);
   };
 
+  const showCompletedCases =
+    !isTeamLead || selectedAgent?.agentReferenceId === MY_CASE_ITEM.agentReferenceId;
+
   return (
     <View style={[GenericStyles.fill]}>
       <NavigationHeader
@@ -174,53 +181,55 @@ const Profile: React.FC = () => {
         }
       />
       <ScrollView>
-        <View
-          style={[
-            GenericStyles.ph16,
-            GenericStyles.pt16,
-            numberOfCompletedCases === 2 ? { paddingBottom: 6 } : {},
-          ]}
-        >
-          {hideUploadImageBtn ? null : <IDCardImageCapture />}
+        {showCompletedCases ? (
           <View
             style={[
-              GenericStyles.row,
-              GenericStyles.alignCenter,
-              numberOfCompletedCases ? { paddingBottom: 12 } : GenericStyles.pb16,
+              GenericStyles.ph16,
+              GenericStyles.pt16,
+              numberOfCompletedCases === 2 ? { paddingBottom: 6 } : {},
             ]}
           >
-            <View style={[GenericStyles.ml4, GenericStyles.mr8]}>
-              <GroupIcon />
-            </View>
-            <Text>Completed cases ({numberOfCompletedCases})</Text>
-          </View>
-          {numberOfCompletedCases
-            ? completeCasesList.slice(0, 2).map((caseItem) => {
-                const caseDetailItem = caseDetails[caseItem.caseReferenceId] as CaseDetail;
-                return (
-                  <CaseItem
-                    key={caseItem.caseReferenceId}
-                    caseDetailObj={caseDetailItem}
-                    isCompleted={true}
-                  />
-                );
-              })
-            : null}
-          {numberOfCompletedCases > 2 ? (
-            <Button
-              title="View all completed cases"
-              variant="primaryText"
+            {hideUploadImageBtn ? null : <IDCardImageCapture />}
+            <View
               style={[
-                GenericStyles.w100,
-                GenericStyles.br8,
-                GenericStyles.mt6,
-                GenericStyles.mb12,
-                GenericStyles.whiteBackground,
+                GenericStyles.row,
+                GenericStyles.alignCenter,
+                numberOfCompletedCases ? { paddingBottom: 12 } : GenericStyles.pb16,
               ]}
-              onPress={handleViewAllCases}
-            />
-          ) : null}
-        </View>
+            >
+              <View style={[GenericStyles.ml4, GenericStyles.mr8]}>
+                <GroupIcon />
+              </View>
+              <Text>Completed cases ({numberOfCompletedCases})</Text>
+            </View>
+            {numberOfCompletedCases
+              ? completeCasesList.slice(0, 2).map((caseItem) => {
+                  const caseDetailItem = caseDetails[caseItem.caseReferenceId] as CaseDetail;
+                  return (
+                    <CaseItem
+                      key={caseItem.caseReferenceId}
+                      caseDetailObj={caseDetailItem}
+                      isCompleted={true}
+                    />
+                  );
+                })
+              : null}
+            {numberOfCompletedCases > 2 ? (
+              <Button
+                title="View all completed cases"
+                variant="primaryText"
+                style={[
+                  GenericStyles.w100,
+                  GenericStyles.br8,
+                  GenericStyles.mt6,
+                  GenericStyles.mb12,
+                  GenericStyles.whiteBackground,
+                ]}
+                onPress={handleViewAllCases}
+              />
+            ) : null}
+          </View>
+        ) : null}
         <View style={[styles.logoutContainer, GenericStyles.whiteBackground]}>
           <TouchableOpacity
             onPress={handleLogout}
diff --git a/src/screens/allCases/AgentListItem.tsx b/src/screens/allCases/AgentListItem.tsx
new file mode 100644
index 00000000..a89dddc4
--- /dev/null
+++ b/src/screens/allCases/AgentListItem.tsx
@@ -0,0 +1,79 @@
+import { Pressable, StyleSheet, View } from 'react-native';
+import React from 'react';
+import Text from '../../../RN-UI-LIB/src/components/Text';
+import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
+import ArrowSolidIcon from '../../../RN-UI-LIB/src/Icons/ArrowSolidIcon';
+import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
+import { useAppDispatch, useAppSelector } from '../../hooks';
+import { setShowAgentSelectionBottomSheet } from '../../reducer/reporteesSlice';
+import { IReportee } from './interface';
+import { resetCasesData } from '../../reducer/allCasesSlice';
+import fuzzySort from '../../../RN-UI-LIB/src/utlis/fuzzySort';
+import fuzzysort from 'fuzzysort';
+import { MY_CASE_ITEM, setSelectedAgent } from '../../reducer/userSlice';
+
+interface IAgentListItem {
+  agent: IReportee;
+  leftAdornment?: React.ReactNode;
+  searchQuery: string;
+}
+
+const AgentListItem: React.FC<IAgentListItem> = ({ agent, leftAdornment, searchQuery }) => {
+  const selectedAgent = useAppSelector((state) => state.user.selectedAgent) || MY_CASE_ITEM;
+  const dispatch = useAppDispatch();
+
+  const handleAgentSelection = () => {
+    dispatch(setSelectedAgent(agent));
+    dispatch(resetCasesData());
+    dispatch(setShowAgentSelectionBottomSheet(false));
+  };
+
+  return (
+    <Pressable
+      style={[
+        GenericStyles.row,
+        GenericStyles.justifyContentSpaceBetween,
+        GenericStyles.whiteBackground,
+        GenericStyles.p12,
+        GenericStyles.br8,
+        GenericStyles.border,
+        GenericStyles.alignCenter,
+        GenericStyles.mb16,
+        styles.shadow,
+        {
+          backgroundColor:
+            agent.agentReferenceId === selectedAgent.agentReferenceId
+              ? COLORS.BACKGROUND.BLUE_LIGHT_3
+              : COLORS.BACKGROUND.PRIMARY,
+        },
+      ]}
+      onPress={handleAgentSelection}
+    >
+      <View style={[GenericStyles.row, GenericStyles.alignCenter]}>
+        {leftAdornment && <View style={[GenericStyles.mr4]}>{leftAdornment}</View>}
+        <Text>
+          {searchQuery.length > 0
+            ? fuzzySort.highlight(fuzzysort.single(searchQuery, agent.name), (result: string) => (
+                <Text style={styles.highlight}>{result}</Text>
+              ))
+            : agent.name}
+        </Text>
+      </View>
+      <ArrowSolidIcon size={10} fillColor={COLORS.BACKGROUND.LIGHT} rotateY={180} />
+    </Pressable>
+  );
+};
+
+const styles = StyleSheet.create({
+  shadow: {
+    elevation: 1,
+  },
+  highlight: {
+    backgroundColor: COLORS.BACKGROUND.ORANGE,
+    borderRadius: 4,
+    borderWidth: 1,
+    borderColor: COLORS.BORDER.ORANGE,
+  },
+});
+
+export default AgentListItem;
diff --git a/src/screens/allCases/AgentListSearchbar.tsx b/src/screens/allCases/AgentListSearchbar.tsx
new file mode 100644
index 00000000..f3bb9f72
--- /dev/null
+++ b/src/screens/allCases/AgentListSearchbar.tsx
@@ -0,0 +1,21 @@
+import React from 'react';
+import TextInput from '../../../RN-UI-LIB/src/components/TextInput';
+import SearchIcon from '../../../RN-UI-LIB/src/Icons/SearchIcon';
+
+interface IAgentListSearchbar {
+  searchQuery: string;
+  handleSearchChange: (val: string) => void;
+}
+
+const AgentListSearchbar: React.FC<IAgentListSearchbar> = ({ searchQuery, handleSearchChange }) => {
+  return (
+    <TextInput
+      LeftComponent={<SearchIcon />}
+      onChangeText={handleSearchChange}
+      placeholder="Search by agent"
+      defaultValue={searchQuery}
+    />
+  );
+};
+
+export default AgentListSearchbar;
diff --git a/src/screens/allCases/AgentListView.tsx b/src/screens/allCases/AgentListView.tsx
new file mode 100644
index 00000000..9dbf18b7
--- /dev/null
+++ b/src/screens/allCases/AgentListView.tsx
@@ -0,0 +1,103 @@
+import {
+  Animated,
+  NativeScrollEvent,
+  NativeSyntheticEvent,
+  SectionList,
+  StyleSheet,
+  View,
+} from 'react-native';
+import React, { useMemo } from 'react';
+import Text from '../../../RN-UI-LIB/src/components/Text';
+import { IReportee, ISectionListData } from './interface';
+import { useAppSelector } from '../../hooks';
+import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
+import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
+import AgentListItem from './AgentListItem';
+import { sectionListTranformData } from './utils';
+import ProfileSolidIcon from '../../../RN-UI-LIB/src/Icons/ProfileSolidIcon';
+import { Search } from '../../../RN-UI-LIB/src/utlis/search';
+import NoCasesFoundIcon from '../../assets/icons/NoCasesFoundIcon';
+import { MY_CASE_ITEM } from '../../reducer/userSlice';
+import Heading from '../../../RN-UI-LIB/src/components/Heading';
+
+interface IAgentListView {
+  searchQuery: string;
+  scrollAnimation: Animated.Value;
+}
+
+const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery }) => {
+  const { agentsList = [] } = useAppSelector((state) => state.reportees);
+  const filteredAgentsList: ISectionListData[] = useMemo(() => {
+    const filteredList =
+      searchQuery.length > 0
+        ? Search(searchQuery, agentsList, { keys: ['name'] }).map(
+            (item: { obj: IReportee }) => item.obj
+          )
+        : agentsList;
+    return sectionListTranformData(filteredList);
+  }, [searchQuery, agentsList]);
+
+  const handleListScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {
+    const offsetY = event.nativeEvent.contentOffset.y;
+    scrollAnimation.setValue(offsetY);
+  };
+
+  if (filteredAgentsList.length === 0) {
+    return (
+      <View style={[GenericStyles.fill, GenericStyles.alignCenter, styles.mt64]}>
+        <View style={GenericStyles.alignCenter}>
+          <NoCasesFoundIcon />
+          <Heading style={GenericStyles.mt16} type="h4">
+            No {agentsList.length === 0 ? 'reportees' : 'results'} found
+          </Heading>
+          {agentsList.length ? <Text light>Try searching something else</Text> : null}
+        </View>
+      </View>
+    );
+  }
+
+  return (
+    <SectionList
+      sections={filteredAgentsList}
+      keyExtractor={(item) => item.agentReferenceId}
+      onScroll={handleListScroll}
+      contentContainerStyle={GenericStyles.ph16}
+      renderItem={({ item }) => (
+        <AgentListItem
+          agent={item}
+          searchQuery={searchQuery}
+          leftAdornment={
+            item.agentReferenceId === MY_CASE_ITEM.agentReferenceId ? <ProfileSolidIcon /> : null
+          }
+        />
+      )}
+      renderSectionHeader={({ section: { title } }) => {
+        if (!title) {
+          return null;
+        }
+        return (
+          <View style={[GenericStyles.centerAlignedRow, GenericStyles.pb16]}>
+            <Text bold dark>
+              {title}
+            </Text>
+            <View style={styles.separatorLine} />
+          </View>
+        );
+      }}
+    />
+  );
+};
+
+const styles = StyleSheet.create({
+  separatorLine: {
+    height: 1,
+    flex: 1,
+    backgroundColor: COLORS.BORDER.PRIMARY,
+    marginLeft: 8,
+  },
+  mt64: {
+    marginTop: 64,
+  },
+});
+
+export default AgentListView;
diff --git a/src/screens/allCases/AgentListViewLoading.tsx b/src/screens/allCases/AgentListViewLoading.tsx
new file mode 100644
index 00000000..3212437c
--- /dev/null
+++ b/src/screens/allCases/AgentListViewLoading.tsx
@@ -0,0 +1,21 @@
+import { View } from 'react-native';
+import React from 'react';
+import LineLoader from '../../../RN-UI-LIB/src/components/suspense_loader/LineLoader';
+import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
+
+const AgentListViewLoading = () => {
+  return (
+    <View style={[GenericStyles.fill, GenericStyles.whiteBackground, GenericStyles.ph16]}>
+      {[...Array(8).keys()].map((_, index) => (
+        <LineLoader
+          key={index}
+          width={'100%'}
+          height={50}
+          style={[GenericStyles.br6, { marginBottom: 20 }]}
+        />
+      ))}
+    </View>
+  );
+};
+
+export default AgentListViewLoading;
diff --git a/src/screens/allCases/AgentsListContainer.tsx b/src/screens/allCases/AgentsListContainer.tsx
new file mode 100644
index 00000000..16ddbea3
--- /dev/null
+++ b/src/screens/allCases/AgentsListContainer.tsx
@@ -0,0 +1,72 @@
+import { Animated, StyleSheet, View } from 'react-native';
+import React, { useCallback, useEffect, useRef } from 'react';
+import AgentListSearchbar from './AgentListSearchbar';
+import { debounce } from '../../components/utlis/commonFunctions';
+import AgentListView from './AgentListView';
+import { useAppDispatch, useAppSelector } from '../../hooks';
+import { getAgentsList } from '../../action/reporteesActions';
+import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
+import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
+import AgentListViewLoading from './AgentListViewLoading';
+
+const AgentsListContainer = () => {
+  const [searchQuery, setSearchQuery] = React.useState<string>('');
+  const { isLoading, agentsList } = useAppSelector((state) => state.reportees);
+  const dispatch = useAppDispatch();
+
+  const scrollAnimation = useRef(new Animated.Value(0)).current;
+
+  useEffect(() => {
+    dispatch(getAgentsList());
+  }, []);
+
+  const handleSearchChange = useCallback(
+    debounce((query: string) => {
+      setSearchQuery(query);
+    }, 200),
+    []
+  );
+
+  const elevateAnimatedValue = scrollAnimation.interpolate({
+    inputRange: [0, 100],
+    outputRange: [0, 6],
+    extrapolate: 'clamp',
+  });
+
+  const paddingBottomAnimatedValue = scrollAnimation.interpolate({
+    inputRange: [0, 100],
+    outputRange: [0, 10],
+    extrapolate: 'clamp',
+  });
+
+  if (isLoading && !agentsList.length) {
+    return <AgentListViewLoading />;
+  }
+
+  return (
+    <View style={[GenericStyles.fill, GenericStyles.whiteBackground]}>
+      <Animated.View
+        style={[{ paddingBottom: paddingBottomAnimatedValue }, GenericStyles.overflowHidden]}
+      >
+        <Animated.View
+          style={[
+            GenericStyles.ph16,
+            GenericStyles.pb16,
+            GenericStyles.whiteBackground,
+            {
+              borderColor: COLORS.BORDER.PRIMARY,
+              elevation: elevateAnimatedValue,
+            },
+          ]}
+        >
+          <AgentListSearchbar searchQuery={searchQuery} handleSearchChange={handleSearchChange} />
+        </Animated.View>
+      </Animated.View>
+      <Animated.View style={[GenericStyles.fill]}>
+        <AgentListView searchQuery={searchQuery} scrollAnimation={scrollAnimation} />
+      </Animated.View>
+    </View>
+  );
+};
+
+export default AgentsListContainer;
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index 95a7e9a3..51862ca6 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -335,7 +335,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
         HeaderNode={() => (
           <View style={[...row, GenericStyles.ph16]}>
             <Heading dark type="h4">
-              View team’s assigned cases
+              View team's assigned cases
             </Heading>
             <TouchableOpacity activeOpacity={0.7} onPress={toggleAgentSelectionBottomSheet}>
               <CloseIcon color={COLORS.TEXT.LIGHT} />
@@ -343,6 +343,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
           </View>
         )}
         heightPercentage={100}
+        allowBackdropClose={false}
         visible={showAgentSelectionBottomSheet}
         setVisible={toggleAgentSelectionBottomSheet}
       >
diff --git a/src/screens/allCases/EmptyList.tsx b/src/screens/allCases/EmptyList.tsx
index f976ab0b..fae3b1cd 100644
--- a/src/screens/allCases/EmptyList.tsx
+++ b/src/screens/allCases/EmptyList.tsx
@@ -23,12 +23,16 @@ interface IEmptyList {
 
 const EmptyList: React.FC<IEmptyList> = (props) => {
   const { isCompleted, isVisitPlan, isFilterApplied, setShowAgentSelectionBottomSheet } = props;
-
-  const { isLockedVisitPlanStatus } = useAppSelector((state: RootState) => ({
+  const { isLockedVisitPlanStatus, isCasesLoading } = useAppSelector((state: RootState) => ({
     isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
+    isCasesLoading: state.allCases.loading,
   }));
 
-  const isAgentTLOrAM = true;
+  const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
+
+  if (isCasesLoading) {
+    return null;
+  }
 
   const renderIcon = () => {
     if (isLockedVisitPlanStatus && isVisitPlan) {
@@ -60,7 +64,7 @@ const EmptyList: React.FC<IEmptyList> = (props) => {
       return EmptyListMessages.NO_VISIT_PLANS;
     }
 
-    if (isAgentTLOrAM) {
+    if (isTeamLead) {
       return EmptyListMessages.NO_ACTIVE_ALLOCATIONS;
     }
 
@@ -74,7 +78,7 @@ const EmptyList: React.FC<IEmptyList> = (props) => {
     if (isFilterApplied) {
       return EmptyListMessages.NO_CASES_FOUND_SUB;
     }
-    if (isAgentTLOrAM) {
+    if (isTeamLead) {
       return EmptyListMessages.SELECT_AGENT;
     }
   };
@@ -87,7 +91,7 @@ const EmptyList: React.FC<IEmptyList> = (props) => {
       };
     }
 
-    if (isAgentTLOrAM && setShowAgentSelectionBottomSheet) {
+    if (isTeamLead && setShowAgentSelectionBottomSheet) {
       return {
         btnHandler: () => setShowAgentSelectionBottomSheet(true),
         btnText: 'Select Agent',
diff --git a/src/screens/allCases/HeaderLabel.tsx b/src/screens/allCases/HeaderLabel.tsx
index f5059c24..74d8990b 100644
--- a/src/screens/allCases/HeaderLabel.tsx
+++ b/src/screens/allCases/HeaderLabel.tsx
@@ -1,12 +1,12 @@
-import { StyleSheet, TouchableOpacity, View } from 'react-native';
-import React from 'react';
+import { Animated, Easing, StyleSheet, TouchableOpacity, View } from 'react-native';
+import React, { useEffect, useRef } from 'react';
 import Heading from '../../../RN-UI-LIB/src/components/Heading';
 import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
 import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import ArrowDownOutlineIcon from '../../assets/icons/ArrowDownOutlineIcon';
 import { useAppSelector } from '../../hooks';
 import { RootState } from '../../store/store';
-import { VisitPlanStatus } from '../../reducer/userSlice';
+import { MY_CASE_ITEM, VisitPlanStatus } from '../../reducer/userSlice';
 import { dateFormat, DAY_MONTH_DATE_FORMAT } from '../../../RN-UI-LIB/src/utlis/dates';
 
 interface HeaderLabelProps {
@@ -18,11 +18,22 @@ interface HeaderLabelProps {
 const HeaderLabel: React.FC<HeaderLabelProps> = (props) => {
   const { setShowAgentSelectionBottomSheet, filteredListCount, isVisitPlan } = props;
 
-  const { isLockedVisitPlanStatus } = useAppSelector((state: RootState) => ({
+  const {
+    isLockedVisitPlanStatus,
+    selectedAgent = MY_CASE_ITEM,
+    loading,
+  } = useAppSelector((state: RootState) => ({
     isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
+    selectedAgent: state.user.selectedAgent,
+    loading: state.allCases.loading,
   }));
+  const opacityAnimation = useRef(new Animated.Value(0)).current;
+  const opacityStyle = { opacity: opacityAnimation };
+  const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
 
-  const isAgentTLOrAM = true;
+  useEffect(() => {
+    animateElement();
+  }, [selectedAgent, isTeamLead]);
 
   const getHeaderLabel = () => {
     if (isVisitPlan) {
@@ -33,19 +44,44 @@ const HeaderLabel: React.FC<HeaderLabelProps> = (props) => {
       const formattedDate = dateFormat(currentDate, DAY_MONTH_DATE_FORMAT);
       return formattedDate;
     }
-    return `My Cases (${filteredListCount})`;
+    return `${selectedAgent.name}${!loading ? ` (${filteredListCount})` : ''}`;
   };
 
-  if (isAgentTLOrAM && !isVisitPlan) {
+  const animateElement = (iterations = 1) => {
+    if (iterations === 0) {
+      return;
+    }
+
+    Animated.timing(opacityAnimation, {
+      toValue: 0.5,
+      duration: 400,
+      useNativeDriver: true,
+      easing: Easing.linear,
+    }).start(() => {
+      Animated.timing(opacityAnimation, {
+        toValue: 0,
+        duration: 300,
+        useNativeDriver: true,
+        easing: Easing.linear,
+      }).start(() => {
+        animateElement(iterations - 1);
+      });
+    });
+  };
+
+  if (isTeamLead && !isVisitPlan) {
     return (
       <TouchableOpacity
         style={GenericStyles.centerAlignedRow}
         onPress={() => setShowAgentSelectionBottomSheet(true)}
       >
+        <Animated.View style={[styles.animatedOverlay, opacityStyle]} />
         <Heading type="h3" style={[styles.headerLabel]}>
           {getHeaderLabel()}
         </Heading>
-        <ArrowDownOutlineIcon />
+        <View style={GenericStyles.mt2}>
+          <ArrowDownOutlineIcon />
+        </View>
       </TouchableOpacity>
     );
   }
@@ -57,10 +93,18 @@ const HeaderLabel: React.FC<HeaderLabelProps> = (props) => {
   );
 };
 
-export default HeaderLabel;
-
 const styles = StyleSheet.create({
   headerLabel: {
     color: COLORS.BACKGROUND.PRIMARY,
   },
+  animatedOverlay: {
+    backgroundColor: COLORS.BACKGROUND.PRIMARY,
+    position: 'absolute',
+    width: '110%',
+    height: '90%',
+    borderRadius: 8,
+    paddingHorizontal: 10,
+  },
 });
+
+export default HeaderLabel;
diff --git a/src/screens/allCases/ListItem.tsx b/src/screens/allCases/ListItem.tsx
index 92fb3fc0..39ccbf8b 100644
--- a/src/screens/allCases/ListItem.tsx
+++ b/src/screens/allCases/ListItem.tsx
@@ -77,6 +77,7 @@ const ListItem: React.FC<IListItem> = (props) => {
   const isVisitPlanStatusLocked = useAppSelector(
     (state) => state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED
   );
+  const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
 
   const dispatch = useAppDispatch();
 
@@ -174,7 +175,7 @@ const ListItem: React.FC<IListItem> = (props) => {
   const caseCompleted = COMPLETED_STATUSES.includes(caseStatus);
 
   const showVisitPlanBtn =
-    !(caseCompleted || isCaseItemPinnedMainView) && !isTodoItem && !isCompleted;
+    !(caseCompleted || isCaseItemPinnedMainView) && !isTodoItem && !isCompleted && !isTeamLead;
 
   return (
     <Pressable onPress={handleCaseClick}>
diff --git a/src/screens/allCases/index.tsx b/src/screens/allCases/index.tsx
index 9a03dc03..0fc99dff 100644
--- a/src/screens/allCases/index.tsx
+++ b/src/screens/allCases/index.tsx
@@ -29,7 +29,7 @@ const AllCasesMain = () => {
   );
   const userState = useAppSelector((state: RootState) => state.user);
   const dispatch = useAppDispatch();
-  const isAgentTLOrAM = true;
+  const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
 
   const HOME_SCREENS: ITabScreen[] = useMemo(() => {
     const bottomSheetScreens = [
@@ -41,7 +41,7 @@ const AllCasesMain = () => {
         icon: CasesIcon,
       },
     ];
-    if (!isAgentTLOrAM) {
+    if (!isTeamLead) {
       bottomSheetScreens.push({
         name: BOTTOM_TAB_ROUTES.VisitPlan,
         component: () => <CasesList casesList={pinnedList} isVisitPlan />,
@@ -54,7 +54,7 @@ const AllCasesMain = () => {
       icon: ProfileIcon,
     });
     return bottomSheetScreens;
-  }, [pendingList, pinnedList, isAgentTLOrAM]);
+  }, [pendingList, pinnedList, isTeamLead]);
 
   const onTabPressHandler = (e: any) => {
     addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_TAB_SWITCH, {
@@ -79,7 +79,7 @@ const AllCasesMain = () => {
       <FullScreenLoader loading={loading} />
       <BottomNavigator
         screens={HOME_SCREENS}
-        initialRoute={isAgentTLOrAM ? BOTTOM_TAB_ROUTES.Cases : BOTTOM_TAB_ROUTES.VisitPlan}
+        initialRoute={isTeamLead ? BOTTOM_TAB_ROUTES.Cases : BOTTOM_TAB_ROUTES.VisitPlan}
         onTabPress={(e) => onTabPressHandler(e)}
       />
       <CasesActionButtons />
diff --git a/src/screens/allCases/interface.ts b/src/screens/allCases/interface.ts
index b24ce832..d86098de 100644
--- a/src/screens/allCases/interface.ts
+++ b/src/screens/allCases/interface.ts
@@ -320,3 +320,15 @@ export interface ICaseItemAvatarCaseDetailObj extends IFetchDocumentCaseDetailOb
 export interface ICaseItemCaseDetailObj extends CaseDetail {
   isIntermediateOrSelectedTodoCaseItem?: boolean;
 }
+
+export interface ISectionListData {
+  title: string;
+  data: IReportee[];
+}
+
+export interface IReportee {
+  agentReferenceId: string;
+  name: string;
+  agencyCode: string;
+  agencyName: string;
+}
diff --git a/src/screens/allCases/utils.ts b/src/screens/allCases/utils.ts
index 04f06cda..4687dec9 100644
--- a/src/screens/allCases/utils.ts
+++ b/src/screens/allCases/utils.ts
@@ -1,5 +1,5 @@
 import { CaseDetail, FeedbackStatus } from '../caseDetails/interface';
-import { ICaseItem } from './interface';
+import { ICaseItem, IReportee, ISectionListData } from './interface';
 
 export const getAttemptedList = (
   filteredCasesList: ICaseItem[],
@@ -27,3 +27,35 @@ export const getNonAttemptedList = (
       : true
   );
 };
+
+export const sectionListTranformData = (agentList: IReportee[]): ISectionListData[] => {
+  const result: ISectionListData[] = [];
+
+  // Create an object to map agency names to their corresponding data
+  const agencyMap: { [key: string]: IReportee[] } = {};
+
+  for (const agent of agentList) {
+    const agencyName = agent.agencyName;
+
+    if (!agencyMap[agencyName]) {
+      agencyMap[agencyName] = [];
+    }
+
+    agencyMap[agencyName].push({
+      agentReferenceId: agent.agentReferenceId,
+      name: agent.name,
+      agencyCode: agent.agencyCode,
+      agencyName: agent.agencyName,
+    });
+  }
+
+  // Transform the agencyMap into the desired result format
+  for (const agencyName in agencyMap) {
+    result.push({
+      title: agencyName,
+      data: agencyMap[agencyName],
+    });
+  }
+
+  return result;
+};
diff --git a/src/screens/auth/ProtectedRouter.tsx b/src/screens/auth/ProtectedRouter.tsx
index e7d4f679..108419e0 100644
--- a/src/screens/auth/ProtectedRouter.tsx
+++ b/src/screens/auth/ProtectedRouter.tsx
@@ -50,10 +50,14 @@ const ProtectedRouter = () => {
   const { notificationsWithActions } = useAppSelector((state) => state.notifications);
   const isOnline = useIsOnline();
   const dispatch = useAppDispatch();
+  const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
 
   // Gets unified data for new visit plan cases
   // TODO: Move this to another place
   useEffect(() => {
+    if (isTeamLead) {
+      return;
+    }
     if (newVisitedCases?.length) {
       const loanAccountNumbers: string[] = [];
       newVisitedCases.forEach((caseId) => {

From 02039bf94b844f6e382b8568e7cbd23d60608cd3 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 7 Sep 2023 13:34:54 +0530
Subject: [PATCH 06/22] TP-34788 | reportees slice added

---
 src/store/store.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/store/store.ts b/src/store/store.ts
index d925b460..1c47db3b 100644
--- a/src/store/store.ts
+++ b/src/store/store.ts
@@ -30,6 +30,7 @@ import foregroundServiceSlice from '../reducer/foregroundServiceSlice';
 import feedbackImagesSlice from '../reducer/feedbackImagesSlice';
 import configSlice from '../reducer/configSlice';
 import profileSlice from '../reducer/profileSlice';
+import reporteesSlice from '../reducer/reporteesSlice';
 
 const rootReducer = combineReducers({
   case: caseReducer,
@@ -50,6 +51,7 @@ const rootReducer = combineReducers({
   feedbackImages: feedbackImagesSlice,
   config: configSlice,
   profile: profileSlice,
+  reportees: reporteesSlice,
 });
 
 const persistConfig = {

From 96c9f7dc1492cf2b9ac4cb41a96d1a8425535a4e Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 7 Sep 2023 14:02:10 +0530
Subject: [PATCH 07/22] TP-34788 | fixes

---
 src/screens/allCases/AgentListView.tsx        | 21 +++++++++++++++----
 .../caseDetails/interactionsHandler.tsx       |  2 +-
 src/screens/login/OtpInput.tsx                |  1 -
 3 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/src/screens/allCases/AgentListView.tsx b/src/screens/allCases/AgentListView.tsx
index 9dbf18b7..c1bfc9b4 100644
--- a/src/screens/allCases/AgentListView.tsx
+++ b/src/screens/allCases/AgentListView.tsx
@@ -2,6 +2,8 @@ import {
   Animated,
   NativeScrollEvent,
   NativeSyntheticEvent,
+  RefreshControl,
+  ScrollView,
   SectionList,
   StyleSheet,
   View,
@@ -9,7 +11,7 @@ import {
 import React, { useMemo } from 'react';
 import Text from '../../../RN-UI-LIB/src/components/Text';
 import { IReportee, ISectionListData } from './interface';
-import { useAppSelector } from '../../hooks';
+import { useAppDispatch, useAppSelector } from '../../hooks';
 import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
 import AgentListItem from './AgentListItem';
@@ -19,6 +21,7 @@ import { Search } from '../../../RN-UI-LIB/src/utlis/search';
 import NoCasesFoundIcon from '../../assets/icons/NoCasesFoundIcon';
 import { MY_CASE_ITEM } from '../../reducer/userSlice';
 import Heading from '../../../RN-UI-LIB/src/components/Heading';
+import { getAgentsList } from '../../action/reporteesActions';
 
 interface IAgentListView {
   searchQuery: string;
@@ -26,7 +29,9 @@ interface IAgentListView {
 }
 
 const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery }) => {
-  const { agentsList = [] } = useAppSelector((state) => state.reportees);
+  const { agentsList = [], isLoading } = useAppSelector((state) => state.reportees);
+  const dispatch = useAppDispatch();
+
   const filteredAgentsList: ISectionListData[] = useMemo(() => {
     const filteredList =
       searchQuery.length > 0
@@ -42,9 +47,16 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
     scrollAnimation.setValue(offsetY);
   };
 
+  const handleRefresh = () => {
+    dispatch(getAgentsList());
+  };
+
   if (filteredAgentsList.length === 0) {
     return (
-      <View style={[GenericStyles.fill, GenericStyles.alignCenter, styles.mt64]}>
+      <ScrollView
+        refreshControl={<RefreshControl refreshing={isLoading} onRefresh={handleRefresh} />}
+        contentContainerStyle={[GenericStyles.fill, styles.mt64]}
+      >
         <View style={GenericStyles.alignCenter}>
           <NoCasesFoundIcon />
           <Heading style={GenericStyles.mt16} type="h4">
@@ -52,7 +64,7 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
           </Heading>
           {agentsList.length ? <Text light>Try searching something else</Text> : null}
         </View>
-      </View>
+      </ScrollView>
     );
   }
 
@@ -62,6 +74,7 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
       keyExtractor={(item) => item.agentReferenceId}
       onScroll={handleListScroll}
       contentContainerStyle={GenericStyles.ph16}
+      refreshControl={<RefreshControl refreshing={isLoading} onRefresh={handleRefresh} />}
       renderItem={({ item }) => (
         <AgentListItem
           agent={item}
diff --git a/src/screens/caseDetails/interactionsHandler.tsx b/src/screens/caseDetails/interactionsHandler.tsx
index 58dd917c..74262a27 100644
--- a/src/screens/caseDetails/interactionsHandler.tsx
+++ b/src/screens/caseDetails/interactionsHandler.tsx
@@ -28,7 +28,7 @@ const interactionsHandler = () => {
     docsToBeUploaded: state.feedbackImages.docsToBeUploaded,
   }));
   const { templateId } = useAppSelector(
-    (state) => state.case.templateData[CaseAllocationType.ADDRESS_VERIFICATION_CASE]
+    (state) => state.case.templateData[CaseAllocationType.ADDRESS_VERIFICATION_CASE] || {}
   );
 
   useEffect(() => {
diff --git a/src/screens/login/OtpInput.tsx b/src/screens/login/OtpInput.tsx
index a20f7936..dc68f6c8 100644
--- a/src/screens/login/OtpInput.tsx
+++ b/src/screens/login/OtpInput.tsx
@@ -61,7 +61,6 @@ const OtpInput = () => {
       otpToken,
     };
     dispatch(verifyOTP(payload));
-    reset();
   };
 
   const handleBackClick = () => {

From 4e4cdc15e0497c373876c58b81a5d4367da150de Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 7 Sep 2023 17:27:07 +0530
Subject: [PATCH 08/22] TP-39282 | mandatory question error message text change

---
 .../form/components/ImageUpload.tsx           |  8 ++++-
 .../form/services/validation.service.ts       |  4 ++-
 src/screens/allCases/AgentListSearchbar.tsx   |  1 +
 src/screens/allCases/AgentsListContainer.tsx  |  2 +-
 src/screens/allCases/Filters.tsx              | 29 ++++++++-----------
 5 files changed, 24 insertions(+), 20 deletions(-)

diff --git a/src/components/form/components/ImageUpload.tsx b/src/components/form/components/ImageUpload.tsx
index 028c21bb..cb38cf83 100644
--- a/src/components/form/components/ImageUpload.tsx
+++ b/src/components/form/components/ImageUpload.tsx
@@ -156,7 +156,13 @@ const ImageUpload: React.FC<IImageUpload> = (props) => {
           </ImageBackground>
         </View>
       )}
-      <ErrorMessage show={error?.sectionContext?.[sectionId]?.questionContext?.[questionId]} />
+      <ErrorMessage
+        show={
+          error?.widgetContext?.[widgetId]?.sectionContext?.[sectionId]?.questionContext?.[
+            questionId
+          ]
+        }
+      />
     </View>
   );
 };
diff --git a/src/components/form/services/validation.service.ts b/src/components/form/services/validation.service.ts
index 91c7baf8..4740c85d 100644
--- a/src/components/form/services/validation.service.ts
+++ b/src/components/form/services/validation.service.ts
@@ -4,6 +4,8 @@ export function isQuestionMandatory(question: QuestionV1): boolean {
   return !!question.metadata?.validators?.['required']?.value;
 }
 
+const DEFAULT_ERROR_MESSAGE = 'This is a mandatory question';
+
 export function validateInput(data: { answer: any; type: string }, allRules: any): boolean {
   let result = true;
   const currentDate = new Date();
@@ -32,7 +34,7 @@ export function validateInput(data: { answer: any; type: string }, allRules: any
           data?.answer === undefined ||
           !`${data?.answer}`.trim().length
         ) {
-          result = rule.message || 'Required';
+          result = rule.message || DEFAULT_ERROR_MESSAGE;
           break;
         }
       } else if (ruleName === Validators.PATTERN) {
diff --git a/src/screens/allCases/AgentListSearchbar.tsx b/src/screens/allCases/AgentListSearchbar.tsx
index f3bb9f72..8a9e8d0d 100644
--- a/src/screens/allCases/AgentListSearchbar.tsx
+++ b/src/screens/allCases/AgentListSearchbar.tsx
@@ -14,6 +14,7 @@ const AgentListSearchbar: React.FC<IAgentListSearchbar> = ({ searchQuery, handle
       onChangeText={handleSearchChange}
       placeholder="Search by agent"
       defaultValue={searchQuery}
+      showClearIcon
     />
   );
 };
diff --git a/src/screens/allCases/AgentsListContainer.tsx b/src/screens/allCases/AgentsListContainer.tsx
index 16ddbea3..4b0fe308 100644
--- a/src/screens/allCases/AgentsListContainer.tsx
+++ b/src/screens/allCases/AgentsListContainer.tsx
@@ -1,4 +1,4 @@
-import { Animated, StyleSheet, View } from 'react-native';
+import { Animated, View } from 'react-native';
 import React, { useCallback, useEffect, useRef } from 'react';
 import AgentListSearchbar from './AgentListSearchbar';
 import { debounce } from '../../components/utlis/commonFunctions';
diff --git a/src/screens/allCases/Filters.tsx b/src/screens/allCases/Filters.tsx
index 6c59b530..dec94e68 100644
--- a/src/screens/allCases/Filters.tsx
+++ b/src/screens/allCases/Filters.tsx
@@ -46,22 +46,17 @@ const Filters: React.FC<IFilters> = ({
 
   return (
     <View>
-      <View
-        style={[
-          GenericStyles.mh20,
-          GenericStyles.ph16,
-          GenericStyles.pb16,
-          GenericStyles.centerAlignedRow,
-        ]}
-      >
-        <TextInput
-          style={styles.textInput}
-          LeftComponent={<SearchIcon />}
-          onChangeText={handleSearchChange}
-          placeholder={`Search in ${isVisitPlan ? 'visit plan' : 'my cases'}`}
-          defaultValue={searchQuery}
-          testID="test_search"
-        />
+      <View style={[GenericStyles.mh16, GenericStyles.pb16, GenericStyles.centerAlignedRow]}>
+        <View style={GenericStyles.fill}>
+          <TextInput
+            LeftComponent={<SearchIcon />}
+            onChangeText={handleSearchChange}
+            placeholder={`Search in ${isVisitPlan ? 'visit plan' : 'my cases'}`}
+            defaultValue={searchQuery}
+            testID="test_search"
+            showClearIcon
+          />
+        </View>
         <IconButton
           style={[GenericStyles.ml8, styles.filterIcon]}
           testID="filter-btn"
@@ -163,7 +158,7 @@ const styles = StyleSheet.create({
   },
 
   textInput: {
-    flexBasis: '75%',
+    flex: 1,
   },
   chips: {
     paddingHorizontal: 18,

From 002e8afc2d611de90173d90e622bd691b848c962 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 7 Sep 2023 19:21:55 +0530
Subject: [PATCH 09/22] TP-34788 | contract change

---
 src/action/reporteesActions.ts         |  2 +-
 src/hooks/useFirestoreUpdates.ts       | 13 +++++--------
 src/reducer/userSlice.ts               |  2 +-
 src/screens/Profile/index.tsx          |  3 +--
 src/screens/allCases/AgentListItem.tsx |  2 +-
 src/screens/allCases/AgentListView.tsx |  4 ++--
 src/screens/allCases/interface.ts      |  2 +-
 src/screens/allCases/utils.ts          |  2 +-
 src/screens/auth/ProtectedRouter.tsx   |  2 ++
 9 files changed, 15 insertions(+), 17 deletions(-)

diff --git a/src/action/reporteesActions.ts b/src/action/reporteesActions.ts
index b2345b92..95f25e30 100644
--- a/src/action/reporteesActions.ts
+++ b/src/action/reporteesActions.ts
@@ -8,7 +8,7 @@ export const getAgentsList = () => (dispatch: AppDispatch) => {
   axiosInstance
     .get(url)
     .then((res) => {
-      const reporteesList = res.data?.reportees;
+      const reporteesList = res.data?.data;
       if (reporteesList) {
         dispatch(setReporteesList(reporteesList));
       }
diff --git a/src/hooks/useFirestoreUpdates.ts b/src/hooks/useFirestoreUpdates.ts
index 6b3f1a7c..cde32596 100644
--- a/src/hooks/useFirestoreUpdates.ts
+++ b/src/hooks/useFirestoreUpdates.ts
@@ -186,8 +186,8 @@ const useFirestoreUpdates = () => {
 
   const subscribeToCases = () => {
     let refId = user?.referenceId;
-    if (isTeamLead && selectedAgent?.agentReferenceId !== MY_CASE_ITEM.agentReferenceId) {
-      refId = selectedAgent?.agentReferenceId;
+    if (isTeamLead && selectedAgent?.referenceId !== MY_CASE_ITEM.referenceId) {
+      refId = selectedAgent?.referenceId;
     }
     const collectionPath = `allocations/${refId}/cases`;
     return firestore()
@@ -213,8 +213,8 @@ const useFirestoreUpdates = () => {
 
   const subscribeToFilters = () => {
     let refId = user?.referenceId;
-    if (isTeamLead && selectedAgent?.agentReferenceId !== MY_CASE_ITEM.agentReferenceId) {
-      refId = selectedAgent?.agentReferenceId;
+    if (isTeamLead && selectedAgent?.referenceId !== MY_CASE_ITEM.referenceId) {
+      refId = selectedAgent?.referenceId;
     }
     const collectionPath = `filters/${refId}`;
     return subscribeToDoc(handleFilterUpdate, collectionPath);
@@ -271,10 +271,7 @@ const useFirestoreUpdates = () => {
     if (!isTeamLead) {
       return;
     }
-    if (
-      !selectedAgent?.agentReferenceId ||
-      selectedAgent?.agentReferenceId === MY_CASE_ITEM.agentReferenceId
-    ) {
+    if (!selectedAgent?.referenceId) {
       return;
     }
     if (!isLoggedIn || !sessionDetails?.firebaseToken) {
diff --git a/src/reducer/userSlice.ts b/src/reducer/userSlice.ts
index 7acf14fa..81e9dbd1 100644
--- a/src/reducer/userSlice.ts
+++ b/src/reducer/userSlice.ts
@@ -15,7 +15,7 @@ export enum IUserRole {
 
 export const MY_CASE_ITEM = {
   name: 'My Cases',
-  agentReferenceId: 'MY_CASES',
+  referenceId: 'MY_CASES',
   agencyCode: '',
   agencyName: '',
 };
diff --git a/src/screens/Profile/index.tsx b/src/screens/Profile/index.tsx
index b7fde190..d2fdcb1e 100644
--- a/src/screens/Profile/index.tsx
+++ b/src/screens/Profile/index.tsx
@@ -136,8 +136,7 @@ const Profile: React.FC = () => {
     addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_ID_CARD_CLICKED);
   };
 
-  const showCompletedCases =
-    !isTeamLead || selectedAgent?.agentReferenceId === MY_CASE_ITEM.agentReferenceId;
+  const showCompletedCases = !isTeamLead || selectedAgent?.referenceId === MY_CASE_ITEM.referenceId;
 
   return (
     <View style={[GenericStyles.fill]}>
diff --git a/src/screens/allCases/AgentListItem.tsx b/src/screens/allCases/AgentListItem.tsx
index a89dddc4..e933f58a 100644
--- a/src/screens/allCases/AgentListItem.tsx
+++ b/src/screens/allCases/AgentListItem.tsx
@@ -42,7 +42,7 @@ const AgentListItem: React.FC<IAgentListItem> = ({ agent, leftAdornment, searchQ
         styles.shadow,
         {
           backgroundColor:
-            agent.agentReferenceId === selectedAgent.agentReferenceId
+            agent.referenceId === selectedAgent.referenceId
               ? COLORS.BACKGROUND.BLUE_LIGHT_3
               : COLORS.BACKGROUND.PRIMARY,
         },
diff --git a/src/screens/allCases/AgentListView.tsx b/src/screens/allCases/AgentListView.tsx
index c1bfc9b4..db28f2b7 100644
--- a/src/screens/allCases/AgentListView.tsx
+++ b/src/screens/allCases/AgentListView.tsx
@@ -71,7 +71,7 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
   return (
     <SectionList
       sections={filteredAgentsList}
-      keyExtractor={(item) => item.agentReferenceId}
+      keyExtractor={(item) => item.referenceId}
       onScroll={handleListScroll}
       contentContainerStyle={GenericStyles.ph16}
       refreshControl={<RefreshControl refreshing={isLoading} onRefresh={handleRefresh} />}
@@ -80,7 +80,7 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
           agent={item}
           searchQuery={searchQuery}
           leftAdornment={
-            item.agentReferenceId === MY_CASE_ITEM.agentReferenceId ? <ProfileSolidIcon /> : null
+            item.referenceId === MY_CASE_ITEM.referenceId ? <ProfileSolidIcon /> : null
           }
         />
       )}
diff --git a/src/screens/allCases/interface.ts b/src/screens/allCases/interface.ts
index d86098de..08aa0c8c 100644
--- a/src/screens/allCases/interface.ts
+++ b/src/screens/allCases/interface.ts
@@ -327,7 +327,7 @@ export interface ISectionListData {
 }
 
 export interface IReportee {
-  agentReferenceId: string;
+  referenceId: string;
   name: string;
   agencyCode: string;
   agencyName: string;
diff --git a/src/screens/allCases/utils.ts b/src/screens/allCases/utils.ts
index 4687dec9..ca3ab555 100644
--- a/src/screens/allCases/utils.ts
+++ b/src/screens/allCases/utils.ts
@@ -42,7 +42,7 @@ export const sectionListTranformData = (agentList: IReportee[]): ISectionListDat
     }
 
     agencyMap[agencyName].push({
-      agentReferenceId: agent.agentReferenceId,
+      referenceId: agent.referenceId,
       name: agent.name,
       agencyCode: agent.agencyCode,
       agencyName: agent.agencyName,
diff --git a/src/screens/auth/ProtectedRouter.tsx b/src/screens/auth/ProtectedRouter.tsx
index 108419e0..884d7fa0 100644
--- a/src/screens/auth/ProtectedRouter.tsx
+++ b/src/screens/auth/ProtectedRouter.tsx
@@ -32,6 +32,7 @@ import Notifications from '../notifications';
 import RegisterPayments from '../registerPayements/RegisterPayments';
 import TodoList from '../todoList/TodoList';
 import UngroupedAddressContainer from '../addressGeolocation/UngroupedAddressContainer';
+import { getAgentDetail } from '../../action/authActions';
 
 const Stack = createNativeStackNavigator();
 
@@ -86,6 +87,7 @@ const ProtectedRouter = () => {
   useEffect(() => {
     if (isOnline) {
       dispatch(getNotifications());
+      dispatch(getAgentDetail());
     }
   }, [isOnline]);
 

From 3fd96dc55b1fddb73799abe3935016e1a46075d6 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Mon, 11 Sep 2023 16:07:30 +0530
Subject: [PATCH 10/22] TP-34788 | fix

---
 src/screens/allCases/AgentListView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/screens/allCases/AgentListView.tsx b/src/screens/allCases/AgentListView.tsx
index db28f2b7..d50699e4 100644
--- a/src/screens/allCases/AgentListView.tsx
+++ b/src/screens/allCases/AgentListView.tsx
@@ -89,7 +89,7 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
           return null;
         }
         return (
-          <View style={[GenericStyles.centerAlignedRow, GenericStyles.pb16]}>
+          <View style={[GenericStyles.centerAlignedRow, GenericStyles.pb16, GenericStyles.mt24]}>
             <Text bold dark>
               {title}
             </Text>

From 834c34cef1a5d5fe7d006033e935eb9cfd2cefc9 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Mon, 11 Sep 2023 16:48:43 +0530
Subject: [PATCH 11/22] TP-34788 | fix

---
 src/screens/allCases/AgentListView.tsx | 2 +-
 src/screens/allCases/CasesList.tsx     | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/screens/allCases/AgentListView.tsx b/src/screens/allCases/AgentListView.tsx
index d50699e4..eba85fe5 100644
--- a/src/screens/allCases/AgentListView.tsx
+++ b/src/screens/allCases/AgentListView.tsx
@@ -89,7 +89,7 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
           return null;
         }
         return (
-          <View style={[GenericStyles.centerAlignedRow, GenericStyles.pb16, GenericStyles.mt24]}>
+          <View style={[GenericStyles.centerAlignedRow, GenericStyles.pb16, GenericStyles.mt20]}>
             <Text bold dark>
               {title}
             </Text>
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index 51862ca6..c1f84542 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -109,6 +109,10 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
     }, [])
   );
 
+  const toggleAgentSelectionBottomSheet = () => {
+    dispatch(setShowAgentSelectionBottomSheet(!showAgentSelectionBottomSheet));
+  };
+
   const headerHeight = scrollAnimation.interpolate({
     inputRange: [0, HEADER_SCROLL_DISTANCE],
     outputRange: isVisitPlan
@@ -279,10 +283,6 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
   const headerHeightValue = quickFiltersPresent ? headerHeightQuickFilters : headerHeight;
   const showFilters = isVisitPlan && isLockedVisitPlanStatus ? false : !!casesList.length;
 
-  const toggleAgentSelectionBottomSheet = () => {
-    dispatch(setShowAgentSelectionBottomSheet(!showAgentSelectionBottomSheet));
-  };
-
   return (
     <View style={[GenericStyles.fill, styles.container]}>
       <CaseListHeader

From 6e9312987117cabfe964bd73313dbe6c3f17b00e Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Tue, 12 Sep 2023 19:00:41 +0530
Subject: [PATCH 12/22] TP-34788 | fixes

---
 src/action/reporteesActions.ts         |  2 +-
 src/components/utlis/apiHelper.ts      |  2 +-
 src/hooks/useFirestoreUpdates.ts       |  1 -
 src/reducer/reporteesSlice.ts          |  9 +++++--
 src/reducer/userSlice.ts               | 13 ++++++++-
 src/screens/allCases/AgentListView.tsx | 37 ++++++++++++++------------
 src/screens/allCases/CasesList.tsx     |  9 ++++---
 src/store/store.ts                     |  2 +-
 8 files changed, 48 insertions(+), 27 deletions(-)

diff --git a/src/action/reporteesActions.ts b/src/action/reporteesActions.ts
index 95f25e30..be9aa73e 100644
--- a/src/action/reporteesActions.ts
+++ b/src/action/reporteesActions.ts
@@ -3,7 +3,7 @@ import { setReporteesList, setReporteesLoading } from '../reducer/reporteesSlice
 import { AppDispatch } from '../store/store';
 
 export const getAgentsList = () => (dispatch: AppDispatch) => {
-  const url = getApiUrl(ApiKeys.REPORTEES); //, null, {pageNo: 1, pageSize: 10, fetchAll: 'true'});
+  const url = getApiUrl(ApiKeys.REPORTEES);
   dispatch(setReporteesLoading(true));
   axiosInstance
     .get(url)
diff --git a/src/components/utlis/apiHelper.ts b/src/components/utlis/apiHelper.ts
index cea154fa..05e09975 100644
--- a/src/components/utlis/apiHelper.ts
+++ b/src/components/utlis/apiHelper.ts
@@ -95,7 +95,7 @@ API_URLS[ApiKeys.UPLOAD_FEEDBACK_IMAGES] = '/feedback/persist-original-images';
 API_URLS[ApiKeys.GLOBAL_CONFIG] = '/global-config';
 API_URLS[ApiKeys.UPLOAD_IMAGE_ID] = '/user/documents/selfie';
 API_URLS[ApiKeys.GET_DOCUMENTS] = '/user/documents';
-API_URLS[ApiKeys.REPORTEES] = '/user/reportees';
+API_URLS[ApiKeys.REPORTEES] = '/user/all-field-reportees';
 API_URLS[ApiKeys.GET_AGENT_DETAIL] = '/user/role-info';
 
 export const API_STATUS_CODE = {
diff --git a/src/hooks/useFirestoreUpdates.ts b/src/hooks/useFirestoreUpdates.ts
index cde32596..f6490dae 100644
--- a/src/hooks/useFirestoreUpdates.ts
+++ b/src/hooks/useFirestoreUpdates.ts
@@ -156,7 +156,6 @@ const useFirestoreUpdates = () => {
   const handleError = (err: any, collectionPath?: string) => {
     const errMsg = `Error while fetching fireStore snapshot: referenceId: ${user?.referenceId} collectionPath: ${collectionPath}`;
     logError(err as Error, errMsg);
-    dispatch(setLoading(false));
   };
 
   const signInUserToFirebase = () => {
diff --git a/src/reducer/reporteesSlice.ts b/src/reducer/reporteesSlice.ts
index 815dbbc3..72fc888b 100644
--- a/src/reducer/reporteesSlice.ts
+++ b/src/reducer/reporteesSlice.ts
@@ -27,10 +27,15 @@ export const userSlice = createSlice({
     setShowAgentSelectionBottomSheet: (state, action) => {
       state.showAgentSelectionBottomSheet = action.payload;
     },
+    resetReportees: () => initialState,
   },
 });
 
-export const { setReporteesList, setReporteesLoading, setShowAgentSelectionBottomSheet } =
-  userSlice.actions;
+export const {
+  setReporteesList,
+  setReporteesLoading,
+  setShowAgentSelectionBottomSheet,
+  resetReportees,
+} = userSlice.actions;
 
 export default userSlice.reducer;
diff --git a/src/reducer/userSlice.ts b/src/reducer/userSlice.ts
index 81e9dbd1..cef83181 100644
--- a/src/reducer/userSlice.ts
+++ b/src/reducer/userSlice.ts
@@ -11,6 +11,8 @@ interface ISessionDetails {
 export enum IUserRole {
   SUPER_USER = 'ADDRESS_VERIFICATION:API:SUPER_USER',
   ROLE_TEAM_LEAD = 'ROLE_TEAM_LEAD',
+  ROLE_NAVI_FIELD_TEAM_LEAD = 'ROLE_NAVI_FIELD_TEAM_LEAD',
+  ROLE_NAVI_FIELD_EXTERNAL_TEAM_LEAD = 'ROLE_NAVI_FIELD_EXTERNAL_TEAM_LEAD',
 }
 
 export const MY_CASE_ITEM = {
@@ -103,7 +105,16 @@ export const userSlice = createSlice({
       state.selectedAgent = action.payload;
     },
     setAgentRole: (state, action) => {
-      state.isTeamLead = action.payload ?? false;
+      if (action?.payload?.length) {
+        state.isTeamLead = action.payload.some((role: IUserRole) =>
+          [
+            IUserRole.ROLE_NAVI_FIELD_TEAM_LEAD,
+            IUserRole.ROLE_NAVI_FIELD_EXTERNAL_TEAM_LEAD,
+          ].includes(role)
+        );
+      } else {
+        state.isTeamLead = false;
+      }
     },
   },
 });
diff --git a/src/screens/allCases/AgentListView.tsx b/src/screens/allCases/AgentListView.tsx
index eba85fe5..faf80229 100644
--- a/src/screens/allCases/AgentListView.tsx
+++ b/src/screens/allCases/AgentListView.tsx
@@ -2,13 +2,12 @@ import {
   Animated,
   NativeScrollEvent,
   NativeSyntheticEvent,
-  RefreshControl,
   ScrollView,
   SectionList,
   StyleSheet,
   View,
 } from 'react-native';
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo, useRef } from 'react';
 import Text from '../../../RN-UI-LIB/src/components/Text';
 import { IReportee, ISectionListData } from './interface';
 import { useAppDispatch, useAppSelector } from '../../hooks';
@@ -21,7 +20,7 @@ import { Search } from '../../../RN-UI-LIB/src/utlis/search';
 import NoCasesFoundIcon from '../../assets/icons/NoCasesFoundIcon';
 import { MY_CASE_ITEM } from '../../reducer/userSlice';
 import Heading from '../../../RN-UI-LIB/src/components/Heading';
-import { getAgentsList } from '../../action/reporteesActions';
+import { GenericType } from '../../common/GenericTypes';
 
 interface IAgentListView {
   searchQuery: string;
@@ -29,8 +28,8 @@ interface IAgentListView {
 }
 
 const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery }) => {
-  const { agentsList = [], isLoading } = useAppSelector((state) => state.reportees);
-  const dispatch = useAppDispatch();
+  const { agentsList = [] } = useAppSelector((state) => state.reportees);
+  const listRef = useRef<GenericType>(null);
 
   const filteredAgentsList: ISectionListData[] = useMemo(() => {
     const filteredList =
@@ -42,24 +41,27 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
     return sectionListTranformData(filteredList);
   }, [searchQuery, agentsList]);
 
+  // Scroll the flatlist to top when search query changes
+  useEffect(() => {
+    if (listRef?.current) {
+      listRef.current.scrollToLocation({
+        sectionIndex: 0,
+        itemIndex: 0,
+      });
+    }
+  }, [searchQuery]);
+
   const handleListScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {
     const offsetY = event.nativeEvent.contentOffset.y;
     scrollAnimation.setValue(offsetY);
   };
 
-  const handleRefresh = () => {
-    dispatch(getAgentsList());
-  };
-
   if (filteredAgentsList.length === 0) {
     return (
-      <ScrollView
-        refreshControl={<RefreshControl refreshing={isLoading} onRefresh={handleRefresh} />}
-        contentContainerStyle={[GenericStyles.fill, styles.mt64]}
-      >
+      <ScrollView contentContainerStyle={[GenericStyles.fill, styles.mt64]}>
         <View style={GenericStyles.alignCenter}>
           <NoCasesFoundIcon />
-          <Heading style={GenericStyles.mt16} type="h4">
+          <Heading style={GenericStyles.pt16} type="h4">
             No {agentsList.length === 0 ? 'reportees' : 'results'} found
           </Heading>
           {agentsList.length ? <Text light>Try searching something else</Text> : null}
@@ -70,11 +72,12 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
 
   return (
     <SectionList
+      ref={listRef}
       sections={filteredAgentsList}
       keyExtractor={(item) => item.referenceId}
       onScroll={handleListScroll}
-      contentContainerStyle={GenericStyles.ph16}
-      refreshControl={<RefreshControl refreshing={isLoading} onRefresh={handleRefresh} />}
+      contentContainerStyle={[GenericStyles.ph16, GenericStyles.mt8]}
+      keyboardShouldPersistTaps={'handled'}
       renderItem={({ item }) => (
         <AgentListItem
           agent={item}
@@ -89,7 +92,7 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
           return null;
         }
         return (
-          <View style={[GenericStyles.centerAlignedRow, GenericStyles.pb16, GenericStyles.mt20]}>
+          <View style={[GenericStyles.centerAlignedRow, GenericStyles.pb16, GenericStyles.mt16]}>
             <Text bold dark>
               {title}
             </Text>
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index c1f84542..b6341028 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -5,8 +5,8 @@ import {
   Modal,
   NativeScrollEvent,
   NativeSyntheticEvent,
+  Pressable,
   StyleSheet,
-  TouchableOpacity,
   View,
 } from 'react-native';
 import { GenericStyles, SCREEN_HEIGHT, SCREEN_WIDTH } from '../../../RN-UI-LIB/src/styles';
@@ -337,9 +337,9 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
             <Heading dark type="h4">
               View team's assigned cases
             </Heading>
-            <TouchableOpacity activeOpacity={0.7} onPress={toggleAgentSelectionBottomSheet}>
+            <Pressable onPress={toggleAgentSelectionBottomSheet} style={styles.p4}>
               <CloseIcon color={COLORS.TEXT.LIGHT} />
-            </TouchableOpacity>
+            </Pressable>
           </View>
         )}
         heightPercentage={100}
@@ -394,6 +394,9 @@ const styles = StyleSheet.create({
     paddingTop: VISIT_PLAN_HEADER_HEIGHT_MAX_WITH_QUICK_FILTERS,
     paddingBottom: 10,
   },
+  p4: {
+    padding: 4,
+  },
 });
 
 export default CasesList;
diff --git a/src/store/store.ts b/src/store/store.ts
index 1c47db3b..25460755 100644
--- a/src/store/store.ts
+++ b/src/store/store.ts
@@ -74,7 +74,7 @@ const persistConfig = {
     'profile',
     'foregroundService',
   ],
-  blackList: ['case', 'filters'],
+  blackList: ['case', 'filters', 'reportees'],
 };
 
 const persistedReducer = persistReducer(persistConfig, rootReducer);

From 0f9f71359e0285cc8f30c724a808214891a71c0b Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Tue, 12 Sep 2023 19:01:09 +0530
Subject: [PATCH 13/22] TP-34788 | fix

---
 src/action/authActions.ts | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/action/authActions.ts b/src/action/authActions.ts
index 233cf563..12e8b805 100644
--- a/src/action/authActions.ts
+++ b/src/action/authActions.ts
@@ -1,6 +1,12 @@
 import { ToastMessages } from './../screens/allCases/constants';
 import 'react-native-get-random-values';
-import { IUser, IUserRole, setAgentRole, setAuthData } from '../reducer/userSlice';
+import {
+  IUser,
+  MY_CASE_ITEM,
+  setAgentRole,
+  setAuthData,
+  setSelectedAgent,
+} from '../reducer/userSlice';
 import axiosInstance, { ApiKeys, API_STATUS_CODE, getApiUrl } from '../components/utlis/apiHelper';
 import {
   resetLoginForm,
@@ -18,7 +24,7 @@ import { GLOBAL, setGlobalUserData } from '../constants/Global';
 import { resetCasesData } from '../reducer/allCasesSlice';
 import { toast } from '../../RN-UI-LIB/src/components/toast';
 import AsyncStorage from '@react-native-async-storage/async-storage';
-import { clearAllAsyncStorage, setAsyncStorageItem } from '../components/utlis/commonFunctions';
+import { clearAllAsyncStorage } from '../components/utlis/commonFunctions';
 import { logError } from '../components/utlis/errorUtils';
 import auth from '@react-native-firebase/auth';
 import foregroundService from '../services/foregroundServices/foreground.service';
@@ -28,6 +34,7 @@ import { GoogleSignin } from '@react-native-google-signin/google-signin';
 import { resetConfig } from '../reducer/configSlice';
 import { resetProfileData } from '../reducer/profileSlice';
 import CosmosForegroundService from '../services/foregroundServices/foreground.service';
+import { resetReportees } from '../reducer/reporteesSlice';
 
 export interface GenerateOTPPayload {
   phoneNumber: string;
@@ -203,6 +210,8 @@ export const handleLogout = () => async (dispatch: AppDispatch) => {
     dispatch(resetCasesData());
     dispatch(resetConfig());
     dispatch(resetProfileData());
+    dispatch(resetReportees());
+    dispatch(setSelectedAgent(MY_CASE_ITEM));
   } catch (err) {
     logError(err as Error, 'Logout clear session details error');
   }
@@ -231,6 +240,8 @@ export const handleImpersonatedUserLogin =
             isImpersonated: true,
           })
         );
+        dispatch(resetReportees());
+        dispatch(setSelectedAgent(MY_CASE_ITEM));
         dispatch(getAgentDetail());
         successCallback?.();
       })
@@ -249,9 +260,8 @@ export const getAgentDetail = () => (dispatch: AppDispatch) => {
   const url = getApiUrl(ApiKeys.GET_AGENT_DETAIL);
   return axiosInstance.get(url).then((response) => {
     if (response.status === API_STATUS_CODE.OK) {
-      const roles = response?.data?.roles || [];
-      const isTeamLead = roles?.includes(IUserRole.ROLE_TEAM_LEAD);
-      dispatch(setAgentRole(isTeamLead));
+      const roles: string[] = response?.data?.roles || [];
+      dispatch(setAgentRole(roles));
     }
   });
 };

From 86653f0a81cd8f9ca773cc2f8f60c550fb8a70ca Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Tue, 12 Sep 2023 21:26:12 +0530
Subject: [PATCH 14/22] TP-34788 | api support for AM TL added

---
 src/action/authActions.ts                 |  8 ++++-
 src/action/dataActions.ts                 |  8 ++++-
 src/common/Constants.ts                   |  1 +
 src/components/notificationMenu/index.tsx | 37 +++++++++++++++--------
 src/components/utlis/apiHelper.ts         |  4 ++-
 src/constants/Global.ts                   |  5 ++-
 src/reducer/filtersSlice.ts               |  4 ++-
 src/screens/allCases/AgentListItem.tsx    |  4 +++
 src/screens/allCases/CasesList.tsx        |  6 ++++
 src/screens/auth/AuthRouter.tsx           |  1 +
 10 files changed, 60 insertions(+), 18 deletions(-)

diff --git a/src/action/authActions.ts b/src/action/authActions.ts
index 12e8b805..362d3e08 100644
--- a/src/action/authActions.ts
+++ b/src/action/authActions.ts
@@ -198,7 +198,13 @@ export const handleLogout = () => async (dispatch: AppDispatch) => {
     await auth().signOut();
     await handleGoogleLogout();
     await clearAllAsyncStorage();
-    setGlobalUserData({ token: '', agentId: '', deviceId: '', isImpersonated: false });
+    setGlobalUserData({
+      token: '',
+      agentId: '',
+      deviceId: '',
+      isImpersonated: false,
+      selectedAgentId: '',
+    });
     dispatch(
       setAuthData({
         sessionDetails: null,
diff --git a/src/action/dataActions.ts b/src/action/dataActions.ts
index 351fc9e8..fc48231f 100644
--- a/src/action/dataActions.ts
+++ b/src/action/dataActions.ts
@@ -23,6 +23,8 @@ import { setFilters } from '../reducer/filtersSlice';
 import { toast } from '../../RN-UI-LIB/src/components/toast';
 import { ToastMessages } from '../screens/allCases/constants';
 import { GenericFunctionArgs } from '../common/GenericTypes';
+import { GLOBAL } from '../constants/Global';
+import { MY_CASE_ITEM } from '../reducer/userSlice';
 
 let _signedApiCallBucket: { req: any; added_At: number; callback: GenericFunctionArgs }[] = [];
 let _signedApiCallBucketTimer: number = 0;
@@ -210,7 +212,11 @@ async function makeBulkSignedApiRequest(
   payload: ISignedRequestItem[],
   callback: GenericFunctionArgs | GenericFunctionArgs[]
 ) {
-  const url = getApiUrl(ApiKeys.GET_SIGNED_URL);
+  let url = getApiUrl(ApiKeys.GET_SIGNED_URL);
+  const reporteeReferenceId = GLOBAL?.SELECTED_AGENT_ID;
+  if (reporteeReferenceId && reporteeReferenceId !== MY_CASE_ITEM.referenceId) {
+    url = getApiUrl(ApiKeys.GET_SIGNED_URL_FOR_REPORTEE, {}, { reporteeReferenceId });
+  }
   _signedApiCallBucket = [];
   await axiosInstance
     .post(url, payload, {
diff --git a/src/common/Constants.ts b/src/common/Constants.ts
index 142e725c..d5279d5d 100644
--- a/src/common/Constants.ts
+++ b/src/common/Constants.ts
@@ -634,6 +634,7 @@ export const REQUEST_TYPE_TO_BLOCK_FOR_IMPERSONATION = ['post', 'put', 'patch',
 
 export const REQUEST_TO_UNBLOCK_FOR_IMPERSONATION = [
   getApiUrl(ApiKeys.GET_SIGNED_URL),
+  getApiUrl(ApiKeys.GET_SIGNED_URL_FOR_REPORTEE),
   getApiUrl(ApiKeys.LOGOUT),
 ];
 
diff --git a/src/components/notificationMenu/index.tsx b/src/components/notificationMenu/index.tsx
index 8ae3c700..369bc32d 100644
--- a/src/components/notificationMenu/index.tsx
+++ b/src/components/notificationMenu/index.tsx
@@ -8,12 +8,19 @@ import { CLICKSTREAM_EVENT_NAMES } from '../../common/Constants';
 import { useAppSelector } from '../../hooks';
 import { addClickstreamEvent } from '../../services/clickstreamEventService';
 import { getCurrentScreen, pushToScreen } from '../utlis/navigationUtlis';
+import { MY_CASE_ITEM } from '../../reducer/userSlice';
 
 const NotificationMenu = () => {
   const { totalUnreadElements } = useAppSelector((state) => state.notifications);
+  const { isTeamLead, selectedAgent = MY_CASE_ITEM } = useAppSelector((state) => state.user);
   const [isEnabled, setIsEnabled] = useState(false);
 
+  const showNotifications = !isTeamLead || selectedAgent?.referenceId === MY_CASE_ITEM.referenceId;
+
   const handleNotificationPress = () => {
+    if (!showNotifications) {
+      return;
+    }
     if (isEnabled) return;
     setIsEnabled(true);
     addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_NOTIFICATION_ICON_CLICK, {
@@ -30,20 +37,24 @@ const NotificationMenu = () => {
       style={GenericStyles.iconContainerButton}
       onPress={handleNotificationPress}
     >
-      <View style={[GenericStyles.ph8, GenericStyles.pv10]}>
-        <BellIcon />
-        <View style={[styles.notificationBadge, GenericStyles.alignCenter]}>
-          {totalUnreadElements ? (
-            <Text
-              bold
-              small
-              style={[styles.notificationNumber, { width: totalUnreadElements > 9 ? 24 : 16 }]}
-            >
-              {totalUnreadElements > 9 ? '9+' : totalUnreadElements}
-            </Text>
-          ) : null}
+      {showNotifications ? (
+        <View style={[GenericStyles.ph8, GenericStyles.pv10]}>
+          <BellIcon />
+          <View style={[styles.notificationBadge, GenericStyles.alignCenter]}>
+            {totalUnreadElements ? (
+              <Text
+                bold
+                small
+                style={[styles.notificationNumber, { width: totalUnreadElements > 9 ? 24 : 16 }]}
+              >
+                {totalUnreadElements > 9 ? '9+' : totalUnreadElements}
+              </Text>
+            ) : null}
+          </View>
         </View>
-      </View>
+      ) : (
+        <></>
+      )}
     </TouchableHighlight>
   );
 };
diff --git a/src/components/utlis/apiHelper.ts b/src/components/utlis/apiHelper.ts
index 05e09975..86b439b7 100644
--- a/src/components/utlis/apiHelper.ts
+++ b/src/components/utlis/apiHelper.ts
@@ -56,6 +56,7 @@ export enum ApiKeys {
   GET_DOCUMENTS = 'GET_DOCUMENTS',
   REPORTEES = 'REPORTEES',
   GET_AGENT_DETAIL = 'GET_AGENT_DETAIL',
+  GET_SIGNED_URL_FOR_REPORTEE = 'GET_SIGNED_URL_FOR_REPORTEE',
 }
 
 export const API_URLS: Record<ApiKeys, string> = {} as Record<ApiKeys, string>;
@@ -72,8 +73,9 @@ API_URLS[ApiKeys.GENERATE_PAYMENT_LINK] = '/payments/send-payment-link';
 API_URLS[ApiKeys.ADDRESSES_GEOLOCATION] = '/addresses-geolocations';
 API_URLS[ApiKeys.NEW_ADDRESS] = '/addresses';
 API_URLS[ApiKeys.GET_SIGNED_URL] = '/cases/get-signed-urls';
+API_URLS[ApiKeys.GET_SIGNED_URL_FOR_REPORTEE] = '/cases/get-signed-urls-for-reportee';
 API_URLS[ApiKeys.CASE_UNIFIED_DETAILS] = '/v2/collection-cases/unified-details/{loanAccountNumber}';
-API_URLS[ApiKeys.UNGROUPED_ADDRESSES] = '/addresses/ungrouped/{loanAccountNumber}';
+API_URLS[ApiKeys.UNGROUPED_ADDRESSES] = '/addresses/ungrouped/v2/{loanAccountNumber}';
 API_URLS[ApiKeys.PAST_FEEDBACK] = '/feedback';
 API_URLS[ApiKeys.PAST_FEEDBACK_ON_ADDRESSES] = '/feedback/v2';
 API_URLS[ApiKeys.NOTIFICATIONS] = '/notification/fetch';
diff --git a/src/constants/Global.ts b/src/constants/Global.ts
index 704917cf..8c898702 100644
--- a/src/constants/Global.ts
+++ b/src/constants/Global.ts
@@ -11,6 +11,7 @@ export const GLOBAL = {
   AGENT_ID: '',
   DEVICE_TYPE: DEVICE_TYPE_ENUM.MOBILE,
   IS_IMPERSONATED: false,
+  SELECTED_AGENT_ID: '',
 };
 
 interface IGlobalUserData {
@@ -19,13 +20,15 @@ interface IGlobalUserData {
   agentId?: string;
   deviceType?: DEVICE_TYPE_ENUM;
   isImpersonated?: boolean;
+  selectedAgentId?: string;
 }
 
 export const setGlobalUserData = (userData: IGlobalUserData) => {
-  const { token, deviceId, agentId, deviceType, isImpersonated } = userData;
+  const { token, deviceId, agentId, deviceType, isImpersonated, selectedAgentId } = userData;
   if (!isNullOrUndefined(token)) GLOBAL.SESSION_TOKEN = `${token}`;
   if (!isNullOrUndefined(deviceId)) GLOBAL.DEVICE_ID = `${deviceId}`;
   if (!isNullOrUndefined(agentId)) GLOBAL.AGENT_ID = `${agentId}`;
   if (!isNullOrUndefined(deviceType)) GLOBAL.DEVICE_TYPE = deviceType as DEVICE_TYPE_ENUM;
   if (!isNullOrUndefined(isImpersonated)) GLOBAL.IS_IMPERSONATED = isImpersonated ?? false;
+  if (!isNullOrUndefined(selectedAgentId)) GLOBAL.SELECTED_AGENT_ID = `${selectedAgentId}`;
 };
diff --git a/src/reducer/filtersSlice.ts b/src/reducer/filtersSlice.ts
index 6d657ba7..1902225f 100644
--- a/src/reducer/filtersSlice.ts
+++ b/src/reducer/filtersSlice.ts
@@ -73,9 +73,11 @@ const filtersSlice = createSlice({
       });
       state.filterCountVisitPlan = filterCount;
     },
+    resetFilters: () => initialState,
   },
 });
 
-export const { setFilters, setSelectedFilters, setSelectedFiltersVisitPlan } = filtersSlice.actions;
+export const { setFilters, setSelectedFilters, setSelectedFiltersVisitPlan, resetFilters } =
+  filtersSlice.actions;
 
 export default filtersSlice.reducer;
diff --git a/src/screens/allCases/AgentListItem.tsx b/src/screens/allCases/AgentListItem.tsx
index e933f58a..99df3d8b 100644
--- a/src/screens/allCases/AgentListItem.tsx
+++ b/src/screens/allCases/AgentListItem.tsx
@@ -11,6 +11,8 @@ import { resetCasesData } from '../../reducer/allCasesSlice';
 import fuzzySort from '../../../RN-UI-LIB/src/utlis/fuzzySort';
 import fuzzysort from 'fuzzysort';
 import { MY_CASE_ITEM, setSelectedAgent } from '../../reducer/userSlice';
+import { resetFilters } from '../../reducer/filtersSlice';
+import { setGlobalUserData } from '../../constants/Global';
 
 interface IAgentListItem {
   agent: IReportee;
@@ -24,6 +26,8 @@ const AgentListItem: React.FC<IAgentListItem> = ({ agent, leftAdornment, searchQ
 
   const handleAgentSelection = () => {
     dispatch(setSelectedAgent(agent));
+    setGlobalUserData({ selectedAgentId: agent.referenceId });
+    dispatch(resetFilters());
     dispatch(resetCasesData());
     dispatch(setShowAgentSelectionBottomSheet(false));
   };
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index b6341028..8927087a 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -77,6 +77,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
     quickFiltersPresent,
     isLockedVisitPlanStatus,
     showAgentSelectionBottomSheet,
+    selectedAgent,
   } = useAppSelector((state: RootState) => ({
     filters: state.filters.filters,
     filterCount: isVisitPlan ? state.filters.filterCountVisitPlan : state.filters.filterCount,
@@ -85,6 +86,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
       : state.filters.selectedFilters,
     quickFiltersPresent: state?.filters?.quickFilters?.length > 0,
     isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
+    selectedAgent: state.user?.selectedAgent,
     showAgentSelectionBottomSheet: state.reportees.showAgentSelectionBottomSheet,
   }));
 
@@ -121,6 +123,10 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
     extrapolate: 'clamp',
   });
 
+  useEffect(() => {
+    setSearchQuery('');
+  }, [selectedAgent]);
+
   //TODO: clean these different heights
   const headerHeightQuickFilters = scrollAnimation.interpolate({
     inputRange: [0, HEADER_SCROLL_DISTANCE_WITH_QUICK_FILTERS],
diff --git a/src/screens/auth/AuthRouter.tsx b/src/screens/auth/AuthRouter.tsx
index 2c342ac2..a3ab5e9c 100644
--- a/src/screens/auth/AuthRouter.tsx
+++ b/src/screens/auth/AuthRouter.tsx
@@ -36,6 +36,7 @@ const AuthRouter = () => {
     agentId: user?.user?.referenceId,
     deviceType: isTablet() ? DEVICE_TYPE_ENUM.TAB : DEVICE_TYPE_ENUM.MOBILE,
     isImpersonated: user?.isImpersonated ?? false,
+    selectedAgentId: user?.selectedAgent?.referenceId,
   });
 
   // Sets the dispatch for apiHelper

From 1d1f72a5182841a8b311c7b2507ab6a8c9fadd40 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Wed, 13 Sep 2023 10:34:45 +0530
Subject: [PATCH 15/22] TP-34788 | endpoint fix

---
 src/components/utlis/apiHelper.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/utlis/apiHelper.ts b/src/components/utlis/apiHelper.ts
index 86b439b7..3cec3a0a 100644
--- a/src/components/utlis/apiHelper.ts
+++ b/src/components/utlis/apiHelper.ts
@@ -75,7 +75,7 @@ API_URLS[ApiKeys.NEW_ADDRESS] = '/addresses';
 API_URLS[ApiKeys.GET_SIGNED_URL] = '/cases/get-signed-urls';
 API_URLS[ApiKeys.GET_SIGNED_URL_FOR_REPORTEE] = '/cases/get-signed-urls-for-reportee';
 API_URLS[ApiKeys.CASE_UNIFIED_DETAILS] = '/v2/collection-cases/unified-details/{loanAccountNumber}';
-API_URLS[ApiKeys.UNGROUPED_ADDRESSES] = '/addresses/ungrouped/v2/{loanAccountNumber}';
+API_URLS[ApiKeys.UNGROUPED_ADDRESSES] = '/addresses/ungrouped-v2/{loanAccountNumber}';
 API_URLS[ApiKeys.PAST_FEEDBACK] = '/feedback';
 API_URLS[ApiKeys.PAST_FEEDBACK_ON_ADDRESSES] = '/feedback/v2';
 API_URLS[ApiKeys.NOTIFICATIONS] = '/notification/fetch';

From 56dbcf75411561feb376bf91937b164df2fa220f Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Wed, 13 Sep 2023 10:40:20 +0530
Subject: [PATCH 16/22] TP-34788 | disable firebase fallback for AM/TLs

---
 src/common/TrackingComponent.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/common/TrackingComponent.tsx b/src/common/TrackingComponent.tsx
index 4d913b89..00fd491f 100644
--- a/src/common/TrackingComponent.tsx
+++ b/src/common/TrackingComponent.tsx
@@ -250,7 +250,7 @@ const TrackingComponent: React.FC<ITrackingComponent> = ({ children }) => {
       }
       await handleGetCaseSyncStatus();
       dispatch(getConfigData());
-      if (LAST_SYNC_STATUS !== SyncStatus.FETCH_CASES) {
+      if (!isTeamLead && LAST_SYNC_STATUS !== SyncStatus.FETCH_CASES) {
         const updatedDetails: ISyncedCases = await fetchCasesToSync(referenceId);
         if (updatedDetails?.cases?.length) {
           dispatch(syncCasesByFallback(updatedDetails));

From 63c84d2e91abb2fdc4cd32c36b4f2fd9c0002c27 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Wed, 13 Sep 2023 15:41:02 +0530
Subject: [PATCH 17/22] TP-34788 | remove blink animation

---
 src/screens/allCases/HeaderLabel.tsx | 29 ----------------------------
 1 file changed, 29 deletions(-)

diff --git a/src/screens/allCases/HeaderLabel.tsx b/src/screens/allCases/HeaderLabel.tsx
index 74d8990b..af3c7b1b 100644
--- a/src/screens/allCases/HeaderLabel.tsx
+++ b/src/screens/allCases/HeaderLabel.tsx
@@ -27,14 +27,8 @@ const HeaderLabel: React.FC<HeaderLabelProps> = (props) => {
     selectedAgent: state.user.selectedAgent,
     loading: state.allCases.loading,
   }));
-  const opacityAnimation = useRef(new Animated.Value(0)).current;
-  const opacityStyle = { opacity: opacityAnimation };
   const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
 
-  useEffect(() => {
-    animateElement();
-  }, [selectedAgent, isTeamLead]);
-
   const getHeaderLabel = () => {
     if (isVisitPlan) {
       if (isLockedVisitPlanStatus) {
@@ -47,35 +41,12 @@ const HeaderLabel: React.FC<HeaderLabelProps> = (props) => {
     return `${selectedAgent.name}${!loading ? ` (${filteredListCount})` : ''}`;
   };
 
-  const animateElement = (iterations = 1) => {
-    if (iterations === 0) {
-      return;
-    }
-
-    Animated.timing(opacityAnimation, {
-      toValue: 0.5,
-      duration: 400,
-      useNativeDriver: true,
-      easing: Easing.linear,
-    }).start(() => {
-      Animated.timing(opacityAnimation, {
-        toValue: 0,
-        duration: 300,
-        useNativeDriver: true,
-        easing: Easing.linear,
-      }).start(() => {
-        animateElement(iterations - 1);
-      });
-    });
-  };
-
   if (isTeamLead && !isVisitPlan) {
     return (
       <TouchableOpacity
         style={GenericStyles.centerAlignedRow}
         onPress={() => setShowAgentSelectionBottomSheet(true)}
       >
-        <Animated.View style={[styles.animatedOverlay, opacityStyle]} />
         <Heading type="h3" style={[styles.headerLabel]}>
           {getHeaderLabel()}
         </Heading>

From f455a646ad7488913d0c99a0ab43f0cfe12b0a8b Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Wed, 13 Sep 2023 16:08:34 +0530
Subject: [PATCH 18/22] TP-34788 | fix

---
 src/screens/allCases/CasesList.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index 8927087a..e2d6c4a9 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -309,6 +309,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
           <FlashList
             ref={flashListRef}
             data={filteredCasesListWithCTA}
+            keyboardShouldPersistTaps={'handled'}
             scrollEventThrottle={16}
             contentContainerStyle={listStyle}
             onScroll={handleListScroll}

From 6242ca6735b20b28fabe0acbe6bfe8337a792fbe Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Wed, 13 Sep 2023 19:03:09 +0530
Subject: [PATCH 19/22] TP-34788 | fix

---
 src/screens/allCases/CompletedCase.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/screens/allCases/CompletedCase.tsx b/src/screens/allCases/CompletedCase.tsx
index 5b9a7f9a..d27a004e 100644
--- a/src/screens/allCases/CompletedCase.tsx
+++ b/src/screens/allCases/CompletedCase.tsx
@@ -30,7 +30,7 @@ const CompletedCase: React.FC = () => {
       />
       <VirtualizedList
         contentContainerStyle={[completeCasesList.length ? null : GenericStyles.fill, styles.list]}
-        data={[completeCasesList]}
+        data={completeCasesList}
         initialNumToRender={4}
         renderItem={(row) => {
           const caseDetailItem = caseDetails[row.item.caseReferenceId] as CaseDetail;

From bee18be96dd79fb10d90e41d3faff0a4a0e79f32 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 14 Sep 2023 12:52:10 +0530
Subject: [PATCH 20/22] TP-34788 | fixes

---
 src/screens/allCases/AgentListItem.tsx |  1 -
 src/screens/allCases/AgentListView.tsx | 36 ++++++++++++++++----------
 src/screens/allCases/EmptyList.tsx     | 19 +++++++++++---
 src/screens/allCases/constants.ts      |  2 ++
 4 files changed, 39 insertions(+), 19 deletions(-)

diff --git a/src/screens/allCases/AgentListItem.tsx b/src/screens/allCases/AgentListItem.tsx
index 99df3d8b..c307907a 100644
--- a/src/screens/allCases/AgentListItem.tsx
+++ b/src/screens/allCases/AgentListItem.tsx
@@ -42,7 +42,6 @@ const AgentListItem: React.FC<IAgentListItem> = ({ agent, leftAdornment, searchQ
         GenericStyles.br8,
         GenericStyles.border,
         GenericStyles.alignCenter,
-        GenericStyles.mb16,
         styles.shadow,
         {
           backgroundColor:
diff --git a/src/screens/allCases/AgentListView.tsx b/src/screens/allCases/AgentListView.tsx
index faf80229..56a6ac42 100644
--- a/src/screens/allCases/AgentListView.tsx
+++ b/src/screens/allCases/AgentListView.tsx
@@ -2,6 +2,7 @@ import {
   Animated,
   NativeScrollEvent,
   NativeSyntheticEvent,
+  Pressable,
   ScrollView,
   SectionList,
   StyleSheet,
@@ -10,7 +11,7 @@ import {
 import React, { useEffect, useMemo, useRef } from 'react';
 import Text from '../../../RN-UI-LIB/src/components/Text';
 import { IReportee, ISectionListData } from './interface';
-import { useAppDispatch, useAppSelector } from '../../hooks';
+import { useAppSelector } from '../../hooks';
 import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
 import AgentListItem from './AgentListItem';
@@ -58,7 +59,7 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
 
   if (filteredAgentsList.length === 0) {
     return (
-      <ScrollView contentContainerStyle={[GenericStyles.fill, styles.mt64]}>
+      <ScrollView contentContainerStyle={[GenericStyles.fill, styles.pt64]}>
         <View style={GenericStyles.alignCenter}>
           <NoCasesFoundIcon />
           <Heading style={GenericStyles.pt16} type="h4">
@@ -74,30 +75,34 @@ const AgentListView: React.FC<IAgentListView> = ({ scrollAnimation, searchQuery
     <SectionList
       ref={listRef}
       sections={filteredAgentsList}
-      keyExtractor={(item) => item.referenceId}
+      keyExtractor={(item, index) => item.referenceId + index}
       onScroll={handleListScroll}
-      contentContainerStyle={[GenericStyles.ph16, GenericStyles.mt8]}
+      contentContainerStyle={[GenericStyles.ph16, styles.pt8]}
       keyboardShouldPersistTaps={'handled'}
       renderItem={({ item }) => (
-        <AgentListItem
-          agent={item}
-          searchQuery={searchQuery}
-          leftAdornment={
-            item.referenceId === MY_CASE_ITEM.referenceId ? <ProfileSolidIcon /> : null
-          }
-        />
+        <Pressable style={[GenericStyles.pb16]}>
+          <AgentListItem
+            agent={item}
+            searchQuery={searchQuery}
+            leftAdornment={
+              item.referenceId === MY_CASE_ITEM.referenceId ? <ProfileSolidIcon /> : null
+            }
+          />
+        </Pressable>
       )}
       renderSectionHeader={({ section: { title } }) => {
         if (!title) {
           return null;
         }
         return (
-          <View style={[GenericStyles.centerAlignedRow, GenericStyles.pb16, GenericStyles.mt16]}>
+          <Pressable
+            style={[GenericStyles.centerAlignedRow, GenericStyles.pb16, GenericStyles.pt16]}
+          >
             <Text bold dark>
               {title}
             </Text>
             <View style={styles.separatorLine} />
-          </View>
+          </Pressable>
         );
       }}
     />
@@ -111,9 +116,12 @@ const styles = StyleSheet.create({
     backgroundColor: COLORS.BORDER.PRIMARY,
     marginLeft: 8,
   },
-  mt64: {
+  pt64: {
     marginTop: 64,
   },
+  pt8: {
+    paddingTop: 8,
+  },
 });
 
 export default AgentListView;
diff --git a/src/screens/allCases/EmptyList.tsx b/src/screens/allCases/EmptyList.tsx
index fae3b1cd..2b35122a 100644
--- a/src/screens/allCases/EmptyList.tsx
+++ b/src/screens/allCases/EmptyList.tsx
@@ -9,7 +9,7 @@ import { RootState } from '../../store/store';
 import GeneratingVisitPlan from '../../assets/icons/GeneratingVisitPlanIcon';
 import NoCasesFoundIcon from '../../assets/icons/NoCasesFoundIcon';
 import EmptyPageCheckIcon from '../../assets/icons/EmptyPageCheckIcon';
-import { VisitPlanStatus } from '../../reducer/userSlice';
+import { MY_CASE_ITEM, VisitPlanStatus } from '../../reducer/userSlice';
 import { EmptyListMessages } from './constants';
 import { navigateToScreen } from '../../components/utlis/navigationUtlis';
 import { dateFormat, DAY_MONTH_DATE_FORMAT } from '../../../RN-UI-LIB/src/utlis/dates';
@@ -23,9 +23,14 @@ interface IEmptyList {
 
 const EmptyList: React.FC<IEmptyList> = (props) => {
   const { isCompleted, isVisitPlan, isFilterApplied, setShowAgentSelectionBottomSheet } = props;
-  const { isLockedVisitPlanStatus, isCasesLoading } = useAppSelector((state: RootState) => ({
+  const {
+    isLockedVisitPlanStatus,
+    isCasesLoading,
+    selectedAgent = MY_CASE_ITEM,
+  } = useAppSelector((state: RootState) => ({
     isLockedVisitPlanStatus: state.user?.lock?.visitPlanStatus === VisitPlanStatus.LOCKED,
     isCasesLoading: state.allCases.loading,
+    selectedAgent: state.user?.selectedAgent,
   }));
 
   const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
@@ -65,7 +70,10 @@ const EmptyList: React.FC<IEmptyList> = (props) => {
     }
 
     if (isTeamLead) {
-      return EmptyListMessages.NO_ACTIVE_ALLOCATIONS;
+      if (selectedAgent.referenceId === MY_CASE_ITEM.referenceId) {
+        return EmptyListMessages.NO_ACTIVE_ALLOCATIONS;
+      }
+      return EmptyListMessages.NO_ACTIVE_ALLOCATIONS_SELECTED_AGENT;
     }
 
     return EmptyListMessages.NO_PENDING_CASES;
@@ -79,7 +87,10 @@ const EmptyList: React.FC<IEmptyList> = (props) => {
       return EmptyListMessages.NO_CASES_FOUND_SUB;
     }
     if (isTeamLead) {
-      return EmptyListMessages.SELECT_AGENT;
+      if (selectedAgent.referenceId === MY_CASE_ITEM.referenceId) {
+        return EmptyListMessages.SELECT_AGENT;
+      }
+      return EmptyListMessages.SELECT_AGENT_SELECTED_AGENT;
     }
   };
 
diff --git a/src/screens/allCases/constants.ts b/src/screens/allCases/constants.ts
index 99052f0a..7df28452 100644
--- a/src/screens/allCases/constants.ts
+++ b/src/screens/allCases/constants.ts
@@ -46,7 +46,9 @@ export const EmptyListMessages = {
   GENERATING_VISIT_PLAN: 'Generating a visit plan for',
   GENERATING_VISIT_PLAN_SUB: '*Any pending cases from previous visit plan will be added',
   NO_ACTIVE_ALLOCATIONS: 'You don’t have any active allocations',
+  NO_ACTIVE_ALLOCATIONS_SELECTED_AGENT: 'Selected agent does not have any active allocations',
   SELECT_AGENT: 'Select an agent to view cases',
+  SELECT_AGENT_SELECTED_AGENT: 'Select another agent to view cases',
 };
 
 export const ToastMessages = {

From 2df6b540544af298c1f373e7309a2a06bf3fa6a1 Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 14 Sep 2023 13:08:41 +0530
Subject: [PATCH 21/22] TP-34788 | Address screen header fix

---
 .../UngroupedAddressContainer.tsx             | 102 +++++++++---------
 1 file changed, 52 insertions(+), 50 deletions(-)

diff --git a/src/screens/addressGeolocation/UngroupedAddressContainer.tsx b/src/screens/addressGeolocation/UngroupedAddressContainer.tsx
index c6bfbfad..577b9c68 100644
--- a/src/screens/addressGeolocation/UngroupedAddressContainer.tsx
+++ b/src/screens/addressGeolocation/UngroupedAddressContainer.tsx
@@ -88,58 +88,60 @@ const UngroupedAddressContainer: React.FC<IUngroupedAddress> = ({ route: routePa
   };
 
   return (
-    <ScrollView>
+    <View style={GenericStyles.fill}>
       <NavigationHeader title={PAGE_TITLE} onBack={goBack} />
-      <SuspenseLoader
-        loading={loading}
-        fallBack={
-          <>
-            {[...Array(8).keys()].map(() => (
-              <LineLoader
-                width="100%"
-                height={75}
-                style={[GenericStyles.br6, { marginBottom: 20 }]}
-              />
-            ))}
-          </>
-        }
-      >
-        {ungroupedAddressList?.length ? (
-          <View>
-            {ungroupedAddressList.map((ungroupedAddressItem: IAddress) => (
-              <View>
-                <AddressItem
-                  caseId={caseId}
-                  showRelativeDistance
-                  containerStyle={styles.addressItemContainer}
-                  key={ungroupedAddressItem?.id}
-                  addressItem={ungroupedAddressItem}
-                  showActionButtons
-                  handleOldFeedbackRouting={() => {
-                    handleOpenOldFeedbacks(ungroupedAddressItem);
-                  }}
-                  handleCloseRouting={() => {
-                    navigateToScreen(PageRouteEnum.ADDITIONAL_ADDRESSES, commonParams);
-                  }}
-                  showSource
+      <ScrollView>
+        <SuspenseLoader
+          loading={loading}
+          fallBack={
+            <>
+              {[...Array(8).keys()].map(() => (
+                <LineLoader
+                  width="100%"
+                  height={75}
+                  style={[GenericStyles.br6, { marginBottom: 20 }]}
                 />
-              </View>
-            ))}
-          </View>
-        ) : (
-          <View
-            style={[
-              styles.noAddressContainer,
-              GenericStyles.centerAligned,
-              GenericStyles.columnDirection,
-            ]}
-          >
-            <HomeIcon />
-            <Text style={[styles.textContainer, styles.noAddressText]}>No addresses found</Text>
-          </View>
-        )}
-      </SuspenseLoader>
-    </ScrollView>
+              ))}
+            </>
+          }
+        >
+          {ungroupedAddressList?.length ? (
+            <View>
+              {ungroupedAddressList.map((ungroupedAddressItem: IAddress) => (
+                <View>
+                  <AddressItem
+                    caseId={caseId}
+                    showRelativeDistance
+                    containerStyle={styles.addressItemContainer}
+                    key={ungroupedAddressItem?.id}
+                    addressItem={ungroupedAddressItem}
+                    showActionButtons
+                    handleOldFeedbackRouting={() => {
+                      handleOpenOldFeedbacks(ungroupedAddressItem);
+                    }}
+                    handleCloseRouting={() => {
+                      navigateToScreen(PageRouteEnum.ADDITIONAL_ADDRESSES, commonParams);
+                    }}
+                    showSource
+                  />
+                </View>
+              ))}
+            </View>
+          ) : (
+            <View
+              style={[
+                styles.noAddressContainer,
+                GenericStyles.centerAligned,
+                GenericStyles.columnDirection,
+              ]}
+            >
+              <HomeIcon />
+              <Text style={[styles.textContainer, styles.noAddressText]}>No addresses found</Text>
+            </View>
+          )}
+        </SuspenseLoader>
+      </ScrollView>
+    </View>
   );
 };
 

From 1e70711c4d8b11338f60250b3a8211a6ecd94bcc Mon Sep 17 00:00:00 2001
From: Aman Chaturvedi <aman.chaturvedi@navi.com>
Date: Thu, 14 Sep 2023 16:40:58 +0530
Subject: [PATCH 22/22] TP-34788 | Clickstream events added for AM/TLs

---
 RN-UI-LIB                                    |  2 +-
 android/app/build.gradle                     | 10 +++++++++-
 src/common/Constants.ts                      | 21 ++++++++++++++++++++
 src/hooks/useFirestoreUpdates.ts             |  1 +
 src/reducer/allCasesSlice.ts                 | 10 +++++++++-
 src/screens/allCases/AgentListItem.tsx       |  8 +++++++-
 src/screens/allCases/AgentsListContainer.tsx | 13 +++++++++++-
 src/screens/allCases/CasesList.tsx           |  2 +-
 src/screens/allCases/EmptyList.tsx           |  9 ++++++++-
 src/screens/allCases/HeaderLabel.tsx         |  9 ++++++++-
 10 files changed, 77 insertions(+), 8 deletions(-)

diff --git a/RN-UI-LIB b/RN-UI-LIB
index 3ab183e5..4c7f4f68 160000
--- a/RN-UI-LIB
+++ b/RN-UI-LIB
@@ -1 +1 @@
-Subproject commit 3ab183e53214b6ac198f0376f7723cac2da96d83
+Subproject commit 4c7f4f6880d96bffa856e04d7b2b4d383e42c5cf
diff --git a/android/app/build.gradle b/android/app/build.gradle
index 848437fe..047ab2e5 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -216,11 +216,19 @@ android {
         }
     }
     signingConfigs {
-        debug {
+       debug {
+         if (project.hasProperty('MYAPP_UPLOAD_STORE_FILE')) {
+            storeFile file(MYAPP_UPLOAD_STORE_FILE)
+            storePassword MYAPP_UPLOAD_STORE_PASSWORD
+            keyAlias MYAPP_UPLOAD_KEY_ALIAS
+            keyPassword MYAPP_UPLOAD_KEY_PASSWORD
+         }
+         else {
             storeFile file('debug.keystore')
             storePassword 'android'
             keyAlias 'androiddebugkey'
             keyPassword 'android'
+         }
         }
         release {
             if (project.hasProperty('MYAPP_UPLOAD_STORE_FILE')) {
diff --git a/src/common/Constants.ts b/src/common/Constants.ts
index d5279d5d..07347af7 100644
--- a/src/common/Constants.ts
+++ b/src/common/Constants.ts
@@ -525,6 +525,27 @@ export const CLICKSTREAM_EVENT_NAMES = {
     name: 'FA_GEOLOCATION_CAPTURING_FAILED',
     description: 'Geolocation capturing failed',
   },
+  // AM/TLs
+  FA_AGENT_LIST_DROPDOWN_CLICKED: {
+    name: 'FA_AGENT_LIST_DROPDOWN_CLICKED',
+    description: 'Agent list dropdown clicked',
+  },
+  FA_AGENT_LIST_BUTTON_CLICKED: {
+    name: 'FA_AGENT_LIST_BUTTON_CLICKED',
+    description: 'Agent list button clicked',
+  },
+  FA_AGENT_LIST_BOTTOMSHEET_LOAD_SUCCESS: {
+    name: 'FA_AGENT_LIST_BOTTOMSHEET_LOAD_SUCCESS',
+    description: 'Agent list bottomsheet load success',
+  },
+  FA_AGENT_SELECT_BUTTON_CLICKED: {
+    name: 'FA_AGENT_SELECT_BUTTON_CLICKED',
+    description: 'Agent select button clicked',
+  },
+  FA_AGENT_CASE_LOAD_SUCCESS: {
+    name: 'FA_AGENT_CASE_LOAD_SUCCESS',
+    description: 'Agent case load success',
+  },
 } as const;
 
 export enum MimeType {
diff --git a/src/hooks/useFirestoreUpdates.ts b/src/hooks/useFirestoreUpdates.ts
index f6490dae..9d004efa 100644
--- a/src/hooks/useFirestoreUpdates.ts
+++ b/src/hooks/useFirestoreUpdates.ts
@@ -106,6 +106,7 @@ const useFirestoreUpdates = () => {
         caseUpdates,
         isInitialLoad,
         isVisitPlanLocked: lockRef?.current?.visitPlanStatus === VisitPlanStatus.LOCKED,
+        selectedAgent: selectedAgent,
       })
     );
     !isInitialLoad && showCaseUpdationToast(newlyAddedCases, deletedCases);
diff --git a/src/reducer/allCasesSlice.ts b/src/reducer/allCasesSlice.ts
index 4756b249..bf1ffab6 100644
--- a/src/reducer/allCasesSlice.ts
+++ b/src/reducer/allCasesSlice.ts
@@ -12,6 +12,7 @@ import {
   CaseAllocationType,
   caseVerdict,
   ICaseItem,
+  IReportee,
 } from '../screens/allCases/interface';
 import { CaseDetail, CONTEXT_TASK_STATUSES, DOCUMENT_TYPE } from '../screens/caseDetails/interface';
 import { addClickstreamEvent } from '../services/clickstreamEventService';
@@ -19,6 +20,7 @@ import { getLoanAccountNumber } from '../components/utlis/commonFunctions';
 import { getVisitedWidgetsNodeList } from '../components/form/services/forms.service';
 import { CollectionCaseWidgetId, CommonCaseWidgetId } from '../types/template.types';
 import { IAvatarUri } from '../action/caseListAction';
+import { MY_CASE_ITEM } from './userSlice';
 
 export type ICasesMap = { [key: string]: ICaseItem };
 interface IAllCasesSlice {
@@ -237,10 +239,11 @@ const allCasesSlice = createSlice({
       state.loading = action.payload;
     },
     updateCaseDetailsFirestore: (state, action) => {
-      const { caseUpdates, isInitialLoad, isVisitPlanLocked } = action.payload as {
+      const { caseUpdates, isInitialLoad, isVisitPlanLocked, selectedAgent } = action.payload as {
         caseUpdates: CaseUpdates[];
         isInitialLoad: boolean;
         isVisitPlanLocked: boolean;
+        selectedAgent: IReportee;
       };
       let newVisitCaseLoanIds: string[] = [];
       let newVisitCollectionCases: string[] = [];
@@ -354,6 +357,11 @@ const allCasesSlice = createSlice({
       state.pinnedList = pinnedList;
       state.newVisitedCases = newVisitCollectionCases;
       if (state.loading) {
+        if (selectedAgent && selectedAgent.referenceId !== MY_CASE_ITEM.referenceId) {
+          addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_AGENT_CASE_LOAD_SUCCESS, {
+            selectedAgent: selectedAgent.referenceId,
+          });
+        }
         state.loading = false;
       }
 
diff --git a/src/screens/allCases/AgentListItem.tsx b/src/screens/allCases/AgentListItem.tsx
index c307907a..19bc42a9 100644
--- a/src/screens/allCases/AgentListItem.tsx
+++ b/src/screens/allCases/AgentListItem.tsx
@@ -13,6 +13,8 @@ import fuzzysort from 'fuzzysort';
 import { MY_CASE_ITEM, setSelectedAgent } from '../../reducer/userSlice';
 import { resetFilters } from '../../reducer/filtersSlice';
 import { setGlobalUserData } from '../../constants/Global';
+import { addClickstreamEvent } from '../../services/clickstreamEventService';
+import { CLICKSTREAM_EVENT_NAMES } from '../../common/Constants';
 
 interface IAgentListItem {
   agent: IReportee;
@@ -25,8 +27,12 @@ const AgentListItem: React.FC<IAgentListItem> = ({ agent, leftAdornment, searchQ
   const dispatch = useAppDispatch();
 
   const handleAgentSelection = () => {
+    const selectedAgentId = agent.referenceId;
+    addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_AGENT_SELECT_BUTTON_CLICKED, {
+      selectedAgentId,
+    });
     dispatch(setSelectedAgent(agent));
-    setGlobalUserData({ selectedAgentId: agent.referenceId });
+    setGlobalUserData({ selectedAgentId });
     dispatch(resetFilters());
     dispatch(resetCasesData());
     dispatch(setShowAgentSelectionBottomSheet(false));
diff --git a/src/screens/allCases/AgentsListContainer.tsx b/src/screens/allCases/AgentsListContainer.tsx
index 4b0fe308..41ac3a91 100644
--- a/src/screens/allCases/AgentsListContainer.tsx
+++ b/src/screens/allCases/AgentsListContainer.tsx
@@ -8,12 +8,23 @@ import { getAgentsList } from '../../action/reporteesActions';
 import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
 import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
 import AgentListViewLoading from './AgentListViewLoading';
+import { CLICKSTREAM_EVENT_NAMES } from '../../common/Constants';
+import { addClickstreamEvent } from '../../services/clickstreamEventService';
 
-const AgentsListContainer = () => {
+interface IAgentsListContainer {
+  showAgentSelectionBottomSheet: boolean;
+}
+
+const AgentsListContainer: React.FC<IAgentsListContainer> = ({ showAgentSelectionBottomSheet }) => {
   const [searchQuery, setSearchQuery] = React.useState<string>('');
   const { isLoading, agentsList } = useAppSelector((state) => state.reportees);
   const dispatch = useAppDispatch();
 
+  useEffect(() => {
+    showAgentSelectionBottomSheet &&
+      addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_AGENT_LIST_BOTTOMSHEET_LOAD_SUCCESS);
+  }, [showAgentSelectionBottomSheet]);
+
   const scrollAnimation = useRef(new Animated.Value(0)).current;
 
   useEffect(() => {
diff --git a/src/screens/allCases/CasesList.tsx b/src/screens/allCases/CasesList.tsx
index e2d6c4a9..8b250ebb 100644
--- a/src/screens/allCases/CasesList.tsx
+++ b/src/screens/allCases/CasesList.tsx
@@ -355,7 +355,7 @@ const CasesList: React.FC<ICasesList> = ({ casesList = [], isVisitPlan, allCases
         setVisible={toggleAgentSelectionBottomSheet}
       >
         <View style={[GenericStyles.mt16, GenericStyles.fill]}>
-          <AgentsListContainer />
+          <AgentsListContainer showAgentSelectionBottomSheet={showAgentSelectionBottomSheet} />
         </View>
       </BottomSheet>
     </View>
diff --git a/src/screens/allCases/EmptyList.tsx b/src/screens/allCases/EmptyList.tsx
index 2b35122a..9299208e 100644
--- a/src/screens/allCases/EmptyList.tsx
+++ b/src/screens/allCases/EmptyList.tsx
@@ -13,6 +13,8 @@ import { MY_CASE_ITEM, VisitPlanStatus } from '../../reducer/userSlice';
 import { EmptyListMessages } from './constants';
 import { navigateToScreen } from '../../components/utlis/navigationUtlis';
 import { dateFormat, DAY_MONTH_DATE_FORMAT } from '../../../RN-UI-LIB/src/utlis/dates';
+import { addClickstreamEvent } from '../../services/clickstreamEventService';
+import { CLICKSTREAM_EVENT_NAMES } from '../../common/Constants';
 
 interface IEmptyList {
   isCompleted?: boolean;
@@ -94,6 +96,11 @@ const EmptyList: React.FC<IEmptyList> = (props) => {
     }
   };
 
+  const handleAgentSelectionCTAClick = () => {
+    addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_AGENT_LIST_BUTTON_CLICKED);
+    setShowAgentSelectionBottomSheet && setShowAgentSelectionBottomSheet(true);
+  };
+
   const getBtnDetails = () => {
     if (isVisitPlan && !isFilterApplied && !isLockedVisitPlanStatus) {
       return {
@@ -104,7 +111,7 @@ const EmptyList: React.FC<IEmptyList> = (props) => {
 
     if (isTeamLead && setShowAgentSelectionBottomSheet) {
       return {
-        btnHandler: () => setShowAgentSelectionBottomSheet(true),
+        btnHandler: handleAgentSelectionCTAClick,
         btnText: 'Select Agent',
       };
     }
diff --git a/src/screens/allCases/HeaderLabel.tsx b/src/screens/allCases/HeaderLabel.tsx
index af3c7b1b..22d3aa5a 100644
--- a/src/screens/allCases/HeaderLabel.tsx
+++ b/src/screens/allCases/HeaderLabel.tsx
@@ -8,6 +8,8 @@ import { useAppSelector } from '../../hooks';
 import { RootState } from '../../store/store';
 import { MY_CASE_ITEM, VisitPlanStatus } from '../../reducer/userSlice';
 import { dateFormat, DAY_MONTH_DATE_FORMAT } from '../../../RN-UI-LIB/src/utlis/dates';
+import { addClickstreamEvent } from '../../services/clickstreamEventService';
+import { CLICKSTREAM_EVENT_NAMES } from '../../common/Constants';
 
 interface HeaderLabelProps {
   setShowAgentSelectionBottomSheet: (val: boolean) => void;
@@ -29,6 +31,11 @@ const HeaderLabel: React.FC<HeaderLabelProps> = (props) => {
   }));
   const isTeamLead = useAppSelector((state) => state.user.isTeamLead);
 
+  const handleAgentSelectionCTAClick = () => {
+    addClickstreamEvent(CLICKSTREAM_EVENT_NAMES.FA_AGENT_LIST_DROPDOWN_CLICKED);
+    setShowAgentSelectionBottomSheet(true);
+  };
+
   const getHeaderLabel = () => {
     if (isVisitPlan) {
       if (isLockedVisitPlanStatus) {
@@ -45,7 +52,7 @@ const HeaderLabel: React.FC<HeaderLabelProps> = (props) => {
     return (
       <TouchableOpacity
         style={GenericStyles.centerAlignedRow}
-        onPress={() => setShowAgentSelectionBottomSheet(true)}
+        onPress={handleAgentSelectionCTAClick}
       >
         <Heading type="h3" style={[styles.headerLabel]}>
           {getHeaderLabel()}