feat(FE-337): init slicing UI and define data types

src/app/finance/add/initial-balance/page.tsx

@@ -0,0 +1,5 @@
+const FinanceAddInitialBalance = () => {
+  return <div>Initial Balance</div>;
+};
+
+export default FinanceAddInitialBalance;

src/app/finance/add/page.tsx

@@ -0,0 +1,5 @@
+const FinanceAdd = () => {
+  return <div>Finance Add</div>;
+};
+
+export default FinanceAdd;

src/app/finance/adjust/page.tsx

@@ -0,0 +1,5 @@
+const FinanceAdjust = () => {
+  return <div>Finance Adjust</div>;
+};
+
+export default FinanceAdjust;

src/app/finance/detail/layout.tsx

@@ -0,0 +1,11 @@
+import SuspenseHelper from '@/components/helper/SuspenseHelper';
+
+const Layout = ({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) => {
+  return <SuspenseHelper>{children}</SuspenseHelper>;
+};
+
+export default Layout;

src/app/finance/detail/page.tsx

@@ -0,0 +1,41 @@
+'use client';
+
+import FinanceDetail from '@/components/pages/finance/FinanceDetail';
+import useSWR from 'swr';
+import { useRouter, useSearchParams } from 'next/navigation';
+import { FinanceApi } from '@/services/api/finance';
+import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
+
+const FinanceDetailPage = () => {
+  const router = useRouter();
+  const financeId = useSearchParams().get('financeId');
+
+  const { data: finance } = useSWR(financeId, () =>
+    FinanceApi.getSingleFetcher(financeId as string)
+  );
+
+  if (!financeId) {
+    router.back();
+
+    return (
+      <div className='w-full flex flex-row justify-center items-center p-4'>
+        <span className='loading loading-spinner loading-xl' />
+      </div>
+    );
+  }
+
+  console.log(finance);
+
+  // if (!finance || isResponseError(finance)) {
+  //   router.replace('/404');
+  //   return;
+  // }
+
+  return (
+    <>
+      {isResponseSuccess(finance) && <FinanceDetail finance={finance.data} />}
+    </>
+  );
+};
+
+export default FinanceDetailPage;

src/app/finance/page.tsx

@@ -0,0 +1,32 @@
+'use client';
+
+import FinanceTable from '@/components/pages/finance/FinanceTable';
+import { isResponseSuccess } from '@/lib/api-helper';
+import { FinanceApi } from '@/services/api/finance';
+import useSWR from 'swr';
+
+const Finance = () => {
+  const { data: finances, isLoading: isLoadingFinances } = useSWR(
+    `${FinanceApi.basePath}`,
+    () => FinanceApi.getAllFetcher()
+  );
+
+  if (isLoadingFinances) {
+    return (
+      <div className='w-full flex flex-row justify-center items-center p-4'>
+        <span className='loading loading-spinner loading-xl' />
+      </div>
+    );
+  }
+
+  return (
+    <section className='size-full p-4'>
+      <h1>Finance</h1>
+      <FinanceTable
+        finances={isResponseSuccess(finances) ? finances.data : []}
+      />
+    </section>
+  );
+};
+
+export default Finance;