55 lines
2.1 KiB
JavaScript
55 lines
2.1 KiB
JavaScript
import React from 'react';
|
|
import { KeyboardAvoidingView, Modal, Platform, Pressable, ScrollView, Text, TextInput, View } from 'react-native';
|
|
import { styles } from '../styles';
|
|
|
|
export default function BackupModal({
|
|
visible,
|
|
onClose,
|
|
exportJson,
|
|
importJson,
|
|
setImportJson,
|
|
applyImport,
|
|
}) {
|
|
return (
|
|
<Modal visible={visible} animationType="slide" transparent>
|
|
<View style={styles.modalBackdrop}>
|
|
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : undefined} style={styles.modalKeyboardWrap}>
|
|
<View style={styles.modalCard}>
|
|
<View style={styles.sectionRow}>
|
|
<Text style={styles.sectionTitle}>Backup & Restore</Text>
|
|
<Pressable onPress={onClose}>
|
|
<Text style={styles.closeText}>Close</Text>
|
|
</Pressable>
|
|
</View>
|
|
|
|
<ScrollView keyboardShouldPersistTaps="handled" contentContainerStyle={{ paddingBottom: 12 }} showsVerticalScrollIndicator={false}>
|
|
<Text style={styles.cardTitle}>Export JSON</Text>
|
|
<Text style={styles.cardMeta}>Copy this JSON and store it safely.</Text>
|
|
<TextInput
|
|
style={styles.inputMultiline}
|
|
multiline
|
|
value={exportJson}
|
|
editable={false}
|
|
selectTextOnFocus
|
|
/>
|
|
<Text style={styles.cardTitle}>Import JSON</Text>
|
|
<Text style={styles.cardMeta}>Paste a previous backup. This will replace current data.</Text>
|
|
<TextInput
|
|
style={styles.inputMultiline}
|
|
multiline
|
|
value={importJson}
|
|
onChangeText={setImportJson}
|
|
placeholder="Paste backup JSON here"
|
|
placeholderTextColor="#6b7280"
|
|
/>
|
|
<Pressable style={styles.primaryBtn} onPress={applyImport}>
|
|
<Text style={styles.primaryBtnText}>Import & Replace</Text>
|
|
</Pressable>
|
|
</ScrollView>
|
|
</View>
|
|
</KeyboardAvoidingView>
|
|
</View>
|
|
</Modal>
|
|
);
|
|
}
|