import { SUB } from '@/fragments/subs' import { getGetServerSideProps } from '@/api/ssrApollo' import { CenterLayout } from '@/components/layout' import TerritoryForm from '@/components/territory-form' import PageLoading from '@/components/page-loading' import { useQuery } from '@apollo/client' import { useRouter } from 'next/router' import TerritoryPaymentDue from '@/components/territory-payment-due' export const getServerSideProps = getGetServerSideProps({ query: SUB, notFound: (data, vars, me) => !data.sub || Number(data.sub.userId) !== Number(me?.id), authRequired: true }) export default function TerritoryPage ({ ssrData }) { const router = useRouter() const { data } = useQuery(SUB, { variables: { sub: router.query.sub } }) if (!data && !ssrData) return <PageLoading /> const { sub } = data || ssrData return ( <CenterLayout sub={sub?.name}> <TerritoryPaymentDue sub={sub} /> <h1 className='mt-5'>edit territory</h1> <TerritoryForm sub={sub} /> </CenterLayout> ) }