113 lines
3.6 KiB
TypeScript
113 lines
3.6 KiB
TypeScript
import { router } from 'expo-router';
|
||
import { useState } from 'react';
|
||
import { ScrollView, StyleSheet, Text, View } from 'react-native';
|
||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||
import { LabeledField } from '../../src/components/LabeledField';
|
||
import { PrimaryButton } from '../../src/components/PrimaryButton';
|
||
import { useApp } from '../../src/context/AppContext';
|
||
import { colors } from '../../src/theme/colors';
|
||
|
||
export default function ReglagesScreen() {
|
||
const insets = useSafeAreaInsets();
|
||
const app = useApp();
|
||
const [url, setUrl] = useState('');
|
||
const [key, setKey] = useState('');
|
||
const [msg, setMsg] = useState<string | null>(null);
|
||
const [loading, setLoading] = useState(false);
|
||
|
||
return (
|
||
<ScrollView
|
||
contentContainerStyle={{
|
||
padding: 20,
|
||
paddingTop: 12,
|
||
paddingBottom: insets.bottom + 32,
|
||
backgroundColor: colors.bg,
|
||
}}
|
||
>
|
||
<Text style={styles.h2}>Mode actuel</Text>
|
||
<Text style={styles.p}>
|
||
{app.runtimeMode === 'local' && 'Hors-ligne — données stockées sur l’appareil.'}
|
||
{app.runtimeMode === 'cloud' && 'Supabase — synchronisation cloud.'}
|
||
{app.runtimeMode === 'none' && 'Non initialisé.'}
|
||
</Text>
|
||
{app.user ? (
|
||
<Text style={styles.p}>
|
||
Compte : {app.user.email ?? app.user.id}
|
||
</Text>
|
||
) : null}
|
||
|
||
<Text style={[styles.h2, { marginTop: 24 }]}>Projet Supabase</Text>
|
||
<Text style={styles.p}>
|
||
URL et clé « anon » (Settings → API). Exécutez aussi la migration SQL du
|
||
dépôt sur votre projet.
|
||
</Text>
|
||
<LabeledField
|
||
label="URL du projet"
|
||
autoCapitalize="none"
|
||
value={url}
|
||
onChangeText={setUrl}
|
||
placeholder="https://xxxx.supabase.co"
|
||
/>
|
||
<LabeledField
|
||
label="Clé anon (public)"
|
||
autoCapitalize="none"
|
||
value={key}
|
||
onChangeText={setKey}
|
||
placeholder="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."
|
||
/>
|
||
{msg ? <Text style={styles.msg}>{msg}</Text> : null}
|
||
<PrimaryButton
|
||
title="Enregistrer et passer en mode cloud"
|
||
loading={loading}
|
||
onPress={async () => {
|
||
setMsg(null);
|
||
if (!url.trim() || !key.trim()) {
|
||
setMsg('Renseignez URL et clé.');
|
||
return;
|
||
}
|
||
setLoading(true);
|
||
try {
|
||
await app.saveCloudConfig({
|
||
supabaseUrl: url.trim(),
|
||
supabaseAnonKey: key.trim(),
|
||
});
|
||
setMsg('Configuration enregistrée. Connectez-vous ou créez un compte.');
|
||
router.push('/auth/login');
|
||
} catch {
|
||
setMsg('Erreur lors de l’enregistrement.');
|
||
} finally {
|
||
setLoading(false);
|
||
}
|
||
}}
|
||
/>
|
||
|
||
<PrimaryButton
|
||
title="Activer le mode hors-ligne"
|
||
variant="ghost"
|
||
containerStyle={{ marginTop: 12 }}
|
||
onPress={async () => {
|
||
await app.enterLocalMode();
|
||
setMsg('Mode hors-ligne activé.');
|
||
router.replace('/(tabs)');
|
||
}}
|
||
/>
|
||
|
||
<PrimaryButton
|
||
title="Déconnexion / quitter la session"
|
||
variant="ghost"
|
||
containerStyle={{ marginTop: 24 }}
|
||
onPress={async () => {
|
||
await app.signOut();
|
||
router.replace('/');
|
||
}}
|
||
/>
|
||
</ScrollView>
|
||
);
|
||
}
|
||
|
||
const styles = StyleSheet.create({
|
||
h2: { color: colors.text, fontSize: 18, fontWeight: '700', marginBottom: 8 },
|
||
p: { color: colors.textMuted, lineHeight: 20, marginBottom: 8 },
|
||
msg: { color: colors.flash, marginBottom: 12, lineHeight: 20 },
|
||
});
|