import Divider from '@/core/components/elements/Divider/Divider';
import AppLayout from '@/core/components/layouts/AppLayout';
import BasicLayout from '@/core/components/layouts/BasicLayout';
import DesktopView from '@/core/components/views/DesktopView';
import MobileView from '@/core/components/views/MobileView';
import useAuth from '@/core/hooks/useAuth';
import CompanyProfile from '@/lib/auth/components/CompanyProfile';
import IsAuth from '@/lib/auth/components/IsAuth';
import Menu from '@/lib/auth/components/Menu';
import PersonalProfile from '@/lib/auth/components/PersonalProfile';
import Seo from '@/core/components/Seo';

export default function Profile() {
  const auth = useAuth();
  return (
    <>
      <Seo title='Profile - Indoteknik.com' />
      <IsAuth>
        <MobileView>
          <AppLayout title='Akun Saya'>
            <PersonalProfile />
            <Divider />
            {auth?.parentId && <CompanyProfile />}
          </AppLayout>
        </MobileView>

        <DesktopView>
          <BasicLayout>
            <div className='container mx-auto flex py-10'>
              <div className='w-3/12 pr-4'>
                <Menu />
              </div>
              <div className='w-9/12 bg-white border border-gray_r-6 rounded'>
                <PersonalProfile />
                <Divider />
                {auth?.parentId && <CompanyProfile />}
              </div>
            </div>
          </BasicLayout>
        </DesktopView>
      </IsAuth>
    </>
  );
}