import React, { useEffect, useState } from 'react';
import { Routes, Route } from 'react-router-dom';
import { Home, Profile, Schedule, Settings } from '@src/pages';
import { Shell } from '@components';
import { useLocalStore } from '@components';

const dept = {
  id: 1,
  company: 'Darien EMS - Post 53',
  abv: 'DEMS',
  billing_address: '0 Ledge Road',
  town: 'Darien',
  state: 'Connecticut',
  postal: '06820',
  country: 'United States',
  phone: '',
  display_time: '12',
  start_day: 'sunday',
  company_logo: '',
  employee_count: 1,
  subscription_expiration: '10/01/2025',
  schedulers: [],
  managers: [],
  administrators: [1]
};

const AppRouter = () => {
  const { user, setUser, setDepartment } = useLocalStore();
  const [userChanged, setUserChanged] = useState(false);

  useEffect(() => {
    setDepartment(dept);
    setUser({
      id: 1,
      first_name: 'ShiftSync-Manager',
      last_name: 'Test-User',
      email: 'testuser@shift-sync.com',
      scheduler: dept?.schedulers?.includes(1),
      manager: dept?.managers?.includes(1),
      administrator: dept?.administrators?.includes(1),
      is_ss_admin: false
    });
  }, []);

  useEffect(() => {
    if (!userChanged && user) {
      if (user?.is_ss_admin) {
        setUser({
          ...user,
          scheduler: true,
          manager: true,
          administrator: true,
        });
      } else if (user?.administrator) {
        setUser({
          ...user,
          scheduler: true,
          manager: true,
        });
      } else if (user?.manager) {
        setUser({
          ...user,
          scheduler: true,
        });
      }
      setUserChanged(true);
    }
  }, [user]);


  return (
    <Shell>
      <Routes>
        <Route path="/" element={<Home />} />
        <Route path="/schedule" element={<Schedule />} />
        <Route path="/settings" element={<Settings />} />
        <Route path="/profile" element={<Profile />} />
      </Routes>
    </Shell>
  );
};

export default AppRouter