address-verification-app/ProtectedRouter.tsx

import {createNativeStackNavigator} from '@react-navigation/native-stack';
import React from 'react';
import {View} from 'react-native';
import {SafeAreaView} from 'react-native-safe-area-context';
import {useSelector} from 'react-redux';
import Widget from './src/components/form';
import RenderingEngine from './src/components/formRenderingEngine';
import Login from './src/components/login';
import OtpInput from './src/components/login/OtpInput';
import {RootState} from './src/store/store';
import data from './src/data/templateData.json';
import userData from './src/data/userData.json';
import {getUniqueId} from 'react-native-device-info';
import {useAppDispatch} from './src/hooks';
import {setAuthData} from './src/reducer/commonSlice';
import AllCases from './src/components/screens/allCases/AllCases';
import AllCasesMain from './src/components/screens/allCases';
import {setDeviceId} from './src/reducer/userSlice';
import { _map } from './RN-UI-LIB/src/utlis/common';
import CaseDetails from './src/components/caseDetails/CaseDetails';
import TodoList from './src/components/screens/todoList/TodoList';

const Stack = createNativeStackNavigator();

const LoginScreen = () => <Login />;

const OTPScreen = () => <OtpInput />;

const HomeScreen = () => (
    <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
        <SafeAreaView>
            <RenderingEngine data={data} userData={userData} />
        </SafeAreaView>
    </View>
);

const ProtectedRouter = () => {
    const user = useSelector(
        (state: RootState) => state.user,
    );

    const {isLoggedIn, deviceId} = user;

    const dispatch = useAppDispatch();

    if (!deviceId) {
        getUniqueId().then(id => dispatch(setDeviceId(id)));
    }

    return (
        <Stack.Navigator>
            {!isLoggedIn ? (
                <>
                    <Stack.Screen
                        name="Home"
                        component={AllCasesMain}
                        options={{
                            header: () => null,
                        }}
                    />
                    <Stack.Screen
                        name="caseDetail"
                        component={CaseDetails}
                        options={{
                            header: () => null,
                        }}
                    />
                    {_map(data.widgets, key => (
                        <Stack.Screen
                            key={key}
                            name={key}
                            component={Widget}
                            options={{
                                header: () => null,
                            }}
                        />
                    ))}
                    <Stack.Screen
                        name="TodoList"
                        component={TodoList}
                        options={{
                            header: () => null,
                        }}
                    />
                </>
            ) : (
                <>
                    <Stack.Screen
                        name="Login"
                        component={LoginScreen}
                        options={{
                            header: () => null,
                        }}
                    />
                    <Stack.Screen
                        name="OTP"
                        component={OTPScreen}
                        options={{
                            header: () => null,
                        }}
                    />
                </>
            )}
        </Stack.Navigator>
    );
};

export default ProtectedRouter;