Fix form keyboard issues and sticky footers in agent screens

2026-05-26 16:34:05 +05:30
commit 9ac5e95d52
410 changed files with 86650 additions and 0 deletions
@@ -0,0 +1,193 @@
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import Ionicons from '@react-native-vector-icons/ionicons';
+
+import { useTheme } from '../theme';
+import type {
+  AgentTabParamList,
+  AgentDashboardStackParamList,
+  AgentCustomersStackParamList,
+  AgentCollectionsStackParamList,
+  AgentLoansStackParamList,
+  AgentProfileStackParamList,
+} from '../modules/agent/navigation/agentNavigationTypes';
+
+import AgentDashboardScreen from '../modules/agent/screens/AgentDashboardScreen';
+import AgentRouteScreen from '../modules/agent/screens/AgentRouteScreen';
+
+import CustomerListScreen from '../modules/agent/screens/CustomerListScreen';
+import CustomerDetailScreen from '../modules/agent/screens/CustomerDetailScreen';
+import AddEditCustomerScreen from '../modules/agent/screens/AddEditCustomerScreen';
+import CustomerInstallmentHistoryScreen from '../modules/agent/screens/CustomerInstallmentHistoryScreen';
+
+import DailyCollectionScreen from '../modules/agent/screens/DailyCollectionScreen';
+import CollectionHistoryScreen from '../modules/agent/screens/CollectionHistoryScreen';
+import CollectionReceiptScreen from '../modules/agent/screens/CollectionReceiptScreen';
+
+import AgentLoansScreen from '../modules/agent/screens/AgentLoansScreen';
+import CreateLoanRequestScreen from '../modules/agent/screens/CreateLoanRequestScreen';
+import AccountOpeningScreen from '../modules/agent/screens/AccountOpeningScreen';
+import CommissionDashboardScreen from '../modules/agent/screens/CommissionDashboardScreen';
+
+import AgentProfileScreen from '../modules/agent/screens/AgentProfileScreen';
+import SmsHistoryScreen from '../modules/agent/screens/SmsHistoryScreen';
+import AgentChangePasswordScreen from '../modules/agent/screens/AgentChangePasswordScreen';
+
+const Tab = createBottomTabNavigator<AgentTabParamList>();
+
+const DashboardStack = createNativeStackNavigator<AgentDashboardStackParamList>();
+const DashboardNavigator = () => (
+  <DashboardStack.Navigator screenOptions={{ headerShown: false }}>
+    <DashboardStack.Screen name="AgentDashboardMain" component={AgentDashboardScreen} />
+    <DashboardStack.Screen name="AgentRoute" component={AgentRouteScreen} />
+  </DashboardStack.Navigator>
+);
+
+const CustomersStack = createNativeStackNavigator<AgentCustomersStackParamList>();
+const CustomersNavigator = () => (
+  <CustomersStack.Navigator screenOptions={{ headerShown: false }}>
+    <CustomersStack.Screen name="CustomerList" component={CustomerListScreen} />
+    <CustomersStack.Screen name="CustomerDetail" component={CustomerDetailScreen} />
+    <CustomersStack.Screen name="AddEditCustomer" component={AddEditCustomerScreen} />
+    <CustomersStack.Screen name="CustomerInstallmentHistory" component={CustomerInstallmentHistoryScreen} />
+  </CustomersStack.Navigator>
+);
+
+const CollectionsStack = createNativeStackNavigator<AgentCollectionsStackParamList>();
+const CollectionsNavigator = () => (
+  <CollectionsStack.Navigator screenOptions={{ headerShown: false }}>
+    <CollectionsStack.Screen name="DailyCollection" component={DailyCollectionScreen} />
+    <CollectionsStack.Screen name="CollectionHistory" component={CollectionHistoryScreen} />
+    <CollectionsStack.Screen name="CollectionReceipt" component={CollectionReceiptScreen} />
+  </CollectionsStack.Navigator>
+);
+
+const LoansStack = createNativeStackNavigator<AgentLoansStackParamList>();
+const LoansNavigator = () => (
+  <LoansStack.Navigator screenOptions={{ headerShown: false }}>
+    <LoansStack.Screen name="AgentLoansMain" component={AgentLoansScreen} />
+    <LoansStack.Screen name="CreateLoanRequest" component={CreateLoanRequestScreen} />
+    <LoansStack.Screen name="AccountOpening" component={AccountOpeningScreen} />
+    <LoansStack.Screen name="CommissionDashboard" component={CommissionDashboardScreen} />
+  </LoansStack.Navigator>
+);
+
+const ProfileStack = createNativeStackNavigator<AgentProfileStackParamList>();
+const ProfileNavigator = () => (
+  <ProfileStack.Navigator screenOptions={{ headerShown: false }}>
+    <ProfileStack.Screen name="AgentProfileMain" component={AgentProfileScreen} />
+    <ProfileStack.Screen name="SmsHistory" component={SmsHistoryScreen} />
+    <ProfileStack.Screen name="AgentChangePassword" component={AgentChangePasswordScreen} />
+  </ProfileStack.Navigator>
+);
+
+type TabIconName =
+  | 'home-outline' | 'home'
+  | 'people-outline' | 'people'
+  | 'wallet-outline' | 'wallet'
+  | 'document-text-outline' | 'document-text'
+  | 'person-outline' | 'person';
+
+const TabIcon = ({ color, focused, name }: { color: string; focused: boolean; name: TabIconName }) => {
+  const activeBackground = focused ? `${color}22` : 'transparent';
+  return (
+    <View style={[styles.iconFrame, { borderColor: color, backgroundColor: activeBackground }]}>
+      <Ionicons name={name} size={18} color={color} />
+    </View>
+  );
+};
+
+export const AgentNavigator = () => {
+  const theme = useTheme();
+
+  return (
+    <Tab.Navigator
+      screenOptions={{
+        headerShown: false,
+        lazy: true,
+        tabBarActiveTintColor: theme.colors.primary,
+        tabBarInactiveTintColor: theme.colors.textMuted,
+        tabBarStyle: {
+          backgroundColor: theme.colors.white,
+          borderTopColor: theme.colors.cardBorder,
+          borderTopWidth: 1,
+          height: 90,
+          paddingBottom: 30,
+          paddingTop: 12,
+          position: 'absolute',
+          bottom: 0,
+          left: 0,
+          right: 0,
+          elevation: 20,
+          shadowColor: '#000',
+          shadowOffset: { width: 0, height: -4 },
+          shadowOpacity: 0.05,
+          shadowRadius: 8,
+        },
+        tabBarLabelStyle: {
+          fontSize: 10,
+          fontWeight: '700',
+          marginTop: 6,
+          textTransform: 'uppercase',
+          letterSpacing: 0.5,
+        },
+        tabBarItemStyle: {
+          paddingVertical: 5,
+        },
+      }}
+    >
+      <Tab.Screen
+        name="AgentDashboard"
+        component={DashboardNavigator}
+        options={{
+          title: 'Home',
+          tabBarIcon: ({ color, focused }) => <TabIcon color={color} focused={focused} name={focused ? 'home' : 'home-outline'} />,
+        }}
+      />
+      <Tab.Screen
+        name="AgentCustomers"
+        component={CustomersNavigator}
+        options={{
+          title: 'Clients',
+          tabBarIcon: ({ color, focused }) => <TabIcon color={color} focused={focused} name={focused ? 'people' : 'people-outline'} />,
+        }}
+      />
+      <Tab.Screen
+        name="AgentCollections"
+        component={CollectionsNavigator}
+        options={{
+          title: 'Collect',
+          tabBarIcon: ({ color, focused }) => <TabIcon color={color} focused={focused} name={focused ? 'wallet' : 'wallet-outline'} />,
+        }}
+      />
+      <Tab.Screen
+        name="AgentLoans"
+        component={LoansNavigator}
+        options={{
+          title: 'Workspace',
+          tabBarIcon: ({ color, focused }) => <TabIcon color={color} focused={focused} name={focused ? 'document-text' : 'document-text-outline'} />,
+        }}
+      />
+      <Tab.Screen
+        name="AgentProfile"
+        component={ProfileNavigator}
+        options={{
+          title: 'Profile',
+          tabBarIcon: ({ color, focused }) => <TabIcon color={color} focused={focused} name={focused ? 'person' : 'person-outline'} />,
+        }}
+      />
+    </Tab.Navigator>
+  );
+};
+
+const styles = StyleSheet.create({
+  iconFrame: {
+    width: 32,
+    height: 32,
+    borderRadius: 8,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+});