wag-frontend-version-3/src/pages/Account/AccountPage.tsx

58 lines
1.9 KiB
TypeScript

"use server";
import React, { Suspense } from "react";
import Link from "next/link";
import { PlusCircle } from "lucide-react";
import { checkEndpointsAvailable } from "@/hooks/checkpageAvaliable";
import { retrieveHeadersAndValidationByEndpoint } from "@/apicalls/validations/validations";
import { TableComponent } from "@/components/commons/Table";
import { retrieveaccountsList } from "@/apicalls/accounts/account";
import { PagePropsInterface } from "@/schemas/PageSchema";
const AccountPage: React.FC<PagePropsInterface> = async ({ lang, section }) => {
const pageEndpoint = "/account/records/list";
const availablePageContent = await checkEndpointsAvailable({
section: section as string,
lang,
});
const tableValidateAndHeaders = await retrieveHeadersAndValidationByEndpoint({
endpoint: pageEndpoint,
});
return (
<div>
<Suspense fallback={<div>Account Page is Loading...</div>}>
<h1 className="mt-8 text-center">
{availablePageContent?.table?.title}
</h1>
<h1 className="mt-4 text-center">
{availablePageContent?.table?.description}
</h1>
<div className="my-6">
{availablePageContent?.create && (
<Link
href={"/account/records/create"}
className="flex items-center justify-center gap-2 px-4 py-2 bg-slate-500 text-white rounded hover:bg-slate-700"
>
<PlusCircle size={16} />
Create
</Link>
)}
</div>
<div className="overflow-x-scroll my-6">
{availablePageContent?.table && (
<TableComponent
pageContent={availablePageContent}
tableValidateAndHeaders={tableValidateAndHeaders}
apiFunction={retrieveaccountsList}
redirectTo="/building/update"
/>
)}
</div>
</Suspense>
</div>
);
};
export default AccountPage;