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,66 @@
+import React, { memo } from 'react';
+import { StyleSheet, Text, View } from 'react-native';
+import { useTheme } from '../../../theme';
+import { formatCurrency } from '../../../utils/formatters';
+import type { LoanEmiScheduleItem } from '../../../types/app';
+
+interface EmiScheduleRowProps {
+  item: LoanEmiScheduleItem;
+  isHeader?: boolean;
+}
+
+const EmiScheduleRowComponent = ({ item, isHeader }: EmiScheduleRowProps) => {
+  const theme = useTheme();
+
+  if (isHeader) {
+    return (
+      <View style={[styles.row, styles.headerRow, { borderBottomColor: theme.colors.cardBorder }]}>
+        <Text style={[styles.cell, styles.monthCell, styles.headerText, { color: theme.colors.textSecondary }]}>Month</Text>
+        <Text style={[styles.cell, styles.headerText, { color: theme.colors.textSecondary }]}>EMI</Text>
+        <Text style={[styles.cell, styles.headerText, { color: theme.colors.textSecondary }]}>Principal</Text>
+        <Text style={[styles.cell, styles.headerText, { color: theme.colors.textSecondary }]}>Interest</Text>
+        <Text style={[styles.cell, styles.headerText, { color: theme.colors.textSecondary }]}>Balance</Text>
+      </View>
+    );
+  }
+
+  return (
+    <View style={[styles.row, { borderBottomColor: theme.colors.cardBorder }]}>
+      <Text style={[styles.cell, styles.monthCell, { color: theme.colors.textPrimary }]}>{item.month}</Text>
+      <Text style={[styles.cell, { color: theme.colors.textPrimary }]}>{formatCurrency(item.emiAmount)}</Text>
+      <Text style={[styles.cell, { color: theme.colors.success }]}>{formatCurrency(item.principalComponent)}</Text>
+      <Text style={[styles.cell, { color: theme.colors.warning }]}>{formatCurrency(item.interestComponent)}</Text>
+      <Text style={[styles.cell, { color: theme.colors.textSecondary }]}>{formatCurrency(item.outstandingAfter)}</Text>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  row: {
+    flexDirection: 'row',
+    paddingVertical: 10,
+    borderBottomWidth: 1,
+  },
+  headerRow: {
+    paddingVertical: 8,
+    borderBottomWidth: 2,
+  },
+  cell: {
+    flex: 1,
+    fontSize: 11,
+    fontWeight: '500',
+    textAlign: 'right',
+  },
+  monthCell: {
+    flex: 0.5,
+    textAlign: 'center',
+  },
+  headerText: {
+    fontSize: 10,
+    fontWeight: '700',
+    textTransform: 'uppercase',
+    letterSpacing: 0.3,
+  },
+});
+
+export const EmiScheduleRow = memo(EmiScheduleRowComponent);