import SideBar from './SideBar';
import PageContent from './PageContent';
import Header from './Header';
import { Navigate, useLocation } from 'react-router-dom';
import { useGetUserMutation } from '@/app/backend/endpoints/auth';
import useUser from '@/hooks/useUser';
import { useEffectOnce } from '@/hooks/useEffectOnce';

function DashboardLayout({ isCourseLayout = false }) {
  const location = useLocation();

  const [getUser] = useGetUserMutation();
  const { user, setUser, removeUser } = useUser();

  useEffectOnce(() => {
    getUser()
      .unwrap()
      .then((response: any) => {
        setUser(response.data);
      })
      .catch(() => {
        removeUser();
      });
  });
  // const isCoursesPage =
  //   location.pathname === '/dashboard/courses' ||
  //   location.pathname === '/dashboard/courses/';
  const getHeaderVariant = () => {
    return isCourseLayout ? 'minimal' : 'default';
  };

  if (
    location.pathname === '/dashboard' ||
    location.pathname === '/dashboard/'
  ) {
    return <Navigate to="/dashboard/home" />;
  }

  return (
    <>
      <div className="flex flex-col h-screen">
        <Header user={user} variant={getHeaderVariant()} />
        <div className="flex flex-row flex-1">
          {!isCourseLayout && <SideBar />}
          <PageContent />
        </div>
      </div>
    </>
  );
}

export default DashboardLayout;