import * as React from 'react';
import { IconButton, Container, Header, Content, Footer, Nav, Avatar, Stack } from 'rsuite';
import SidePanel from '@/components/dashboard/sidenav';
import { DocumentInfo } from '@/lib/utils/types';
import DashboardTable from '@/components/dashboard/content/table';
import { userAtom } from '@/lib/context/user';
import { useAtom } from 'jotai';
import { useRouter } from 'next/router';
import { useHasMounted } from '@/lib/utils/useHasMounted';
import { useCookies } from 'react-cookie';

interface DashboardProps {
}



export default function Dashboard(props: DashboardProps) {
  const [user] = useAtom(userAtom);
  const router = useRouter();
  const [cookies] = useCookies(['auth']);

  React.useEffect(() => {
    if (
      (cookies.auth === undefined)
      || (user !== null && user.uid !== cookies.auth)
    ) {
      router.push('/');
    }
  }, [cookies, user, router])

  return (
    <Container>

      <SidePanel />

      <Content
        style={{
          padding: 32,
          backgroundColor: '#F7F7FA',
          width: '100%',
        }}
      >

        <DashboardTable />

      </Content>
    </Container>
  );
}