From 16cf1c0616916c9376a9911a1c4d2e74eaee721b Mon Sep 17 00:00:00 2001
From: Nemo <nemo@openclaw.ai>
Date: Tue, 24 Mar 2026 14:26:33 +0800
Subject: [PATCH] fix: add lead modal - KeyboardAvoidingView + ScrollView to
 prevent keyboard overlap

---
 app/(app)/leads/index.tsx | 30 +++++++++++++++++++-----------
 1 file changed, 19 insertions(+), 11 deletions(-)

diff --git a/app/(app)/leads/index.tsx b/app/(app)/leads/index.tsx
index a9a1ac3..d17e93e 100644
--- a/app/(app)/leads/index.tsx
+++ b/app/(app)/leads/index.tsx
@@ -1,7 +1,8 @@
 import { useState } from 'react';
 import {
   View, Text, FlatList, TouchableOpacity, TextInput,
-  ActivityIndicator, RefreshControl, Alert, Modal
+  ActivityIndicator, RefreshControl, Alert, Modal,
+  KeyboardAvoidingView, Platform, ScrollView,
 } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
@@ -149,9 +150,15 @@ export default function LeadsScreen() {
 
       {/* Add Lead Modal */}
       <Modal visible={showAdd} transparent animationType="slide" onRequestClose={() => setShowAdd(false)}>
-        <View style={{ flex: 1, backgroundColor: 'rgba(0,0,0,0.45)', justifyContent: 'flex-end' }}>
-          <TouchableOpacity style={{ flex: 1 }} onPress={() => setShowAdd(false)} />
-          <View style={{ backgroundColor: '#fff', borderTopLeftRadius: 24, borderTopRightRadius: 24, padding: 24, paddingBottom: 40 }}>
+        <KeyboardAvoidingView style={{ flex: 1 }} behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
+          <View style={{ flex: 1, backgroundColor: 'rgba(0,0,0,0.45)', justifyContent: 'flex-end' }}>
+            <TouchableOpacity style={{ flex: 1 }} onPress={() => setShowAdd(false)} />
+            <ScrollView
+              keyboardShouldPersistTaps="handled"
+              style={{ backgroundColor: '#fff', borderTopLeftRadius: 24, borderTopRightRadius: 24 }}
+              contentContainerStyle={{ padding: 24, paddingBottom: 48 }}
+              bounces={false}
+            >
             <View style={{ width: 40, height: 4, backgroundColor: '#E2E8F0', borderRadius: 2, alignSelf: 'center', marginBottom: 20 }} />
             <Text style={{ fontSize: 20, fontWeight: '800', color: '#1E293B', marginBottom: 20 }}>New Lead</Text>
 
@@ -186,14 +193,15 @@ export default function LeadsScreen() {
               style={{ borderWidth: 1, borderColor: '#E2E8F0', borderRadius: 12, paddingHorizontal: 14, paddingVertical: 12, fontSize: 15, color: '#1E293B', marginBottom: 20, minHeight: 72, textAlignVertical: 'top' }}
             />
 
-            <TouchableOpacity
-              onPress={addLead} disabled={saving}
-              style={{ backgroundColor: saving ? '#94A3B8' : '#0891B2', borderRadius: 14, paddingVertical: 17, alignItems: 'center' }}
-            >
-              {saving ? <ActivityIndicator color="#fff" /> : <Text style={{ fontSize: 16, fontWeight: '700', color: '#fff' }}>Save Lead</Text>}
-            </TouchableOpacity>
+              <TouchableOpacity
+                onPress={addLead} disabled={saving}
+                style={{ backgroundColor: saving ? '#94A3B8' : '#0891B2', borderRadius: 14, paddingVertical: 17, alignItems: 'center' }}
+              >
+                {saving ? <ActivityIndicator color="#fff" /> : <Text style={{ fontSize: 16, fontWeight: '700', color: '#fff' }}>Save Lead</Text>}
+              </TouchableOpacity>
+            </ScrollView>
           </View>
-        </View>
+        </KeyboardAvoidingView>
       </Modal>
     </SafeAreaView>
   );