Kantongku: aplikasi pencatat keuangan pribadi offline-first

App.tsx

@@ -0,0 +1,68 @@
+import { StatusBar } from 'expo-status-bar';
+import { useEffect, useState } from 'react';
+import { ActivityIndicator, StyleSheet, Text, View } from 'react-native';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
+import { NavigationContainer } from '@react-navigation/native';
+import { initDatabase } from './src/db/database';
+import { checkRecurringDue } from './src/db/repositories';
+import { RootNavigator } from './src/navigation';
+import { colors } from './src/theme/colors';
+
+export default function App() {
+  const [ready, setReady] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    initDatabase()
+      .then(async () => {
+        try {
+          // Buat transaksi berulang yang jatuh tempo hari ini
+          await checkRecurringDue();
+        } catch {
+          // jangan sampai mengganggu startup
+        }
+        setReady(true);
+      })
+      .catch((e) => setError(String(e)));
+  }, []);
+
+  if (error) {
+    return (
+      <View style={styles.center}>
+        <Text style={styles.errorTitle}>Terjadi kesalahan 😢</Text>
+        <Text style={styles.errorText}>{error}</Text>
+      </View>
+    );
+  }
+
+  if (!ready) {
+    return (
+      <View style={styles.center}>
+        <ActivityIndicator size="large" color={colors.primary} />
+        <Text style={styles.loadingText}>Menyiapkan Kantongku...</Text>
+      </View>
+    );
+  }
+
+  return (
+    <SafeAreaProvider>
+      <NavigationContainer>
+        <RootNavigator />
+      </NavigationContainer>
+      <StatusBar style="dark" />
+    </SafeAreaProvider>
+  );
+}
+
+const styles = StyleSheet.create({
+  center: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: colors.background,
+    padding: 24,
+  },
+  loadingText: { marginTop: 12, color: colors.textMuted, fontSize: 14 },
+  errorTitle: { fontSize: 16, fontWeight: '700', color: colors.text, marginBottom: 8 },
+  errorText: { color: colors.expense, fontSize: 13, textAlign: 'center' },
+});