import { useEffect } from 'react';
import { Text, View } from 'react-native';
import { DarkTheme, NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { StatusBar } from 'expo-status-bar';
import * as SplashScreen from 'expo-splash-screen';
import * as StoreReview from 'expo-store-review';
import { useFonts, BarlowCondensed_500Medium, BarlowCondensed_700Bold } from '@expo-google-fonts/barlow-condensed';

import { devoChiedereRecensione } from '../gioco.ts';
import type { Schermate } from './navigazione.ts';
import { leggi, scrivi, StatoProvider } from './stato.tsx';
import { Giro } from './schermate/Giro.tsx';
import { Home } from './schermate/Home.tsx';
import { Impostazioni } from './schermate/Impostazioni.tsx';
import { Luoghi } from './schermate/Luoghi.tsx';
import { Regole } from './schermate/Regole.tsx';

SplashScreen.preventAutoHideAsync().catch(() => {});

const Stack = createNativeStackNavigator<Schermate>();

function DaFare() {
  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center', backgroundColor: '#000' }}>
      <Text style={{ color: '#fff' }}>…</Text>
    </View>
  );
}
const Timer = DaFare;

/** Come nella 1.5: la richiesta di recensione alla 3a, 10a, 50a apertura e poi ogni 100. */
async function contaAperture(): Promise<void> {
  const n = (Number(leggi('aperture')) || 0) + 1;
  scrivi('aperture', n);
  if (devoChiedereRecensione(n) && (await StoreReview.isAvailableAsync())) await StoreReview.requestReview();
}

export default function App() {
  const [caricati] = useFonts({ BarlowCondensed_500Medium, BarlowCondensed_700Bold });

  useEffect(() => {
    if (caricati) SplashScreen.hideAsync().catch(() => {});
  }, [caricati]);

  useEffect(() => {
    contaAperture().catch(() => {});
  }, []);

  if (!caricati) return null;
  return (
    <SafeAreaProvider>
      <StatoProvider>
        <NavigationContainer theme={DarkTheme}>
          <StatusBar style="light" />
          <Stack.Navigator screenOptions={{ headerShown: false, contentStyle: { backgroundColor: '#000' } }}>
            <Stack.Screen name="Home" component={Home} />
            <Stack.Screen name="Impostazioni" component={Impostazioni} />
            <Stack.Screen name="Giro" component={Giro} options={{ gestureEnabled: false }} />
            <Stack.Screen name="Timer" component={Timer} options={{ gestureEnabled: false }} />
            <Stack.Group screenOptions={{ presentation: 'modal' }}>
              <Stack.Screen name="Luoghi" component={Luoghi} />
              <Stack.Screen name="Regole" component={Regole} />
            </Stack.Group>
          </Stack.Navigator>
        </NavigationContainer>
      </StatoProvider>
    </SafeAreaProvider>
  );
}