import { useEffect } from 'react';
import { useWindowDimensions } from 'react-native';
import { Redirect } from 'expo-router';

import { AppDesktopShell } from '../../src/app-navigation/AppDesktopShell';
import { AppRouteStack } from '../../src/app-navigation/AppRouteStack';
import { BREAKPOINTS } from '../../src/hooks/useResponsive';
import { messageManager, useAuthStore } from '../../src/stores';

export default function AppLayoutWeb() {
  const { width } = useWindowDimensions();
  const isAuthenticated = useAuthStore((s) => s.isAuthenticated);
  const useDesktopShell = width >= BREAKPOINTS.desktop;

  useEffect(() => {
    messageManager.initialize();
  }, []);

  if (!isAuthenticated) {
    return <Redirect href="/login" />;
  }

  if (useDesktopShell) {
    return <AppDesktopShell />;
  }

  return <AppRouteStack />;
}
