From 1bad7684bc61b3205a09b2b6dfe1bc1fc3d6336b Mon Sep 17 00:00:00 2001
From: Eddy de Vink <github@eddydev.ink>
Date: Sat, 27 Jun 2026 23:40:14 +0200
Subject: [PATCH] fix: keep save button visible when keyboard open, auto-sync
 after save

---
 src/components/MeasurementForm.tsx   | 14 ++++++--------
 src/screens/NewMeasurementScreen.tsx | 14 +++++++++++---
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/components/MeasurementForm.tsx b/src/components/MeasurementForm.tsx
index c4ac02f..cb9dacb 100644
--- a/src/components/MeasurementForm.tsx
+++ b/src/components/MeasurementForm.tsx
@@ -28,8 +28,6 @@ const fields: FieldDef[] = [
   { key: 'bmr', label: 'Stofwisseling (kcal)', placeholder: '1650', keyboardType: 'number-pad' },
 ]
 
-const computedKeys = new Set<keyof Measurement>(['fatMass', 'muscleMass'])
-
 export default function MeasurementForm({ onSubmit, initialValues }: Props) {
   const [pickerOpen, setPickerOpen] = useState(false)
   const [measurementDate, setMeasurementDate] = useState<Date>(() => {
@@ -89,7 +87,7 @@ export default function MeasurementForm({ onSubmit, initialValues }: Props) {
 
   return (
     <KeyboardAvoidingView behavior="padding" style={styles.container}>
-      <ScrollView contentContainerStyle={styles.scroll}>
+      <ScrollView contentContainerStyle={styles.scroll} keyboardShouldPersistTaps="handled">
         <View style={styles.field}>
           <Text style={styles.label}>Datum</Text>
           <TouchableOpacity style={styles.dateButton} onPress={() => setPickerOpen(true)}>
@@ -139,17 +137,17 @@ export default function MeasurementForm({ onSubmit, initialValues }: Props) {
             </View>
           )
         })}
-        <TouchableOpacity style={styles.button} onPress={handleSubmit}>
-          <Text style={styles.buttonText}>Opslaan</Text>
-        </TouchableOpacity>
       </ScrollView>
+      <TouchableOpacity style={styles.button} onPress={handleSubmit}>
+        <Text style={styles.buttonText}>Opslaan</Text>
+      </TouchableOpacity>
     </KeyboardAvoidingView>
   )
 }
 
 const styles = StyleSheet.create({
   container: { flex: 1, backgroundColor: '#f5f5f5' },
-  scroll: { padding: 16 },
+  scroll: { padding: 16, paddingBottom: 0 },
   field: { marginBottom: 12 },
   label: { fontSize: 14, fontWeight: '600', color: '#333', marginBottom: 4 },
   input: { backgroundColor: '#fff', borderRadius: 8, padding: 12, fontSize: 16, borderWidth: 1, borderColor: '#ddd' },
@@ -157,6 +155,6 @@ const styles = StyleSheet.create({
   computedText: { fontSize: 16, color: '#666' },
   dateButton: { backgroundColor: '#fff', borderRadius: 8, padding: 12, borderWidth: 1, borderColor: '#ddd' },
   dateButtonText: { fontSize: 16, color: '#333' },
-  button: { backgroundColor: '#4CAF50', padding: 16, borderRadius: 8, alignItems: 'center', marginTop: 8 },
+  button: { backgroundColor: '#4CAF50', padding: 16, borderRadius: 8, alignItems: 'center', margin: 16 },
   buttonText: { color: '#fff', fontSize: 16, fontWeight: '700' },
 })
diff --git a/src/screens/NewMeasurementScreen.tsx b/src/screens/NewMeasurementScreen.tsx
index c35b850..b143cab 100644
--- a/src/screens/NewMeasurementScreen.tsx
+++ b/src/screens/NewMeasurementScreen.tsx
@@ -30,9 +30,17 @@ export default function NewMeasurementScreen({ navigation }: Props) {
   const handleSubmit = async (m: Measurement) => {
     await initDatabase()
     await insertMeasurement(m)
-    Alert.alert('Opgeslagen', 'Meting is opgeslagen', [
-      { text: 'OK', onPress: () => navigation.goBack() },
-    ])
+    try {
+      const { syncAll } = await import('../sync/syncService')
+      await syncAll()
+      Alert.alert('Opgeslagen & gesynct', 'Meting is opgeslagen en gesynchroniseerd', [
+        { text: 'OK', onPress: () => navigation.goBack() },
+      ])
+    } catch {
+      Alert.alert('Opgeslagen', 'Meting is opgeslagen (sync mislukt)', [
+        { text: 'OK', onPress: () => navigation.goBack() },
+      ])
+    }
   }
 
   if (latest === undefined) {