import Seo from '@/core/components/Seo';
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 IsAuth from '@/lib/auth/components/IsAuth';
import InvoicesComponent from '@/lib/tempo/components/Tempo';
import { getAuth } from '~/libs/auth';
import { useRouter } from 'next/router';
import { useEffect, useState } from 'react';
export default function MyTempo() {
  const auth = getAuth();
  const router = useRouter();
  const [isLoading, setIsLoading] = useState(true);
  useEffect(() => {
    if (!auth) {
      const nextUrl = encodeURIComponent(router.asPath);
      router.push(`/login?next=${nextUrl}`);
    } else if (auth.tempoProgres === '' || auth.tempoProgres === 'rejected') {
      router.push('/pengajuan-tempo');
    } else {
      setIsLoading(false);
    }
  }, [auth]);

  if (isLoading || !auth) {
    return null; // Tidak render apa pun selama loading atau auth/tempo belum tersedia
  }
  return (
    <IsAuth>
      <Seo title='Tempo - Indoteknik.com' />

      <MobileView>
        <AppLayout title='Pembayaran Tempo'>
          <InvoicesComponent />
        </AppLayout>
      </MobileView>

      <DesktopView>
        <BasicLayout>
          <InvoicesComponent />
        </BasicLayout>
      </DesktopView>
    </IsAuth>
  );
}