import React, { useEffect } from 'react';
import { StatusBar } from 'react-native';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { RootNavigator } from './navigation/rootNavigator';
import { ThemeProvider, useTheme } from './theme';
import { Provider } from 'react-redux';
import { store, persistor, useAppDispatch, useAppSelector, getStatusList, getSourceList, getCountryList } from '@store';
import { PersistGate } from 'redux-persist/integration/react';
import { NotificationService } from '@services';
import BootSplash from 'react-native-bootsplash';

const ThemedStatusBar = () => {
  const { theme: colors, isDark } = useTheme();

  useEffect(() => {
    StatusBar.setBarStyle(isDark ? 'light-content' : 'dark-content', true);
    StatusBar.setBackgroundColor(colors.background, true);
  }, [colors, isDark]);

  return (
    <StatusBar
      barStyle={isDark ? 'light-content' : 'dark-content'}
      backgroundColor={colors.background}
    />
  );
};

/** Dispatches startup data fetches once the Redux store is ready. */
const AppInit = () => {
  const dispatch = useAppDispatch();
  const token = useAppSelector(state => state.auth.token);

  useEffect(() => {
    if (token) {
      dispatch(getStatusList());
      dispatch(getSourceList());
      dispatch(getCountryList());
    }
  }, [dispatch, token]);

  return null;
};

const App = () => {
  useEffect(() => {
    let cleanup: (() => void) | undefined;

    const initApp = async () => {
      try {
        const cleanupFn = await NotificationService.initialize({
          onNotificationOpen: data => {
            // TODO: Use data (e.g. { screen, id }) to deep-navigate once
            console.log('[App] Notification opened with data:', data);
          },
          onTokenRefreshed: token => {
            // TODO: Send the refreshed token to your backend so the server
            // always has the latest FCM token for this device.
            console.log('[App] FCM token refreshed — sync to server:', token);
          },
        });
        cleanup = cleanupFn;
      } catch (err) {
        console.error('[App] NotificationService.initialize error:', err);
      } finally {
        await BootSplash.hide({ fade: true });
      }
    };

    initApp();

    return () => {
      cleanup?.();
    };
  }, []);

  return (
    <Provider store={store}>
      <PersistGate loading={null} persistor={persistor}>
      <SafeAreaProvider>
        <ThemeProvider>
          <ThemedStatusBar />
          <AppInit />
          <RootNavigator />
        </ThemeProvider>
      </SafeAreaProvider>
      </PersistGate>
    </Provider>
  );
};

export default App;