data wired to case details

src/screens/caseDetails/CaseDetails.tsx

@@ -5,20 +5,22 @@ import {GenericStyles} from '../../../RN-UI-LIB/src/styles';
 import TaskStepper from './journeyStepper/TaskStepper';
 import BackArrowIcon from '../../../RN-UI-LIB/src/Icons/BackArrowIcon';
 import { goBack } from '../../components/utlis/navigationUtlis';
+import { NavigationProp, NavigatorScreenParams } from '@react-navigation/core';
+import { useAppSelector } from '../../hooks';
 
-interface ICaseDetails {
-    caseId: string;
-}
 
-const CaseDetails: React.FC<ICaseDetails> = (props) => {
-    console.log(props)
+const CaseDetails: React.FC = (props) => {
+    const {route : { params : {caseId}}} = props;
+
+    const detailObject = useAppSelector(state => state.allCases.caseDetails[caseId])
+
     return (
         <SafeAreaView style={[GenericStyles.fill, GenericStyles.whiteBackground]}>
             <View style={[styles.navigationContainer, GenericStyles.row, GenericStyles.alignCenter, GenericStyles.p16]}>
                 <BackArrowIcon onPress={goBack} />
             </View>
             <View style={GenericStyles.p16}>
-                <UserDetailsSection />
+                <UserDetailsSection caseDetail={detailObject} />
                 <TaskStepper />
             </View>
         </SafeAreaView>

src/screens/caseDetails/UserDetailsSection.tsx

@@ -11,11 +11,17 @@ import CalenderIcon from '../../assets/icons/CalenderIcon';
 import Text from '../../../RN-UI-LIB/src/components/Text';
 import {COLORS} from '../../../RN-UI-LIB/src/styles/colors';
 
-const UserDetailsSection: React.FC = () => {
-    const {loanDetails, customerDetails} = useSelector((state: RootState) => ({
-        loanDetails: state.case.loanDetails,
-        customerDetails: state.case.customerInfo,
-    }));
+interface IUserDetailsSection{
+    caseDetail : any;
+}
+
+const UserDetailsSection: React.FC<IUserDetailsSection> = (props) => {
+    const {caseDetail} = props;
+    const {customerInfo, loanDetails} = caseDetail;
+    // const {loanDetails, customerDetails} = useSelector((state: RootState) => ({
+    //     loanDetails: state.case.loanDetails,
+    //     customerDetails: state.case.customerInfo,
+    // }));
     const disbursalDate = loanDetails.disbursalDate;
     const allocationDate = loanDetails.allocationDate;
 
@@ -23,13 +29,13 @@ const UserDetailsSection: React.FC = () => {
         <View style={[GenericStyles.row, GenericStyles.pb16, styles.container]}>
             <View style={[styles.avatarContainer]}>
                 <Avatar
-                    name={customerDetails.customerName}
-                    dataURI={customerDetails.imageURL}
+                    name={customerInfo.customerName}
+                    dataURI={customerInfo.imageURL}
                 />
             </View>
             <View style={[styles.infoContainer]}>
                 <Heading dark type="h4">
-                    {customerDetails.customerName}
+                    {customerInfo.customerName}
                 </Heading>
                 <View style={[GenericStyles.row]}>
                     <IconLabel