import * as icon from '@mdi/js';
import Head from 'next/head';
import React, { ReactElement } from 'react';
import SectionMain from '../components/SectionMain';
import SectionTitleLineWithButton from '../components/SectionTitleLineWithButton';
import LayoutAuthenticated from '../layouts/Authenticated';
import CardBox from '../components/CardBox';
import { getPageTitle } from '../config';

const AccountingPeriodPage = () => {
  return (
    <>
      <Head>
        <title>{getPageTitle('Accounting Period')}</title>
      </Head>
      <SectionMain>
        <SectionTitleLineWithButton icon={icon.mdiCalendarClock} title="Accounting Period" main>
          {''}
        </SectionTitleLineWithButton>
        <CardBox>
          <div className="text-center py-20 text-slate-500">
            <p className="text-xl font-semibold mb-2">Accounting Period</p>
            <p>This module is currently being implemented. Check back soon!</p>
          </div>
        </CardBox>
      </SectionMain>
    </>
  );
};

AccountingPeriodPage.getLayout = function getLayout(page: ReactElement) {
  return <LayoutAuthenticated>{page}</LayoutAuthenticated>;
};

export default AccountingPeriodPage;
