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,123 @@
+import React, { useState } from 'react';
+import { View, StyleSheet, Text, Pressable, ScrollView } from 'react-native';
+import { NativeStackScreenProps } from '@react-navigation/native-stack';
+import Ionicons from '@react-native-vector-icons/ionicons';
+import Animated, { FadeIn, FadeInRight, FadeInLeft } from 'react-native-reanimated';
+
+import { ScreenShell } from '../../../components';
+import { useTheme } from '../../../theme';
+import type { AgentLoansStackParamList } from '../navigation/agentNavigationTypes';
+
+import LoanRequestListScreen from './LoanRequestListScreen';
+import CommissionDashboardScreen from './CommissionDashboardScreen';
+import AccountOpeningScreen from './AccountOpeningScreen';
+
+type Props = NativeStackScreenProps<AgentLoansStackParamList, 'AgentLoansMain'>;
+
+type TabKey = 'loans' | 'commission' | 'account';
+
+export default function AgentLoansScreen({ route, navigation }: Props) {
+  const theme = useTheme();
+  const [activeTab, setActiveTab] = useState<TabKey>(route.params?.initialTab || 'loans');
+
+  const tabs: { key: TabKey; label: string; icon: string }[] = [
+    { key: 'loans', label: 'Loans', icon: 'document-text-outline' },
+    { key: 'commission', label: 'Commission', icon: 'star-outline' },
+    { key: 'account', label: 'New A/C', icon: 'person-add-outline' },
+  ];
+
+  return (
+    <ScreenShell scrollable={false} withTabBar={false} keyboardAware={false}>
+      <View style={styles.header}>
+        <Text style={[styles.headerTitle, { color: theme.colors.textPrimary }]}>Agent Workspace</Text>
+      </View>
+
+      <View style={styles.tabContainer}>
+        {tabs.map((tab) => {
+          const isActive = activeTab === tab.key;
+          return (
+            <Pressable
+              key={tab.key}
+              style={[
+                styles.tab,
+                { 
+                  backgroundColor: isActive ? theme.colors.primary : theme.colors.surface,
+                  borderColor: isActive ? theme.colors.primary : theme.colors.cardBorder,
+                }
+              ]}
+              onPress={() => setActiveTab(tab.key)}
+            >
+              <Ionicons 
+                name={tab.icon as any} 
+                size={16} 
+                color={isActive ? theme.colors.white : theme.colors.textMuted} 
+              />
+              <Text style={[
+                styles.tabLabel, 
+                { color: isActive ? theme.colors.white : theme.colors.textSecondary }
+              ]}>
+                {tab.label}
+              </Text>
+            </Pressable>
+          );
+        })}
+      </View>
+
+      <View style={styles.contentArea}>
+        {activeTab === 'loans' && (
+          <Animated.View entering={FadeInLeft} style={{ flex: 1 }}>
+            <LoanRequestListScreen navigation={navigation as any} />
+          </Animated.View>
+        )}
+        
+        {activeTab === 'commission' && (
+          <Animated.View entering={FadeIn} style={{ flex: 1 }}>
+            <CommissionDashboardScreen />
+          </Animated.View>
+        )}
+
+        {activeTab === 'account' && (
+          <Animated.View entering={FadeInRight} style={{ flex: 1 }}>
+            <AccountOpeningScreen navigation={navigation as any} />
+          </Animated.View>
+        )}
+      </View>
+    </ScreenShell>
+  );
+}
+
+const styles = StyleSheet.create({
+  header: {
+    paddingHorizontal: 16,
+    paddingTop: 16,
+    paddingBottom: 8,
+  },
+  headerTitle: {
+    fontSize: 22,
+    fontWeight: '800',
+    letterSpacing: -0.5,
+  },
+  tabContainer: {
+    flexDirection: 'row',
+    paddingHorizontal: 16,
+    marginBottom: 12,
+    gap: 8,
+  },
+  tab: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingVertical: 10,
+    borderRadius: 12,
+    borderWidth: 1,
+    gap: 6,
+  },
+  tabLabel: {
+    fontSize: 12,
+    fontWeight: '700',
+  },
+  contentArea: {
+    flex: 1,
+  },
+});