Add logic to render readme

src/app/page.tsx

@@ -1,15 +1,87 @@
-import SwitchLayout from "./compSwitchLayout";
-import Breadcrumb from "./compBreadcrumb";
-import trigger from "./trigger";
-import FileLayout from "./compFileLayout";
-import fetch from "utils/generalHelper/fetch";
-import { API_Response } from "types/api";
+import { Metadata } from "next";
+import { cookies } from "next/headers";
+
+import Breadcrumb from "components/compBreadcrumb";
+import FileLayout from "components/compFileLayout";
+import CompReadmeRender from "components/compReadmeRender";
+import SwitchLayout from "components/compSwitchLayout";
+
+import { handleError } from "utils/generalHelper/axiosFetch";
+
+import { API_Error, API_Response } from "types/api";
 import { FilesResponse } from "types/api/files";
+import { ValidateFilePathResponse } from "types/api/path";
+import { Constant } from "types/general/constant";
+
+import apiConfig from "config/api.config";
+import siteConfig from "config/site.config";
+
+export const metadata: Metadata = {
+  metadataBase: new URL(apiConfig.basePath),
+  title: siteConfig.siteName,
+  description: siteConfig.siteDescription,
+  alternates: {
+    canonical: "/",
+  },
+  openGraph: {
+    title: siteConfig.siteName,
+    description: siteConfig.siteDescription,
+    url: `/`,
+    siteName: siteConfig.siteName,
+  },
+  twitter: {
+    title: siteConfig.siteName,
+    description: siteConfig.siteDescription,
+    card: "summary_large_image",
+    site: siteConfig.siteName,
+  },
+};
 
 async function RootPage() {
-  const { data: filesData } = await fetch.get<
-    API_Response<FilesResponse>
-  >("/api/files");
+  const passwordCookies =
+    cookies().get(Constant.cookiePassword)?.value || "";
+
+  const getPathValidation = fetch(
+    `${apiConfig.basePath}/api/validate`,
+    {
+      headers: {
+        Cookie: `${Constant.cookiePassword}=${passwordCookies}`,
+      },
+    },
+  ).then(
+    (res) =>
+      res.json() as Promise<
+        API_Response<ValidateFilePathResponse>
+      >,
+  );
+
+  const getFilesData = fetch(
+    `${apiConfig.basePath}/api/files`,
+    {
+      headers: {
+        Cookie: `${Constant.cookiePassword}=${passwordCookies}`,
+      },
+    },
+  ).then(
+    (res) =>
+      res.json() as Promise<API_Response<FilesResponse>>,
+  );
+
+  const [pathValidation, filesData] = await Promise.all([
+    getPathValidation,
+    getFilesData,
+  ]);
+
+  if (!pathValidation.success) {
+    const errorData = pathValidation as API_Error;
+    const payload = handleError(errorData);
+    throw new Error(payload);
+  }
+  if (!filesData.success) {
+    const errorData = filesData as API_Error;
+    const payload = handleError(errorData);
+    throw new Error(payload);
+  }
 
   return (
     <div
@@ -39,6 +111,18 @@ async function RootPage() {
           }
         />
       </div>
+
+      {filesData.data?.isReadmeExists &&
+        filesData.data?.readmeContent && (
+          <div
+            id={"content-readme"}
+            className={"card"}
+          >
+            <CompReadmeRender
+              data={filesData.data.readmeContent}
+            />
+          </div>
+        )}
     </div>
   );
 }