From 54687572d4c4b8762b65a4afa13641688c906f97 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:39:48 +0700
Subject: [PATCH 01/20] Add dev indicator at the bottom of the page

---
 src/app/@footer.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/app/@footer.tsx b/src/app/@footer.tsx
index 57710bf..b4ff747 100644
--- a/src/app/@footer.tsx
+++ b/src/app/@footer.tsx
@@ -3,12 +3,14 @@
 import ReactMarkdown from "react-markdown";
 import remarkBreaks from "remark-breaks";
 
+import isDev from "~/utils/isDev";
+
 type Props = {
   content: string;
 };
 export default function Footer({ content }: Props) {
   return (
-    <footer className='w-full pb-3'>
+    <footer className='flex w-full items-center justify-center pb-3'>
       <ReactMarkdown
         className='flex w-full select-none flex-col items-center justify-center text-center'
         components={{
@@ -39,6 +41,11 @@ export default function Footer({ content }: Props) {
       >
         {content}
       </ReactMarkdown>
+      {isDev && (
+        <div className='fixed bottom-0 z-[999] rounded-t-[var(--radius)] border border-border bg-primary px-3 py-1 text-xs text-primary-foreground'>
+          Dev Mode
+        </div>
+      )}
     </footer>
   );
 }

From 89c03b7cd4e1635f58188a1f034773b478a284a0 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:40:20 +0700
Subject: [PATCH 02/20] Update deploy guide icon

---
 src/app/@navbar.tsx | 53 +++++++++++++++++++++++----------------------
 1 file changed, 27 insertions(+), 26 deletions(-)

diff --git a/src/app/@navbar.tsx b/src/app/@navbar.tsx
index 92632ca..5aee01b 100644
--- a/src/app/@navbar.tsx
+++ b/src/app/@navbar.tsx
@@ -152,31 +152,6 @@ export default function Navbar() {
                 className='mx-3 my-auto h-6'
               />
 
-              {config.showDeployGuide && (
-                <Tooltip>
-                  <TooltipTrigger asChild>
-                    <Link
-                      href={"/deploy"}
-                      className={cn(
-                        "flex flex-col items-center justify-center",
-                        "opacity-80",
-                        "hover:opacity-100",
-                        "cursor-pointer",
-                        "p-1.5",
-                      )}
-                    >
-                      <Icon
-                        name={"Book"}
-                        size={20}
-                      />
-                    </Link>
-                  </TooltipTrigger>
-                  <TooltipContent side='bottom'>
-                    <p>Deploy Guide</p>
-                  </TooltipContent>
-                </Tooltip>
-              )}
-
               <DropdownMenu
                 modal={false}
                 open={themeOpen}
@@ -293,6 +268,32 @@ export default function Navbar() {
                 </DropdownMenu>
               )}
 
+              {config.showDeployGuide && (
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <Link
+                      href={"/deploy"}
+                      className={cn(
+                        "flex items-center justify-center gap-1.5",
+                        "opacity-80",
+                        "hover:opacity-100",
+                        "cursor-pointer",
+                        "p-1.5",
+                      )}
+                    >
+                      <Icon
+                        name={"Book"}
+                        size={20}
+                      />
+                      <span className='text-sm'>Guide</span>
+                    </Link>
+                  </TooltipTrigger>
+                  <TooltipContent side='bottom'>
+                    <p>Deploy Guide</p>
+                  </TooltipContent>
+                </Tooltip>
+              )}
+
               <Separator
                 orientation='vertical'
                 className='mx-3 my-auto h-6'
@@ -451,7 +452,7 @@ export default function Navbar() {
                   </Button>
                 </SheetTrigger>
                 <SheetContent className='flex flex-col items-center gap-3 pt-12'>
-                  <div className='flex w-full flex-grow flex-col gap-6 overflow-y-scroll'>
+                  <div className='flex w-full flex-grow flex-col gap-6 overflow-y-auto'>
                     <div className='flex flex-col'>
                       {config.siteConfig.navbarItems.map((item) => (
                         <Button

From e7ae9190902d525aacbb54fe74e0d07c77044868 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:41:24 +0700
Subject: [PATCH 03/20] Disable cache when fetching cache, and add support for
 shortcut readme

---
 src/app/actions.ts | 56 ++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 52 insertions(+), 4 deletions(-)

diff --git a/src/app/actions.ts b/src/app/actions.ts
index 90ffc18..18461be 100644
--- a/src/app/actions.ts
+++ b/src/app/actions.ts
@@ -7,7 +7,7 @@ import { z } from "zod";
 import { Schema_File } from "~/schema";
 
 import { decryptData, encryptData } from "~/utils/encryptionHelper/hash";
-import gdrive from "~/utils/gdriveInstance";
+import gdrive, { gdriveNoCache } from "~/utils/gdriveInstance";
 
 import { Constant } from "~/types/constant";
 
@@ -230,7 +230,7 @@ export async function CheckPassword(
       `trashed = false`,
       `(${ids.map((id) => `'${id}' in parents`).join(" or ")})`, // Filter by paths id
     ];
-    const { data: password } = await gdrive.files
+    const { data: password } = await gdriveNoCache.files
       .list({
         q: query.join(" and "),
         fields: "files(id, name, mimeType, parents)",
@@ -635,7 +635,8 @@ export async function GetReadme(
     }
 
     const query: string[] = [
-      ...config.apiConfig.defaultQuery,
+      "trashed = false",
+      "(not mimeType contains 'folder')",
       `name = '${config.apiConfig.specialFile.readme}'`,
       `'${decryptedId}' in parents`,
     ];
@@ -654,9 +655,56 @@ export async function GetReadme(
     });
     if (!data.files?.length) return null;
 
+    let file;
+
+    if (data.files.length === 1) {
+      file = data.files[0];
+    } else {
+      // Check by mimetype, use google-apps.shortcut last
+      file = data.files.find((item) => item.mimeType === "text/markdown");
+      if (!file) {
+        file = data.files.find(
+          (item) => item.mimeType === "application/vnd.google-apps.shortcut",
+        );
+      }
+    }
+
+    if (!file) return null;
+    if (
+      file.mimeType !== "text/markdown" &&
+      file.mimeType !== "application/vnd.google-apps.shortcut"
+    )
+      return null;
+
+    if (file.mimeType === "application/vnd.google-apps.shortcut") {
+      const { data: shortcutData } = (await gdrive.files.get({
+        fileId: file.id as string,
+        fields: "shortcutDetails",
+        supportsAllDrives: config.apiConfig.isTeamDrive,
+      })) as {
+        data: { shortcutDetails: { targetId: string; targetMimeType: string } };
+      };
+      if (!shortcutData.shortcutDetails.targetId) return null;
+      if (shortcutData.shortcutDetails.targetMimeType !== "text/markdown")
+        return null;
+
+      const { data: content } = await gdrive.files.get(
+        {
+          fileId: shortcutData.shortcutDetails.targetId,
+          alt: "media",
+          supportsAllDrives: config.apiConfig.isTeamDrive,
+        },
+        {
+          responseType: "text",
+        },
+      );
+
+      return content as string;
+    }
+
     const { data: content } = await gdrive.files.get(
       {
-        fileId: data.files[0].id as string,
+        fileId: file.id as string,
         alt: "media",
         supportsAllDrives: config.apiConfig.isTeamDrive,
       },

From 7b240bdde85d88aee724207711dad80c121f3440 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:41:36 +0700
Subject: [PATCH 04/20] Update scrollbar background style

---
 src/app/globals.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/globals.css b/src/app/globals.css
index cbb219c..e73ec9b 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -75,7 +75,7 @@ body {
     @apply h-1.5 w-1.5;
   }
   ::-webkit-scrollbar-track {
-    @apply bg-background;
+    @apply bg-primary/5;
   }
   ::-webkit-scrollbar-thumb {
     @apply rounded-full bg-primary/25 hover:bg-primary/50;

From b066e409784438fa0f6bd6777e908ef3927e8a92 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:41:52 +0700
Subject: [PATCH 05/20] Fix missing `%t` support from name template

---
 src/app/layout.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 8050acd..b99a5b5 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -41,7 +41,11 @@ export const metadata: Metadata = {
   metadataBase: new URL(config.basePath),
   title: {
     default: config.siteConfig.siteName,
-    template: config.siteConfig.siteNameTemplate || "%s",
+    template:
+      config.siteConfig.siteNameTemplate?.replace(
+        "%t",
+        config.siteConfig.siteName,
+      ) || "%s",
   },
   description: config.siteConfig.siteDescription,
   authors: config.siteConfig.siteAuthor

From ac0ad0e2801b50b82e87dd7b16b76521e8bfdad9 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:42:23 +0700
Subject: [PATCH 06/20] Add `itemsPerPage` and `searchResult` config

---
 src/app/[...rest]/deploy/@form.api-config.tsx | 130 ++++++++++++++++++
 1 file changed, 130 insertions(+)

diff --git a/src/app/[...rest]/deploy/@form.api-config.tsx b/src/app/[...rest]/deploy/@form.api-config.tsx
index def64e0..c50cc0a 100644
--- a/src/app/[...rest]/deploy/@form.api-config.tsx
+++ b/src/app/[...rest]/deploy/@form.api-config.tsx
@@ -123,6 +123,8 @@ export default function ApiConfig({
                       );
                     }
                     set("api", "isTeamDrive", config.api.isTeamDrive || false);
+                    set("api", "itemsPerPage", config.api.itemsPerPage || 50);
+                    set("api", "searchResult", config.api.searchResult || 5);
                     set(
                       "api",
                       "proxyThumbnail",
@@ -143,6 +145,11 @@ export default function ApiConfig({
                       "maxFileSize",
                       config.api.maxFileSize || 4 * 1024 * 1024,
                     );
+                    set(
+                      "api",
+                      "streamMaxSize",
+                      config.api.streamMaxSize || 100 * 1024 * 1024,
+                    );
 
                     fileInput.value = "";
                     toast.success("Config loaded from file");
@@ -269,6 +276,82 @@ This ID will be encrypted in the config file`}
           </ConfigInput>
         )}
 
+        <div className='grid grid-cols-1 gap-3 tablet:grid-cols-2'>
+          <ConfigInput<ConfigurationKeys<"api">>
+            key='itemsPerPage'
+            title='Items Per Page'
+            description={`Set how many items to display per page in the file list.          
+It's recommended to set this to a reasonable number, since it will affect the load time of the page.
+
+Default is 50.`}
+            error={error.get.itemsPerPage}
+            required
+          >
+            <Input
+              id='itemsPerPage'
+              name='itemsPerPage'
+              type='number'
+              value={get.api.itemsPerPage}
+              min={1}
+              onChange={(e) => {
+                if (error.get.itemsPerPage) {
+                  error.set("itemsPerPage", "");
+                }
+                set("api", "itemsPerPage", parseInt(e.target.value));
+              }}
+              onBlur={async () => {
+                try {
+                  const value = get.api.itemsPerPage;
+                  error.set("itemsPerPage", "");
+
+                  if (value <= 0)
+                    throw new Error("Items Per Page must be more than 0");
+                } catch (err) {
+                  const e = err as Error;
+                  error.set("itemsPerPage", e.message);
+                }
+              }}
+            />
+          </ConfigInput>
+
+          <ConfigInput<ConfigurationKeys<"api">>
+            key='searchResult'
+            title='Search Result'
+            description={`Set how many items to display in the search result.
+It's recommended to set this to a small number, since it will affect the load time of the page.
+
+Default is 5.`}
+            error={error.get.searchResult}
+            required
+          >
+            <Input
+              id='searchResult'
+              name='searchResult'
+              type='number'
+              value={get.api.searchResult}
+              min={1}
+              onChange={(e) => {
+                if (error.get.searchResult) {
+                  error.set("searchResult", "");
+                }
+                set("api", "searchResult", parseInt(e.target.value));
+              }}
+              onBlur={async () => {
+                try {
+                  const value = get.api.searchResult;
+                  error.set("searchResult", "");
+
+                  if (value <= 0)
+                    throw new Error("Search Result must be more than 0");
+                } catch (err) {
+                  const e = err as Error;
+                  error.set("searchResult", e.message);
+                }
+              }}
+            />
+          </ConfigInput>
+        </div>
+
         <ConfigInput<ConfigurationKeys<"api">>
           key='proxyThumbnail'
           title='Proxy Thumbnail'
@@ -397,6 +480,53 @@ Set to 0 to disable the limit.`}
             }}
           />
         </ConfigInput>
+
+        <ConfigInput<ConfigurationKeys<"api">>
+          key='streamMaxSize'
+          title='Max Stream Size (in MB)'
+          description={`For previewing large files, the file will be streamed in chunks.
+There are response limit in some deploy platform like Vercel, also Google Drive will return 403 error if we tried using fetch to download large file on client.
+
+Make sure it's within reasonable size, since it will count towards your server bandwidth usage.
+This will also affect the maximum file size that can be previewed. Especially for media files like video, audio, and images.
+(Manga preview will automatically limited to the first 5MB)
+
+Default is 100MB, set to 0 to disable the limit.`}
+          error={error.get.streamMaxSize}
+          required
+        >
+          <Input
+            id='streamMaxSize'
+            name='streamMaxSize'
+            type='number'
+            value={get.api.streamMaxSize / 1024 / 1024}
+            min={0}
+            onChange={(e) => {
+              if (error.get.maxFileSize) {
+                error.set("streamMaxSize", "");
+              }
+              set(
+                "api",
+                "streamMaxSize",
+                parseInt(e.target.value) * 1024 * 1024,
+              );
+            }}
+            onBlur={async () => {
+              try {
+                const value = get.api.streamMaxSize;
+                error.set("streamMaxSize", "");
+
+                if (value < 0)
+                  throw new Error(
+                    "Max stream size must be more than or equal to 0",
+                  );
+              } catch (err) {
+                const e = err as Error;
+                error.set("streamMaxSize", e.message);
+              }
+            }}
+          />
+        </ConfigInput>
       </div>
     </form>
   );

From 6c768ac70340af7593311a32dbbda495657f0e6a Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:43:19 +0700
Subject: [PATCH 07/20] Update default config and Fix download blob

---
 src/app/[...rest]/deploy/docs.tsx | 46 +++++++++++--------------------
 1 file changed, 16 insertions(+), 30 deletions(-)

diff --git a/src/app/[...rest]/deploy/docs.tsx b/src/app/[...rest]/deploy/docs.tsx
index c77424d..8af2eab 100644
--- a/src/app/[...rest]/deploy/docs.tsx
+++ b/src/app/[...rest]/deploy/docs.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useState } from "react";
 import toast from "react-hot-toast";
 import { z } from "zod";
 import {
@@ -32,7 +32,7 @@ If you are new to this project, you can follow along from the beginning.
 But if you've already deployed the app before and want to upgrade from v1, you can skip to the [Migrating from v1](#migrating) section.  
 You can also use this guide to [configure the app](#config) and [customize the theme](#theme).  
 
-**We recommend you to use this deployment guide on a desktop browser for optimal experience.**
+**We recommend you to use this deployment guide on a desktop browser.**
 
 _**Note:** This guide assumes you have a basic understanding of how to deploy a Next.js app on Vercel or other platforms._`;
 
@@ -161,7 +161,11 @@ const initialConfiguration: z.input<typeof Schema_App_Configuration> = {
     rootFolder: "",
     isTeamDrive: false,
     sharedDrive: "",
+    itemsPerPage: 50,
+    searchResult: 5,
+
     proxyThumbnail: true,
+    streamMaxSize: 100 * 1024 * 1024,
 
     allowDownloadProtectedFile: false,
     temporaryTokenDuration: 6,
@@ -170,8 +174,8 @@ const initialConfiguration: z.input<typeof Schema_App_Configuration> = {
   site: {
     ...config.siteConfig,
     siteName: "next-gdrive-index",
-    siteNameTemplate: "%s",
-    siteDescription: "A simple Google Drive Index using Next.js",
+    siteNameTemplate: "%s - %t",
+    siteDescription: "A Google Drive Index built using Next.js",
     siteAuthor: "mbahArip",
     twitterHandle: "@mbahArip",
 
@@ -195,9 +199,6 @@ const initialConfiguration: z.input<typeof Schema_App_Configuration> = {
 };
 
 export function Configuration() {
-  const fileConfigRef = useRef<HTMLInputElement>(null);
-  const fileEnvRef = useRef<HTMLInputElement>(null);
-
   const [loading, setLoading] = useState<boolean>(true);
   const [configuration, setConfiguration] =
     useState<z.input<typeof Schema_App_Configuration>>(initialConfiguration);
@@ -342,7 +343,6 @@ const config: z.input<typeof Schema_Config> = {
   /**
    * How long the cache will be stored in the browser
    * Used for all pages and api routes
-   * Default is 5 minutes (300/60 = 5min)
    *
    * @default "max-age=0, s-maxage=60, stale-while-revalidate"
    */
@@ -395,8 +395,8 @@ const config: z.input<typeof Schema_Config> = {
       "id, name, mimeType, thumbnailLink, fileExtension, modifiedTime, size, imageMediaMetadata, videoMediaMetadata, webContentLink, trashed",
     defaultOrder: "folder, name asc, modifiedTime desc",
 
-    itemsPerPage: 50,
-    searchResult: 5,
+    itemsPerPage: ${configuration.api.itemsPerPage},
+    searchResult: ${configuration.api.searchResult},
 
     /**
      * By default, the app will use the thumbnail URL from Google Drive
@@ -426,7 +426,7 @@ const config: z.input<typeof Schema_Config> = {
      * 
      * Default: 100MB
      */
-    streamMaxSize: ${100 * 1024 * 1024},
+    streamMaxSize: ${configuration.api.streamMaxSize},
 
     /**
      * Special file name that will be used for certain purposes
@@ -555,22 +555,8 @@ const config: z.input<typeof Schema_Config> = {
     footer: [
       "{{ siteName }} *v{{ version }}* @ {{ repository }}",
       "{{ year }} - Made with ❤️ by **{{ author }}**",
-      isDev ? "Development Mode" : "",
     ],
 
-    /**
-     * DEPRECATED
-     * Since we're using shadcn/ui now, please refer to their theming documentation
-     * https://ui.shadcn.com/docs/theming
-     *
-     * Or you can use their themes, and replace the color in /src/app/globals.css
-     * https://ui.shadcn.com/themes
-     *
-     * Tailwind color name.
-     * Ref: https://tailwindcss.com/docs/customizing-colors
-     */
-    // defaultAccentColor: "teal",
-
     /**
      * Site wide password protection
      * If this is set, all files and folders will be protected by this password
@@ -626,11 +612,11 @@ const config: z.input<typeof Schema_Config> = {
 
 export default config;`;
 
-      // downloadBlob(new Blob([envContent], { type: "text/plain" }), "env");
-      // downloadBlob(
-      //   new Blob([configContent], { type: "text/typescript" }),
-      //   "gindex.config.ts",
-      // );
+      downloadBlob(new Blob([envContent], { type: "text/plain" }), "env");
+      downloadBlob(
+        new Blob([configContent], { type: "text/typescript" }),
+        "gindex.config.ts",
+      );
 
       toast.success("Configuration file downloaded!", {
         id: "download-config",

From 752550b05bebadb5ab6d3875f3ddff0624bca86e Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:43:36 +0700
Subject: [PATCH 08/20] Add info alert about deploy page

---
 src/app/[...rest]/deploy/index.tsx | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/src/app/[...rest]/deploy/index.tsx b/src/app/[...rest]/deploy/index.tsx
index f911edc..6f169aa 100644
--- a/src/app/[...rest]/deploy/index.tsx
+++ b/src/app/[...rest]/deploy/index.tsx
@@ -175,6 +175,22 @@ export default function DeployGuidePage() {
             view='markdown'
             className='px-0'
           />
+
+          <Alert className='bg-blue-50 text-blue-600 dark:bg-blue-950/25 dark:text-blue-500'>
+            <div className='flex items-start gap-3'>
+              <Icon
+                name='Info'
+                className='size-5'
+              />
+              <div className='flex flex-col'>
+                <AlertTitle>About this guide</AlertTitle>
+                <AlertDescription>
+                  <p className='w-full whitespace-pre-wrap text-pretty'>{`If you're from previous version, your deployment might have this deployment guide.
+You can disable it from the config files, there a new setting called 'showDeployGuide' you need to set to false.`}</p>
+                </AlertDescription>
+              </div>
+            </div>
+          </Alert>
         </CardContent>
       </Card>
 

From 93e125144b0cee356bb30a1018dc3a9454222b9d Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:44:02 +0700
Subject: [PATCH 09/20] Bump version, and remove unused comments

---
 src/config/gIndex.config.ts | 31 +++----------------------------
 1 file changed, 3 insertions(+), 28 deletions(-)

diff --git a/src/config/gIndex.config.ts b/src/config/gIndex.config.ts
index 284895e..d86f18c 100644
--- a/src/config/gIndex.config.ts
+++ b/src/config/gIndex.config.ts
@@ -8,7 +8,7 @@ const config: z.input<typeof Schema_Config> = {
    * If possible, please don't change this value
    * Even if you're creating a PR, just let me change it myself
    */
-  version: "2.0.2",
+  version: "2.0.3",
   /**
    * Base path of the app, used for generating links
    *
@@ -35,19 +35,9 @@ const config: z.input<typeof Schema_Config> = {
    */
   showDeployGuide: true,
 
-  /**
-   * DEPRECATED
-   * Since in 2.0 we're using server side data fetching, this is not needed anymore.
-   *
-   * Hashed key for fetching protected files / folders from the server
-   * This key will bypass the file / folder password
-   */
-  // masterKey: "masterkey",
-
   /**
    * How long the cache will be stored in the browser
    * Used for all pages and api routes
-   * Default is 5 minutes (300/60 = 5min)
    *
    * @default "max-age=0, s-maxage=60, stale-while-revalidate"
    */
@@ -62,8 +52,6 @@ const config: z.input<typeof Schema_Config> = {
      * You need to create a new folder and share it with the service account
      * Then, copy the folder id and paste it here
      */
-    // rootFolder:
-    //   "c760fc0eae9990d4accbc2134af21e45a378d412af2c78020070a9f9ac548b98fe61c4f6be953a8d7be6a035e6f7766c",
     rootFolder:
       "b76c7c22083307a3aa99c28ab7cc69851d682f5a250d995679d4be5276cab16ab6c37f4d5b7ad1a9b93fb9bf768e752c",
 
@@ -196,11 +184,12 @@ const config: z.input<typeof Schema_Config> = {
      * Site Name will be used for default metadata title
      * Site Name Template will be used if the page has a title
      * %s will be replaced with the page title
+     * %t will be replaced with the site name
      *
      * You can set it to undefined if you don't want to use it
      */
     siteName: "next-gdrive-index",
-    siteNameTemplate: "%s - next-gdrive-index",
+    siteNameTemplate: "%s - %t",
     siteDescription: "A simple file browser for Google Drive",
     siteIcon: "/logo.svg",
     siteAuthor: "mbaharip",
@@ -243,22 +232,8 @@ const config: z.input<typeof Schema_Config> = {
     footer: [
       "{{ siteName }} *v{{ version }}* @ {{ repository }}",
       "{{ year }} - Made with ❤️ by **{{ author }}**",
-      isDev ? "Development Mode" : "",
     ],
 
-    /**
-     * DEPRECATED
-     * Since we're using shadcn/ui now, please refer to their theming documentation
-     * https://ui.shadcn.com/docs/theming
-     *
-     * Or you can use their themes, and replace the color in /src/app/globals.css
-     * https://ui.shadcn.com/themes
-     *
-     * Tailwind color name.
-     * Ref: https://tailwindcss.com/docs/customizing-colors
-     */
-    // defaultAccentColor: "teal",
-
     /**
      * Site wide password protection
      * If this is set, all files and folders will be protected by this password

From eda30f23c4f0f5b73760b05d984afb10af3812bb Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 06:44:45 +0700
Subject: [PATCH 10/20] Add math equation parse from config

---
 src/utils/parseConfigFile.ts | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/utils/parseConfigFile.ts b/src/utils/parseConfigFile.ts
index cd80d6f..6d5906e 100644
--- a/src/utils/parseConfigFile.ts
+++ b/src/utils/parseConfigFile.ts
@@ -32,7 +32,21 @@ export function parseConfigFile(config: string):
       .replace(/\t/g, "") // Remove line breaks and tabs
 
       .replace(/basePath:(.*?),/g, 'basePath: "placeholder-domain",') // Replace basePath variable with placeholder
-      .replace(/maxFileSize:(.*?),/g, "maxFileSize: 4194304,") // Set maxFileSize to 4MB
+      .replace(/maxFileSize:(.*?),/g, (str) => {
+        if (!str) return "maxFileSize: 4194304,"; // Set maxFileSize to 4MB
+        const value = str.split(":")[1].split(",")[0].trim();
+        return `maxFileSize: ${eval(value)},`;
+      }) // Set maxFileSize to 4MB
+      .replace(/streamMaxSize:(.*?),/g, (str) => {
+        if (!str) return "streamMaxSize: 104857600,";
+        const value = str.split(":")[1].split(",")[0].trim();
+        return `streamMaxSize: ${eval(value)},`;
+      }) // Set streamMaxSize to 100MB
+      .replace(/temporaryTokenDuration:(.*?),/g, (str) => {
+        if (!str) return "temporaryTokenDuration: 6,";
+        const value = str.split(":")[1].split(",")[0].trim();
+        return `temporaryTokenDuration: ${eval(value)},`;
+      })
 
       .replace(/([a-zA-Z]*?):\s/g, '"$1": ') // Add double quotes to keys
       .trim()

From 0eeaf04b2c57532ad51e171b4cf626983ba052f7 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 15:31:39 +0700
Subject: [PATCH 11/20] Add theme customizer

---
 src/app/@file.grid.tsx                        |  34 +-
 src/app/@file.list.tsx                        |  34 +-
 src/app/@footer.tsx                           |   2 +-
 src/app/[...rest]/deploy/@form.api-config.tsx |   2 +-
 src/app/[...rest]/deploy/@form.env-config.tsx |   2 +-
 ...@form.input.tsx => @form.input-config.tsx} |   0
 .../[...rest]/deploy/@form.input-theme.tsx    | 181 +++++
 .../[...rest]/deploy/@form.site-config.tsx    |   2 +-
 src/app/[...rest]/deploy/@form.theme.tsx      | 235 +++++++
 src/app/[...rest]/deploy/@theme-preview.tsx   | 369 ++++++++++
 src/app/[...rest]/deploy/docs.tsx             | 639 +++++++++++++++++-
 src/components/ui/slider.tsx                  |  28 +
 src/schema.ts                                 |   1 +
 src/utils/parseConfigFile.ts                  |  10 +
 14 files changed, 1492 insertions(+), 47 deletions(-)
 rename src/app/[...rest]/deploy/{@form.input.tsx => @form.input-config.tsx} (100%)
 create mode 100644 src/app/[...rest]/deploy/@form.input-theme.tsx
 create mode 100644 src/app/[...rest]/deploy/@form.theme.tsx
 create mode 100644 src/app/[...rest]/deploy/@theme-preview.tsx
 create mode 100644 src/components/ui/slider.tsx

diff --git a/src/app/@file.grid.tsx b/src/app/@file.grid.tsx
index ac5d9ba..7359d8b 100644
--- a/src/app/@file.grid.tsx
+++ b/src/app/@file.grid.tsx
@@ -2,6 +2,7 @@
 
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import nProgress from "nprogress";
 import { useMemo, useState } from "react";
 import toast from "react-hot-toast";
 import { z } from "zod";
@@ -38,8 +39,9 @@ import { CreateDownloadToken } from "./actions";
 
 type Props = {
   data: z.infer<typeof Schema_File>;
+  disabled?: boolean;
 };
-export default function FileGrid({ data }: Props) {
+export default function FileGrid({ data, disabled }: Props) {
   const pathname = usePathname();
   const filePath = useMemo<string>(() => {
     // const currentPath = pathname.startsWith("/e") ? pathname : `/e${pathname}`;
@@ -120,7 +122,10 @@ export default function FileGrid({ data }: Props) {
             </Button>
           </DropdownMenuTrigger>
           <DropdownMenuContent align='end'>
-            <DropdownMenuItem onClick={onCopy}>
+            <DropdownMenuItem
+              onClick={onCopy}
+              disabled={disabled}
+            >
               <Icon
                 name='Link'
                 className='mr-3'
@@ -129,7 +134,10 @@ export default function FileGrid({ data }: Props) {
               Copy link
             </DropdownMenuItem>
             {data.mimeType.includes("folder") ? null : (
-              <DropdownMenuItem onClick={onDownload}>
+              <DropdownMenuItem
+                onClick={onDownload}
+                disabled={disabled}
+              >
                 <Icon
                   name='Download'
                   className='mr-3'
@@ -167,7 +175,10 @@ export default function FileGrid({ data }: Props) {
             </DrawerHeader>
             <div className='grid gap-1.5 px-4'>
               <DrawerClose asChild>
-                <Button onClick={onCopy}>
+                <Button
+                  onClick={onCopy}
+                  disabled={disabled}
+                >
                   <Icon
                     name='Link'
                     className='mr-3'
@@ -178,7 +189,10 @@ export default function FileGrid({ data }: Props) {
               </DrawerClose>
               {data.mimeType.includes("folder") ? null : (
                 <DrawerClose asChild>
-                  <Button onClick={onDownload}>
+                  <Button
+                    onClick={onDownload}
+                    disabled={disabled}
+                  >
                     <Icon
                       name='Download'
                       className='mr-3'
@@ -199,6 +213,14 @@ export default function FileGrid({ data }: Props) {
         </Drawer>
       )}
       <Link
+        onClick={async (e) => {
+          if (disabled) {
+            e.preventDefault();
+            e.stopPropagation();
+            await new Promise((resolve) => setTimeout(resolve, 500));
+            nProgress.done(true);
+          }
+        }}
         href={filePath}
         className={cn(
           "h-full w-full",
@@ -291,7 +313,7 @@ export default function FileGrid({ data }: Props) {
               >
                 {data.mimeType.includes("folder")
                   ? "folder"
-                  : data.fileExtension}
+                  : data.fileExtension || "unknown"}
               </span>
               {!data.mimeType.includes("folder") && (
                 <>
diff --git a/src/app/@file.list.tsx b/src/app/@file.list.tsx
index 0513e51..2108656 100644
--- a/src/app/@file.list.tsx
+++ b/src/app/@file.list.tsx
@@ -2,6 +2,7 @@
 
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import nProgress from "nprogress";
 import { useMemo, useState } from "react";
 import toast from "react-hot-toast";
 import { z } from "zod";
@@ -38,8 +39,9 @@ import { CreateDownloadToken } from "./actions";
 
 type Props = {
   data: z.infer<typeof Schema_File>;
+  disabled?: boolean;
 };
-export default function FileList({ data }: Props) {
+export default function FileList({ data, disabled }: Props) {
   const pathname = usePathname();
 
   const filePath = useMemo<string>(() => {
@@ -121,7 +123,10 @@ export default function FileList({ data }: Props) {
               </Button>
             </DropdownMenuTrigger>
             <DropdownMenuContent align='end'>
-              <DropdownMenuItem onClick={onCopy}>
+              <DropdownMenuItem
+                onClick={onCopy}
+                disabled={disabled}
+              >
                 <Icon
                   name='Link'
                   className='mr-3'
@@ -130,7 +135,10 @@ export default function FileList({ data }: Props) {
                 Copy link
               </DropdownMenuItem>
               {data.mimeType.includes("folder") ? null : (
-                <DropdownMenuItem onClick={onDownload}>
+                <DropdownMenuItem
+                  onClick={onDownload}
+                  disabled={disabled}
+                >
                   <Icon
                     name='Download'
                     className='mr-3'
@@ -169,7 +177,10 @@ export default function FileList({ data }: Props) {
               </DrawerHeader>
               <div className='grid gap-1.5 px-4'>
                 <DrawerClose asChild>
-                  <Button onClick={onCopy}>
+                  <Button
+                    onClick={onCopy}
+                    disabled={disabled}
+                  >
                     <Icon
                       name='Link'
                       className='mr-3'
@@ -180,7 +191,10 @@ export default function FileList({ data }: Props) {
                 </DrawerClose>
                 {data.mimeType.includes("folder") ? null : (
                   <DrawerClose asChild>
-                    <Button onClick={onDownload}>
+                    <Button
+                      onClick={onDownload}
+                      disabled={disabled}
+                    >
                       <Icon
                         name='Download'
                         className='mr-3'
@@ -202,6 +216,14 @@ export default function FileList({ data }: Props) {
         )}
       </div>
       <Link
+        onClick={async (e) => {
+          if (disabled) {
+            e.preventDefault();
+            e.stopPropagation();
+            await new Promise((resolve) => setTimeout(resolve, 500));
+            nProgress.done(true);
+          }
+        }}
         href={filePath}
         className={cn(
           "relative",
@@ -279,7 +301,7 @@ export default function FileList({ data }: Props) {
               >
                 {data.mimeType.includes("folder")
                   ? "folder"
-                  : data.fileExtension}
+                  : data.fileExtension || "unknown"}
               </span>
               {!data.mimeType.includes("folder") && (
                 <>
diff --git a/src/app/@footer.tsx b/src/app/@footer.tsx
index b4ff747..3287b41 100644
--- a/src/app/@footer.tsx
+++ b/src/app/@footer.tsx
@@ -42,7 +42,7 @@ export default function Footer({ content }: Props) {
         {content}
       </ReactMarkdown>
       {isDev && (
-        <div className='fixed bottom-0 z-[999] rounded-t-[var(--radius)] border border-border bg-primary px-3 py-1 text-xs text-primary-foreground'>
+        <div className='fixed bottom-0 z-[999] rounded-t-[var(--radius)] border border-b-0 border-border bg-primary px-3 py-1 text-xs text-primary-foreground'>
           Dev Mode
         </div>
       )}
diff --git a/src/app/[...rest]/deploy/@form.api-config.tsx b/src/app/[...rest]/deploy/@form.api-config.tsx
index c50cc0a..48f9ba3 100644
--- a/src/app/[...rest]/deploy/@form.api-config.tsx
+++ b/src/app/[...rest]/deploy/@form.api-config.tsx
@@ -23,7 +23,7 @@ import { Separator } from "~/components/ui/separator";
 import { decryptData } from "~/utils/encryptionHelper/hash";
 import { parseConfigFile } from "~/utils/parseConfigFile";
 
-import ConfigInput from "./@form.input";
+import ConfigInput from "./@form.input-config";
 
 type Props = {
   state: {
diff --git a/src/app/[...rest]/deploy/@form.env-config.tsx b/src/app/[...rest]/deploy/@form.env-config.tsx
index d3a8361..c7244a0 100644
--- a/src/app/[...rest]/deploy/@form.env-config.tsx
+++ b/src/app/[...rest]/deploy/@form.env-config.tsx
@@ -17,7 +17,7 @@ import { Button } from "~/components/ui/button";
 import { Input } from "~/components/ui/input";
 import { Separator } from "~/components/ui/separator";
 
-import ConfigInput from "./@form.input";
+import ConfigInput from "./@form.input-config";
 
 type Props = {
   state: {
diff --git a/src/app/[...rest]/deploy/@form.input.tsx b/src/app/[...rest]/deploy/@form.input-config.tsx
similarity index 100%
rename from src/app/[...rest]/deploy/@form.input.tsx
rename to src/app/[...rest]/deploy/@form.input-config.tsx
diff --git a/src/app/[...rest]/deploy/@form.input-theme.tsx b/src/app/[...rest]/deploy/@form.input-theme.tsx
new file mode 100644
index 0000000..3553ca3
--- /dev/null
+++ b/src/app/[...rest]/deploy/@form.input-theme.tsx
@@ -0,0 +1,181 @@
+"use client";
+
+import { PopoverTrigger } from "@radix-ui/react-popover";
+import React, { PropsWithChildren } from "react";
+import { HslColor, HslColorPicker } from "react-colorful";
+import { z } from "zod";
+import { Schema_Theme } from "~/schema";
+
+import Icon from "~/components/Icon";
+import { Input } from "~/components/ui/input";
+import { Label } from "~/components/ui/label";
+import { Popover, PopoverContent } from "~/components/ui/popover";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "~/components/ui/tooltip";
+
+type Props = {
+  key: keyof z.infer<typeof Schema_Theme>;
+  title: string;
+  description?: string;
+  value: HslColor;
+  onChange: (color: HslColor) => void;
+  children?: React.ReactNode;
+};
+export default function ThemeInput(props: PropsWithChildren<Props>) {
+  // const [value, setValue] = useState<HslColor>(props.value);
+  // const [debouncedValue, setDebouncedValue] = useState<HslColor>(props.value);
+
+  // useEffect(() => {
+  //   setValue(props.value);
+
+  //   // eslint-disable-next-line react-hooks/exhaustive-deps
+  // }, [props.value]);
+
+  // useEffect(() => {
+  //   const timeout = setTimeout(() => {
+  //     setDebouncedValue(value);
+  //   }, 250);
+  //   return () => clearTimeout(timeout);
+
+  //   // eslint-disable-next-line react-hooks/exhaustive-deps
+  // }, [value]);
+
+  // useEffect(() => {
+  //   props.onChange(debouncedValue);
+
+  //   // eslint-disable-next-line react-hooks/exhaustive-deps
+  // }, [debouncedValue]);
+
+  return (
+    <div
+      id={props.key}
+      slot={`input-${props.key}`}
+      // className='flex w-full items-center justify-between gap-6'
+      className='grid w-full grid-cols-3 gap-6'
+    >
+      <div
+        slot='label'
+        className='flex items-center gap-3'
+      >
+        <span className='text-base'>{props.title}</span>
+        {props.description && (
+          <Tooltip>
+            <TooltipTrigger
+              onClick={(e) => e.preventDefault()}
+              className='cursor-default'
+            >
+              <Icon
+                name='Info'
+                size='1rem'
+                className='text-muted-foreground'
+              />
+            </TooltipTrigger>
+            <TooltipContent
+              side='right'
+              className='max-w-screen-sm'
+            >
+              <p className='max-w-screen-sm !whitespace-pre-wrap'>
+                {props.description}
+              </p>
+            </TooltipContent>
+          </Tooltip>
+        )}
+      </div>
+
+      <div
+        slot='input'
+        className='col-span-2 flex flex-grow items-center justify-end gap-3'
+      >
+        {props.children ? (
+          props.children
+        ) : (
+          <>
+            <span className='flex-grow text-sm text-muted-foreground'>
+              hsl({props.value.h}, {props.value.s}%, {props.value.l}%)
+            </span>
+            <Popover>
+              <PopoverTrigger>
+                <div className='size-8 rounded-[var(--radius)] border border-border p-0.5'>
+                  <div
+                    className='size-full rounded-[calc(var(--radius)-0.125rem)]'
+                    style={{
+                      background: `hsl(${props.value.h}, ${props.value.s}%, ${props.value.l}%)`,
+                    }}
+                  />
+                </div>
+              </PopoverTrigger>
+              <PopoverContent className='flex gap-6'>
+                <HslColorPicker
+                  color={props.value}
+                  onChange={props.onChange}
+                />
+                <div className='flex flex-grow flex-col items-center justify-between'>
+                  <div className='flex flex-col gap-1.5'>
+                    <Label htmlFor={`${props.key}-h`}>Hue</Label>
+                    <Input
+                      id={`${props.key}-h`}
+                      name={`${props.key}-h`}
+                      type='number'
+                      value={props.value.h}
+                      min={0}
+                      max={360}
+                      onChange={(e) => {
+                        const value = props.value;
+                        props.onChange({
+                          h: Number(e.target.value),
+                          s: value.s,
+                          l: value.l,
+                        });
+                      }}
+                    />
+                  </div>
+                  <div className='flex flex-col gap-1.5'>
+                    <Label htmlFor={`${props.key}-s`}>Saturation</Label>
+                    <Input
+                      id={`${props.key}-s`}
+                      name={`${props.key}-s`}
+                      type='number'
+                      value={props.value.s}
+                      min={0}
+                      max={100}
+                      onChange={(e) => {
+                        const value = props.value;
+                        props.onChange({
+                          h: value.h,
+                          s: Number(e.target.value),
+                          l: value.l,
+                        });
+                      }}
+                    />
+                  </div>
+                  <div className='flex flex-col gap-1.5'>
+                    <Label htmlFor={`${props.key}-l`}>Lightness</Label>
+                    <Input
+                      id={`${props.key}-l`}
+                      name={`${props.key}-l`}
+                      type='number'
+                      value={props.value.l}
+                      min={0}
+                      max={100}
+                      onChange={(e) => {
+                        const value = props.value;
+                        props.onChange({
+                          h: value.h,
+                          s: value.s,
+                          l: Number(e.target.value),
+                        });
+                      }}
+                    />
+                  </div>
+                </div>
+              </PopoverContent>
+            </Popover>
+          </>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/src/app/[...rest]/deploy/@form.site-config.tsx b/src/app/[...rest]/deploy/@form.site-config.tsx
index 36f2e46..84d5f57 100644
--- a/src/app/[...rest]/deploy/@form.site-config.tsx
+++ b/src/app/[...rest]/deploy/@form.site-config.tsx
@@ -22,7 +22,7 @@ import { parseConfigFile } from "~/utils/parseConfigFile";
 
 import config from "~/config/gIndex.config";
 
-import ConfigInput from "./@form.input";
+import ConfigInput from "./@form.input-config";
 
 type Props = {
   state: {
diff --git a/src/app/[...rest]/deploy/@form.theme.tsx b/src/app/[...rest]/deploy/@form.theme.tsx
new file mode 100644
index 0000000..97cd3cd
--- /dev/null
+++ b/src/app/[...rest]/deploy/@form.theme.tsx
@@ -0,0 +1,235 @@
+"use client";
+
+import { z } from "zod";
+import { Schema_Theme, ThemeKeys } from "~/schema";
+
+import { Input } from "~/components/ui/input";
+import { Separator } from "~/components/ui/separator";
+import { Slider } from "~/components/ui/slider";
+
+import { parseThemeValue } from "~/utils/parseConfigFile";
+
+import ThemeInput from "./@form.input-theme";
+
+type Props = {
+  currentTheme: "light" | "dark";
+  state: {
+    get: {
+      light: z.input<typeof Schema_Theme>;
+      dark: z.input<typeof Schema_Theme>;
+    };
+    set: (theme: "light" | "dark", key: ThemeKeys, value: string) => void;
+  };
+};
+export default function ThemeForm({
+  currentTheme,
+  state: { get, set },
+}: Props) {
+  return (
+    <div className='flex flex-col gap-1.5'>
+      <ThemeInput
+        key='background'
+        title='Background'
+        value={parseThemeValue(get[currentTheme].background)}
+        onChange={(val) => {
+          set(currentTheme, "background", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='foreground'
+        title='Text'
+        value={parseThemeValue(get[currentTheme].foreground)}
+        onChange={(val) => {
+          set(currentTheme, "foreground", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+
+      <Separator className='my-1.5' />
+
+      <ThemeInput
+        key='card'
+        title='Card'
+        value={parseThemeValue(get[currentTheme].card)}
+        onChange={(val) => {
+          set(currentTheme, "card", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='card-foreground'
+        title='Card Text'
+        value={parseThemeValue(get[currentTheme]["card-foreground"])}
+        onChange={(val) => {
+          set(currentTheme, "card-foreground", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+
+      <ThemeInput
+        key='popover'
+        title='Popover'
+        value={parseThemeValue(get[currentTheme].popover)}
+        onChange={(val) => {
+          set(currentTheme, "popover", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='popover-foreground'
+        title='Popover Text'
+        value={parseThemeValue(get[currentTheme]["popover-foreground"])}
+        onChange={(val) => {
+          set(currentTheme, "popover-foreground", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+
+      <Separator className='my-1.5' />
+
+      <ThemeInput
+        key='primary'
+        title='Primary'
+        value={parseThemeValue(get[currentTheme].primary)}
+        onChange={(val) => {
+          set(currentTheme, "primary", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='primary-foreground'
+        title='Primary Text'
+        value={parseThemeValue(get[currentTheme]["primary-foreground"])}
+        onChange={(val) => {
+          set(currentTheme, "primary-foreground", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='secondary'
+        title='Secondary'
+        value={parseThemeValue(get[currentTheme].secondary)}
+        onChange={(val) => {
+          set(currentTheme, "secondary", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='secondary-foreground'
+        title='Secondary Text'
+        value={parseThemeValue(get[currentTheme]["secondary-foreground"])}
+        onChange={(val) => {
+          set(
+            currentTheme,
+            "secondary-foreground",
+            `${val.h} ${val.s} ${val.l}`,
+          );
+        }}
+      />
+      <ThemeInput
+        key='accent'
+        title='Accent'
+        value={parseThemeValue(get[currentTheme].accent)}
+        onChange={(val) => {
+          set(currentTheme, "accent", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='accent-foreground'
+        title='Accent Text'
+        value={parseThemeValue(get[currentTheme]["accent-foreground"])}
+        onChange={(val) => {
+          set(currentTheme, "accent-foreground", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='muted'
+        title='Muted'
+        value={parseThemeValue(get[currentTheme].muted)}
+        onChange={(val) => {
+          set(currentTheme, "muted", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='muted-foreground'
+        title='Muted Text'
+        value={parseThemeValue(get[currentTheme]["muted-foreground"])}
+        onChange={(val) => {
+          set(currentTheme, "muted-foreground", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='destructive'
+        title='Destructive'
+        value={parseThemeValue(get[currentTheme].destructive)}
+        onChange={(val) => {
+          set(currentTheme, "destructive", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='destructive-foreground'
+        title='Destructive Text'
+        value={parseThemeValue(get[currentTheme]["destructive-foreground"])}
+        onChange={(val) => {
+          set(
+            currentTheme,
+            "destructive-foreground",
+            `${val.h} ${val.s} ${val.l}`,
+          );
+        }}
+      />
+
+      <Separator className='my-1.5' />
+
+      <ThemeInput
+        key='border'
+        title='Element Border'
+        value={parseThemeValue(get[currentTheme].border)}
+        onChange={(val) => {
+          set(currentTheme, "border", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='input'
+        title='Input Border'
+        value={parseThemeValue(get[currentTheme].input)}
+        onChange={(val) => {
+          set(currentTheme, "input", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='ring'
+        title='Focus Ring'
+        value={parseThemeValue(get[currentTheme].ring)}
+        onChange={(val) => {
+          set(currentTheme, "ring", `${val.h} ${val.s} ${val.l}`);
+        }}
+      />
+      <ThemeInput
+        key='radius'
+        title='Roundness'
+        value={{ h: 0, s: 0, l: 0 }}
+        onChange={(val) => {}}
+      >
+        <div className='flex w-full items-center gap-3'>
+          <Slider
+            className='w-full'
+            defaultValue={[parseFloat(get[currentTheme].radius) * 16 || 0]}
+            min={0}
+            max={24}
+            value={[parseFloat(get[currentTheme].radius) * 16 || 0]}
+            onValueChange={(val) => {
+              const value = val[0] / 16;
+              set("light", "radius", `${value}rem`);
+              set("dark", "radius", `${value}rem`);
+            }}
+          />
+          <Input
+            value={parseFloat(get[currentTheme].radius) * 16 || 0}
+            onChange={(e) => {
+              const value = parseFloat(e.currentTarget.value) / 16;
+              set("light", "radius", `${value}rem`);
+              set("dark", "radius", `${value}rem`);
+            }}
+            type='number'
+            className='w-16 min-w-0 '
+            min={0}
+            max={24}
+          />
+        </div>
+      </ThemeInput>
+    </div>
+  );
+}
diff --git a/src/app/[...rest]/deploy/@theme-preview.tsx b/src/app/[...rest]/deploy/@theme-preview.tsx
new file mode 100644
index 0000000..ea8e9ea
--- /dev/null
+++ b/src/app/[...rest]/deploy/@theme-preview.tsx
@@ -0,0 +1,369 @@
+"use client";
+
+import nProgress from "nprogress";
+import { CSSProperties, PropsWithChildren } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+import { Schema_Theme } from "~/schema";
+
+import FileGrid from "~/app/@file.grid";
+import FileList from "~/app/@file.list";
+import { Button } from "~/components/ui/button";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from "~/components/ui/card";
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "~/components/ui/dialog";
+import {
+  Drawer,
+  DrawerClose,
+  DrawerContent,
+  DrawerDescription,
+  DrawerFooter,
+  DrawerHeader,
+  DrawerTitle,
+  DrawerTrigger,
+} from "~/components/ui/drawer";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "~/components/ui/dropdown-menu";
+import { Input } from "~/components/ui/input";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "~/components/ui/popover";
+import { Separator } from "~/components/ui/separator";
+import {
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetDescription,
+  SheetFooter,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger,
+} from "~/components/ui/sheet";
+import { Textarea } from "~/components/ui/textarea";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "~/components/ui/tooltip";
+
+type Props = {
+  theme: z.input<typeof Schema_Theme>;
+};
+export default function ThemePreview({ theme }: Props) {
+  return (
+    <div
+      className='flex flex-col gap-3 rounded-[var(--radius)] border border-border bg-background p-3 text-foreground'
+      style={
+        {
+          "--background": theme.background,
+          "--foreground": theme.foreground,
+          "--card": theme.card,
+          "--card-foreground": theme["card-foreground"],
+          "--popover": theme.popover,
+          "--popover-foreground": theme["popover-foreground"],
+          "--primary": theme.primary,
+          "--primary-foreground": theme["primary-foreground"],
+          "--secondary": theme.secondary,
+          "--secondary-foreground": theme["secondary-foreground"],
+          "--muted": theme.muted,
+          "--muted-foreground": theme["muted-foreground"],
+          "--accent": theme.accent,
+          "--accent-foreground": theme["accent-foreground"],
+          "--destructive": theme.destructive,
+          "--destructive-foreground": theme["destructive-foreground"],
+          "--border": theme.border,
+          "--input": theme.input,
+          "--ring": theme.ring,
+          "--radius": theme.radius,
+        } as CSSProperties
+      }
+    >
+      <Wrapper title='Button'>
+        <Button
+          size={"sm"}
+          variant={"default"}
+        >
+          Default
+        </Button>
+        <Button
+          size={"sm"}
+          variant={"secondary"}
+        >
+          Secondary
+        </Button>
+        <Button
+          size={"sm"}
+          variant={"destructive"}
+        >
+          Destructive
+        </Button>
+        <Button
+          size={"sm"}
+          variant={"outline"}
+        >
+          Outline
+        </Button>
+        <Button
+          size={"sm"}
+          variant={"ghost"}
+        >
+          Ghost
+        </Button>
+        <Button
+          size={"sm"}
+          variant={"link"}
+        >
+          Link
+        </Button>
+      </Wrapper>
+
+      <Wrapper title='Card'>
+        <Card className='w-full'>
+          <CardHeader>
+            <CardTitle>Title</CardTitle>
+            <CardDescription>Description</CardDescription>
+            <Separator />
+          </CardHeader>
+          <CardContent>Content</CardContent>
+          <CardFooter>Footer</CardFooter>
+        </Card>
+      </Wrapper>
+
+      <Wrapper title='Input'>
+        <Input placeholder='Input' />
+        <Textarea placeholder='Textarea' />
+      </Wrapper>
+
+      <Wrapper title='Popover'>
+        <Tooltip>
+          <TooltipTrigger>
+            <Button
+              size={"sm"}
+              variant={"outline"}
+            >
+              Hover me
+            </Button>
+          </TooltipTrigger>
+          <TooltipContent>
+            <p>Tooltip content</p>
+          </TooltipContent>
+        </Tooltip>
+
+        <Popover>
+          <PopoverTrigger>
+            <Button
+              size={"sm"}
+              variant={"outline"}
+            >
+              Click me
+            </Button>
+          </PopoverTrigger>
+          <PopoverContent>
+            <p>Popover content</p>
+          </PopoverContent>
+        </Popover>
+
+        <DropdownMenu>
+          <DropdownMenuTrigger>
+            <Button
+              size={"sm"}
+              variant={"outline"}
+            >
+              Click me
+            </Button>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent>
+            <DropdownMenuItem>Item 1</DropdownMenuItem>
+            <DropdownMenuItem>Item 2</DropdownMenuItem>
+            <DropdownMenuItem disabled>Item 3</DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+
+        <Button
+          size={"sm"}
+          variant={"outline"}
+          onClick={async () => {
+            toast.loading("Loading...", {
+              duration: 3000,
+            });
+            toast.success("Success", {
+              duration: 3000,
+            });
+            toast.error("Error", {
+              duration: 3000,
+            });
+          }}
+        >
+          Show toast
+        </Button>
+      </Wrapper>
+
+      <Wrapper title='Overlay'>
+        <Dialog>
+          <DialogTrigger>
+            <Button
+              size={"sm"}
+              variant={"outline"}
+            >
+              Open Dialog
+            </Button>
+          </DialogTrigger>
+          <DialogContent>
+            <DialogHeader>
+              <DialogTitle>Title</DialogTitle>
+              <DialogDescription>Description</DialogDescription>
+              <Separator />
+            </DialogHeader>
+            <div>Content</div>
+            <DialogFooter>
+              <DialogClose>
+                <Button
+                  size={"sm"}
+                  variant={"secondary"}
+                >
+                  Close
+                </Button>
+              </DialogClose>
+            </DialogFooter>
+          </DialogContent>
+        </Dialog>
+
+        <Drawer>
+          <DrawerTrigger>
+            <Button
+              size={"sm"}
+              variant={"outline"}
+            >
+              Open Drawer
+            </Button>
+          </DrawerTrigger>
+          <DrawerContent>
+            <DrawerHeader>
+              <DrawerTitle>Title</DrawerTitle>
+              <DrawerDescription>Description</DrawerDescription>
+              <Separator />
+            </DrawerHeader>
+            <div className='p-6'>Content</div>
+            <DrawerFooter>
+              <DrawerClose>
+                <Button
+                  size={"sm"}
+                  variant={"secondary"}
+                  className='w-full'
+                >
+                  Close
+                </Button>
+              </DrawerClose>
+            </DrawerFooter>
+          </DrawerContent>
+        </Drawer>
+
+        <Sheet>
+          <SheetTrigger>
+            <Button
+              size={"sm"}
+              variant={"outline"}
+            >
+              Open Sheet
+            </Button>
+          </SheetTrigger>
+          <SheetContent>
+            <SheetHeader>
+              <SheetTitle>Title</SheetTitle>
+              <SheetDescription>Description</SheetDescription>
+              <Separator />
+            </SheetHeader>
+            <div>Content</div>
+            <SheetFooter>
+              <SheetClose>
+                <Button
+                  size={"sm"}
+                  variant={"secondary"}
+                  className='w-full'
+                >
+                  Close
+                </Button>
+              </SheetClose>
+            </SheetFooter>
+          </SheetContent>
+        </Sheet>
+
+        <Button
+          size={"sm"}
+          variant={"outline"}
+          onClick={async () => {
+            nProgress.start();
+            await new Promise((resolve) => setTimeout(resolve, 1500));
+            nProgress.done();
+          }}
+        >
+          Test Loading
+        </Button>
+      </Wrapper>
+
+      <Wrapper title='File'>
+        <div className='flex w-full flex-col gap-3'>
+          <FileList
+            data={{
+              encryptedId: "encryptedId",
+              name: "File Name",
+              modifiedTime: "2022-01-01T00:00:00Z",
+              mimeType: "text/plain",
+              trashed: false,
+              size: 1024 * 1024 * 100,
+            }}
+            disabled
+          />
+          <div className='grid w-full'>
+            <FileGrid
+              data={{
+                encryptedId: "encryptedId",
+                name: "File Name",
+                modifiedTime: "2022-01-01T00:00:00Z",
+                mimeType: "text/plain",
+                trashed: false,
+                size: 1024 * 1024 * 100,
+              }}
+              disabled
+            />
+          </div>
+        </div>
+      </Wrapper>
+    </div>
+  );
+}
+
+type WrapperProps = {
+  title: string;
+};
+function Wrapper({ title, children }: PropsWithChildren<WrapperProps>) {
+  return (
+    <div className='flex w-full flex-col gap-1.5'>
+      <h2 className='text-lg font-semibold'>{title}</h2>
+      <div className={"flex w-full flex-wrap items-center gap-1.5"}>
+        {children}
+      </div>
+    </div>
+  );
+}
diff --git a/src/app/[...rest]/deploy/docs.tsx b/src/app/[...rest]/deploy/docs.tsx
index 8af2eab..97ab982 100644
--- a/src/app/[...rest]/deploy/docs.tsx
+++ b/src/app/[...rest]/deploy/docs.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import Link from "next/link";
 import { useEffect, useState } from "react";
 import toast from "react-hot-toast";
 import { z } from "zod";
@@ -9,6 +10,8 @@ import {
   ConfigurationKeys,
   ConfigurationValue,
   Schema_App_Configuration,
+  Schema_Theme,
+  ThemeKeys,
 } from "~/schema";
 import { cn } from "~/utils";
 
@@ -16,15 +19,29 @@ import Markdown from "~/app/@markdown";
 import Icon from "~/components/Icon";
 import { Button } from "~/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "~/components/ui/dialog";
 import { Separator } from "~/components/ui/separator";
+import { Textarea } from "~/components/ui/textarea";
 
 import { encryptData } from "~/utils/encryptionHelper/hash";
+import { parseThemeValue } from "~/utils/parseConfigFile";
 
 import config from "~/config/gIndex.config";
 
 import ApiConfig from "./@form.api-config";
 import EnvironmentConfig from "./@form.env-config";
 import SiteConfig from "./@form.site-config";
+import ThemeForm from "./@form.theme";
+import ThemePreview from "./@theme-preview";
 
 export const getting_started = `Welcome to the deployment guide! This guide will help you to deploy the application to Vercel or similar services.
 
@@ -198,6 +215,23 @@ const initialConfiguration: z.input<typeof Schema_App_Configuration> = {
   },
 };
 
+function downloadBlob(blob: Blob, filename: string) {
+  const url = URL.createObjectURL(blob);
+  const anchor = document.createElement("a");
+  anchor.href = url;
+  anchor.download = filename;
+
+  const afterClick = () => {
+    setTimeout(() => {
+      URL.revokeObjectURL(url);
+      removeEventListener("click", afterClick);
+    }, 100);
+  };
+  anchor.addEventListener("click", afterClick, false);
+
+  anchor.click();
+}
+
 export function Configuration() {
   const [loading, setLoading] = useState<boolean>(true);
   const [configuration, setConfiguration] =
@@ -282,23 +316,6 @@ export function Configuration() {
         );
       }
 
-      function downloadBlob(blob: Blob, filename: string) {
-        const url = URL.createObjectURL(blob);
-        const anchor = document.createElement("a");
-        anchor.href = url;
-        anchor.download = filename;
-
-        const afterClick = () => {
-          setTimeout(() => {
-            URL.revokeObjectURL(url);
-            removeEventListener("click", afterClick);
-          }, 100);
-        };
-        anchor.addEventListener("click", afterClick, false);
-
-        anchor.click();
-      }
-
       let envContent = Object.entries(configuration.environment)
         .map(([key, value]) => `${key}=${value}`)
         .join("\n");
@@ -750,29 +767,589 @@ If you're migrating from previous version, you can load your old environment and
 }
 
 export function CustomizeTheme() {
-  const [colors, setColors] = useState({
-    primary: { h: 200, s: 50, l: 50 },
-    secondary: { h: 200, s: 50, l: 50 },
+  const [initialTheme] = useState<{
+    light: z.input<typeof Schema_Theme>;
+    dark: z.input<typeof Schema_Theme>;
+  }>({
+    light: {
+      "background": "0 0% 100%",
+      "foreground": "0 0% 3.9%",
+      "card": "0 0% 100%",
+      "card-foreground": "0 0% 3.9%",
+      "popover": "0 0% 100%",
+      "popover-foreground": "0 0% 3.9%",
+      "primary": "0 0% 9%",
+      "primary-foreground": "0 0% 98%",
+      "secondary": "0 0% 96.1%",
+      "secondary-foreground": "0 0% 9%",
+      "muted": "0 0% 96.1%",
+      "muted-foreground": "0 0% 45.1%",
+      "accent": "0 0% 96.1%",
+      "accent-foreground": "0 0% 9%",
+      "destructive": "0 84.2% 60.2%",
+      "destructive-foreground": "0 0% 98%",
+      "border": "0 0% 89.8%",
+      "input": "0 0% 89.8%",
+      "ring": "0 0% 89.8%",
+      "radius": "0.5rem",
+    },
+    dark: {
+      "background": "0 0% 3.9%",
+      "foreground": "0 0% 98%",
+      "card": "0 0% 3.9%",
+      "card-foreground": "0 0% 98%",
+      "popover": "0 0% 3.9%",
+      "popover-foreground": "0 0% 98%",
+      "primary": "0 0% 98%",
+      "primary-foreground": "0 0% 9%",
+      "secondary": "0 0% 14.9%",
+      "secondary-foreground": "0 0% 98%",
+      "muted": "0 0% 14.9%",
+      "muted-foreground": "0 0% 63.9%",
+      "accent": "0 0% 14.9%",
+      "accent-foreground": "0 0% 98%",
+      "destructive": "0 62.8% 30.6%",
+      "destructive-foreground": "0 0% 98%",
+      "border": "0 0% 14.9%",
+      "input": "0 0% 14.9%",
+      "ring": "0 0% 14.9%",
+      "radius": "0.5rem",
+    },
   });
+  const [currentTheme, setCurrentTheme] = useState<"light" | "dark">("light");
+  const [theme, setTheme] = useState<{
+    light: z.input<typeof Schema_Theme>;
+    dark: z.input<typeof Schema_Theme>;
+  }>(initialTheme);
+
+  const [dialog, setDialog] = useState<boolean>(false);
+  const [cssLoading, setCssLoading] = useState<boolean>(false);
+
+  function onThemeChange(
+    theme: "light" | "dark",
+    key: ThemeKeys,
+    value: string,
+  ) {
+    setTheme((prev) => ({
+      ...prev,
+      [theme]: {
+        ...prev[theme],
+        [key]: value,
+      },
+    }));
+  }
+
+  function onSelectedThemeReset(theme: "light" | "dark", key: ThemeKeys) {
+    setTheme((prev) => ({
+      ...prev,
+      [theme]: {
+        ...prev[theme],
+        [key]: initialTheme[theme][key],
+      },
+    }));
+  }
+  function onThemeReset() {
+    setTheme(initialTheme);
+  }
+  function isChanged(t: "light" | "dark", key: ThemeKeys): boolean {
+    return t === "light"
+      ? theme.light[key] !== initialTheme.light[key]
+      : theme.dark[key] !== initialTheme.dark[key];
+  }
 
   return (
     <Card>
       <CardHeader className='pb-0'>
-        <CardTitle
-          className='text-3xl'
-          id='theme'
-        >
-          Customize Theme
-        </CardTitle>
+        <div className='flex flex-col gap-3 tablet:flex-row tablet:items-center tablet:justify-between'>
+          <CardTitle
+            className='text-3xl'
+            id='theme'
+          >
+            Customize Theme
+          </CardTitle>
+
+          <div className='flex w-full items-center gap-3 tablet:w-fit'>
+            <Button
+              size='sm'
+              variant={"outline"}
+              onClick={(e) => {
+                e.preventDefault();
+
+                try {
+                  const fileInput = document.createElement("input");
+                  fileInput.type = "file";
+                  fileInput.accept = ".css";
+                  fileInput.onchange = async (fileEvent) => {
+                    const file = (fileEvent.target as HTMLInputElement)
+                      .files?.[0];
+                    if (!file) return toast.error("No file selected");
+                    const fileName = file.name;
+                    if (fileName !== "globals.css")
+                      return toast.error("Please select globals.css file");
+
+                    const reader = new FileReader();
+                    reader.onload = async (read) => {
+                      const result = read.target?.result as string;
+                      if (!result) return toast.error("Failed to read file");
+                      const themeRegex =
+                        /\/\* Shadcn\/ui theme \*\/.*?\:root \{(.*?)\}.*?.dark \{(.*?) \}/gm;
+                      const themeMatch = themeRegex.exec(
+                        result.replace(/\r\n/g, ""),
+                      );
+                      if (!themeMatch)
+                        return toast.error(
+                          "Can't find theme, are you sure it's the right file?",
+                        );
+                      const lightTheme = themeMatch[1]
+                        .replace(/\s{2,4}/g, "\n")
+                        .split("\n")
+                        .map((v) => v.trim())
+                        .filter(
+                          (v) =>
+                            v.length &&
+                            (v.startsWith("/*") && v.endsWith("*/")
+                              ? false
+                              : true),
+                        );
+                      const darkTheme = themeMatch[2]
+                        .replace(/\s{2,4}/g, "\n")
+                        .split("\n")
+                        .map((v) => v.trim())
+                        .filter(
+                          (v) =>
+                            v.length &&
+                            (v.startsWith("/*") && v.endsWith("*/")
+                              ? false
+                              : true),
+                        );
+
+                      // Loop through the theme and set it
+                      for (const key in lightTheme) {
+                        const [k, v] = lightTheme[key]
+                          .split(":")
+                          .map((v) => v.replace("--", "").trim());
+                        const hslRegex = /\d\s\d.*?\%\s\d.*?\%;/g;
+                        if (hslRegex.test(v)) {
+                          const color = parseThemeValue(v);
+                          onThemeChange(
+                            "light",
+                            k as ThemeKeys,
+                            `${color.h} ${color.s}% ${color.l}%`,
+                          );
+                        } else {
+                          onThemeChange("light", k as ThemeKeys, v);
+                        }
+                      }
+                      for (const key in darkTheme) {
+                        const [k, v] = darkTheme[key]
+                          .split(":")
+                          .map((v) => v.replace("--", "").trim());
+                        const hslRegex = /\d\s\d.*?\%\s\d.*?\%;/g;
+                        if (hslRegex.test(v)) {
+                          const color = parseThemeValue(v);
+                          onThemeChange(
+                            "dark",
+                            k as ThemeKeys,
+                            `${color.h} ${color.s}% ${color.l}%`,
+                          );
+                        } else {
+                          onThemeChange("dark", k as ThemeKeys, v);
+                        }
+                      }
+
+                      fileInput.value = "";
+                      toast.success("Theme loaded successfully");
+                    };
+                    reader.readAsText(file);
+                  };
+                  fileInput.click();
+                } catch (error) {
+                  const e = error as Error;
+                  console.error(e);
+                  toast.error(e.message);
+                }
+              }}
+            >
+              Load CSS
+            </Button>
+            <Dialog
+              open={dialog}
+              onOpenChange={setDialog}
+            >
+              <DialogTrigger>
+                <Button
+                  size='sm'
+                  variant={"outline"}
+                >
+                  Paste Code
+                </Button>
+              </DialogTrigger>
+              <DialogContent>
+                <DialogHeader>
+                  <DialogTitle>Paste Theme</DialogTitle>
+                  <DialogDescription>
+                    Paste the CSS code from your theme file
+                    <br />
+                    <Link
+                      href={"https://ui.shadcn.com/themes"}
+                      target='_blank'
+                      className='text-blue-600 opacity-80 transition-all duration-300 hover:opacity-100 dark:text-blue-400'
+                    >
+                      Get themes from shadcn/ui
+                    </Link>
+                  </DialogDescription>
+                </DialogHeader>
+                <form
+                  className='space-y-3'
+                  onSubmit={(e) => {
+                    e.preventDefault();
+                    setCssLoading(true);
+
+                    try {
+                      const formData = new FormData(
+                        e.target as HTMLFormElement,
+                      );
+                      const css = formData.get("css-paste") as string;
+                      if (!css) throw new Error("No CSS code provided");
+
+                      const flatten = css.trim().replace(/\n/g, "");
+                      const themeRegex =
+                        /\@layer base.*?\:root \{(.*?)\}.*?.dark \{(.*?) \}/gm;
+                      const themeMatch = themeRegex.exec(
+                        flatten.replace(/\r\n/g, ""),
+                      );
+                      if (!themeMatch)
+                        throw new Error(
+                          "Unknown format, please refer to shadcn/ui theme",
+                        );
+
+                      const lightTheme = themeMatch[1]
+                        .replace(/\s{2,4}/g, "\n")
+                        .split("\n")
+                        .map((v) => v.trim())
+                        .filter(
+                          (v) =>
+                            v.length &&
+                            (v.startsWith("/*") && v.endsWith("*/")
+                              ? false
+                              : true),
+                        );
+                      const darkTheme = themeMatch[2]
+                        .replace(/\s{2,4}/g, "\n")
+                        .split("\n")
+                        .map((v) => v.trim())
+                        .filter(
+                          (v) =>
+                            v.length &&
+                            (v.startsWith("/*") && v.endsWith("*/")
+                              ? false
+                              : true),
+                        );
+
+                      for (const key in lightTheme) {
+                        const [k, v] = lightTheme[key]
+                          .split(":")
+                          .map((v) => v.replace("--", "").trim());
+                        const color = parseThemeValue(v);
+                        const hslRegex = /\d\s\d.*?\%\s\d.*?\%;/g;
+                        if (hslRegex.test(v)) {
+                          const color = parseThemeValue(v);
+                          onThemeChange(
+                            "light",
+                            k as ThemeKeys,
+                            `${color.h} ${color.s}% ${color.l}%`,
+                          );
+                        } else {
+                          onThemeChange("light", k as ThemeKeys, v);
+                        }
+                      }
+                      for (const key in darkTheme) {
+                        const [k, v] = darkTheme[key]
+                          .split(":")
+                          .map((v) => v.replace("--", "").trim());
+                        const color = parseThemeValue(v);
+                        const hslRegex = /\d\s\d.*?\%\s\d.*?\%;/g;
+                        if (hslRegex.test(v)) {
+                          const color = parseThemeValue(v);
+                          onThemeChange(
+                            "dark",
+                            k as ThemeKeys,
+                            `${color.h} ${color.s}% ${color.l}%`,
+                          );
+                        } else {
+                          onThemeChange("dark", k as ThemeKeys, v);
+                        }
+                      }
+
+                      toast.success("Theme loaded successfully");
+                      setDialog(false);
+                    } catch (error) {
+                      const e = error as Error;
+                      console.error(e);
+                      toast.error(e.message);
+                    } finally {
+                      setCssLoading(false);
+                    }
+                  }}
+                >
+                  <Textarea
+                    id='css-paste'
+                    name='css-paste'
+                    className='w-full'
+                    rows={10}
+                    placeholder='Please refer to shadcn/ui theme for the theme code'
+                  />
+                  <DialogFooter>
+                    <DialogClose asChild>
+                      <Button
+                        size={"sm"}
+                        variant={"destructive"}
+                        type='reset'
+                      >
+                        Cancel
+                      </Button>
+                    </DialogClose>
+                    <Button
+                      size={"sm"}
+                      disabled={cssLoading}
+                      type='submit'
+                    >
+                      <div className='relative flex w-full items-center justify-center'>
+                        <span className='relative transition-all duration-300 ease-in-out'>
+                          Load Theme
+                        </span>
+                        <Icon
+                          name='LoaderCircle'
+                          className={cn(
+                            "animate-spin transition-all",
+                            cssLoading
+                              ? "ml-1.5 size-4 opacity-100"
+                              : "ml-0 size-0 opacity-0",
+                          )}
+                        />
+                      </div>
+                    </Button>
+                  </DialogFooter>
+                </form>
+              </DialogContent>
+            </Dialog>
+            <Button
+              size='sm'
+              variant={"destructive"}
+              onClick={onThemeReset}
+            >
+              Reset All
+            </Button>
+          </div>
+        </div>
         <Separator />
       </CardHeader>
       <CardContent>
-        <Markdown
-          content={`#### Under Construction
+        <div className='grid grid-cols-1 gap-6 py-3 tablet:grid-cols-2'>
+          <div className='col-span-full flex w-full items-center'>
+            <Button
+              size='sm'
+              variant={currentTheme === "light" ? "default" : "outline"}
+              onClick={() => setCurrentTheme("light")}
+              className='w-full rounded-r-none'
+            >
+              Light Theme
+            </Button>
+            <Button
+              size='sm'
+              variant={currentTheme === "dark" ? "default" : "outline"}
+              onClick={() => setCurrentTheme("dark")}
+              className='w-full rounded-l-none'
+            >
+              Dark Theme
+            </Button>
+          </div>
+          <div className='flex flex-col gap-3'>
+            <ThemeForm
+              currentTheme={currentTheme}
+              state={{
+                get: theme,
+                set: onThemeChange,
+              }}
+            />
+            <Button
+              size={"sm"}
+              variant={"secondary"}
+              onClick={(e) => {
+                e.preventDefault();
+                const otherTheme = currentTheme === "light" ? "dark" : "light";
+                setTheme((prev) => ({
+                  ...prev,
+                  [otherTheme]: {
+                    ...prev[currentTheme],
+                    radius: "0.5rem",
+                  },
+                }));
+                toast.success(
+                  `${currentTheme
+                    .slice(0, 1)
+                    .toUpperCase()}${currentTheme.slice(
+                    1,
+                  )} theme copied to ${otherTheme} theme`,
+                );
+              }}
+            >
+              Copy to {currentTheme === "light" ? "Dark" : "Light"} Theme
+            </Button>
+          </div>
 
-While I'm working on the theme customization, you can check [shadcn UI theme](https://ui.shadcn.com/themes) for now`}
-          view='markdown'
-        />
+          <ThemePreview
+            theme={currentTheme === "light" ? theme.light : theme.dark}
+          />
+
+          <Separator className='col-span-full' />
+
+          <div className='col-span-full flex w-full flex-col items-end justify-center gap-1.5'>
+            <div className='flex items-center gap-3'>
+              <Button
+                variant={"outline"}
+                size={"sm"}
+                onClick={async (e) => {
+                  try {
+                    const style = `@layer base {
+  :root {
+  ${Object.entries(theme.light)
+    .map(([key, value]) => `  --${key}: ${value};`.replace(";;", ";"))
+    .join("\n")}
+  }
+
+  .dark {
+  ${Object.entries(theme.dark)
+    .map(([key, value]) => `    --${key}: ${value};`.replace(";;", ";"))
+    .join("\n")}
+  }
+}`;
+
+                    await navigator.clipboard.writeText(style);
+                    toast.success("CSS code copied to clipboard");
+                  } catch (error) {
+                    const e = error as Error;
+                    console.error(e);
+                    toast.error(e.message);
+                  }
+                }}
+              >
+                Copy CSS Code
+              </Button>
+              <Button
+                size={"sm"}
+                onClick={(e) => {
+                  e.preventDefault();
+                  toast.loading("Creating CSS file...", {
+                    id: "download-css",
+                  });
+                  try {
+                    const css = `@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* Shadcn/ui theme */
+@layer base {
+  :root {
+  ${Object.entries(theme.light)
+    .map(([key, value]) => `  --${key}: ${value};`.replace(";;", ";"))
+    .join("\n")}
+  }
+
+  .dark {
+  ${Object.entries(theme.dark)
+    .map(([key, value]) => `    --${key}: ${value};`.replace(";;", ";"))
+    .join("\n")}
+  }
+}
+
+html,
+body {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+@layer base {
+  :root {
+    /* @apply text-[14px] tablet:text-[16px]; */
+    @apply text-[100%];
+  }
+  * {
+    @apply border-border;
+    /* @apply outline outline-1 outline-red-500; */
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+
+  ::-webkit-scrollbar {
+    @apply h-1.5 w-1.5;
+  }
+  ::-webkit-scrollbar-track {
+    @apply bg-primary/5;
+  }
+  ::-webkit-scrollbar-thumb {
+    @apply rounded-full bg-primary/25 hover:bg-primary/50;
+  }
+
+  /* Typography */
+  h1 {
+    @apply scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl;
+  }
+  h2 {
+    @apply scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0;
+  }
+  h3 {
+    @apply scroll-m-20 text-2xl font-semibold tracking-tight;
+  }
+  h4 {
+    @apply scroll-m-20 text-xl font-semibold tracking-tight;
+  }
+  .paragraph {
+    @apply leading-7 [&:not(:first-child)]:mt-6;
+  }
+  blockquote {
+    @apply mt-6 border-l-2 pl-6 italic;
+  }
+  ul {
+    @apply my-6 ml-6 list-disc [&>li]:mt-2;
+  }
+  .lead {
+    @apply text-xl text-muted-foreground;
+  }
+  .large {
+    @apply text-lg font-semibold;
+  }
+  .muted {
+    @apply text-sm text-muted-foreground;
+  }
+  small {
+    @apply text-sm font-medium leading-none;
+  }
+}`;
+                    const blob = new Blob([css], { type: "text/css" });
+                    downloadBlob(blob, "globals.css");
+                    toast.success("CSS downloaded successfully", {
+                      id: "download-css",
+                    });
+                  } catch (error) {
+                    const e = error as Error;
+                    console.error(e);
+                    toast.error(e.message, {
+                      id: "download-css",
+                    });
+                  }
+                }}
+              >
+                Download CSS
+              </Button>
+            </div>
+            <span className='text-sm text-muted-foreground'>
+              It is recommended to use "Copy CSS Code" button to copy the CSS
+              code
+            </span>
+          </div>
+        </div>
       </CardContent>
     </Card>
   );
diff --git a/src/components/ui/slider.tsx b/src/components/ui/slider.tsx
new file mode 100644
index 0000000..adddd98
--- /dev/null
+++ b/src/components/ui/slider.tsx
@@ -0,0 +1,28 @@
+"use client"
+
+import * as React from "react"
+import * as SliderPrimitive from "@radix-ui/react-slider"
+
+import { cn } from "~/utils"
+
+const Slider = React.forwardRef<
+  React.ElementRef<typeof SliderPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root>
+>(({ className, ...props }, ref) => (
+  <SliderPrimitive.Root
+    ref={ref}
+    className={cn(
+      "relative flex w-full touch-none select-none items-center",
+      className
+    )}
+    {...props}
+  >
+    <SliderPrimitive.Track className="relative h-2 w-full grow overflow-hidden rounded-full bg-secondary">
+      <SliderPrimitive.Range className="absolute h-full bg-primary" />
+    </SliderPrimitive.Track>
+    <SliderPrimitive.Thumb className="block h-5 w-5 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" />
+  </SliderPrimitive.Root>
+))
+Slider.displayName = SliderPrimitive.Root.displayName
+
+export { Slider }
diff --git a/src/schema.ts b/src/schema.ts
index c626c4f..eeb3ef3 100644
--- a/src/schema.ts
+++ b/src/schema.ts
@@ -236,3 +236,4 @@ export const Schema_Theme = z.object({
   "ring": z.string(),
   "radius": z.string(),
 });
+export type ThemeKeys = keyof z.infer<typeof Schema_Theme>;
diff --git a/src/utils/parseConfigFile.ts b/src/utils/parseConfigFile.ts
index 6d5906e..01edba9 100644
--- a/src/utils/parseConfigFile.ts
+++ b/src/utils/parseConfigFile.ts
@@ -1,4 +1,5 @@
 // Used for configuration on deploy guide page
+import { HslColor } from "react-colorful";
 import { z } from "zod";
 import {
   Schema_Config,
@@ -77,3 +78,12 @@ export function parseConfigFile(config: string):
     return { success: false, message: e.message };
   }
 }
+
+export function parseThemeValue(color: string): HslColor {
+  const [h, s, l] = color.split(" ");
+  return {
+    h: parseFloat(h),
+    s: parseFloat(s),
+    l: parseFloat(l),
+  };
+}

From e0bb4c38c7e1bb188c3c67037aca89a874e8e6d6 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 9 May 2024 19:48:51 +0700
Subject: [PATCH 12/20] Fix symbols not escaped

---
 src/app/[...rest]/deploy/docs.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/[...rest]/deploy/docs.tsx b/src/app/[...rest]/deploy/docs.tsx
index 97ab982..aba7041 100644
--- a/src/app/[...rest]/deploy/docs.tsx
+++ b/src/app/[...rest]/deploy/docs.tsx
@@ -1345,8 +1345,8 @@ body {
               </Button>
             </div>
             <span className='text-sm text-muted-foreground'>
-              It is recommended to use "Copy CSS Code" button to copy the CSS
-              code
+              It is recommended to use &apos;Copy CSS Code&apos; button to copy
+              the CSS code
             </span>
           </div>
         </div>

From 722690ac4dd0cab8df53b2e229808aea8380ef1d Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Thu, 16 May 2024 01:02:01 +0700
Subject: [PATCH 13/20] Fix showing wrong content

---
 src/app/actions.ts | 177 +++++++++++++++++++--------------------------
 1 file changed, 76 insertions(+), 101 deletions(-)

diff --git a/src/app/actions.ts b/src/app/actions.ts
index 18461be..f5081b7 100644
--- a/src/app/actions.ts
+++ b/src/app/actions.ts
@@ -4,14 +4,14 @@ import crypto from "crypto";
 import { revalidatePath } from "next/cache";
 import { cookies } from "next/headers";
 import { z } from "zod";
-import { Schema_File } from "~/schema";
 
-import { decryptData, encryptData } from "~/utils/encryptionHelper/hash";
+import { decryptData, encryptData } from "~/utils/encryptionHelper";
 import gdrive, { gdriveNoCache } from "~/utils/gdriveInstance";
 
 import { Constant } from "~/types/constant";
+import { Schema_File } from "~/types/schema";
 
-import config from "~/config/gIndex.config";
+import config from "config";
 
 export async function CheckSitePassword(): Promise<{
   success: boolean;
@@ -36,9 +36,7 @@ export async function CheckSitePassword(): Promise<{
     const password = store.get(Constant.cookies_SitePassword)?.value || "";
     const decryptedPassword = await decryptData(password);
     if (decryptedPassword !== process.env.SITE_PASSWORD)
-      throw new Error(
-        "Saved password is incorrect, please re-enter the password",
-      );
+      throw new Error("Saved password is incorrect, please re-enter the password");
 
     return {
       success: true,
@@ -156,32 +154,58 @@ export async function CheckPaths(paths: string[]): Promise<
 
     const data = await Promise.all(promises);
     const notFoundIndex = data.findIndex((item) => !item);
-    if (notFoundIndex !== -1)
-      throw new Error(`Path not found: ${paths[notFoundIndex]}`);
+    if (notFoundIndex !== -1) throw new Error(`Path not found: ${paths[notFoundIndex]}`);
 
     // Check if each path is valid
     let valid = true;
     let invalidPath: string | undefined;
     const decryptedRootId = await decryptData(config.apiConfig.rootFolder);
-    for (const [index, path] of data.entries()) {
+    const dataWithIndex = data.map((item, index) => {
+      return {
+        ...item,
+        index: index,
+      };
+    });
+    const filteredPaths: { path: string; data: { id: string; parents: string; mimeType: string }[] }[] = [];
+
+    for (const item of dataWithIndex) {
       if (!valid) break;
 
-      if (index === 0) {
-        if (
-          path?.data[0].parents === decryptedRootId ||
-          path?.data[0].parents === decryptedSharedDrive
-        )
-          break;
-      } else {
-        if (path?.data[0].parents === data[index - 1]?.data[0].id) break;
+      // Loop through data
+      // If the current index is 0, check if the parents is the root folder or shared drive
+      // If the current index is not 0, check if the parents is the previous data id from the filteredPaths
+
+      // Use filteredPaths because it will only contain the valid path
+      // So if filteredPaths length is not equal to paths length, then it means there is an invalid path
+      for (const path of item.data || []) {
+        if (item.index === 0) {
+          if (path.parents === decryptedRootId || path.parents === decryptedSharedDrive) {
+            filteredPaths.push({
+              path: item.path!,
+              data: [{ id: path.id!, parents: path.parents!, mimeType: path.mimeType! }],
+            });
+            break;
+          }
+        } else {
+          if (path.parents === filteredPaths[item.index - 1]?.data?.[0].id) {
+            filteredPaths.push({
+              path: item.path!,
+              data: [{ id: path.id!, parents: path.parents!, mimeType: path.mimeType! }],
+            });
+            break;
+          }
+        }
       }
-      valid = false;
-      invalidPath = data[index]?.path;
     }
+    if (filteredPaths.length !== paths.length) {
+      valid = false;
+      invalidPath = dataWithIndex[filteredPaths.length]?.path;
+    }
+
     if (!valid) throw new Error(`Invalid path: ${invalidPath}`);
 
     const ids: { path: string; id: string }[] = [];
-    for (const item of data) {
+    for (const item of filteredPaths) {
       if (item) {
         const encryptedId = await encryptData(item.data[0].id as string);
         ids.push({
@@ -203,9 +227,7 @@ export async function CheckPaths(paths: string[]): Promise<
     };
   }
 }
-export async function CheckPassword(
-  paths: { path: string; id: string }[],
-): Promise<
+export async function CheckPassword(paths: { path: string; id: string }[]): Promise<
   | {
       success: false;
       message?: string;
@@ -250,21 +272,15 @@ export async function CheckPassword(
     // To save processing time, skip if password file not found
     if (!password.files?.length) return { success: true };
 
-    const protectedFolder = password.files
-      .filter((file) => ids.includes(file.parents?.[0] as string))
-      ?.shift(); // Shift to get only the nearest folder
+    const protectedFolder = password.files.filter((file) => ids.includes(file.parents?.[0] as string))?.shift(); // Shift to get only the nearest folder
 
     // To save processing time, skip if all of the paths are not protected
     if (!protectedFolder) return { success: true };
 
     const store = cookies();
-    const folderIndex = ids.findIndex(
-      (item) => item === protectedFolder.parents?.[0],
-    );
+    const folderIndex = ids.findIndex((item) => item === protectedFolder.parents?.[0]);
 
-    const cookiesValue = JSON.parse(
-      store.get(Constant.cookies_FolderPassword)?.value || "{}",
-    );
+    const cookiesValue = JSON.parse(store.get(Constant.cookies_FolderPassword)?.value || "{}");
     const currentFolder = paths[folderIndex];
     if (!cookiesValue[currentFolder.id])
       throw {
@@ -321,9 +337,7 @@ export async function SetPassword(
 }> {
   try {
     const store = cookies();
-    const cookiesValue = JSON.parse(
-      store.get(Constant.cookies_FolderPassword)?.value || "{}",
-    );
+    const cookiesValue = JSON.parse(store.get(Constant.cookies_FolderPassword)?.value || "{}");
     const updatedValue = {
       ...cookiesValue,
       [path]: await encryptData(password),
@@ -352,13 +366,7 @@ export async function SetPassword(
   }
 }
 
-export async function GetFiles({
-  id,
-  pageToken,
-}: {
-  id?: string;
-  pageToken?: string;
-}): Promise<{
+export async function GetFiles({ id, pageToken }: { id?: string; pageToken?: string }): Promise<{
   files: z.infer<typeof Schema_File>[];
   nextPageToken?: string;
 }> {
@@ -372,14 +380,10 @@ export async function GetFiles({
       decryptedSharedDrive = await decryptData(config.apiConfig.sharedDrive);
     }
 
-    const filterName = config.apiConfig.hiddenFiles
-      .map((item) => `not name = '${item}'`)
-      .join(" and ");
-    const query: string = [
-      ...config.apiConfig.defaultQuery,
-      `'${decryptedId}' in parents`,
-      `${filterName}`,
-    ].join(" and ");
+    const filterName = config.apiConfig.hiddenFiles.map((item) => `not name = '${item}'`).join(" and ");
+    const query: string = [...config.apiConfig.defaultQuery, `'${decryptedId}' in parents`, `${filterName}`].join(
+      " and ",
+    );
 
     const data = await gdrive.files.list({
       q: query,
@@ -396,21 +400,16 @@ export async function GetFiles({
     });
 
     const encryptedData: z.infer<typeof Schema_File>[] = [];
-    if (!data.data.files?.length)
-      return { files: [], nextPageToken: undefined };
+    if (!data.data.files?.length) return { files: [], nextPageToken: undefined };
     for (const file of data.data.files) {
       encryptedData.push({
         mimeType: file.mimeType as string,
         encryptedId: await encryptData(file.id as string),
         name: file.name as string,
         trashed: (file.trashed as boolean) ?? false,
-        modifiedTime: new Date(
-          file.modifiedTime as string,
-        ).toLocaleDateString(),
+        modifiedTime: new Date(file.modifiedTime as string).toLocaleDateString(),
         fileExtension: file.fileExtension || undefined,
-        encryptedWebContentLink: file.webContentLink
-          ? await encryptData(file.webContentLink)
-          : undefined,
+        encryptedWebContentLink: file.webContentLink ? await encryptData(file.webContentLink) : undefined,
         size: file.size ? Number(file.size) : undefined,
         thumbnailLink: file.thumbnailLink || undefined,
         imageMediaMetadata: file.imageMediaMetadata
@@ -441,9 +440,7 @@ export async function GetFiles({
     throw new Error(e.message);
   }
 }
-export async function GetFile(
-  encryptedId: string,
-): Promise<z.infer<typeof Schema_File>> {
+export async function GetFile(encryptedId: string): Promise<z.infer<typeof Schema_File>> {
   try {
     const decryptedId = await decryptData(encryptedId);
     const { data: file } = await gdrive.files.get({
@@ -459,9 +456,7 @@ export async function GetFile(
       trashed: (file.trashed as boolean) ?? false,
       modifiedTime: new Date(file.modifiedTime as string).toLocaleDateString(),
       fileExtension: file.fileExtension || undefined,
-      encryptedWebContentLink: file.webContentLink
-        ? await encryptData(file.webContentLink)
-        : undefined,
+      encryptedWebContentLink: file.webContentLink ? await encryptData(file.webContentLink) : undefined,
       size: file.size ? Number(file.size) : undefined,
       thumbnailLink: file.thumbnailLink || undefined,
       imageMediaMetadata: file.imageMediaMetadata
@@ -504,9 +499,7 @@ export async function SearchFile(
     const query: string[] = [
       ...config.apiConfig.defaultQuery,
       `name contains '${keyword}'`,
-      config.apiConfig.hiddenFiles
-        .map((item) => `not name = '${item}'`)
-        .join(" and "),
+      config.apiConfig.hiddenFiles.map((item) => `not name = '${item}'`).join(" and "),
     ];
     const data = await gdrive.files.list({
       q: query.join(" and "),
@@ -522,21 +515,16 @@ export async function SearchFile(
       }),
     });
     const encryptedData: z.infer<typeof Schema_File>[] = [];
-    if (!data.data.files?.length)
-      return { files: [], nextPageToken: undefined };
+    if (!data.data.files?.length) return { files: [], nextPageToken: undefined };
     for (const file of data.data.files) {
       encryptedData.push({
         mimeType: file.mimeType as string,
         encryptedId: await encryptData(file.id as string),
         name: file.name as string,
         trashed: (file.trashed as boolean) ?? false,
-        modifiedTime: new Date(
-          file.modifiedTime as string,
-        ).toLocaleDateString(),
+        modifiedTime: new Date(file.modifiedTime as string).toLocaleDateString(),
         fileExtension: file.fileExtension || undefined,
-        encryptedWebContentLink: file.webContentLink
-          ? await encryptData(file.webContentLink)
-          : undefined,
+        encryptedWebContentLink: file.webContentLink ? await encryptData(file.webContentLink) : undefined,
         size: file.size ? Number(file.size) : undefined,
         thumbnailLink: file.thumbnailLink || undefined,
         imageMediaMetadata: file.imageMediaMetadata
@@ -611,8 +599,7 @@ export async function GetContent(encryptedId: string): Promise<string> {
       },
     );
 
-    if (typeof file !== "string")
-      throw new Error("It seems the file is not a text file");
+    if (typeof file !== "string") throw new Error("It seems the file is not a text file");
 
     return file as string;
   } catch (error) {
@@ -621,9 +608,7 @@ export async function GetContent(encryptedId: string): Promise<string> {
     throw new Error(e.message);
   }
 }
-export async function GetReadme(
-  encryptedId: string | undefined,
-): Promise<string | null> {
+export async function GetReadme(encryptedId: string | undefined): Promise<string | null> {
   try {
     let decryptedId;
     if (encryptedId) decryptedId = await decryptData(encryptedId);
@@ -653,6 +638,8 @@ export async function GetReadme(
         corpora: "drive",
       }),
     });
+
+    console.log(data.files?.length);
     if (!data.files?.length) return null;
 
     let file;
@@ -663,16 +650,15 @@ export async function GetReadme(
       // Check by mimetype, use google-apps.shortcut last
       file = data.files.find((item) => item.mimeType === "text/markdown");
       if (!file) {
-        file = data.files.find(
-          (item) => item.mimeType === "application/vnd.google-apps.shortcut",
-        );
+        file = data.files.find((item) => item.mimeType === "application/vnd.google-apps.shortcut");
       }
     }
 
     if (!file) return null;
     if (
       file.mimeType !== "text/markdown" &&
-      file.mimeType !== "application/vnd.google-apps.shortcut"
+      file.mimeType !== "application/vnd.google-apps.shortcut" &&
+      file.mimeType !== "text/plain"
     )
       return null;
 
@@ -685,8 +671,7 @@ export async function GetReadme(
         data: { shortcutDetails: { targetId: string; targetMimeType: string } };
       };
       if (!shortcutData.shortcutDetails.targetId) return null;
-      if (shortcutData.shortcutDetails.targetMimeType !== "text/markdown")
-        return null;
+      if (shortcutData.shortcutDetails.targetMimeType !== "text/markdown") return null;
 
       const { data: content } = await gdrive.files.get(
         {
@@ -720,9 +705,7 @@ export async function GetReadme(
     throw new Error(e.message);
   }
 }
-export async function GetBanner(
-  encryptedId: string | undefined,
-): Promise<string | null> {
+export async function GetBanner(encryptedId: string | undefined): Promise<string | null> {
   try {
     let decryptedId;
     if (encryptedId) decryptedId = await decryptData(encryptedId);
@@ -770,14 +753,10 @@ export async function GetWebContent(encrypted: string): Promise<string> {
     throw new Error(e.message);
   }
 }
-export async function CreateDownloadToken(
-  duration: number = config.apiConfig.temporaryTokenDuration,
-): Promise<string> {
+export async function CreateDownloadToken(duration: number = config.apiConfig.temporaryTokenDuration): Promise<string> {
   try {
     const data = {
-      expiredAt:
-        Date.now() +
-        duration * 60 * 60 * 1000 * config.apiConfig.temporaryTokenDuration,
+      expiredAt: Date.now() + duration * 60 * 60 * 1000 * config.apiConfig.temporaryTokenDuration,
     };
     const token = await encryptData(JSON.stringify(data));
     return token;
@@ -796,8 +775,7 @@ export async function CheckDownloadToken(token: string): Promise<{
     if (decryptToken.expiredAt < Date.now()) {
       return {
         success: false,
-        message:
-          "Download token expired, please click the download button again to get a new token",
+        message: "Download token expired, please click the download button again to get a new token",
       };
     }
 
@@ -824,10 +802,7 @@ export async function GenerateAESKey(): Promise<string> {
     throw new Error(e.message);
   }
 }
-export async function VerifyAESKey(
-  data: string,
-  key: string,
-): Promise<boolean> {
+export async function VerifyAESKey(data: string, key: string): Promise<boolean> {
   try {
     let paddedKey;
     if (key.length < 16) {

From a67031b11a7c38ae1ac6a4f222fa7064ce533416 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Sat, 18 May 2024 15:17:45 +0700
Subject: [PATCH 14/20] Clean up and redo Config & Theme

---
 data/mockFiles.ts                             |   70 -
 public/fonts/Exo2-Bold.ttf                    |  Bin 126804 -> 0 bytes
 public/fonts/Exo2-Regular.ttf                 |  Bin 126624 -> 0 bytes
 public/images/setup/google-cloud-1.png        |  Bin 60601 -> 0 bytes
 public/next.svg                               |    1 -
 public/setup/googleCloud.md                   |    0
 public/vercel.svg                             |    1 -
 src/app/@explorer.tsx                         |  189 ---
 src/app/@file.grid.tsx                        |  342 -----
 src/app/@file.list.tsx                        |  330 ----
 src/app/@header.breadcrumb.tsx                |  185 ---
 src/app/@header.title.tsx                     |   26 -
 src/app/@header.tsx                           |   44 -
 src/app/@not-found.tsx                        |   45 -
 src/app/@preview.audio.tsx                    |  132 --
 src/app/@preview.image.tsx                    |  130 --
 src/app/@preview.layout.tsx                   |  107 --
 src/app/@preview.rich.tsx                     |  128 --
 src/app/@preview.unknown.tsx                  |   52 -
 src/app/@preview.video.tsx                    |  130 --
 src/app/@readme.tsx                           |   38 -
 src/app/@rich-header.tsx                      |   53 -
 src/app/[...rest]/deploy/@form.api-config.tsx |  533 -------
 src/app/[...rest]/deploy/@form.env-config.tsx |  359 -----
 .../[...rest]/deploy/@form.input-config.tsx   |  120 --
 .../[...rest]/deploy/@form.input-theme.tsx    |  181 ---
 .../[...rest]/deploy/@form.site-config.tsx    |  418 -----
 src/app/[...rest]/deploy/@form.theme.tsx      |  235 ---
 src/app/[...rest]/deploy/@theme-preview.tsx   |  369 -----
 src/app/[...rest]/deploy/docs.tsx             | 1356 -----------------
 src/app/[...rest]/deploy/index.tsx            |  198 +--
 src/app/[...rest]/page.tsx                    |  121 +-
 src/app/api/download/[encryptedId]/route.ts   |   33 +-
 src/app/api/internal/encrypt/route.ts         |    8 +-
 src/app/api/og/[encryptedId]/route.ts         |    9 +-
 src/app/api/raw/[...rest]/route.ts            |   36 +-
 src/app/api/stream/[encryptedId]/helper.ts    |   24 -
 src/app/api/stream/[encryptedId]/route.ts     |   33 +-
 src/app/api/thumb/[encryptedId]/route.ts      |   20 +-
 src/app/error.tsx                             |   30 +-
 src/app/globals.css                           |    5 +
 src/app/layout.tsx                            |   36 +-
 src/app/loading.tsx                           |   20 +-
 src/app/not-found.tsx                         |    6 +-
 src/app/page.tsx                              |   48 +-
 .../Explorer/Actions.tsx}                     |  374 ++---
 src/components/Explorer/FilePath.tsx          |  156 ++
 src/components/Explorer/Grid.tsx              |  270 ++++
 src/components/Explorer/Layout.tsx            |  130 ++
 src/components/Explorer/List.tsx              |  260 ++++
 src/components/Explorer/Readme.tsx            |   63 +
 src/components/Explorer/index.tsx             |    6 +
 src/components/Global/ButtonLoading.tsx       |   46 +
 .../{Icon/index.tsx => Global/Icon.tsx}       |    0
 src/components/Global/Loader.tsx              |   30 +
 .../Global/Markdown.tsx}                      |  122 +-
 src/components/Global/Status.tsx              |   31 +
 src/components/Global/index.tsx               |    5 +
 .../Guide/Configuration/ApiForm.tsx           |  342 +++++
 .../Guide/Configuration/EnvironmentForm.tsx   |  232 +++
 src/components/Guide/Configuration/Header.tsx |   62 +
 src/components/Guide/Configuration/Input.tsx  |  232 +++
 src/components/Guide/Configuration/Layout.tsx |  300 ++++
 .../Guide/Configuration/SiteForm.tsx          |  226 +++
 src/components/Guide/Configuration/index.tsx  |    9 +
 src/components/Guide/Theme/FormInputs.tsx     |  201 +++
 src/components/Guide/Theme/Input.tsx          |  207 +++
 src/components/Guide/Theme/Layout.tsx         |  427 ++++++
 src/components/Guide/Theme/Preview.tsx        |  304 ++++
 src/components/Guide/Theme/index.tsx          |    5 +
 src/components/Guide/index.tsx                |    2 +
 .../Layout/Footer.tsx}                        |    2 +-
 .../Layout/Navbar.tsx}                        |  122 +-
 src/components/Layout/NotFound.tsx            |   37 +
 .../Layout/Password.tsx}                      |   61 +-
 src/components/Layout/ResponsiveDropdown.tsx  |  222 +++
 .../Layout/ThemeProvider.tsx}                 |   13 +-
 src/components/Layout/ToTop.tsx               |   47 +
 src/components/Layout/index.tsx               |    6 +
 src/components/Preview/Audio.tsx              |   98 ++
 .../Preview/Document.tsx}                     |  161 +-
 src/components/Preview/Image.tsx              |  106 ++
 .../Preview/Information.tsx}                  |  182 +--
 src/components/Preview/Layout.tsx             |  119 ++
 .../Preview/Manga.tsx}                        |  183 +--
 src/components/Preview/Rich.tsx               |   92 ++
 src/components/Preview/Unknown.tsx            |   18 +
 src/components/Preview/Video.tsx              |   96 ++
 src/components/Preview/index.tsx              |   10 +
 src/components/ui/alert.tsx                   |   63 +-
 src/components/ui/breadcrumb.tsx              |  138 +-
 src/components/ui/button.tsx                  |   35 +-
 src/components/ui/card.tsx                    |  124 +-
 src/components/ui/carousel.tsx                |  328 ++--
 src/components/ui/dialog.tsx                  |   95 +-
 src/components/ui/drawer.tsx                  |   84 +-
 src/components/ui/dropdown-menu.tsx           |  122 +-
 src/components/ui/input.tsx                   |   39 +-
 src/components/ui/label.tsx                   |   23 +-
 src/components/ui/menubar.tsx                 |  170 +--
 src/components/ui/popover.tsx                 |   24 +-
 src/components/ui/progress.tsx                |   21 +-
 src/components/ui/select.tsx                  |   87 +-
 src/components/ui/separator.tsx               |   39 +-
 src/components/ui/sheet.tsx                   |   94 +-
 src/components/ui/skeleton.tsx                |   11 +-
 src/components/ui/slider.tsx                  |   25 +-
 src/components/ui/table.tsx                   |  191 ++-
 src/components/ui/tabs.tsx                    |   30 +-
 src/components/ui/textarea.tsx                |   37 +-
 src/components/ui/toast.tsx                   |   80 +-
 src/components/ui/tooltip.tsx                 |   22 +-
 src/config/gIndex.config.ts                   |   34 +-
 src/data/docs/getting-started.ts              |    9 +
 src/data/docs/index.ts                        |    4 +
 src/data/docs/migration.ts                    |   22 +
 src/data/docs/new-user.ts                     |   81 +
 src/data/docs/shared-drive.ts                 |   16 +
 src/data/template/configuration.ts            |  339 +++++
 src/data/template/index.ts                    |    2 +
 src/data/template/theme.ts                    |   96 ++
 src/hooks/useLoading.ts                       |   23 +
 src/hooks/useLocalStorage.ts                  |    2 +
 src/hooks/useMediaQuery.ts                    |    2 +
 src/styles/globals.css                        |   39 -
 src/styles/highlight.css                      |  472 ------
 src/styles/markdown.css                       |  107 --
 src/{ => types}/schema.ts                     |    2 +-
 src/utils/bytesFormat.ts                      |    2 +-
 src/{utils.ts => utils/cn.ts}                 |    0
 src/utils/downloadBlob.ts                     |   17 +
 .../hash.ts => encryptionHelper.ts}           |    0
 src/utils/fileLoadHelper.ts                   |   40 +
 src/utils/footerFormatter.ts                  |   12 +-
 src/utils/gdriveInstance.ts                   |   10 -
 src/utils/isDev.ts                            |    4 +-
 src/utils/parseConfigFile.ts                  |   17 +-
 src/utils/previewHelper.ts                    |   31 +-
 138 files changed, 6530 insertions(+), 8553 deletions(-)
 delete mode 100644 data/mockFiles.ts
 delete mode 100644 public/fonts/Exo2-Bold.ttf
 delete mode 100644 public/fonts/Exo2-Regular.ttf
 delete mode 100644 public/images/setup/google-cloud-1.png
 delete mode 100644 public/next.svg
 delete mode 100644 public/setup/googleCloud.md
 delete mode 100644 public/vercel.svg
 delete mode 100644 src/app/@explorer.tsx
 delete mode 100644 src/app/@file.grid.tsx
 delete mode 100644 src/app/@file.list.tsx
 delete mode 100644 src/app/@header.breadcrumb.tsx
 delete mode 100644 src/app/@header.title.tsx
 delete mode 100644 src/app/@header.tsx
 delete mode 100644 src/app/@not-found.tsx
 delete mode 100644 src/app/@preview.audio.tsx
 delete mode 100644 src/app/@preview.image.tsx
 delete mode 100644 src/app/@preview.layout.tsx
 delete mode 100644 src/app/@preview.rich.tsx
 delete mode 100644 src/app/@preview.unknown.tsx
 delete mode 100644 src/app/@preview.video.tsx
 delete mode 100644 src/app/@readme.tsx
 delete mode 100644 src/app/@rich-header.tsx
 delete mode 100644 src/app/[...rest]/deploy/@form.api-config.tsx
 delete mode 100644 src/app/[...rest]/deploy/@form.env-config.tsx
 delete mode 100644 src/app/[...rest]/deploy/@form.input-config.tsx
 delete mode 100644 src/app/[...rest]/deploy/@form.input-theme.tsx
 delete mode 100644 src/app/[...rest]/deploy/@form.site-config.tsx
 delete mode 100644 src/app/[...rest]/deploy/@form.theme.tsx
 delete mode 100644 src/app/[...rest]/deploy/@theme-preview.tsx
 delete mode 100644 src/app/[...rest]/deploy/docs.tsx
 delete mode 100644 src/app/api/stream/[encryptedId]/helper.ts
 rename src/{app/@header.button.tsx => components/Explorer/Actions.tsx} (56%)
 create mode 100644 src/components/Explorer/FilePath.tsx
 create mode 100644 src/components/Explorer/Grid.tsx
 create mode 100644 src/components/Explorer/Layout.tsx
 create mode 100644 src/components/Explorer/List.tsx
 create mode 100644 src/components/Explorer/Readme.tsx
 create mode 100644 src/components/Explorer/index.tsx
 create mode 100644 src/components/Global/ButtonLoading.tsx
 rename src/components/{Icon/index.tsx => Global/Icon.tsx} (100%)
 create mode 100644 src/components/Global/Loader.tsx
 rename src/{app/@markdown.tsx => components/Global/Markdown.tsx} (58%)
 create mode 100644 src/components/Global/Status.tsx
 create mode 100644 src/components/Global/index.tsx
 create mode 100644 src/components/Guide/Configuration/ApiForm.tsx
 create mode 100644 src/components/Guide/Configuration/EnvironmentForm.tsx
 create mode 100644 src/components/Guide/Configuration/Header.tsx
 create mode 100644 src/components/Guide/Configuration/Input.tsx
 create mode 100644 src/components/Guide/Configuration/Layout.tsx
 create mode 100644 src/components/Guide/Configuration/SiteForm.tsx
 create mode 100644 src/components/Guide/Configuration/index.tsx
 create mode 100644 src/components/Guide/Theme/FormInputs.tsx
 create mode 100644 src/components/Guide/Theme/Input.tsx
 create mode 100644 src/components/Guide/Theme/Layout.tsx
 create mode 100644 src/components/Guide/Theme/Preview.tsx
 create mode 100644 src/components/Guide/Theme/index.tsx
 create mode 100644 src/components/Guide/index.tsx
 rename src/{app/@footer.tsx => components/Layout/Footer.tsx} (97%)
 rename src/{app/@navbar.tsx => components/Layout/Navbar.tsx} (86%)
 create mode 100644 src/components/Layout/NotFound.tsx
 rename src/{app/@password.tsx => components/Layout/Password.tsx} (70%)
 create mode 100644 src/components/Layout/ResponsiveDropdown.tsx
 rename src/{app/theme-provider.tsx => components/Layout/ThemeProvider.tsx} (83%)
 create mode 100644 src/components/Layout/ToTop.tsx
 create mode 100644 src/components/Layout/index.tsx
 create mode 100644 src/components/Preview/Audio.tsx
 rename src/{app/@preview.doc.tsx => components/Preview/Document.tsx} (51%)
 create mode 100644 src/components/Preview/Image.tsx
 rename src/{app/@preview.action.tsx => components/Preview/Information.tsx} (75%)
 create mode 100644 src/components/Preview/Layout.tsx
 rename src/{app/@preview.manga.tsx => components/Preview/Manga.tsx} (64%)
 create mode 100644 src/components/Preview/Rich.tsx
 create mode 100644 src/components/Preview/Unknown.tsx
 create mode 100644 src/components/Preview/Video.tsx
 create mode 100644 src/components/Preview/index.tsx
 create mode 100644 src/data/docs/getting-started.ts
 create mode 100644 src/data/docs/index.ts
 create mode 100644 src/data/docs/migration.ts
 create mode 100644 src/data/docs/new-user.ts
 create mode 100644 src/data/docs/shared-drive.ts
 create mode 100644 src/data/template/configuration.ts
 create mode 100644 src/data/template/index.ts
 create mode 100644 src/data/template/theme.ts
 create mode 100644 src/hooks/useLoading.ts
 delete mode 100644 src/styles/globals.css
 delete mode 100644 src/styles/highlight.css
 delete mode 100644 src/styles/markdown.css
 rename src/{ => types}/schema.ts (99%)
 rename src/{utils.ts => utils/cn.ts} (100%)
 create mode 100644 src/utils/downloadBlob.ts
 rename src/utils/{encryptionHelper/hash.ts => encryptionHelper.ts} (100%)
 create mode 100644 src/utils/fileLoadHelper.ts

diff --git a/data/mockFiles.ts b/data/mockFiles.ts
deleted file mode 100644
index 6b435f9..0000000
--- a/data/mockFiles.ts
+++ /dev/null
@@ -1,70 +0,0 @@
-import { IGDriveFiles } from "types/api/files";
-import { APIFilesResponse } from "types/api/response";
-
-const mockFiles: APIFilesResponse = {
-  timestamp: Date.now(),
-  responseTime: 0,
-  folders: [],
-  files: [],
-  nextPageToken: "nextpageToken",
-  readmeExists: true,
-  bannerExists: true,
-  passwordExists: false,
-};
-const mockFilesProtected: APIFilesResponse = {
-  timestamp: Date.now(),
-  responseTime: 0,
-  folders: [],
-  files: [],
-  nextPageToken: "nextpageToken",
-  readmeExists: true,
-  bannerExists: true,
-  passwordExists: true,
-};
-
-for (let i = 0; i < 10; i++) {
-  const folder: IGDriveFiles = {
-    mimeType: "application/vnd.google-apps.folder",
-    encryptedId: `encryptedId${i + 1}`,
-    name: `folder${i + 1}`,
-    trashed: false,
-    modifiedTime: new Date().toISOString(),
-  };
-  const file: IGDriveFiles = {
-    mimeType: "application/vnd.google-apps.file",
-    encryptedId: `encryptedId${i + 1}`,
-    name: `file${i + 1}`,
-    trashed: false,
-    modifiedTime: new Date().toISOString(),
-    fileExtension: "txt",
-    encryptedWebContentLink: "encryptedWebContentLink",
-    size: Math.floor(Math.random() * 1000000000),
-    thumbnailLink: "/og.png",
-    imageMediaMetadata:
-      Math.random() > 0.5
-        ? {
-            width: 1920,
-            height: 1080,
-            rotation: 0,
-          }
-        : null,
-    videoMediaMetadata:
-      Math.random() > 0.5
-        ? {
-            width: 1920,
-            height: 1080,
-            durationMillis: 100000,
-          }
-        : null,
-  };
-
-  mockFiles.folders.push(folder);
-  mockFiles.files.push(file);
-
-  folder.name = `folder${i + 1}protected`;
-  file.name = `file${i + 1}protected`;
-  mockFilesProtected.folders.push(folder);
-  mockFilesProtected.files.push(file);
-}
-
-export { mockFiles, mockFilesProtected };
diff --git a/public/fonts/Exo2-Bold.ttf b/public/fonts/Exo2-Bold.ttf
deleted file mode 100644
index 8404285371700ce42124db4890a125af06f2bb88..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 126804
zcmcG131C~rwf3F4T5NgMZpqeeNtP|kwq!}(w|LEBXAeo7Js~?u90GwtX&{9HNeCna
zXxZ8Vg$7y*W#1_+bm6r;ptSE%y1llKzLr-grEHe|@645M?1b(8@Bbl@<4<#E&di)S
zbLPxB=SobHq;h;{Bx$IBVDR+UHzp;PJS<6Ucxdj}g3tH4Hb^Y>3rV{7{-Fhn`d04Q
zo0Zs~@xA5?V+$JMUtG7uB(cITpqAAO7WOXu!+-oFB(eW4$M5~?wy)XwqsU+0#rMCF
zq{6#5uGzg4csc6-5`GqJ+;-0C`&Jmghqj6(>2H78v|-Kql8WbcOVWGK;rrAk0D7bD
zE<8Vu->WxmKXdQJMQ2_pN$=y=vhi&@)~y-*=@%oC^j3u=>F?gYX75h<b?GOP^ya%L
z;5}o__6@P`jLnyr`C3Whnw>j#pZRvCD<LuK^^)ZI%g%`nJ2&YLd=cNHKaw6}Fc-9B
z_&t)0--@I%NirJ)Mj!q4S$#(QJtxAx70G;#eJeAc{_=Y!N0q;k$(un4mzuI~@j?D1
zo(-U`xXos@=yU;pD3okYrR@GvZne01BHqQ5%`wi}*X>Cp_N-gCCm!Fk))#da6*;3m
ze|=?9QDr@Ua`1-z`)?RjKKI(1R}2rWY_{2&R}KxYXtqgA!l<!@ptcY{L1S|&tq-T!
z!fUza7Sr8C7JJ<sG}o>hK-nmWbMnWhQl;0YQi+7s2g=gvR4N?f0l!YC4|j1^HN2_K
z+!VXdk#N48F&T>P?CfRCTI&gP4#ad#V?+FL$6#N0#&FXk8u{Y+CQr$O-D|6D79G=Q
zCW;I)+N;4h=r9iP6QiKF+H7{47>#h61|gM7HitrbeNv2vXkH&qrC9m=b@irL-B60L
z*yhtZ&TZAzbho*iS}KgO=tUR#LS`K^H`F$-3F=$6^Cw+{U5z6#y{2gK?BV5gMFl%$
znH%dP-a0#D8_FDhi_c#yv#o|g%#H=4unHqqBAGy!tg|J2R=p3ilQwHHf@!w?HhpO+
zJFqCTysD<8=suP{=-~Hcc9$EMmwB2T?AsSlzQi6s1N{qS-)33VM6;~->FsXWYAMA4
zhQeu^jk=aj#dtVOHM2i!Gruj^(7g!UkX$*^curSo(~9b3%F3BB+#OqNbuuHrXZM9g
zy6U#s4fXT70!4;BTD`5_?+e=sWrOUpG8#rHo_(8#Fo#JorgnWO<PWGEr3_|%1`~qw
zh@coa4KupPv8<`U8I4y*TRlZOYcyP6TU=fju4+hzHNKAF_?$%nb8^+3S?gOXs)x_u
zk84X;GiFY0UNmr8lewy`J{q@_`rK{tv^BbFtaC+|$2;ee)AwFA+X=dy7*&R`Abv!<
zdO2W5|9xThh{IQ0@Zzz%b)|;P_w@W8TeW@iCiV}bxBNT_Yb=TWv<se0N(1z)8><5x
zXjOjZS4}#p^ua9ps*EnJ9vR$fwd8*fg;>k1l}U@WKG@i7solAG<Ibq1xiJ{CT9d10
zSI3+NbD|;EWHMAl19kN#Q$t-{w5+_IKW>W-Hr5Q(Yc!g~+@`+y)z$O+n&u|(YyCh?
z<6zX5*;8nb_(D;mF&gqk?1ju%UK<XEOUuI5;aUhfCPmN>T3gNeKB$Zk&#!cvmprX$
zyZBy61m>Q*E@|=h?-;9Gl`e4Ary}(&o+7QKE)=aRDX$Gx)zkcR4#sCK3e;`okNZY1
z*|g{I>`HCv8pdp`8%770#m!ai^)(55ncqdzlV01iczY7Oj{o=p%!*mEi+Qn|19B)7
z4q$-A1SQN^`s@m`OZ(jQ2Q>w9rL5N;yy1shm-&OtmoZnS$+Or8#z1*_z?jkU%S^V+
z*}He6-hu49d@+9*D?26XB?(7MJ1^++3xL*kIFL+`s0)Pxe!mbcdMq<GYuVPu*50{2
zO&b@?Shp}*R&nX_+D5absqX!EgLNizEYh;L-&IyK>$K!C{;+3sXyzOcy<)-8sE29f
zEsU4f)nE$Q8dh3UjhSG4i$-PzB#JQ`G0a92X2YXUXV=GsT+5Aq+I~VDvjt59ZJuIZ
zx;vU^t*B^C46KZmG_Ieybzf`iJ}d!4;ZDw3&AKH^*41dVJIhK2uHV1^`T;Qp@9^{Z
zqi91&dE!@f&hv5&Qyzdc6CGYSf7gK5JFsj1*#3^5(B_^*yTj3*=v*D^@3<&*9e*@1
z_tK3UFP$6EX?AfrvT1yLQ!U%3(HTUS&|Xh=l2`KkB!}d}o`f}Kht$$pjTQ(ng`1KP
z|1vhH7h5LIXw+x^>A-)iP~UjQL`&bidEM-W%sPG_(`a`%9hsXQ&K(*po72U<);&A(
zpWDDF(hPi9(LyOnMx_OGz$&&Cs`nSk9b01s?^jk`H@}A+$!teuTJ0H5$K*eGP0yUn
ztJ_dV17!X}$b7$4Gj;4~&&$cgshn>Ngu_O*wtnUeZ*icnuez?)UuJ8Ly5qH`^0M}Y
zsnK<@_Dk5hUDi_mq|RX2fvGSxEgxFEHd1Ug3|kxhGjF=!lIv$={v|W9xr!A+o(!T7
z+rb0M?k)CiMm&yA{Q5d}UFKbO>^fz)&ir%tZdRy_E~Dq9*Ti$;nb)pW3W1j_kn&CV
zrUd;lTEspcPAB3?BWqeP%hVJrEpO^a;hzuB))wm4weYeW6?^bZG1grro|8$UVaBlh
z%mG>}SSr?l(QFMQ`R4ByIZH~thKG;8{L?=giV8}u{o{GqZ~km@7Rm))Q|9MvGaLDy
ze}>o7TlEHgv1JRWngMPwC{&q=1riERCylRGIp5R|ePzz9IUwpohjVv<Jg=JvL4?!-
zfx8UP_-JN`mVm4a1pHzAgtSg1fPuyY<Tiej3sT&9&~DmMm{^@C+F`UFa`N;QO+`y}
z1=<pAq4qRGoZr(jc`@(E%x`RD-<o`epWD)uxwWFn;lM7rtchBLMCS){EgCIoD-;&;
z2i+&GLX#L1Y7@GV%nzm)I-EsM6x$1mWX+W=3o0DN4;4F$i)9%*%j6f+c01c*Z*f+p
zD>K{p=kROhtM(SRyS0j40?vzp^Y(%B%+uGSvTxX@$X*gf?6mn4v>GSo&z~6ddIu-w
zCuun*o9UB38JKtZrcIa63*>*EQ@e2m)?@9a@f90u(H8Y<HrBpZs;05b3qI`j>3Cd~
zb|-}0=$bPc>Q7%1J8gE#Ah%!8Ra0*^*Vl~ix0lt<ToT9PuUUKAX=}p;#U;Ag%+y#H
zZ8UTF46TOcR=<pOWy<xgQmUgi^YSLQFOoQbtTlf`KL<S?^bh@{pWYc)Ev#8~RqNvB
zj*5zo=8x&`q`T5ryx-Or<PUyC&$poGHKa}EdrrHx-5!9ZL;E$Y4pkE&RZ@t*vE{px
zj<&cd>@Vo}YO*lk>0i<9kl(9mFq<1{R$f?vkvJ`R4SzJabgXeCs?*B0y6RW{)$e4S
z?J!2eHFZYLx1SghCe>#D&a3$oQlp@Qdao!#HoKkXBPWYb=$NF42{kB^*xPD|p4D0v
zt}ys&zPO;Ls$=bt|MT+<?Mu4sHT9+vm*c=#pR02Xf1=2^fpNLSX%Bcy>Z(?cwvR^5
zg{EyxW(Idvh0CaKbgi7zF$*dHmyF<v5%4-m9-)gvVkX%+*Rjo$&nd!W?_PWXIsTTA
zP*y6HKNuJjSj0kSOd9$2=Cjvr{(Q@I_Lhc*v>i)+&E^YQTQAtmZpy6b9dWxydf81>
z6WZZ>(V`i@K*A`?E1|AozV}hB%W}Z#(mZzK=QV}0Q!dn=4@&l$Dk@C;OPNx0*leyb
zvp1<O2V}$js4FqGuDq&nYTa~d$gf?J7xMkPWViJSi$|U#>tr+6;it!P7{BlO^02Jo
zX0$&WB|dL;$#bA+Sh$uC<!CXpr|k7MTg;Z}HY=2QZSks#q@8`o>U3H&qZNsYie?-8
z9qEe(^!Z%Ssa4Kq4DwVq`^*qvG9zia{hJS5f9K7a-`srX_4nVw_S}HcyE}6uTg&FE
zKYzP&B`OiR(K^&rLNmu80~6pIA^p-agcD!)`r$v{bY@|()}Sjc*gc3{BNJh-WGql7
zW0p+j;>>f51gaE5W!0!Bx8pE73yYbj*+294%)NK8Oop>}GA7>3GEHn^g7-{Jp#5s-
zD4czO*=s=iBtvL7gmA*1ORL7N*JJa=wkb{$)>2vM!Z@fUSZ~+j`m?MCUo14yQChun
z<sIzRN_&;Z+1X()45Wr*^~1Gu2iXU{v4PCPTg#pgc(t0fdV~JQ3z*YZ;i$CLRQ8nB
z*SWo2u|#_xjYT_Xsl}@HNwtC&W%-aebMtgwc@tEH?byBSX6)L#*DkUqSI%<w5B1p3
zGRGQC{)nk89Pp)lMb3`?FED*!DLcwOIQ!Dp)k9%zVVPl(u25#Iaz;nG(@|v~tcp6G
zy4m0DF3IfI^RJ>=oEP6_zr~2CS{p6tsXFr%was7I(_2|yGvcamw%eQQ%j0cTr8TF=
z$G0~&oxwiPmK3jGyrMIe?yBIjW~He-F|lgZ1Wr&Ka^r1Yfxfy(LxGl~NRCsQp|g5W
z=qG8&jpQG2)HL{0)t->a7<4&9p^75+>cLg>A`98BJ!R!O>`@=M{r!e=TTgd;r@hE-
z9I0*n(go{w#Gab$UtYxeOFZ4ai>a4kv~NT&!8e$7t4$a1;qaSEPV4Nn^FiqR?QC#y
z<}d%{H?wdo5;NJ74gL*@QrFDU>Xo|_%{$o#ix&3JSm1I7Ds5fuT{E0o-SX0MeR^W)
z8l}(B=h$)n0xS|Z{SvR)^{Qr<vV&98tjN^fX)9S7av${!Kae@Fl)u2WnpN)L<f}a0
z&>#N&nsF^zh$^zZycN`!L9g*hV@hp#wO_Gs&>@F9)Er9d^<f6ZBqx$-`e?g?z)0Km
zCsab(ki#%N;MiZWctd@3<Ko2|>+3fyO4rt=(=|2!Rj|K0^WMzTqVmf7M|+wlR*i0G
zx7(79Bgq<vr^J$sHKwd(0nb;$QDcFNec<hHO=D~CZ)q9uE_VfkZg()~8tpdD&Ae4o
z;Kv!gV5q-mz**)`M?Ce_WlpQp<fyRN9fgGzHnXWvW7PPY;$RIfb>PDbPAOGRPeNr;
zRwpbaVjVzEu%idAw!6Ij@sjk!K~|_M1<zlaImG&Xj*7}Tjftm@hX*T4GW$>um%1Qz
ze$JnRtjO7w(s8VC2<~LEIq~9=EzxLCG|Jw{nAjWtR-dfLAEHCfc1SPt=OO!S;8@x-
z$V8GfPJQ@gPixJ5f7Rx?y571v)DWp()Nkzx4cD_*ejQEK*Qc;u%c4hhpd_!C>QNQx
zrS^cF4x6XzrOthYRfYI-)vb42dn+p_&=(y2<!<)Iouy8lM(ZvAcV_#=zhr(L=p()K
z%ly&I{$<O+-JMv&{bI}{vn=#du@NVYFEF>O##kJUmCqREk52y1;aIOL)DCv@846u;
z8eCP59)<-^se>*0s<qoO)Ils4QX7R-pdsMjnlX5!!fo=_x(gatWLnG0j<T-4fkTy5
zMqiz$uxXrqFgSze!c%Fmnddh&l&r-}us2Eu`U&+q3vCvl>Rf|@Qe}mx?NBp%(K;sj
zXa!BQKDpz#vG~L^JDdyZ8*?>dwjjlLP^^%g96M=ss5SthhlW?|Y--xMVtiLTzH2-b
zHJPFz@yR|&Osrlx5sy!-Ts@K4=Irb2=yN#wIy(ED#F^PX9%Jt-GK{2%qDO>tb|<Pi
zw~G+%IBn>0+F<)u%#AGQO0EtXeCdEUWGt_Cc~gF~rF-_RrKMU(u%qmKh^(FU?m(ZR
z%+}l0+3RrF`zvcJikFpTo+x(rde7!}(r87{z8!t^N-%hmE=nhCWkqA<=Y$t2TQqXX
zP%0f}F2@XP6lWV78ccy&qd#8V>MyZ(jYL*1uqIdEee@_etPFy?u&i*2u26%0qQ7fq
zyVKI+Y;f<ppkr-+(5su=e$?ONDxv<P)vuy`tyo72bC5)%*-G4P!W!IA8VSs9Gc<3B
zvo~^+eyPQ>Al3*T4QBtr{)VSx`BN@ND<n1mMRgS042>mBH$ssm;Y4EV-RgyNJ%+|L
zv2d-?9oW~^5nDgzId{ZhYU%SOQWk&k{Dx+0WCglWpc`k5Y0AvDvO-UJcXwBxLstw)
zYcko&3q2(@Z8eF`D)hvJ^>PV68+->XE_aesR*bAAxjgA`^^}{Mn@uxjG3Lo!zM7w%
z30K-_?F{#__b(-}%%xW7los}e!o8vvng!}dl1$e)WItc&_H@=4r#7VzvVY%WEQN@8
z#N)I(<~77FV-p$Eno@QF236>kG1T;NI%VwZI)`ze(V_eL4a;=~ZHcZ(w-j|H%gyF;
z_T$WtZ858@-p0s0iPbF0eW>gIR;TPcS5sx)X>rRbS)(b2UYU~JmL29Q&AC_iYjnIs
z)&r@suC}=3q+B2uYqXkv(9&wMIxNg)jacy~^Jk00YGTi3p0q?P_`}Q=hr^nA!%}0l
zhOMk8uT$28&b&^k$5AF7z!sSfYe}c{U-9K*S6%YkORl`;%U7^P*Rwa?oSb}<{ysH6
zPOCwmZQ%4g?TOGNOXV=wkj&|6b3kb0V9iii=JnqxuIpXiRn*yU_7oa*<9}XBCbx!a
zqf`5J&|Msy)!`{vSe}Xw*t+ekC-bB^WL|42XFr03B&ql(wDD0|X3IA-|NTw&WTuBb
zk{MxNVwu<2>8G<VZQKaj5|Bo(!4j4r>kcFZEmT;HbLtKh)%-s}?Fq|F8rldgU#((V
zP#6+Q!XoeDdQ-8#rq){9WHCmn*`=8s*mlcms+(8(N?m;m+Geh(?U>!&?Cw3C&9^zb
zjK-#h^1h)`{<vJY5i6pkrlz{4e4VK_5~?+_s>%hvT2uA>!Lb$CiAHC2j#L*vmbt#N
zVlCLazvJ!eXm+5x$i+f;@#Ih2s`k>wu_t_lGGi!jPMb@{Lhi%NJH)OxwRPD_)`VPF
zdI#^Hj4tKh=Niqbs_^8Wcr-Q`EIw7y(TY|d%xO#kj6U)3)TS^tv^>$g-FiZm5*G+l
zwsfWgA(qlHG|hZNeEEleUdpnL+3vB3`!ERm(vi*4Xm>Pv5<#zEQU6}6Tji~p{4I|+
z4u^kF3PFAw$B1O#)-(#*Vjn?QFi!G#>ckl#-Nc55+b5yxoise99dj0rc`BVjV{u)5
zdC#n)0ne45p}QuNr;e0HubcdLr(>m<ANCLCtId-r^g~AUNKZ-El3Y$>U&6*j$5N;_
zsl-8--R=s}$F+7>BmKk&h81@j+oi|w3}zb7*l9B(L7w)9v4#?tx@@e(R^CydW3?~_
z*sJh#Pq-)LH2FFMv6Rc6&BE%=q^H^UFi-swV|9{F>Sqji8)|+ohZhKZpg;l+wMy<p
zizv_9K{0;v^Y9bT;a-vK+e6YX#QuU)x|wv3^vS(>uKY;ZZ0dyHZMVCb_otb6nBk}Y
zZg)4hZ8m(MXIz?tI)B3-fMlV1jQT*>h!e-OQTa{Tp0ediJ$Q~kka_E0{)LrJ{&va`
zamk%cV)ai-Rl@3GE0y)QwxSCryEqnNsmiAi$Y$}%+Ng)i(dI;V%CB|B5;K~%ZS^<f
zHen9Y=%)|nPmXmoMJxOs#`$_}p<bRn7VSy43?}~F?rL(`Z1}LFCtgg{>(E>k3P|Gs
z5rGieP36?FF8SoHG1K-ffdra6n>*_iO5(jqzqYC&F{6g6uBH$E+^o51F+G$Jl-L6v
zm{->63iO)EpG_GA%y2lnoGq7a*ySWTRgguQ4sYNsHq*FtmT$P-c+G(WvaPq~#jkF@
zZI`RJ@lQW^_CJZk%y@E0c@hE{3`PfRXi4E}JaCP%eb_f^scdWb&u4$|r^a5_uG=<$
z^+hsYOSAD@n=A<n0hT$8?YJx@eukwz!P@4TO!ICI)YS!KY1};7Y99AT<-!1&=Oizl
zELEPQVIjjY?m=KRZpP0i{n4oZW_ntd>H;7BGf+2f=FghP@ti+9k0oS-kaSi$|KqY$
z4_hCdsjNCWiPB*y3F=89VGU6)GuGGE#?0R6oYnP36&9<lpnkP1Ew2b&Q=9hciv#h%
zzXt8g4W7ZKH!AGK1*`Q2hwHxh04b-SavqB-t(j987%`+UwiAcy!bu$B&{8_a(`YqN
zJ-RwtfYs?Jimo25_cBu~5~(*bZ#}Fso`Lv%E{8$Cx}exz@kZ02$FSTU{8zMHtoNpC
zuL)I9Yi-ic*m@R&Ovm**tRw4T+m68)!z3yDHTD?R3ceAxlgBbM1Wr%9Gv$eQGX1$H
z@Qv&_@r~@6tjvAW#2%Nv&3`8DFcisyWr9JB+p)(4R##eztflD!Eel~g!nNz;mdf_(
z_NEG>yTw}@ue5-gI(DCQ2Y*)7psd!Z^61=?YT(aWE8Bu?aeKMD#aG)@X~k**4Q!R5
z0fu+;sZ=DO575YdJY82gEsPae%2FRs>B)qnT~N-J3d+$goeT1^H0e*0EDcP7a^jWM
zivFbZIt+-_an+~w?&Qv5yb{?7=^p9m$H?ysD=n<pQkEZbo8zd>)fw(;c9=Zv{#e3g
z1Kp^Bt&#Sl2GA|`)KWfW3jo=6a3vwRj<EPC<D-sPt|$93KI*h!Vo&-NbXQ4UW?(Ns
z>O;os?fP)?k<l$%M{i~?#BaGH{$mn(xJ$qS%a^gjw<5gj=9@>iZecI{!29F)9k-B_
zAImP09+XSKy|BoVw+Q`xaP#KPa!F<<J3RSs^ohEx*$22qSPHR81sJzv&OVD>3M;6V
ze?V<b`QD80FK3sYl{q{2HIqis$^)Vm(Z&O){ll5^{b)7Bma&`occp@yPXl#@D8)~G
zIEY`uthjhf@8IB!Z6)WN$xNSPs~zW>8UOAb`x?*L+xUe$<~CK^T%%)EwrW^-LfJ2{
zKMK2OB~Evw$df{&gRm#zlh7--Hdd@9oGyZ3szgrV35E6WB1w=K!A8g82Ayu9PH(u^
z5Op?HRW&)I1{SDla?~3P^^T^hbM)E;dTr67B7Tpd+ne;_Pq*P`2CaUfUTav4zo+5f
zhXWmMcSqpir=KR@oavOMaSO9RTK7MpPbND{jzmi!tz1YYl`aGmq#P@~N;XqB?C2x)
zI*byZ)|(v$y>^jKCpz2cay6o}nORY1ql;0;3-4c`)8g=_TcFi3ru(EGPyWM@R7N9N
z^el}aMuG+fb)RN<$r`dnZD9)zFHw6CdQ3{XUwVd(Vr=@s2ls=AMx?K>I(D8o7b}Zh
z)xVx;tFLb>?P_S~V&~PjmUYEqU1hEHc&3@XB;Bm=r5Q7KbK$Z=e$Q*KfwS=q>&@A=
z;o}kr2WVz{3zrtAa)nR~bl^XJK)#EI$p1sqvn!<y(laXl4HdskdS(iKNW~9H8>Rcy
z@)xT3F=><ZkcywF;#Wu$(sxw+ZWX^;x=XrO#W$$<5$Oxk-70>OieD~WC_PDdHo{@x
zSMj6J8L=B>-^otOpU29g6M(pN%bzubWsA<&LKR4pLj_iBmn>U-=^#!9ykq6DQQbQg
zu1e=Sx|v^}+c8vPC^A?JGjHC&s!jF1E3KLPwV0^OGH3Dc%DOXL6?7wihF%`+WM49c
ziV9ujlfUP&V8T<DId8{~t!yKxjAh;-uLe*F4G5!rP<kZ$XTovDYm$$v_+`=$rRP-q
zN)<mOZIvEW@pD!Du=I-bu!`TT;s;RvG4NGs_8tCt*z{yE4$9uG-ao3&PC28K>hG{J
zb2l6QM4tzCc+MOa{Y1Y9P&I(o&y$HNoGH-j1JX9>G2l6>xK26;^OsfpBjg8B4t58@
zgUh6!syNN9f?p;*GzGs_#Scl#r6<(#pI7lKz?+Y#_zo36BJB~QCj2sF;$@}&%cZlW
zAF1W{srX^(S;1>P*(M(0_o?_%wg47{JpH$+_yN%KJ>bHlLcSU}&PV9iA!)btsES{%
z;+IQTNYAP`(XW(0EWIXXu_5y-;hABAOvjl=J9SSDr=ib6PX&9&;3;#$G(W{Akb(~d
zd26hpo!4N6W<nZ+&FT3J-Wy4iz1b6wT1v4KR7dS5{*TY#&4IoQLauBVeTO|t^nI`N
zDE25w8GdI@E(sq^(kIi{b?GPhdhk0ZSHG<KdkhZ^Z6QaG6D}XwZ1(4<@wf7KFiyA=
zA%4l;EmjT2h7F3<q~Mo<@35M(F9RQyX*DVMq3m~PHDzBF<u6w8W7&IYezKFmtL3v*
z{EF;jB;y2LBX3giBiSEI-vv$wm3H|O6~8?DyqJG~HbR~$Ib6q%a^iN3jP#mJYgnP?
zFl@oJh6f=F7GY#^xMXGUPykL|EMJ$eLV27-#YpO~4m8prxPm-YOt{UdC5z~(eDO)%
zD{T2m+`ytA;m&f(^#AFT-CIC!iu_yTJ3%iF(xCS;c)0!$JJO8ItHSTaL?=?vIz_`3
zOe{}xhGD6kIty0iR%eIm8<RSjA^&r#uMFDH`Pbyzm%qat**{VHIlr4Cx-rM$85)tI
z|D4qDmfG6-y1GZy2HB!Wb8T&Ngsqs`5SL0&Uy0ykx`noClQ|o3Zf{|8GEe^NiAvs>
zd%;{bV@eI6bO3ANpiKM+iZD{gq^pH|P;lB66#O#jP3bxGU;r~tJ~<{>O+IS2Kh;l%
zoqh70H-Eh2&Z$%XDULj9k4WMxlpm0eK!U-WC>s-$(;c<qi6tDdlGuem-mS>U56<bX
z=&vZR?Xnb@3w~H)D>TUR;g*>WXYrFol|``rLB+PsoNFjt-P~AF#x~emozA2)vqNz)
zy2H}uscNZW7t$&cK1M=jz~7Z*hICeLr-kp4Ofp@;FOy!9{#7kcGDE=+VQ)}&U@A{@
zrr^gU$ThV*$qWU*Lb^!kMM}FQGZg%YbS24*96cm66#R1ODj_qJ^7pIwRnUKai2Xa3
zeF9!YZ{c5dXf&{*u&`O($v?(Z>h0#tfy67H<SzAA#fN{W;IHSMrSd<gJ58ZY>}2u*
z{v@=BPN^5ItNTsP8m$<#RDWfx?rG{)?jjLBj!>}J;!tNxRh!8lbv3tDRJ1jFq5)H~
zD%}y9H!<Mx3{0@0)Xr@&-Fwc;O6PmJhV8r39i#Jl*j1S`_>=mwqRl$JCbEf~x-^CQ
zb!Dc)Jk>?h9VF-WuxoqfX8y=F()`n!+9LJ__+SdD^f1<xEY=ixMVYX(c7N2WqP<m|
z#Xp0m)X5uc@n`a!I%T1~`Pn?F)LzkgQ+h?32WeQs!%Fnlo$Kvwg4-3GxLUyvNkf9G
zYqR7D^Mr~Yly1(xt=2>JE9DPJ!&uMo#DF9s4=xkkO?-qb$DomY?=!k}g{O&n?`L)L
zI%VA6{_IX)n0X`mKwe)a++1S~PVEI5SV*mcI^rX>B#}3?urO^#>xF07Db4?h6cu=i
zVcf7I@DZW;!dM4xJ0Q&#njG{xK2z)&6rrN%<M~G3&z#PjqGopG@G$dDsV&QiQp|!<
z8_mu;m<7_Y22k5)@MR2>hBa%|_E>boqS%sI%|&wC`CZDT_3{htrIFz!4cGC`nzc)p
zk}qSamV6nb_3&lnXJ|BRkMOlczk~;zkfL7Eue=mhaN4mH{4(if!EXvq{HEY}DXQQk
zMHT!QP68xF6`Z7~g6E~Ef|C?g@VpdNaFU`5emV9V(!3S?yDEOQ^tkkZij#Cz$_wc#
z@F02isrXUo`yT?wE+*eE`s<g(uEBJoUkXnBRq)H$hABApSHTZ4y;xsLdFq#fU%|{`
z7eJ+aozRt_>xo@yo}gdBZ$o(nzf8J&3VuMv4@vXYQ}a4`LdCC;R*F+|2=!MBIRNXN
zka}MebSgOMpbCCi`nJ$P6`a<)f**i&g5-(VePkNXJE$J{Mm|USG44i)&I6iO+&PoC
zbe)tIdjmNr!}u~iRsnXpustVBvF(%X9}!h2JdO~{P^CjGgI1r9WzbcbCo|W)-StB4
z1>Tfb{bO^}?T4G6g&2o>*b})Jhh9F47>64tCgkASHC<hvW|*bi?q;92+0*5=SGZgi
zb~je0ViyoIx?AaqT#tQ#d{W;=Y|#_sS*9iGLMa3n;fmERJfh$dMW-tmle-Z4q-+Rm
zaQ*phY}q0<KlAHaFG~$|v|9>2-Ra~+y2L+!ad`JdEve5Hr#JL3U%R8x+mve9Ft2}g
zdu3t4nv(K@k((~~!VN<hS>a14bBrv;Ued8EyBv9xf0#o_hrU5Nf&We|eW<5UE&Ym$
z9_uYp(dSh3idnimDr?l5ua+*B3i3FANG*M2sYXSAp`w>Bw+J-COW6l%9Y@KX5)u`C
zk!R!XEsR}Zk-`b&-J&?jDZW2+O>x4{L@<F~IJD6%$%$(*<=PP!cQ_>k=mtX>dcN-b
zt;{pnk$LBL0UKhV$e*s!zYhL%!*hZw;E1zhnEldeuX2$;rM9p-HM21~92pz9xNA}L
zYF{+8tGy&JzLI?IVjZppRh9m#Q=RUfpRagYMk@Qu>uO!(Y1!KMJRCAtuF893l7z3x
zOfq;pVhq4BSXl?91KBqTCr?QJu8Lm<o!+YAujOzZJCxR{=(B3+!_wD<MM0_MuWIQ7
zX#+|Vk3Pts0t(+9titbbOZJ}_cfuD5E00gyGGfcp=QrS~3Yu~<!MdB`9myAE?s9#q
zha}%UW5(Xk;3P@@MQ_1J^F_!4IA@ttaN1M+xoNr6%2Ct;L6zd76O;91=)P?DbMO>$
zwyhrg{MofD$DA{I>;<mDh`+{E8;^ubtdXwy304<*t&Tseb@goc(&9P0W(IehJ-R7r
z@cKGRODob1gUQh1!8todYRcqu;t$4YmW0P9&tSxG@}Si<NOPf}G)IKe>bgzLk%H44
zDWwk$(;O-2Gb(z;Law58Zcxe|S#zSjmsIrf_2p_=nq{TE!_vJHt;KM52Kke!_)*+w
z(<)b5{EJ%4fni$Z!he(h5-1!3(U(K5)S`m^R7EdeRIH*;=TJTFFm8p6(<-H9J9HjD
zECz9DEmrCD3oYDsf_L(6X{Si(|G8hN9hXSL=%m-t#huOJ`rkT=@`%Zv@W$(`WsW9S
zb)DT5`+ws&irwLd*w4K3IT$zi8GthmWp9;khBY|@JRnw>Nq7ojg=yo{JPl8HmCn!H
z$*v=ZL)@&Eq<6!!R9|*fETE5ZE=9Y~qqScUpK^tpuKWh^DS57Rku1rfm+66Ke*$y>
zo<Vu^(Cy&T?2AA<`HL!g?3<7n*?$17;^5s}4Oe^@yem*I*)enIk*DEtk^MEwCOCLE
zhhF}S5j1#U!+M#6cLf?^hb?;W-q9@aURSmQo(0ci=YsVKHyI5K7A@5DJn%t5VUxnC
zcW7a+>d5?#lLzZmdzESf%4yu}6Wm%EZUS)ujO$JYE!^f{x{q>mZ4|tr*eiqJ4etI#
zw^#I{k^Ej|(*1~9k_H;-r_ioDGp`DNSQABEL325o*6B{N-_M_6h&ZdWc8bsJDHf}@
zruxu=0`k1wElyv80{J`A&oD=z0Qf<SSP`91rdh0}`RB4!T^$?=uA0&$n^Bvn#UFOg
z)TY41QZedWk>lj4R;%0*oz2WV{hGTfQZC$m=deGK*=pg`N<c4sIN@ClUK2h;I(BR!
z$tMLRsS3Uo<9IhLmhfE0ynCS)&^W?!G4-64%$>8QFQuH*?sNm-dDC5ZPnqVr+~S(%
z(yLNMvXrROu>%VVAqhLOErO;hj4K+4(91<X!OKG^8#pc{?6^EUa&V--yuPm77;dd_
zSM^4Yo>`LGPHy6>XU^3Y=vOtf4Q_|klKB>UV@`cN+7mv+{GVtKHafI-<zT6bzL`Ub
z$8NzbNWL^_Zc6DxLm3tQiHaT@rX5GA`7sr}V!;P0`YjbbvgUmieO^T`Uq>^f)IeIL
z(%MyXDdMpvdnXTa^5s_I?}TOPlpSEY@AIv7nU`zt{1^vlKEpcsc?)m<csFR#>faFy
zOwkA)*dP?0JEtND4;ICJm*zsWEOc_^dy#~IJaSS93(J3>(<xbS#g3+?9V?b^Z))1U
zoX)p(p-`RCSj#RR-w|)xw)BFnjQMBvO}-X%FjgBwTsR^!e2NBHtaxlIWN%eGwiWN~
zZ4{5OE3s&9ywf?);rBZ2U2STt21!EjKKrWB`fvimtY5Y=$N9q7*(6oaxeqergfE0*
zU^vPD`M^o$*}m!i(5EoHdzybV=)mp)I!JF+=s3VgZxmkB{O>?XPbcoXTq3<h!AYYa
z92!NG`V!1!$j4em5AJ<SE&HD;dZ1ndX%fu*PWWS+$SU{|E8CdY_&$@9HnZi0XozI!
zXLH#;Wl-uqs|z>iH)a39@8Yk5`azNe3fC*%@Nf+j`3xW#$e~<OR&lBov54^B6Yk{-
z|3O&5;}(wk@UvaFVoRN&s><p$RXayLL1S>yKyY5N(A({E`O3^bYrj8IQR}F(8l$zf
z4W^^+u2mB^F5$1b`daM4kiFdDFj}jOQL8`dPj<Vsy4CPKFk6j|ic+5~8F7Vt_6ncF
zY%eMeRZsqr*QEx+WpAuqsiD)CDf27gk4|zHXUQqtrkb<F-M1p?6(99Xp5gM!nfqj?
z^;4`|cb?+J4(=dd_^%)|FeJ4ShhYbMSDHyQ0Vf}M{7XdQKyUg8PkFX6^Zgf2ZWssZ
zA=Z0xW1=lab>`aAv4eYQucWvN(k`mR8o+K%C(r3qCk~N_|AAwk{zPcS-Zk@U=69t|
z510E|eF&{E2Hl>d%i&$QmdUa<7hAD^Kf=Mh)iX+r6}??uy%iOf{!rrSOT0bq;>>j-
zx<Wpe){gMz=ULF!CRWsy12z?XFNZ49{{;RUwe+Dux=mK<cv(e{4Hv2C4^;Gu1+t1h
zprS`s(@vq(@N*Tte61;u3QGggre{}62PHb+h|<C$pwN8P+zNq4c!0f;t3%I@GI+!S
z$4$B1$Eh!nd8p+|SWifnC^*R&1;31ir{E-G6#NiwGfvb)7H0*&LV8(P+=NHIII(pp
zBiKQju!53qK`4#j_2R^);B;bBN+0T?9w{iD*c9}N5piO}3jdRk(XjK2IxbaCeFCS`
znSvjdt`TQ&x@Gy3kfnq}bEqR(Dr_8L6#tECfhFu|ab{C?QOrCOz7D{vU{}`W>^tAb
z3a~>1nIYotaNHHQ3ZFG<R1{YD`IG}0Th{er<krs;ReCyE(2_pIj%IbctuUg=-(S0?
zGxO+Y3pZu|^3hf`=u>`JAd0b@L+)Uw4h!QMmRruKlk+c`W;`qX{5Hmh7BkCVeCC>1
zq~2s}Zt$;fE_IEJRU_Opv7=Z7MpjiKFtVFATb*tkfsv_+Wvh3`F`D2Sj%c}$h=-#9
z5H%hSF8)dGypZDIDh)@b$HP5ZTB(z@zOo-@{<h6O!|U#=ypX-|EMnm(D(4aC<4d6@
zVP7L}OiY!Kn~Gs7K_;nO@*Wv>LJ~DGnS8kuW}IMfQc#RpynNyE?ZxHE{+gQJP=EKg
zT;b1kjs%Mf9r1Y`tZMMk(Ao><AyHBF;F*h`I1fRG4s$eO<V#0ZWL_FD2klkqn#Sh#
zN^g}RvSNP!l18g$wN76eo_WsF)6SY1F3r5FWmb!&!d_%9#hC@?4)!0gV3r9zZa~nT
z7lR7h&<2$c8p-KbIO~&#pb|+a^eL$1$RiOZ-*7*<Z8BZg`i_qEU0oYGIyN}E*Eh{;
zqCayR8|T)hnkw8y6<T|r8DYD%wPkFr!^D`$5l9y5opt<){9|3HV&m(tchG}KIWeDV
zXm!=tJct%6vy2QD>sgqU7|q2z${Fotb+963aNlUgnN0L#dd>ve+w^{A^UWI+g}4{}
zOsiRy$Wt77x~`se(YltFbr;Q=y?<>>%i8^O8{0evZ?eu)T~bo*iFJ7jyuD3Bi$kHs
zeeD~^>g&fgwRLP7t*;;5#Gg#A-ak6Je|0js<|6U)n7&|?S>mz!xP{51g@rZCXU|z)
zGg>!iQ+L<qIdye&Hh0la^dZeU<m>o@(ENnmCzrQFPtKR&a6WH`h_AI%;*K;7&UEU)
z7AbG^%OxvI3tM&mPQR|zP`t8~`&X4)<e03H^%{*_r}JgXH@=oR&L0eB?qChCc)hP=
zUSLat<>kjqt4d2<CC9y){p`H4G4OIk8e@OsMW9Fzo<Q}m{>kibnO5f9&e-}h&iDpg
zvmeD*xB-2W>)A4t6y>-+)6AA_-i$iD(h~L}`&+IKTs{Z&EX@vPjtsKx;$sjMKD>Yp
zEL@m*WC6`!O!Bk$c^LmvP8DbuvqooV)vFO=ZQAeb{Y>*eJrxz6YLDHHkNm%ghHqAQ
zeC~=0x6f0-&aOZJ1pbW=I?=XEmw{@!BhU4Z!g~bmKLPze+`Rec=mL5d#yI?h7n9F0
zyfw7eV3PeL^Gg=aEa$~%ZryU`ExV~yD@whplrn4K)DaA}vae@Wuu$gTc=2t!Z#i?z
zR<sn&UdBDL6B#U;Nq2^X__*uN6QPJX)v=44?UeH%jEL~WSuKXTJuQ_Xq_c?Zo7Yp>
zv3k&d-rT~r#a%FOQ#y-FM|-O}SNoc3o35^lV?}-R4d-?yL+6~D)gto^mI=y-GYCEW
zF3ASa_<P(GQpTgaKjc(XY|i$6VhzEY6saKs<}`k?fU~!+vOF^4ic_AYczL|Nsx*R#
z{WEaX+GUIzmj)A|A#>csSL;fOm&&Z7yS263foyV1&1Lb4RjYR;GHqY}GTVj7-HC79
zemmw2)-~AEo`9wr6r(4WGv!0mA&wIsnXnbp#Vh1cID`Sy`@*ct+Ba6CH&zB(Vo^Ug
zBhf<zg6vpfrmWeeDc4jq&wEDBoX#P(HJV+Fc_Y7#b=8`+?3{C)3zL6pn^{wyc?s)5
zL-sq4WEvuSgq3diPR$?z4hjeHm!JRo;n#0C(@?B4=t>GE2Crl7nGk2M;sY*e&Fm-d
zP)>;k^E;U<Gmo(un`X~GcMjAfo_#gDg1vy)y-KVcajp<?Z+cnTLqwXDv{`g4oo4gO
z8sg>FJ_NWoX@Wy-WerV6Ymd(*H)%sNFDuL()1S^C&xO7HKGq-NT6wj*npedJLYbeh
zSs`@)SoRzqm#cI0n`<$~r=5;ZOs>olaCuEIWY8LH_mp^B)eKsz>q{C=S2AdsnLnO+
z?U?xd_-tAqJ|Z9ga1s5*s+c;fxS^o)6p87NomZs63TyudbIWe}lo|eTWaPle2q>{&
z65hld6MqpUpXM25%#*@zNiC{y7C&BGp)c0RhtmrjB9l>3iL7~5J6X&5uf*r4<TQF^
zWaRkpFzA5Cp8OW*NZ>q9-id0im;Ci8CWTHZ&>JvTO8%yk^0VYAlV9A0yewB(-SVic
zr93T~*|JCEZ4r4|m_;to%#mHT^KF!;MX#|itvvLQ_QMF1e?_1F)08d0n>q7JjHL#*
zOFMG6OL~lEBQ!j$Oxj02`yG=v6X2%La?jK^HpcJ!Y*$SfU9xA5i(GLe)f6cl<4}<(
zWtrWEP1Sya=^;dtLHuPmv@Hmf7Dbv8*2Xqx+e~NQKvhZgc=xU^wzhupJB68r?1h3%
znm=Arw2dP#9oNR!&E36C%b8BQt+;&jroHFfIGXw5+`0Q9OfWj|=jOMFb0>LWQ0SR@
zdlKVQ@+k#yb4=Nkh~EXzuUx&Op?>4y*wWd_BKiGr)NGE1-z%*hISomr#x#>V7(XUH
zrzDtKYOD)~Bjso1b16-9bzRYo!wLCkUCI|?KOzgO;_Z%=H*Ni6EOH7gtZ3#09X;fP
z9LQ&I8yN{UBQ*ySxV6QN<)wYgQe*2I+An$Si)(D9tK*B~Y7)25y73b^+(vHtf||pP
zU;W_@NcI?Z#wJjb%dJNeU>Y6Mro^0(KQW76`=a>bPmn!7kq>{k6Ky6j2R-}|tTssV
z1OoiTO`~!>qbP|Yt|!@j*1UOpy00v2YHp5~9_wc#<L9)upEI6$fE9L+H#LoSXa30_
znY@cHz=+}$2ao+nh5UeAn=-3%INc`a%|Rq#ajua?qAU_+EvvT0qU#s=d%HWkyxcu|
z{_H9;K-PuY$C}GaJ@wJ{%4^w1ZDtYUk4Dxl##kavl~&$hX^J2)8<Cu6;3%#n51V{%
zXb2qU10}aZhLC=vcuZqo_TeuiLmI4<X3O{P+{?D&<7w06eMasVpK5N~Z!cZ?howtV
z3Aki7`w&{SpLA-o4s(;YaS^L3`L+-gN;wnKbmk<T#*YYO9b#6gs6LP)1DKLg;W#hy
z`)+c?JjwM#&auVS23Nc#9B6Pb*=N5z9p}d9opTra4bFzvx<DhL6_>X(G2<rjSVe;;
zv4L%@X$qK@lva1fyLxR5nWr}62%|Nco$lh{s)1!~Y^ki(Z00b5l`Gib(zb9@wdu6d
z>W+9v541lW<k1dp<8#HShkQ^xA}7;Hr<^cO+;quI;Z^igR@bQFhr$9L3S;tk>GOp}
zor~EmT?@M2>l^Q5moM*Hw!C$DIz66l8OJAk1qWzf%Hv7VN&1|{or}6q^uK3}&seyu
zb17Sw9&Zul=#y5a8=kL4kWq9hv#T<S{9}Xz3?u?+{cLq$O<3pXg}dv8J9`d&ZVl6}
z=8x+Qi?mvvS#LP=ycK6O89&@7Uog3V-vz4z&fD^4%p_UQ1H!H#vOeaFUU?(IG@E@8
zTmDBF5~h`TzGt@AJG-ZQmd`h<yMpo=S0JrlkrNuvx)tn(r9HE}-dW1mT@{rELnXd0
zE_U)K!^`H(URG1HZ1$XG;rW(iB9XKxpZ&sl|5xFqb7n6OhjCU~8lG>)_bD@_Elirh
z)98!lFVp%WV#7X-*3Z(P;7Rj*axTID%l@)0`EkN<<j0AI<D`M0E-D>OnLlkH=70PU
zVdYk{@3LkwM)33eh>^j5CscUYCGHG%1@nJG&T3<ovAoh4;7?X}RtLMPtGj~L9l>FL
zmC;pR?lM;S$rhK3BI7#5Y~_BZ*fIQ$gA>UOR>aQd8)3tRBt+}*$q7$ScQ(c5p`<&b
zXuZU{Jp)V1bhb()O)ymS^zUIuEJlmPQX4MOIfBjJ`mR(X-<TYJWw_{zR;w(JKx?_Q
zp_rAGl$4hnD@!9qUauuqUmdOo4RxU5AZRGYU5cPVv4^3VsZM0Cu9+K{)4O(TY;CZz
zG8l9^`Npv|U2}YMR;?Ku4Yjw0LT&BHaGsryl{iPpR1wb!U;T9}88Xi0{Tw6GyX<rP
zR*0kt>3WQiiE-)g{06RLUzWat-y0yP&cnX1V_y-!N2T}J4l2*Cm%fbeA<aPTO?ZB{
z_`U}9okq{gXNvmb`29>#{~qzX7v)#+>+$_rqI?S9@1y$Vv&HvG{C<`wzgPSoK^~mX
zv9H1YI3Y=yYl%Y4)Zamk9uz7F{BPKKR0gPmM6>^7I~Y8SK&65pD-}D)Za_Ua{EB*N
zQ1fZ1Lk~(7Bo5?E(bk?ELT8#)qRd%2B!x2j*jMq?**PQ$<Sg;jUP2%Vs~`@yi7_uB
zKB72U5`DS6=gLZ@q~><)YnWD%g+*j2AS)EVI<sme`)cNy2`+Ca+0GkUW>!~MZv}T>
z#4_L27p@OPG`y<H*BaF{%~s|yvz8f)D@v@xk<8!AWA)B1|9b4Kd{uj?&9KrJH<=0<
zUs$NY4oj46%uz;~%gMA+%7%o<G@e#6O7Lqlt5&d^Gf(BH={Q~17k-e){70p`WcM#O
zn@=I&FMlp5=r@EanSNg8URKgWnj`cy`C-_HWb9#`QlHW)Bv#%YhxBrEe<8MIVL=Ti
z(~8v&Te7gsol4i6G)gyTQcGsI8xqxwk1Vg5AJSAssx2{3p|f)FVrPZU5eoD;G@%i`
z=XANC@O_2qiC=CuDOBqsEzy*o>zf+;TJ@Uw2(`Dk$}L53=qR?7*h}&Im`<1Z<H;Q&
zEiA$Q%H!CR4d_eG!a_%d|H{0?qELA5$_(@PnFD=ip1(Wu-#d1YWSN0yKFB|lv$xRE
zVvv0^vltJ(#O|YqF4%qknSBG9|G+~sviz6wDxSo@6d!8bSJNZnRPsO|^O&D~gO28z
zW}Y-n{+Ef}p<004Y=Yg*cMCfaw15ER+jkvlyR6_q8ys|g>%H|>?{7gmdh!zc8QZEz
z8f0X#rIHDoE*z7?A)Pf4N~I3jTHBkAj^e)JcwI$nd&1}_>MO9+vMpt%axU8{M}`?I
z#XmLnszk3Fl(tJz&XLMDPcsb*{RRJX4olp#iZ$-e?b|bNoN)%bJo7cSk|+sCm&v8<
z*L14}PoRWg4sb;XI+!r8lNy@NY4#*>NomV5jL=Nsc^>GTiHqxn%X(G}xyyaEZojL~
z<nxvfSp8ii%?sx(Tuxt<`Rd$0cc0PkH4d=T18L7`bLTIQ4A<EMmVjqQfw8!zH3!xX
z)m!~m0?SKk(4UTMKi>d5ycwf~(~pwDit;1mP8-HR0?AWw0LKziPGiYr*!VNItD-Jo
zMaHE>Z?Iuzlpi(kW3L%Z5nV-(r><2-PNg5$RaL}#Yo0->nW~;<wsrC+XYp@luB&j&
zE-0;QEG=jIFh0oRkL;J<BmX1#8X}LGOnC~^u*1_xC?^lB66}p2DTP7Xv*(V@F`XvZ
zx4wUPWx~Ye%I3K(wS%3N&~0P3bQ712wShpLy+orcZaHf`e^RcRdt_qe7Z-->N0vlu
zM>_-dwq~#0Uf3NAxB0y73ln3Tx+_6RO?EHtAMeR|_1h`wcG4V9a$n}*L)WvFlatpU
z=J#xUFLU+Qt!(RiWJC03Z=Mnf2^&Q~{13ZRk}o>?z!9FDJd=O>!#CwJ`YUhWj%UcO
zvFAiCseFI}$<cov<)+D-xalay4mpQ5Zlq7*p{lH(jq)GS*~lD6Dh)6OGB-oG<Xm1-
zh`>s{Z0@Tr?6z50leT44=MH)G1sx6xZ_v!(KhkWmdL}RE@5LUq#o^)S_su}9@Il1>
z^rVpFIW3E<b_u(WGMp$`?1XMfd5bU`cIDK-HgDVC?&^wLe8$Br^LkCxQrXp<>U1LS
zf9B7NO+ItHtEzoJUY>DqOaIzALA`G8F7M#7uKBBKBC8hkpVsZ$wO3mZ9$VYD`M@CL
zN2_!R_T2Rt8P)cS`yO2;!Jgm2)^FZyc=37AN>LXr@-{Iyvar9y-jXo$mfy&RZx`|N
z_pU4XzP#<j>kA6lA2Yj<r~x%6rJcyj_7b=nK3QhBoEHLMue=mUpFmHDhI=jPj<mJH
zFkap<WJ|ZFt@fgEgQFwz(J+IyV=CkDW}7)%hVX!}txV1EJPovzb4%sS*_@S{%is-B
znd)~FU9c$e{ope#Ssoa@1i*}CrI&p;QLt<OGI`}+W@`=lvsuMidZYrFyeOIE=U-*3
zw`ab|me{cEa><T06UK=|IZK-H!Ur8V0Exq`dV88h-qq>eH59(5)4f-C=+GgUIqxwT
zGItjjv$+NX8!f*6xgY(AxGKuaS(^VIBTpGP!vE~~b(H^p{SH_om{iIA(1xC&Gc?P+
zG9;8vi#svqAJT<px1>fx+M!reLp^`S5E+c%kHP1Miwxezz$5HB)JyXTUJa-12{sYF
zuJg+^2MhS`Tlej2orh8t*<$H;+22qLc4WVS#V4G$!6zdWo|ouxGoD(OHU<-%J0c;S
z))R>LI`v(w(pRQq)J8RTL)rV~w0*#Sarkh-k?@!JFE386TGe_XjZ`lmW}6^gij<QZ
zE-PTHqqxz))I?#!UT>4fbFs&RPyRh`yI1`~Z6$e|^Z<W~c+WiLse?%TQ(McQQbJ2n
zF2rrfRsVW^JWu~|-Ea8oN4s|t9Z{}jkMqAOTu!4+XV|Z<zP6JkR$be{|JrkV<AXi7
zH=vd{U&2=6Jpj2I9JVs^62DL6<MG0e^XI4wBPMd!=xp=@FE~l14t5wlC8agNqSVZ~
zqQZhk&h3pZZ+T(T#@vlgM;o5126aY0iKk&bH|N$nZA92~rYYcGQLdN0X|Ff!p-X1F
z%f%<fy|KsBOwkzKh{SNY5RswGc7h#&Y{JQS${IVd#4dEy1cMf5Nl#I{&Yy0maFq1u
zEm8g)FDWmRH8$ta2=X@AWo)_e9yfF<TIu7+uSPi;?btnqO>jz<H<3h*q~+8EtjypT
zb<YjCuJ#UPGJ~hFzvXkgy)Z448`7jrP3DGCfp-i430iY2Eq!Y8wt}+u(S>7foJ`7#
z>SATRGp`J~uJ#PwnfdY(<m~<A1Z|LFY?JhNS*G^|k=$4G=D$yHetO9cS<Y-=rO<Y5
zBV_Kz`D7D2PcEd}humyU)2wMTB*PeKkv~k6CcVX2nb)K%d=@UdoZj}Rrg2OzEN_TH
zbzVcN^UBszd*Mo3z*THAaJ~q-GvokH0z2d)+7Hmur|7QXTqFltUDWTcZwfLtb7^FL
zP*YVCw8Y#w4OP!7LjFFesI%mvNV>k6l+gw#quTi}1zD;}p^Og8#pYrgl+iIA1O*qd
z^FH<$*vg<)2i5HdS_d7Ar`jB`71^v|x@GOsuy6X4E_Z9FrqkWBu(mY1DK%qzPtW!l
zU0eGux+rtLzP@`#>-&eizT#q^H}f;Mzoe<Ds3YFGYyN_rt;wzP3+=e<#(y|{;XlMd
zHNuCa82{AE_emE@PZ6FSMs}5pq_F%oZkC=@zrR=dcSItc`rQ4}e&sn)U$0vJk$imu
z53BeC)9^wSe+Zc`C|X%Uguwy%(i|Q}L}Em`5A+>pPl@<Wh3*s2J(zz^wBuFldw3dt
zqW#CF;_{<v`A6Y}^#jrVAic###i`#ES1Q_-f288ymEM?=UFH%MznyzT<_(cQMMQ03
z*TZPu$Oqteq?hkv_lrC#$TXt)p?ouL+9BUy0}t|B@e|rFBr3(P4PYGb#uwB}-&6m;
zC+HZ+E}4ek%^f-X9nF=HxcU0J`SDzRKbOc0s3%*@E9FCCUJE4Z2mGG|J+}!93S}1A
zt08|l1%F5ym!1~Sjp4Z?c<yHImdN`_`TjWjws?-=xymWeJ&1T-<+(}TsHs)UKdjbA
z<>M;;*p%{>^0O*V@4ES!Xn#JviAKfm&3R)fnNY~1TcPJR_A4=e3VxM}-_9*3GNfo?
zD*iY!syr#`CwflcPe^B;z~zJa^2l_sLc}vF8B)Fuoa`4AC%apeSMY6lT)q{2K=GS{
zS-dAe@RM1L_qQo3LEvN4@Z;=d!m~F)7&ghY?w~niejd&4k$#Bs*o~P}Goa$nW?vDR
zVg_Lunv$_YzPDP`j%Twn`C}`!+{WV46R7<^QA@jgxr*P;wuoNMfOVE4i$k=pLCdgm
z*sRd%jO-X?z(9F{gA4D<;n>7Q9EDQ8K`p;-TKT&<_I1?Lk{zSB!Jr=0OWe$R1wH^v
zsw~=tt}ojCR|UsvJ}5Gd2wc7a`KKx4$N=a;J_*#L;Kw0Bss4d%hx`pek5W$q&()J%
zH?92LxppaM!BI^K>TwEs9zw1J%DWTGjv!aU0m1EU(u3;v$Jq;6@=~wDbNi+|_n`V5
z;niySho|9nD*o71T+Fi4{-f}|q*+#SDUg4qf<Gx85dA(Ge@ew?^L?DSMJa!;^k+e*
zQl92t!Ea;lN>4z?BK!sZ3UrNth`algd<=H%wsbE3#5dU7sHv`z$65WXlU`+W+5Et?
ztPF+S+Qy)^vEQHT=L_;3@I8E$#vk61FN@V1!~BB2JPv;QnV4TexBTrq4j<05bLG(=
zlFCXw@@?$BT=XyD`&IlF-jbVN%7sDvuZ+v>yixGK7%vU&5(@q}a$XR>os2&r9nRsA
zspHO$B3hgHP$@r0t><av+Mr!k!5u38y=l0t;?L!9+;$=N1I??*k|2{bB>orxe<JsT
ziXUf>iTPH_Q@@n*B=sn&d?34GTKT)VNt72^6*Li)#}N(d@fqnWBFb99Ng68n_Yvvv
zIO<WdFi`Zhg5SWtCB~r^yVR5{44AL4iQP!xV*OJ2FxD^1)4Hecq5aIj`*gkrt-p+J
z=P4@)EU0k46iT8woe(iqX&jTLzrImuNr7L~Y~Hcnug^S6?*{wM=Z~x@w3ftLW<oQo
z->|rGyjJI`t8?}wP0`3IyflnyH7DL0_R|NyRE*OjXAO(nW+Q{CeuJ##b?u%A#Rwa-
z15<MrfYz@IjmMZ>It{;@y(@4fVxOX0ykZQ$0Uo0{>dDTY8ksNOEB%)kbEQ13Nu|89
zCh1*kZ-I(ea8AZpee_#;^6T)VxAk16uDp+YZO@tc1xK7IS|NP|l7MFXMm|@}cu#hO
zT32zbxIDGE<W<XK#qG(J2eq`b<mwT<Q0u=~#c$!MDftnIGnHQFSDZ2$6knv^KY(vH
ztvG>eXay<w)5x<R^ir&db@CqI)q?&T*n>(IKdcD6Sx3c>vpWU-D1`E)PblSYV=s#O
z6?|PDXGf6X?b~Qq!S|{7F=?ULzeA`WZ`=VML=ocPuZ#MXDEKb|hX=8wlkZzjUf<PN
z51jvkv@GmQq)pMc^weRoE>3>x{uRnoZ*wj(k12IMlB<i*^VAj|P|<ODrHVe(L(#KJ
zyT20q7MDmnp4M*m4><SnDNj9^d+Kd&k<V1?dRRrLw)@x=)TowyRCbDX2kE^+YJ2xe
zcTDN0OT}+vPYK_8(SQD`ir)?{qO~Vt(}fQ`EVAguUF?$Vn}SQrg~xj>-UNg9=-@dV
z7R7jeOT@0%W*1Gvp>O2yw>9lT8>aGMshcmN=b&AGL1@F_EaOK0l9;D|Nad&(S{drS
zi(Q@l2k4=A<_*wTa<S6#LnD-NAPfm%gcXK#;UY<^K6RYkNKa+|il>ZIo_cUtdFpLm
zCGS-0dN@}XmEEhNkEvyiGU+8mk4}EHh@vjS*`cXX*N`X=s#F?f+Eo<lZ-Y-Maf1?#
z{R<Vpo#QRYd0fo5Qv2g;l$dU!gt$OKpIEJ;B4SdY?AXjg)S$#}Q%n_3&lF+MN;wx4
zlrm!ys+VtNf5=j#Uq`l%-f06IW<22E=3LO-fpMIQ)0+JUPUbx*^|G)P3wy!KS1X2L
zjO;a#j1d|a5z|Xr@itfmkphS$rhHWn*U8WR3yrv_M~wj1Q3Np1F63Fq`*1)FZ0{J`
zdp$JMRQ8`VhPj$=W3@Dfx!7WiVGh5YtwD|)ro0~qG#bdJfg4>iNF<H9H{yWaDeuBT
z?VZ^HhBwrpO(jnDIO`N6(3$PvE}^dq9M+Fvp+7{kOWBes<?m)!<wuO(S%Z4wpqKRL
zW(9|o^HNXYQ9<|(>>&}SFGg6DSMcNPc&?rfIVRc_xYWRxigr7&$06cXt><peM0xU8
zTQ4sF-i-Qn@<T&pJE+0@1)*WnIxu7r11`QLDfd-+D*G2a6`b<agSn>&-K^I2@Dy~H
zias_4)v4&ChBDDE)euzCC&$s4@Tr@MK9xg<=*>8}vU;qUN7Nn#Ws{2E#-4*^TJg*~
zp9i3kc&7WrsTRX&ekb`InSI<lbuQHeB76ml&H99w>uB>EbgmcYQ^X_h7c+Sy_X<fx
zV-31g{5ZQw?Z=7oh}s>XQ$Eet`S97z*FwEhW(+v-ey(=h(_`pzV+V~pKZCcktVHWv
z#NEo<)scRDjaqsN`owAlt(`j3(1kBm+YHJ_)H<FXrd6oayh=sCHw7J5(dP)w{x??l
zSA{f83+{XL8Cvt;ZHiGvSwe~H6kf$|h$JPcr{K3^Eg&BN_JgI<%HPcvixCvDq%v_{
zi>T)r=?g+iD)?DBTql1&O7c*NJbhX%eFHQH8rfjBZ%XVbQFCrqi9Q9+pT-&yCDrHh
z--|dy*$=!`w0=D@UaUfWCiLz^te{dK$te?hakUylsF&}Co<?{QCprtwxDvl7KWb27
z;Rfj)Jvo%P|3R@YE0J?f6(|0n%sYf12lp$r=;d$n_u&(s$Fn&+tl$`P;!Y(Vuz$*P
zC%&g0k*sD)y(d3U+?tOjJPyxGrPUKpPp9hTQ@#iHN+%)=|4r=;aqo$^!5(!?elSkE
zg3|ZvRrKj$+7p$?JCdMXVjgZ_w}@Cefr}AT@Z)@$=#jw1o~z)uu_wfytJFhwD#CT_
z$P(fX1tlw$f*$LkRT|Fr;|&`$JKdtq<Lpv#D#9=SU*4cSgg0o<<_}@df>wyP$K#kK
z98MLdLgm^Uw^4b2tPtKB!F|P<A79t8x25Z>udLqL=<ZtCoj7fNU77vDrFaiRd428Q
z`8^YpPx5;-Fy#L(v}|tg{HPHx%ie~UWk(}5b>{Who2lK?{&#Qgp7a0n&E0frF2*Ue
zMBD_3duHVb`tsP<2lRi#`Enk=PcAs4vU2i$9_*PbEKT$b<tO74G<UFE+zz|0@|NB*
zc^2+*Orkd2<>R_SsV->Mr(aI)*j%swJJrd~*;9^_sZPH&U-7Y9oR8x!s64wFw=?(P
zBuMYw_K|Lb8+KfJlxp+=x&gtPlJ$Wk-M8aiQDHuD-EvnI*Ol9SG0(on7B{lo_y3^y
z47~9UI>+{6;T<zn<(YNv#^p<5OYVDQW%uahq8o2qzjf>S8*c>7y|CR@q5q%$mhYF+
z6Fa89<$K3Ox^EsbTz=wPzQO6D1v*7?_+4SNu9Qv_r$_}yM6`m-*K<3p{94$hB>5VQ
zfJ4L|jL<u67&>otYwUrT90-$BgwHJ}tO%IHkZ97$m<GNyfux!4ad1z9f8v@6dp3|j
zQr>U%dcvu2q_s9sU2(IkCQ#>Po?3skeexIffFExqtqat+Zmy^f)V4$rK<M#W*`=rd
z+)!Lta#d+TQPIom`91xo&x%)Sb=u0ryxpTq&l+%V@y*ygGO~GwZ;N~2tfiy7=Ox6~
z@mZ($)BCcSE&u-PH>!F)-WmSy<=&!Qh1F1m)c}h}&NrKa81oLW)7BsSrc{>%#cyiq
zrdX<Hv=bTGT9(fZ7q{+e3Bmt9R&&Y4{;<(h7i?M8R1`n`q?gz0N{TiX7|J5yNYupe
zMyyiujV>+FZY`pWBG5Qt!@7qoyToT0HYNQXy&hPn7m*!&-&GoouE0|C*Q>A6%GyF}
z@qZChu`k;j>=pI442CCjhP}yA5wo&uX?2J?Wt^h<=Y(Xt2YIR}$C!c>9|#<L@FlDo
zSsDh%za;O22bP<(@*sTH0_i~RvhWmg!tiM#7qd`0Azn$u{`(K1?apmiokC>S8f|b+
zIyDy5u9ky=Kw#_EYrs_>NBB=8L(%9^q&`fse?;jH!GTI_#L3)u@*CC1ZGLY!RZ|O}
z@sQ)@s!#}NmvL$6v;IcBUj46lz52k$nN6p1(D(fPo)d3b&yCRzAz3cSNtPc7$s%X}
z$=3*q=mHv7!|)j*_W`oaVg)Ecn0)?!v}<&RQe%m=@3d5rFJ4wyikoq5(bcRPFB{m}
z*0*DPj<<8rp*u_O3fh|5XD)9&CVWT132j()<7j~-4&KZDDer1G{IB2Deqxk!-eol5
zdGE5{s+rV<Z|jLP>X;bCj>?}D_G{33QjG0MKJ=exwLZyMjrXrlGgjv~;S7w*6dK7z
zigr)Xcx~oAb~Q$p#&GLaWhAlVfk?b@6t*i^ou))!z}e#?-_<^E_5bc&?F=J=_c4fw
zBGKL_#IAf|+{(wttYFlQ=oQ@#DLzZ+KaImFZyTp~6aJl#p`3}V(D0Pwcsq_rMUqN&
zbG$g49O|%q@pi(o+f8-dP4@0io3XyN+HSDf_h#POrYWxtUL2}1kPi=Qnctx0ngY#M
z&Wfv?Gt+E;=E{<ZkdJ)>Yelpq<jkcxIdeKPj?0oS`zN`P{|ERZ_ZGdAIfMeO$lXwh
zvrb#}MvAvj8^cL<`}Skwk;wS5?c1(d9*Hc!X4~+1v(?%>K0G|0v|5wnTD|@{y`CR%
z_3vK1aA%*()wgru;@$nOU1gDxmh@n_tSmg3Zuvi~y$4`aRrUw`?tN2ICT)7!WJ;3B
zB$>3y%%mrzK>`U0AwU8t1OkMFKxm4th-(E!qzOS3>|)oo_rB_itFB$wy0%r(wP4N6
z_q+Gagb7Xm-}gao-ptE;x14+KIp>~p?l}#PnCG@8`?{?cUT7s(C2z&jV!8r)I^Yt_
z`FKno@dL;szR&mJzMJ>ni#+02VE8A<Bc6+z;4F+8fmfB}xhPp^09KxTGwxYycA~2!
zH9BL~49nbhnhX?$_-$3FW9A#pF*9aKQF@s-FQdJ824<CeR=Gg=ZEg#)x55Du4hK_4
z!^m4-j3!4R2l`m^;2`_G3xWfC7sEO)^j*e5*vh~vwzJRTc{|6x+DTs=dz6r_9nvyk
zi)8G6)H9hc7dh*J_;N@s;Qj$h!0TZ3fs5P!y;IychI99GcaqO`eiD#tLTcjmLaqsn
zX=O-_oU=h@g8vbV;{xB+m7|r4B`kl6?~<^<@(svDfo=icr+`zlD8&g}BOl^BG=WJ&
z=wJh$(z84_cVSCq_w>wY<C(KFvf^U19N%0pO73v<&Yabo4xxA%l#Th>+4(x~V2M(Q
zkoA5>yg8{2YbdRdR?PTmEvXge{XstNS(cmI*HSr;wX}YgJu@~YGvn(`d)j<&oTM>?
zcV>L{XR-WGx5g*3zGpZmXF*G4S94~xVg2k3M_jDKacJWx{qbZ&<HO^l6K_X*>~s^j
z3*%alVkfXIiEo8^W*r4x+W1alB2`32#i?`^?ZuHvdD@7W2&C$hPoF~cyM6#P(7%d~
z#>^P~sWT;Ld;(%@N}9ZUPNTJ~E<wH|%$lQjS5ED4H%?(a^Z6aUZL@mq(wwOCoY{H0
z#nM{%nfI5?IE#J|Lc5Qd51iu$n%g8-=m+Nw=H&D?Rm^L0L>vCno@S4Uwx@sj%_uqh
zJF;OHx!yjn<p>VsW;t@Ti%2Bz%Hg3Q>ChY+lk96aT`tLn2ApF1lYz(`e>U{^i4Niq
zApv59X~Ic-&S!t1d4Y4Pf5cZ1mq||M<WDY5QCW(svOVST@#UVHxj2{I+pz5Hl9IFc
zkX^n3&R|AxI@QrPdv>2grWlEds@r?cIeU>Jg7g!#X$B{=1ltV3iwS4}7SDpR5X3_G
zdHAoz#eW@cn4hC^&a07{&6-qfi87Z?As*jS`iNA2RLqD%Cbde5I1(Nq_x*b@qF-|f
z7#TAeU*mM=gWVFHg3ic?Nl81BPet5IhOs{(JhMqY-oTDAkQD;_jb&OS`E66x`8m<C
z`L(Fz^(oWj;fe)Cltrs!-18f}!)P|V6Cf2}R|r!kmINOQ3v|vHDy`~lA2sL1=en&i
z>Fv{R9wm#%{z0B@o$dR0%wa~Hf`!@y)z=Jnu%tPy`%c`)Wg#h&HEN#7?O1|XhNx*r
z$wl;(V5X#|!77ufYS4Gz9@734xuT%RU??iUsaiwnvEorQ$J#Fj2XD??%u*R-E}7T0
zI1}@RvnbRHna2_Itd`Ih2dtPcn~R-bv$Ew6$sW5myW~~P`&L*!Yf476;Y{Qr*TiL~
ze<f-%+zkaLYq;ymk}#V?P4bK53s;c2qx2ypN*ETYIx8bJM~7Gm3Dy^1P0iHdaC&ZI
zPIIR{f_09;8qv|-$0unW3v!@J(6#PJET3qa1`bES>Bwu*&Y}c$TCz6JZBkg9nr-fB
zj`aFI-;1NZQR<EuR3><wnU3f%ZCszx6qDN7(zu}5fGl!ou7u5k2s_8mu&}>7-XeEV
zpP)+N{(G<#j5m7zIIqZ#jmdU=^9_W++=aeNM}0q%ufitq3yFn<(Rat-&)U@mo!swe
zbOT11%PawW2aMQ7prznaN~N?<mf6NP!dB2+;<d=kc~0;2l6NAAE{>k9*3!tgN~RY%
zb1nOm?3UF0R7$pqG%YXHVoxIG>wI^0tZ&WL%jEuOmdP;MFPG_aThHihUs073rnN<V
z{&|#58*ZAkyq#S1D3fovcLOjnkm*AM$cjhd;?d_AuO&S<pCru(arX9-?ZGq|!Rtf`
zUCJMR9ohx|bR7vv03_4!;}iirR02zEzv_}@4_~of7A_`GxkA>gG^7{X<D5pK)G91#
z;p^ndTBDj?;EUGSHBrWd7_!pjO4p0BmB6($pIL1LlKX$guUzO$_?i~^C_~jeVdTv>
zny;y4ilg1FB&Ms2To<Z5qVRfXp*47)M|=ZrBK{IT6$3KB^l{Sag;Fj=bwpfhd!acx
zQg1bAa$QM^+~NGJ`uv2fX??qzuc}iXV)~@pm#WMK(@R|yRuw~3n>Dd&u(f;rv^23h
zw0)%z19|IVzD|_b>#^)1tt{$!8fXNhV7n${uj~H5YFZwC2pXqyoh2omsaqVjG~<=Y
zc3YMO+7_E(>@9=!h_)ronpw=XEm(k?7QY^@3Ri854p&9Ix?qrNrsz%o|L9z>Pe_8-
zBXlm%JDkS%)SHpB2H_y!l{Y|ljzc1w@!jJ=f$N)&-tq5z`su-_@;}=42Z!=!Hvf#8
z*8{iCM33UJbIf3NR7+6b<qAxT1(B8lN-oh2MG2!}A0(yQ3o~d2Q#f3vw^*32t0Xfu
zEq?6p+ae>wqnzib*N*F~CUk|~8B{=!f~89@BJds-Wd2{#i#;4J$x<&EmZyc_#ql7b
zz(GpYQSh+4j#h)n=FPixLJ!9K73>J)Gw9FIi!t=#htOVNSK+q&K`+RB-(LEkP#Ek_
zlz`((x9UD%&=@_0C_1N}`los!hxU2^p?QM)e|8#v97os=hxLhF>7$>2zD(uYGfMXO
zej>X@gA>o$<xi_tk?;U-!VJR$gK3-j?#%*?8(2eNtz&ZI*sPLATPy0el!ZMD)$pOw
zura1~4lZJF9pYKFierm^ruZuQhODw2Ul^x5E;V6Hhy7>Vjy{RwUFPTrgVmsQx{~EN
zjFuE6WKZiGn>PCW9^W8Q-n>+mQqWXVILR8tNJ*+CankUNt}`0bu9ZY13}y1*U~mOJ
zbYkc*frf1(=tEz8u`J4Wc~D^z3Y~!3gzGTGb0PVaLOL3kRgQ3OX~zynM5g?c#0QC|
z1`h18=ow^w!K9Reu4+&3)T|h5vdI>kQ9Uy&s|3FH4en_h2g>vNrZg}0R-bxZ|I(c;
zlQ%A))3O%NoikiuYu+%=Rh43?b<f{0)hrX|MnroCuUX!=uGq7xW6AZWR5e|B=2@dP
zTqYg}Xj*Jsio?`N)H`sLJ=ABPr8YgOzU4;6GUbVNE@KURHyZ~G4C-C@4xP~`4R+>i
z3&J2wp8NcC)w&j*f(MZG`L4J^Y+&fdWD^QX2OlWR5yLp>V{D?!0GB!*x{cL97kqKa
zfA_5pSIHw3s<2h{*be&~<P9H-5S63#`Ofn_ONtnOM@_V!&o#$fj`_#d7VVoxBaf<)
zSZ2*4TaQ<(9M<gt`Xp+Vv?5ZhiK8?lOnPOUi7vYl8j}6K5BA@@_a10SE+?;k!W99>
z)06n#l<XUFNP`1n=|mi5>x>nq=U_SxzAk2rj=c_D#}~^~>wbTo{1`-aXpOJ9g1#(C
z+d1g%Uev`P!0jborg3q_aYeM`Bx`pm?O4K0ee%J)S$l}hncyk{BDS{@D>+T|$n#&0
ze!&zl(8t)Ik6EBczSRv^T(N7>BGw|4qX6fr<826m76OqO;f8BK&8)oFIqOoJGs#_=
z9^>d}Gu5{52-X|a^Nf%!zL8UTwU|A|TNoZlv&Z)zQqb`6{Rg?TbM~k;C%&-67Gs~?
z_P0^;+>BYi_i;$nqKJ!KU@*me!KoPd6yWf;08BX?f_xKl3%7Pn*w@g%efHTh)dfdY
zE)fCp#BrN|RsBos1Yg2#7!t0=Dk=Ldfpg@XJn-|v9OldzfFPFR8E$O1FPjrJ9G;d<
za&4I!S4n=6A=X}#pX@2MMCod0I8QmJ&|JTwW%jT;dww&?oY$Y96_;u%$jRuRH+8Nv
zhRWqD!lJ_)_MS0#VXHN(yJ_;wRLFf_V$7^RqTm4!z|t1~kG+D(IiP(1|Ijt%6;}}3
zpXwc9I%k3Hc>=rG_s4g!k~NKMN!Q^SrFbWagO(Kd;BTVv#)sStjFa=zub^ZsKsjV*
zN!&mZ6ux6&5(nf`9jPky#Kh;-X0^6(>&9O2`wWl0c%~<z{0!f9yCWhM;fmYlll<oF
zl9mF)pt*LSLE^J=(b+h!pz|-Kz#7KslQM0ZL!c_~p&g)CqZbNETOPFioWQ_A9{S9_
zEMeKk6PP)6kTh^!X5~4FsYArb>zQvZV5MXyBLdn+H=;`+=ZoFVknDYKe;6BePG3~)
zF49TFAYg^q*s!oDHnKOZ#>pf$^q+A+7CnGleFGzq^h1(xKwkR{7OLUHL7PU<5Cuwm
zL^MEMCe&3D=$Evr7<qRoZDI(48Q1X=1u68suue79Lafe2S8-}g#_U#WXFE;WJvgWY
z3plREm*N!005W2+9%lfL1Gct5H2BaLKgAf9mHeUEM;ctw*m<<fhnT74*0HDPX+`<I
zYmNEw@%izjGanK;<4G5ZXF?)hF5x83gMB-GA6_?s`+MPyg6!JB5}p+s9v={V@SJ2h
zW)?<nQ5Nq+R?PoFGm{LOQI0hVPea7>m52i1Cy5i1HZ{1{3X%()YcR}O?lu<AEd89m
zXv@+RGI|kbuP#XRmRh6qHEqsQ&n~pouTW+8PA_W8)AwsLE$%$fifNtBXfjSKmR{7#
z&NT2IFpo~04rQxtFI5Wn;6CI=aTn7iQN9Yv79w!ZWo{4V_ocnb7DNbUI;JSZAz=~t
zpoKJWZ367w0qO@!1@ze1>+5uKdr+_Nb6QJlnldpzFW(3SPG0o|K9}!8a-$;5_f1@P
zLw{k;vPfBkVi^@hqIIT~IH!J`wmeKZ<C`?gjA;$s+32BUon3++O4ix!$mw*~_<h!M
z>HZdEhPoT~`F@}G{G7l@3(<4tL-!p$?f<3+=pr9~Gh=0aN=p688Lg|>byaI&nbBBQ
z$bS=ON5>!N0ni`bF7MAPf&MsoKe<Mc-yfCklQ;Q&$$G@b%dJQ7<XXtbE8S<~m8?o^
z2HAL}`}YLzlWjs9_w?u17+(M8K)W^$hZ?Nr2(Bl<Nvb2e2F<v%&#dhvn@Pr&aZi(g
zWPEE-+7I}faLqk$V@IHk%UK)#pZ(=r7on1@6b8^Pw;Lp!(d~&1u`S%W4(G~GT%ASZ
z>WL@Fn-4FvTJ+1dx*BZasUeN}I-zHR%?dn%QA!=x;Rm<`bm0hqXW|*M(liK3AR;oB
zj<h3qR$gPq)t6mkDbB*&4f+<`bKtW5H#b~<`+Q<@r8pL?E+;L%`wBazH>5e5%glcx
zefZ97Ty7lo2K{3aCbQcFWkJCrq9K?JSsQ#0%G!DT=6!o_ym#ypR{1S+$v3{cuNbc=
zSYaX5F04)>IH8$K8uzydRZ1ERI_3C2BSenyc-@S0AcAy$eSbk@es^(NmO3uOdhU4{
zxh&YBccfTlpFXdswLiDKxzd}nggy`+IVcZ{hRl<WqrHm>4xQK?Fj6dzj8ddDPj2hN
zNtUL@$;~N{A`XN1%)}VuxqabSHdjiIFd<qe@j10hUp+h2oWJA3Jvl+fbOKHn!lW>d
zxqdY}sRSy-vK=0yBW6K7VQsK$j=%$%0}+^EPH<HQuI8F;Gc!8370(K+&eHh!<0y&8
zOo<lNIr{1}dfx;sF=3i-@g9uc#dadt$N^%A;Sfl<82o<Xn4;o6Bch4N4s8+@ES9L)
zgxI2&Xj4QUOO$G$*_(zZ*6Ua-(J&--kkiTF-KVOJMh$t~;MD7L^u9`sk!$(P`hp~*
z+d%HnB_!y4%|@5eSg0o-F{y;<bD94K;@~m8BE!AV>|zs)5t40APQG5#0}bwimMX~x
zI42`3HYUsQEo^|kuCAsNn*kw@0Pp(({sQ31f9x?}@EVk4`h4a!zyfi4BE-@S<<2~v
zF3&mdY-3Dj<LrXbUz~@tX-E*x$%vxo%qhSb`GH^@&avzt!6;?0XAI%=U{J?_ISSQm
zC?{kYBKbiL$Kjx<qXqz8MK>Q2Wj2nzUe_!OS1k0x@*x8>2Pm@wGHHv&wH?==z^Z$E
zFP7Wcwl47mG9Ghf3F;3{fcwk}fE+K71w_R5*FZ}y!IbAMU`92*<1r|){KrGyOX1(7
zF!`jqvfa5>7fvir`^vKD)b8#B<efxgvWcZ<46}I}a-35#Tk6Sge=h$3`r<}k9Ec8*
z$?c#9ZUbe<+gwt_A4aYNk@#5<Ao1vBc-UwuFDW+JvJH^0MKQ|cC{Aylmytc#-O%HW
zS4O8dl-jB%O}Z*8D@L7}mYS)K&7dETXkz8^un4nVuStuGOV+FM7SC)ODKQtd^m-cC
zbysU6BNWlTo03XhC6nUgt4h6P2K2N7m~SNC<D`On91~CAp~m+Lkd;}`oOBj+Uy2k<
zvRk_|3rgyXv*tFIb~a^1=}(`Tk{)Z%|M+8*H99uUQqWw1$hCDXITw=e^~Hs5k6b3J
zDRmX=iAZ~pb1%`D8b2f4sMG1g36$4}VC#z`-+-2vp-0c4Z?L;fWNr`ETwJ1fGG4!}
zl6)^lEY=y3*Xs20QYI<#ceqFW7mRblQxpE(7$>{`GF^W{Pt6B&=XW`j2jg|yE6J>p
zSn@rQE5|FoaCg#O;8Gg@YB={FLVa4CXl7ctfM*u-N<79<lRF;BpK!_}%=zgnQ?nD4
z%IeBpk$tpr>>k=UKhk^=In<Zia@xY&iZj+%m6ZAnTer?%v}pd;t>lYfOeE$vua@#v
zfJ)$8q?Dvoicb+dnlK*2it(^?man3Imha22ELvjEWeF?XIktXRR8nJeTGuKUENe(B
zT3geWoPdlK6{X|pp;+pul?7a`LYpje3QkfnpXROgu~^HzCy=z+S(FNnDSx6jq0vhw
z#G?7*UcQ7lHD)u5R%6Bym6P=NsT3B;CPn(qbd=cPAztty@E#V;`o!L(%201oIdo25
zw(T7^qCqBLS}3=uQ70NxvMttJYhsG_QlmK`#Yhe2_#}<5P?H>=VjzZ;1athQ+LS~*
zV#!X4PtcH=^PY%^2vhwvDl9Vmu}*TRsL7QQBa_KvQ@pb(>t<v|_r*CHi;Ei_aedL5
zGwLd5c~fGsDq>PxO+^p)^*y{HvB+pB)LnhGuFzmCO5A{ZSPv#-DS8iQow0w%dI$zF
zk%&n!`4eBA;}Q5I+UN1SHG42WzofP}zrWeN!W)sl)ago%Nw;pf*kp-{wWm7grbguT
zkYBXL#YJp&R)P9x!&D39a;-(L3#Xl8m=3<SN`-7;R2U{7RKw4*?nqvw%Hw;H+Rhb4
znL;1&;92Kj7ZRq4c!VG9BBC~3uXe=ve#Y0sYMWMLi6P7<pVvvB1Kxed@J_sQuz36~
z!$y9WY;9uLSb>!|OrJZ(gY@`aImUx@|BLp8DSc-j)4{x>JV^WcF2W+kVmyAQ-#Ow!
z%K8MZZUIaZcr4}+4`!L<!5m^yVt7U4)Cut>C&Q~GlXj0fULS8UQd4?jeB6P^h;Y@8
zcZPsB%`Q_c@Fph3GpnkoF-NcLM}C8nGZTxA2Dk1ia_FJ{en$0p+nnkh4p6;oIMs`U
zWjv1e$t2M#7Id7uk%C@Th|IT~>+5CD#v4U>q$(`3v@JizU`3{wh%kkysH`MW+sUCt
zhImKY)I@i&MzKsDq1D9Y7FDE_R|KgP^keiLw35o`Lco(WAnP4Be+b=OKw{62j&74B
z85@mB^0sKz`7xyMuZASqB!z-T%H;B@@LY1J&{t2+@_nT@8udi$JCi(6Xf(X7PSt2_
z>bG+P5Klq7A-<Yy9V2f@+)LZYoEJ#@Ha>fY?(Oftmv@%s{rv%_m8E=sA(EH01321V
zO){j^fn6&K3RZMUY3PxPFE0Be$GZakG9Kv{ldjl*3%vNLaqIn;kT&wH)G^kn#qdR<
zLM8Ho<s;q&v%s-_O<dIy)0N~HmUa?k3TfQp$l2X3nQaw?^HamE9vhN^#oCfB9;-%M
zIqlk*D3%j!JNfm3GZ(CInrzh(G5Sdr<zW4W+Qdwwsx!v-D9;E+Z)PhRa3LQ7E-Acq
zzC8%2QTPFoP%{V1voQ&IHl`#y-Fm&-8Cw8@O9t|6EX&IqCch!YP8XrZa`-75sVM7K
z$GTSbAXO3@r5d$=6MzhtI=MY#DiU-1Ku#DmR<2~vh57Sn4xZC;9xF1RQU!!?md(z~
zipIwC5J1y|{RGXqBRb1t&0JWh%BnVM%n^wZv5Kz$c4I@3n47AOS74p^RJpaeF*;dz
zFA0xUITNZ36$Vn}dkm>L`n0j+d8{GcCZj)4sdD<$R*bpKz`Q&SS)H8_<U6S&&ijFw
zVnH^{=SU3oEj{J5ZPnG=PCIRTb@lesrncK`?Ng`Dv|49|D-`D{6cP@NxLhOMy(?Xd
z6Y44}Y7-J_D=O;}NXDDVzLjaOypl#Xo8Ck(m@g@VN6?p4X+Xp|8?1<4JHvQt+p=fZ
z*7H9+f7`A-7nAnA<k0`d#{S33<MZY*c(R`Viubua6O^3IX<$m-++z2LAu**qJvMiV
zbLtfGPsC=tJ3+6C>(lDIB_HvXBLjx6rX7K~<94Zl9+i7-GLOxdw$cROFhXT*duP5X
zfZwMsT0|~j6)@?B?L9!L;G7a%voS}sv22wvT6Ay=?eb+2)7j*@i;t-U6#)k5iP#cS
z2Xt*goo=ue)}MnHi*aLXc}-j1>^rtcA-$?Z#Ehhn8U>98tBaZQ;*bId*O%ya(vBmy
zq-_VahA)gbre_A8FQ&r(EAgS8Kk^~<VxS~p_JYjJ&MBT5HK{7iaHGi<9c4AYaOM^=
zDS2{b)#PM|$9;stO)t?D*?9|}1(vDsSGpQ4FnzH_TB`w45tINJ9zs-SP1s<UB3oxK
zaAbB&_O#U5RGMWCkjYJX&!4sB`X7HhrlE`^shwd=5_s&d^q+sWB{p-!IBR}p=A3#@
zYfWmT7A={hO*#MAu!U~jal)1YqtYT0Q9RmWQZ+l#iJc<%9L1`KlMLrnE*F|WYNjA%
z#Be2xkThKK^_@m|?u13E!j1hk5ytFDh+a4evF7VdFV5`EK)3RzR@uU%ikh>`)|ix>
zr^ulmZG2j7xm({*7`8~RO;ICDW#&rOp<6lpldzlYMcA|mQ?etegW+za|5x5i3HI38
z9@)81@D~O2nR{Q57tu*=T^SkeHH9rTn1R75NhwiD+0Wg1K5^eoiZ+p=q?)oyKHI%)
zwiD75=iI}3aZgtlzoHq$kNuJS57apz`Ej)t@*Q9y8(`cG;S~h|rExI(!7r(8t)}q2
z`ML0vO-|iVS(dwCddg`H5o&L>rO>0brk#;nsB?6IYKJN2VX(3ojXowkCAPA%qB>ro
z!Y#R4t&a^)iOML+aFr*4mM~87Ga@(y@$V!V&XgeU#9i8vrOJlmS)pEE=q#V%h;;On
z_N^@}T)UC1@LfWF4v*=g`pVL>a>Q2eiB{#0^voa0e`PkKTPbMkP_V6l%!{3KD5^6N
z*9IhEag{&rTT@uLrmtdNrphs+JlCbwxpIo8XGdjs5vy-2`8j`Ne$PmLR8$Y5F_xE=
zR_bY2bi^yOXQQPm(EK+kJDn7uNuhg}*LMtNWlhS?mR9}SPPY?3SR>3gjHGZIp%ifv
zvmW|h=$_||osWcWX*jccdE(xM!V9KMcmpT(Bao93G!1G3<|O8xQ0eO_#Thefi38c$
zRlG+bu?ODI_Bfp$xDl~DrUG??Z$(2!Ph^-n?taQ@6xm@f1IJOAtPWhXBhi{%nH%F>
zxhY%`y@S;G){)CM`o8+i6t6W-g;6KP_p^PnA<Fk2edyBWW@#-P77f5i$ujO>Eig|u
zrq__{FwEDJuYjYJ8`M<WQ<{jZ$Fr9><BK|dKW-<PSCCfVXKbe3p2>0`|7I-dZ|+~7
zoxL2F5@Qrw4Ua5Z)M2bFDXugkYgb97kzq#yTK$Rqgi{{@&KywpGXBOqP(vJ0-OPie
zf^rAcu&NmqDN*5Td$W>~v)>bA3uo0PCCe?lGL)8#*vvewCbx~`T!NZKL|dmxmQ3?J
z8mBpDRBwpD(UkNeOJ-?WtkM_D^USIJUJhp##|N52$iL&W#t0J=*^UACg(SHsz0DGT
zT%h}$?X|k9^eN8QP5^w-KL*Mi2c1{I-}MAkh%o`i7L`zDlI+<FGqXCTcw1{zRoZ2Z
zDb|>1#%nH~Nj4orn;E+yBh2#uHOn1DnO`);$z@pC;4yc6?^7|<`;;m*UK>qFwK~e3
zS40wRERBfMQq^8(nZueIzdOO4n1)0Gn?zzxOEf3GyYBny&Z3kUx$L^AWQ`^%>Uy@{
zDe9<cm}!rQHiqxp7jBG>w6`@74UWi(6C`-}<Vbcu=1D0LLc3%&W1#1fnVk(Eay*mZ
zC22k*N3G7u$jDWzbC(k9iL+^+iqu%3y-JL}5LkxUo#<~Wh3_`#Bn=}|Z~s$ml#g!d
zl_^9ma`K8LvN%(|EhbYZk5eR=!{*8o)Vf&mtnZGf<mm7?O~fZ!hZQ_)2^`y#eJ{kq
zXhelZH2E5IUfkQ%3)v1-FT^wSu@pzm=2GR8&{I{tr`Ho*sQQa#7tW;`ydBMU5sY4j
zysA0k7R_)n=z02J_Pp8Yiiepp?NUvi*BEC@O!Qji8FQWXs+@SolrF9c>w}K%0MoIJ
zmG!H#>Rs8n>NrEUDM??@QqnX~ZDW>oNM%jH5=rkH>St<a-aMgxrsF4i|EvzC=?-#d
zpQ`ZxvnFOyK)?3?hdzcvAJfJ4F(UI>VICp@4i%z5wMz%=kFS*>r4b7v^?yb+BfsGW
z^249h&d9lTq#-a9R;=3m5FPxuKjjIu5)F6Uu|VbhL)FAMApeYlf=m6h06mg)BVe6J
z&UYWbAI#y2+W351ZMhbvA&HAOB&H!`cV=>Y>;qgw^7Z=Z-an@!IY`{Te*}C?Eu3<)
ze0#_1hn;aoP!jB}v4_BUavah4V@=IL-`OYZ$Wy+D1L_+1e{AUQCtjYB&Ho#g`#Jv?
zn80_#Mpv_`$qvE<S|g(sS|fX6d@R=*ZGU^n_vH@|n*NOD=po4Y61FT3U<=#VVK<eA
zk+U_+c2nb0?BW}4n6L7^9#E_V5rFaLarFw;KGQ_~m(wq91!oM1*D!&KK|9m*IPsL7
z?owQ3)I;OWr6E-FP$)TLyG4J6IEcPU+IHxdLe6$bM2r#rXk<eOQLzlD^NQouNUT$u
zCd-(IBM{k{le^9h=v|)Zi*?U!$oCrJ3|*F#{H3$!oHosYgbf%5D^SKr5a~TWMA&%P
zf3C~vz2SyFReGS}P=Ew#V%ZjcqKC-u+_n-(GtE6*!JLlo-^vC935ux}TqH5Sps_h;
zdYLsTB_%1TpgJwB6f$8=Ud4)8dD$)A?j_!Zo7y)0wP<KMxvXK@+!?xp*^}~f^Ybd^
zcoV`DwQ*|a%yrYM+cSE4s@KjfJZ~eSYJkIJfNFgR$xUR@z=KpP)KJd05EJx0Z6H&V
z6RV)}$!JJ+78(qNp*o-ZVMd(}pHS^1L!^||<hKxb9?|>+@vM0#sfN*K(^XdmH3tI&
zKIjf$3_*{T(7`YaJ&{N2;x9J;ci$@R(Ha@Pvi?#`Wj1;BH=grU`>Su0?|A|hCHPWE
zJz%!S`o^+71U;s<R3F&du{9=Q88d&@)f7aCbG<069mG`#t{%<NS{m=g7x$?;w(Pld
z8&ox0ckS5%RZS3WLKQa9^7vQL4?`e^HF;bgR>e-AxKlyyTA*4!mPu}vaM-6F9NfHp
zJ5{rM!pPr)9#)|)DYF~)0>|ioM2Xh175|7KA*C!mCTFp8>SS_|ZhQB}8=2<hC~Z)1
zYA|X@-iUS{to_)!u~tOT@&}DcmPwA7{GnXb`}+1Z0NK%X&LdvmbLejw`U@XB4pBYR
zM+V_3vOSFC!phdZon=pFdl)*vI=T3worYv{Z9$ZG<z~WmF#*UP-iUO*wH9P8Z_0B$
zev`c(`-!tqJv4r>3G#?^3dRZGf%+?S!)Ib;;9H1P$?aU&)L=>IapKAYZ;_yE$+c*3
zDBIn=5{9)-o+`fG_h?zODZDovN1}~ZBu^f<!4)8Be6vcjvoV8~wWW>}XC7^bgS`DK
zv{9@dBIn$YE0{+ZCkX)?;K_UQLimEnnm^wotlqdk>=fi+wnKi6+x5A&?KPaFVS5C?
zkz3rj<>p&F1CLYTEyTBC8l)E3mJeZP#CfgcbDEy6<l>*?amu%hIIe)5Bj>uzm72tP
z3ZgTr9g;ERQb`smY|AfQ?R#wpWBh4Dw{+5sDw}JPnQ(hZfZ0Xl&#ao#@4B5F3K~cb
z!aO2kHLZl9`4Fr{l0QPg2U1cp9mgC(_CIQ0oG^9a$&4Zc0~bR*c{0NY8-F7W+9v>`
zATK22UZ-)cfStl#Hz&`Y6}wGZz+i;F&nnyVVwGJ9$d2_-t~Z6x#t<LFv3{pP7EP{y
zI(=FE)HebwdT?+D6uA=^G^Yk!6U?M^t{Grb1@}2Uj#ii?-+1G&s;_6Fa(MP^`Br+`
zQOg%gN$~iGL_6;zsKU{nrYAKBEqWYozLN|7j9Ew;)yYjmz)9{6LJ=dHehQp~HF0L?
z_}#~YcgdDoAMPSPsW=U><rKo(+}l*Lbu&xk*V4NSih=(&P=_e2N_c33I^g^zQh$RG
z7$i@9F5ycCn&3{9#4v);&_QB8OT!j4huPu_b8QO>K?kO%_CWK$Ts3QEU42_hk}XMJ
zSprkMLNPBoR_R&U*}JNMQ7GOf&LgFZllaQoOUC@a<G!@waG&xON4CH-k=^GOV)i`!
zAL}{UV*edI*ZA|v+n5(<ECar!aGmFl986DqtZ(W6tWDEw3R`JOGW>@erDy)9)OQWp
ztO)n{!sk@a%g^rrCtOR1;A;iXQg8N*57JhIE84zsSY|dgb}`RV$&!o6paGlh_9ZMX
zsC1Y0?K`P&ovg>)9>;qOd6@OM?RTtL9xsqnKo+xH@L~^tbS~7RZFL(-@nzEfe%?qy
z!3a(ltJT@*{P(-HwIs#0vbTF>LBUF9Y#B<ZE-$N&kFPE(uTEfa=IwDfH%M?sBuv&j
zu7BkBW2N2|vb&O{2;&oR6Mf#^!p0}vWpgFn-BNwzSwzbW+}&2iV%2eb46j!v)mzO*
z4bI2?UD(<@u?HzE4Sg#0xCcyt%^eDroY4Z;-t!hB(Si~favM$&i$bHniR%~s*n^a9
ze`aSmE3VIPFCEu8cv5bio17Ncyu?*+rq_kE>HAU-m8A$M%%le3npU!b1Zh6b%d-;&
zpnPdwyUU>TGCFTTgsQZ%)blRhm|2pd_jLL8@7}!m+%1I{U*AgNok^yK+4<jnRop%~
zExoqDc=PYyefRqtNLw#s{y;PzZLl0Oe7`~<x1}8|ZAIb$(sxJM#WJQ(e<oDYA}ney
zqVjQ{3g%(MV=x2`v5)(UayB2-Y#wnJb(*{LB2qhZY#Fgp*5r$~Skq(DT+V^~2=8)F
z)1v&6nv(qdA@WOD)Iym;sf7bY7@`D+>+}|_T)q&8c8g2Ot6<yr6crb1K|LeEEn+dM
z1n4t^7LcQuQz+-4C$ZV97(dC#Wc=hr94arAzW`qxkd2|w1r3C#jPJmAu^Q0|6--Kk
zM}9!(2p3GKUOBE-!y@@BK3Ukg)ike0$<6{v3gCd&<3v{Lbl0;5!(A<owhDJ|T7<=G
zvt?@48OT#CS+1j_ndN%N-%@@5Nu>({=Iio^7(?}><D0KV|NDTQ6|hrr-z-7N&vZcS
z1imp}Wp--T!r%e8Jn};Lw%a7W>f=Bl7xeeP!uTXGD>B5!$s>Y5_Ox>?+zEvR+A%+B
z_{R2=$qI7r*hMZl(Oh8P35c8gVN9DePP;ds!stgfyz3{?#~`~<rZ7MTP60A2^RC1y
zU@-yN9$m_@M9tWw6z>+rYt*-ojEvApI63--CQXyMppMNb+nHzMyrn{rsoD2>)SSv|
zmYdl3X#9N+YE}q}U)c9X@H-p-uH@N8%J7{<2T=%N5$x~Pc;3PP9-hIzyYTm7{`UwU
z`(BRkIsAL1mVI~lZ$U2DPAcVsZN(k6{{iHJZKqN$*f!kB^*?}Iu=8-|GGt?Ace4Gr
zAs6gi+}VpeEx4n{Gn)}FS;_^=p2_gvid?X5xU(A1u$l{SXEl3ETobrs##=pPChn{a
z)a=1CXYu}=5_raqJ8St{r?NYMwu5w$(~+MlhQ+oDX!jJ7g(D=N7{~K}l{Z?fQ_IR5
zt@sUXxXl<J9v&}-XLPr;bZ1DvXL%Z@y7ff`IB){sA^YwUvRTCbn4Q$rApZf(7CI$_
z3omnF@m@02CsRgzn(6yAJ|TkCERGdrpGQPAh7*VJ0pI;ZjtPK<0X>`}5^f7t+LXwu
z88pI-FG8LS9s3tAsgvC#R=P@!@cz_#isQpgwfe-w2ojfJtBQ&t5h9scu9R84>9)!Y
zWHfIR<tkmQK^sODRIPfPwN`-ERs$Zn5;P=o$)anG$G%`&qkv{6*b!!U`79FAKIDdc
ziy;YKs)huuPN`3bOEN=uRpzWMPO7gcpKLPb)QI6krf4K2JgFov(``g33bQ_3qt4B;
z6xSD2o2{K~ljr2bq9<m+t_R}=cLUv4BF#LM7B)L^!82z4@&&Rm#e;H@B<Xy+i6KH8
zK9|uf4|;zVdY_2>h<AKGL$tNnV+9Ta1f&a4ekR!2x$cHL!r<$>Wi?4DmaG)hl*+CK
zbCxxwrW12*uvrWdM!m@pZqVs;;d(LLke{CFk&Cj*tc-kJL0ML%Oq6?4O9~Ie*EPvt
zNYWd^Z`LGe^kLyTTreg#`nMMSV^&^l@uUeHKM^g-=RwU(U^~dQUr$D4<!R-{Vv9a0
zMj_WHnAExib&}aYlgpix%1rg;74=C5XANqXD;i*9PA<;NDm0i(W__5JfwsIhZ<58*
zIdjUK92h@|{}oar%p}h<*or)lpo?b&6tl9NnVF;})0K%Itg;f}C9;s@fFiVkC$NZu
zFOggD9ik57$VjBSndEeLOHYa^{K;9IyG(c!e>Y=3-y<)B^K}WYGKom&f?xz)74CnE
z`wH#@42Ep?BB&R?oU(6!^Waiq+PANH=>U288S_614qQ_pUC;w&wb33qcaOCjVhRyq
zmzFCn_K&7tQ5W`2QsU^0No1q%6r@`6?I1k(YeM|kPuOBM`Q9B`05cG$wsbA1oho2Y
zg}H|z4)b=?gn0HL&aRy<y(=<4D#{XZ|BbKz^AjF|fTqgEZlEmGfjS{v3^S{Juag1N
z5R4g$KfDLCDkK}|3q5G%NJJ`b)Itu_92QK_M91y>Oyh|VOi0fwhx<=N_}X*BvWm-G
z(NR%3ZkJtI=+=nzp;6-WT})P@oSiY<yk-M|Bj$Qo`IF1C_0D)Qi|yb4-TF!!>BBF!
zLYQQ=4$2Y6`!X?$6WlFIg1ZK;|A70qsAQeMh>5#rC?|VidqHQNR?MiVO0#FG)tUB^
zmcrQRl$`96gi&gfkL@A!A;*GQv-%v7vC39$z9TbVODG){k+YA7^0}v`1~9Op4_?4P
zI&qykzD^n4g?b=p-b+LFZM5x{OOr4P!+u^*ebUT=<(aU-I-TTly^oS_^}ci>%2bMX
zo<!U=`<!W0`rRV!GJ2ej0%KQK*Phw4f00Fo!5KA-^DyCY;c?P|6JWK#!pDKrG5)7%
z3b+`<X~d7CDZWK($z}ABF(v(lL99T?LzKUD(EO!v&y}Mh;Am`C964|ySd_a^WTer+
z&LJ{6Smy#+bQhA@WlLL~&eo-6<<hmuu2kB?j262|D{52HP1VWvWKU9h5?vSaP&s?a
zR}hw_RHlW2X5hFjpqOKHWS3?k2uF^!i;V_y8Owc(%(LfUG?dRS<M7g{dw6Q<Y~zP<
zVCsOznXTH>BgB_Z8I?!K<tV$?z92@Bm1B3)JHyAG9U=dYPKw5l&o)Af!p9yR8DTIe
zgY4J_=}V2Z!R(GKi89wAb6qwL%xe(fHIC(0W_EclNb}^%$q6YQ8zM&LRix!ib#7Om
zMc$A_s!|k&l9Wu32$AgXj)bh~?(x*hzEf^G6%5+r8;#XRP79C9&gJQqF-v;*$Gk}Q
zj-UKsjuSX^0gLC6kh%!V9NGa0O&(&Ym}W~Ub0*eJYfMQ@pWT|2V2YN-YISP4OdH>(
zNUKSjGC8x2?#-I+E$ygDj<c8(!-u1+>2Yz^Y?Cn^iB=81Hxn`p(;_14CX-=z6E=1-
z0THHUR>0W;O=2;V*f8`XN1w2wnaBp50QCU!x}e(=<y>}_H2>f|l2QS@hTEUc@XRqL
zsBTf|!y-l5)}r?Kc-0N6cvU1tc*IS;Q>XU!PMg-7Y9xl#RK5Nj-)&ILo$H0qY`>u>
zA<>)Y8=<Fr4F=zJh9Z-xIEnoAoz|YNmX@xb*6H?=BD=k)#O`~dkr|$aLK-1FCc2po
z2pq_52aK2{KnD&B4@}#VWIc&8#FT|8bb4f2)+f;jgQ+T`!jqu3l%*Q=ZWEVls&Hmu
z9W)c13d4)eYeOOH>gE*W)pok*x9{N}Ywg5YU{9Q77J5jk7T)8v3kbO3eJ@ZY>O-_F
z;WD266}@N1e?*K9C{8can@oB$%l2xfkFd<Hl~R^hyp@2rwg%pU$A&vd^RS0#Ht8)M
zv)N<Oo9HI~j@iO8!{V)z<rU8MR|uQ@Z!wx-0L9wW-TegFgLm?g9cc^lu;M;qvbeT%
zcT*4kAW+{Wbc+ApU<P04xsRK{cS(r<5S^I7m-vfmiT^<<e{bmf%a6+6>${8U{f|od
zdqrgDJ*(=2Ec(TQ6_u<PNJI>3$8!6Edm^hb&)@62p=Vb)Dd<H4-!H1J&%3wkdI*2S
zHy;@&-$pJSJjv=|IqGjd&%QNmYsLli)j(=u_LRf_vXmtmPhl%%aLwXLk}n!hl8m}G
zQLF#ol;>ea{%UEX9mvDHe6l>XsmR;J(lF=c=1fe(OnskGjsIUD#N7MpI2s~JX2LqU
z+KhR0TP$wOrdgL_(xcE{Qd}(4FS7nxTqzYM14JSeHo8IT^1mkK`z5CFoZ8^Q=?a|<
zk=J}rjVJug&$1RF;jgMHOqX?{guke9AD!+02R|Jwh@i4=pOo+z(w2p$_zxnPH$*Ry
zE9D?QbFQyYKAaezl^C1f>@>rlrZ+r6pP-7E92f1$PAxPmq#29yKSO_zW{k~)9p$z)
z<-5CAmyXgO?#sQt3WbemJx%k!0{=E9;6ZoE-DQ+Y?xEy+ezH8R*;CY%u9)o12awYu
zGV3z&6JfP57gOx5_5R!FS8SIef+~0+C3B*nL>M*OR&5;7#AV85DU`(Os6JMglU0_a
zGG@nH>^ey5eg!$te+RV)VR##68+Kahu#_gnIh9-xOoqbRsrOI!KkI*;$(_oOHPFX#
zI5Uuf8hCn@e~$k-|G)4Y$W7>zwve}G1y@T!N{Z7wG26A@<X8E>@bkRfN&uUkhzR86
zKH!>UqNJ$9t4=F8L0)cuqTk_v1^g7Sv;z>>w=sC|9Mz|kN;#@ko~fCth_Kvaa#R!F
zd49M5ZU39>ZRJtezOr7C))YuOo|l`O5$Ry_;E0sw!MDf1!2h)WaYjFsz@bv#Yn41_
zb{=^}xCYqDc9ASffL_6NU|uV8m3OT(s)<2Upp=nRNPZdveO_bq<keeZ5?#sZP9xiQ
zB$6MH2Yn02jiZCDhxejOUN7>X&qq*oYbxF1sL#%>cVr`OI;bG>klqGLhZ!@3!2X=9
zEMyJ0OB)5utYAl`(0_>v)&llvSdT|=ydlw;nG}=Xl#}93r5)k%h6GjQln@-3vb2jU
z@GiL0(Rtb#zLTSJwTq=UIwlZ`gLC1^kNINx-iL!VX}FN$J~9KSX>m?&Ue08BIva4R
zym5EN&Gaecd$$B~zu&W_7*euS&vJ1wdIV|bm>z}D3o%G9CUg;W>^4KH#jG_%l|<xZ
z80^-RSfi>`smYko>nErxHd++5@ssLg$RiFX2VHzlDLiof*CH?cE^!8EFW}DTG^4&8
z5{3=-O<@<?&wg-2!5(^Wou|FMWX-u3=R-=PLMAmKBU#`r4Ro;VHI||M#=*1go5L=&
zlk2AKDWC_}l(e^de9a^I(mUi;aS2+2a(Db4;MS2DRF1!%Z_tsn_~@*<jPl$-HJg-r
zwMHIU855SBp6w1BhusFijuF};(C4!OtaW?FaYH!)YWca&b#QnaZ{VrGq(oqX+ITY&
z6)|C1cGe8<c?@}o{&a+warjJGT_%ynpYF@Mp$Y|0!p;b2uD}@0A<#VTEE+bXUl_JI
z<Lo3heH!EV^u-xeC1Dyz5aL&2=AuMMkdtaf8Xa?F<{<Hul5TNXpjTMKIM{6`-M&{}
zthvTXcXxHYHmk>tK23N|gWakI&lQkt->cmhJFmfmq+o-)2Lx3pg>T|KF`d)GMD#yo
z6^2qnJL(|r<mBw+<kOOpoXN>{V)4CCug2CQ$&)PoK6@rwu7Or}Ch9{pXUsU>;_I3j
z@34b$)sQ&fH+wTQ+Dv<fm_E~yo~zcT=caQgW|Hm5q04QGnh@xX^Gr6>zmBubf-I{S
zY%{7#sm;EF4gOK8ii;6t`h@yMQPjgN(vVm%Dfu7my&m+%L0Ro{P`i!mo{n3;q@|EL
z8uI!0ZAN7!Cuf<S0z9&lPtf+RWB@Gq!*I$%wZtgS=UQe^T1aU@xEL_Do9!B{!)~8b
z{-Q&ipOy!}<fUEIy?{9xK(2O>EgZ*Sxx<R(k`VV457t1I*te8#$@ptnj8qMMtN4^t
ziYLDpgs_O2slv>7$7ecZh_;Z=a)gQ@VNN#58~Nx+jPDzy%kz#81s{Hz$#AETmXR89
z6Kdr0Qz-7R$qJ?DB$eY%#H7Dv#U~|Yn@sd3slNB;EcA9tAIGtv`eayu?j3(de(`-v
zVoxv?PV|?;R`VS-z@D4Malj)*B$4(^T%IumtT*r^kkkY@qLLA~3#OdjSC^Jh(p$g&
z)XeVbiPe+zN>jbV;)o-}QQ*Ldbw|aF0+QEuQ5$_gmQ>Y$!K|i{#<b<9G%s;Sm@Q?|
z(ME4>y*qtYebe%Wj2Q8vwsTq-{IdNUX^I#RujoRSO>EqL#1*2_!3@3whHRk^DsIy4
zcF8}U?Oj+QcGudXh^#e5iRs1&i{q@;s>HJ1dh1_W!b@gV=<QB*RC4^r=1EEAy>p|N
zM?b1rt~pUq?`1@cNSYASdu;LLm(%YL9KfD5!+$rj_m!d7%<gX&1TT1ohD~#DzZ2Lh
z9c@?r%-Q37x3I@``3a1x+Me_tvST=7*~}ALSkWq4Bp+i>oPrh1K6BsX37#~N499J3
zo^j~ltYJ0I8a5;s6dR4j1+fLCNzo3RH5|^*Uw&5X^4OcyD>Sqhak4u^f|CKomGML-
z>(Im$tnBF>arsL2?4d>+&EgRFfzE>_hehqu^FCnntp_iYnzb{95-VIo18rdrg=D8t
z5_MQ<c|vs^LKw`e+__0b1|xj!<mCuoaYI=3`h_KJw&+MlzDrkH7EU4>8==cm$cI$1
z8#kAAbX?HcncjVRc~s;Om5GEZCQpUO7$^Y!AJ+~@KB)PC#vkbi;tVdOO^1?ZL-;}z
zdX1+YI)O)2Mx{z7UgB+oPT+o3LL}JEtn=h&;m22h8ND1oTp3_6kfi}-z>uU2xH6y&
zIRA}?z9~00d_M&cnyCGQ7WxnMf9Q$@y@CUo>yLDR4R;dq>Tdb=??w^W`$THM$7*V7
ze2Cz}G{DRrbq#cp!Dy#EUhk0}VKasp>|B^kx7h-*DC7Y!SpXt83hC}$p6gu9f~L45
z#a}X<YPB=t=jhCaIR&HSZ+m6C@#DMYI&wXJLW8GF)8u7k=V`_xr>v}Kt*mUV!0f>;
zFS0mYEVcmiajyZCnCm}NPL3<ng5OUZ*@n%h5`}ftjw1eR1d(mF=uBcWlzE7BBbz3s
z@W?kj(hbpyVX`JMS$~F}MY>VSv_vjWPTL{BL^dklIkxm>a<lAu4B`J6`sVS5DGm5x
zs{^tFaz#o}L#2rIqB1mcD4YRcZM3sO&v^2!XD(kIp;91%DEuu)NvSWLl6Ub7itNA2
z$=Qdv>!s$9kKT2cYtEcAJ37!pi=aegCZ<bgaw~QMX-az~Qh<9Q1~JD=QcyRizNKPT
z`5s>(dBIos@I9t`pT8>Q>Y9Op*O@1y91+MKK_2(JcnvJBQ7&K)0>%o<CNBBTN(X(8
zreaKfB477==KKD=(7o`-lLR5Js(e42{+zkmHFhv_WfpxS7=}D}oe++kEL*UgVTD9p
z4+q93#au#*Y)8&|7kX@w8E%g59ogOE>V3Dz*+U%A#|)o<($cbwWp>|CdQZBT2#w9+
zlh9k41S|UUIIK9mC!F4&98$l#7rKe9px^V<Nr05MGHZmo1~XSL3W6ngod6!}`~>k0
z#931ci%{?_<e$jDTc9PKEi4nR6}}}p0!L<YFHNM2=r;Nh4$({#&k*;C?~A`7C6HCt
zCR--EPWG-`EuSjiB7aqpq{vgWD^6GZQ}Kh+s4P^TrhHiWZCGB|(y%Sz^6;GShVbF=
zec=y;{}y46m=Uop;+2U1MS3GUBhQSyHu4uJP^YREtDcP#qgtc(Mcp6ucGRa)-$m2t
z^ytRu3!@K4|2IYvV~eSbSsQap%mXpc#QZDfgIE%4jqQ#djeQ{Y$2etNe4I0`JZ@TC
zN8E<EgX&r89`!o)dFnmt>(qCuA5lNAeqH^M`jGlpjY89;>Cp6RMl@$=Hfo;LysCLu
z^SR~+t)NwDjoMUgp0-RoMLSd5s~yrlqkTpDgHF(?bVgmOE>Bmco1$ye_2>q5r|6#4
z{ZlXMWAtAA9Q{K53jO2ygNA5Bf+5{dfaC0qhFOL_!?58NW3(~BxXyU4ajWri;{oH{
z@rL-i_}2KL_*3KWh<`Z#x%k)OKaBr6{+9%KLR>;}f+NA5Fe#xap(CL`VI<*<gpCP1
z6Ru3SCE@-=b)qS;GqFE$B=Ika=O=DUydv>H;$4Z4C3%vnlbVw{lKPWYB>g4niRAEP
zZL&EzE7_AgDS2A*oaBYc%acz_J~w%*$zpPvx=c$<t4!-n8%;Y*`%E{Q?lV1Q`e#aF
zialjs%950ADR-qjn(_~Ggjr{<HaD3&%nQxS&8L~qHD6-B%>25g+%m;-mgOSLZp+n{
zTP^on<E>{}AGSVc{od-cO|nh1&9N=84cpe)&arK=U1qz^cBkzT+w->9Z6Ddbw*8VS
zON~iQOtq&Lq*kOhraqi{I4v#h%(PF^C#PSSzCZnz^k>q4v&Y!2cDH@A{k05DMqS1k
z8IL*Sjt0j~j-NA2GSA3-BJ=mG^sK?GOR|2=Zp>bj{f={)bFcFn=grPTIl7#*9A}O@
zr#z=FrzxjBrz@vFXIajgob@^9=UkFAnsZgoO*wbvJe>1P&OdXLa%bm0n)_Dn_j$2-
zsd-I#19=bR{gPjiKRbUU|HAxx@_#8%6{HueEZAOfPr*|K9~J!Q(z-HSjjnFjkn1eh
z#jaaiZxs^!FDhJKcy8eXg=2+d?s9j7yTje@9&w-H-sm26U+ccZ{jmEv_iOGC-Cw)M
zJW-x_Pa1aAb)Htwe9tn^I?uVDt)9z02RwIs9`_vdyyf}C^FPm+H{7f9TD;lbB5$p?
z#XHZt#Jk$N!F!Q+xAz+F?cRsH&wAhV{>S^R_xGZ(B5jemD7&br=r2VV6zwS5UvzWP
zeML_dy;SsW(dR`!6br?wVq<Y?ab9s*@s#43#l6Kt#eXS&rudcO_lo~pe7J;`xJxFL
zG?jFe^p}j3oKdo|WM|2hCAXB^U-ERx%O(FV`Ml)kQn56;G`=*ow6L_Yw6V0kw6}Dq
z^wiRGN_Uj*FTJ_+q0$#h-zfd8^gEnH3oFx<rIclrdCRKHn#$&sEht-Fc6!<QWjo6D
zm)%r$Pub&T2g}|n`?l=&^00Dkxw$;Myr{gkyrq0@`C$3l^0Ue>D&JLpRrxLD_m@9i
zA+Lz5NUq4JD6FWem{u{nqOW4OVqL{K6<aFyR9shaXT>8G&sV%w@nOZ+6=Rj*mAXnx
zWp-szWo>0kWpCw*$}=msRPL+1sq&u6$14w3zE$~2<+qi;RVk}nRm-a$t$M5KlS#@+
zm6KLX`pcvXCLOM>s9sXNx_U$Pb2W+@H6)(D)a<T#vF7tyOKn^2;@Z8nH`IP#XRNEJ
zn^$*c-3@jBs2i&<tRJd>YO-wdw8`g9esuB+li!^D-4xT5z9~0M`LH3rVL`*bhBq31
zYV<bV-uTc|`P3;>FP!?~)Wg$~rgcp_d)n(wF-^HmZB6T&Zfkn2S=sDr?r6TS`Crqm
z({rbnPG3L$zUl9^$XdKD>sroj+1fJNa&60}E#I~HS|eI(TBo<pZC%`Yb?a@d54Qfj
z^<S;;w|+SzZbtHqrWxnVxOK+iw*0m=ZO_dVW>(EyKJ%uT|7)*r-_d?+`vdLo&eF}A
zKC5%qZL^bR&!2ta>`P}~Is3~wjydi*OXgfN=aD(zc0_bEcAU|%wc{ThuXo0G7I)6=
zT;I9B^SREi=bGlW&D}Wn-Fflzdgkq%_x!w1x}v%Yy861V>H4(W+&!mzU-uh5(cqPX
zJ^$&=>s{CT@O*Lp<oUz%cg}xl{*Qf?eW&*A?t7^3(*<!0ybBgB*s|cM1ura&T{w5)
zl7*`m-na0F{)GOD{-ORm`ycLqw*RI6cNXauSr$1L6)jq^==4SBE!w*1xkaxn`e4zQ
ziw-X)i&cvY7FR4DUc7(tGfN_uG%lI3q;pB%k^@T)4nz*<2TTK{12qFv2igYa4lEcL
z99T7Q`oK8@n+Gl(*f(&)z#Rh*3_LmT!oX`wWlPhSb}hYX=|h96!Ir^=gF}Ps2G1JY
zIJk50&XE6a4@C_%4Q&}ZIQ06^r^^bLl`UJc?7*^bhnt3144*T+b$H+K&BK2m{%H8y
z;op~sFV9?Fv3%O{zU6C{U$Fez<u5P)b%k<8+KQ4Db5@+P;-VG%S3JJrgBAXfq>+q~
zDI@(O>qd5sJT&sbO7qInmF+9nue@{R-&c;Uid&Vws(IDYRimrkUG>ZA#MQN{m#yBr
z`af$*)||HH!8QK1)7EZZ``#&yr<{Ju-c!CfwcymXoMTg=`o(%hWKT@lkAf(E&N%wP
z{VFxP{=4YZLSMh{YuOXBL_7<hHFg)0WizC|H*q~h$S1c8Dq08onODf5X9!xFA*AE)
z1vD0xxaEQypB;2Fp4}kS(P=^sy$RQ9SpA&PfLwsw^?wuUNh-=}ynC8Z56yCoxLqhh
zX8JmMJDy+4uetPmTpOYF>=feYt$2R}PA0r0#M5(x2)YpUH=^AV*bHX~rDP0!X~(mL
zf*qO6)##s*b_iueD^w7jAktiXo+6ZsBSIOwk3MG5Ik?V%huBTHYJ@Zx^3=3dD29zs
z2`y_Z#uvdp(`abFeS(YrD5%As1huRX`_CV+fA|jGRIs?Bl)y{PNs@#*;uM-F;zHAK
z_`M9HFT;X{bPCf@%%n}Ql9{+(A(W7Z(f>TW*8!iKcW_GNO(Bb12-sc#srXaDMRuY%
zg(Q+A*oab?P91`d6(Sd!$<r9ON-Dx{@QGTD7-_GfA8ViwVsQV1B3|b|%;$y8O=!7A
zh~{&}u57;ksIa*VEtpq&ub?8S{?{?TrMSL^@-E6)pnQ(|RyOx^_k{WPFdP^!i9!^|
z1%?m7@~;4HF#I@4!QMi`8-_bU{9!m0S{OdDG7t03uKnl_!>>P482*J8j)x2vgN5N_
zu&{n&E;zh5qYn&M|DcG=g;a*iM;DIUt*E0OYYRC3hlSyPXzB1jN4xw!qVpfbdVrsZ
z{{@tPq5K#q@8f<7a186ke=x9K^4OZ;Wecv0vF_R0Il8d5^allc<qWpY0wt5Jw`0na
zf|{+t(1LN7@iocT<sTHbW<v{KyKMai3tPv5!r;vN%;uv|u(I)DuT@MV1-s}Fvcy*f
zFO3JRtAWSg2xh<~hkd4U)FH!jwV;1d_}nN!>ks?ed;WK66Q03$5gH;H{QuG4O!`;A
z=1#09woceuTMPO)U5G*CI}64B7rW^^+9Q|%AFDhTYh#X(8eGfdZXuW43wp5MKZ9Hg
zIt98zuE)JmA)EXSzNZ%erq_W6tp`oH7j)n{_#fVY=e&6CMm%>Jp1TLnU5Mun;JLH#
z-2Hg&fZztbO%g9ad0WT=9de`8&_zNEc@eZr!1r>YRLmD_l+nvp;PecP;~#*-MnOvk
zge3YB#$O9KRC8MErlS~dxnLmk(dI_L<8gRs{vsH0O+}w3316XaeL_0<5r4l#C;;6u
z6F2^LAD&};<ucUsGWs1dMt*-W*5)73vlIRu@Rl6{9bo(iMRp&q6KNVb>ih9&UXaEy
z`o?*ee;;UAB%@<e@qdo_<Md0+4qU;{Wc6q-K)=M#0-ul2uB4OEF=#oN=k>AW$ot3A
z!63~GUPEbK@bew$Uy%NV(!2kF{vEG`J`<#Iq1PY}J|SK6e{v$4H_o%cw`F};D--CN
z|Lck0PeAj6G%i4sK*Op)zjon@m>l>l@qc!Y(KnINGTOyyTDBOJ1@Nvo9H49Cbj<(N
zNom>u*2D42`1{AwL~@h=n*jau;`9HGp??7xBuM|T?%XI6-MbLi<CWmw*)>S#La&V8
zvGub;m<(Dp89cU*mqc7Yf{armObQn9MnOZ1u(qEQri_=b@cFDjIRI&Kmrw#8KZWD&
zJ-7~`PDa-lPPKy8qJRcl=(&)cc7VR2F7ZW_&++U7D2q^VHbp!a_g=>JC46VN*@8M+
zKoc^ADUcO>WUZiuT_%pbOV31~#!&yc{@=vY{lD|JuR~idL_Y3=?Dz=iDeL!Etk3gM
zu0(X5-~40r@4{qpsZcL|k9$wyx*cr<`^s>*PN4AEiV$m1_tp5@R+O{w?CmID`M;!}
z`M)G~)WP7g4)<<^+;lgtPow-5H2W6FtO44@c|3#VA|aWTaacw|mI=a>t=$8_3sx}J
zAiVgM!Aihb02e;4ZGhiu^sfl~<ubH;yO7J|4tl2lH}H^pcw%TVJ`prGjkW<#D!{j2
z1%GAbec<w1^x2Je0tHq_EtgCCgbKh+D(B$p4wM!lQj8NkSQ{1KPYyZ@*SSI^@!>O~
zK0+1_<K+<QEJojo!8cY3m14b6Ar1(Y>{*(GceX)Bj>bK-Cwg#C3*KQw9R?wV7_lDX
z{Xdg<K?a_u7AN8FZtNNGndV@=KK1)}+isk8`$%Y{*;tpYfqqX#-IGx~cy1IhSc%U+
zp`CMaU4rttBs0P9SA{)@k{8y`uY^dzCkyb&0z4(zh2aMZqYoS|CA^MEKK3>EjIqIf
z?%}Wne7US3!O@2P+JdkohXLatEE&v#Yae4BhZlnz>SOc5;KIjc#l1@41?-`Kb0ph?
zFu8@pfbB^J{O<#va1I489s-{o0?isizlMN!Ly#qg0GlB^HzZV}xKPUfw0ywih!e;T
zLO0G0u)WD=SmSd71wIvkX$EDdDp#R=hO!?8|3IIWkO!jZOq6p_ro%FbeG$#Udb|bu
zK_(;g<9-it^01(n&4gd=ci5-g20VZa09hd&^tlRoF;Y<ynCu|jgYp>mLxS%ToHKya
zkMAxN7s~uV*@P>4;TuHRhi5FfvcIp#XSl%n;a2Cb$M>sng@=kCb`jrsD0?7J<e}S%
z*l%SEW7wN9IVD)0@LvmAC6hdX!tVWu>tlcw>nAI_AO~J5)G&F4m)U{^&llo;4dkyv
zb`P?I9Wqfi#{(uCLiS^_Al(HRKn9dCnGmuf=BtI%ForL;;H(JKv47^rc^29C*n8h3
zdxG!MIgF)W(7?-(HRK^d4ybR!+z7%{=}NlMx73hFF*(#<C77oM?=??vuEWi!-)NwX
z^N80hpx^jMK106*!3-M%Dn?;fEq<d%xXQwDVoUg3*Z@7i64(}V;R{_QbPBz~X~KFk
zg{((ToNeSvayxl}d`7;6*5658@ci$f55f!J1^RDMCaT03Q7tBlsbYqhBj$@c!~^0(
z;$yM|nN3zAtC97{7RUx=Yh-@8MxHEp$a78MrWljKlnl*tnkmbaYx0^(O%0|t(_GVl
zX}Rfi)48TCrtPL(rYlUpm?O=xW}P{~Y%*KT>E=AM%UoivHLozQGjB9sX}-pMz4?Io
z7W19vyUh=nAGT;LdW+SPZppDytHK&%Ra<q|1gpuKWu0Q}wf3hy{~LwRy?~LLfhi@B
zTIUM$h0}%oq>+zwKe>%Oh0`qmCBM>4oTOtTy`MfppP_GxFd<^3aTuvhv`-kRAWM{`
z%1ULmvOd{T*-F_ad8|A^o+{5Vg_%?)ttrW5Hl>;}O*tlysl-%mnr7-Wb(@Avr<yjH
zE;eoBBi(OSVx(%b(VS#9^N|*qi}^@bn>S#jSDUZHNN+OVfsx*CerUo-<rrxkMjAgp
z(uEi)@%s^3Uw{{+;Qt58(-=4Y`6v1Bkv<*y?f=#H-jQ$kv|HFEY!NOH&J)fO&K&z;
z?47YE#-6|mTZ96=#{av2A3ymqTto!n<7L73Kd^r2_|Wk|>W7IR(~tZgef|NQ00iNK
zt5L4_0GRo~r5~N~(di!~e6;w374M%R2=A{Hgb&x^+VlRL_bcCze_!*?ql#S|mp=ur
z1HXw1MN1N(VZuN9BC^B1LO-Jap`SABWcS28u~77g)v#O5VBe4ZCr-gr$owQ;Bfc%Z
zE50ZGNA{xZRoUCJ|HwX-eJ(pB`$2YC_Ot9)+3zx+T#!@Dwn=W5d*o&EYWXyIGpi9-
z9}MI&m|vq6>SNo$UljN|O7QoQXXL-){XjW#mwzINJvTsRl3Fqc>vW0GBs2>PNI9r(
zn^22YTQ5u|)npRRhD{^I!gSzv3powv#I_=zaGx*(XFD$!8b}?fC$q?8p@*~s>q|)&
z4ji2;o<>R#in<eLJ1--9$tH0NnJp~BDb79chC7q2!CB3<!c<|YFenVc7C0;{2e())
z{6#oJSTCF@Tqs;5YzEG(6ZQ&M3RfXd)iuJkq*6E_+$Y>GJRm$I{9U*ga>2{OE5g69
z|9wq(9g!T~5k40FBYXmV*muJB;4FuQk8ox|Nx}#mHAp0>A~7U|n280)dUA+~<OwT;
zH-r(;`IU%YvPO7USS$QnI7N6*I8}HbH0uMb<qtv4J_Fu<j{Id`2xklb70wa96wbx|
z^gQ8f;e6o`@cJ8JqwuY;3Hiw`7Jd{i5q=W33O@_mu%F#dGld<(ugItMn{cV{J1N3S
z7{hw-38R8v*aNb88MJ|y6H&N=$b@~+*6k+>;X2^m^(0ETfkX>8l33v;5+~eD)WR)9
zBisrOcpD^<+lgMdgBXN+NV0GjNfhpeHt|7X6&?n4e}tq7kCJrZF=EHrrVQaJk|jJ#
za)sxF=SjZs4^kk!KwRWqT1$SWy@(-n2V%B7OP;4La*(`4iwGhbkWZkUc#(L7f09B0
zvDC-`M3ui8-f;IJzR82|s(q4Xk-yVC@&>IWAJIng1#JaIZ$nniF5-hkdncr~zmWv;
zCaof$(-!g;&NR#Dka(%MUEC(_7I%@0$wlI2pzovNPH_*pkX%A`k{#qyq$s~a+>h0A
zt$3Aqxwu!nPP`fx;VbDW^i;Z^uA;l?F61u03|TsN(o5m(vH@NUo9I@$oUWiFbR}Jb
zQ+w;^X*i?x7kVbWkX}SDrkm*&dI{Z5cfiU#O0S^%=%@5E`Z@iAenr2g-@-fRJH*mI
zEK-q0ag>2JE5!&gQVbVkMV+Xphv+w=f&Ld1I~p`wEo#80qL6&(C;9^@c^JJ?G}5cY
zczQL`j$b1t()IL5ShG9m$6_a4O~0hqib;r_kW8-^P4osag&q*i^hVJ_ZxXHaX3<7(
z5mV`{Vj8_oOs98<&;W@J`ZqC?-X&(?aAG$7f7*K!_^gWS@%zr)kg$V7BDjL$j+o_1
z0Jj=QP!s_XaH$J11c-*jhJagJt+iHdEsIOFwbi!Ps%@>cZnd_xT6gPScLmqFvq%wf
zx&QB(<+=A+5)we${@(ZA&z<$mnKLtI&N(x8p8MPq?xAlDN9fzaJ@p^MQhj?^uI~sd
z^q<2N`sA-+mA*3^ss9#^(szZU_1)oK`tRZ1`kru~uu|U}?yK($_tW=>U(pYQ`|Ah8
zYW+|+Mn4>m)&B@<^dn)del#4X9}5rAkB0~9C&Kai$?zckRCuudXE;GW9Uh{e2`8en
zCh6zG$@=;5Q2jzUMZXvxhQ^+%Uk<0~rQvkFEIeGl5+0#%2zS<h3d{8C;aBw=;nC{1
zx>)^Am#7=~+Q6UnFwW@ipl;NI)t!20br+{3|E70Qf7ip+1AH&=A<niwtSk9tSCx8{
zuWUW8N2@pWMC^`9>UBMV^JE9Bck~qXo}Q|f>%-LweS~^nPvffv)7478RsNy=s**Eb
zfu5rxJv+Ed?Hb&zb_?!N!?n_lx==T(>-eqGulZ)?Rl2vjTKDA)O+R%F-(mPA-+H-%
zU!DI<_fS9AJ=HICFLkBvuKuWpsN4CUhrj3@)gSbh>Sn$hev96QQw!UwoAg%dUcINf
zhcmR#>oMvDJyt!T_fk)B&hnpnU-h)!Pd&*A;Fol*TB;9F%k+Wj6+K?PtjDP}`dIZ5
zUn%-n*YOpGdiANEsXo&U*b2u7_o_X#)+gvtpQyX(x#5}NS>d<CZ-r-vr}Izl)5EU^
zhX+SsZ5)Ypbu_0f8iLv3cd$AR4$oDGsEOe@;d$YA!|#VbP-m+B!t>QRx2fnmHx#h=
z41(TBA}qFo9)y3&W5X)wNz8`%8h>z&3-e``;071wf25F=7N%RUB{I;43)zP&bm6|(
zwu5XK>DF6KaN(jDCsM388po7Hn)OsOIaAewEIt)E+!)M86SZMc@jFZG`U*l*Nol~Z
zMJ~6PoFTkjY9)LE>GcM>8u{G@Tnp**fZ4@hX#?v#EVDhiXM<ZH=A*ktP^tyJvnLv_
zhPNSyLBXV8IyFoo&DOIA6pVm|T@&?=p;Qz7ZF7Xay}>Yvr<RZ{SI%z$JzSDvpEezu
zg~mp3HJjE*ErKhzy!3>$!M0!?R7($?MA|%P6C6$W(&pLFJqe9H0nTV3-S*;mAnSl>
zq~sLS;yUWYvXLvgnRev4SUm_=3}Cd2gA&e;4hjY{+FNlhZ&<Knuv4%zy}K*F7T%q8
z(H_*lr=h-_u}TG%K^5oZMq&ByMUU*mZy{@F7nTJ7J~<wH<6tNhJ7W?fcqlX-#^}P)
zhM$F-zY0Ge6ZAlDhiJsj0{ITZw!yEl01B`Jw&xsKZ@z1>e{d}JNq_qJ#^4XE0dEa%
zVnz7(;GW<w!C%qUn{!U@IPCJXg1dsd(b7Fx3H=uRcVBQlqhGJOsX|qRrk)vmCe{JE
z_-(Nef`{n4`_YoURUg$CYoR}ycdgo74ZsR44jv62Mi-W#7q?J@us+tI-?ma)t8K6)
zuq%RBv2cd+AJ99XgP#l@!#eq0Fk9`Yc0vy?Mq}@yc2&En-PLfcf!Ea@*dTkVQZ(}W
zSTEQx=;b-+<rLbsN{v*b)M#v|z12R!yVzuZQu|^5ys7rb9vh>^!ugHZPIDRCX6!d?
zFxG4>!RP7#)>(lXk5%ywmd#1RX(AWY1d$7BQt+{wtPWLE)L~}6EKpN}ld;>TtHb%8
z#*x@-UsXr*)qrEMq)y@M88cL!Ivz{tR4k!y1YcM6{QAEEi|qGmmYU7?7#h_H!Kc9+
z>crqY)uiUCX4Qg4bOtuund+qATk317Rn5cJo6nDUPgbX>Q?Vc4Q>O>=&5v&c|6)aW
z1`_I9>MV8w&No(HU#zJWSb0N&?Si2}5!TjskXKi$Z>zJ_chouRyXstZ9-pxOp8CGJ
zfOY0M!Jo0fx(D|L-^QX?82kh&b_ce^Vpf_LVozL*Me##*sp3!Vj3xRL^;30)x{_7s
z&($xm5&w;qcoFv5LRN2e!G*yRbrts6Wx<bv9|xDSOM=~rEp|0l=LOi8uV5QKi<S2x
z@?t3#=Q8ZY=hUx)JF&B_QP-;L)UVZV_#(pfto&|Je8O1$LEWToR=22I)otpJ>UQ-f
zb%*-1`iuIjx>Nm4-KFkkg?JC&fVvM0>;d(ldWg00Khz`YQT3R5Ts@(lR8R5srl-|2
z>RI(1-}HJxy{KN|%Lz->GW81o-}0JzUA@5?^Iz&M^)@Tbch!69eZHW-T&>{$16J`V
z=hf=pY7O5uU#mXmJ8++<Pt|AqV?~6H<fr&(m;y9Rp)S(hbr1f{w3qI!`{=&9pYG2W
z$2Zpl_@)BC@#7T!AU#-b$(ns@y$!!B+KzA14AtB7y_jK~GT%w>tasttFuUp9`QpqT
zd<AAt*1Ki8ob`Q*uccS9zx9kB#n)o?(tGQD_y^zp^jGx$*o0&BSY4xQ^*DWiK2VR>
z2l3D76Z9c^qMoED>qGSveVCrAr|IeXaD4>p=cDvj(eKCTWA$-*hOX1c>v}y?H|SY<
zww{BAKLL%|#6Oxgr|rRcSYTokiv8&A!f#-qoq^@}Eq#{$wmw^bN1vm=tIyTvVM&U`
zcmXz}Sd5FY7sYB6OY?_Vo|iex^C!lJyi)&6|6KoqGt0l!SL<KtYxK4HI{j<?8~s~-
zz5X5liTHbcBmbg)lfGHsqHoo=vHHKAy^cHdpT%n9clv+Rcj>$J-}%3pd-Z+%mh=I>
zU-u9@A^%{l`6#Q+$60Sash`sS)KBYY^t1Xo{k(obzo=i*FYBdxnSO=U=xeM;-$>iD
z?_h0;O^d~vwrf{ojjq8~UCV#GvD2+T)t~9lbrc5Ju43`>l@ep|cE{cot5<B>zSz3`
zovk}iY~XN<a8Nin+>#xOt;22jbJ*>|A>q()`)~*LYIY2F3U_8rylc2yxO+I9Zxf6N
z_hfBc7M6z<tdJ{NBaaM6g`>m0!o9Id_YL<8zY^{rR<m**8`gxi;kfXC@W60<cu;sS
zYw1Hc6g?@N93C1@2@eaWhSS37;o;#C;gR7{;a9_>!(+l@!{fpkVO@B9SRc*|8^T%P
z>~K!l7@iQG7&e7-!{)FhJSqHI*c#3Y+rs(bg79Si{`S=HwD9!s>zpzDW_Six)whgY
zb$0k2ET-><=VCRT&l>Z(@O#)!7lc0u7X}}Ni^9dMST1CxaxtryAF_72Ec_8Gm&;k5
z{FIf+mEq4=sr<sMSgsC#6<))R)pg;o!{3Cz4X+P>7v2#5KD;sfLwHkob9hU5Yj|7u
z$ME*>PwZ;_Is8lb*YM8pZ{c0x-QnNEd%}Ce`@;Lf2f_!#hr)-$e}s>OkA{zhkB3i$
zPliv0{|uiFp9!B0pJONC1@;nNVmD!FxGbD?+^lXq$2A(asi=BxU43gyb7A%Itqltr
zimF>?w=_4L*lTQkV{85VxwD!YPU$&zW=mULeSJf7TVYLoodDNRq^_-~)|IU_Wqa19
z;fiW4n!;KG-|K(`wgY0Q`OS@`W##3)4ve!44m`fDwQzh}W7EurqVW#@cuU)Oi&T$4
zsMkSpi6VogqN;F0UH$yF1{WPuIKfn1FoEg{CnmB|m4y>cR#@9SyJ(WDVv?z%&!jo?
zn`hUx&Y#;<H@~fLN}^b0RpAud_`^(UufwuP;ImDp?((wg!l}0IskFt?Q&nC#&9-Tp
zt8kjBu-mlO#^%|5rX{N_n&vw1@Y$_(3mOU!xAh$!*Vp6lnT-vt4f7i36&`6|dL0>O
z79M5bdmfeU=U$WMHPy|VW0R|;LK7^iuC>1Dz)|Ch>Ktixw!7;bE7Zrhd)B9s7S1$n
zENXCt8cd;{4QYU)2G@)R1K4YJ0?q6g%JM)(uQ_pc!5ra%M%!PF4u7L1s?qU4;|aY^
zh)cLZA6eLxXi>%3!X`ToO;lIdoXAR56*il!umK)uaaFXKD*Ch}2cxhxQLJ)gVXG-t
zIM1Z^nwLdFdD&>k17ix?Y~5`!4^$M+w{4p5Dx7aB>^9%<!2D#jMe|+foospFWLw|K
zaeX~bPV>O2mIqFaGYd~M@I6n9`?;>cqG(C*LS4)YG7ROFqkEq?yS1UAxv8#sW@CMy
z`j)1a=DEm&wz}3+3z`~R>!fw%rPWo=A6+oBrFnKi?fljjn=+=%`Q^^9bpBZ9*A&ie
zY-XAk&TFV|X`b2Rw1(D}5zX`Gwsxl)8)!S(ru1x^11%=4$E=q5tuEBKz`@OHJjEpS
zoQL3Qw!wzR*>l<~U~{8GXzQ5S+%nhHVFFTz1Y8{wv~}2!)M4PH4g+WFFhN^~0W@_;
zNLp7~F~+pAw4&N_LB;5l9y`Tkm5#AVrDIITl$MUEu<6yMJsRe<!Q^cXGbN?0wz}5(
zV@xNP)s883aZ{3b%E5WxR7yDqUv0z?@oIr9EiZNDtG#b2C@*#RO0C!`8|(0uI((&u
zj?%KRW(dn_%Ut>xN8eai-&luttixyVP_M%`#?dpz)8opOdEdj0Ej++X8QZ*ahql}l
zE2}LxV4!vA$~_q_f2?f=%xRikHg=@NQ(>y18LnJ~gHPFRC>!hJj*OItA7jg>T)7%Y
zPmPbe=GM4!HMU&2?Y`1-OLu8`h3_8MePe68O`6lv+HA4cxY}zyHV0MXT32gI(`py5
zba0h6ol$mFx^gK4N9`tFT3+UAuQYJPeR+qk%28kC2BXTsS2?&U*V@q@-qlm(>M3*O
zYrS99ZCc#AT333U!|JK6by#XW7FYX7*P4;8+$dM;IEQ_l>*ESX-8fI3i&u}cy)nj(
zy_H5x88g}N9V=IRzsAB>J9s;9=~OfJ^tzE|#Jz7PZF#A~S8678S#7DqQ)=pm*Iawb
zT>2PCm*>f`4&PXZ$4)Wob97l@0ll6MM_-xuJzP!U?BtYjXv-bzmK!k8Ix@@0^=KT?
z)KcFxb;`lE;bR@-SSy{%OI?K(t|IHxAcvvC!KWPIDMv`kzys&m(81R@ifVk^m8)^(
zYHT?^{3P_iw!VJfL9PSGj_cMEvsI0wqSj+`P&KZbYfWj|?c#jD+(_0+n@+#lc*>Pa
z*<mX$cT|+Q+AAG3Wxl+_SLLX$a=ldL;Hw;5m22&2pYQ6aa`lwC^0nR{*=>H@x>{Fy
zoWts=t#w#xJr;+3q-)JcR}MqYw04}sKF;-Vg`;kqr_RJnQ&vRa+uli85kcJLTV^j!
zjkY2uWv4v(27hVF>KA-p-cHh#Wme$KB*i!N0%v<UHOh*lRGIUg;7pa-UQbzlLpcXu
zW`#wn%(g#e6+~&O+|^rdgaC0*w}W?zBjsj8s@(QRs@&08?&vG`^m+VNgr=MzPdVO9
z+1W%pJl(z@jF6&!M{lXaU+U^}dN$?eSjs9e;9Y%IAD5=A=*4&VN4j>6bofWR_-G$@
z^^A7y812f9cJy1(U7E7`AK#U)cIB<zP+IBx$=VOVIXu;4drX_x)>_xtR)1<g7b4zr
zVnh9@X4a;hO_Q>gNomSjF8Gcjr}_C}nuB+gSxcfcWi1GNH<DH?5_dgo#U^n#LRM-K
zcRg)Yb7`u^walty;;ufcvWdGE)wuetk}XX+C7ZHJn7HeiT36nxG16UmtG<Xk4zud5
zG&RoEZ`BoXSKg{A;;#HSSN}L$zS7OWN;mT=-HfR8Ghmd1x9X6Qvi(}=ImntArKt+n
ze^xybcQe7tKW4DcckQci{p*a0l#`DsXELRn^iNf|ajbCtU+HJCo2k~MDos^7I<1zV
zejj)66|TQ39LJ}eL`gZioJp3l+68<LKIQ1O+NLz+v`xyHYAI`?k?!g9_+9-e*Y7Du
zZ>5KG>6N}8d_9idN;iI$ZU$GnesFpr<&3SA(;q2ooH27<zgM~X__)1jx70{i&uAAP
z?c)yrXh+v*S8lYUW3+3JHA9%0uDms4h}-g&Uc$NMN6MKosp^^@^V2ifg|cR_!)Og8
zX0D^ity(I*%yb4xYK)`I8aB*CN1<H<5O+Ok4I$#L=d7_!+>OjwH^SCVV1_z6tbIV-
z(P8Ze;;v_ET>Vz#GZP&LS&M+U>)BdY-s)7+U3sfZi95Qju4RV0`mOFH?#f%8N!*nm
z=jtD4%U3$xS?P3UrPE=RUU!Xh@K!f7gY8IHmXGUaIAio^W0#FN?7$+kAa0vgD9d3y
zS*W(n>TZ|9ZL^BZLRfrRqLMEQRPycelz?5F0$`S=_~2*FWM&$^=_h<6sqjsE@y&SQ
zn|{MLoR4qXk8j2g-_TuNI?~~@I*GU|H`0|G>B?C{p8U}zCpEM-w#<}GM0T!bn&ytJ
zo@ypWX?0D{S&g&jlg>7krPx{*Sm3TEt3_GNnmLQ_D6-m^xEUE%f2OA~WUC8LYM95y
zg+*r>x!mo~;8%8Un0r#&sX!QjGOL@)%bnIPwKJi-%#J9&l?CPAB=@UXZ#g@iRPJU>
zxtkf~PREry&M$YIU+!i^g|iAON=NoE`!n?|bB{NjQsL}`3TGEoIQyu=QCLx0-NWoA
zB}%0F%xP&kvF`Ym1#GUQ@mL<Ma6DS!v`j_WnBMFT9pBK@a&ippjDQL^;VYb~sc@>M
zqN1#aS#XS~YijFdcCVyt{i)qOssf>)r^&HfP$p<LsBEgCxnI0hWwH`+Q>t&AFZg;G
zBogXA^Z2Ih5(Z;0yQOCLxNO+K_4T`CHmzTJL(Il|n!=`39~1Q8eN9>#y02+<9JQrA
za33GA)f+?>qI*NzoDr=HTAO>#Y-wt$Yqep!2WP@PWJcJK?4p@aZ!>4Bt1Pf(<3z@o
zvP7hMw25>-l^rmtr%!WBTf^7p*EN|~|HRI(O-OA2nFO~tY{Hyo<m4uA(G~CXIn8J;
zzD`ECH)(x&hpu>Az9sH9ymM8&Vc#Bi7;pLcrvcva^TkKr@GIW%r*KE|R$uW}e;?fa
zc*m|dgD?;GT5iSr(B}gsZ_RPf=k#;PyUG^{%YTO}-VK6{cY<ZOHM$0OhMs}jqFZoV
zbt~=yeutoVOLsc%8T^hz@ow&H-19g$u6QeV0q#ZoPDII@INS&M2BzX2*%P=g=ofI`
z<ZEGyb6s!azR$loDc*vu!d;`+;C{kiYH-*t3~&p=0^D9<FWmkiH1jrVC~hTRLsq<*
zs>U53j>laRasq}oG7r&4>Bnv9wVs@!D5Zz=i4CpIL27PY>xuMDSTk<I)S$fn)Yhh;
zys56OnG+TTl#qUvQ#F*~<hR7-5^Q{PFHjeJaKYz6_=9VHd=;lMB6B{2yeqahW&e8N
zmKQ#~xMbmji+8zX^M#i#n!(+?_}Ik{FZ%kT^DmjY==?>OF1q^SOBUU9$+L^!yy*H1
zuUd51MQ<(q`44wm*tTfGqEQ$1Uh?4Ly%yGR|K{TDFWY|6V?R9QhYv1#dEpXs-?DhZ
zLU|5aIQf!GmIRC5yJ*a!b&J+5xn^PW!lSwG<ayBC&7}DIDMBwVoW5}S;<klvEnFob
zQa-(OYZH>#^hJf4_rm5y{pB`T!Mte8pN?AG{i0JA9^cMAXQ91Kor{KD+Pe7si=SFF
zVqu%yKf3-$H5VRu;eth@F1>%r#6@G4G%eZk;-i1O^}^E@p1CBo_{zn%EIEJCge5ED
z`?50=_p6ts@1L9%-wV%KG=1UsGwvmUzC!*dCb;6otDoki!P#cy+I8gr;r~0X==12a
ze3V3M@}+KETEzL{%qw~~GY(&WWK%p<{O4hm4byQv`XE}B4I%$jo_j@WqxWoTv@&`x
zGG8pnhT?m?TtZE>jDI`&BtNF?QeBD5|NYw2@p0SvSEZj=9MKBr1C@E1a_?uRC1dnl
zMww`JZf{$7zB){gMJst8js6uaO=9uk=n)A;ukyTYeV@~LKl;ej^I60nBy7s7^JCI^
zNZJU`crJ{o?FxptR98d%{}ESm{L=i;?z}Ygy4lm2`l64cf9Hpb-te_Y&qVJ;ujhl}
zYusFh7leOJiF|M!rTN*Elna@>VShj3`BwNRy4Pa#X}S2NRnZH%>G@Omhp?BTXQMZ5
zTQXsy7bPz9!TgrR_7+BgzmPQV+CBsaza0baNuSphKVMri`7HXA!TxECHM+uvy?lss
zlA-9sWUS*b(r|fx2-gqbiXNxMujPYsa?<gN$ce6B{14$5bR}of##SNvD0&5bk$+x1
zC-|ceI#WwmHCv1`x<3xvkd+wJ+^&4cF0tY9=p89*`e7OUkazC$?RSB393}H><F8EF
z&_2FQsohnsqD5%Ju3pxT%AB==BOZ@vSyyp(1fN+`^yh5Y=t`TCYYQbIy~UACYcGtx
zXh)jZmPt#ae<B|`niob&0+&~Yv{!Ry(lh&`Qzbq~bLYBbFG*@goQAEKYqfqB_oU2y
z(HH*8r)BfoSiS`1MW=q^>9g@Tx1&(*$|B~#{N<t#(^fFG#+OfxQ`Q%X_@#a3+>;W1
zWRhAwPR+*Yd&`bUv>M2dJSBw0CNs8t*Cl#(iI|(Mgoys_bt(VwYwRf7|3X9Vl_>pD
zJoYhM+z)16tVb&6$|z4QZ5F+2)@bRzSxFysi|bl{$YS$c&C0;w>$sdBxAvesh3(~M
zr@L{>!yy8hZd<fIe$B=k$1^!BPLD&;gAz_s9{twl<{QJf+@=X7^ybob?T3F#T}B46
zN048Zu8*2z`?6s>%FBk$j&Dp^iz^!gtIZE(4Ix*i)^%%;POKC?R~sDIX4zMCi<Q^W
z-}sLl<~9E$bdQ0he~I12<97i*FtYoPnZH$!{+`5$hI`wtg_Eh^NUx=$E2GCm3S%RF
z5<TOfdb0Y?vXiW&7M^94y93t^`6<7de;|6^<7O@tk#eid_UI3!7W$m7_?Fi^hsV1f
zF^=f{YzYJvYcqQGvs|5>J(@8-3DHyOb|iD`EJ&sRD;A}+ados@R#Ij!BHg0`8!<0z
z3#9kGq|U_he<_wvlbU`=Ym!_|zbV?EXHAk=@fr%;9s|2!YdufJHIrucq>{YDc&+o)
z=9Vxx&0LJJ_)zEe<vg_Y*&|qE_9cw$NX*Mje##>$GVydR#$0#(BIRr!n0Bwjnpl<0
z%f_3%FJ~kIee2=6vM=Y$<od>vGV5!>oM)6ti~9<Q3|l|?rC^Nivv`pfuSZu{9CmLY
zw?3d>j^2uXkuS%k6~uY$q&yz|f_o|D%<3}EBjsj^39g85Ww9gmp;>z(Iqel)A6<)7
zzLFL^9bGMH(N!+1OP<|Z>c~2ZEpm?-ez&$+CoC#orhVU!OMcrco>TO~T4NW&<8i9s
zmEL3b*zI?FeC^lRQBJaSCI?3^o4WjJ4ja{`P<OjK($NZLb2~ds`KSQi?0x6q2ct=i
zjr2C7wZhJoc+UkLvI35}7HZzLHFl-mm=?FE=Vl_kYFZuVgFp98!!v$Y)51aD!^sj7
z_7+cex{XJFiXP9GldoruO<~^G(q7S<tV}c88a+jdm4tsKltXX6n!28r+aj^6)^{cO
zYkjaC<;SZTMt+UwgDj5C*n!%(epufM#oJQt>F~_9z*iaT?#$fG*!pS~Xy2>Up0*V%
z7I@LDpp#HGr)#cnU;Cx9YxX>dze(g|`!!2WvOnpCylaT0uIm`v`f{VoEvH4-IQ{Ya
z=%%<#^i$|@yS3;jBo}(>ia4M60~xX3NB1UokCJ&d9R1#|Dxyaz`%=6QkSix$*>33>
zv05~EbVqcz!}O^g$>?&4XRdl&*-m+^6=W5a*2lSpa^H)f$qjr*{IIFUD7Iyy*PNV`
zbzsIGJw2JUQk`bYZOQsmd_UxyCAni1{XNO8>&Ko4f^}2pE>{!qeosp{H&aduCIe@z
z{>(n=TrD1|!;wWRWnR(mZ9HGEdB|K!eNNZ>c&7n7c7@TKvft|7v^zSMiSMm&YYEt#
z4RfO#GRs9LXU3^3A+4kHZEkcC>9Xz*qF+Tf^BAjK>|vLBS#)Uh+vs<`*OGHMQ?B^h
zqQ%jrNRZ|BjiO04Bkl9S{F?|%A@>qV7GJDd9*=H~erZ-(A7XbO5VbI;za3o=9mY<^
zYW$Vh;~9M#mySc8@;D`5NO&ois^qBn_rm!~x1Z+cfrntF_O9Qj$vh7d+hoyg9y*^-
zpNLH^Ypk4ibot=BmKMv3OsgT5l%n;~@*T<IcHjG3TBHu%`@fxk?=kbefBV!61%4IM
zK9s95huS=H(#;MpRj_5E_2JFTXVseXUN1j|^q+gfWA-2N>H?>Og)f)E=No%2DBjnz
zAs-*=+R)wX5K3f_OBvvN59y-L>ya7lASRIg&H2JypdozS$zE~-w0{;rFB9L=xHc@b
z<fkXAXeXjQ4UBaIzAR-i_vA#Sy(C4hZLF70cTwjJ%#50t$B>;B<Ic|6!PGCQgE`f?
zZC19eV;7U^sgf^A1$?b&gRXd%=P#a^1D#ko#Jd6cu_aTxqG6FVi5)M&V&*{?XJxW>
zANK8ompnH~$lgKVdApGF$lVRZ<_YeUopiZ;NgI>6@UrDopC*1`4qw}{eSz&oUN#=d
zwQ1S&L9hvJ$vOms#g~gm;5)vy<jl2P-8h+TFFyThzEUPUY<Wy_hZ2?){x~qrslFew
zxxE|TXOptImzOm@$Ksd&r5$Lv*{6G7D3QzZeCF(tyuK#a!Uztzd>Iqzv@_I|?sS19
zpxr%`6uV2|Z90?k0I46lmB>nVYI8MFddDhyD*L^U*_lmSZRQNwJ!l!$c)6Ed0f`ln
zJ!?Fywdf?~^%Pds=jq%|%ybXiIX`(u%Uj=4GP)~sFFP9>@6&F|N&7su#pE4pbQABK
z@}2>cFGG_rYuB8<&cS-8Pci#iZXYh4w!+E@_8#ArH0++l4u5Vhqsue&zt`~=pV*-t
z%Uw<hzTqWPJT8>_*i+QLFYBmy73$&K{^mb@d}I7<u9JPg%q!U={#3K<Xj;owXz|vt
zSrOTB`asqR@r+5o&jfX@Z7;nOy<jk9b88U=+&UwAHDf0;Ef?c?Ds(fNPe=cV?v_=N
zyi>xih9bt`b=Ek@l<4;47)Xgtb!GHZlA}1e&=Jo<C4HEE#XKc@j;xv9ik4-=NZic}
zWJhuxm<uVbj$7V&8#vjjT&zCDtXp35G4IE1pzfD^Y8QR6hwMejzvq>N<g6w3w1YA-
z!iRHxq_O3UPm?^Eg!5D*%@U(%A@b~3-v=E0>o3MSV}Hn}x9`K5`A@#(c_ZTY=#gD^
z-#)EHJbtrpZzQD5)lA9dVLIz4xx}xxZJIsXVBhRxy?uy`L?g<@I@pB>8wtnW*;^)u
z_C%MM&>hBohIpdqB#jiP#{HCWx{Mu%WfJojC#^m)t7HS?Q@iH-HbFCcn)dR%1OByA
zx1=&F*XEvFa0QGfbK3p7!AUK~evRLQh0=!%9+`LVVDo-%`O40x=uT2suok5xGAeB=
z5c{0eSMZ&UEIklCY){1!5_mhhs|mfED>>phZiviq48>{f$vKl1Qi~lg^Pbmmu0Pch
z7o{x;3gdJM<w~~o>$UU@OIs<KI5#eqzX$TCLO&xem-S8m=J2G2=-ADDGnApN@)U+E
zoTZaHiWc0{mZxw=5_>M$dNYx~aWcSBV&+5wDZ!4~Cmfu4MR%^Bj!ercvwZup+_pQp
z!-|p_^0Bd@u=Fx59ig7xOlO1T%Juf^>s*ePGck1bOi9QeGuNS&Ic+cdJCyjnaeLe=
z(DFMJSIl`{c4Ve*x)`VL(yR53t&Yyr8Mn>rnCw!yS|S_b|6)AZ8`;vu^KHI%qqo|X
z*7@N76KS~;&$sCRn`50h2Jwu@Oz&I_`(Xn#7<NbAQt|xmNZxmbGNf&KN8H%pIXcVR
zTe5qOT+3K>=hlG!bmwn#^RiRYv~zYWZc#QAan_pj#J{M!Af9v3^NvV7vl7dr3G?8|
zo8;S<H`64xukrJbj>WWb{L(%(Uq+6%fqY%LeU#K@PA^&u-Dy3nb|>%J>%Gjr>+1R}
zP1(v#ZzXu#?fH4^s7F1l?1kAY*8=i6?faeSg?I+Ek7xZkF`XVZso8uQv&*eaSVfuj
zVw^*0*Nm7%1_CEm$mTAmFc0Uv<@S;t$a=hjE<u|!bL+vlNwbBEqdyADB%en=vz2&_
znkx&;nkLT<lP8XT%#dlUVe{-fn0j9@t3=t4dJGx4%wtIUcC=+I%-(C>z1$>xzAzRH
zJ1;R6$zNs1so5pX89ujamOQ)Hkc2X;Zgwu^%KVLi)WA;R^ENM8H(_&j!sg`mu1lBI
zL|VJ0vDo$Wtv(LSOFYl>3x|LBH1;_tXWILWq_M-5wyiCUUlp*=;%K*UE;nQBOwNb&
zpPx&jwJx)enXdmOVdgn(v#)!5W?ELcocfaa`E_>YKAQBQ@J{q1yRxwids^Pz^9DVN
zM<I!sJhNMm|7m(RL}r9fP48>?Qt0e8>An-lOMQ;_&07^lM6S%;K&gTE6>tSUWs{f1
z>3cYt6NjZA*w@SID@!ZC%E`Fc`F_gt1Fe6;yboG~6_>LUpHYlRu0FDBT%V5JvfQ7D
zXrEr0QAr-pt|d3_do?%be<4MrfW30<$LyWh?6LPH#iwuIOvb<5aJH1luDv};W#N*g
z)8~@XzpLoDY<5lg;z|7Z@;5#$_jG)IoY`}bam(2=&n$_2aS$6~S0!;Ffj&;gzszuS
zM`mrAr|={%!>;~C4DI*tIi34wo9g$p6EInlO>$yc9>dvC^iY1i;BwRFinGggI^K=l
z{401qMUKVqi#lDrW55h+E6a}RXnfnZqdKl{V{$t`@7mV~>#sjkpRXT27osD5)0ve?
zF2)T_$(0Z7Val`+1gd>ov^^Zz=^aTJZ`ov*`C{T5v)1$L?+vG{!+Dgu8r<-TzJQX+
z*&x3*_Lr>4I+|si|1|cchtKwnJ$!$5YG%A+3?8;4>FZ&-?k9OSpWMlp*7aI8zQo2`
zGab{Ap+~=vH<}&S|K;Q+wP43Jrsr~eLMQ!RtK*UzmYZwEZy28JQoJ2ED?d)8Jt=vt
z%-Q+ym$wmpocxu355}hXFKf9NHf85@O>$nv*w-Jz`pMZ*Uw^6fL-;iirvR2^L%SBG
zR}PY&J>Syni*(^^h;+vPNFX`mEy;O$CTr&l>-0ai7TC1i%Kp__!N~r`i^hM~?>Cs(
z+v3{G&7YStdnfa4wOE3kvviWP&)3iypRc2==S@;)u;jw<o1gUiC+U&g*_YmXStS<I
z`simrA!~J!Tj$24d@;R{K~c`yD|4*rgUGMjJC*@?-T-7&lo{z9|74cg^fBANwD4oQ
zPfJL4UmfomYbdP|sl5PwvCi0z8Pb!SBvdw;9pz=i{ujn`N2;Th;D2EQHUUW@C#+6P
z+Eo6x-D!Tw-OrYC$dS%oXdHIb|MM58)0PPpVliP$Ewxh4>J0hq0_UE1?}GGO#yh2F
z*mXBl^N!>ePrF@Vk!$TR-jmop^!T@^wqIg->`Pidd&fO9_sfbw|9hM*c#rmehVJ-W
z&M%m=2J1u?lKMICZRDIN-w`$XLf#9Rw;M@5A?<VNJFL_6IpbKCS{>wh=*wzZ*Xn@-
z-l7NI;9T&(ImOKP!3cj!>PJ{e-LNV?6U&?XEqX#)x{T*_sYCd{w3SmDgv^)4=+*Rl
zw?sdnkAX<{ki`D$FKN|qPo=S}2M0$7dyrDXEhmyQWI~qYEaZ*&hh6&R;12xrMi(wd
z#q??yiflA!u1&SkDF5dW80lcF2)`1OCU{%X^F;2N<bSTAogg^Rc^KZ*{{Pp1t_RRY
zdEN!VpJ@9p_A=IWVzp^&OV0~;iX#6m<p2I`$&`%l>k9t&1RtO|&Dy*p9VptdOZMdQ
zu0VgWW8WV3+_NM8n?<zsZePmFOds!zpInjV=Xh$^B>N08ot>d8KaBfLkNf=^cGhbD
zJ~$3R?^~=uS32w3>^+#XCo8e6KIZM^yVzEV9YwppnQUX`X$fl`hz-7RJ1#PVrCxri
z$&Q&=z|IQhoJ!_JyTnG$Cuy*k>}7Oj&tMDwODhQam|uW)d_Fo1x`Va9FW(8jpIB#|
zzcPER^W`=Mazi+NW9s`)mW>|aT-loFIZjpmo8P#tiJoM~at*0(Bfq+nE?)xu2y6OT
zIe`ZMa0bo&>%^OcL~j%c{j5nI!Ce}k!;0-+`{p;-8u?GQd&BDXzkS@W(*FykIDPV%
z`9AEUtTrF#x8YClg;`Egve&SbGoR0pyPTBANfDm8(VoS#UwkJmy}Gn*MYcWhztHNA
zXv{uy53E^HXOzj^%QfdylQ0{9{vnC&%L?;fW$0-n!}IPJy02L7F!gsgdr?Mjie{9P
zj_}KqS+m5-hkuJrz}`jTt>Bl{hA+CFq~8Cc>-xWlziVGR@V5GYV^73;YM#1S3;L8y
zAM4TW6KyOPVTJw=pQqS#HrE&Z=GeZevZI)Py_`A19mnGDEn3N#><4Qx#rs%sC>JN1
zHs@F5xlo%jWz+U^yvJbIi^+b-rn+l<-che*W8RQBCp|Xdyo-Ca-F0);FDy2M<}aem
z#>ubj((&6V%L(kKyYmCAMvM*N-ihUXYZ1T8;N4M{#bI`G((eY0b<_S%gnf6ysf*0Z
zb0;>B{2s)Nzppc6&7as2$i&cYEX$HixBA0)hO}F@YZ-&P2EHNC+53wdf+K$!yANaY
zvgcpkJ&ycn{>xG~UY{fz)Sd(p7}o3gc7l?{|EIzk{E)p0?VzRX>b>!0H&pmFTi$Id
z8j@1N&pwaaTbe$e^sOXIrhGZ!&S_^aZ#RUdjVWvE%a$)mDmv=ZB;2M6cSK448a5@L
zb-nidG<^}NIkIkZTMK&<{3~2`joIHAb+8Y`a9_r_Mz>*`^xT+U?cD5<Rwd;^+)5wH
zmJ~ky%l6r8{yfj_+6Iu3t=)3}8zV-#Dd$LxbwfhDAO4cx(8ucyu?b?DllnAHZ9lYW
zEth0HW>?X@pH8N4TsZy?s<qcM`eCWy?%dpxozab><iEG{#z>|ws#P1W%`IhL9KU{1
zE#DM)JIB+TqNXnchm7H-YEce9xOKSL0lE6Yuk|xqnXPj&b2ojAH*lL=F1APImthaJ
zSNEn&_jV9(wB5H*V(gp)N@zey&-s7eb$Py<)b%}{xXSg0x~hlQi_ii1U9o&JKKIN8
zU#oYgW7^06#h!Oco+xUchA!vmK&$iBCA`vI65hax7Zn^9^ybS}{W#OIIsaubFev7{
z$`<?|%wYZpV;laJWV>KUuzfHr*fH3NQ!={-yKxG656%Xc24z8cP!Xhpk-?~7bg);j
zPq1I`m0(_QZScJ6r~0cG)mpuqF4Hx7hHlZVdVxMwpQcaOXXvx_dHMo<k-kj-NI$5b
z&@bpW_1pS=y+W_ltMnTENf?9$VXv@%I5eybtHbf(Lvr?c=uts1gtg6(b%7d6(}(hV
zm!Z9RSo;he!!w9ypFj`Y7JnGeZak$tRXqFf2+V;z6M3fc90i^k__KJLcv^W*;rS-d
z**xd-EaIWRhF;F|bDnE>uIIUl=XRbu!ErCo!#qz=_p|sf+b6i0lLQL)3FAH#D77t;
zRNUppeapD3jQc(?d$JZ#fkMiuU?T6GmA(pVQ0X&htl)V%(7`Hx0koR$SV*W3p#g-3
zV$<Es`w*Wt(1eDVdNes75n4goyr3JQ_X*VpMT9;eG||*<Lj^AFqo6OL<>cNRttGV5
zggz$pHvBU<`j@(llMj?dI@Ixt3=QQ4#9kt_D%cFF`kCC9$&J%C548Sa&`tl0{|X6#
z>kC|eQ=`QC5!;N|`zB9fJ`Wm*g@%q0iasXR+t4EA`a8(wrkvD0fV{U%YzVO}9Zu=b
z$;iMdv@3+xkBF@!_6e~IIQeDi>1WFANV)BTHT(}uNT?#+;sT%qX9;=ISIcSjD(1%O
zU@KAzO-%)i#`~PK59#e5Q2U&L84k=&!1N40V(hw6YG+dVlQMu5+uPk3i{Zg!=GYWw
z+wnm!@O=R61fC-p^`m&|gFb2>P9Oox*90ar3R8fY!MM~h!ob2WGAfhVN1s9)WpoOm
z=rdB^BlROv*HL>Bwf7`v6*bzn3T4u!xAbo4bt&@~!;e+;+1{LYc{O@Rokcx`hMtMk
zHW}?Ph0&;^<@?~111%G2@nrTGr%+#Av@EEHn~UJ-H-piP<K9rP53+S%YTu7=J-<pQ
z0%H;7UZ>p0l>5xL7ObC2F0*JN?V3zE8LztN9?HD}H4!5;oL=4&o|}kdpUga&LRu@*
zYhJKDt@)JPp_Hkj`~)B-(gMo`Yr*qAty)ek??O!h^mn5r6X3f#Mr1bq-^TN;pnupJ
z6ow0U&SS)S1;vyb3Z5OPe{cMGP<|?PoX+#(=wqemsco56=Q29IXj^Z_wGi5RKwA-Q
z>%~a+qSpp6ngzie(i)kKGO7aI7wGOl7XdBf-UH|!Ko11E8_)$n7XaN2yi56q%#}c{
zLi&ElxUNQCui^P9*jf#UmZ>eGf6xc3R7LbGqk2E`qL@Ay$~f!*t+qd2a{aLaE?Plb
zK89xnlW^ZV^i3pMf>stYt~<a@RgBt1b{FgzzfY+L>B-elS4ion=+PCFT50Nf8R(V4
z-X`ac;Cv{Rf9Y6BJ6F*jJ0l9AHdNn?KB2!}F{R#s!Zp;j3<}?)t|zGLO-BA*>UxU0
z-lU$_pz>WPjLhiuH8NAicyB122+fme=d0-aRm>#h3cb>odU{aeUA1@go;oI4qmE_%
z_N85GsqZD~TS4iy!M<?h1kONBWY26eG)$qs8H{8dbku{99-_`yD7hKA#nd+lh@qUz
z-2n>sq;wT0hxX>g*uI80Rs>7nkDK{T->dZ0$G{4;%PH|1P_F{@IrY6yeaoot9qL;}
zU2jp>a<!M?&J|F*0%|`%MlOwh6}%Sx-1VW1`e(GSg7$4j`}(S)=x3@&bOodTD5HOa
zmt2hgZImvCI@`CasQWYOUPIj<Q@6~$)zrO)w!T6ApHP29TR)-)d(z%d;CuxI#q>fI
z)bGp8^8Gvm-1GQv^j8_JmGJH=EQ8fZG27?erO&DV!!(A+>8a&l`2@}ots(7RVcI=|
zFId)#<mA7AUS+nggv(dK=d0o8ZNc83`d{ULsR}6lC@okG9m0V>ro?rWcoS%mXENRc
z>5t9ftEI?^73yqw`CR120K?0h(e`4r=^*?n_A~Z{mWg1Ufy}GJp9dYUqAyl5^JH#W
zP8|fs66jc=Mo0gqMek6D?UQ$)X$S7j!M2V$yam{{VGa*w4wr!S39t@vGvvwORBDiU
zuqv1Y=DneHPcV;QPWJ=jX0*GQwhp52cYrtcqz|f~WpBo1UpVX#o<pf+9({NL7TK%t
zrqw2W!DOZQS!n39;qr6AB^cL&@nbNq16v{3-UQqGU|S2e<zV{+Y@dK_Sg;T~14$3Y
z9iUAx_JFpKKKuZTAA#``EX3{j_2tm$Z^1CW0d{zFV{in&p*#}*DEvD7`smJJ4*&kt
z$a530H*@0r7W{jGzmMmB9=;z2fBymA`Xju316Y-rJ0H>`gV7HIgZ+^c2SLLG_<JIh
zPsX2u?Ky+lQHRxeJkp{bUu5{U^j`(zy;rae{aCJ!2?nWS!BGNM;kA#z+7qmsfi(nc
z0a&*N>sDah4y=R0x(=+{gK>Li*{5J#$xQl8Z6Wqiumza=f_ZB&_XKkf#&|RO(a!((
z3{Q$au>Jc8{re>S`!@Z%l>S{y|E{2ahtt1dun61eRk%)Mpx7868Cz@_ef&@Q_%-@?
zHTHJ_^veI59f#>R0bO<k^&T1YLpSwP#}lsSnH>y7M-5a9c)rE+qhPT5G3l2FJ<(Y`
z!!{oB!c*|i;rTAlxjg5gBcukS@#y6q!A#r+Wd6ZuzX?IHnojs|!bk8N$#WFX4AScG
zXQ3rUJ2v8rhD0+`doOiPP#n$+dQn4vqbaw<#u>nP4Pdp<pPuQ@nqdI4VE|*$moezi
z80<{{_on}Q1&7mzN6`02;va>N4rYY=G9Ejj^|nRpZ5ynk_HD86_M)x(1luwe#f(KC
zMsa86-X1(77-6vnN(q<o?2pblh<P=EoQc#lnRz&ckw2WiKY~(6;va=yXDlw^r-A9(
zK4dPe16KrJZEJW7I|sO}f$vRiy}>EAM-OW2O>Mp4vBF?Ko`Xo6!1~GZSAS|8NR2(H
zv4k2$qnA+QR<y5(8hcS=G3_f3Y>j9sdUFK5x(_^e3|w&7z_$i|FmQEoFpzT`#X&La
zp5orcn->o%-nN)^PVsKVta6I0iuWlVQ+!}CtDEAf#jKTzXB4xtDQ+reT~mBYF{_#_
zMwC2Ne0K5q#jI+IFDYhCQ~dK{Ry13TD89b<refAJq}*A2FYd#|PvAaV{BrT@#qSia
zAiSoS-GUNb(!Hc_$v}ZD*|KB^?(-$fwzwL9C!XOY<+!6t_QS0yIS9<Rl}s*~UUGEF
z@ubWtX~u0UISqGJ$=Z@LOU^NPzF)G0luJu~ihGqwxz4yZ826TvJ4nCFgzqnT#I}MI
zQ?Iy$-z?#@jNrumTp+h7Fm6xd_BU?H7F(0Py$SDP+!4l|VBC~(_cHGO#vNx|n>)pX
zk1+1B#+_;0vy6L!aZlP}0r<ae!aqvno@>I^{ecNzlz_RCGFNZ$8<TRQac>hB{_+x_
z7gAs*9Mk~Ue}&my%`=v#met(B%=ih+go(tb^Bj(ZI)dj&o}+-DK^nGWT4FR%W)^9)
zks^)wZE)BEd?bYWI?p#rKNDZ1$ytQY0soJP$5LfLI4|fIie#D3Ls{ngQ0Dti;X>#{
zN+Rtx=h>2HYo49ZrMsXPcIEf@yW#JS<{3`79Gy_XlOnAWzY2dO{wPiejs|8g?A5*b
zg4sSsKR+JqNBAqGjbk-%0MB9Q?`b^Kd5*#2Iu<S4Mt$>nPUbm<=Nz8z@|?@_GoGLG
z{DS8yo?r4@&2tUUwLI7HJa6>=qpE*&E0)vyV!2=~uEGBL93Az!x|FobqW8nos8ci3
zS*tTreVEM(dAcJrd1vmy*gm^5`*%m)Z-tE56I)<!?(NV&`yzk#=N=l23l2cajprT~
z9L&9Aa0vFmPQjt<$m|+SLq-e_jtP!sk7WijB87}-WS^xqm`@*{9Gpq*X9Z^m2VzxU
zK<R~Ol}W*p;3CRj!aX&(jC)#ed2n?wJ-8;g9(i*^a3ff53T_Wh4DJa246eTh4+m|*
z(%@Bay~BM@@P4p7_%3p2HF(#cnZAz%To?QR85ji%6<4rG^;La?#cDIPS+GP6Py>Ps
z)nGL^xJYfKwhk^<JFA_8AF6M{Ntdd#;GxUZ+3M`zN9tU4Zt!Dusk$_{oSmUpf}g0h
z>a*Y%><*0&u4RX)A^4sC8G8da>#Out!7c0tEe~!DE5cN8d-#=b|KN`BwD7dxFZBCR
zdRyk;4BB)oeN#_pR&XJ)i-Sk$iN{q{@Sqx{Mypb_ubQgL)pYKI)Dh}Pb+G!XI!+y;
z+SGY!3e?=E=BNj_FI5kzht*~35%sA0v3gvWtDoqUUZ5g<ioQ~h(LdL}(kJR`_22Z@
z^xfR&>wEMg`g{6u{hYp-{j1mXPxTw&*7{fBcHwq<Df?DC>Sf{1;c!w%gvaQ2h5B%-
z@H^po;nv~z!$qOALeZicne4$_p5smEMA|ePnLird8HTlRDEdaOz2Kk{_Smps(I*P~
zqc42bgOMK2IBy2u6{1_V1+su$xb2vWa#g~Y@*k=ip6d>0_Jc3GGtQ-q^5*d3bYSa%
zDdXOcTY5DJM4rvzIhyCIJjisO@?cCb);t0|6L}N_P4H=eZj-B#r<z;#H!|;#w)lG(
zt&(<S-&@m8x!b#J`{i2)at}z~G6ys7kiL<-Z~ESbo|5}8`YZPyP7lhxnY(2U?+ngv
z&}jdc*Z)hf^$X}_e;)(HarAihy&WSUcjo`s#%+^v83fnLKW__+z1f}3x(gUHx%;K>
zdPdORGNQS6DPt@5=I$QCC=Y=?4Sxtf7#$W9@?RFhK3LB+$mPqt$>g%knAn8EX+v^2
zE#|y@{8j>9nP-9FFmW@v%f@y@Ui&*U-|}9P`$ikyvwXJ`65ii7#dDpV!I_+vjLFOn
z%t&VQnvb`~Z_;C)%j7?rvw2M7yCm++e9M1H4z%27IZrg5zio==JCQC`=$LuPYq{H4
zy#+kIS+Uux58>V}EcT>m!~?N=_CUvpHP**HyYbE;;MpxWDQLkCve(y4sFp}?LSLtb
zT7yk+%H4;Q-EhBYu!`nQ5fhwe;!fn2k^<*zs)F7M?n&H2rKMB;V_I&ZYY$+DnkNOe
zvj`1D2k!>uf@4&$0Byg$xqF%YfE`%ljKId1TmG}VKmN%)#XRF#B^-=xuxD@zYX!--
z&+ga_MLfF)rw6A2X|F@rH7LSD*c}|j!8fQwF0o$)tL#cjO0VDygLN|N9Eo|HvNuuW
z;CxM^pjXmaPLMMq_!baCnZ1RsJ&A8`9$Be<+vI--3dR%aW$LDq4Y<l>Mum$RuS3vE
za(#uT2Hhh1r;z!od5Y*^@k2CUh-BUyX)bYj`oPcK8Nsa?sebTTH#18IgSQ0PIKZ@A
z-erkYRXnVhY2y~i{<GlLZzCCZp@*y{5#AK;ka3l(o@WNnG@hx9t>wIG^qxEdeWcNO
z4QP`9?JQRvkBnGyzS{6;==HaiJC+-gZf1TgoqWi)-^+<utNC(C-<A<Rx3_2+x%u6C
zp4;nOuU&@FmqVbp5bNWFywWw6bs`rIr+2e&ubo6g3kPQ3GA{o1dQV0v_qMr~zr~gJ
zlJ+jiqs4oq<&c*^R;G0Wvz%=hfYme;duO%`SmKg*pdnlo7|sgdDfyj1r5QExt#t4O
zWR#DUJ((_CVk5{U)>Qk~iS1{Z9N|`biOkF8v^d4i8sUT_mt}^9XFPvd-}9HuGk+&J
zYyDx5&+}d%X0Y&HKF*Ug&vkYNXKL?cOc@JEW_NqH@LWEAvwYSum$ipe<VH3JTJFoW
zAZ?20JCQD4$BCWTf?f%Dc0l4Lui-{-SP5T@jUbxiBy@~Ob$@-0fVGL5&|`AV1u{Ud
ziYwClG-HeIAX(;;bbE;;-v&!&A8>91R*Ux_G=!9lza}=$=(?{PDkVoWgIrb<$SPIt
z5!4g#h!*@N)^ag=)Lz4}bLU}US_{9;Xw}|WUh+;jzDv>V1>{MJ?3Ri3G@muaP6?O=
zgk^X96d=Ys>=ndMHhOs&si&J-Ebg6wC^NRY*z2Op%g|F3z*%N&EI}YE>jG#gz#^8K
zcY+FQnfErnVETs1u~x%)XVvXQJ<=js^_)T3-snf6MDXls^wu1#_pe}0TfHT#r1f8-
zO>(c4nTaB4;!D<2yeA6o(OcoZqPNFAk2DGIg!{DK4R?Xw5%*cm-g)qV$^Eh3h44}X
zf3hiihh_&mxKHnn`>F|FVBF&j<aFbH+oZ@!P6aarXEaRkN2i-`cgg+y1*s+4R%(w1
z>tVPl!5<wX7^0z4V^k@%L^Jdd+#v>jR|9jpV2G-98SXh!OC+sT(GQIKcjK0ds}9gF
zh|3PR(%&~JV|g2))FGPF5Nf=nt9|twxCR5*dAF>l>Q`~6v4f-3ktS^0vP4R;GXmy7
z&bq7MUnb>sgLz-gSq=7gI872<VDO8Ds?_}^e6I=5H({BDioGy#_cbYFrIgy$gm*Di
z?cu^}NI%@<p2u4RrQX(@0Z|qDdE9c7zN3NM)r5!YQqqe}dzHaINDntDD{-IDx8tUG
zhbnbR`Y_(;C@rf(rM5JjaE`u@aJi(b?F2(`u6`3&PB1C;7rh7W?IxTu7|Kj|XXDB~
zf^Y?x*(VeDzJgQ9*N9bclRnRcrACobO8wg8ZfEc;Gp+7z!u<^WDbucL#(mJVYZu`n
zwUfd8oZf-(k@_XvX$ISL>4D&UQ~UP}%r1H;xjVYBP(IAma)2o{++g0@xKA5*GvjV)
zu$^GS<BfZSaSt%=-^2|*HSWcxuXZ=-hZ=XJaR&<ztI)LWr>0jwb^RbCSZcz%7<Z6y
z&o*vP<L)eO@IB++ZzvgR(swlOF3c1e6UA(vjue$EtQj|9YH&mSsjW@HO-*%e&1ww0
ztXl@xao@=9-0i_#+z+PjC)k;Lo;|vE)G*!|tqRsDt$M1>gU#ye=bofS%xrF%t5UOC
z>+01Hni^-<slA$7>YLR5#vNze3C5jb+#`&8tZ`==_XOjf)I5J~t6CtQ`g-ev)@F59
zn}p9*d(nWZK#e)<z#&RFML6MHED-Tea&fWgC4QRoMG8q=`bK=@h4Dp>NqmU&IVWM_
zTRVSCBy2MOEK`qWCvTPujZz1(pV__osM;aw+_BYDho~#ZPQktH;Oe7>sK*YOG+~H(
zYs#cUhUj1_xq8slDF+XM8^OvWuGo6Ae<rT1KNYsJxS?@-8MnJ}i;Qbpip41~J&oJf
zxMogZ-$=UHW+67}W~?pbD?u8YlX?hQOm@}M7l?ke{_>Dr1@=WFaar{!b)}kv`%QLP
zmAZ&`T8e$ro|5wERk&w`N8`@oX<{y-7ZmRh)tQ{9;(VQ)=%d$e4E~@7!9}JO2HU03
zW!t6H0?JG<F|mX>Wu{KxVPp-=Kv$|9TuthDlZL%VsBidm_*D2n_)z%I@WJrm@QLt|
z@bT~;;bY;Gp?n!Ba{VIhE1(~33p3LT+et5KC%t<+={?#>@7YdzuXfU9&F@BnmX6?2
z;dbH%GmJZn(YqnI6IX@DhO%BD#3P(RNX<~9oh3!~_Pb%9Ex@)vK41jtgByZdREgR~
zFsb7V{0VBFEg4=OUh6{Far#nl^yReVKY~{|FIlN-RINII9qI{cqMD>m<-JNZ<#&e@
zs7YOhTgD1BWCb#UwX*o=Q*P1hHYBd>{|a|Yj<~W*CgJXsm;DNHhXwlN*>l<?v$3tN
aNy#2p0lX;*fhy8>;K@lut?X_K>HiPw`>yE#

diff --git a/public/fonts/Exo2-Regular.ttf b/public/fonts/Exo2-Regular.ttf
deleted file mode 100644
index 63bc4bb005edaf09aba4dada657b63907ff88aee..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 126624
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

diff --git a/public/images/setup/google-cloud-1.png b/public/images/setup/google-cloud-1.png
deleted file mode 100644
index f6037932afe8dca596580e31e1d4645568012a9b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 60601
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

diff --git a/public/next.svg b/public/next.svg
deleted file mode 100644
index 5174b28..0000000
--- a/public/next.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
\ No newline at end of file
diff --git a/public/setup/googleCloud.md b/public/setup/googleCloud.md
deleted file mode 100644
index e69de29..0000000
diff --git a/public/vercel.svg b/public/vercel.svg
deleted file mode 100644
index d2f8422..0000000
--- a/public/vercel.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>
\ No newline at end of file
diff --git a/src/app/@explorer.tsx b/src/app/@explorer.tsx
deleted file mode 100644
index 9acdbc8..0000000
--- a/src/app/@explorer.tsx
+++ /dev/null
@@ -1,189 +0,0 @@
-"use client";
-
-import Link from "next/link";
-import { usePathname } from "next/navigation";
-import { useContext, useEffect, useMemo, useState } from "react";
-import toast from "react-hot-toast";
-import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-import { Button } from "~/components/ui/button";
-import { Separator } from "~/components/ui/separator";
-
-import { LayoutContext } from "~/context/layoutContext";
-
-import config from "~/config/gIndex.config";
-
-import FileGrid from "./@file.grid";
-import FileList from "./@file.list";
-import { GetFiles } from "./actions";
-
-type Props = {
-  files: z.infer<typeof Schema_File>[];
-  nextPageToken?: string;
-  root?: boolean;
-};
-export default function FileBrowser({ files, nextPageToken, root }: Props) {
-  const { layout } = useContext(LayoutContext);
-  const pathname = usePathname();
-  const prevPath = useMemo<string>(() => {
-    const path = pathname
-      .split("/")
-      .slice(0, -1)
-      .join("/")
-      .replace(/\/+/g, "/");
-
-    return new URL(path, config.basePath).pathname;
-  }, [pathname]);
-
-  const [fileList, setFileList] =
-    useState<z.infer<typeof Schema_File>[]>(files);
-  const [nextToken, setNextToken] = useState<string | undefined>(nextPageToken);
-  const [loadMoreLoading, setLoadMoreLoading] = useState<boolean>(false);
-
-  const [loading, setLoading] = useState<boolean>(true);
-
-  useEffect(() => {
-    setLoading(false);
-  }, []);
-
-  const onLoadMore = async () => {
-    setLoadMoreLoading(true);
-    try {
-      if (!nextToken) throw new Error("No more files to load");
-      const data = await GetFiles({ pageToken: nextToken });
-      const uniqueData = [...fileList, ...data.files].filter(
-        (item, index, array) =>
-          index === array.findIndex((i) => i.encryptedId === item.encryptedId),
-      );
-      setFileList(uniqueData);
-      // const uniqueData = new Set([...fileList, ...data.files]);
-      // setFileList([...uniqueData]);
-      setNextToken(data.nextPageToken);
-    } catch (error) {
-      const e = error as Error;
-      console.error(e.message);
-      toast.error(e.message);
-    } finally {
-      setLoadMoreLoading(false);
-    }
-  };
-
-  if (loading) {
-    return (
-      <div
-        className={cn(
-          "mx-auto h-[50dvh] w-full max-w-screen-desktop",
-          "rounded-[var(--radius)] bg-card",
-          "gap-3 p-3",
-          "flex-grow-0",
-          "flex flex-col items-center justify-center",
-        )}
-      >
-        <Icon
-          name='LoaderCircle'
-          size={32}
-          className='animate-spin'
-        />
-        <p>Wait a moment while we load your files...</p>
-      </div>
-    );
-  }
-
-  return (
-    <div
-      className={cn(
-        "mx-auto w-full max-w-screen-desktop",
-        "gap-3 p-3",
-        "flex-grow-0",
-        "flex flex-col",
-      )}
-    >
-      {!root && (
-        <Button
-          size={"sm"}
-          variant={"ghost"}
-          className='justify-start'
-          asChild
-        >
-          <Link href={prevPath}>
-            <Icon
-              name='CornerLeftUp'
-              size={14}
-              className='mr-3'
-            />
-            Back
-          </Link>
-        </Button>
-      )}
-      {!fileList.length && (
-        <div className='col-span-full flex h-full min-h-[25vh] flex-col items-center justify-center gap-3'>
-          <Icon
-            name='Frown'
-            size={32}
-            className='text-muted-foreground'
-          />
-          <span className='text-center text-muted-foreground'>
-            There are no files in this folder
-          </span>
-        </div>
-      )}
-      {layout === "list" && (
-        <div className='flex w-full flex-col gap-1.5'>
-          {fileList.map((file) => (
-            <div
-              key={file.encryptedId}
-              className='group'
-            >
-              <FileList
-                key={file.encryptedId}
-                data={file}
-              />
-              <Separator className='mt-1.5 group-last:hidden' />
-            </div>
-          ))}
-        </div>
-      )}
-      {layout === "grid" && (
-        <div className='grid grid-cols-1 gap-3 mobile:grid-cols-2 tablet:grid-cols-3 desktop:grid-cols-4'>
-          {fileList.map((file) => (
-            <div
-              key={file.encryptedId}
-              className='group'
-            >
-              <FileGrid
-                key={file.encryptedId}
-                data={file}
-              />
-            </div>
-          ))}
-        </div>
-      )}
-
-      {nextToken && (
-        <Button
-          className='col-span-full gap-3'
-          size={"sm"}
-          variant={"secondary"}
-          disabled={loadMoreLoading}
-          onClick={onLoadMore}
-        >
-          {loadMoreLoading ? (
-            <>
-              <Icon
-                name='LoaderCircle'
-                size={16}
-                className='animate-spin'
-              />
-              Loading...
-            </>
-          ) : (
-            <>Load More</>
-          )}
-        </Button>
-      )}
-    </div>
-  );
-}
diff --git a/src/app/@file.grid.tsx b/src/app/@file.grid.tsx
deleted file mode 100644
index 7359d8b..0000000
--- a/src/app/@file.grid.tsx
+++ /dev/null
@@ -1,342 +0,0 @@
-"use client";
-
-import Link from "next/link";
-import { usePathname } from "next/navigation";
-import nProgress from "nprogress";
-import { useMemo, useState } from "react";
-import toast from "react-hot-toast";
-import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-import { Button } from "~/components/ui/button";
-import {
-  Drawer,
-  DrawerClose,
-  DrawerContent,
-  DrawerDescription,
-  DrawerFooter,
-  DrawerHeader,
-  DrawerTitle,
-  DrawerTrigger,
-} from "~/components/ui/drawer";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "~/components/ui/dropdown-menu";
-
-import useMediaQuery from "~/hooks/useMediaQuery";
-import bytesToReadable from "~/utils/bytesFormat";
-import { durationToReadable } from "~/utils/durationFormat";
-import { getPreviewIcon } from "~/utils/previewHelper";
-
-import config from "~/config/gIndex.config";
-
-import { CreateDownloadToken } from "./actions";
-
-type Props = {
-  data: z.infer<typeof Schema_File>;
-  disabled?: boolean;
-};
-export default function FileGrid({ data, disabled }: Props) {
-  const pathname = usePathname();
-  const filePath = useMemo<string>(() => {
-    // const currentPath = pathname.startsWith("/e") ? pathname : `/e${pathname}`;
-    // Set to pathname to remove the /e prefix
-    const path = [pathname, encodeURIComponent(data.name)]
-      .join("/")
-      .replace(/\/+/g, "/");
-
-    return new URL(path, config.basePath).pathname;
-  }, [data, pathname]);
-
-  const [thumbnailURL, setThumbnailURL] = useState<string>(
-    `/api/thumb/${data.encryptedId}?size=2`,
-  );
-  const [actionOpen, setActionOpen] = useState<boolean>(false);
-  const isDesktop = useMediaQuery("(min-width: 768px)");
-
-  const onCopy = async (e: React.MouseEvent) => {
-    e.stopPropagation();
-    try {
-      toast.promise(
-        navigator.clipboard.writeText(
-          new URL(filePath, config.basePath).toString(),
-        ),
-        {
-          loading: "Copying link...",
-          success: "Link copied!",
-          error: "Failed to copy link",
-        },
-      );
-    } catch (error) {
-      const e = error as Error;
-      console.error(e.message);
-    }
-  };
-  const onDownload = async (e: React.MouseEvent) => {
-    e.stopPropagation();
-    toast.loading("Creating download token...", {
-      id: `download-${data.encryptedId}`,
-    });
-    try {
-      const token = await CreateDownloadToken();
-      if (!token) throw new Error("Failed to create download token");
-      toast.success("Opening download link...", {
-        id: `download-${data.encryptedId}`,
-      });
-
-      const timeout = setTimeout(() => {
-        clearTimeout(timeout);
-        window.open(`/api/download/${data.encryptedId}?token=${token}`);
-      }, 1000);
-    } catch (error) {
-      const e = error as Error;
-      console.error(e.message);
-      toast.error(e.message, {
-        id: `download-${data.encryptedId}`,
-      });
-    }
-  };
-
-  return (
-    <div className='relative h-full w-full'>
-      {isDesktop ? (
-        <DropdownMenu
-          open={actionOpen}
-          onOpenChange={setActionOpen}
-        >
-          <DropdownMenuTrigger asChild>
-            <Button
-              size={"icon"}
-              variant={"secondary"}
-              className='absolute right-1 top-1 z-20 size-8'
-            >
-              <Icon
-                name='EllipsisVertical'
-                size={16}
-              />
-            </Button>
-          </DropdownMenuTrigger>
-          <DropdownMenuContent align='end'>
-            <DropdownMenuItem
-              onClick={onCopy}
-              disabled={disabled}
-            >
-              <Icon
-                name='Link'
-                className='mr-3'
-                size={"1rem"}
-              />
-              Copy link
-            </DropdownMenuItem>
-            {data.mimeType.includes("folder") ? null : (
-              <DropdownMenuItem
-                onClick={onDownload}
-                disabled={disabled}
-              >
-                <Icon
-                  name='Download'
-                  className='mr-3'
-                  size={"1rem"}
-                />
-                Download
-              </DropdownMenuItem>
-            )}
-          </DropdownMenuContent>
-        </DropdownMenu>
-      ) : (
-        <Drawer
-          open={actionOpen}
-          onOpenChange={setActionOpen}
-          shouldScaleBackground
-        >
-          <DrawerTrigger asChild>
-            <Button
-              size={"icon"}
-              variant={"secondary"}
-              className='absolute right-1 top-1 z-20 size-8'
-            >
-              <Icon
-                name='EllipsisVertical'
-                size={16}
-              />
-            </Button>
-          </DrawerTrigger>
-          <DrawerContent>
-            <DrawerHeader className='text-left'>
-              <DrawerTitle>Actions</DrawerTitle>
-              <DrawerDescription>
-                What would you like to do with this file?
-              </DrawerDescription>
-            </DrawerHeader>
-            <div className='grid gap-1.5 px-4'>
-              <DrawerClose asChild>
-                <Button
-                  onClick={onCopy}
-                  disabled={disabled}
-                >
-                  <Icon
-                    name='Link'
-                    className='mr-3'
-                    size={"1rem"}
-                  />
-                  Copy link
-                </Button>
-              </DrawerClose>
-              {data.mimeType.includes("folder") ? null : (
-                <DrawerClose asChild>
-                  <Button
-                    onClick={onDownload}
-                    disabled={disabled}
-                  >
-                    <Icon
-                      name='Download'
-                      className='mr-3'
-                      size={"1rem"}
-                    />
-                    Download
-                  </Button>
-                </DrawerClose>
-              )}
-            </div>
-
-            <DrawerFooter>
-              <DrawerClose asChild>
-                <Button variant={"secondary"}>Close</Button>
-              </DrawerClose>
-            </DrawerFooter>
-          </DrawerContent>
-        </Drawer>
-      )}
-      <Link
-        onClick={async (e) => {
-          if (disabled) {
-            e.preventDefault();
-            e.stopPropagation();
-            await new Promise((resolve) => setTimeout(resolve, 500));
-            nProgress.done(true);
-          }
-        }}
-        href={filePath}
-        className={cn(
-          "h-full w-full",
-          "rounded-[var(--radius)]",
-          "flex flex-col content-stretch justify-stretch gap-3",
-          "hover:bg-muted/50",
-          "transition",
-          "border border-border",
-        )}
-      >
-        <div
-          className={cn(
-            "flex-shrink flex-grow",
-            "flex flex-col items-center gap-3",
-            "relative",
-          )}
-        >
-          {/* If it's media, show thumbnail */}
-          <div className='relative grid h-32 w-full flex-shrink-0 place-items-center overflow-hidden bg-muted/25'>
-            {data.thumbnailLink &&
-            (data.mimeType.startsWith("video") ||
-              data.mimeType.startsWith("image")) ? (
-              <>
-                <img
-                  src={thumbnailURL}
-                  alt={data.name}
-                  onLoad={(e) => {
-                    if (thumbnailURL.includes("size=2")) {
-                      setThumbnailURL(`/api/thumb/${data.encryptedId}`);
-                    }
-                  }}
-                  className='rounded-top-[var(--radius)] absolute -z-0 h-32 w-full flex-shrink-0 flex-grow-0 object-cover opacity-50'
-                />
-                <img
-                  src={thumbnailURL}
-                  alt={data.name}
-                  onLoad={(e) => {
-                    if (thumbnailURL.includes("size=2")) {
-                      setThumbnailURL(`/api/thumb/${data.encryptedId}`);
-                    }
-                  }}
-                  className='relative z-0 h-32 w-full flex-shrink-0 flex-grow-0 object-contain backdrop-blur'
-                />
-
-                {data.mimeType.startsWith("video") && (
-                  <>
-                    <Icon
-                      name='Play'
-                      className='absolute left-1/2 top-1/2 z-10 -translate-x-1/2 -translate-y-1/2 rounded-full bg-muted-foreground fill-muted p-1.5 text-muted opacity-75'
-                      size={32}
-                    />
-                    <div className='absolute bottom-0 right-0 z-10 bg-background px-1 py-0.5 text-xs text-foreground'>
-                      {durationToReadable(
-                        data.videoMediaMetadata?.durationMillis || 0,
-                      )}
-                    </div>
-                  </>
-                )}
-              </>
-            ) : (
-              <Icon
-                name={
-                  data.mimeType.includes("folder")
-                    ? "Folder"
-                    : getPreviewIcon(data.fileExtension || "", data.mimeType)
-                }
-                className='size-16 flex-shrink-0 flex-grow-0 p-3'
-              />
-            )}
-          </div>
-
-          {/* File data */}
-          <div className='flex h-full w-full flex-col justify-between gap-1.5 px-3 py-1.5'>
-            <span className='line-clamp-2 h-full whitespace-pre-wrap text-pretty break-all'>
-              {config.siteConfig.showFileExtension
-                ? data.name
-                : data.fileExtension
-                ? data.name.replace(new RegExp(`.${data.fileExtension}$`), "")
-                : data.name}
-            </span>
-            <div className='muted flex items-center gap-1'>
-              <span
-                className={cn(
-                  "line-clamp-1 whitespace-pre-wrap break-all text-sm",
-                  config.siteConfig.showFileExtension &&
-                    !data.mimeType.includes("folder")
-                    ? "hidden"
-                    : "",
-                )}
-              >
-                {data.mimeType.includes("folder")
-                  ? "folder"
-                  : data.fileExtension || "unknown"}
-              </span>
-              {!data.mimeType.includes("folder") && (
-                <>
-                  {config.siteConfig.showFileExtension ? null : (
-                    <Icon
-                      name='Slash'
-                      size={"0.875rem"}
-                    />
-                  )}
-                  <span className='whitespace-nowrap text-sm'>
-                    {bytesToReadable(data.size || 0)}
-                  </span>
-                </>
-              )}
-            </div>
-            <div className='muted flex items-center gap-1'>
-              <span className='whitespace-nowrap text-sm'>
-                {new Date(data.modifiedTime).toLocaleDateString()}
-              </span>
-            </div>
-          </div>
-        </div>
-      </Link>
-    </div>
-  );
-}
diff --git a/src/app/@file.list.tsx b/src/app/@file.list.tsx
deleted file mode 100644
index 2108656..0000000
--- a/src/app/@file.list.tsx
+++ /dev/null
@@ -1,330 +0,0 @@
-"use client";
-
-import Link from "next/link";
-import { usePathname } from "next/navigation";
-import nProgress from "nprogress";
-import { useMemo, useState } from "react";
-import toast from "react-hot-toast";
-import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-import { Button } from "~/components/ui/button";
-import {
-  Drawer,
-  DrawerClose,
-  DrawerContent,
-  DrawerDescription,
-  DrawerFooter,
-  DrawerHeader,
-  DrawerTitle,
-  DrawerTrigger,
-} from "~/components/ui/drawer";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "~/components/ui/dropdown-menu";
-
-import useMediaQuery from "~/hooks/useMediaQuery";
-import bytesToReadable from "~/utils/bytesFormat";
-import { durationToReadable } from "~/utils/durationFormat";
-import { getPreviewIcon } from "~/utils/previewHelper";
-
-import config from "~/config/gIndex.config";
-
-import { CreateDownloadToken } from "./actions";
-
-type Props = {
-  data: z.infer<typeof Schema_File>;
-  disabled?: boolean;
-};
-export default function FileList({ data, disabled }: Props) {
-  const pathname = usePathname();
-
-  const filePath = useMemo<string>(() => {
-    const path = [pathname, encodeURIComponent(data.name)]
-      .join("/")
-      .replace(/\/+/g, "/");
-
-    return new URL(path, config.basePath).pathname;
-  }, [data, pathname]);
-
-  const [thumbnailURL, setThumbnailURL] = useState<string>(
-    `/api/thumb/${data.encryptedId}?size=2`,
-  );
-  const [actionOpen, setActionOpen] = useState<boolean>(false);
-  const isDesktop = useMediaQuery("(min-width: 768px)");
-
-  const onCopy = async (e: React.MouseEvent) => {
-    e.stopPropagation();
-    try {
-      toast.promise(
-        navigator.clipboard.writeText(
-          new URL(filePath, config.basePath).toString(),
-        ),
-        {
-          loading: "Copying link...",
-          success: "Link copied!",
-          error: "Failed to copy link",
-        },
-      );
-    } catch (error) {
-      const e = error as Error;
-      console.error(e.message);
-    }
-  };
-  const onDownload = async (e: React.MouseEvent) => {
-    e.stopPropagation();
-    toast.loading("Creating download token...", {
-      id: `download-${data.encryptedId}`,
-    });
-    try {
-      const token = await CreateDownloadToken();
-      if (!token) throw new Error("Failed to create download token");
-      toast.success("Opening download link...", {
-        id: `download-${data.encryptedId}`,
-      });
-
-      const timeout = setTimeout(() => {
-        clearTimeout(timeout);
-        window.open(`/api/download/${data.encryptedId}?token=${token}`);
-      }, 1000);
-    } catch (error) {
-      const e = error as Error;
-      console.error(e.message);
-      toast.error(e.message, {
-        id: `download-${data.encryptedId}`,
-      });
-    }
-  };
-
-  return (
-    <div className='relative flex h-full w-full flex-row-reverse items-center'>
-      <div className='absolute bottom-auto right-0 top-auto grid flex-grow place-items-center'>
-        {isDesktop ? (
-          <DropdownMenu
-            open={actionOpen}
-            onOpenChange={setActionOpen}
-          >
-            <DropdownMenuTrigger asChild>
-              <Button
-                size={"icon"}
-                variant={"ghost"}
-                // className='size-8'
-                className='absolute right-1 z-20 size-8'
-              >
-                <Icon
-                  name='EllipsisVertical'
-                  size={16}
-                />
-              </Button>
-            </DropdownMenuTrigger>
-            <DropdownMenuContent align='end'>
-              <DropdownMenuItem
-                onClick={onCopy}
-                disabled={disabled}
-              >
-                <Icon
-                  name='Link'
-                  className='mr-3'
-                  size={"1rem"}
-                />
-                Copy link
-              </DropdownMenuItem>
-              {data.mimeType.includes("folder") ? null : (
-                <DropdownMenuItem
-                  onClick={onDownload}
-                  disabled={disabled}
-                >
-                  <Icon
-                    name='Download'
-                    className='mr-3'
-                    size={"1rem"}
-                  />
-                  Download
-                </DropdownMenuItem>
-              )}
-            </DropdownMenuContent>
-          </DropdownMenu>
-        ) : (
-          <Drawer
-            open={actionOpen}
-            onOpenChange={setActionOpen}
-            shouldScaleBackground
-          >
-            <DrawerTrigger asChild>
-              <Button
-                size={"icon"}
-                variant={"ghost"}
-                // className='size-8'
-                className='z-20 size-8'
-              >
-                <Icon
-                  name='EllipsisVertical'
-                  size={16}
-                />
-              </Button>
-            </DrawerTrigger>
-            <DrawerContent>
-              <DrawerHeader className='text-left'>
-                <DrawerTitle>Actions</DrawerTitle>
-                <DrawerDescription>
-                  What would you like to do with this file?
-                </DrawerDescription>
-              </DrawerHeader>
-              <div className='grid gap-1.5 px-4'>
-                <DrawerClose asChild>
-                  <Button
-                    onClick={onCopy}
-                    disabled={disabled}
-                  >
-                    <Icon
-                      name='Link'
-                      className='mr-3'
-                      size={"1rem"}
-                    />
-                    Copy link
-                  </Button>
-                </DrawerClose>
-                {data.mimeType.includes("folder") ? null : (
-                  <DrawerClose asChild>
-                    <Button
-                      onClick={onDownload}
-                      disabled={disabled}
-                    >
-                      <Icon
-                        name='Download'
-                        className='mr-3'
-                        size={"1rem"}
-                      />
-                      Download
-                    </Button>
-                  </DrawerClose>
-                )}
-              </div>
-
-              <DrawerFooter>
-                <DrawerClose asChild>
-                  <Button variant={"secondary"}>Close</Button>
-                </DrawerClose>
-              </DrawerFooter>
-            </DrawerContent>
-          </Drawer>
-        )}
-      </div>
-      <Link
-        onClick={async (e) => {
-          if (disabled) {
-            e.preventDefault();
-            e.stopPropagation();
-            await new Promise((resolve) => setTimeout(resolve, 500));
-            nProgress.done(true);
-          }
-        }}
-        href={filePath}
-        className={cn(
-          "relative",
-          // "w-full",
-          "px-1.5 py-1 pr-10", // since action button is size-8
-          "rounded-[var(--radius)]",
-          "flex flex-grow items-center justify-between gap-3",
-          "hover:bg-muted/50",
-          "transition",
-        )}
-      >
-        <div className={cn("flex-shrink flex-grow", "flex items-center gap-3")}>
-          {/* If it's media, show thumbnail */}
-          <div className='relative flex-shrink-0 rounded-[var(--radius)] bg-muted/25'>
-            {data.thumbnailLink &&
-            (data.mimeType.startsWith("video") ||
-              data.mimeType.startsWith("image")) ? (
-              <>
-                <img
-                  src={thumbnailURL}
-                  alt={data.name}
-                  onLoad={(e) => {
-                    if (thumbnailURL.includes("size=2")) {
-                      setThumbnailURL(`/api/thumb/${data.encryptedId}`);
-                    }
-                  }}
-                  className='size-16 flex-shrink-0 flex-grow-0 rounded-[var(--radius)] object-cover tablet:size-20'
-                />
-
-                {data.mimeType.startsWith("video") && (
-                  <>
-                    <Icon
-                      name='Play'
-                      className='absolute left-1/2 top-1/2 z-10 -translate-x-1/2 -translate-y-1/2 rounded-full bg-muted-foreground fill-muted p-1.5 text-muted opacity-75'
-                      size={24}
-                    />
-                    <div className='absolute bottom-0 right-0 z-10 bg-background px-1 py-0.5 text-[10px] text-foreground tablet:text-xs'>
-                      {durationToReadable(
-                        data.videoMediaMetadata?.durationMillis || 0,
-                      )}
-                    </div>
-                  </>
-                )}
-              </>
-            ) : (
-              <Icon
-                name={
-                  data.mimeType.includes("folder")
-                    ? "Folder"
-                    : getPreviewIcon(data.fileExtension || "", data.mimeType)
-                }
-                className='size-16 flex-shrink-0 flex-grow-0 p-3 tablet:size-20'
-              />
-            )}
-          </div>
-
-          {/* File data */}
-          <div className='flex flex-grow flex-col'>
-            <span className='line-clamp-1 whitespace-pre-wrap break-all'>
-              {config.siteConfig.showFileExtension
-                ? data.name
-                : data.fileExtension
-                ? data.name.replace(new RegExp(`.${data.fileExtension}$`), "")
-                : data.name}
-            </span>
-            <div className='muted flex items-center gap-1'>
-              <span
-                className={cn(
-                  "line-clamp-1 whitespace-pre-wrap break-all text-sm",
-                  config.siteConfig.showFileExtension &&
-                    !data.mimeType.includes("folder")
-                    ? "hidden"
-                    : "",
-                )}
-              >
-                {data.mimeType.includes("folder")
-                  ? "folder"
-                  : data.fileExtension || "unknown"}
-              </span>
-              {!data.mimeType.includes("folder") && (
-                <>
-                  {config.siteConfig.showFileExtension ? null : (
-                    <Icon
-                      name='Slash'
-                      size={"0.875rem"}
-                    />
-                  )}
-                  <span className='whitespace-nowrap text-sm'>
-                    {bytesToReadable(data.size || 0)}
-                  </span>
-                </>
-              )}
-            </div>
-            <div className='muted flex items-center gap-1'>
-              <span className='whitespace-nowrap text-sm'>
-                {new Date(data.modifiedTime).toLocaleDateString()}
-              </span>
-            </div>
-          </div>
-        </div>
-      </Link>
-    </div>
-  );
-}
diff --git a/src/app/@header.breadcrumb.tsx b/src/app/@header.breadcrumb.tsx
deleted file mode 100644
index d371315..0000000
--- a/src/app/@header.breadcrumb.tsx
+++ /dev/null
@@ -1,185 +0,0 @@
-"use client";
-
-import { DropdownMenuTrigger } from "@radix-ui/react-dropdown-menu";
-import Link from "next/link";
-import { Fragment, useState } from "react";
-import { z } from "zod";
-import { Schema_Breadcrumb } from "~/schema";
-
-import Icon from "~/components/Icon";
-import {
-  Breadcrumb,
-  BreadcrumbEllipsis,
-  BreadcrumbItem,
-  BreadcrumbLink,
-  BreadcrumbList,
-  BreadcrumbPage,
-  BreadcrumbSeparator,
-} from "~/components/ui/breadcrumb";
-import { Button } from "~/components/ui/button";
-import {
-  Drawer,
-  DrawerClose,
-  DrawerContent,
-  DrawerFooter,
-  DrawerHeader,
-  DrawerTitle,
-  DrawerTrigger,
-} from "~/components/ui/drawer";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-} from "~/components/ui/dropdown-menu";
-import { Separator } from "~/components/ui/separator";
-import { Skeleton } from "~/components/ui/skeleton";
-
-import useMediaQuery from "~/hooks/useMediaQuery";
-
-import config from "~/config/gIndex.config";
-
-type Props = {
-  data: z.infer<typeof Schema_Breadcrumb>[];
-  loading?: boolean;
-};
-export default function HeaderBreadcrumb({ data, loading }: Props) {
-  const [open, setOpen] = useState<boolean>(false);
-  const isDesktop = useMediaQuery("(min-width: 768px)");
-
-  if (loading) return <Skeleton className='h-5 w-1/2' />;
-
-  return (
-    <div className='flex w-full flex-nowrap items-center'>
-      <Breadcrumb>
-        <BreadcrumbList>
-          <BreadcrumbItem>
-            <BreadcrumbLink asChild>
-              <Link href={"/"}>
-                <div className='flex items-center gap-1'>
-                  <Icon
-                    name='FolderRoot'
-                    size={16}
-                  />
-                  ~
-                </div>
-              </Link>
-            </BreadcrumbLink>
-          </BreadcrumbItem>
-          {!!data.length ? (
-            <>
-              <BreadcrumbSeparator />
-
-              {data.length > config.siteConfig.breadcrumbMax ? (
-                <>
-                  {isDesktop ? (
-                    <DropdownMenu
-                      open={open}
-                      onOpenChange={setOpen}
-                    >
-                      <DropdownMenuTrigger>
-                        <BreadcrumbEllipsis className='w-4' />
-                      </DropdownMenuTrigger>
-                      <DropdownMenuContent align='start'>
-                        {data
-                          .slice(0, -config.siteConfig.breadcrumbMax + 1)
-                          .map((item, _, array) => (
-                            <DropdownMenuItem
-                              key={`${item.label}/${item.href}`}
-                            >
-                              <BreadcrumbLink asChild>
-                                <Link
-                                  href={`/${array
-                                    .slice(0, array.indexOf(item) + 1)
-                                    .map((item) => item.href)
-                                    .join("/")}`}
-                                  className='w-full'
-                                >
-                                  {item.label}
-                                </Link>
-                              </BreadcrumbLink>
-                            </DropdownMenuItem>
-                          ))}
-                      </DropdownMenuContent>
-                    </DropdownMenu>
-                  ) : (
-                    <Drawer
-                      open={open}
-                      onOpenChange={setOpen}
-                    >
-                      <DrawerTrigger>
-                        <BreadcrumbEllipsis className='w-4' />
-                      </DrawerTrigger>
-                      <DrawerContent>
-                        <DrawerHeader className='text-left'>
-                          <DrawerTitle>
-                            Navigate to parent directories
-                          </DrawerTitle>
-                          <Separator />
-                        </DrawerHeader>
-                        <div className='grid gap-1.5 px-4'>
-                          {data
-                            .slice(0, -config.siteConfig.breadcrumbMax + 1)
-                            .map((item, _, array) => (
-                              <BreadcrumbItem
-                                key={`${item.label}/${item.href}`}
-                              >
-                                <BreadcrumbLink asChild>
-                                  <Link
-                                    href={`/${array
-                                      .slice(0, array.indexOf(item) + 1)
-                                      .map((item) => item.href)
-                                      .join("/")}`}
-                                    className='w-full py-1.5'
-                                  >
-                                    {item.label}
-                                  </Link>
-                                </BreadcrumbLink>
-                              </BreadcrumbItem>
-                            ))}
-                        </div>
-
-                        <DrawerFooter>
-                          <DrawerClose asChild>
-                            <Button variant={"secondary"}>Close</Button>
-                          </DrawerClose>
-                        </DrawerFooter>
-                      </DrawerContent>
-                    </Drawer>
-                  )}
-
-                  <BreadcrumbSeparator />
-                </>
-              ) : null}
-
-              {data.slice(-config.siteConfig.breadcrumbMax + 1).map((item) => (
-                <Fragment key={`${item.label}/${item.href}`}>
-                  <BreadcrumbItem className='line-clamp-1 whitespace-pre-wrap break-all'>
-                    {item.href ? (
-                      <>
-                        <BreadcrumbLink asChild>
-                          <Link
-                            href={`/${data
-                              .map((item) => item.href)
-                              .join("/")
-                              .replace(/\/\//g, "/")}`}
-                          >
-                            {item.label}
-                          </Link>
-                        </BreadcrumbLink>
-                      </>
-                    ) : (
-                      <BreadcrumbPage className='line-clamp-1 whitespace-pre-wrap break-all'>
-                        {item.label}
-                      </BreadcrumbPage>
-                    )}
-                  </BreadcrumbItem>
-                  {item.href && <BreadcrumbSeparator />}
-                </Fragment>
-              ))}
-            </>
-          ) : null}
-        </BreadcrumbList>
-      </Breadcrumb>
-    </div>
-  );
-}
diff --git a/src/app/@header.title.tsx b/src/app/@header.title.tsx
deleted file mode 100644
index 3a9da84..0000000
--- a/src/app/@header.title.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-"use client";
-
-import { PropsWithChildren } from "react";
-
-import { Skeleton } from "~/components/ui/skeleton";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger,
-} from "~/components/ui/tooltip";
-
-export default function HeaderTitle({
-  children,
-  loading,
-}: PropsWithChildren<{ loading?: boolean }>) {
-  if (loading) return <Skeleton className='my-0.5 h-8 w-full' />;
-
-  return (
-    <Tooltip>
-      <TooltipTrigger asChild>
-        <h2 className='line-clamp-1'>{children}</h2>
-      </TooltipTrigger>
-      <TooltipContent>{children}</TooltipContent>
-    </Tooltip>
-  );
-}
diff --git a/src/app/@header.tsx b/src/app/@header.tsx
deleted file mode 100644
index 9ef6071..0000000
--- a/src/app/@header.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import { z } from "zod";
-import { Schema_Breadcrumb } from "~/schema";
-import { cn } from "~/utils";
-
-import HeaderBreadcrumb from "./@header.breadcrumb";
-
-type Props = {
-  name: string;
-  breadcrumb?: z.infer<typeof Schema_Breadcrumb>[];
-};
-export default function Header({ name, breadcrumb }: Props) {
-  const [loading, setLoading] = useState<boolean>(true);
-
-  useEffect(() => {
-    setLoading(false);
-  }, []);
-
-  return (
-    <div
-      className={cn(
-        "w-full",
-        "flex flex-col items-center justify-between gap-3",
-      )}
-    >
-      <div
-        className={cn(
-          "w-full",
-          "flex flex-grow items-center justify-between gap-3",
-        )}
-      >
-        {/* <HeaderTitle loading={loading}>{name}</HeaderTitle> */}
-
-        <HeaderBreadcrumb
-          data={breadcrumb || []}
-          loading={loading}
-        />
-        {/* <HeaderButton loading={loading} /> */}
-      </div>
-    </div>
-  );
-}
diff --git a/src/app/@not-found.tsx b/src/app/@not-found.tsx
deleted file mode 100644
index 9b73830..0000000
--- a/src/app/@not-found.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-"use client";
-
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-import { Button } from "~/components/ui/button";
-
-import useRouter from "~/hooks/usePRouter";
-
-export default function NotFoundComponent() {
-  const router = useRouter();
-  return (
-    <div
-      className={cn(
-        "mx-auto h-full w-full max-w-md",
-        "flex flex-grow flex-col items-center justify-center gap-3",
-      )}
-    >
-      <Icon
-        name='Frown'
-        size={32}
-        className='text-muted-foreground'
-      />
-      <span className='text-center text-muted-foreground'>
-        The file you are looking for does not exist
-      </span>
-
-      <div className='flex w-full flex-col items-center gap-3 pt-8'>
-        <Button
-          className='w-full'
-          onClick={() => router.push("/")}
-        >
-          Back to home
-        </Button>
-        <Button
-          variant={"outline"}
-          className='w-full'
-          onClick={() => router.back()}
-        >
-          Back to previous page
-        </Button>
-      </div>
-    </div>
-  );
-}
diff --git a/src/app/@preview.audio.tsx b/src/app/@preview.audio.tsx
deleted file mode 100644
index ba5d2dc..0000000
--- a/src/app/@preview.audio.tsx
+++ /dev/null
@@ -1,132 +0,0 @@
-"use client";
-
-import dynamic from "next/dynamic";
-import { useEffect, useState } from "react";
-import "react-h5-audio-player/lib/styles.css";
-import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-
-import { CreateDownloadToken } from "./actions";
-
-// import "./r5-style.css";
-
-const Plyr = dynamic(() => import("plyr-react"), {
-  ssr: false,
-  loading: () => (
-    <div
-      className={cn(
-        "h-auto min-h-[50dvh] w-full",
-        "flex flex-grow flex-col items-center justify-center gap-3",
-      )}
-    >
-      <Icon
-        name='LoaderCircle'
-        size={32}
-        className='animate-spin text-foreground'
-      />
-      <p>Loading player...</p>
-    </div>
-  ),
-});
-
-type Props = {
-  file: z.infer<typeof Schema_File>;
-};
-export default function PreviewAudio({ file }: Props) {
-  const [audioSrc, setAudioSrc] = useState<string>("");
-  const [loading, setLoading] = useState<boolean>(true);
-  const [error, setError] = useState<string>("");
-
-  useEffect(() => {
-    (async () => {
-      try {
-        if (!file.encryptedWebContentLink) {
-          setError("No audio to preview");
-          return;
-        }
-        const token = await CreateDownloadToken();
-        setAudioSrc(`/api/stream/${file.encryptedId}?token=${token}`);
-      } catch (error) {
-        const e = error as Error;
-        console.error(e);
-        setError(e.message);
-      } finally {
-        setLoading(false);
-      }
-    })();
-  }, [file]);
-
-  return (
-    <div className='flex h-full min-h-[33dvh] w-full items-center justify-center py-3'>
-      {loading ? (
-        <div
-          className={cn(
-            "h-auto min-h-[50dvh] w-full",
-            "flex flex-grow flex-col items-center justify-center gap-3",
-          )}
-        >
-          <Icon
-            name='LoaderCircle'
-            size={32}
-            className='animate-spin text-foreground'
-          />
-          <p>Loading player...</p>
-        </div>
-      ) : error ? (
-        <div className='flex h-full flex-col items-center justify-center gap-3'>
-          <Icon
-            name='CircleX'
-            size={24}
-            className='text-destructive'
-          />
-          <span className='text-center text-destructive'>{error}</span>
-        </div>
-      ) : (
-        <div className='w-full'>
-          <Plyr
-            source={{
-              type: "audio",
-              sources: [
-                {
-                  src: audioSrc,
-                  type: file.mimeType,
-                  size: file.size,
-                },
-              ],
-              title: file.name,
-            }}
-            options={{
-              controls: [
-                "play-large",
-                "play",
-                "progress",
-                "current-time",
-                "duration",
-                "mute",
-                "volume",
-                "settings",
-                "fullscreen",
-              ],
-              volume: 0.5,
-              muted: false,
-              loop: {
-                active: false,
-              },
-              speed: {
-                selected: 1,
-                options: [0.5, 1, 1.5, 2],
-              },
-              keyboard: {
-                focused: true,
-                global: false,
-              },
-            }}
-          />
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/src/app/@preview.image.tsx b/src/app/@preview.image.tsx
deleted file mode 100644
index 0d60d27..0000000
--- a/src/app/@preview.image.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
-
-import config from "~/config/gIndex.config";
-
-import { CreateDownloadToken } from "./actions";
-
-type Props = {
-  file: z.infer<typeof Schema_File>;
-};
-export default function PreviewImage({ file }: Props) {
-  const [imgSrc, setImgSrc] = useState<string>(
-    `/api/thumb/${file.encryptedId}?size=4`,
-  );
-  const [imgLoaded, setImgLoaded] = useState<boolean>(false);
-  const [loading, setLoading] = useState<boolean>(true);
-  const [error, setError] = useState<string>("");
-
-  useEffect(() => {
-    (async () => {
-      try {
-        if (!file.encryptedWebContentLink) {
-          setError("No image to preview");
-          return;
-        }
-        const token = await CreateDownloadToken();
-
-        const streamURL = new URL(
-          `/api/thumb/${file.encryptedId}?size=1000`,
-          config.basePath,
-        );
-        streamURL.searchParams.set("token", token);
-        fetch(streamURL, {
-          headers: {
-            Range: `bytes=0-${(file.size || 1) - 1}`,
-          },
-        })
-          .then((res) => {
-            if (!res.ok) {
-              throw new Error("Could not load image");
-            }
-            return res.blob();
-          })
-          .then((blob) => {
-            const urlobject = URL.createObjectURL(blob);
-            setImgSrc(urlobject);
-            const timeout = setTimeout(() => {
-              setImgLoaded(true);
-              clearTimeout(timeout);
-            }, 150); // Add a delay to show the image
-          });
-      } catch (error) {
-        const e = error as Error;
-        console.error(e);
-        setError(e.message);
-      } finally {
-        setLoading(false);
-      }
-    })();
-  }, [file]);
-
-  return (
-    <div className='flex min-h-[33dvh] w-full items-center justify-center py-3'>
-      {loading ? (
-        <div
-          className={cn(
-            "h-auto min-h-[50dvh] w-full",
-            "flex flex-grow flex-col items-center justify-center gap-3",
-          )}
-        >
-          <Icon
-            name='LoaderCircle'
-            size={32}
-            className='animate-spin text-foreground'
-          />
-          <p>Loading image...</p>
-        </div>
-      ) : error ? (
-        <div className='flex h-full flex-col items-center justify-center gap-3'>
-          <Icon
-            name='CircleX'
-            size={24}
-            className='text-destructive'
-          />
-          <span className='text-center text-destructive'>{error}</span>
-        </div>
-      ) : (
-        <div className='h-fit w-full space-y-3 overflow-hidden rounded-[var(--radius)]'>
-          <img
-            src={imgSrc}
-            alt={file.name}
-            className={cn(
-              "h-full max-h-[70dvh] w-full bg-muted object-contain object-center transition",
-              imgLoaded ? "blur-none" : "animate-pulse blur",
-            )}
-            onError={(e) => {
-              console.error(e);
-              setError(
-                "Could not preview this image, try downloading the file",
-              );
-            }}
-          />
-
-          <Alert className='bg-yellow-50 text-yellow-600 dark:bg-yellow-950 dark:text-yellow-500'>
-            <div className='flex items-start gap-3'>
-              <Icon
-                name='TriangleAlert'
-                className='size-5'
-              />
-              <div className='flex flex-col'>
-                <AlertTitle>Preview Only</AlertTitle>
-                <AlertDescription>
-                  This image is a preview and may not be the full resolution.
-                  Please download the file for the full resolution.
-                </AlertDescription>
-              </div>
-            </div>
-          </Alert>
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/src/app/@preview.layout.tsx b/src/app/@preview.layout.tsx
deleted file mode 100644
index 01119cf..0000000
--- a/src/app/@preview.layout.tsx
+++ /dev/null
@@ -1,107 +0,0 @@
-"use client";
-
-import { useState } from "react";
-import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-import { Card, CardContent } from "~/components/ui/card";
-
-import { getFileType } from "~/utils/previewHelper";
-
-import config from "~/config/gIndex.config";
-
-import PreviewAction from "./@preview.action";
-import PreviewAudio from "./@preview.audio";
-import PreviewDoc from "./@preview.doc";
-import PreviewImage from "./@preview.image";
-import PreviewManga from "./@preview.manga";
-import PreviewRich from "./@preview.rich";
-import PreviewUnknown from "./@preview.unknown";
-import PreviewVideo from "./@preview.video";
-import RichHeader from "./@rich-header";
-
-type Props = {
-  data: z.infer<typeof Schema_File>;
-  fileType: "unknown" | ReturnType<typeof getFileType>;
-};
-export default function FilePreviewLayout({ data, fileType }: Props) {
-  const [view, setView] = useState<"markdown" | "raw">("markdown");
-
-  return (
-    <div className='flex flex-col gap-3'>
-      <Card>
-        <RichHeader
-          title={data.name}
-          view={view}
-          onViewChange={setView}
-          fileType={fileType}
-        />
-        <CardContent className='p-1.5 pt-0 tablet:p-3 tablet:pt-0'>
-          {config.apiConfig.streamMaxSize &&
-          Number(data.size || 0) > config.apiConfig.streamMaxSize ? (
-            <div
-              className={cn(
-                "h-auto min-h-[33dvh] w-full",
-                "flex flex-grow flex-col items-center justify-center gap-3",
-              )}
-            >
-              <Icon
-                name='Frown'
-                size={32}
-                className='text-muted-foreground'
-              />
-              <h4 className='text-muted-foreground'>Preview not available</h4>
-              <p className='text-center text-muted-foreground tablet:text-sm'>
-                Looks like this file size exceed the preview size limit
-              </p>
-            </div>
-          ) : (
-            /**
-             * TODO: Might need a better way to handle large files preview
-             * like manga, pdf, etc
-             *
-             * For now it's downloading the whole file and then previewing it
-             * which is not a good implementation
-             */
-            <div className='px-3'>
-              {fileType === "image" ? (
-                <PreviewImage file={data} />
-              ) : fileType === "audio" ? (
-                <PreviewAudio file={data} />
-              ) : fileType === "video" ? (
-                <PreviewVideo file={data} />
-              ) : fileType === "code" ? (
-                <PreviewRich
-                  file={data}
-                  code
-                  view={view}
-                />
-              ) : fileType === "text" ? (
-                <PreviewRich
-                  file={data}
-                  view={view}
-                />
-              ) : fileType === "markdown" ? (
-                <PreviewRich
-                  file={data}
-                  view={view}
-                />
-              ) : fileType === "document" ? (
-                <PreviewDoc file={data} />
-              ) : fileType === "pdf" ? (
-                <PreviewDoc file={data} />
-              ) : fileType === "manga" ? (
-                <PreviewManga file={data} />
-              ) : (
-                <PreviewUnknown />
-              )}
-            </div>
-          )}
-        </CardContent>
-      </Card>
-      <PreviewAction file={data} />
-    </div>
-  );
-}
diff --git a/src/app/@preview.rich.tsx b/src/app/@preview.rich.tsx
deleted file mode 100644
index 1d56239..0000000
--- a/src/app/@preview.rich.tsx
+++ /dev/null
@@ -1,128 +0,0 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-import { Button } from "~/components/ui/button";
-
-import Markdown from "./@markdown";
-import { GetContent } from "./actions";
-
-type Props = {
-  file: z.infer<typeof Schema_File>;
-  view: "markdown" | "raw";
-  code?: boolean;
-};
-export default function PreviewRich({ file, code, view }: Props) {
-  const [fetchedContent, setFetchedContent] = useState<string>("");
-  const [content, setContent] = useState<string>("");
-  const [loading, setLoading] = useState<boolean>(true);
-  const [error, setError] = useState<string>("");
-
-  const [expand, setExpand] = useState<boolean>(false);
-
-  useEffect(() => {
-    (async () => {
-      try {
-        const text = await GetContent(file.encryptedId);
-        if (!text) {
-          setError("Looks like there is no content to preview");
-          return;
-        }
-        // setFetchedContent(text);
-        // if (code) {
-        //   setContent(`\`\`\`${file.fileExtension}\n${text}\`\`\``);
-        // } else {
-        setContent(text.trim());
-        // }
-      } catch (error) {
-        const e = error as Error;
-        console.error(e);
-        setError(e.message);
-      } finally {
-        setLoading(false);
-      }
-    })();
-  }, [file, code]);
-
-  return (
-    <div className='flex h-fit min-h-[33dvh] w-full items-center justify-center py-3'>
-      {loading ? (
-        <div
-          className={cn(
-            "h-auto min-h-[50dvh] w-full",
-            "flex flex-grow flex-col items-center justify-center gap-3",
-          )}
-        >
-          <Icon
-            name='LoaderCircle'
-            size={32}
-            className='animate-spin text-foreground'
-          />
-          <p>Loading content...</p>
-        </div>
-      ) : error ? (
-        <div className='flex h-full flex-col items-center justify-center gap-3'>
-          <Icon
-            name='CircleX'
-            size={24}
-            className='text-destructive'
-          />
-          <span className='text-center text-destructive'>{error}</span>
-        </div>
-      ) : (
-        <div
-          className={cn(
-            "relative w-full overflow-hidden",
-            expand ? "h-full" : "max-h-[50dvh]",
-          )}
-        >
-          <div
-            className={cn(
-              "w-full overflow-hidden",
-              expand
-                ? "[mask-image:linear-gradient(180deg,white_65%,white] h-full"
-                : "h-[50dvh] max-h-[50dvh] [mask-image:linear-gradient(180deg,white_65%,rgba(255,255,255,0))]",
-            )}
-          >
-            <Markdown
-              content={
-                code && view === "markdown"
-                  ? `\`\`\`${file.fileExtension}\n${content}`
-                  : content
-              }
-              view={view}
-            />
-          </div>
-          <div
-            className={cn(
-              "bottom-0 z-10 flex w-full items-center justify-center py-3 transition",
-              expand ? "relative" : "absolute",
-              // expand
-              //   ? "pointer-events-none opacity-0"
-              //   : "pointer-events-auto opacity-100",
-            )}
-          >
-            <Button
-              size={"sm"}
-              variant={"secondary"}
-              className='gap-1.5'
-              onClick={() => {
-                setExpand((prev) => !prev);
-              }}
-            >
-              <Icon
-                name={expand ? "ChevronUp" : "ChevronDown"}
-                size={16}
-              />
-              {expand ? "Collapse" : "Expand"}
-            </Button>
-          </div>
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/src/app/@preview.unknown.tsx b/src/app/@preview.unknown.tsx
deleted file mode 100644
index b044810..0000000
--- a/src/app/@preview.unknown.tsx
+++ /dev/null
@@ -1,52 +0,0 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-
-export default function PreviewUnknown() {
-  const [loading, setLoading] = useState<boolean>(true);
-
-  useEffect(() => {
-    setLoading(false);
-  }, []);
-
-  return (
-    <div className='flex min-h-[33dvh] w-full items-center justify-center py-3'>
-      {loading ? (
-        <div
-          className={cn(
-            "h-auto min-h-[33dvh] w-full",
-            "flex flex-grow flex-col items-center justify-center gap-3",
-          )}
-        >
-          <Icon
-            name='LoaderCircle'
-            size={32}
-            className='animate-spin text-foreground'
-          />
-          <p>Loading content...</p>
-        </div>
-      ) : (
-        <div
-          className={cn(
-            "h-auto min-h-[33dvh] w-full",
-            "flex flex-grow flex-col items-center justify-center gap-3",
-          )}
-        >
-          <Icon
-            name='Frown'
-            size={32}
-            className='text-muted-foreground'
-          />
-          <h4 className='text-muted-foreground'>Preview not available</h4>
-          <p className='text-center text-muted-foreground tablet:text-sm'>
-            This file type is not supported for preview, try downloading the
-            file instead.
-          </p>
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/src/app/@preview.video.tsx b/src/app/@preview.video.tsx
deleted file mode 100644
index 1a4e634..0000000
--- a/src/app/@preview.video.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-"use client";
-
-import dynamic from "next/dynamic";
-import { useEffect, useState } from "react";
-import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-
-import { CreateDownloadToken } from "./actions";
-
-const Plyr = dynamic(() => import("plyr-react"), {
-  ssr: false,
-  loading: () => (
-    <div
-      className={cn(
-        "h-auto min-h-[50dvh] w-full",
-        "flex flex-grow flex-col items-center justify-center gap-3",
-      )}
-    >
-      <Icon
-        name='LoaderCircle'
-        size={32}
-        className='animate-spin text-foreground'
-      />
-      <p>Loading player...</p>
-    </div>
-  ),
-});
-
-type Props = {
-  file: z.infer<typeof Schema_File>;
-};
-export default function PreviewVideo({ file }: Props) {
-  const [videoSrc, setVideoSrc] = useState<string>("");
-  const [loading, setLoading] = useState<boolean>(true);
-  const [error, setError] = useState<string>("");
-
-  useEffect(() => {
-    (async () => {
-      try {
-        if (!file.encryptedWebContentLink) {
-          setError("No video to preview");
-          return;
-        }
-        const token = await CreateDownloadToken();
-        setVideoSrc(`/api/stream/${file.encryptedId}?token=${token}`);
-      } catch (error) {
-        const e = error as Error;
-        console.error(e);
-        setError(e.message);
-      } finally {
-        setLoading(false);
-      }
-    })();
-  }, [file]);
-
-  return (
-    <div className='flex h-full min-h-[33dvh] w-full items-center justify-center py-3'>
-      {loading ? (
-        <div
-          className={cn(
-            "h-auto min-h-[50dvh] w-full",
-            "flex flex-grow flex-col items-center justify-center gap-3",
-          )}
-        >
-          <Icon
-            name='LoaderCircle'
-            size={32}
-            className='animate-spin text-foreground'
-          />
-          <p>Loading video...</p>
-        </div>
-      ) : error ? (
-        <div className='flex h-full flex-col items-center justify-center gap-3'>
-          <Icon
-            name='CircleX'
-            size={24}
-            className='text-destructive'
-          />
-          <span className='text-center text-destructive'>{error}</span>
-        </div>
-      ) : (
-        <div className='h-full w-full'>
-          <Plyr
-            source={{
-              type: "video",
-              sources: [
-                {
-                  src: videoSrc,
-                  type: file.mimeType,
-                  size: file.size,
-                },
-              ],
-              poster: `/api/thumb/${file.encryptedId}?size=1000`,
-            }}
-            // crossOrigin='anonymous'
-            options={{
-              toggleInvert: true,
-              settings: ["quality", "speed"],
-              ratio: "16:9",
-              controls: [
-                "play-large",
-                "play",
-                "progress",
-                "current-time",
-                "duration",
-                "mute",
-                "volume",
-                "settings",
-                "pip",
-                "download",
-                "fullscreen",
-              ],
-              volume: 0.5,
-              muted: false,
-              loop: { active: false },
-              speed: { selected: 1, options: [0.5, 1, 1.5, 2] },
-              keyboard: {
-                focused: true,
-                global: true,
-              },
-            }}
-          />
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/src/app/@readme.tsx b/src/app/@readme.tsx
deleted file mode 100644
index 8990720..0000000
--- a/src/app/@readme.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-"use client";
-
-import { useState } from "react";
-
-import { Card, CardContent } from "~/components/ui/card";
-
-import Markdown from "./@markdown";
-import RichHeader from "./@rich-header";
-
-type Props = {
-  content: string;
-  title: string;
-};
-export default function Readme({ content, title }: Props) {
-  const [view, setView] = useState<"markdown" | "raw">("markdown");
-
-  return (
-    <div
-      slot='readme'
-      className='w-full'
-    >
-      <Card>
-        <RichHeader
-          title={title}
-          view={view}
-          onViewChange={setView}
-          fileType={"markdown"}
-        />
-        <CardContent className='p-1.5 pt-0 tablet:p-3 tablet:pt-0'>
-          <Markdown
-            content={content}
-            view={view}
-          />
-        </CardContent>
-      </Card>
-    </div>
-  );
-}
diff --git a/src/app/@rich-header.tsx b/src/app/@rich-header.tsx
deleted file mode 100644
index 3c984f5..0000000
--- a/src/app/@rich-header.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-"use client";
-
-import { Button } from "~/components/ui/button";
-import { CardHeader } from "~/components/ui/card";
-import { Separator } from "~/components/ui/separator";
-
-import { getFileType } from "~/utils/previewHelper";
-
-type Props = {
-  title: string;
-  view: "markdown" | "raw";
-  onViewChange: (value: "markdown" | "raw") => void;
-  fileType: ReturnType<typeof getFileType> | "unknown";
-};
-export default function RichHeader({
-  title,
-  view,
-  onViewChange,
-  fileType,
-}: Props) {
-  return (
-    <CardHeader className='pb-0'>
-      <div className='flex flex-col gap-3 overflow-hidden mobile:flex-row mobile:items-center mobile:justify-between'>
-        {/* <CardTitle> */}
-        <h3 className='line-clamp-1 flex-grow whitespace-pre-wrap break-all'>
-          {title}
-        </h3>
-        {/* </CardTitle> */}
-        {["markdown", "code", "text"].includes(fileType) && (
-          <div className='flex w-full items-center mobile:w-fit'>
-            <Button
-              size={"sm"}
-              variant={view === "markdown" ? "default" : "secondary"}
-              onClick={() => onViewChange("markdown")}
-              className='w-full rounded-r-none mobile:w-fit'
-            >
-              Markdown
-            </Button>
-            <Button
-              size={"sm"}
-              variant={view === "raw" ? "default" : "secondary"}
-              onClick={() => onViewChange("raw")}
-              className='w-full rounded-l-none mobile:w-fit'
-            >
-              Raw
-            </Button>
-          </div>
-        )}
-      </div>
-      <Separator />
-    </CardHeader>
-  );
-}
diff --git a/src/app/[...rest]/deploy/@form.api-config.tsx b/src/app/[...rest]/deploy/@form.api-config.tsx
deleted file mode 100644
index 48f9ba3..0000000
--- a/src/app/[...rest]/deploy/@form.api-config.tsx
+++ /dev/null
@@ -1,533 +0,0 @@
-"use client";
-
-import toast from "react-hot-toast";
-import { z } from "zod";
-import {
-  ConfigurationCategory,
-  ConfigurationKeys,
-  ConfigurationValue,
-  Schema_App_Configuration,
-} from "~/schema";
-
-import { Button } from "~/components/ui/button";
-import { Input } from "~/components/ui/input";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "~/components/ui/select";
-import { Separator } from "~/components/ui/separator";
-
-import { decryptData } from "~/utils/encryptionHelper/hash";
-import { parseConfigFile } from "~/utils/parseConfigFile";
-
-import ConfigInput from "./@form.input-config";
-
-type Props = {
-  state: {
-    get: z.input<typeof Schema_App_Configuration>;
-    set: <
-      T extends ConfigurationCategory = ConfigurationCategory,
-      K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
-    >(
-      category: T,
-      key: K,
-      value: ConfigurationValue<T, K>,
-    ) => void;
-  };
-  error: {
-    get: Partial<Record<ConfigurationKeys<"api">, string>>;
-    set: <T extends ConfigurationKeys<"api">>(key: T, value: string) => void;
-  };
-  onReset: (category: ConfigurationCategory) => void;
-};
-export default function ApiConfig({
-  state: { get, set },
-  error,
-  onReset,
-}: Props) {
-  return (
-    <form
-      className='flex w-full flex-col gap-3 py-3'
-      onReset={(e) => {
-        e.preventDefault();
-        onReset("api");
-      }}
-    >
-      <div
-        slot='header'
-        className='flex flex-col gap-3 tablet:flex-row tablet:items-center tablet:justify-between'
-      >
-        <h4>API</h4>
-        <div className='flex w-full items-center gap-3 tablet:w-fit'>
-          <Button
-            variant={"outline"}
-            size={"sm"}
-            onClick={(e) => {
-              e.preventDefault();
-
-              try {
-                const fileInput = document.createElement("input");
-                fileInput.type = "file";
-                fileInput.accept = ".config.ts";
-                fileInput.onchange = async (fileEvent) => {
-                  const file = (fileEvent.target as HTMLInputElement)
-                    .files?.[0];
-                  if (!file) return toast.error("No file selected");
-                  const fileName = file.name;
-                  if (fileName.toLowerCase() !== "gindex.config.ts")
-                    return toast.error("Please select a config file");
-
-                  const reader = new FileReader();
-                  reader.onload = async (read) => {
-                    const result = read.target?.result as string;
-                    if (!result) return toast.error("Failed to read file");
-
-                    const config = parseConfigFile(result);
-                    if ("success" in config) return toast.error(config.message);
-
-                    if (get.environment.ENCRYPTION_KEY) {
-                      try {
-                        const root = config.api.rootFolder;
-                        const shared = config.api.sharedDrive || null;
-                        if (root && typeof root === "string") {
-                          const decrypted = await decryptData(
-                            root,
-                            get.environment.ENCRYPTION_KEY,
-                          );
-                          if (decrypted) {
-                            set("api", "rootFolder", decrypted);
-                          }
-                        }
-                        if (shared && typeof shared === "string") {
-                          const decrypted = await decryptData(
-                            shared,
-                            get.environment.ENCRYPTION_KEY,
-                          );
-                          if (decrypted) {
-                            set("api", "sharedDrive", decrypted);
-                          }
-                        }
-                      } catch (error) {
-                        const e = error as Error;
-                        console.error(e);
-                        toast.error(
-                          "Skipping Root Folder / Shared Drive ID, can't decrypt with current Encryption Key",
-                        );
-                      }
-                    } else {
-                      toast.error(
-                        "Can't decrypt Root Folder / Shared Drive ID without Encryption Key",
-                      );
-                    }
-                    set("api", "isTeamDrive", config.api.isTeamDrive || false);
-                    set("api", "itemsPerPage", config.api.itemsPerPage || 50);
-                    set("api", "searchResult", config.api.searchResult || 5);
-                    set(
-                      "api",
-                      "proxyThumbnail",
-                      config.api.proxyThumbnail || true,
-                    );
-                    set(
-                      "api",
-                      "allowDownloadProtectedFile",
-                      config.api.allowDownloadProtectedFile || false,
-                    );
-                    set(
-                      "api",
-                      "temporaryTokenDuration",
-                      config.api.temporaryTokenDuration || 6,
-                    );
-                    set(
-                      "api",
-                      "maxFileSize",
-                      config.api.maxFileSize || 4 * 1024 * 1024,
-                    );
-                    set(
-                      "api",
-                      "streamMaxSize",
-                      config.api.streamMaxSize || 100 * 1024 * 1024,
-                    );
-
-                    fileInput.value = "";
-                    toast.success("Config loaded from file");
-                  };
-                  reader.readAsText(file);
-                };
-                fileInput.click();
-              } catch (error) {
-                const e = error as Error;
-                console.error(e);
-                toast.error(e.message);
-              }
-            }}
-          >
-            Load from file
-          </Button>
-          <Button
-            type='reset'
-            variant={"destructive"}
-            size={"sm"}
-          >
-            Reset
-          </Button>
-        </div>
-      </div>
-
-      <Separator />
-
-      <div
-        slot='inputs'
-        className='flex flex-col gap-3'
-      >
-        <ConfigInput<ConfigurationKeys<"api">>
-          key='rootFolder'
-          title='Root Folder ID'
-          description={`Starting point of the drive, will be used as the root folder to display files and folders.
-This ID will be encrypted in the config file.`}
-          error={error.get.rootFolder}
-          required
-        >
-          <Input
-            id='rootFolder'
-            name='rootFolder'
-            value={get.api.rootFolder}
-            onChange={(e) => {
-              if (error.get.rootFolder) {
-                error.set("rootFolder", "");
-              }
-              set("api", "rootFolder", e.target.value);
-            }}
-            onBlur={async () => {
-              try {
-                const value = get.api.rootFolder;
-                error.set("rootFolder", "");
-
-                if (!value) throw new Error("Root Folder ID is required");
-              } catch (err) {
-                const e = err as Error;
-                error.set("rootFolder", e.message);
-              }
-            }}
-          />
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"api">>
-          key='isTeamDrive'
-          title='Use Team Drive'
-          description={`If you are using Shared Drive, you NEED to enable this option.`}
-          error={error.get.isTeamDrive}
-          required
-        >
-          <Select
-            value={get.api.isTeamDrive.toString()}
-            onValueChange={(value) => {
-              set("api", "isTeamDrive", value === "true");
-            }}
-          >
-            <SelectTrigger>
-              <SelectValue placeholder={"Select an option"} />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value={"true"}>Enable</SelectItem>
-              <SelectItem value={"false"}>Disable</SelectItem>
-            </SelectContent>
-          </Select>
-        </ConfigInput>
-
-        {get.api.isTeamDrive && (
-          <ConfigInput<ConfigurationKeys<"api">>
-            key='sharedDrive'
-            title='Shared Drive ID'
-            description={`The Drive ID of the Shared Drive.
-This ID will be encrypted in the config file`}
-            error={error.get.sharedDrive}
-            required={get.api.isTeamDrive}
-          >
-            <Input
-              id='sharedDrive'
-              name='sharedDrive'
-              value={get.api.sharedDrive}
-              onChange={(e) => {
-                if (error.get.sharedDrive) {
-                  error.set("sharedDrive", "");
-                }
-                set("api", "sharedDrive", e.target.value);
-              }}
-              onBlur={async () => {
-                try {
-                  const value = get.api.sharedDrive;
-                  const isTeamDrive = get.api.isTeamDrive;
-                  error.set("sharedDrive", "");
-
-                  if (!isTeamDrive) return;
-                  if (!value)
-                    throw new Error(
-                      "Shared Drive ID is required if using Team Drive",
-                    );
-                } catch (err) {
-                  const e = err as Error;
-                  error.set("sharedDrive", e.message);
-                }
-              }}
-            />
-          </ConfigInput>
-        )}
-
-        <div className='grid grid-cols-1 gap-3 tablet:grid-cols-2'>
-          <ConfigInput<ConfigurationKeys<"api">>
-            key='itemsPerPage'
-            title='Items Per Page'
-            description={`Set how many items to display per page in the file list.          
-It's recommended to set this to a reasonable number, since it will affect the load time of the page.
-
-Default is 50.`}
-            error={error.get.itemsPerPage}
-            required
-          >
-            <Input
-              id='itemsPerPage'
-              name='itemsPerPage'
-              type='number'
-              value={get.api.itemsPerPage}
-              min={1}
-              onChange={(e) => {
-                if (error.get.itemsPerPage) {
-                  error.set("itemsPerPage", "");
-                }
-                set("api", "itemsPerPage", parseInt(e.target.value));
-              }}
-              onBlur={async () => {
-                try {
-                  const value = get.api.itemsPerPage;
-                  error.set("itemsPerPage", "");
-
-                  if (value <= 0)
-                    throw new Error("Items Per Page must be more than 0");
-                } catch (err) {
-                  const e = err as Error;
-                  error.set("itemsPerPage", e.message);
-                }
-              }}
-            />
-          </ConfigInput>
-
-          <ConfigInput<ConfigurationKeys<"api">>
-            key='searchResult'
-            title='Search Result'
-            description={`Set how many items to display in the search result.
-It's recommended to set this to a small number, since it will affect the load time of the page.
-
-Default is 5.`}
-            error={error.get.searchResult}
-            required
-          >
-            <Input
-              id='searchResult'
-              name='searchResult'
-              type='number'
-              value={get.api.searchResult}
-              min={1}
-              onChange={(e) => {
-                if (error.get.searchResult) {
-                  error.set("searchResult", "");
-                }
-                set("api", "searchResult", parseInt(e.target.value));
-              }}
-              onBlur={async () => {
-                try {
-                  const value = get.api.searchResult;
-                  error.set("searchResult", "");
-
-                  if (value <= 0)
-                    throw new Error("Search Result must be more than 0");
-                } catch (err) {
-                  const e = err as Error;
-                  error.set("searchResult", e.message);
-                }
-              }}
-            />
-          </ConfigInput>
-        </div>
-
-        <ConfigInput<ConfigurationKeys<"api">>
-          key='proxyThumbnail'
-          title='Proxy Thumbnail'
-          description={`Proxy the thumbnail image via API route.
-
-If your files thumbnail are not accessible, you can set this to true.
-This will fetch the thumbnail image via API route, but it will increase the load on your server.`}
-          error={error.get.proxyThumbnail}
-          required
-        >
-          <Select
-            value={get.api.proxyThumbnail.toString()}
-            onValueChange={(value) => {
-              set("api", "proxyThumbnail", value === "true");
-            }}
-          >
-            <SelectTrigger>
-              <SelectValue placeholder={"Select an option"} />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value={"true"}>Enable</SelectItem>
-              <SelectItem value={"false"}>Disable</SelectItem>
-            </SelectContent>
-          </Select>
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"api">>
-          key='allowDownloadProtectedFile'
-          title='Allow Download Protected File'
-          description={`Allow users to download password protected files.
-
-If set to true, users will be able to download the file without entering password as long as they have the link
-If set to false, the download link will have a temporary token attached to it, the token will expire after certain duration (default is 6 hours)`}
-          error={error.get.allowDownloadProtectedFile}
-          required
-        >
-          <Select
-            value={get.api.allowDownloadProtectedFile.toString()}
-            onValueChange={(value) => {
-              set("api", "allowDownloadProtectedFile", value === "true");
-            }}
-          >
-            <SelectTrigger>
-              <SelectValue placeholder={"Select an option"} />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value={"true"}>Enable</SelectItem>
-              <SelectItem value={"false"}>Disable</SelectItem>
-            </SelectContent>
-          </Select>
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"api">>
-          key='temporaryTokenDuration'
-          title='Temporary Token Duration (in hours)'
-          description={`Duration of the temporary token used for protected files download link.`}
-          error={error.get.temporaryTokenDuration}
-          required
-        >
-          <Input
-            id='temporaryTokenDuration'
-            name='temporaryTokenDuration'
-            type='number'
-            value={get.api.temporaryTokenDuration}
-            min={1}
-            max={24 * 7}
-            onChange={(e) => {
-              if (error.get.temporaryTokenDuration) {
-                error.set("temporaryTokenDuration", "");
-              }
-              set("api", "temporaryTokenDuration", parseInt(e.target.value));
-            }}
-            onBlur={async () => {
-              try {
-                const value = get.api.temporaryTokenDuration;
-                error.set("temporaryTokenDuration", "");
-
-                if (value <= 0)
-                  throw new Error(
-                    "Temporary Token Duration must be more than 0",
-                  );
-              } catch (err) {
-                const e = err as Error;
-                error.set("temporaryTokenDuration", e.message);
-              }
-            }}
-          />
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"api">>
-          key='maxFileSize'
-          title='Max Direct Download Size (in MB)'
-          description={`Max file size that can be downloaded directly from the server, instead of download link from Google Drive.
-Please refer to your deploy platform for the maximum response size limit.
-If you are using Vercel, the maximum response size is around 4 - 4.5MB.
-
-Set to 0 to disable the limit.`}
-          error={error.get.maxFileSize}
-          required
-        >
-          <Input
-            id='maxFileSize'
-            name='maxFileSize'
-            type='number'
-            value={get.api.maxFileSize / 1024 / 1024}
-            min={0}
-            onChange={(e) => {
-              if (error.get.maxFileSize) {
-                error.set("maxFileSize", "");
-              }
-              set("api", "maxFileSize", parseInt(e.target.value) * 1024 * 1024);
-            }}
-            onBlur={async () => {
-              try {
-                const value = get.api.maxFileSize;
-                error.set("maxFileSize", "");
-
-                if (value < 0)
-                  throw new Error(
-                    "Max file size must be more than or equal to 0",
-                  );
-              } catch (err) {
-                const e = err as Error;
-                error.set("maxFileSize", e.message);
-              }
-            }}
-          />
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"api">>
-          key='streamMaxSize'
-          title='Max Stream Size (in MB)'
-          description={`For previewing large files, the file will be streamed in chunks.
-There are response limit in some deploy platform like Vercel, also Google Drive will return 403 error if we tried using fetch to download large file on client.
-
-Make sure it's within reasonable size, since it will count towards your server bandwidth usage.
-This will also affect the maximum file size that can be previewed. Especially for media files like video, audio, and images.
-(Manga preview will automatically limited to the first 5MB)
-
-Default is 100MB, set to 0 to disable the limit.`}
-          error={error.get.streamMaxSize}
-          required
-        >
-          <Input
-            id='streamMaxSize'
-            name='streamMaxSize'
-            type='number'
-            value={get.api.streamMaxSize / 1024 / 1024}
-            min={0}
-            onChange={(e) => {
-              if (error.get.maxFileSize) {
-                error.set("streamMaxSize", "");
-              }
-              set(
-                "api",
-                "streamMaxSize",
-                parseInt(e.target.value) * 1024 * 1024,
-              );
-            }}
-            onBlur={async () => {
-              try {
-                const value = get.api.streamMaxSize;
-                error.set("streamMaxSize", "");
-
-                if (value < 0)
-                  throw new Error(
-                    "Max stream size must be more than or equal to 0",
-                  );
-              } catch (err) {
-                const e = err as Error;
-                error.set("streamMaxSize", e.message);
-              }
-            }}
-          />
-        </ConfigInput>
-      </div>
-    </form>
-  );
-}
diff --git a/src/app/[...rest]/deploy/@form.env-config.tsx b/src/app/[...rest]/deploy/@form.env-config.tsx
deleted file mode 100644
index c7244a0..0000000
--- a/src/app/[...rest]/deploy/@form.env-config.tsx
+++ /dev/null
@@ -1,359 +0,0 @@
-"use client";
-
-import { useState } from "react";
-import toast from "react-hot-toast";
-import { z } from "zod";
-import {
-  ConfigState,
-  ConfigurationCategory,
-  ConfigurationKeys,
-  ConfigurationValue,
-  Schema_App_Configuration,
-  Schema_ServiceAccount,
-} from "~/schema";
-
-import { GenerateAESKey, VerifyAESKey } from "~/app/actions";
-import { Button } from "~/components/ui/button";
-import { Input } from "~/components/ui/input";
-import { Separator } from "~/components/ui/separator";
-
-import ConfigInput from "./@form.input-config";
-
-type Props = {
-  state: {
-    get: z.input<typeof Schema_App_Configuration>;
-    set: <
-      T extends ConfigurationCategory = ConfigurationCategory,
-      K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
-    >(
-      category: T,
-      key: K,
-      value: ConfigurationValue<T, K>,
-    ) => void;
-  };
-  error: {
-    get: Partial<Record<ConfigurationKeys<"environment">, string>>;
-    set: <T extends ConfigurationKeys<"environment">>(
-      key: T,
-      value: string,
-    ) => void;
-  };
-  onReset: (category: ConfigurationCategory) => void;
-};
-export default function EnvironmentConfig({
-  state: { get, set },
-  error,
-  onReset,
-}: Props) {
-  const [encryptionState, setEncryptionState] = useState<ConfigState>("idle");
-  const [gdServiceState, setGdServiceState] = useState<ConfigState>("idle");
-  const [revealPassword, setRevealPassword] = useState<boolean>(false);
-
-  return (
-    <form
-      className='flex w-full flex-col gap-3 py-3'
-      onReset={(e) => {
-        e.preventDefault();
-        onReset("environment");
-      }}
-    >
-      <div
-        slot='header'
-        className='flex flex-col gap-3 tablet:flex-row tablet:items-center tablet:justify-between'
-      >
-        <h4>Environment</h4>
-        <div className='flex w-full items-center gap-3 tablet:w-fit'>
-          <Button
-            variant={"outline"}
-            size={"sm"}
-            onClick={(e) => {
-              e.preventDefault();
-
-              try {
-                const fileInput = document.createElement("input");
-                fileInput.type = "file";
-                fileInput.accept =
-                  ".env, .env.local, .env.development, .env.production";
-                fileInput.onchange = async (fileEvent) => {
-                  const file = (fileEvent.target as HTMLInputElement)
-                    .files?.[0];
-                  if (!file) return toast.error("No file selected");
-
-                  const reader = new FileReader();
-                  reader.onload = async (read) => {
-                    const result = read.target?.result as string;
-                    if (!result) return toast.error("Failed to read file");
-                    const lines = result.split("\n");
-                    const env: Record<string, string> = {};
-                    for (const line of lines) {
-                      const [key, value] = line.split("=");
-                      if (!key || !value) continue;
-                      const formattedValue = value
-                        ?.replace(/"/g, "")
-                        .replace(/'/g, "")
-                        .replace(/\\/g, "")
-                        .replace(/\r/g, "")
-                        .trim();
-                      env[key] = formattedValue;
-                    }
-                    set(
-                      "environment",
-                      "GD_SERVICE_B64",
-                      env.GD_SERVICE_B64 || "",
-                    );
-                    set(
-                      "environment",
-                      "ENCRYPTION_KEY",
-                      env.ENCRYPTION_KEY || "",
-                    );
-                    set(
-                      "environment",
-                      "SITE_PASSWORD",
-                      env.SITE_PASSWORD || "",
-                    );
-                    set(
-                      "environment",
-                      "NEXT_PUBLIC_DOMAIN",
-                      env.NEXT_PUBLIC_DOMAIN || "",
-                    );
-                    fileInput.value = "";
-                    toast.success("Environment loaded from file");
-                  };
-                  reader.readAsText(file);
-                };
-                fileInput.click();
-              } catch (error) {
-                const e = error as Error;
-                console.error(e);
-                toast.error(e.message);
-              }
-            }}
-          >
-            Load from file
-          </Button>
-          <Button
-            type='reset'
-            variant={"destructive"}
-            size={"sm"}
-          >
-            Reset
-          </Button>
-        </div>
-      </div>
-
-      <Separator />
-
-      <div
-        slot='inputs'
-        className='flex flex-col gap-3'
-      >
-        <ConfigInput<ConfigurationKeys<"environment">>
-          key='ENCRYPTION_KEY'
-          title='Encryption Key'
-          description='The encryption key for the site, must be a alphanumeric string without spaces'
-          error={error.get.ENCRYPTION_KEY}
-          required
-          action={{
-            label: "Generate",
-            async onClick(e) {
-              e.preventDefault();
-              setEncryptionState("loading");
-              error.set("ENCRYPTION_KEY", "");
-
-              try {
-                const keyStr = await GenerateAESKey();
-                const valid = await VerifyAESKey("This is a test", keyStr);
-                if (!valid)
-                  throw new Error("Invalid key generated, please try again");
-
-                set("environment", "ENCRYPTION_KEY", keyStr);
-              } catch (err) {
-                const e = err as Error;
-                console.error(e);
-                error.set("ENCRYPTION_KEY", e.message);
-                toast.error(e.message);
-              } finally {
-                setEncryptionState("idle");
-              }
-            },
-            state: encryptionState,
-          }}
-        >
-          <Input
-            id='ENCRYPTION_KEY'
-            name='ENCRYPTION_KEY'
-            value={get.environment.ENCRYPTION_KEY}
-            onChange={(e) => {
-              if (error.get.ENCRYPTION_KEY) {
-                error.set("ENCRYPTION_KEY", "");
-              }
-              set("environment", "ENCRYPTION_KEY", e.target.value);
-            }}
-            onBlur={async () => {
-              try {
-                const value = get.environment.ENCRYPTION_KEY;
-                error.set("ENCRYPTION_KEY", "");
-
-                if (!value) throw new Error("Encryption key is required");
-
-                if (value.includes(" "))
-                  throw new Error("Encryption key must not contain spaces");
-
-                const valid = await VerifyAESKey("This is a test", value);
-                if (!valid)
-                  throw new Error(
-                    "The encryption key is invalid, please generate a new one",
-                  );
-              } catch (err) {
-                const e = err as Error;
-                error.set("ENCRYPTION_KEY", e.message);
-              }
-            }}
-          />
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"environment">>
-          key='GD_SERVICE_B64'
-          title='Google Drive Service Account'
-          description={`The base64 encoded Google Drive Service Account JSON file       
-To avoid error when inputting, please use the "Load JSON" button to load the file directly`}
-          error={error.get.GD_SERVICE_B64}
-          required
-          action={{
-            label: "Load JSON",
-            async onClick(e) {
-              e.preventDefault();
-              setGdServiceState("loading");
-
-              try {
-                const fileInput = document.createElement("input");
-                fileInput.type = "file";
-                fileInput.accept = ".json";
-                fileInput.onchange = async (fileEvent) => {
-                  const file = (fileEvent.target as HTMLInputElement)
-                    .files?.[0];
-                  if (!file) return toast.error("No file selected");
-
-                  const reader = new FileReader();
-                  reader.onload = async (readerEvent) => {
-                    const result = readerEvent.target?.result as string;
-                    if (!result) return toast.error("Failed to read file");
-
-                    const objectFile = JSON.parse(result);
-                    const parse = Schema_ServiceAccount.safeParse(objectFile);
-                    if (!parse.success)
-                      return toast.error(
-                        "Invalid Service Account JSON, please select a valid Google Drive Service Account JSON file",
-                      );
-
-                    set("environment", "GD_SERVICE_B64", btoa(result));
-                    error.set("GD_SERVICE_B64", "");
-
-                    toast.success(
-                      "Google Drive Service Account JSON file loaded",
-                    );
-                    fileInput.value = "";
-                  };
-                  reader.readAsText(file);
-                };
-                fileInput.click();
-              } catch (err) {
-                const e = err as Error;
-                console.error(e);
-                error.set("GD_SERVICE_B64", e.message);
-                toast.error(e.message);
-              } finally {
-                setGdServiceState("idle");
-              }
-            },
-            state: gdServiceState,
-          }}
-        >
-          <Input
-            id='GD_SERVICE_B64'
-            name='GD_SERVICE_B64'
-            value={get.environment.GD_SERVICE_B64}
-            readOnly
-            onChange={(e) => {
-              if (error.get.GD_SERVICE_B64) {
-                error.set("GD_SERVICE_B64", "");
-              }
-              set("environment", "GD_SERVICE_B64", e.target.value);
-            }}
-          />
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"environment">>
-          key='NEXT_PUBLIC_DOMAIN'
-          title='Domain'
-          description={`The domain for the site, without the protocol
-(e.g. drive-demo.mbaharip.com or mbaharip.com)`}
-          error={error.get.NEXT_PUBLIC_DOMAIN}
-        >
-          <Input
-            id='NEXT_PUBLIC_DOMAIN'
-            name='NEXT_PUBLIC_DOMAIN'
-            value={get.environment.NEXT_PUBLIC_DOMAIN}
-            onChange={(e) => {
-              if (error.get.NEXT_PUBLIC_DOMAIN) {
-                error.set("NEXT_PUBLIC_DOMAIN", "");
-              }
-              set("environment", "NEXT_PUBLIC_DOMAIN", e.target.value);
-            }}
-            onBlur={async () => {
-              try {
-                error.set("NEXT_PUBLIC_DOMAIN", "");
-              } catch (err) {
-                const e = err as Error;
-                error.set("NEXT_PUBLIC_DOMAIN", e.message);
-              }
-            }}
-          />
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"environment">>
-          key='SITE_PASSWORD'
-          title='Site Password'
-          description='The password to access the site'
-          error={error.get.SITE_PASSWORD}
-          required={get.site.privateIndex}
-          action={{
-            label: revealPassword ? "Hide" : "Reveal",
-            onClick(e) {
-              e.preventDefault();
-              setRevealPassword((prev) => !prev);
-            },
-            state: "idle",
-          }}
-        >
-          <Input
-            id='SITE_PASSWORD'
-            name='SITE_PASSWORD'
-            type={revealPassword ? "text" : "password"}
-            value={get.environment.SITE_PASSWORD}
-            onChange={(e) => {
-              if (error.get.SITE_PASSWORD) {
-                error.set("SITE_PASSWORD", "");
-              }
-              set("environment", "SITE_PASSWORD", e.target.value);
-            }}
-            onBlur={async () => {
-              try {
-                error.set("SITE_PASSWORD", "");
-                if (get.site.privateIndex && !get.environment.SITE_PASSWORD) {
-                  throw new Error(
-                    "Site Password is required when Private Index is enabled",
-                  );
-                }
-              } catch (err) {
-                const e = err as Error;
-                console.error(e);
-                error.set("SITE_PASSWORD", e.message);
-              }
-            }}
-          />
-        </ConfigInput>
-      </div>
-    </form>
-  );
-}
diff --git a/src/app/[...rest]/deploy/@form.input-config.tsx b/src/app/[...rest]/deploy/@form.input-config.tsx
deleted file mode 100644
index 880bc01..0000000
--- a/src/app/[...rest]/deploy/@form.input-config.tsx
+++ /dev/null
@@ -1,120 +0,0 @@
-"use client";
-
-import { PropsWithChildren } from "react";
-import { ConfigState } from "~/schema";
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
-import { Button } from "~/components/ui/button";
-import { Label } from "~/components/ui/label";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger,
-} from "~/components/ui/tooltip";
-
-type Props<T> = {
-  key: T extends string ? T : string;
-  title: string;
-  description?: string;
-  required?: boolean;
-  action?: {
-    label: string;
-    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
-    state: ConfigState;
-  };
-  error?: string;
-};
-export default function ConfigInput<T>(props: PropsWithChildren<Props<T>>) {
-  return (
-    <div
-      id={props.key}
-      slot={`input-${props.key}`}
-      className='flex w-full flex-col gap-1.5'
-    >
-      <div
-        slot='label'
-        className='flex items-center gap-1.5'
-      >
-        <Label
-          htmlFor={props.key}
-          aria-required={props.required}
-        >
-          {props.title}
-        </Label>
-        {!props.required && (
-          <span className='text-sm text-muted-foreground'>(optional)</span>
-        )}
-        {props.description && (
-          <Tooltip>
-            <TooltipTrigger
-              onClick={(e) => e.preventDefault()}
-              className='cursor-default'
-            >
-              <Icon
-                name='Info'
-                size={"1rem"}
-                className='text-muted-foreground'
-              />
-            </TooltipTrigger>
-            <TooltipContent
-              side='right'
-              className='max-w-screen-sm'
-            >
-              <p className='max-w-screen-sm !whitespace-pre-wrap'>
-                {props.description}
-              </p>
-            </TooltipContent>
-          </Tooltip>
-        )}
-      </div>
-
-      <div
-        slot='input'
-        className='grid w-full grid-cols-6 gap-1.5'
-      >
-        <div
-          className={cn(
-            "w-full",
-            props.action ? "col-span-5" : "col-span-full",
-          )}
-        >
-          {props.children}
-        </div>
-        {props.action && (
-          <Button
-            variant={"secondary"}
-            onClick={props.action.onClick}
-            disabled={props.action.state === "loading"}
-          >
-            <div className='relative flex w-full items-center justify-center'>
-              <span className='relative transition-all duration-300 ease-in-out'>
-                {props.action.label}
-              </span>
-              <Icon
-                name='LoaderCircle'
-                className={cn(
-                  "animate-spin transition-all",
-                  props.action.state === "loading"
-                    ? "ml-1.5 size-4 opacity-100"
-                    : "ml-0 size-0 opacity-0",
-                )}
-              />
-            </div>
-          </Button>
-        )}
-      </div>
-
-      <div slot='message'>
-        <span
-          className={cn(
-            "block text-sm text-destructive",
-            props.error ? "opacity-100" : "select-none opacity-0",
-          )}
-        >
-          {props.error}
-        </span>
-      </div>
-    </div>
-  );
-}
diff --git a/src/app/[...rest]/deploy/@form.input-theme.tsx b/src/app/[...rest]/deploy/@form.input-theme.tsx
deleted file mode 100644
index 3553ca3..0000000
--- a/src/app/[...rest]/deploy/@form.input-theme.tsx
+++ /dev/null
@@ -1,181 +0,0 @@
-"use client";
-
-import { PopoverTrigger } from "@radix-ui/react-popover";
-import React, { PropsWithChildren } from "react";
-import { HslColor, HslColorPicker } from "react-colorful";
-import { z } from "zod";
-import { Schema_Theme } from "~/schema";
-
-import Icon from "~/components/Icon";
-import { Input } from "~/components/ui/input";
-import { Label } from "~/components/ui/label";
-import { Popover, PopoverContent } from "~/components/ui/popover";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger,
-} from "~/components/ui/tooltip";
-
-type Props = {
-  key: keyof z.infer<typeof Schema_Theme>;
-  title: string;
-  description?: string;
-  value: HslColor;
-  onChange: (color: HslColor) => void;
-  children?: React.ReactNode;
-};
-export default function ThemeInput(props: PropsWithChildren<Props>) {
-  // const [value, setValue] = useState<HslColor>(props.value);
-  // const [debouncedValue, setDebouncedValue] = useState<HslColor>(props.value);
-
-  // useEffect(() => {
-  //   setValue(props.value);
-
-  //   // eslint-disable-next-line react-hooks/exhaustive-deps
-  // }, [props.value]);
-
-  // useEffect(() => {
-  //   const timeout = setTimeout(() => {
-  //     setDebouncedValue(value);
-  //   }, 250);
-  //   return () => clearTimeout(timeout);
-
-  //   // eslint-disable-next-line react-hooks/exhaustive-deps
-  // }, [value]);
-
-  // useEffect(() => {
-  //   props.onChange(debouncedValue);
-
-  //   // eslint-disable-next-line react-hooks/exhaustive-deps
-  // }, [debouncedValue]);
-
-  return (
-    <div
-      id={props.key}
-      slot={`input-${props.key}`}
-      // className='flex w-full items-center justify-between gap-6'
-      className='grid w-full grid-cols-3 gap-6'
-    >
-      <div
-        slot='label'
-        className='flex items-center gap-3'
-      >
-        <span className='text-base'>{props.title}</span>
-        {props.description && (
-          <Tooltip>
-            <TooltipTrigger
-              onClick={(e) => e.preventDefault()}
-              className='cursor-default'
-            >
-              <Icon
-                name='Info'
-                size='1rem'
-                className='text-muted-foreground'
-              />
-            </TooltipTrigger>
-            <TooltipContent
-              side='right'
-              className='max-w-screen-sm'
-            >
-              <p className='max-w-screen-sm !whitespace-pre-wrap'>
-                {props.description}
-              </p>
-            </TooltipContent>
-          </Tooltip>
-        )}
-      </div>
-
-      <div
-        slot='input'
-        className='col-span-2 flex flex-grow items-center justify-end gap-3'
-      >
-        {props.children ? (
-          props.children
-        ) : (
-          <>
-            <span className='flex-grow text-sm text-muted-foreground'>
-              hsl({props.value.h}, {props.value.s}%, {props.value.l}%)
-            </span>
-            <Popover>
-              <PopoverTrigger>
-                <div className='size-8 rounded-[var(--radius)] border border-border p-0.5'>
-                  <div
-                    className='size-full rounded-[calc(var(--radius)-0.125rem)]'
-                    style={{
-                      background: `hsl(${props.value.h}, ${props.value.s}%, ${props.value.l}%)`,
-                    }}
-                  />
-                </div>
-              </PopoverTrigger>
-              <PopoverContent className='flex gap-6'>
-                <HslColorPicker
-                  color={props.value}
-                  onChange={props.onChange}
-                />
-                <div className='flex flex-grow flex-col items-center justify-between'>
-                  <div className='flex flex-col gap-1.5'>
-                    <Label htmlFor={`${props.key}-h`}>Hue</Label>
-                    <Input
-                      id={`${props.key}-h`}
-                      name={`${props.key}-h`}
-                      type='number'
-                      value={props.value.h}
-                      min={0}
-                      max={360}
-                      onChange={(e) => {
-                        const value = props.value;
-                        props.onChange({
-                          h: Number(e.target.value),
-                          s: value.s,
-                          l: value.l,
-                        });
-                      }}
-                    />
-                  </div>
-                  <div className='flex flex-col gap-1.5'>
-                    <Label htmlFor={`${props.key}-s`}>Saturation</Label>
-                    <Input
-                      id={`${props.key}-s`}
-                      name={`${props.key}-s`}
-                      type='number'
-                      value={props.value.s}
-                      min={0}
-                      max={100}
-                      onChange={(e) => {
-                        const value = props.value;
-                        props.onChange({
-                          h: value.h,
-                          s: Number(e.target.value),
-                          l: value.l,
-                        });
-                      }}
-                    />
-                  </div>
-                  <div className='flex flex-col gap-1.5'>
-                    <Label htmlFor={`${props.key}-l`}>Lightness</Label>
-                    <Input
-                      id={`${props.key}-l`}
-                      name={`${props.key}-l`}
-                      type='number'
-                      value={props.value.l}
-                      min={0}
-                      max={100}
-                      onChange={(e) => {
-                        const value = props.value;
-                        props.onChange({
-                          h: value.h,
-                          s: value.s,
-                          l: Number(e.target.value),
-                        });
-                      }}
-                    />
-                  </div>
-                </div>
-              </PopoverContent>
-            </Popover>
-          </>
-        )}
-      </div>
-    </div>
-  );
-}
diff --git a/src/app/[...rest]/deploy/@form.site-config.tsx b/src/app/[...rest]/deploy/@form.site-config.tsx
deleted file mode 100644
index 84d5f57..0000000
--- a/src/app/[...rest]/deploy/@form.site-config.tsx
+++ /dev/null
@@ -1,418 +0,0 @@
-import toast from "react-hot-toast";
-import { z } from "zod";
-import {
-  ConfigurationCategory,
-  ConfigurationKeys,
-  ConfigurationValue,
-  Schema_App_Configuration,
-} from "~/schema";
-
-import { Button } from "~/components/ui/button";
-import { Input } from "~/components/ui/input";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "~/components/ui/select";
-import { Separator } from "~/components/ui/separator";
-
-import { parseConfigFile } from "~/utils/parseConfigFile";
-
-import config from "~/config/gIndex.config";
-
-import ConfigInput from "./@form.input-config";
-
-type Props = {
-  state: {
-    get: z.input<typeof Schema_App_Configuration>;
-    set: <
-      T extends ConfigurationCategory = ConfigurationCategory,
-      K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
-    >(
-      category: T,
-      key: K,
-      value: ConfigurationValue<T, K>,
-    ) => void;
-  };
-  error: {
-    get: Partial<Record<ConfigurationKeys<"site">, string>>;
-    set: <T extends ConfigurationKeys<"site">>(key: T, value: string) => void;
-  };
-  onReset: (category: ConfigurationCategory) => void;
-};
-export default function SiteConfig({
-  state: { get, set },
-  error,
-  onReset,
-}: Props) {
-  return (
-    <form
-      className='flex w-full flex-col gap-3 py-3'
-      onReset={(e) => {
-        e.preventDefault();
-        onReset("site");
-      }}
-    >
-      <div
-        slot='header'
-        className='flex flex-col gap-3 tablet:flex-row tablet:items-center tablet:justify-between'
-      >
-        <h4>Site</h4>
-        <div className='flex w-full items-center gap-3 tablet:w-fit'>
-          <Button
-            variant={"outline"}
-            size={"sm"}
-            onClick={(e) => {
-              e.preventDefault();
-
-              try {
-                const fileInput = document.createElement("input");
-                fileInput.type = "file";
-                fileInput.accept = ".config.ts";
-                fileInput.onchange = async (fileEvent) => {
-                  const file = (fileEvent.target as HTMLInputElement)
-                    .files?.[0];
-                  if (!file) return toast.error("No file selected");
-                  const fileName = file.name;
-                  if (fileName.toLowerCase() !== "gindex.config.ts")
-                    return toast.error("Please select a config file");
-
-                  const reader = new FileReader();
-                  reader.onload = async (read) => {
-                    const result = read.target?.result as string;
-                    if (!result) return toast.error("Failed to read file");
-
-                    const config = parseConfigFile(result);
-                    if ("success" in config) return toast.error(config.message);
-
-                    set(
-                      "site",
-                      "siteName",
-                      config.site.siteName || get.site.siteName,
-                    );
-                    set(
-                      "site",
-                      "siteNameTemplate",
-                      config.site.siteNameTemplate ||
-                        (get.site.siteNameTemplate as string),
-                    );
-                    set(
-                      "site",
-                      "siteDescription",
-                      config.site.siteDescription || get.site.siteDescription,
-                    );
-                    set(
-                      "site",
-                      "siteAuthor",
-                      config.site.siteAuthor || (get.site.siteAuthor as string),
-                    );
-                    set(
-                      "site",
-                      "twitterHandle",
-                      config.site.twitterHandle ||
-                        (get.site.twitterHandle as string),
-                    );
-
-                    set(
-                      "site",
-                      "showFileExtension",
-                      config.site.showFileExtension ||
-                        (get.site.showFileExtension as boolean),
-                    );
-
-                    set(
-                      "site",
-                      "privateIndex",
-                      config.site.privateIndex ||
-                        (get.site.privateIndex as boolean),
-                    );
-
-                    fileInput.value = "";
-                    toast.success("Config loaded from file");
-                  };
-                  reader.readAsText(file);
-                };
-                fileInput.click();
-              } catch (error) {
-                const e = error as Error;
-                console.error(e);
-                toast.error(e.message);
-              }
-            }}
-          >
-            Load from file
-          </Button>
-          <Button
-            type='reset'
-            variant={"destructive"}
-            size={"sm"}
-          >
-            Reset
-          </Button>
-        </div>
-      </div>
-
-      <Separator />
-
-      <div
-        slot='inputs'
-        className='flex flex-col gap-3'
-      >
-        <div className='flex flex-col'>
-          <div className='flex items-center gap-1.5 px-1.5 pt-3'>
-            <div className='flex select-none items-center gap-1.5 rounded-t-lg border border-b-0 border-border px-3 py-1.5'>
-              <img
-                src={config.siteConfig.favIcon}
-                className='size-4'
-                alt='favicon'
-              />
-              <span className='text-sm'>{get.site.siteName}</span>
-            </div>
-
-            <div className='flex select-none items-center gap-1.5 rounded-t-lg border border-b-0 border-border px-3 py-1.5'>
-              <img
-                src={config.siteConfig.favIcon}
-                className='size-4'
-                alt='favicon'
-              />
-              <span className='text-sm'>
-                {get.site
-                  .siteNameTemplate!.replace("%s", "Page Title")
-                  .replace("%t", get.site.siteName)}
-              </span>
-            </div>
-          </div>
-          <Separator className='mt-0' />
-        </div>
-
-        <div className='grid grid-cols-3 gap-6'>
-          <div className='col-span-2 flex flex-col gap-3'>
-            <ConfigInput<ConfigurationKeys<"site">>
-              key='siteName'
-              title='Index Site Name'
-              error={error.get.siteName}
-              required
-            >
-              <Input
-                id='siteName'
-                name='siteName'
-                value={get.site.siteName}
-                onChange={(e) => {
-                  if (error.get.siteName) {
-                    error.set("siteName", "");
-                  }
-                  set("site", "siteName", e.target.value);
-                }}
-                onBlur={async () => {
-                  try {
-                    const value = get.site.siteName;
-                    error.set("siteName", "");
-
-                    if (!value) throw new Error("Site name is required");
-                  } catch (err) {
-                    const e = err as Error;
-                    error.set("siteName", e.message);
-                  }
-                }}
-              />
-            </ConfigInput>
-
-            <ConfigInput<ConfigurationKeys<"site">>
-              key='siteNameTemplate'
-              title='Site Name Template'
-              description={`The template for the site name.
-
-Usable variables:
-%s - Page Title
-%t - Site Name`}
-              error={error.get.siteNameTemplate}
-            >
-              <Input
-                id='siteNameTemplate'
-                name='siteNameTemplate'
-                value={get.site.siteNameTemplate}
-                onChange={(e) => {
-                  if (error.get.siteNameTemplate) {
-                    error.set("siteNameTemplate", "");
-                  }
-                  set("site", "siteNameTemplate", e.target.value);
-                }}
-                onBlur={async () => {
-                  try {
-                    const value = get.site.siteNameTemplate;
-                    error.set("siteNameTemplate", "");
-                  } catch (err) {
-                    const e = err as Error;
-                    error.set("siteNameTemplate", e.message);
-                  }
-                }}
-              />
-            </ConfigInput>
-
-            <ConfigInput<ConfigurationKeys<"site">>
-              key='siteDescription'
-              title='Site Description'
-              error={error.get.siteDescription}
-              required
-            >
-              <Input
-                id='siteDescription'
-                name='siteDescription'
-                value={get.site.siteDescription}
-                onChange={(e) => {
-                  if (error.get.siteDescription) {
-                    error.set("siteDescription", "");
-                  }
-                  set("site", "siteDescription", e.target.value);
-                }}
-                onBlur={async () => {
-                  try {
-                    const value = get.site.siteDescription;
-                    error.set("siteDescription", "");
-
-                    if (!value) throw new Error("Site description is required");
-                  } catch (err) {
-                    const e = err as Error;
-                    error.set("siteDescription", e.message);
-                  }
-                }}
-              />
-            </ConfigInput>
-
-            <div className='grid grid-cols-2 gap-3'>
-              <ConfigInput<ConfigurationKeys<"site">>
-                key='siteAuthor'
-                title='Site Author'
-                error={error.get.siteAuthor}
-                description={`Will be used for metadata, and also affect the footer variable`}
-              >
-                <Input
-                  id='siteAuthor'
-                  name='siteAuthor'
-                  value={get.site.siteAuthor}
-                  onChange={(e) => {
-                    if (error.get.siteAuthor) {
-                      error.set("siteAuthor", "");
-                    }
-                    set("site", "siteAuthor", e.target.value);
-                  }}
-                  onBlur={async () => {
-                    try {
-                      const value = get.site.siteAuthor;
-                      error.set("siteAuthor", "");
-                    } catch (err) {
-                      const e = err as Error;
-                      error.set("siteAuthor", e.message);
-                    }
-                  }}
-                />
-              </ConfigInput>
-
-              <ConfigInput<ConfigurationKeys<"site">>
-                key='twitterHandle'
-                title='Twitter Handle'
-                error={error.get.twitterHandle}
-                description={`Will be used for metadata, and also affect the footer variable`}
-              >
-                <Input
-                  id='twitterHandle'
-                  name='twitterHandle'
-                  value={get.site.twitterHandle}
-                  onChange={(e) => {
-                    if (error.get.twitterHandle) {
-                      error.set("twitterHandle", "");
-                    }
-                    set("site", "twitterHandle", e.target.value);
-                  }}
-                  onBlur={async () => {
-                    try {
-                      const value = get.site.twitterHandle;
-                      error.set("twitterHandle", "");
-                    } catch (err) {
-                      const e = err as Error;
-                      error.set("twitterHandle", e.message);
-                    }
-                  }}
-                />
-              </ConfigInput>
-            </div>
-          </div>
-
-          <div className='h-fit select-none overflow-hidden rounded-md border bg-popover p-0 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2'>
-            <img
-              src={"/og.png"}
-              alt='Opengraph Preview'
-              className='w-full'
-            />
-            <div className='flex flex-col px-3 py-1.5'>
-              <span className='line-clamp-1 w-full text-lg font-medium'>
-                {(get.site.siteNameTemplate || "%s")
-                  .replace("%s", "Page Title")
-                  .replace("%t", get.site.siteName)}
-              </span>
-              <span className='text-xs text-muted-foreground'>
-                {get.environment.NEXT_PUBLIC_DOMAIN || "http://localhost:3000"}
-              </span>
-              <span className='line-clamp-2 text-sm text-muted-foreground'>
-                {get.site.siteDescription}
-              </span>
-            </div>
-          </div>
-        </div>
-
-        <Separator />
-
-        <ConfigInput<ConfigurationKeys<"site">>
-          key='privateIndex'
-          title='Private Index'
-          description={`Lock the whole site behind a password
-Will use the site password set in the "Environment" category`}
-          error={error.get.privateIndex}
-          required
-        >
-          <Select
-            value={(get.site.privateIndex || false).toString()}
-            onValueChange={(value) => {
-              set("site", "privateIndex", value === "true");
-            }}
-          >
-            <SelectTrigger>
-              <SelectValue placeholder={"Select an option"} />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value={"true"}>Enable</SelectItem>
-              <SelectItem value={"false"}>Disable</SelectItem>
-            </SelectContent>
-          </Select>
-        </ConfigInput>
-
-        <ConfigInput<ConfigurationKeys<"site">>
-          key='showFileExtension'
-          title='Show File Extension'
-          description={`Show file extension in file explorer
-          
-e.g. "file.mp4" instead of "file"`}
-          error={error.get.showFileExtension}
-          required
-        >
-          <Select
-            value={(get.site.showFileExtension || false).toString()}
-            onValueChange={(value) => {
-              set("api", "isTeamDrive", value === "true");
-            }}
-          >
-            <SelectTrigger>
-              <SelectValue placeholder={"Select an option"} />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value={"true"}>Enable</SelectItem>
-              <SelectItem value={"false"}>Disable</SelectItem>
-            </SelectContent>
-          </Select>
-        </ConfigInput>
-      </div>
-    </form>
-  );
-}
diff --git a/src/app/[...rest]/deploy/@form.theme.tsx b/src/app/[...rest]/deploy/@form.theme.tsx
deleted file mode 100644
index 97cd3cd..0000000
--- a/src/app/[...rest]/deploy/@form.theme.tsx
+++ /dev/null
@@ -1,235 +0,0 @@
-"use client";
-
-import { z } from "zod";
-import { Schema_Theme, ThemeKeys } from "~/schema";
-
-import { Input } from "~/components/ui/input";
-import { Separator } from "~/components/ui/separator";
-import { Slider } from "~/components/ui/slider";
-
-import { parseThemeValue } from "~/utils/parseConfigFile";
-
-import ThemeInput from "./@form.input-theme";
-
-type Props = {
-  currentTheme: "light" | "dark";
-  state: {
-    get: {
-      light: z.input<typeof Schema_Theme>;
-      dark: z.input<typeof Schema_Theme>;
-    };
-    set: (theme: "light" | "dark", key: ThemeKeys, value: string) => void;
-  };
-};
-export default function ThemeForm({
-  currentTheme,
-  state: { get, set },
-}: Props) {
-  return (
-    <div className='flex flex-col gap-1.5'>
-      <ThemeInput
-        key='background'
-        title='Background'
-        value={parseThemeValue(get[currentTheme].background)}
-        onChange={(val) => {
-          set(currentTheme, "background", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='foreground'
-        title='Text'
-        value={parseThemeValue(get[currentTheme].foreground)}
-        onChange={(val) => {
-          set(currentTheme, "foreground", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-
-      <Separator className='my-1.5' />
-
-      <ThemeInput
-        key='card'
-        title='Card'
-        value={parseThemeValue(get[currentTheme].card)}
-        onChange={(val) => {
-          set(currentTheme, "card", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='card-foreground'
-        title='Card Text'
-        value={parseThemeValue(get[currentTheme]["card-foreground"])}
-        onChange={(val) => {
-          set(currentTheme, "card-foreground", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-
-      <ThemeInput
-        key='popover'
-        title='Popover'
-        value={parseThemeValue(get[currentTheme].popover)}
-        onChange={(val) => {
-          set(currentTheme, "popover", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='popover-foreground'
-        title='Popover Text'
-        value={parseThemeValue(get[currentTheme]["popover-foreground"])}
-        onChange={(val) => {
-          set(currentTheme, "popover-foreground", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-
-      <Separator className='my-1.5' />
-
-      <ThemeInput
-        key='primary'
-        title='Primary'
-        value={parseThemeValue(get[currentTheme].primary)}
-        onChange={(val) => {
-          set(currentTheme, "primary", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='primary-foreground'
-        title='Primary Text'
-        value={parseThemeValue(get[currentTheme]["primary-foreground"])}
-        onChange={(val) => {
-          set(currentTheme, "primary-foreground", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='secondary'
-        title='Secondary'
-        value={parseThemeValue(get[currentTheme].secondary)}
-        onChange={(val) => {
-          set(currentTheme, "secondary", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='secondary-foreground'
-        title='Secondary Text'
-        value={parseThemeValue(get[currentTheme]["secondary-foreground"])}
-        onChange={(val) => {
-          set(
-            currentTheme,
-            "secondary-foreground",
-            `${val.h} ${val.s} ${val.l}`,
-          );
-        }}
-      />
-      <ThemeInput
-        key='accent'
-        title='Accent'
-        value={parseThemeValue(get[currentTheme].accent)}
-        onChange={(val) => {
-          set(currentTheme, "accent", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='accent-foreground'
-        title='Accent Text'
-        value={parseThemeValue(get[currentTheme]["accent-foreground"])}
-        onChange={(val) => {
-          set(currentTheme, "accent-foreground", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='muted'
-        title='Muted'
-        value={parseThemeValue(get[currentTheme].muted)}
-        onChange={(val) => {
-          set(currentTheme, "muted", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='muted-foreground'
-        title='Muted Text'
-        value={parseThemeValue(get[currentTheme]["muted-foreground"])}
-        onChange={(val) => {
-          set(currentTheme, "muted-foreground", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='destructive'
-        title='Destructive'
-        value={parseThemeValue(get[currentTheme].destructive)}
-        onChange={(val) => {
-          set(currentTheme, "destructive", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='destructive-foreground'
-        title='Destructive Text'
-        value={parseThemeValue(get[currentTheme]["destructive-foreground"])}
-        onChange={(val) => {
-          set(
-            currentTheme,
-            "destructive-foreground",
-            `${val.h} ${val.s} ${val.l}`,
-          );
-        }}
-      />
-
-      <Separator className='my-1.5' />
-
-      <ThemeInput
-        key='border'
-        title='Element Border'
-        value={parseThemeValue(get[currentTheme].border)}
-        onChange={(val) => {
-          set(currentTheme, "border", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='input'
-        title='Input Border'
-        value={parseThemeValue(get[currentTheme].input)}
-        onChange={(val) => {
-          set(currentTheme, "input", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='ring'
-        title='Focus Ring'
-        value={parseThemeValue(get[currentTheme].ring)}
-        onChange={(val) => {
-          set(currentTheme, "ring", `${val.h} ${val.s} ${val.l}`);
-        }}
-      />
-      <ThemeInput
-        key='radius'
-        title='Roundness'
-        value={{ h: 0, s: 0, l: 0 }}
-        onChange={(val) => {}}
-      >
-        <div className='flex w-full items-center gap-3'>
-          <Slider
-            className='w-full'
-            defaultValue={[parseFloat(get[currentTheme].radius) * 16 || 0]}
-            min={0}
-            max={24}
-            value={[parseFloat(get[currentTheme].radius) * 16 || 0]}
-            onValueChange={(val) => {
-              const value = val[0] / 16;
-              set("light", "radius", `${value}rem`);
-              set("dark", "radius", `${value}rem`);
-            }}
-          />
-          <Input
-            value={parseFloat(get[currentTheme].radius) * 16 || 0}
-            onChange={(e) => {
-              const value = parseFloat(e.currentTarget.value) / 16;
-              set("light", "radius", `${value}rem`);
-              set("dark", "radius", `${value}rem`);
-            }}
-            type='number'
-            className='w-16 min-w-0 '
-            min={0}
-            max={24}
-          />
-        </div>
-      </ThemeInput>
-    </div>
-  );
-}
diff --git a/src/app/[...rest]/deploy/@theme-preview.tsx b/src/app/[...rest]/deploy/@theme-preview.tsx
deleted file mode 100644
index ea8e9ea..0000000
--- a/src/app/[...rest]/deploy/@theme-preview.tsx
+++ /dev/null
@@ -1,369 +0,0 @@
-"use client";
-
-import nProgress from "nprogress";
-import { CSSProperties, PropsWithChildren } from "react";
-import toast from "react-hot-toast";
-import { z } from "zod";
-import { Schema_Theme } from "~/schema";
-
-import FileGrid from "~/app/@file.grid";
-import FileList from "~/app/@file.list";
-import { Button } from "~/components/ui/button";
-import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-} from "~/components/ui/card";
-import {
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from "~/components/ui/dialog";
-import {
-  Drawer,
-  DrawerClose,
-  DrawerContent,
-  DrawerDescription,
-  DrawerFooter,
-  DrawerHeader,
-  DrawerTitle,
-  DrawerTrigger,
-} from "~/components/ui/drawer";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "~/components/ui/dropdown-menu";
-import { Input } from "~/components/ui/input";
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from "~/components/ui/popover";
-import { Separator } from "~/components/ui/separator";
-import {
-  Sheet,
-  SheetClose,
-  SheetContent,
-  SheetDescription,
-  SheetFooter,
-  SheetHeader,
-  SheetTitle,
-  SheetTrigger,
-} from "~/components/ui/sheet";
-import { Textarea } from "~/components/ui/textarea";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger,
-} from "~/components/ui/tooltip";
-
-type Props = {
-  theme: z.input<typeof Schema_Theme>;
-};
-export default function ThemePreview({ theme }: Props) {
-  return (
-    <div
-      className='flex flex-col gap-3 rounded-[var(--radius)] border border-border bg-background p-3 text-foreground'
-      style={
-        {
-          "--background": theme.background,
-          "--foreground": theme.foreground,
-          "--card": theme.card,
-          "--card-foreground": theme["card-foreground"],
-          "--popover": theme.popover,
-          "--popover-foreground": theme["popover-foreground"],
-          "--primary": theme.primary,
-          "--primary-foreground": theme["primary-foreground"],
-          "--secondary": theme.secondary,
-          "--secondary-foreground": theme["secondary-foreground"],
-          "--muted": theme.muted,
-          "--muted-foreground": theme["muted-foreground"],
-          "--accent": theme.accent,
-          "--accent-foreground": theme["accent-foreground"],
-          "--destructive": theme.destructive,
-          "--destructive-foreground": theme["destructive-foreground"],
-          "--border": theme.border,
-          "--input": theme.input,
-          "--ring": theme.ring,
-          "--radius": theme.radius,
-        } as CSSProperties
-      }
-    >
-      <Wrapper title='Button'>
-        <Button
-          size={"sm"}
-          variant={"default"}
-        >
-          Default
-        </Button>
-        <Button
-          size={"sm"}
-          variant={"secondary"}
-        >
-          Secondary
-        </Button>
-        <Button
-          size={"sm"}
-          variant={"destructive"}
-        >
-          Destructive
-        </Button>
-        <Button
-          size={"sm"}
-          variant={"outline"}
-        >
-          Outline
-        </Button>
-        <Button
-          size={"sm"}
-          variant={"ghost"}
-        >
-          Ghost
-        </Button>
-        <Button
-          size={"sm"}
-          variant={"link"}
-        >
-          Link
-        </Button>
-      </Wrapper>
-
-      <Wrapper title='Card'>
-        <Card className='w-full'>
-          <CardHeader>
-            <CardTitle>Title</CardTitle>
-            <CardDescription>Description</CardDescription>
-            <Separator />
-          </CardHeader>
-          <CardContent>Content</CardContent>
-          <CardFooter>Footer</CardFooter>
-        </Card>
-      </Wrapper>
-
-      <Wrapper title='Input'>
-        <Input placeholder='Input' />
-        <Textarea placeholder='Textarea' />
-      </Wrapper>
-
-      <Wrapper title='Popover'>
-        <Tooltip>
-          <TooltipTrigger>
-            <Button
-              size={"sm"}
-              variant={"outline"}
-            >
-              Hover me
-            </Button>
-          </TooltipTrigger>
-          <TooltipContent>
-            <p>Tooltip content</p>
-          </TooltipContent>
-        </Tooltip>
-
-        <Popover>
-          <PopoverTrigger>
-            <Button
-              size={"sm"}
-              variant={"outline"}
-            >
-              Click me
-            </Button>
-          </PopoverTrigger>
-          <PopoverContent>
-            <p>Popover content</p>
-          </PopoverContent>
-        </Popover>
-
-        <DropdownMenu>
-          <DropdownMenuTrigger>
-            <Button
-              size={"sm"}
-              variant={"outline"}
-            >
-              Click me
-            </Button>
-          </DropdownMenuTrigger>
-          <DropdownMenuContent>
-            <DropdownMenuItem>Item 1</DropdownMenuItem>
-            <DropdownMenuItem>Item 2</DropdownMenuItem>
-            <DropdownMenuItem disabled>Item 3</DropdownMenuItem>
-          </DropdownMenuContent>
-        </DropdownMenu>
-
-        <Button
-          size={"sm"}
-          variant={"outline"}
-          onClick={async () => {
-            toast.loading("Loading...", {
-              duration: 3000,
-            });
-            toast.success("Success", {
-              duration: 3000,
-            });
-            toast.error("Error", {
-              duration: 3000,
-            });
-          }}
-        >
-          Show toast
-        </Button>
-      </Wrapper>
-
-      <Wrapper title='Overlay'>
-        <Dialog>
-          <DialogTrigger>
-            <Button
-              size={"sm"}
-              variant={"outline"}
-            >
-              Open Dialog
-            </Button>
-          </DialogTrigger>
-          <DialogContent>
-            <DialogHeader>
-              <DialogTitle>Title</DialogTitle>
-              <DialogDescription>Description</DialogDescription>
-              <Separator />
-            </DialogHeader>
-            <div>Content</div>
-            <DialogFooter>
-              <DialogClose>
-                <Button
-                  size={"sm"}
-                  variant={"secondary"}
-                >
-                  Close
-                </Button>
-              </DialogClose>
-            </DialogFooter>
-          </DialogContent>
-        </Dialog>
-
-        <Drawer>
-          <DrawerTrigger>
-            <Button
-              size={"sm"}
-              variant={"outline"}
-            >
-              Open Drawer
-            </Button>
-          </DrawerTrigger>
-          <DrawerContent>
-            <DrawerHeader>
-              <DrawerTitle>Title</DrawerTitle>
-              <DrawerDescription>Description</DrawerDescription>
-              <Separator />
-            </DrawerHeader>
-            <div className='p-6'>Content</div>
-            <DrawerFooter>
-              <DrawerClose>
-                <Button
-                  size={"sm"}
-                  variant={"secondary"}
-                  className='w-full'
-                >
-                  Close
-                </Button>
-              </DrawerClose>
-            </DrawerFooter>
-          </DrawerContent>
-        </Drawer>
-
-        <Sheet>
-          <SheetTrigger>
-            <Button
-              size={"sm"}
-              variant={"outline"}
-            >
-              Open Sheet
-            </Button>
-          </SheetTrigger>
-          <SheetContent>
-            <SheetHeader>
-              <SheetTitle>Title</SheetTitle>
-              <SheetDescription>Description</SheetDescription>
-              <Separator />
-            </SheetHeader>
-            <div>Content</div>
-            <SheetFooter>
-              <SheetClose>
-                <Button
-                  size={"sm"}
-                  variant={"secondary"}
-                  className='w-full'
-                >
-                  Close
-                </Button>
-              </SheetClose>
-            </SheetFooter>
-          </SheetContent>
-        </Sheet>
-
-        <Button
-          size={"sm"}
-          variant={"outline"}
-          onClick={async () => {
-            nProgress.start();
-            await new Promise((resolve) => setTimeout(resolve, 1500));
-            nProgress.done();
-          }}
-        >
-          Test Loading
-        </Button>
-      </Wrapper>
-
-      <Wrapper title='File'>
-        <div className='flex w-full flex-col gap-3'>
-          <FileList
-            data={{
-              encryptedId: "encryptedId",
-              name: "File Name",
-              modifiedTime: "2022-01-01T00:00:00Z",
-              mimeType: "text/plain",
-              trashed: false,
-              size: 1024 * 1024 * 100,
-            }}
-            disabled
-          />
-          <div className='grid w-full'>
-            <FileGrid
-              data={{
-                encryptedId: "encryptedId",
-                name: "File Name",
-                modifiedTime: "2022-01-01T00:00:00Z",
-                mimeType: "text/plain",
-                trashed: false,
-                size: 1024 * 1024 * 100,
-              }}
-              disabled
-            />
-          </div>
-        </div>
-      </Wrapper>
-    </div>
-  );
-}
-
-type WrapperProps = {
-  title: string;
-};
-function Wrapper({ title, children }: PropsWithChildren<WrapperProps>) {
-  return (
-    <div className='flex w-full flex-col gap-1.5'>
-      <h2 className='text-lg font-semibold'>{title}</h2>
-      <div className={"flex w-full flex-wrap items-center gap-1.5"}>
-        {children}
-      </div>
-    </div>
-  );
-}
diff --git a/src/app/[...rest]/deploy/docs.tsx b/src/app/[...rest]/deploy/docs.tsx
deleted file mode 100644
index aba7041..0000000
--- a/src/app/[...rest]/deploy/docs.tsx
+++ /dev/null
@@ -1,1356 +0,0 @@
-"use client";
-
-import Link from "next/link";
-import { useEffect, useState } from "react";
-import toast from "react-hot-toast";
-import { z } from "zod";
-import {
-  ConfigState,
-  ConfigurationCategory,
-  ConfigurationKeys,
-  ConfigurationValue,
-  Schema_App_Configuration,
-  Schema_Theme,
-  ThemeKeys,
-} from "~/schema";
-import { cn } from "~/utils";
-
-import Markdown from "~/app/@markdown";
-import Icon from "~/components/Icon";
-import { Button } from "~/components/ui/button";
-import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
-import {
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from "~/components/ui/dialog";
-import { Separator } from "~/components/ui/separator";
-import { Textarea } from "~/components/ui/textarea";
-
-import { encryptData } from "~/utils/encryptionHelper/hash";
-import { parseThemeValue } from "~/utils/parseConfigFile";
-
-import config from "~/config/gIndex.config";
-
-import ApiConfig from "./@form.api-config";
-import EnvironmentConfig from "./@form.env-config";
-import SiteConfig from "./@form.site-config";
-import ThemeForm from "./@form.theme";
-import ThemePreview from "./@theme-preview";
-
-export const getting_started = `Welcome to the deployment guide! This guide will help you to deploy the application to Vercel or similar services.
-
-If you are new to this project, you can follow along from the beginning.
-But if you've already deployed the app before and want to upgrade from v1, you can skip to the [Migrating from v1](#migrating) section.  
-You can also use this guide to [configure the app](#config) and [customize the theme](#theme).  
-
-**We recommend you to use this deployment guide on a desktop browser.**
-
-_**Note:** This guide assumes you have a basic understanding of how to deploy a Next.js app on Vercel or other platforms._`;
-
-export const new_user_guide = `Prerequisites:
-- A basic understanding of Vercel (or similar services)
-- Google Cloud Platform account
-
-### Fork or Clone the repository
-It's pretty obvious, but you need to fork the repository to your account.
-You can [click here](https://github.com/mbahArip/next-gdrive-index/fork) to fork the repository.  
-You can choose any repository name, description, and visibility.
-
-But if you want to run it locally, you can clone the repository instead.
-
-### Create a Google Cloud Platform project and enable Google Drive API
-We need an access to Google Drive API to get the files from Google Drive.
-So you need to create a project in Google Cloud Platform and enable Google Drive API to get your own credentials.
-
-1. Go to [Google Cloud Platform](https://console.cloud.google.com/)
-2. Click the \`New Project\` button
-3. Enter a project name, and click the \`Create\` button
-4. After the project is created, click the \`Enable APIs and Services\` button
-5. Search for Google Drive API, and click the \`Enable\` button
-
-### Create a Service Account and get the credentials
-After enabling the Google Drive API, we need to create a service account to get the credentials.
-The credentials will be used to authenticate the application to access the Google Drive API and get the files.
-
-1. On [APIs & Services](https://console.cloud.google.com/apis/dashboard) page, click the \`Credentials\` menu on the sidebar
-2. Click the \`Create Credentials\` button, and choose \`Service account\`
-3. Enter your service account name and description, and then click the \`Done\` button
-4. You will see the service account you just created on \`Service Account\` table, click the name of the service account to open the details
-5. Go to \`Keys\` tab, then click the \`Add Key\` button and choose the \`Create new key\`
-6. Pick \`JSON\` as the key type and click the \`Create\` button
-7. The JSON file will be downloaded to your computer, and **keep it safe**. We will use it later on the configuration
-
-_**Note:** The JSON file contains sensitive information, don't share it with anyone_
-
-### Create shared folder in Google Drive
-Since the service account can't access your Root folder, you need to create a new folder, and share it with the service account.
-This folder will be used as the root folder for the application.
-
-> If you're using or the folder you want to share inside Shared Drive, you can skip this step and go to the [Shared Drive Guide](#shared-drive)
-
-1. Go to [Google Drive](https://drive.google.com/)
-2. Click the \`New\` button, and choose \`Folder\` to create a new folder, you can name it anything you want
-3. Right-click the folder you just created, and choose \`Share\`
-4. Enter the email address of the service account you just created (you can find it on the JSON file, or on the service account details page)
-5. To allow download files larger than deployment limit, you need to enable \`Link sharing\` and set it to \`Anyone with the link\`
-6. Copy the folder ID from the URL, it's the part after \`/folders/\` in the URL (e.g: https://drive.google.com/drive/u/0/folders/ \`<folder_id>\` )
-
-### Configuring the app and Customizing the theme
-Now we need to configure the app to use the credentials and folder ID we just created.
-You can follow the [App Configuration](#config) and [Customize Theme](#theme) sections to configure the app and customize the theme.
-
-_**Note:** You can skip the theme customization, but you **NEED** to configure the app_
-
-### Deploy the app
-On this guide we will use Vercel to deploy the app, but you can use other platforms like Netlify, Heroku, etc.
-But don't forget to adjust the \`fileSizeLimit\` on the [configuration](#config) if you use other platforms.
-
-> Before deploying, make sure you have pushed the changes to your repository
-
-
-1. Go to [Vercel](https://vercel.com/)
-2. Click on the \`Add new\` button, and choose \`Project\`
-3. Choose the repository you just forked
-4. On the \`Environment Variables\` section, copy the whole content from \`.env.local\` you just downloaded from [configuration](#config) section, and paste it on the key fields. It will automatically add all the environment variables needed
-5. Click the \`Deploy\` button
-6. Wait for the deployment to finish, and open project
-7. Go to \`Settings\` tab, and click the \`Functions\` menu, and select your \`Function Region\` to the nearest region to your location for optimal speed
-8. Go to \`Deployment\` tab, click the 3 dots on the right side of the latest \`Production\` deployment, and click the \`Redeploy\` button to apply the changes
-
-For other platforms, you can check their own documentation for Next.js deployment guide.
-
-### Done! 🎉
-Congratulations! You have successfully deployed the app.`;
-
-export const shared_drive_guide = `I'm separating this guide in case someone who already using v1 can see this guide easily.
-
-As of version 2.0.2 we added support for Shared Drive, and the demo actually using a Shared Drive.
-You can follow this guide to use Shared Drive as the root folder for the application.
-
-1. Go to [Google Drive](https://drive.google.com/)
-2. Open the \`Shared Drives\` menu from the sidebar
-3. Right click on the Shared Drive you want to use, and choose \`Manage members\`
-4. Add your service account email address to the members list, and give it at least \`Viewer\` permission
-5. Open the \`Shared Drive\`, and copy the ID from the URL, it's the part after \`/drive/u/0/folders/\` in the URL (e.g: https://drive.google.com/drive/u/0/folders/ \`<drive_id>\` )
-6. Paste the ID to \`Shared Drive\` field on the [configuration](#config) section, and set the \`is Team Drive\` to \`true\`
-7. For the root folder, you can set it to the folder ID inside the Shared Drive, or use the Shared Drive ID as the root folder ID
-8. Update the configuration file, and redeploy the app to apply the changes
-9. Done! 🎉
-
-If you don't want to use the configuration section below, you can encrypt your \`Shared Drive\` ID using the \`/api/internal/encrypt?q=<drive_id>\` endpoint, and update the config file directly.
-`;
-
-export const migration_guide = `If you've already deployed the app before and want to upgrade from v1, you can follow this guide to migrate the app to the latest version.
-
-### Update your environment and configuration
-If you still have the \`.env.local file\`, you can go to the [configuration](#config) section, and load the file to update the environment variables.
-If you don't have it, go to your deployment platform and copy the environment variables from the platform to the [configuration](#config) section.
-
-You can also load the old \`gindex.config.ts\` file to the [configuration](#config) section to set the default configuration.
-
-### Update the repository
-First, you need to update the repository to the latest version.
-If you open your forked repository, you will see a notification that the repository is behind the original repository.
-You can sync the repository by clicking the \`Sync fork\` button.
-After the repository is updated, you can replace the \`gindex.config.ts\` file with the new one.
-
-### Update deployment
-Now go to your Vercel project page (or other platforms).
-Go to the \`Settings\` tab, and click the \`Environment Variables\` menu.
-You can delete all the old environment variables, and copy the new environment variables from the updated \`.env.local\` file.
-Now you can redeploy the app to apply the changes.
-`;
-const initialConfiguration: z.input<typeof Schema_App_Configuration> = {
-  environment: {
-    GD_SERVICE_B64: "",
-    ENCRYPTION_KEY: "",
-    SITE_PASSWORD: "",
-    NEXT_PUBLIC_DOMAIN: "",
-  },
-  api: {
-    ...config.apiConfig,
-    rootFolder: "",
-    isTeamDrive: false,
-    sharedDrive: "",
-    itemsPerPage: 50,
-    searchResult: 5,
-
-    proxyThumbnail: true,
-    streamMaxSize: 100 * 1024 * 1024,
-
-    allowDownloadProtectedFile: false,
-    temporaryTokenDuration: 6,
-    maxFileSize: 4 * 1024 * 1024,
-  },
-  site: {
-    ...config.siteConfig,
-    siteName: "next-gdrive-index",
-    siteNameTemplate: "%s - %t",
-    siteDescription: "A Google Drive Index built using Next.js",
-    siteAuthor: "mbahArip",
-    twitterHandle: "@mbahArip",
-
-    showFileExtension: false,
-    footer: [
-      "{{ siteName }} *v{{ version }}* @ {{ repository }}",
-      "{{ year }} - Made with ❤️ by **{{ author }}**",
-    ],
-
-    privateIndex: false,
-    breadcrumbMax: 3,
-
-    toaster: {
-      position: "bottom-right",
-      duration: 3000,
-    },
-
-    navbarItems: [],
-    supports: [],
-  },
-};
-
-function downloadBlob(blob: Blob, filename: string) {
-  const url = URL.createObjectURL(blob);
-  const anchor = document.createElement("a");
-  anchor.href = url;
-  anchor.download = filename;
-
-  const afterClick = () => {
-    setTimeout(() => {
-      URL.revokeObjectURL(url);
-      removeEventListener("click", afterClick);
-    }, 100);
-  };
-  anchor.addEventListener("click", afterClick, false);
-
-  anchor.click();
-}
-
-export function Configuration() {
-  const [loading, setLoading] = useState<boolean>(true);
-  const [configuration, setConfiguration] =
-    useState<z.input<typeof Schema_App_Configuration>>(initialConfiguration);
-  const [error, setError] = useState<{
-    environment: Partial<Record<ConfigurationKeys<"environment">, string>>;
-    api: Partial<Record<ConfigurationKeys<"api">, string>>;
-    site: Partial<Record<ConfigurationKeys<"site">, string>>;
-  }>({
-    environment: {},
-    api: {},
-    site: {},
-  });
-  const [downloadState, setDownloadState] = useState<ConfigState>("idle");
-
-  useEffect(() => {
-    setLoading(false);
-  }, []);
-
-  // It's been a year I'm learning TS, and this thing still scares me
-  function onConfigurationChange<
-    T extends ConfigurationCategory = ConfigurationCategory,
-    K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
-  >(category: T, key: K, value: ConfigurationValue<T, K>) {
-    setConfiguration((prev) => ({
-      ...prev,
-      [category]: {
-        ...prev[category],
-        [key]: value,
-      },
-    }));
-  }
-  function onReset(category: ConfigurationCategory) {
-    setConfiguration((prev) => ({
-      ...prev,
-      [category]: initialConfiguration[category],
-    }));
-    setError((prev) => ({
-      ...prev,
-      [category]: {},
-    }));
-  }
-  async function onDownload(
-    e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
-  ) {
-    e.preventDefault();
-    setDownloadState("loading");
-    toast.loading("Generating configuration file...", {
-      id: "download-config",
-    });
-
-    try {
-      // Check required section first
-      const requiredEmpty = [
-        !configuration.environment.ENCRYPTION_KEY.length,
-        !configuration.environment.GD_SERVICE_B64.length,
-        !configuration.api.rootFolder.length,
-        configuration.api.isTeamDrive && !configuration.api.sharedDrive?.length,
-        !configuration.site.siteName.length,
-        !configuration.site.siteDescription.length,
-        configuration.site.privateIndex &&
-          !configuration.environment.SITE_PASSWORD?.length,
-      ];
-      if (requiredEmpty.filter((v) => v).length) {
-        throw new Error("Looks like you missed some required fields.");
-      }
-
-      const errors = [];
-      for (const err of Object.values(error.environment)) {
-        if (err.length) errors.push(err);
-      }
-      for (const err of Object.values(error.api)) {
-        if (err.length) errors.push(err);
-      }
-      for (const err of Object.values(error.site)) {
-        if (err.length) errors.push(err);
-      }
-
-      if (errors.length) {
-        throw new Error(
-          "Please fix all the errors before downloading the configuration file.",
-        );
-      }
-
-      let envContent = Object.entries(configuration.environment)
-        .map(([key, value]) => `${key}=${value}`)
-        .join("\n");
-      envContent +=
-        "\n\n# Can't name it .env for download, so rename it to .env.local\n# Or you can copy the content to your deployment platform";
-
-      const configContent: string = `import { z } from "zod";
-import { Schema_Config } from "~/schema";
-import isDev from "~/utils/isDev";
-
-const config: z.input<typeof Schema_Config> = {
-  /**
-   * If possible, please don't change this value
-   * Even if you're creating a PR, just let me change it myself
-   */
-  version: "${config.version}",
-
-  /**
-   * Base path of the app, used for generating links
-   *
-   * If you're using another port for development, you can set it here
-   *
-   * @default process.env.NEXT_PUBLIC_DOMAIN
-   * @fallback process.env.NEXT_PUBLIC_VERCEL_URL
-   */
-  basePath: isDev
-      ? "http://localhost:3000"
-      : \`https://\${process.env.NEXT_PUBLIC_DOMAIN || process.env.NEXT_PUBLIC_VERCEL_URL}\`,
-
-  /**
-   * Allow access to the deploy guide
-   * Will use the \`/deploy\` route, might be overlap with file / folder name
-   *
-   * Set this to false on final deployment
-   *
-   * I'm using this to show the deploy guide on my own demo deployment
-   *
-   * @default false
-   */
-  showDeployGuide: false,
-
-  /**
-   * How long the cache will be stored in the browser
-   * Used for all pages and api routes
-   *
-   * @default "max-age=0, s-maxage=60, stale-while-revalidate"
-   */
-  cacheControl: "max-age=0, s-maxage=60, stale-while-revalidate",
-
-  apiConfig: {
-    /**
-     * Starting point of the drive.
-     * Will be used for '/' route.
-     *
-     * Since service account can't access 'root' folder
-     * You need to create a new folder and share it with the service account
-     * Then, copy the folder id and paste it here
-     */
-    rootFolder:
-      "${await encryptData(
-        configuration.api.rootFolder,
-        configuration.environment.ENCRYPTION_KEY,
-      )}",
-
-    /**
-     * If your rootfolder inside a shared drive, you NEED to set this to true
-     * If not, you can set this to false
-     *
-     * You also need to set the shared drive ID to make it work
-     * Make sure you have add your service account to the shared drive since the service account can't access the shared drive by default
-     *
-     * Where to get the shared drive id?
-     * Go to your Shared Drive > Click on the shared drive > copy the ID from the url
-     * ex: https://drive.google.com/drive/u/0/folders/:shared_drive_id
-     *
-     * Then you need to encrypt it using \`/api/internal/encrypt?q=:shared_drive_id\` route
-     */
-    isTeamDrive: ${configuration.api.isTeamDrive ? "true" : "false"},
-    sharedDrive:
-      "${
-        configuration.api.isTeamDrive && configuration.api.sharedDrive
-          ? await encryptData(
-              configuration.api.sharedDrive,
-              configuration.environment.ENCRYPTION_KEY,
-            )
-          : ""
-      }",
-
-    defaultQuery: [
-      "trashed = false",
-      "(not mimeType contains 'google-apps' or mimeType contains 'folder')",
-    ],
-    defaultField:
-      "id, name, mimeType, thumbnailLink, fileExtension, modifiedTime, size, imageMediaMetadata, videoMediaMetadata, webContentLink, trashed",
-    defaultOrder: "folder, name asc, modifiedTime desc",
-
-    itemsPerPage: ${configuration.api.itemsPerPage},
-    searchResult: ${configuration.api.searchResult},
-
-    /**
-     * By default, the app will use the thumbnail URL from Google Drive
-     *
-     * Sometimes, the thumbnail can't be accessed because of CORS policy
-     * If you're having this issue, you can set this to true
-     *
-     * This will make the api fetch the thumbnail and serve it from the server
-     * instead of using the Google Drive thumbnail
-     *
-     * This will increase the server load, so use it wisely
-     *
-     * Default: true
-     */
-    proxyThumbnail: ${configuration.api.proxyThumbnail ? "true" : "false"}, 
-    
-    /**
-     * Only show preview for files that are smaller than this size
-     * If the file is larger than this size, it will show "can't preview" message instead
-     *
-     * Why?
-     * Since the stream endpoint are counted as a bandwidth usage
-     * I want to limit the preview to only small files
-     * It also to prevent abuse from the user
-     *
-     * You can also set this to 0 to disable the limit
-     * 
-     * Default: 100MB
-     */
-    streamMaxSize: ${configuration.api.streamMaxSize},
-
-    /**
-     * Special file name that will be used for certain purposes
-     * These files will be ignored when searching for files
-     * and will be hidden from the files list by default
-     */
-    specialFile: {
-      password: ".password",
-      readme: ".readme.md",
-      /**
-       * Banner will be used for opengraph image for folder
-       * By default, all folder will use default og image
-       */
-      banner: ".banner",
-    },
-
-    /**
-     * Reason why banner has multiple extensions:
-     * - If I use contains query, it will also match the file or folder that contains the word.
-     *   (e.g: File / folder with the name of "Test Password" will be matched)
-     * - If I use = query, it will only match the exact name, hence the multiple extensions
-     *
-     * You can add more extensions if you want
-     */
-    hiddenFiles: [
-      ".password",
-      ".readme.md",
-      ".banner",
-      ".banner.jpg",
-      ".banner.png",
-      ".banner.webp",
-    ],
-
-    /**
-     * Allow user to download protected file without password.
-     * If this set to false, download link will have temporary token attached to it
-     * If this set to true, user can download the file without password as long as they have the link
-     *
-     * Default: false
-     */
-    allowDownloadProtectedFile: ${
-      configuration.api.allowDownloadProtectedFile ? "true" : "false"
-    },
-
-    /**
-     * Duration in hours.
-     * In version 2, this will be used for download link expiration.
-     * If you need it under 1 hour, you can use math expression. (e.g: (5 / 60) * 1 = 5 minutes)
-     *
-     * This only affect when the user download the file
-     * For example if you set it for example 30 minutes (0.5)
-     * After 30 minutes, and the user still downloading the file, the download will NOT be interrupted
-     * But if the user refresh the page / trying to download again, the download link will be expired
-     *
-     * Default: 6 hours
-     */
-    temporaryTokenDuration: ${configuration.api.temporaryTokenDuration},
-
-    /**
-     * Maximum file size that can be downloaded via api routes
-     * If it's larger than this, it will be redirected to the file url
-     *
-     * If you're using Vercel, they have a limit of ~4 - ~4.5MB response size
-     * ref: https://vercel.com/docs/platform/limits#serverless-function-payload-size-limit
-     * If you're using another platform, you can match the limit with your platform
-     * Or you can set this to 0 to disable the limit
-     *
-     * Default: 4MB
-     */
-    maxFileSize: ${configuration.api.maxFileSize},
-  },
-
-  siteConfig: {
-    /**
-     * Site Name will be used for default metadata title
-     * Site Name Template will be used if the page has a title
-     * %s will be replaced with the page title
-     *
-     * You can set it to undefined if you don't want to use it
-     */
-    siteName: "${configuration.site.siteName}",
-    siteNameTemplate: "${configuration.site.siteNameTemplate}",
-    siteDescription: "${configuration.site.siteDescription}",
-    siteIcon: "/logo.svg",
-    favIcon: "/favicon.png",
-
-    siteAuthor: "${configuration.site.siteAuthor}",
-    twitterHandle: "${configuration.site.twitterHandle}",
-
-    /**
-     * Next.js Metadata robots object
-     *
-     * ref: https://nextjs.org/docs/app/api-reference/functions/generate-metadata#robots
-     */
-    robots: "noindex, nofollow",
-
-    /**
-     * Show file extension on the file name
-     * Example:
-     *    true       |   false
-     *    file.txt   |   file
-     *    100KB      |   txt / 100KB
-     *
-     * Default: false
-     */
-    showFileExtension: ${
-      configuration.site.showFileExtension ? "true" : "false"
-    },
-
-    /**
-     * Footer content
-     * You can also set it to empty array if you don't want to use it
-     *
-     * Basic markdown is supported (bold, italic, and link)
-     * External link will be opened in new tab
-     *
-     * Template:
-     * - {{ year }} will be replaced with the current year
-     * - {{ repository }} will be replaced with the original repository link
-     * - {{ author }} will be replaced with author from siteAuthor config above (If it's not set, it will be set to mbaharip)
-     * - {{ version }} will be replaced with the current version
-     * - {{ siteName }} will be replaced with the siteName config above
-     * - {{ handle }} will be replaced with the twitter handle from twitterHandle config above
-     * - {{ creator }} will be replaced with mbaharip if you want to credit me
-     */
-    footer: [
-      "{{ siteName }} *v{{ version }}* @ {{ repository }}",
-      "{{ year }} - Made with ❤️ by **{{ author }}**",
-    ],
-
-    /**
-     * Site wide password protection
-     * If this is set, all files and folders will be protected by this password
-     *
-     * The site password are set from Environment Variable (NEXT_GDRIVE_INDEX_PASSWORD)
-     * It's because I don't want to store sensitive data in the code
-     */
-    privateIndex: ${configuration.site.privateIndex ? "true" : "false"},
-
-    /**
-     * Maximum breadcrumb length
-     * If the breadcrumb is longer than this, it will be shortened
-     */
-    breadcrumbMax: 3,
-
-    /**
-     * Toast notification configuration
-     *
-     * position: Self-explanatory
-     * duration: duration before the toast disappear in milliseconds
-     */
-    toaster: {
-      position: "bottom-right",
-      duration: 3000,
-    },
-
-    /**
-     * This section should have autocomplete for both the object and the icon name
-     * 
-     * Example item:
-     * {
-     *  icon: string, // icon name from lucide icons (https://lucide.dev/icons/)
-     *  name: string,
-     *  href: string,
-     *  external?: boolean
-     * }
-     */
-    navbarItems: [],
-
-    /**
-     * Add support / donation links on the navbar
-     * 
-     * Example item:
-     * {
-     *  name: string,
-     *  currency: string,
-     *  href: string,
-     * }
-     */
-    supports: [],
-  },
-};
-
-export default config;`;
-
-      downloadBlob(new Blob([envContent], { type: "text/plain" }), "env");
-      downloadBlob(
-        new Blob([configContent], { type: "text/typescript" }),
-        "gindex.config.ts",
-      );
-
-      toast.success("Configuration file downloaded!", {
-        id: "download-config",
-      });
-    } catch (error) {
-      const e = error as Error;
-      console.error(e);
-      toast.error(e.message, {
-        id: "download-config",
-      });
-    } finally {
-      setDownloadState("idle");
-    }
-  }
-  function onErrorSet<
-    T extends ConfigurationCategory = ConfigurationCategory,
-    K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
-  >(category: T, key: K, value: string) {
-    setError((prev) => ({
-      ...prev,
-      [category]: {
-        ...prev[category],
-        [key]: value,
-      },
-    }));
-  }
-
-  if (loading)
-    return (
-      <Card>
-        <CardContent className='grid h-[25dvh] w-full place-items-center'>
-          <Icon
-            name='LoaderCircle'
-            className='animate-spin text-primary'
-            size='2rem'
-          />
-        </CardContent>
-      </Card>
-    );
-
-  return (
-    <Card>
-      <CardHeader className='pb-0'>
-        <div className='flex w-full items-end justify-between gap-3'>
-          <CardTitle
-            className='text-3xl'
-            id='config'
-          >
-            App Configuration
-          </CardTitle>
-          <small className='text-muted-foreground'>v{config.version}</small>
-        </div>
-        <Separator />
-      </CardHeader>
-      <CardContent className='space-y-3 py-3'>
-        <Markdown
-          content={`This configuration only covering things you need to get started and basic personalization.
-You can check the configuration file itself to see all the available configuration. _(Each configuration has a description to help you understand it)_
-If you're migrating from previous version, you can load your old environment and config file to update the configuration.
-
-> If you found any bugs or issues, please report it to the [issue tracker](https://github.com/mbahArip/next-gdrive-index/issues)
-> I'll try to fix it as soon as possible`}
-          view='markdown'
-        />
-
-        <EnvironmentConfig
-          state={{ get: configuration, set: onConfigurationChange }}
-          error={{
-            get: error?.environment,
-            set: (key, value) => onErrorSet("environment", key, value),
-          }}
-          onReset={onReset}
-        />
-        <ApiConfig
-          state={{ get: configuration, set: onConfigurationChange }}
-          error={{
-            get: error?.api,
-            set: (key, value) => onErrorSet("api", key, value),
-          }}
-          onReset={onReset}
-        />
-        <SiteConfig
-          state={{ get: configuration, set: onConfigurationChange }}
-          error={{
-            get: error?.site,
-            set: (key, value) => onErrorSet("site", key, value),
-          }}
-          onReset={onReset}
-        />
-
-        <div className='flex w-full items-center justify-end gap-3'>
-          <Button
-            variant={"destructive"}
-            size={"sm"}
-            onClick={(e) => {
-              e.preventDefault();
-              setConfiguration(initialConfiguration);
-              setError({
-                environment: {},
-                api: {},
-                site: {},
-              });
-            }}
-          >
-            Reset All
-          </Button>
-          <Button
-            size={"sm"}
-            disabled={downloadState === "loading"}
-            onClick={onDownload}
-          >
-            <div className='relative flex w-full items-center justify-center'>
-              <span className='relative transition-all duration-300 ease-in-out'>
-                Download Config
-              </span>
-              <Icon
-                name='LoaderCircle'
-                className={cn(
-                  "animate-spin transition-all",
-                  downloadState === "loading"
-                    ? "ml-1.5 size-4 opacity-100"
-                    : "ml-0 size-0 opacity-0",
-                )}
-              />
-            </div>
-          </Button>
-        </div>
-      </CardContent>
-    </Card>
-  );
-}
-
-export function CustomizeTheme() {
-  const [initialTheme] = useState<{
-    light: z.input<typeof Schema_Theme>;
-    dark: z.input<typeof Schema_Theme>;
-  }>({
-    light: {
-      "background": "0 0% 100%",
-      "foreground": "0 0% 3.9%",
-      "card": "0 0% 100%",
-      "card-foreground": "0 0% 3.9%",
-      "popover": "0 0% 100%",
-      "popover-foreground": "0 0% 3.9%",
-      "primary": "0 0% 9%",
-      "primary-foreground": "0 0% 98%",
-      "secondary": "0 0% 96.1%",
-      "secondary-foreground": "0 0% 9%",
-      "muted": "0 0% 96.1%",
-      "muted-foreground": "0 0% 45.1%",
-      "accent": "0 0% 96.1%",
-      "accent-foreground": "0 0% 9%",
-      "destructive": "0 84.2% 60.2%",
-      "destructive-foreground": "0 0% 98%",
-      "border": "0 0% 89.8%",
-      "input": "0 0% 89.8%",
-      "ring": "0 0% 89.8%",
-      "radius": "0.5rem",
-    },
-    dark: {
-      "background": "0 0% 3.9%",
-      "foreground": "0 0% 98%",
-      "card": "0 0% 3.9%",
-      "card-foreground": "0 0% 98%",
-      "popover": "0 0% 3.9%",
-      "popover-foreground": "0 0% 98%",
-      "primary": "0 0% 98%",
-      "primary-foreground": "0 0% 9%",
-      "secondary": "0 0% 14.9%",
-      "secondary-foreground": "0 0% 98%",
-      "muted": "0 0% 14.9%",
-      "muted-foreground": "0 0% 63.9%",
-      "accent": "0 0% 14.9%",
-      "accent-foreground": "0 0% 98%",
-      "destructive": "0 62.8% 30.6%",
-      "destructive-foreground": "0 0% 98%",
-      "border": "0 0% 14.9%",
-      "input": "0 0% 14.9%",
-      "ring": "0 0% 14.9%",
-      "radius": "0.5rem",
-    },
-  });
-  const [currentTheme, setCurrentTheme] = useState<"light" | "dark">("light");
-  const [theme, setTheme] = useState<{
-    light: z.input<typeof Schema_Theme>;
-    dark: z.input<typeof Schema_Theme>;
-  }>(initialTheme);
-
-  const [dialog, setDialog] = useState<boolean>(false);
-  const [cssLoading, setCssLoading] = useState<boolean>(false);
-
-  function onThemeChange(
-    theme: "light" | "dark",
-    key: ThemeKeys,
-    value: string,
-  ) {
-    setTheme((prev) => ({
-      ...prev,
-      [theme]: {
-        ...prev[theme],
-        [key]: value,
-      },
-    }));
-  }
-
-  function onSelectedThemeReset(theme: "light" | "dark", key: ThemeKeys) {
-    setTheme((prev) => ({
-      ...prev,
-      [theme]: {
-        ...prev[theme],
-        [key]: initialTheme[theme][key],
-      },
-    }));
-  }
-  function onThemeReset() {
-    setTheme(initialTheme);
-  }
-  function isChanged(t: "light" | "dark", key: ThemeKeys): boolean {
-    return t === "light"
-      ? theme.light[key] !== initialTheme.light[key]
-      : theme.dark[key] !== initialTheme.dark[key];
-  }
-
-  return (
-    <Card>
-      <CardHeader className='pb-0'>
-        <div className='flex flex-col gap-3 tablet:flex-row tablet:items-center tablet:justify-between'>
-          <CardTitle
-            className='text-3xl'
-            id='theme'
-          >
-            Customize Theme
-          </CardTitle>
-
-          <div className='flex w-full items-center gap-3 tablet:w-fit'>
-            <Button
-              size='sm'
-              variant={"outline"}
-              onClick={(e) => {
-                e.preventDefault();
-
-                try {
-                  const fileInput = document.createElement("input");
-                  fileInput.type = "file";
-                  fileInput.accept = ".css";
-                  fileInput.onchange = async (fileEvent) => {
-                    const file = (fileEvent.target as HTMLInputElement)
-                      .files?.[0];
-                    if (!file) return toast.error("No file selected");
-                    const fileName = file.name;
-                    if (fileName !== "globals.css")
-                      return toast.error("Please select globals.css file");
-
-                    const reader = new FileReader();
-                    reader.onload = async (read) => {
-                      const result = read.target?.result as string;
-                      if (!result) return toast.error("Failed to read file");
-                      const themeRegex =
-                        /\/\* Shadcn\/ui theme \*\/.*?\:root \{(.*?)\}.*?.dark \{(.*?) \}/gm;
-                      const themeMatch = themeRegex.exec(
-                        result.replace(/\r\n/g, ""),
-                      );
-                      if (!themeMatch)
-                        return toast.error(
-                          "Can't find theme, are you sure it's the right file?",
-                        );
-                      const lightTheme = themeMatch[1]
-                        .replace(/\s{2,4}/g, "\n")
-                        .split("\n")
-                        .map((v) => v.trim())
-                        .filter(
-                          (v) =>
-                            v.length &&
-                            (v.startsWith("/*") && v.endsWith("*/")
-                              ? false
-                              : true),
-                        );
-                      const darkTheme = themeMatch[2]
-                        .replace(/\s{2,4}/g, "\n")
-                        .split("\n")
-                        .map((v) => v.trim())
-                        .filter(
-                          (v) =>
-                            v.length &&
-                            (v.startsWith("/*") && v.endsWith("*/")
-                              ? false
-                              : true),
-                        );
-
-                      // Loop through the theme and set it
-                      for (const key in lightTheme) {
-                        const [k, v] = lightTheme[key]
-                          .split(":")
-                          .map((v) => v.replace("--", "").trim());
-                        const hslRegex = /\d\s\d.*?\%\s\d.*?\%;/g;
-                        if (hslRegex.test(v)) {
-                          const color = parseThemeValue(v);
-                          onThemeChange(
-                            "light",
-                            k as ThemeKeys,
-                            `${color.h} ${color.s}% ${color.l}%`,
-                          );
-                        } else {
-                          onThemeChange("light", k as ThemeKeys, v);
-                        }
-                      }
-                      for (const key in darkTheme) {
-                        const [k, v] = darkTheme[key]
-                          .split(":")
-                          .map((v) => v.replace("--", "").trim());
-                        const hslRegex = /\d\s\d.*?\%\s\d.*?\%;/g;
-                        if (hslRegex.test(v)) {
-                          const color = parseThemeValue(v);
-                          onThemeChange(
-                            "dark",
-                            k as ThemeKeys,
-                            `${color.h} ${color.s}% ${color.l}%`,
-                          );
-                        } else {
-                          onThemeChange("dark", k as ThemeKeys, v);
-                        }
-                      }
-
-                      fileInput.value = "";
-                      toast.success("Theme loaded successfully");
-                    };
-                    reader.readAsText(file);
-                  };
-                  fileInput.click();
-                } catch (error) {
-                  const e = error as Error;
-                  console.error(e);
-                  toast.error(e.message);
-                }
-              }}
-            >
-              Load CSS
-            </Button>
-            <Dialog
-              open={dialog}
-              onOpenChange={setDialog}
-            >
-              <DialogTrigger>
-                <Button
-                  size='sm'
-                  variant={"outline"}
-                >
-                  Paste Code
-                </Button>
-              </DialogTrigger>
-              <DialogContent>
-                <DialogHeader>
-                  <DialogTitle>Paste Theme</DialogTitle>
-                  <DialogDescription>
-                    Paste the CSS code from your theme file
-                    <br />
-                    <Link
-                      href={"https://ui.shadcn.com/themes"}
-                      target='_blank'
-                      className='text-blue-600 opacity-80 transition-all duration-300 hover:opacity-100 dark:text-blue-400'
-                    >
-                      Get themes from shadcn/ui
-                    </Link>
-                  </DialogDescription>
-                </DialogHeader>
-                <form
-                  className='space-y-3'
-                  onSubmit={(e) => {
-                    e.preventDefault();
-                    setCssLoading(true);
-
-                    try {
-                      const formData = new FormData(
-                        e.target as HTMLFormElement,
-                      );
-                      const css = formData.get("css-paste") as string;
-                      if (!css) throw new Error("No CSS code provided");
-
-                      const flatten = css.trim().replace(/\n/g, "");
-                      const themeRegex =
-                        /\@layer base.*?\:root \{(.*?)\}.*?.dark \{(.*?) \}/gm;
-                      const themeMatch = themeRegex.exec(
-                        flatten.replace(/\r\n/g, ""),
-                      );
-                      if (!themeMatch)
-                        throw new Error(
-                          "Unknown format, please refer to shadcn/ui theme",
-                        );
-
-                      const lightTheme = themeMatch[1]
-                        .replace(/\s{2,4}/g, "\n")
-                        .split("\n")
-                        .map((v) => v.trim())
-                        .filter(
-                          (v) =>
-                            v.length &&
-                            (v.startsWith("/*") && v.endsWith("*/")
-                              ? false
-                              : true),
-                        );
-                      const darkTheme = themeMatch[2]
-                        .replace(/\s{2,4}/g, "\n")
-                        .split("\n")
-                        .map((v) => v.trim())
-                        .filter(
-                          (v) =>
-                            v.length &&
-                            (v.startsWith("/*") && v.endsWith("*/")
-                              ? false
-                              : true),
-                        );
-
-                      for (const key in lightTheme) {
-                        const [k, v] = lightTheme[key]
-                          .split(":")
-                          .map((v) => v.replace("--", "").trim());
-                        const color = parseThemeValue(v);
-                        const hslRegex = /\d\s\d.*?\%\s\d.*?\%;/g;
-                        if (hslRegex.test(v)) {
-                          const color = parseThemeValue(v);
-                          onThemeChange(
-                            "light",
-                            k as ThemeKeys,
-                            `${color.h} ${color.s}% ${color.l}%`,
-                          );
-                        } else {
-                          onThemeChange("light", k as ThemeKeys, v);
-                        }
-                      }
-                      for (const key in darkTheme) {
-                        const [k, v] = darkTheme[key]
-                          .split(":")
-                          .map((v) => v.replace("--", "").trim());
-                        const color = parseThemeValue(v);
-                        const hslRegex = /\d\s\d.*?\%\s\d.*?\%;/g;
-                        if (hslRegex.test(v)) {
-                          const color = parseThemeValue(v);
-                          onThemeChange(
-                            "dark",
-                            k as ThemeKeys,
-                            `${color.h} ${color.s}% ${color.l}%`,
-                          );
-                        } else {
-                          onThemeChange("dark", k as ThemeKeys, v);
-                        }
-                      }
-
-                      toast.success("Theme loaded successfully");
-                      setDialog(false);
-                    } catch (error) {
-                      const e = error as Error;
-                      console.error(e);
-                      toast.error(e.message);
-                    } finally {
-                      setCssLoading(false);
-                    }
-                  }}
-                >
-                  <Textarea
-                    id='css-paste'
-                    name='css-paste'
-                    className='w-full'
-                    rows={10}
-                    placeholder='Please refer to shadcn/ui theme for the theme code'
-                  />
-                  <DialogFooter>
-                    <DialogClose asChild>
-                      <Button
-                        size={"sm"}
-                        variant={"destructive"}
-                        type='reset'
-                      >
-                        Cancel
-                      </Button>
-                    </DialogClose>
-                    <Button
-                      size={"sm"}
-                      disabled={cssLoading}
-                      type='submit'
-                    >
-                      <div className='relative flex w-full items-center justify-center'>
-                        <span className='relative transition-all duration-300 ease-in-out'>
-                          Load Theme
-                        </span>
-                        <Icon
-                          name='LoaderCircle'
-                          className={cn(
-                            "animate-spin transition-all",
-                            cssLoading
-                              ? "ml-1.5 size-4 opacity-100"
-                              : "ml-0 size-0 opacity-0",
-                          )}
-                        />
-                      </div>
-                    </Button>
-                  </DialogFooter>
-                </form>
-              </DialogContent>
-            </Dialog>
-            <Button
-              size='sm'
-              variant={"destructive"}
-              onClick={onThemeReset}
-            >
-              Reset All
-            </Button>
-          </div>
-        </div>
-        <Separator />
-      </CardHeader>
-      <CardContent>
-        <div className='grid grid-cols-1 gap-6 py-3 tablet:grid-cols-2'>
-          <div className='col-span-full flex w-full items-center'>
-            <Button
-              size='sm'
-              variant={currentTheme === "light" ? "default" : "outline"}
-              onClick={() => setCurrentTheme("light")}
-              className='w-full rounded-r-none'
-            >
-              Light Theme
-            </Button>
-            <Button
-              size='sm'
-              variant={currentTheme === "dark" ? "default" : "outline"}
-              onClick={() => setCurrentTheme("dark")}
-              className='w-full rounded-l-none'
-            >
-              Dark Theme
-            </Button>
-          </div>
-          <div className='flex flex-col gap-3'>
-            <ThemeForm
-              currentTheme={currentTheme}
-              state={{
-                get: theme,
-                set: onThemeChange,
-              }}
-            />
-            <Button
-              size={"sm"}
-              variant={"secondary"}
-              onClick={(e) => {
-                e.preventDefault();
-                const otherTheme = currentTheme === "light" ? "dark" : "light";
-                setTheme((prev) => ({
-                  ...prev,
-                  [otherTheme]: {
-                    ...prev[currentTheme],
-                    radius: "0.5rem",
-                  },
-                }));
-                toast.success(
-                  `${currentTheme
-                    .slice(0, 1)
-                    .toUpperCase()}${currentTheme.slice(
-                    1,
-                  )} theme copied to ${otherTheme} theme`,
-                );
-              }}
-            >
-              Copy to {currentTheme === "light" ? "Dark" : "Light"} Theme
-            </Button>
-          </div>
-
-          <ThemePreview
-            theme={currentTheme === "light" ? theme.light : theme.dark}
-          />
-
-          <Separator className='col-span-full' />
-
-          <div className='col-span-full flex w-full flex-col items-end justify-center gap-1.5'>
-            <div className='flex items-center gap-3'>
-              <Button
-                variant={"outline"}
-                size={"sm"}
-                onClick={async (e) => {
-                  try {
-                    const style = `@layer base {
-  :root {
-  ${Object.entries(theme.light)
-    .map(([key, value]) => `  --${key}: ${value};`.replace(";;", ";"))
-    .join("\n")}
-  }
-
-  .dark {
-  ${Object.entries(theme.dark)
-    .map(([key, value]) => `    --${key}: ${value};`.replace(";;", ";"))
-    .join("\n")}
-  }
-}`;
-
-                    await navigator.clipboard.writeText(style);
-                    toast.success("CSS code copied to clipboard");
-                  } catch (error) {
-                    const e = error as Error;
-                    console.error(e);
-                    toast.error(e.message);
-                  }
-                }}
-              >
-                Copy CSS Code
-              </Button>
-              <Button
-                size={"sm"}
-                onClick={(e) => {
-                  e.preventDefault();
-                  toast.loading("Creating CSS file...", {
-                    id: "download-css",
-                  });
-                  try {
-                    const css = `@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-/* Shadcn/ui theme */
-@layer base {
-  :root {
-  ${Object.entries(theme.light)
-    .map(([key, value]) => `  --${key}: ${value};`.replace(";;", ";"))
-    .join("\n")}
-  }
-
-  .dark {
-  ${Object.entries(theme.dark)
-    .map(([key, value]) => `    --${key}: ${value};`.replace(";;", ";"))
-    .join("\n")}
-  }
-}
-
-html,
-body {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-@layer base {
-  :root {
-    /* @apply text-[14px] tablet:text-[16px]; */
-    @apply text-[100%];
-  }
-  * {
-    @apply border-border;
-    /* @apply outline outline-1 outline-red-500; */
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-
-  ::-webkit-scrollbar {
-    @apply h-1.5 w-1.5;
-  }
-  ::-webkit-scrollbar-track {
-    @apply bg-primary/5;
-  }
-  ::-webkit-scrollbar-thumb {
-    @apply rounded-full bg-primary/25 hover:bg-primary/50;
-  }
-
-  /* Typography */
-  h1 {
-    @apply scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl;
-  }
-  h2 {
-    @apply scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0;
-  }
-  h3 {
-    @apply scroll-m-20 text-2xl font-semibold tracking-tight;
-  }
-  h4 {
-    @apply scroll-m-20 text-xl font-semibold tracking-tight;
-  }
-  .paragraph {
-    @apply leading-7 [&:not(:first-child)]:mt-6;
-  }
-  blockquote {
-    @apply mt-6 border-l-2 pl-6 italic;
-  }
-  ul {
-    @apply my-6 ml-6 list-disc [&>li]:mt-2;
-  }
-  .lead {
-    @apply text-xl text-muted-foreground;
-  }
-  .large {
-    @apply text-lg font-semibold;
-  }
-  .muted {
-    @apply text-sm text-muted-foreground;
-  }
-  small {
-    @apply text-sm font-medium leading-none;
-  }
-}`;
-                    const blob = new Blob([css], { type: "text/css" });
-                    downloadBlob(blob, "globals.css");
-                    toast.success("CSS downloaded successfully", {
-                      id: "download-css",
-                    });
-                  } catch (error) {
-                    const e = error as Error;
-                    console.error(e);
-                    toast.error(e.message, {
-                      id: "download-css",
-                    });
-                  }
-                }}
-              >
-                Download CSS
-              </Button>
-            </div>
-            <span className='text-sm text-muted-foreground'>
-              It is recommended to use &apos;Copy CSS Code&apos; button to copy
-              the CSS code
-            </span>
-          </div>
-        </div>
-      </CardContent>
-    </Card>
-  );
-}
diff --git a/src/app/[...rest]/deploy/index.tsx b/src/app/[...rest]/deploy/index.tsx
index 6f169aa..71bbdbf 100644
--- a/src/app/[...rest]/deploy/index.tsx
+++ b/src/app/[...rest]/deploy/index.tsx
@@ -1,64 +1,30 @@
 "use client";
 
 import { icons } from "lucide-react";
-import { useMemo, useState } from "react";
-import { z } from "zod";
-import { cn } from "~/utils";
+import { useMemo } from "react";
+import { getting_started, migration, new_user, shared_drive } from "~/data/docs";
 
-import Markdown from "~/app/@markdown";
-import Icon from "~/components/Icon";
+import { Icon, Markdown } from "~/components/Global";
+import { ConfigurationForm } from "~/components/Guide/Configuration";
+import { ThemeForm } from "~/components/Guide/Theme";
 import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
-import { Button } from "~/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "~/components/ui/dropdown-menu";
 import { Separator } from "~/components/ui/separator";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "~/components/ui/tabs";
 
-import useMediaQuery from "~/hooks/useMediaQuery";
+import { cn } from "~/utils/cn";
 
-import {
-  Configuration,
-  CustomizeTheme,
-  getting_started,
-  migration_guide,
-  new_user_guide,
-  shared_drive_guide,
-} from "./docs";
-
-// type Section =
-//   | "start"
-//   | "new-user"
-//   | "shared-drive"
-//   | "migrating"
-//   | "config"
-//   | "theme";
-const SchemaSection = z.enum([
-  "start",
-  "new-user",
-  "shared-drive",
-  "migrating",
-  "config",
-  "theme",
-]);
-type Section = z.infer<typeof SchemaSection>;
+const Sections = ["start", "new-user", "shared-drive", "migrating", "config", "theme"] as const;
+type Section = (typeof Sections)[number];
 type SectionItem = {
   id: Section;
   title: string;
   icon: keyof typeof icons;
 };
+
 export default function DeployGuidePage() {
   const sectionMenu = useMemo<SectionItem[]>(
     () => [
-      // {
-      //   id: "start",
-      //   title: "Getting Started",
-      //   icon: "NotebookText",
-      // },
       {
         id: "new-user",
         title: "New User Guide",
@@ -74,95 +40,27 @@ export default function DeployGuidePage() {
         title: "Shared Drive Guide",
         icon: "Database",
       },
-      // {
-      //   id: "config",
-      //   title: "App Configuration",
-      //   icon: "Settings",
-      // },
-      // {
-      //   id: "theme",
-      //   title: "Theme Customization",
-      //   icon: "PaintRoller",
-      // },
     ],
     [],
   );
-  const [sectionOpen, setSectionOpen] = useState<boolean>(false);
-
-  const isDesktop = useMediaQuery("(min-width: 768px)");
 
   return (
-    <div
-      className={cn(
-        "relative mx-auto w-full max-w-screen-desktop",
-        "gap-3 p-3",
-        "flex-grow-0",
-        "flex flex-col",
-      )}
-    >
-      <div className='fixed bottom-6 right-6 z-10'>
-        <Button
-          size='icon'
-          variant='outline'
-          onClick={() => {
-            window.scrollTo({ top: 0, behavior: "smooth" });
-          }}
-        >
+    <div className={cn("relative mx-auto w-full max-w-screen-desktop", "gap-3 p-3", "flex-grow-0", "flex flex-col")}>
+      <Alert className='bg-blue-50 text-blue-600 dark:bg-blue-950/25 dark:text-blue-500'>
+        <div className='flex items-start gap-3'>
           <Icon
-            name='ChevronUp'
-            size='1.25rem'
+            name='Info'
+            className='size-5'
           />
-        </Button>
-      </div>
-      <div
-        id='fab'
-        className={cn("bottom-6 right-6 z-10 hidden")}
-      >
-        <DropdownMenu
-          open={sectionOpen}
-          onOpenChange={setSectionOpen}
-        >
-          <DropdownMenuTrigger asChild>
-            <Button
-              size={"icon"}
-              variant={"outline"}
-            >
-              <Icon
-                name='SquareMenu'
-                size={"1.25rem"}
-              />
-            </Button>
-          </DropdownMenuTrigger>
-          <DropdownMenuContent
-            align='end'
-            side='left'
-          >
-            {sectionMenu.map((item) => (
-              <DropdownMenuItem
-                key={item.id}
-                asChild
-              >
-                <div
-                  // href={`#${item.id}`}
-                  className='flex w-full items-center justify-between gap-6'
-                  onClick={() => {
-                    const target = document.getElementById(item.id);
-                    if (target) {
-                      target.scrollIntoView({ behavior: "smooth" });
-                    }
-                  }}
-                >
-                  {item.title}
-                  <Icon
-                    name={item.icon}
-                    size={"1rem"}
-                  />
-                </div>
-              </DropdownMenuItem>
-            ))}
-          </DropdownMenuContent>
-        </DropdownMenu>
-      </div>
+          <div className='flex flex-col'>
+            <AlertTitle>About this guide</AlertTitle>
+            <AlertDescription>
+              <p className='w-full whitespace-pre-wrap text-pretty'>{`If you can see this guide on your deployment.
+Please set the \`showDeployGuide\` to false on the config files. Since it will take up the \`deploy\` route.`}</p>
+            </AlertDescription>
+          </div>
+        </div>
+      </Alert>
 
       <Card>
         <CardHeader className='pb-0'>
@@ -172,25 +70,8 @@ export default function DeployGuidePage() {
         <CardContent>
           <Markdown
             content={getting_started}
-            view='markdown'
             className='px-0'
           />
-
-          <Alert className='bg-blue-50 text-blue-600 dark:bg-blue-950/25 dark:text-blue-500'>
-            <div className='flex items-start gap-3'>
-              <Icon
-                name='Info'
-                className='size-5'
-              />
-              <div className='flex flex-col'>
-                <AlertTitle>About this guide</AlertTitle>
-                <AlertDescription>
-                  <p className='w-full whitespace-pre-wrap text-pretty'>{`If you're from previous version, your deployment might have this deployment guide.
-You can disable it from the config files, there a new setting called 'showDeployGuide' you need to set to false.`}</p>
-                </AlertDescription>
-              </div>
-            </div>
-          </Alert>
         </CardContent>
       </Card>
 
@@ -207,21 +88,7 @@ You can disable it from the config files, there a new setting called 'showDeploy
             </TabsTrigger>
           ))}
         </TabsList>
-        {/* <TabsContent value='start'>
-          <Card>
-            <CardHeader className='pb-0'>
-              <CardTitle className='text-3xl'>Deployment Guide</CardTitle>
-              <Separator />
-            </CardHeader>
-            <CardContent>
-              <Markdown
-                content={getting_started}
-                view='markdown'
-                className='px-0'
-              />
-            </CardContent>
-          </Card>
-        </TabsContent> */}
+
         <TabsContent value='new-user'>
           <Card>
             <CardHeader className='pb-0'>
@@ -230,8 +97,7 @@ You can disable it from the config files, there a new setting called 'showDeploy
             </CardHeader>
             <CardContent>
               <Markdown
-                content={new_user_guide}
-                view='markdown'
+                content={new_user}
                 className='px-0'
               />
             </CardContent>
@@ -245,7 +111,7 @@ You can disable it from the config files, there a new setting called 'showDeploy
             </CardHeader>
             <CardContent>
               <Markdown
-                content={shared_drive_guide}
+                content={shared_drive}
                 view='markdown'
                 className='px-0'
               />
@@ -260,8 +126,7 @@ You can disable it from the config files, there a new setting called 'showDeploy
             </CardHeader>
             <CardContent>
               <Markdown
-                content={migration_guide}
-                view='markdown'
+                content={migration}
                 className='px-0'
               />
             </CardContent>
@@ -279,9 +144,7 @@ You can disable it from the config files, there a new setting called 'showDeploy
           />
           <div className='flex flex-col'>
             <AlertTitle>Heads up!</AlertTitle>
-            <AlertDescription>
-              The value of the form will be reset when you switch tabs.
-            </AlertDescription>
+            <AlertDescription>The value of the form will be reset when you switch tabs.</AlertDescription>
           </div>
         </div>
       </Alert>
@@ -303,11 +166,12 @@ You can disable it from the config files, there a new setting called 'showDeploy
             Theme Customization
           </TabsTrigger>
         </TabsList>
+
         <TabsContent value='config'>
-          <Configuration />
+          <ConfigurationForm />
         </TabsContent>
         <TabsContent value='theme'>
-          <CustomizeTheme />
+          <ThemeForm />
         </TabsContent>
       </Tabs>
     </div>
diff --git a/src/app/[...rest]/page.tsx b/src/app/[...rest]/page.tsx
index 5cfb7a3..d7417b3 100644
--- a/src/app/[...rest]/page.tsx
+++ b/src/app/[...rest]/page.tsx
@@ -1,35 +1,26 @@
 import { Metadata, ResolvedMetadata } from "next";
 import { notFound } from "next/navigation";
 import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
 
+import { Actions, Explorer, FilePath, Readme } from "~/components/Explorer";
+import { Password } from "~/components/Layout";
+import { PreviewLayout } from "~/components/Preview";
 import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
 import { Separator } from "~/components/ui/separator";
 
-import { decryptData } from "~/utils/encryptionHelper/hash";
+import { cn } from "~/utils/cn";
+import { decryptData } from "~/utils/encryptionHelper";
 import gdrive from "~/utils/gdriveInstance";
 import { getFileType } from "~/utils/previewHelper";
 
-import config from "~/config/gIndex.config";
+import { Schema_File } from "~/types/schema";
+
+import { CheckPassword, CheckPaths, GetBanner, GetFile, GetFiles, GetReadme } from "actions";
+import config from "config";
 
-import FileBrowser from "../@explorer";
-import Header from "../@header";
-import HeaderButton from "../@header.button";
-import Password from "../@password";
-import FilePreviewLayout from "../@preview.layout";
-import Readme from "../@readme";
-import {
-  CheckPassword,
-  CheckPaths,
-  GetBanner,
-  GetFile,
-  GetFiles,
-  GetReadme,
-} from "../actions";
 import DeployGuidePage from "./deploy";
 
-export const revalidate = 300;
+export const revalidate = 60;
 export const dynamic = "force-dynamic";
 
 type Props = {
@@ -38,12 +29,8 @@ type Props = {
   };
 };
 
-export async function generateMetadata(
-  { params: { rest } }: Props,
-  parent: ResolvedMetadata,
-): Promise<Metadata> {
-  if (rest[0] === "deploy" && config.showDeployGuide)
-    return { title: "Deploy Guide" };
+export async function generateMetadata({ params: { rest } }: Props, parent: ResolvedMetadata): Promise<Metadata> {
+  if (rest.length === 1 && rest[0] === "deploy" && config.showDeployGuide) return { title: "Deploy Guide" };
 
   const paths = await CheckPaths(rest);
   if (!paths.success) return { title: "Not Found" };
@@ -56,17 +43,12 @@ export async function generateMetadata(
 
   return {
     title: data.name,
-    description: data.mimeType?.includes("folder")
-      ? `Browse ${data.name} files`
-      : `View ${data.name}`,
+    description: data.mimeType?.includes("folder") ? `Browse ${data.name} files` : `View ${data.name}`,
     openGraph: {
       images: banner
         ? [
             {
               url: `/api/og/${banner}`,
-              // url: `/api/og/${
-              //   data.mimeType.startsWith("image") ? data.encryptedId : banner
-              // }`,
               width: 1200,
               height: 630,
             },
@@ -77,8 +59,7 @@ export async function generateMetadata(
 }
 
 export default async function RestPage({ params: { rest } }: Props) {
-  if (rest[0] === "deploy" && config.showDeployGuide)
-    return <DeployGuidePage />;
+  if (rest.length === 1 && rest[0] === "deploy" && config.showDeployGuide) return <DeployGuidePage />;
 
   const paths = await CheckPaths(rest);
   if (!paths.success) notFound();
@@ -86,11 +67,7 @@ export default async function RestPage({ params: { rest } }: Props) {
 
   if (!unlocked.success) {
     if (!unlocked.path)
-      throw new Error(
-        `No path returned from password checking${
-          unlocked.message && `, ${unlocked.message}`
-        }`,
-      );
+      throw new Error(`No path returned from password checking${unlocked.message && `, ${unlocked.message}`}`);
     return (
       <Password
         path={unlocked.path}
@@ -101,10 +78,10 @@ export default async function RestPage({ params: { rest } }: Props) {
   }
 
   const encryptedId = paths.data.pop()?.id;
-  if (!encryptedId)
-    throw new Error("Failed to get encrypted ID, try to refresh the page.");
+  if (!encryptedId) throw new Error("Failed to get encrypted ID, try to refresh the page.");
 
   const promise = [];
+
   const { data: file } = await gdrive.files.get({
     fileId: await decryptData(encryptedId),
     fields: "mimeType, fileExtension",
@@ -123,35 +100,33 @@ export default async function RestPage({ params: { rest } }: Props) {
     if (file.success) {
       return values as [z.infer<typeof Schema_File>, string];
     } else {
-      return values as [
-        { files: z.infer<typeof Schema_File>[]; nextPageToken?: string },
-        string,
-      ];
+      return values as [{ files: z.infer<typeof Schema_File>[]; nextPageToken?: string }, string];
     }
   });
-  let fileType;
-  if (file.fileExtension && file.mimeType) {
-    fileType = getFileType(file.fileExtension, file.mimeType);
-  }
-  const isFile = !("files" in data);
+  console.log(
+    rest.map((item, index, array) => ({
+      label: decodeURIComponent(item),
+      href: index === array.length - 1 ? undefined : `${item}`,
+    })),
+  );
 
   return (
     <div className={cn("h-fit w-full", "flex flex-col gap-3")}>
-      <Header
-        name='Root'
-        breadcrumb={rest.map((item, index, array) => ({
+      <FilePath
+        data={rest.map((item, index, array) => ({
           label: decodeURIComponent(item),
           href: index === array.length - 1 ? undefined : `${item}`,
         }))}
       />
-      <div
+
+      <section
         slot='content'
         className='w-full'
       >
-        {isFile ? (
-          <FilePreviewLayout
+        {!("files" in data) ? (
+          <PreviewLayout
             data={data}
-            fileType={fileType || "unknown"}
+            fileType={file.fileExtension && file.mimeType ? getFileType(file.fileExtension, file.mimeType) : "unknown"}
           />
         ) : (
           <>
@@ -159,40 +134,28 @@ export default async function RestPage({ params: { rest } }: Props) {
               <CardHeader className='pb-0'>
                 <div className='flex w-full items-center justify-between gap-3'>
                   <CardTitle className='flex-grow'>Browse files</CardTitle>
-                  <HeaderButton />
+                  <Actions />
                 </div>
                 <Separator />
               </CardHeader>
               <CardContent className='p-1.5 pt-0 tablet:p-3 tablet:pt-0'>
-                <FileBrowser
+                <Explorer
+                  encryptedId={encryptedId}
                   files={data.files}
                   nextPageToken={data.nextPageToken}
                 />
               </CardContent>
             </Card>
-            {readme && (
-              <Readme
-                content={readme}
-                title={"README.md"}
-              />
-              // <div
-              //   slot='readme'
-              //   className='w-full'
-              // >
-              //   <Card>
-              //     <CardHeader className='pb-0'>
-              //       <CardTitle>README.md</CardTitle>
-              //       <Separator />
-              //     </CardHeader>
-              //     <CardContent className='p-1.5 pt-0 tablet:p-3 tablet:pt-0'>
-              //       <Markdown content={readme} />
-              //     </CardContent>
-              //   </Card>
-              // </div>
-            )}
           </>
         )}
-      </div>
+      </section>
+
+      {readme && (
+        <Readme
+          content={readme}
+          title={"README.md"}
+        />
+      )}
     </div>
   );
 }
diff --git a/src/app/api/download/[encryptedId]/route.ts b/src/app/api/download/[encryptedId]/route.ts
index 15cb631..39956d5 100644
--- a/src/app/api/download/[encryptedId]/route.ts
+++ b/src/app/api/download/[encryptedId]/route.ts
@@ -1,17 +1,10 @@
 import { NextRequest, NextResponse } from "next/server";
 
-import {
-  CheckDownloadToken,
-  CheckPassword,
-  CheckPaths,
-  CheckSitePassword,
-  RedirectSearchFile,
-} from "~/app/actions";
-
-import { decryptData } from "~/utils/encryptionHelper/hash";
+import { decryptData } from "~/utils/encryptionHelper";
 import { gdriveNoCache as gdrive } from "~/utils/gdriveInstance";
 
-import config from "~/config/gIndex.config";
+import { CheckDownloadToken, CheckPassword, CheckPaths, CheckSitePassword, RedirectSearchFile } from "actions";
+import config from "config";
 
 export const dynamic = "force-dynamic";
 
@@ -33,10 +26,7 @@ export async function GET(
     const tokenValidity = await CheckDownloadToken(token);
     if (!tokenValidity.success) throw new Error(tokenValidity.message);
 
-    if (
-      config.siteConfig.privateIndex &&
-      !config.apiConfig.allowDownloadProtectedFile
-    ) {
+    if (config.siteConfig.privateIndex && !config.apiConfig.allowDownloadProtectedFile) {
       const unlocked = await CheckSitePassword();
       if (!unlocked.success) {
         return new NextResponse(
@@ -65,12 +55,9 @@ If you've already entered the password, please make sure your browser is not blo
       if (!checkPath.success) throw new Error("File not found");
       const unlocked = await CheckPassword(checkPath.data);
       if (!unlocked.success) {
-        if (!unlocked.path)
-          throw new Error("No path returned from password checking");
+        if (!unlocked.path) throw new Error("No path returned from password checking");
 
-        const lockedIndex = checkPath.data.findIndex(
-          (path) => path.id === unlocked.path,
-        );
+        const lockedIndex = checkPath.data.findIndex((path) => path.id === unlocked.path);
         // Get all path until the locked index, then join them
         const path = checkPath.data
           .slice(0, lockedIndex + 1)
@@ -91,13 +78,9 @@ If you've already entered the password, please make sure your browser is not blo
     }
 
     const fileSize = Number(fileMeta.data.size || 0);
-    if (!fileMeta.data.webContentLink)
-      throw new Error("No download link found");
+    if (!fileMeta.data.webContentLink) throw new Error("No download link found");
 
-    if (
-      config.apiConfig.maxFileSize &&
-      fileSize > config.apiConfig.maxFileSize
-    ) {
+    if (config.apiConfig.maxFileSize && fileSize > config.apiConfig.maxFileSize) {
       const contentUrl = new URL(fileMeta.data.webContentLink);
       contentUrl.searchParams.set("confirm", "1");
       return NextResponse.redirect(contentUrl, {
diff --git a/src/app/api/internal/encrypt/route.ts b/src/app/api/internal/encrypt/route.ts
index c62f22e..7fdbe39 100644
--- a/src/app/api/internal/encrypt/route.ts
+++ b/src/app/api/internal/encrypt/route.ts
@@ -1,6 +1,6 @@
 import { NextRequest, NextResponse } from "next/server";
 
-import { encryptData } from "~/utils/encryptionHelper/hash";
+import { encryptData } from "~/utils/encryptionHelper";
 
 export const dynamic = "force-dynamic";
 
@@ -8,11 +8,7 @@ export async function GET(request: NextRequest) {
   try {
     const sp = new URL(request.nextUrl).searchParams;
     const query = sp.get("q");
-    if (!query)
-      return new NextResponse(
-        "Add query parameter 'q' with the value to encrypt",
-        { status: 400 },
-      );
+    if (!query) return new NextResponse("Add query parameter 'q' with the value to encrypt", { status: 400 });
 
     const encrypted = await encryptData(query);
 
diff --git a/src/app/api/og/[encryptedId]/route.ts b/src/app/api/og/[encryptedId]/route.ts
index a569935..61f5ddf 100644
--- a/src/app/api/og/[encryptedId]/route.ts
+++ b/src/app/api/og/[encryptedId]/route.ts
@@ -1,9 +1,9 @@
 import { NextRequest, NextResponse } from "next/server";
 
-import { decryptData } from "~/utils/encryptionHelper/hash";
+import { decryptData } from "~/utils/encryptionHelper";
 import gdrive from "~/utils/gdriveInstance";
 
-import config from "~/config/gIndex.config";
+import config from "config";
 
 type Props = {
   params: {
@@ -11,10 +11,7 @@ type Props = {
   };
 };
 
-export async function GET(
-  request: NextRequest,
-  { params: { encryptedId } }: Props,
-) {
+export async function GET(request: NextRequest, { params: { encryptedId } }: Props) {
   try {
     const decryptedId = await decryptData(encryptedId);
     const { data } = await gdrive.files.get({
diff --git a/src/app/api/raw/[...rest]/route.ts b/src/app/api/raw/[...rest]/route.ts
index 832c865..2481ddb 100644
--- a/src/app/api/raw/[...rest]/route.ts
+++ b/src/app/api/raw/[...rest]/route.ts
@@ -1,16 +1,13 @@
 import { NextRequest, NextResponse } from "next/server";
-import { CheckPassword, CheckPaths, GetFile } from "~/app/actions";
 
-import { decryptData } from "~/utils/encryptionHelper/hash";
+import { decryptData } from "~/utils/encryptionHelper";
 
-import config from "~/config/gIndex.config";
+import { CheckPassword, CheckPaths, GetFile } from "actions";
+import config from "config";
 
 export const dynamic = "force-dynamic";
 
-export async function GET(
-  request: NextRequest,
-  { params: { rest } }: { params: { rest: string[] } },
-) {
+export async function GET(request: NextRequest, { params: { rest } }: { params: { rest: string[] } }) {
   try {
     const sp = new URL(request.nextUrl).searchParams;
     const token = sp.get("token");
@@ -22,31 +19,18 @@ export async function GET(
     if (!config.apiConfig.allowDownloadProtectedFile) {
       const unlocked = await CheckPassword(paths.data);
       if (!unlocked.success)
-        throw new Error(
-          unlocked.path
-            ? unlocked.message
-            : "No path returned from password checking",
-        );
+        throw new Error(unlocked.path ? unlocked.message : "No path returned from password checking");
     }
 
     const encryptedId = paths.data.pop()?.id;
-    if (!encryptedId)
-      throw new Error("Failed to get encrypted ID, try to refresh the page.");
+    if (!encryptedId) throw new Error("Failed to get encrypted ID, try to refresh the page.");
     if (token !== encryptedId) throw new Error("Invalid token");
 
     const data = await GetFile(encryptedId);
-    if (data.mimeType?.includes("folder"))
-      throw new Error("Can't download folder");
-    if (
-      !data.mimeType.includes("video") &&
-      !data.mimeType.includes("image") &&
-      !data.mimeType.includes("audio")
-    )
-      throw new Error(
-        "Raw link only available for video, image, and audio files",
-      );
-    if (!data.encryptedWebContentLink)
-      throw new Error("No download link found");
+    if (data.mimeType?.includes("folder")) throw new Error("Can't download folder");
+    if (!data.mimeType.includes("video") && !data.mimeType.includes("image") && !data.mimeType.includes("audio"))
+      throw new Error("Raw link only available for video, image, and audio files");
+    if (!data.encryptedWebContentLink) throw new Error("No download link found");
 
     const decryptedWebContent = await decryptData(data.encryptedWebContentLink);
     return new NextResponse(null, {
diff --git a/src/app/api/stream/[encryptedId]/helper.ts b/src/app/api/stream/[encryptedId]/helper.ts
deleted file mode 100644
index d12e947..0000000
--- a/src/app/api/stream/[encryptedId]/helper.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { Readable } from "stream";
-
-async function* nodeStreamToIterator(stream: any) {
-  for await (const chunk of stream) {
-    yield chunk;
-  }
-}
-
-function iteratorToStream(iterator: AsyncGenerator<any>) {
-  return new ReadableStream({
-    async pull(controller) {
-      const { done, value } = await iterator.next();
-      if (done) {
-        controller.close();
-      } else {
-        controller.enqueue(value);
-      }
-    },
-  });
-}
-export function streamFile(body: Readable): ReadableStream {
-  const data: ReadableStream = iteratorToStream(nodeStreamToIterator(body));
-  return data;
-}
diff --git a/src/app/api/stream/[encryptedId]/route.ts b/src/app/api/stream/[encryptedId]/route.ts
index e6285fc..46c85e6 100644
--- a/src/app/api/stream/[encryptedId]/route.ts
+++ b/src/app/api/stream/[encryptedId]/route.ts
@@ -1,17 +1,11 @@
 import { NextRequest, NextResponse } from "next/server";
 
-import {
-  CheckDownloadToken,
-  CheckPassword,
-  CheckPaths,
-  RedirectSearchFile,
-} from "~/app/actions";
-
-import { decryptData } from "~/utils/encryptionHelper/hash";
+import { decryptData } from "~/utils/encryptionHelper";
 import { gdriveNoCache as gdrive } from "~/utils/gdriveInstance";
-import isDev from "~/utils/isDev";
+import { isDev } from "~/utils/isDev";
 
-import config from "~/config/gIndex.config";
+import { CheckDownloadToken, CheckPassword, CheckPaths, RedirectSearchFile } from "actions";
+import config from "config";
 
 export const dynamic = "force-dynamic";
 
@@ -57,18 +51,12 @@ export async function GET(
 
     const [filePaths, fileMeta] = await Promise.all([_filePaths, _fileMeta]);
 
-    const isFull =
-      Number(request.headers.get("Range")?.split("-")[1] || 0) ===
-      Number(fileMeta.data.size || "1") - 1;
+    const isFull = Number(request.headers.get("Range")?.split("-")[1] || 0) === Number(fileMeta.data.size || "1") - 1;
 
     const fileSize = Number(fileMeta.data.size || 0);
-    if (!fileMeta.data.webContentLink)
-      throw new Error("No download link found");
+    if (!fileMeta.data.webContentLink) throw new Error("No download link found");
 
-    if (
-      config.apiConfig.streamMaxSize &&
-      fileSize > config.apiConfig.streamMaxSize
-    ) {
+    if (config.apiConfig.streamMaxSize && fileSize > config.apiConfig.streamMaxSize) {
       throw new Error("File is too large to stream");
     }
 
@@ -77,12 +65,9 @@ export async function GET(
       if (!checkPath.success) throw new Error("File not found");
       const unlocked = await CheckPassword(checkPath.data);
       if (!unlocked.success) {
-        if (!unlocked.path)
-          throw new Error("No path returned from password checking");
+        if (!unlocked.path) throw new Error("No path returned from password checking");
 
-        const lockedIndex = checkPath.data.findIndex(
-          (path) => path.id === unlocked.path,
-        );
+        const lockedIndex = checkPath.data.findIndex((path) => path.id === unlocked.path);
         // Get all path until the locked index, then join them
         const path = checkPath.data
           .slice(0, lockedIndex + 1)
diff --git a/src/app/api/thumb/[encryptedId]/route.ts b/src/app/api/thumb/[encryptedId]/route.ts
index eb7f431..0255c3d 100644
--- a/src/app/api/thumb/[encryptedId]/route.ts
+++ b/src/app/api/thumb/[encryptedId]/route.ts
@@ -1,10 +1,10 @@
 import { NextRequest, NextResponse } from "next/server";
 import { z } from "zod";
 
-import { decryptData } from "~/utils/encryptionHelper/hash";
-import isDev from "~/utils/isDev";
+import { decryptData } from "~/utils/encryptionHelper";
+import { isDev } from "~/utils/isDev";
 
-import config from "~/config/gIndex.config";
+import config from "config";
 
 type Props = {
   params: {
@@ -12,10 +12,7 @@ type Props = {
   };
 };
 
-export async function GET(
-  request: NextRequest,
-  { params: { encryptedId } }: Props,
-) {
+export async function GET(request: NextRequest, { params: { encryptedId } }: Props) {
   try {
     const searchParams = new URL(request.nextUrl).searchParams;
     const size = searchParams.get("size") || "512";
@@ -30,12 +27,9 @@ export async function GET(
       throw new Error("Invalid size");
     }
 
-    const defaultImage = NextResponse.redirect(
-      new URL("/og.png", config.basePath),
-      {
-        status: 302,
-      },
-    );
+    const defaultImage = NextResponse.redirect(new URL("/og.png", config.basePath), {
+      status: 302,
+    });
     const decryptedId = await decryptData(encryptedId);
 
     const url = `https://drive.google.com/thumbnail?id=${decryptedId}&sz=w${size}`;
diff --git a/src/app/error.tsx b/src/app/error.tsx
index f35a1dc..8ba565e 100644
--- a/src/app/error.tsx
+++ b/src/app/error.tsx
@@ -2,42 +2,28 @@
 
 import { useRouter } from "next/navigation";
 import { useEffect } from "react";
-import { cn } from "~/utils";
 
-import Icon from "~/components/Icon";
+import { Icon } from "~/components/Global";
 import { Button } from "~/components/ui/button";
 
-export default function Error({
-  error,
-  reset,
-}: {
-  error: Error & { digest?: string };
-  reset: () => void;
-}) {
+import { cn } from "~/utils/cn";
+
+export default function Error({ error, reset }: { error: Error & { digest?: string }; reset: () => void }) {
   const router = useRouter();
   useEffect(() => {
     console.error(error);
   }, [error]);
 
   return (
-    <div
-      className={cn(
-        "mx-auto h-full w-full max-w-md",
-        "flex flex-grow flex-col items-center justify-center gap-3",
-      )}
-    >
+    <div className={cn("mx-auto h-full w-full max-w-md", "flex flex-grow flex-col items-center justify-center gap-3")}>
       <Icon
         name='CircleX'
-        size={32}
+        size={"2rem"}
         className='text-destructive'
       />
       <div className='flex flex-col'>
-        <span className='text-center text-destructive'>
-          Something went wrong
-        </span>
-        <span className='text-center text-sm text-destructive'>
-          More details can be found in the console
-        </span>
+        <span className='text-center text-destructive'>Something went wrong</span>
+        <span className='text-center text-sm text-destructive'>More details can be found in the console</span>
       </div>
       <code className='w-full whitespace-pre-wrap rounded-[var(--radius)] bg-muted px-3 py-1.5 text-sm text-muted-foreground'>
         {error.message}
diff --git a/src/app/globals.css b/src/app/globals.css
index e73ec9b..75f52f7 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -1,3 +1,4 @@
+/* Version: ${pkg.version} */
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
@@ -50,6 +51,10 @@
     --ring: 0 0% 14.9%;
     /* --ring: 0 0% 83.1%; */
   }
+
+  div.preview * {
+    @apply !transition-none;
+  }
 }
 
 html,
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index b99a5b5..deebe88 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,19 +1,18 @@
 import { Metadata } from "next";
 import { JetBrains_Mono, Outfit, Source_Sans_3 } from "next/font/google";
 import "plyr-react/plyr.css";
-import { cn } from "~/utils";
 
+import { Footer, Navbar, Password, ThemeProvider } from "~/components/Layout";
+import ToTop from "~/components/Layout/ToTop";
+
+import { cn } from "~/utils/cn";
 import { formatFooter } from "~/utils/footerFormatter";
 
-import config from "~/config/gIndex.config";
+import { CheckSitePassword } from "actions";
+import config from "config";
 
-import Footer from "./@footer";
-import Navbar from "./@navbar";
-import Password from "./@password";
-import { CheckSitePassword } from "./actions";
 import "./globals.css";
 import "./markdown.css";
-import ThemeProvider from "./theme-provider";
 
 const sourceSans3 = Source_Sans_3({
   weight: ["300", "400", "600", "700"],
@@ -41,11 +40,7 @@ export const metadata: Metadata = {
   metadataBase: new URL(config.basePath),
   title: {
     default: config.siteConfig.siteName,
-    template:
-      config.siteConfig.siteNameTemplate?.replace(
-        "%t",
-        config.siteConfig.siteName,
-      ) || "%s",
+    template: config.siteConfig.siteNameTemplate?.replace("%t", config.siteConfig.siteName) || "%s",
   },
   description: config.siteConfig.siteDescription,
   authors: config.siteConfig.siteAuthor
@@ -78,10 +73,14 @@ export const metadata: Metadata = {
   robots: config.siteConfig.robots,
 };
 
-export default async function RootLayout({
-  children,
-}: Readonly<{ children: React.ReactNode }>) {
-  const unlocked = await CheckSitePassword();
+export default async function RootLayout({ children }: Readonly<{ children: React.ReactNode }>) {
+  let unlocked: Awaited<ReturnType<typeof CheckSitePassword>> = {
+    success: true,
+    message: "",
+  };
+  if (config.siteConfig.privateIndex) {
+    unlocked = await CheckSitePassword();
+  }
 
   return (
     <html lang='en'>
@@ -118,9 +117,8 @@ export default async function RootLayout({
               <>{children}</>
             )}
           </main>
-          {config.siteConfig.footer && (
-            <Footer content={formatFooter(config.siteConfig.footer)} />
-          )}
+          {config.siteConfig.footer && <Footer content={formatFooter(config.siteConfig.footer)} />}
+          <ToTop />
         </ThemeProvider>
       </body>
     </html>
diff --git a/src/app/loading.tsx b/src/app/loading.tsx
index 8d188e2..6ad92af 100644
--- a/src/app/loading.tsx
+++ b/src/app/loading.tsx
@@ -1,23 +1,7 @@
 "use client";
 
-import { cn } from "~/utils";
-
-import Icon from "~/components/Icon";
+import { Loader } from "~/components/Global";
 
 export default function RootLoading() {
-  return (
-    <div
-      className={cn(
-        "h-auto min-h-[50dvh] w-full",
-        "flex flex-grow flex-col items-center justify-center gap-3",
-      )}
-    >
-      <Icon
-        name='LoaderCircle'
-        size={32}
-        className='animate-spin text-foreground'
-      />
-      <p>Loading data...</p>
-    </div>
-  );
+  return <Loader message='Loading data...' />;
 }
diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx
index e0d9141..5ccb054 100644
--- a/src/app/not-found.tsx
+++ b/src/app/not-found.tsx
@@ -1,5 +1,5 @@
-import NotFoundComponent from "./@not-found";
+import { NotFound } from "~/components/Layout";
 
-export default function NotFound() {
-  return <NotFoundComponent />;
+export default function NotFoundPage() {
+  return <NotFound />;
 }
diff --git a/src/app/page.tsx b/src/app/page.tsx
index b290e1b..fef2ea6 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,27 +1,23 @@
-import { cn } from "~/utils";
-
+import { Actions, Explorer, FilePath, Readme } from "~/components/Explorer";
 import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
 import { Separator } from "~/components/ui/separator";
 
-import FileBrowser from "./@explorer";
-import Header from "./@header";
-import HeaderButton from "./@header.button";
-import Readme from "./@readme";
-import { GetFiles, GetReadme } from "./actions";
+import { cn } from "~/utils/cn";
 
-export const revalidate = 300;
-export const dynamic = "force-dynamic";
+import { GetFiles, GetReadme } from "actions";
+import config from "config";
+
+export const revalidate = 60;
+// export const dynamic = "force-dynamic";
 
 export default async function RootPage() {
-  const [data, readme] = await Promise.all([
-    GetFiles({}),
-    GetReadme(undefined),
-  ]);
+  const [data, readme] = await Promise.all([GetFiles({}), GetReadme(undefined)]);
 
   return (
     <div className={cn("h-fit w-full", "flex flex-col gap-3")}>
-      <Header name='Root' />
-      <div
+      <FilePath data={[]} />
+
+      <section
         slot='content'
         className='w-full'
       >
@@ -29,38 +25,26 @@ export default async function RootPage() {
           <CardHeader className='pb-0'>
             <div className='flex w-full items-center justify-between gap-3'>
               <CardTitle className='flex-grow'>Browse files</CardTitle>
-              <HeaderButton />
+              <Actions />
             </div>
             <Separator />
           </CardHeader>
           <CardContent className='p-1.5 pt-0 tablet:p-3 tablet:pt-0'>
-            <FileBrowser
+            <Explorer
+              encryptedId={config.apiConfig.rootFolder}
               files={data.files}
               nextPageToken={data.nextPageToken}
               root
             />
           </CardContent>
         </Card>
-      </div>
+      </section>
+
       {readme && (
         <Readme
           content={readme}
           title={"README.md"}
         />
-        // <div
-        //   slot='readme'
-        //   className='w-full'
-        // >
-        //   <Card>
-        //     <CardHeader className='pb-0'>
-        //       <CardTitle>README.md</CardTitle>
-        //       <Separator />
-        //     </CardHeader>
-        //     <CardContent className='p-1.5 pt-0 tablet:p-3 tablet:pt-0'>
-        //       <Markdown content={readme} />
-        //     </CardContent>
-        //   </Card>
-        // </div>
       )}
     </div>
   );
diff --git a/src/app/@header.button.tsx b/src/components/Explorer/Actions.tsx
similarity index 56%
rename from src/app/@header.button.tsx
rename to src/components/Explorer/Actions.tsx
index 680dfc3..4c9c950 100644
--- a/src/app/@header.button.tsx
+++ b/src/components/Explorer/Actions.tsx
@@ -1,12 +1,11 @@
 "use client";
 
-import { PropsWithChildren, useContext, useEffect, useState } from "react";
+import { useContext, useEffect, useState } from "react";
 import toast from "react-hot-toast";
 import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
 
-import Icon from "~/components/Icon";
+import { Icon, Loader, Status } from "~/components/Global";
+import { ResponsiveDropdown } from "~/components/Layout";
 import { Button } from "~/components/ui/button";
 import {
   Dialog,
@@ -22,52 +21,43 @@ import {
   DrawerClose,
   DrawerContent,
   DrawerDescription,
-  DrawerFooter,
   DrawerHeader,
   DrawerTitle,
   DrawerTrigger,
 } from "~/components/ui/drawer";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "~/components/ui/dropdown-menu";
 import { Input } from "~/components/ui/input";
 import { Separator } from "~/components/ui/separator";
 import { Skeleton } from "~/components/ui/skeleton";
 
-import { LayoutContext } from "~/context/layoutContext";
-import useMediaQuery from "~/hooks/useMediaQuery";
-import useRouter from "~/hooks/usePRouter";
-import bytesToReadable from "~/utils/bytesFormat";
+import { bytesToReadable } from "~/utils/bytesFormat";
+import { cn } from "~/utils/cn";
 import { getPreviewIcon } from "~/utils/previewHelper";
 
-import { RedirectSearchFile, SearchFile } from "./actions";
+import { LayoutContext } from "~/context/layoutContext";
+import useLoading from "~/hooks/useLoading";
+import useMediaQuery from "~/hooks/useMediaQuery";
+import useRouter from "~/hooks/usePRouter";
 
-export default function HeaderButton({ children }: PropsWithChildren) {
+import { Schema_File } from "~/types/schema";
+
+import { RedirectSearchFile, SearchFile } from "actions";
+
+export default function Actions() {
+  const loading = useLoading();
   const { layout, setLayout } = useContext(LayoutContext);
 
   const [layoutOpen, setLayoutOpen] = useState<boolean>(false);
-
-  const [loading, setLoading] = useState<boolean>(true);
   const [snap, setSnap] = useState<number | string | null>(0.3);
   const [searchOpen, setSearchOpen] = useState<boolean>(false);
   const [searchInput, setSearchInput] = useState<string>("");
   const [debouncedSearchInput, setDebouncedSearchInput] = useState<string>("");
   const [searchLoading, setSearchLoading] = useState<boolean>(false);
   const [searchError, setSearchError] = useState<string>("");
-  const [searchResults, setSearchResults] = useState<
-    z.infer<typeof Schema_File>[]
-  >([]);
+  const [searchResults, setSearchResults] = useState<z.infer<typeof Schema_File>[]>([]);
   const [nextPageToken, setNextPageToken] = useState<string>();
 
   const isDesktop = useMediaQuery("(min-width: 768px)");
 
-  useEffect(() => {
-    setLoading(false);
-  }, []);
-
   useEffect(() => {
     if (!searchInput) {
       setSearchLoading(true);
@@ -106,148 +96,110 @@ export default function HeaderButton({ children }: PropsWithChildren) {
     }
   };
 
-  if (loading) {
-    return (
-      <div className={cn("w-fit", "flex items-center justify-end gap-1.5")}>
-        <Skeleton className='my-0.5 h-8 w-16 mobile:w-24' />{" "}
-        <Skeleton className='my-0.5 h-8 w-8' />
-      </div>
-    );
-  }
+  if (loading)
+    <div className={cn("w-fit", "flex items-center justify-end gap-1.5")}>
+      <Skeleton className='my-0.5 h-8 w-16 mobile:w-24' /> <Skeleton className='my-0.5 h-8 w-8' />
+    </div>;
 
   return (
     <div
-      className={cn(
-        // "mx-auto max-w-screen-desktop flex-grow",
-        "w-fit",
-        "flex items-center justify-end gap-1.5",
-      )}
+      slot='actions'
+      className={cn("w-fit", "flex items-center justify-end gap-1.5")}
     >
-      {isDesktop ? (
-        <DropdownMenu
-          open={layoutOpen}
-          onOpenChange={setLayoutOpen}
-        >
-          <DropdownMenuTrigger asChild>
-            <Button
-              variant={"outline"}
-              className='flex w-24 items-center justify-between gap-1.5'
-            >
-              <div className='flex items-center gap-1.5'>
-                <Icon
-                  name={layout === "grid" ? "LayoutGrid" : "LayoutList"}
-                  size={16}
-                />
-                <span>{layout === "grid" ? "Grid" : "List"}</span>
-              </div>
+      <ResponsiveDropdown
+        open={layoutOpen}
+        onOpenChange={setLayoutOpen}
+        trigger={
+          <Button
+            variant={"outline"}
+            className='flex w-24 items-center justify-between gap-1.5'
+          >
+            <div className='flex items-center gap-1.5'>
+              <Icon
+                name={layout === "grid" ? "LayoutGrid" : "LayoutList"}
+                size={"1rem"}
+              />
+              <span>{layout === "grid" ? "Grid" : "List"}</span>
+            </div>
+            {isDesktop && (
               <Icon
                 name='ChevronDown'
                 className={cn("transition", layoutOpen && "rotate-180")}
-                size={14}
+                size={"0.875rem"}
               />
-            </Button>
-          </DropdownMenuTrigger>
-          <DropdownMenuContent align='end'>
-            <DropdownMenuItem
-              className={cn(
-                "gap-1.5",
-                layout === "grid" && "bg-primary text-primary-foreground",
-              )}
-              onClick={() => setLayout("grid")}
-            >
-              <Icon
-                name={layout === "grid" ? "Check" : "LayoutGrid"}
-                size={16}
-              />
-              <span>Grid</span>
-            </DropdownMenuItem>
-            <DropdownMenuItem
-              className={cn(
-                "gap-1.5",
-                layout === "list" && "bg-primary text-primary-foreground",
-              )}
-              onClick={() => setLayout("list")}
-            >
-              <Icon
-                name={layout === "list" ? "Check" : "LayoutList"}
-                size={16}
-              />
-              <span>List</span>
-            </DropdownMenuItem>
-          </DropdownMenuContent>
-        </DropdownMenu>
-      ) : (
-        <Drawer
-          open={layoutOpen}
-          onOpenChange={setLayoutOpen}
-          shouldScaleBackground
-        >
-          <DrawerTrigger asChild>
-            <Button
-              size={"icon"}
-              variant={"outline"}
-            >
-              <Icon
-                name={layout === "grid" ? "LayoutGrid" : "LayoutList"}
-                size={16}
-              />
-            </Button>
-          </DrawerTrigger>
-          <DrawerContent>
-            <DrawerHeader className='text-start'>
-              <DrawerTitle>Layout</DrawerTitle>
-              <DrawerDescription>
-                Choose a layout for the files explorer
-              </DrawerDescription>
-            </DrawerHeader>
-            <div className='flex h-full flex-col gap-3 px-4'>
+            )}
+          </Button>
+        }
+        mobile={{
+          title: "File Layout",
+          description: "Choose a layout for the files explorer",
+          content: (
+            <>
               <DrawerClose asChild>
                 <Button
-                  variant={"ghost"}
-                  className={cn(
-                    "justify-start gap-3",
-                    layout === "grid" && "bg-primary text-primary-foreground",
-                  )}
+                  variant={layout === "grid" ? "default" : "outline"}
                   onClick={() => {
                     setLayout("grid");
                     setLayoutOpen(false);
                   }}
+                  className='justify-start gap-3'
                 >
                   <Icon
                     name={layout === "grid" ? "Check" : "LayoutGrid"}
-                    size={16}
+                    size={"1rem"}
                   />
                   <span>Grid</span>
                 </Button>
               </DrawerClose>
               <DrawerClose asChild>
                 <Button
-                  variant={"ghost"}
-                  className={cn(
-                    "justify-start gap-3",
-                    layout === "list" && "bg-primary text-primary-foreground",
-                  )}
+                  variant={layout === "list" ? "default" : "outline"}
                   onClick={() => {
                     setLayout("list");
                     setLayoutOpen(false);
                   }}
+                  className='justify-start gap-3'
                 >
                   <Icon
                     name={layout === "list" ? "Check" : "LayoutList"}
-                    size={16}
+                    size={"1rem"}
                   />
                   <span>List</span>
                 </Button>
               </DrawerClose>
-            </div>
-            <DrawerFooter>
-              <DrawerClose asChild>
-                <Button variant={"secondary"}>Close</Button>
-              </DrawerClose>
-            </DrawerFooter>
-          </DrawerContent>
-        </Drawer>
-      )}
+            </>
+          ),
+          closeOnFooter: true,
+        }}
+        desktop={{
+          align: "end",
+          items: [
+            {
+              type: "item",
+              key: "grid",
+              icon: "LayoutGrid",
+              title: "Grid",
+              onClick: () => {
+                setLayout("grid");
+                setLayoutOpen(false);
+              },
+              className: cn(layout === "grid" && "bg-primary text-primary-foreground"),
+            },
+            {
+              type: "item",
+              key: "list",
+              icon: "LayoutList",
+              title: "List",
+              onClick: () => {
+                setLayout("list");
+                setLayoutOpen(false);
+              },
+              className: cn(layout === "list" && "bg-primary text-primary-foreground"),
+            },
+          ],
+        }}
+      />
+
       {isDesktop ? (
         <Dialog
           open={searchOpen}
@@ -267,16 +219,14 @@ export default function HeaderButton({ children }: PropsWithChildren) {
             >
               <Icon
                 name='Search'
-                size={16}
+                size={"1rem"}
               />
             </Button>
           </DialogTrigger>
           <DialogContent>
             <DialogHeader>
               <DialogTitle>Search</DialogTitle>
-              <DialogDescription>
-                Search for files in your drive
-              </DialogDescription>
+              <DialogDescription>Search for files in your drive</DialogDescription>
             </DialogHeader>
             <div className='flex h-full flex-col gap-6'>
               <div
@@ -310,52 +260,26 @@ export default function HeaderButton({ children }: PropsWithChildren) {
               <Separator />
               <div
                 slot='search-result'
-                className='flex h-full max-h-96 flex-grow flex-col gap-1.5 overflow-y-auto'
+                className='flex h-full max-h-[66dvh] flex-grow flex-col gap-1.5 overflow-y-auto'
               >
                 {!debouncedSearchInput ? (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='Search'
-                      size={24}
-                      className='text-muted-foreground'
-                    />
-                    <span className='text-center text-muted-foreground'>
-                      Start typing to search
-                    </span>
-                  </div>
+                  <Status
+                    icon='Search'
+                    message='Start typing to search'
+                  />
                 ) : searchLoading ? (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='LoaderCircle'
-                      size={24}
-                      className='animate-spin text-muted-foreground'
-                    />
-                    <span className='text-center text-muted-foreground'>
-                      Searching...
-                    </span>
-                  </div>
+                  <Loader message='Searching...' />
                 ) : searchError ? (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='CircleX'
-                      size={24}
-                      className='text-destructive'
-                    />
-                    <span className='text-center text-destructive'>
-                      {searchError}
-                    </span>
-                  </div>
+                  <Status
+                    icon='CircleX'
+                    message={searchError}
+                    destructive
+                  />
                 ) : !searchResults.length ? (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='Frown'
-                      size={24}
-                      className='text-muted-foreground'
-                    />
-                    <span className='text-center text-muted-foreground'>
-                      We couldn&apos;t find any results
-                    </span>
-                  </div>
+                  <Status
+                    icon='Frown'
+                    message="We couldn't find any results"
+                  />
                 ) : (
                   <div className='flex w-full flex-col gap-1.5'>
                     {searchResults.map((result) => (
@@ -394,17 +318,17 @@ export default function HeaderButton({ children }: PropsWithChildren) {
             >
               <Icon
                 name='Search'
-                size={16}
+                size={"1rem"}
               />
             </Button>
           </DrawerTrigger>
+
           <DrawerContent className='h-full max-h-[95%]'>
             <DrawerHeader className='text-start'>
               <DrawerTitle>Search</DrawerTitle>
-              <DrawerDescription>
-                Search for files in your drive
-              </DrawerDescription>
+              <DrawerDescription>Search for files in your drive</DrawerDescription>
             </DrawerHeader>
+
             <div className='flex h-full flex-col gap-6'>
               <div
                 slot='search-input'
@@ -434,55 +358,31 @@ export default function HeaderButton({ children }: PropsWithChildren) {
                   </Button>
                 </DrawerClose>
               </div>
+
               <Separator />
+
               <div
                 slot='search-result'
                 className='flex h-fit flex-grow flex-col gap-1.5 overflow-y-auto px-4'
               >
                 {!debouncedSearchInput ? (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='Search'
-                      size={32}
-                      className='text-muted-foreground'
-                    />
-                    <span className='text-center text-muted-foreground'>
-                      Start typing to search
-                    </span>
-                  </div>
+                  <Status
+                    icon='Search'
+                    message='Start typing to search'
+                  />
                 ) : searchLoading ? (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='LoaderCircle'
-                      size={32}
-                      className='animate-spin text-muted-foreground'
-                    />
-                    <span className='text-center text-muted-foreground'>
-                      Searching...
-                    </span>
-                  </div>
+                  <Loader message='Searching...' />
                 ) : searchError ? (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='CircleX'
-                      size={32}
-                      className='text-destructive'
-                    />
-                    <span className='text-center text-destructive'>
-                      {searchError}
-                    </span>
-                  </div>
+                  <Status
+                    icon='CircleX'
+                    message={searchError}
+                    destructive
+                  />
                 ) : !searchResults.length ? (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='Frown'
-                      size={32}
-                      className='text-muted-foreground'
-                    />
-                    <span className='text-center text-muted-foreground'>
-                      We couldn&apos;t find any results
-                    </span>
-                  </div>
+                  <Status
+                    icon='Frown'
+                    message="We couldn't find any results"
+                  />
                 ) : (
                   <div className='flex w-full flex-col gap-1.5'>
                     {searchResults.map((result) => (
@@ -503,15 +403,13 @@ export default function HeaderButton({ children }: PropsWithChildren) {
 }
 
 function SearchResultItem({ data }: { data: z.infer<typeof Schema_File> }) {
-  const [thumbnailURL, setThumbnailURL] = useState<string>(
-    `/api/thumb/${data.encryptedId}?size=2`,
-  );
+  const [thumbnailURL, setThumbnailURL] = useState<string>(`/api/thumb/${data.encryptedId}?size=2`);
   const router = useRouter();
+
   return (
     <div
       className={cn(
         "relative",
-        // "w-full",
         "px-1.5 py-1 pr-10", // since action button is size-8
         "rounded-[var(--radius)]",
         "flex flex-grow items-center justify-between gap-3",
@@ -540,9 +438,7 @@ function SearchResultItem({ data }: { data: z.infer<typeof Schema_File> }) {
       <div className={cn("flex-shrink flex-grow", "flex items-center gap-3")}>
         {/* If it's media, show thumbnail */}
         <div className='relative flex-shrink-0 rounded-[var(--radius)] bg-muted/25'>
-          {data.thumbnailLink &&
-          (data.mimeType.startsWith("video") ||
-            data.mimeType.startsWith("image")) ? (
+          {data.thumbnailLink && (data.mimeType.startsWith("video") || data.mimeType.startsWith("image")) ? (
             <>
               <img
                 src={thumbnailURL}
@@ -560,7 +456,7 @@ function SearchResultItem({ data }: { data: z.infer<typeof Schema_File> }) {
                   <Icon
                     name='Play'
                     className='absolute left-1/2 top-1/2 z-10 -translate-x-1/2 -translate-y-1/2 rounded-full bg-muted-foreground fill-muted p-1.5 text-muted opacity-75'
-                    size={24}
+                    size={"1.5rem"}
                   />
                 </>
               )}
@@ -568,9 +464,7 @@ function SearchResultItem({ data }: { data: z.infer<typeof Schema_File> }) {
           ) : (
             <Icon
               name={
-                data.mimeType.includes("folder")
-                  ? "Folder"
-                  : getPreviewIcon(data.fileExtension || "", data.mimeType)
+                data.mimeType.includes("folder") ? "Folder" : getPreviewIcon(data.fileExtension || "", data.mimeType)
               }
               className='size-16 flex-shrink-0 flex-grow-0 p-3 tablet:size-20'
             />
@@ -580,9 +474,7 @@ function SearchResultItem({ data }: { data: z.infer<typeof Schema_File> }) {
         {/* File data */}
         <div className='flex w-full flex-col'>
           <span className='line-clamp-1 whitespace-pre-wrap break-all'>
-            {data.fileExtension
-              ? data.name.replace(new RegExp(`.${data.fileExtension}$`), "")
-              : data.name}
+            {data.fileExtension ? data.name.replace(new RegExp(`.${data.fileExtension}$`), "") : data.name}
           </span>
           <div className='muted flex items-center gap-1'>
             <span className='line-clamp-1 whitespace-pre-wrap break-all text-sm'>
@@ -594,16 +486,12 @@ function SearchResultItem({ data }: { data: z.infer<typeof Schema_File> }) {
                   name='Slash'
                   size={"0.875rem"}
                 />
-                <span className='whitespace-nowrap text-sm'>
-                  {bytesToReadable(data.size || 0)}
-                </span>
+                <span className='whitespace-nowrap text-sm'>{bytesToReadable(data.size || 0)}</span>
               </>
             )}
           </div>
           <div className='muted flex items-center gap-1'>
-            <span className='whitespace-nowrap text-sm'>
-              {new Date(data.modifiedTime).toLocaleDateString()}
-            </span>
+            <span className='whitespace-nowrap text-sm'>{new Date(data.modifiedTime).toLocaleDateString()}</span>
           </div>
         </div>
       </div>
diff --git a/src/components/Explorer/FilePath.tsx b/src/components/Explorer/FilePath.tsx
new file mode 100644
index 0000000..4390830
--- /dev/null
+++ b/src/components/Explorer/FilePath.tsx
@@ -0,0 +1,156 @@
+"use client";
+
+import Link from "next/link";
+import { Fragment, useState } from "react";
+import { z } from "zod";
+
+import { Icon } from "~/components/Global";
+import { ResponsiveDropdown } from "~/components/Layout";
+import {
+  Breadcrumb,
+  BreadcrumbEllipsis,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbList,
+  BreadcrumbPage,
+  BreadcrumbSeparator,
+} from "~/components/ui/breadcrumb";
+import { Button } from "~/components/ui/button";
+import { Skeleton } from "~/components/ui/skeleton";
+
+import useLoading from "~/hooks/useLoading";
+import useRouter from "~/hooks/usePRouter";
+
+import { Schema_Breadcrumb } from "~/types/schema";
+
+import config from "config";
+
+type Props = {
+  data: z.infer<typeof Schema_Breadcrumb>[];
+};
+export default function FilePath({ data }: Props) {
+  const loading = useLoading();
+  const router = useRouter();
+
+  const [open, setOpen] = useState<boolean>(false);
+
+  if (loading) return <Skeleton className='my-2 h-5 w-1/2' />;
+
+  return (
+    <section
+      slot='file-path'
+      className='flex w-full flex-nowrap items-center'
+    >
+      <Breadcrumb>
+        <BreadcrumbList>
+          {/* Root */}
+          <BreadcrumbItem>
+            <BreadcrumbLink asChild>
+              <Link href={"/"}>
+                <div className='flex items-center gap-1'>
+                  <Icon
+                    name='FolderRoot'
+                    size={"1rem"}
+                  />
+                  ~
+                </div>
+              </Link>
+            </BreadcrumbLink>
+          </BreadcrumbItem>
+
+          {!!data.length ? (
+            <>
+              <BreadcrumbSeparator />
+
+              {data.length >= config.siteConfig.breadcrumbMax && (
+                <>
+                  <ResponsiveDropdown
+                    open={open}
+                    onOpenChange={setOpen}
+                    trigger={
+                      <div>
+                        <BreadcrumbLink asChild>
+                          <BreadcrumbEllipsis className='w-4 cursor-pointer' />
+                        </BreadcrumbLink>
+                      </div>
+                    }
+                    mobile={{
+                      title: "Navigate",
+                      description: "Navigate to parent directories",
+                      content: data.slice(0, -config.siteConfig.breadcrumbMax + 1).map((item, idx, array) => (
+                        <BreadcrumbItem key={`mobile-${item.label}/${item.href}`}>
+                          <BreadcrumbLink asChild>
+                            <Button
+                              size={"sm"}
+                              variant={"outline"}
+                              className='w-full justify-start'
+                              asChild
+                            >
+                              <Link
+                                href={`/${array
+                                  .slice(0, array.indexOf(item) + 1)
+                                  .map((item) => item.href)
+                                  .join("/")}`}
+                              >
+                                {item.label}
+                              </Link>
+                            </Button>
+                          </BreadcrumbLink>
+                        </BreadcrumbItem>
+                      )),
+                      closeOnFooter: true,
+                    }}
+                    desktop={{
+                      align: "start",
+                      items: data.slice(0, -config.siteConfig.breadcrumbMax + 1).map((item, idx, array) => ({
+                        type: "item",
+                        key: `desktop-${item.label}/${item.href}`,
+                        title: item.label,
+                        onClick: () => {
+                          router.push(
+                            `/${array
+                              .slice(0, array.indexOf(item) + 1)
+                              .map((item) => item.href)
+                              .join("/")}`,
+                          );
+                        },
+                      })),
+                    }}
+                  />
+
+                  <BreadcrumbSeparator />
+                </>
+              )}
+
+              {data.slice(-config.siteConfig.breadcrumbMax + 1).map((item) => (
+                <Fragment key={`${item.label}/${item.href}`}>
+                  <BreadcrumbItem className='line-clamp-1 whitespace-pre-wrap break-all'>
+                    {item.href ? (
+                      <>
+                        <BreadcrumbLink asChild>
+                          <Link
+                            href={`/${data
+                              .map((item) => item.href)
+                              .join("/")
+                              .replace(/\/\//g, "/")}`}
+                          >
+                            {item.label}
+                          </Link>
+                        </BreadcrumbLink>
+                      </>
+                    ) : (
+                      <BreadcrumbPage className='line-clamp-1 whitespace-pre-wrap break-all'>
+                        {item.label}
+                      </BreadcrumbPage>
+                    )}
+                  </BreadcrumbItem>
+                  {item.href && <BreadcrumbSeparator />}
+                </Fragment>
+              ))}
+            </>
+          ) : null}
+        </BreadcrumbList>
+      </Breadcrumb>
+    </section>
+  );
+}
diff --git a/src/components/Explorer/Grid.tsx b/src/components/Explorer/Grid.tsx
new file mode 100644
index 0000000..8bcd66b
--- /dev/null
+++ b/src/components/Explorer/Grid.tsx
@@ -0,0 +1,270 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import nProgress from "nprogress";
+import { useMemo, useState } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+
+import { Icon } from "~/components/Global";
+import { ResponsiveDropdown } from "~/components/Layout";
+import { Button } from "~/components/ui/button";
+import { DrawerClose } from "~/components/ui/drawer";
+
+import { bytesToReadable } from "~/utils/bytesFormat";
+import { cn } from "~/utils/cn";
+import { durationToReadable } from "~/utils/durationFormat";
+import { getPreviewIcon } from "~/utils/previewHelper";
+
+import { Schema_File } from "~/types/schema";
+
+import { CreateDownloadToken } from "actions";
+import config from "config";
+
+type Props = {
+  data: z.infer<typeof Schema_File>;
+  disabled?: boolean;
+};
+export default function FileGrid({ data, disabled }: Props) {
+  const pathname = usePathname();
+  const filePath = useMemo<string>(() => {
+    const path = [pathname, encodeURIComponent(data.name)].join("/").replace(/\/+/g, "/");
+
+    return new URL(path, config.basePath).pathname;
+  }, [data, pathname]);
+
+  const [thumbnailURL, setThumbnailURL] = useState<string>(`/api/thumb/${data.encryptedId}?size=2`);
+  const [isMenuOpen, setIsMenuOpen] = useState<boolean>(false);
+
+  const onCopy = async (e: React.MouseEvent) => {
+    e.stopPropagation();
+    toast.loading("Copying link...", {
+      id: `copy-${data.encryptedId}`,
+    });
+
+    try {
+      await navigator.clipboard.writeText(new URL(filePath, config.basePath).toString());
+
+      toast.success("Link copied!", {
+        id: `copy-${data.encryptedId}`,
+      });
+    } catch (error) {
+      const e = error as Error;
+      console.error(e.message);
+      toast.error(e.message, {
+        id: `copy-${data.encryptedId}`,
+      });
+    }
+  };
+  const onDownload = async (e: React.MouseEvent) => {
+    e.stopPropagation();
+    toast.loading("Preparing download link...", {
+      id: `download-${data.encryptedId}`,
+    });
+
+    try {
+      const token = await CreateDownloadToken();
+      if (!token) throw new Error("Failed to create download token");
+
+      toast.success("Opening download link...", {
+        id: `download-${data.encryptedId}`,
+      });
+
+      const timeout = setTimeout(() => {
+        clearTimeout(timeout);
+        window.open(`/api/download/${data.encryptedId}?token=${token}`);
+      }, 500);
+    } catch (error) {
+      const e = error as Error;
+      console.error(e.message);
+      toast.error(e.message, {
+        id: `download-${data.encryptedId}`,
+      });
+    }
+  };
+
+  return (
+    <div className='relative h-full w-full'>
+      <ResponsiveDropdown
+        slot='actions'
+        open={isMenuOpen}
+        onOpenChange={setIsMenuOpen}
+        trigger={
+          <Button
+            size={"icon"}
+            variant={"secondary"}
+            className='absolute right-1 top-1 z-20 size-8'
+          >
+            <Icon
+              name='EllipsisVertical'
+              size={"1rem"}
+            />
+          </Button>
+        }
+        desktop={{
+          align: "end",
+          items: [
+            {
+              type: "item",
+              key: "copy",
+              title: "Copy link",
+              icon: "Link",
+              onClick: onCopy,
+              disabled: disabled,
+            },
+            {
+              type: "item",
+              key: "download",
+              title: "Download",
+              icon: "Download",
+              onClick: onDownload,
+              disabled: data.mimeType.includes("folder") || disabled,
+            },
+          ],
+        }}
+        mobile={{
+          title: "Actions",
+          description: "What would you like to do with this file?",
+          content: (
+            <>
+              <DrawerClose asChild>
+                <Button
+                  variant={"outline"}
+                  onClick={onCopy}
+                  disabled={disabled}
+                >
+                  <Icon
+                    name='Link'
+                    className='mr-3'
+                    size={"1rem"}
+                  />
+                  Copy link
+                </Button>
+              </DrawerClose>
+              <DrawerClose asChild>
+                <Button
+                  variant={"outline"}
+                  onClick={onDownload}
+                  disabled={disabled || data.mimeType.includes("folder")}
+                >
+                  <Icon
+                    name='Download'
+                    className='mr-3'
+                    size={"1rem"}
+                  />
+                  Download
+                </Button>
+              </DrawerClose>
+            </>
+          ),
+          closeOnFooter: true,
+        }}
+      />
+
+      <Link
+        slot='data'
+        href={filePath}
+        className={cn(
+          "h-full w-full rounded-[var(--radius)]",
+          "border border-border transition",
+          "flex flex-col content-stretch justify-stretch gap-3",
+          "hover:bg-muted/50",
+        )}
+        onClick={async (e) => {
+          if (disabled) {
+            e.preventDefault();
+            e.stopPropagation();
+            await new Promise((resolve) => setTimeout(resolve, 500));
+            nProgress.done(true);
+          }
+        }}
+      >
+        <div className={cn("flex flex-shrink flex-grow flex-col items-center gap-3", "relative")}>
+          {/* If it's media, show thumbnail */}
+          <div className='relative grid h-32 w-full flex-shrink-0 place-items-center overflow-hidden bg-muted/25'>
+            {data.thumbnailLink && (data.mimeType.startsWith("video") || data.mimeType.startsWith("image")) ? (
+              <>
+                <img
+                  src={thumbnailURL}
+                  alt={data.name}
+                  onLoad={(e) => {
+                    if (thumbnailURL.includes("size=2")) {
+                      setThumbnailURL(`/api/thumb/${data.encryptedId}`);
+                    }
+                  }}
+                  className='rounded-top-[var(--radius)] absolute -z-0 h-32 w-full flex-shrink-0 flex-grow-0 object-cover opacity-50'
+                />
+                <img
+                  src={thumbnailURL}
+                  alt={data.name}
+                  onLoad={(e) => {
+                    if (thumbnailURL.includes("size=2")) {
+                      setThumbnailURL(`/api/thumb/${data.encryptedId}`);
+                    }
+                  }}
+                  className='relative z-0 h-32 w-full flex-shrink-0 flex-grow-0 object-contain backdrop-blur'
+                />
+
+                {data.mimeType.startsWith("video") && (
+                  <>
+                    <Icon
+                      name='Play'
+                      className='absolute left-1/2 top-1/2 z-10 -translate-x-1/2 -translate-y-1/2 rounded-full bg-muted-foreground fill-muted p-1.5 text-muted opacity-75'
+                      size={"2rem"}
+                    />
+                    <div className='absolute bottom-0 right-0 z-10 bg-background px-1 py-0.5 text-xs text-foreground'>
+                      {durationToReadable(data.videoMediaMetadata?.durationMillis || 0)}
+                    </div>
+                  </>
+                )}
+              </>
+            ) : (
+              <Icon
+                name={
+                  data.mimeType.includes("folder") ? "Folder" : getPreviewIcon(data.fileExtension || "", data.mimeType)
+                }
+                className='size-16 flex-shrink-0 flex-grow-0 p-3'
+              />
+            )}
+          </div>
+
+          {/* File data */}
+          <div className='flex h-full w-full flex-col justify-between gap-1.5 px-3 py-1.5'>
+            <span className='line-clamp-2 h-full whitespace-pre-wrap text-pretty break-all'>
+              {config.siteConfig.showFileExtension
+                ? data.name
+                : data.fileExtension
+                ? data.name.replace(new RegExp(`.${data.fileExtension}$`), "")
+                : data.name}
+            </span>
+            <div className='muted flex items-center gap-1'>
+              <span
+                className={cn(
+                  "line-clamp-1 whitespace-pre-wrap break-all text-sm",
+                  config.siteConfig.showFileExtension && !data.mimeType.includes("folder") ? "hidden" : "",
+                )}
+              >
+                {data.mimeType.includes("folder") ? "folder" : data.fileExtension || "unknown"}
+              </span>
+              {!data.mimeType.includes("folder") && (
+                <>
+                  {config.siteConfig.showFileExtension ? null : (
+                    <Icon
+                      name='Slash'
+                      size={"0.875rem"}
+                    />
+                  )}
+                  <span className='whitespace-nowrap text-sm'>{bytesToReadable(data.size || 0)}</span>
+                </>
+              )}
+            </div>
+            <div className='muted flex items-center gap-1'>
+              <span className='whitespace-nowrap text-sm'>{new Date(data.modifiedTime).toLocaleDateString()}</span>
+            </div>
+          </div>
+        </div>
+      </Link>
+    </div>
+  );
+}
diff --git a/src/components/Explorer/Layout.tsx b/src/components/Explorer/Layout.tsx
new file mode 100644
index 0000000..0236238
--- /dev/null
+++ b/src/components/Explorer/Layout.tsx
@@ -0,0 +1,130 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { useContext, useMemo, useState } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+
+import { Grid, List } from "~/components/Explorer";
+import { ButtonLoading, Icon, Loader, Status } from "~/components/Global";
+import { Button } from "~/components/ui/button";
+
+import { cn } from "~/utils/cn";
+import { decryptData } from "~/utils/encryptionHelper";
+
+import { LayoutContext } from "~/context/layoutContext";
+import useLoading from "~/hooks/useLoading";
+
+import { ButtonState, Schema_File } from "~/types/schema";
+
+import { GetFiles } from "actions";
+import config from "config";
+
+type Props = {
+  encryptedId: string;
+  files: z.infer<typeof Schema_File>[];
+  nextPageToken?: string;
+  root?: boolean;
+};
+export default function Explorer({ encryptedId, files, nextPageToken, root }: Props) {
+  const { layout } = useContext(LayoutContext);
+  const loading = useLoading();
+  const pathname = usePathname();
+  const prevPath = useMemo<string>(() => {
+    const path = pathname.split("/").slice(0, -1).join("/").replace(/\/+/g, "/");
+
+    return new URL(path, config.basePath).pathname;
+  }, [pathname]);
+
+  const [fileList, setFileList] = useState<z.infer<typeof Schema_File>[]>(files);
+  const [nextToken, setNextToken] = useState<string | undefined>(nextPageToken);
+  const [loadMoreState, setLoadMoreState] = useState<ButtonState>("idle");
+
+  const onLoadMore = async () => {
+    setLoadMoreState("loading");
+    try {
+      if (!nextToken) throw new Error("No more files to load");
+      const id = await decryptData(encryptedId);
+      const data = await GetFiles({ id, pageToken: nextToken });
+      const uniqueData = [...fileList, ...data.files].filter(
+        (item, index, array) => index === array.findIndex((i) => i.encryptedId === item.encryptedId),
+      );
+
+      setFileList(uniqueData);
+      setNextToken(data.nextPageToken);
+    } catch (error) {
+      const e = error as Error;
+      console.error(e.message);
+      toast.error(e.message);
+    } finally {
+      setLoadMoreState("idle");
+    }
+  };
+
+  if (loading) return <Loader message='Loading files...' />;
+
+  return (
+    <section
+      slot='explorer'
+      className={cn("mx-auto w-full max-w-screen-desktop", "flex flex-grow-0 flex-col gap-3 p-3")}
+    >
+      {!root && (
+        <Button
+          size={"sm"}
+          variant={"ghost"}
+          className='justify-start'
+          asChild
+        >
+          <Link href={prevPath}>
+            <Icon
+              name='CornerLeftUp'
+              size={"1rem"}
+              className='mr-3'
+            />
+            Back
+          </Link>
+        </Button>
+      )}
+
+      {!fileList.length ? (
+        <Status
+          icon='Frown'
+          message='There are no files here'
+        />
+      ) : (
+        <div
+          slot='file-container'
+          className={cn(
+            "w-full",
+            layout === "list"
+              ? "flex flex-col gap-1.5"
+              : "grid grid-cols-1 gap-3 mobile:grid-cols-2 tablet:grid-cols-3 desktop:grid-cols-4",
+          )}
+        >
+          {fileList.map((file) => (
+            <div
+              slot='item'
+              key={file.encryptedId}
+              className='group'
+            >
+              {layout === "list" ? <List data={file} /> : <Grid data={file} />}
+            </div>
+          ))}
+        </div>
+      )}
+
+      {nextToken && (
+        <ButtonLoading
+          className='w-full'
+          size={"sm"}
+          variant={"secondary"}
+          state={loadMoreState}
+          onClick={onLoadMore}
+        >
+          Load more files
+        </ButtonLoading>
+      )}
+    </section>
+  );
+}
diff --git a/src/components/Explorer/List.tsx b/src/components/Explorer/List.tsx
new file mode 100644
index 0000000..97efe08
--- /dev/null
+++ b/src/components/Explorer/List.tsx
@@ -0,0 +1,260 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import nProgress from "nprogress";
+import { useMemo, useState } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+
+import { Icon } from "~/components/Global";
+import { ResponsiveDropdown } from "~/components/Layout";
+import { Button } from "~/components/ui/button";
+import { DrawerClose } from "~/components/ui/drawer";
+
+import { bytesToReadable } from "~/utils/bytesFormat";
+import { cn } from "~/utils/cn";
+import { durationToReadable } from "~/utils/durationFormat";
+import { getPreviewIcon } from "~/utils/previewHelper";
+
+import { Schema_File } from "~/types/schema";
+
+import { CreateDownloadToken } from "actions";
+import config from "config";
+
+type Props = {
+  data: z.infer<typeof Schema_File>;
+  disabled?: boolean;
+};
+export default function FileList({ data, disabled }: Props) {
+  const pathname = usePathname();
+  const filePath = useMemo<string>(() => {
+    const path = [pathname, encodeURIComponent(data.name)].join("/").replace(/\/+/g, "/");
+
+    return new URL(path, config.basePath).pathname;
+  }, [data, pathname]);
+
+  const [thumbnailURL, setThumbnailURL] = useState<string>(`/api/thumb/${data.encryptedId}?size=2`);
+  const [isMenuOpen, setIsMenuOpen] = useState<boolean>(false);
+
+  const onCopy = async (e: React.MouseEvent) => {
+    e.stopPropagation();
+    toast.loading("Copying link...", {
+      id: `copy-${data.encryptedId}`,
+    });
+
+    try {
+      await navigator.clipboard.writeText(new URL(filePath, config.basePath).toString());
+
+      toast.success("Link copied!", {
+        id: `copy-${data.encryptedId}`,
+      });
+    } catch (error) {
+      const e = error as Error;
+      console.error(e.message);
+      toast.error(e.message, {
+        id: `copy-${data.encryptedId}`,
+      });
+    }
+  };
+  const onDownload = async (e: React.MouseEvent) => {
+    e.stopPropagation();
+    toast.loading("Preparing download link...", {
+      id: `download-${data.encryptedId}`,
+    });
+
+    try {
+      const token = await CreateDownloadToken();
+      if (!token) throw new Error("Failed to create download token");
+
+      toast.success("Opening download link...", {
+        id: `download-${data.encryptedId}`,
+      });
+
+      const timeout = setTimeout(() => {
+        clearTimeout(timeout);
+        window.open(`/api/download/${data.encryptedId}?token=${token}`);
+      }, 500);
+    } catch (error) {
+      const e = error as Error;
+      console.error(e.message);
+      toast.error(e.message, {
+        id: `download-${data.encryptedId}`,
+      });
+    }
+  };
+
+  return (
+    <div className='relative flex h-full w-full flex-row-reverse items-center'>
+      <ResponsiveDropdown
+        slot='actions'
+        open={isMenuOpen}
+        onOpenChange={setIsMenuOpen}
+        trigger={
+          <Button
+            size={"icon"}
+            variant={"secondary"}
+            className='absolute right-1 top-1 z-20 size-8'
+          >
+            <Icon
+              name='EllipsisVertical'
+              size={"1rem"}
+            />
+          </Button>
+        }
+        desktop={{
+          align: "end",
+          items: [
+            {
+              type: "item",
+              key: "copy",
+              title: "Copy link",
+              icon: "Link",
+              onClick: onCopy,
+              disabled: disabled,
+            },
+            {
+              type: "item",
+              key: "download",
+              title: "Download",
+              icon: "Download",
+              onClick: onDownload,
+              disabled: data.mimeType.includes("folder") || disabled,
+            },
+          ],
+        }}
+        mobile={{
+          title: "Actions",
+          description: "What would you like to do with this file?",
+          content: (
+            <>
+              <DrawerClose asChild>
+                <Button
+                  variant={"outline"}
+                  onClick={onCopy}
+                  disabled={disabled}
+                >
+                  <Icon
+                    name='Link'
+                    className='mr-3'
+                    size={"1rem"}
+                  />
+                  Copy link
+                </Button>
+              </DrawerClose>
+              <DrawerClose asChild>
+                <Button
+                  variant={"outline"}
+                  onClick={onDownload}
+                  disabled={disabled || data.mimeType.includes("folder")}
+                >
+                  <Icon
+                    name='Download'
+                    className='mr-3'
+                    size={"1rem"}
+                  />
+                  Download
+                </Button>
+              </DrawerClose>
+            </>
+          ),
+          closeOnFooter: true,
+        }}
+      />
+
+      <Link
+        slot='data'
+        href={filePath}
+        className={cn(
+          "relative rounded-[var(--radius)] transition",
+          "px-1.5 py-1 pr-10",
+          "flex flex-grow items-center justify-between gap-3",
+          "hover:bg-muted/50",
+        )}
+        onClick={async (e) => {
+          if (disabled) {
+            e.preventDefault();
+            e.stopPropagation();
+            await new Promise((resolve) => setTimeout(resolve, 500));
+            nProgress.done(true);
+          }
+        }}
+      >
+        <div className={cn("flex-shrink flex-grow", "flex items-center gap-3")}>
+          {/* If it's media, show thumbnail */}
+          <div className='relative flex-shrink-0 rounded-[var(--radius)] bg-muted/25'>
+            {data.thumbnailLink && (data.mimeType.startsWith("video") || data.mimeType.startsWith("image")) ? (
+              <>
+                <img
+                  src={thumbnailURL}
+                  alt={data.name}
+                  onLoad={(e) => {
+                    if (thumbnailURL.includes("size=2")) {
+                      setThumbnailURL(`/api/thumb/${data.encryptedId}`);
+                    }
+                  }}
+                  className='size-16 flex-shrink-0 flex-grow-0 rounded-[var(--radius)] object-cover tablet:size-20'
+                />
+
+                {data.mimeType.startsWith("video") && (
+                  <>
+                    <Icon
+                      name='Play'
+                      className='absolute left-1/2 top-1/2 z-10 -translate-x-1/2 -translate-y-1/2 rounded-full bg-muted-foreground fill-muted p-1.5 text-muted opacity-75'
+                      size={"1.5rem"}
+                    />
+                    <div className='absolute bottom-0 right-0 z-10 bg-background px-1 py-0.5 text-[10px] text-foreground tablet:text-xs'>
+                      {durationToReadable(data.videoMediaMetadata?.durationMillis || 0)}
+                    </div>
+                  </>
+                )}
+              </>
+            ) : (
+              <Icon
+                name={
+                  data.mimeType.includes("folder") ? "Folder" : getPreviewIcon(data.fileExtension || "", data.mimeType)
+                }
+                className='size-16 flex-shrink-0 flex-grow-0 p-3 tablet:size-20'
+              />
+            )}
+          </div>
+
+          {/* File data */}
+          <div className='flex flex-grow flex-col'>
+            <span className='line-clamp-1 whitespace-pre-wrap break-all'>
+              {config.siteConfig.showFileExtension
+                ? data.name
+                : data.fileExtension
+                ? data.name.replace(new RegExp(`.${data.fileExtension}$`), "")
+                : data.name}
+            </span>
+            <div className='muted flex items-center gap-1'>
+              <span
+                className={cn(
+                  "line-clamp-1 whitespace-pre-wrap break-all text-sm",
+                  config.siteConfig.showFileExtension && !data.mimeType.includes("folder") ? "hidden" : "",
+                )}
+              >
+                {data.mimeType.includes("folder") ? "folder" : data.fileExtension || "unknown"}
+              </span>
+              {!data.mimeType.includes("folder") && (
+                <>
+                  {config.siteConfig.showFileExtension ? null : (
+                    <Icon
+                      name='Slash'
+                      size={"0.875rem"}
+                    />
+                  )}
+                  <span className='whitespace-nowrap text-sm'>{bytesToReadable(data.size || 0)}</span>
+                </>
+              )}
+            </div>
+            <div className='muted flex items-center gap-1'>
+              <span className='whitespace-nowrap text-sm'>{new Date(data.modifiedTime).toLocaleDateString()}</span>
+            </div>
+          </div>
+        </div>
+      </Link>
+    </div>
+  );
+}
diff --git a/src/components/Explorer/Readme.tsx b/src/components/Explorer/Readme.tsx
new file mode 100644
index 0000000..0b0f8fc
--- /dev/null
+++ b/src/components/Explorer/Readme.tsx
@@ -0,0 +1,63 @@
+"use client";
+
+import { useState } from "react";
+
+import { Markdown } from "~/components/Global";
+import { Button } from "~/components/ui/button";
+import { Card, CardContent, CardHeader } from "~/components/ui/card";
+import { Separator } from "~/components/ui/separator";
+
+import { cn } from "~/utils/cn";
+
+type Props = {
+  content: string;
+  title: string;
+};
+export default function Readme({ content, title }: Props) {
+  const [view, setView] = useState<"markdown" | "raw">("markdown");
+
+  return (
+    <div
+      slot='readme'
+      className='w-full'
+    >
+      <Card>
+        <CardHeader className='pb-0'>
+          <div
+            className={cn(
+              "flex flex-col gap-3 overflow-hidden",
+              "mobile:flex-row mobile:items-center mobile:justify-between",
+            )}
+          >
+            <h3 className='line-clamp-1 flex-grow whitespace-pre-wrap break-all'>{title}</h3>
+            <div className='flex w-full items-center mobile:w-fit'>
+              <Button
+                size={"sm"}
+                variant={view === "markdown" ? "default" : "outline"}
+                onClick={() => setView("markdown")}
+                className='w-full rounded-r-none mobile:w-fit'
+              >
+                Markdown
+              </Button>
+              <Button
+                size={"sm"}
+                variant={view === "raw" ? "default" : "outline"}
+                onClick={() => setView("raw")}
+                className='w-full rounded-l-none mobile:w-fit'
+              >
+                Raw
+              </Button>
+            </div>
+          </div>
+          <Separator />
+        </CardHeader>
+        <CardContent className='p-1.5 pt-0 tablet:p-3 tablet:pt-0'>
+          <Markdown
+            content={content}
+            view={view}
+          />
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
diff --git a/src/components/Explorer/index.tsx b/src/components/Explorer/index.tsx
new file mode 100644
index 0000000..e14502a
--- /dev/null
+++ b/src/components/Explorer/index.tsx
@@ -0,0 +1,6 @@
+export { default as Actions } from "./Actions";
+export { default as FilePath } from "./FilePath";
+export { default as Grid } from "./Grid";
+export { default as Explorer } from "./Layout";
+export { default as List } from "./List";
+export { default as Readme } from "./Readme";
diff --git a/src/components/Global/ButtonLoading.tsx b/src/components/Global/ButtonLoading.tsx
new file mode 100644
index 0000000..c14e298
--- /dev/null
+++ b/src/components/Global/ButtonLoading.tsx
@@ -0,0 +1,46 @@
+"use client";
+
+import { icons } from "lucide-react";
+
+import { Icon } from "~/components/Global";
+import { Button, ButtonProps } from "~/components/ui/button";
+
+import { cn } from "~/utils/cn";
+
+import { ButtonState } from "~/types/schema";
+
+type Props = {
+  state?: ButtonState;
+  icon?: keyof typeof icons;
+} & ButtonProps;
+
+export default function ButtonLoading({ state = "idle", icon, ...props }: Props) {
+  return (
+    <Button
+      {...props}
+      disabled={state === "loading"}
+    >
+      <div className='relative flex w-full items-center justify-center'>
+        {icon && (
+          <Icon
+            name={icon}
+            size={"1rem"}
+            className={cn(
+              "mr-1.5 transition-all duration-300 ease-in-out",
+              state === "loading" ? "size-0 opacity-0" : "size-4 opacity-100",
+            )}
+          />
+        )}
+        <Icon
+          name='LoaderCircle'
+          size={"1rem"}
+          className={cn(
+            "animate-spin transition-all",
+            state === "loading" ? "mr-1.5 size-4 opacity-100" : "mr-0 size-0 opacity-0",
+          )}
+        />
+        <span className='relative transition-all duration-300 ease-in-out'>{props.children}</span>
+      </div>
+    </Button>
+  );
+}
diff --git a/src/components/Icon/index.tsx b/src/components/Global/Icon.tsx
similarity index 100%
rename from src/components/Icon/index.tsx
rename to src/components/Global/Icon.tsx
diff --git a/src/components/Global/Loader.tsx b/src/components/Global/Loader.tsx
new file mode 100644
index 0000000..720f5ed
--- /dev/null
+++ b/src/components/Global/Loader.tsx
@@ -0,0 +1,30 @@
+"use client";
+
+import { Icon } from "~/components/Global";
+
+import { cn } from "~/utils/cn";
+
+type Props = {
+  message?: string;
+  extra?: React.ReactNode;
+};
+
+export default function Loader({ message, extra }: Props) {
+  return (
+    <div
+      className={cn(
+        "h-auto min-h-[50dvh] w-full",
+        "flex flex-grow flex-col items-center justify-center gap-3",
+        "text-foreground",
+      )}
+    >
+      <Icon
+        name='LoaderCircle'
+        size={"2rem"}
+        className='animate-spin'
+      />
+      <p>{message || "Loading..."}</p>
+      {extra}
+    </div>
+  );
+}
diff --git a/src/app/@markdown.tsx b/src/components/Global/Markdown.tsx
similarity index 58%
rename from src/app/@markdown.tsx
rename to src/components/Global/Markdown.tsx
index 485edc2..0808a2d 100644
--- a/src/app/@markdown.tsx
+++ b/src/components/Global/Markdown.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useRef, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import toast from "react-hot-toast";
 import ReactMarkdown from "react-markdown";
 import rehypeKatex from "rehype-katex";
@@ -11,74 +11,66 @@ import remarkGfm from "remark-gfm";
 import remarkMath from "remark-math";
 import remarkSlug from "remark-slug";
 import remarkToc from "remark-toc";
-import { cn } from "~/utils";
 
-import Icon from "~/components/Icon";
+import "~/app/highlight.css";
+import { Icon } from "~/components/Global";
 
-import "./highlight.css";
+import { cn } from "~/utils/cn";
 
 type Props = {
   content: string;
-  view: "markdown" | "raw";
+  view?: "markdown" | "raw";
   className?: string;
 };
 export default function Markdown({ content, view, className }: Props) {
+  const [viewState, setViewState] = useState<"markdown" | "raw">(view || "markdown");
+
+  useEffect(() => {
+    if (view) setViewState(view);
+  }, [view]);
+
   return (
-    <div className={cn("flex flex-col p-3", className)}>
-      <div
-        className={cn(
-          "markdown w-full rounded-[var(--radius)]",
-          view !== "raw" && "hidden",
-        )}
-      >
-        <pre className='w-full whitespace-pre-wrap break-words bg-transparent !p-0 shadow shadow-background'>
-          {content}
-        </pre>
-      </div>
-      <div
-        className={cn(
-          "markdown w-full rounded-[var(--radius)]",
-          view !== "markdown" && "hidden",
-        )}
-      >
-        <ReactMarkdown
-          className='w-full'
-          disallowedElements={["script"]}
-          remarkPlugins={[
-            remarkGfm,
-            remarkMath,
-            remarkSlug,
-            remarkToc,
-            remarkBreaks,
-          ]}
-          rehypePlugins={[
-            rehypeKatex,
-            rehypeRaw,
-            [rehypePrism, { ignoreMissing: true }],
-          ]}
-          components={{
-            p: ({ node, children, ...props }) => (
-              <p
-                {...props}
-                className='paragraph text-balance'
-              >
-                {children}
-              </p>
-            ),
-            pre: PreComponent,
-            code: ({ node, inline, className, children, ...props }) => (
-              <code
-                className={`${className} font-mono !text-sm`}
-                {...props}
-              >
-                {children}
-              </code>
-            ),
-          }}
-        >
-          {content}
-        </ReactMarkdown>
-      </div>
+    <div
+      slot='markdown-container'
+      className={cn("flex flex-col p-3", className)}
+    >
+      {viewState === "raw" ? (
+        <div className={cn("markdown w-full rounded-[var(--radius)]")}>
+          <pre className='w-full whitespace-pre-wrap break-words bg-transparent !p-0 font-sans shadow shadow-background'>
+            {content}
+          </pre>
+        </div>
+      ) : (
+        <div className={cn("markdown w-full rounded-[var(--radius)]")}>
+          <ReactMarkdown
+            className='w-full'
+            disallowedElements={["script"]}
+            remarkPlugins={[remarkGfm, remarkMath, remarkSlug, remarkToc, remarkBreaks]}
+            rehypePlugins={[rehypeKatex, rehypeRaw, [rehypePrism, { ignoreMissing: true }]]}
+            components={{
+              p: ({ node, children, ...props }) => (
+                <p
+                  {...props}
+                  className='paragraph text-balance'
+                >
+                  {children}
+                </p>
+              ),
+              pre: PreComponent,
+              code: ({ node, inline, className, children, ...props }) => (
+                <code
+                  className={`${className} font-mono !text-sm`}
+                  {...props}
+                >
+                  {children}
+                </code>
+              ),
+            }}
+          >
+            {content}
+          </ReactMarkdown>
+        </div>
+      )}
     </div>
   );
 }
@@ -146,14 +138,8 @@ function PreComponent(props: PreProps) {
         >
           <Icon
             name={isCopied ? "Check" : isError ? "X" : "Copy"}
-            className={
-              isCopied
-                ? "text-green-500"
-                : isError
-                ? "text-red-500"
-                : "text-foreground"
-            }
-            size={16}
+            className={isCopied ? "text-green-500" : isError ? "text-red-500" : "text-foreground"}
+            size={"1rem"}
           />
         </div>
       </div>
diff --git a/src/components/Global/Status.tsx b/src/components/Global/Status.tsx
new file mode 100644
index 0000000..efd03c8
--- /dev/null
+++ b/src/components/Global/Status.tsx
@@ -0,0 +1,31 @@
+"use client";
+
+import { icons } from "lucide-react";
+
+import { Icon } from "~/components/Global";
+
+import { cn } from "~/utils/cn";
+
+type Props = {
+  icon: keyof typeof icons;
+  message?: string;
+  destructive?: boolean;
+};
+
+export default function Status({ icon, message, destructive }: Props) {
+  return (
+    <div
+      className={cn(
+        "h-auto min-h-[33dvh] w-full",
+        "flex flex-grow flex-col items-center justify-center gap-3",
+        destructive ? "text-destructive" : "text-foreground",
+      )}
+    >
+      <Icon
+        name={icon}
+        size={"1.5rem"}
+      />
+      <p>{message || "Something went wrong"}</p>
+    </div>
+  );
+}
diff --git a/src/components/Global/index.tsx b/src/components/Global/index.tsx
new file mode 100644
index 0000000..eecdc1d
--- /dev/null
+++ b/src/components/Global/index.tsx
@@ -0,0 +1,5 @@
+export { default as ButtonLoading } from "./ButtonLoading";
+export { default as Icon } from "./Icon";
+export { default as Loader } from "./Loader";
+export { default as Markdown } from "./Markdown";
+export { default as Status } from "./Status";
diff --git a/src/components/Guide/Configuration/ApiForm.tsx b/src/components/Guide/Configuration/ApiForm.tsx
new file mode 100644
index 0000000..eb05553
--- /dev/null
+++ b/src/components/Guide/Configuration/ApiForm.tsx
@@ -0,0 +1,342 @@
+import { FormEvent } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+
+import { type ConfigInputs, ConfigurationHeader, ConfigurationInput } from "~/components/Guide/Configuration";
+import { Separator } from "~/components/ui/separator";
+
+import { decryptData } from "~/utils/encryptionHelper";
+import { fileLoadHelper } from "~/utils/fileLoadHelper";
+import { parseConfigFile } from "~/utils/parseConfigFile";
+
+import { ConfigurationCategory, ConfigurationKeys, ConfigurationValue, Schema_App_Configuration } from "~/types/schema";
+
+type Props = {
+  state: {
+    get: z.input<typeof Schema_App_Configuration>;
+    set: <
+      T extends ConfigurationCategory = ConfigurationCategory,
+      K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+    >(
+      category: T,
+      key: K,
+      value: ConfigurationValue<T, K>,
+    ) => void;
+  };
+  error: {
+    get: Partial<Record<ConfigurationKeys<"api">, string>>;
+    set: <T extends ConfigurationKeys<"api">>(key: T, value: string) => void;
+  };
+  onReset: (category: ConfigurationCategory | "all") => void;
+};
+
+export default function ConfigApi({ state: { get, set }, error, onReset }: Props) {
+  const inputs: ConfigInputs<"api", ConfigurationKeys<"api">>[] = [
+    {
+      type: "text",
+      inputKey: "rootFolder",
+      title: "Root Folder ID",
+      description: `starting point of the drive, will be used as the root folder for the explorer
+This ID will be encrypted in the config file`,
+      required: true,
+      value: get.api.rootFolder,
+      onValueChange: (key, value) => set("api", key, value),
+      error: error.get.rootFolder,
+      onError: (err) => error.set("rootFolder", err),
+      placeholder: "Starting point of the drive",
+    },
+    {
+      type: "group",
+      inputKey: "sharedGroup",
+      columns: 3,
+      children: [
+        {
+          type: "select",
+          inputKey: "isTeamDrive",
+          title: "Use Team Drive",
+          description: "Enable this option if you are using a Team Drive instead of a personal drive",
+          required: true,
+          value: get.api.isTeamDrive,
+          onValueChange: (key, value) => {
+            set("api", key, value);
+            if (value === false) {
+              set("api", "sharedDrive", "");
+              error.set("sharedDrive", "");
+            }
+          },
+          error: error.get.isTeamDrive,
+          onError: (err) => error.set("isTeamDrive", err),
+        },
+        {
+          type: "text",
+          inputKey: "sharedDrive",
+          title: "Shared Drive ID",
+          description: `The ID of the Shared Drive
+This ID will be encrypted in the config file`,
+          required: true,
+          value: get.api.sharedDrive,
+          onValueChange: (key, value) => set("api", key, value),
+          error: error.get.sharedDrive,
+          onError: (err) => error.set("sharedDrive", err),
+          disabled: !get.api.isTeamDrive,
+          placeholder: get.api.isTeamDrive ? "Make sure to copy the Drive ID" : "You need to enable Team Drive first",
+          columnSpan: 2,
+        },
+      ],
+    },
+    {
+      type: "group",
+      inputKey: "pagination",
+      columns: 2,
+      children: [
+        {
+          type: "number",
+          inputKey: "itemsPerPage",
+          title: "Items per page",
+          description: `Set how many items to display per page in the file explorer
+It's recommended to keep this value to a reasonable number, since it will affect the load time of the page
+
+Default: 50`,
+          required: true,
+          value: get.api.itemsPerPage,
+          onValueChange: (key, value) => set("api", key, value),
+          error: error.get.itemsPerPage,
+          onError: (err) => error.set("itemsPerPage", err),
+          minMax: { min: 1 },
+          validation: async (value) => {
+            const num = Number(value);
+            if (isNaN(num)) return { success: false, message: "Value must be a number" };
+            if (num < 1) return { success: false, message: "Items per page must be greater than 0" };
+            return { success: true, message: "" };
+          },
+        },
+        {
+          type: "number",
+          inputKey: "searchResult",
+          title: "Search Results",
+          description: `Set how many search results to display
+It's recommended to set this to a small number, since it will affect search performance
+
+Default: 5`,
+          required: true,
+          value: get.api.searchResult,
+          onValueChange: (key, value) => set("api", key, value),
+          error: error.get.searchResult,
+          onError: (err) => error.set("searchResult", err),
+          minMax: { min: 1 },
+          validation: async (value) => {
+            const num = Number(value);
+            if (isNaN(num)) return { success: false, message: "Value must be a number" };
+            if (num < 1) return { success: false, message: "Search result must be greater than 0" };
+            return { success: true, message: "" };
+          },
+        },
+      ],
+    },
+    {
+      type: "select",
+      inputKey: "proxyThumbnail",
+      title: "Allow Proxy Thumbnail",
+      description: `Use API route instead of Google Drive thumbnail link
+      
+If your files thumbnail are not accessible, you can enable this option
+This will fetch the thumbnail image via API route`,
+      required: true,
+      value: get.api.proxyThumbnail,
+      onValueChange: (key, value) => set("api", key, value),
+      error: error.get.proxyThumbnail,
+      onError: (err) => error.set("proxyThumbnail", err),
+    },
+    {
+      type: "group",
+      inputKey: "protectedFile",
+      columns: 2,
+      children: [
+        {
+          type: "select",
+          inputKey: "allowDownloadProtectedFile",
+          title: "Allow Download Protected File",
+          description: `Allow users to download files inside the protected folder
+    
+    If set to true, users will be able to download the file without entering the password as long as they have the direct link
+    If set to false, users will need to enter the password before downloading the file, even if they have the direct link`,
+          required: true,
+          value: get.api.allowDownloadProtectedFile,
+          onValueChange: (key, value) => set("api", key, value),
+          error: error.get.allowDownloadProtectedFile,
+          onError: (err) => error.set("allowDownloadProtectedFile", err),
+        },
+        {
+          type: "number",
+          inputKey: "temporaryTokenDuration",
+          title: "Temporary Token Duration (in hours)",
+          description: `Set how long the download token will be valid
+If the token is expired, users will need to re-open the file page to get a new token`,
+          required: true,
+          value: get.api.temporaryTokenDuration,
+          onValueChange: (key, value) => set("api", key, value),
+          error: error.get.temporaryTokenDuration,
+          minMax: { min: 1, max: 24 * 30 },
+          validation: async (value) => {
+            const num = Number(value);
+            if (isNaN(num)) return { success: false, message: "Value must be a number" };
+            if (num < 1) return { success: false, message: "Token duration must be greater than 0" };
+            if (num > 24 * 30)
+              return { success: false, message: "Token duration can't be more than 720 hours (30 days)" };
+            return { success: true, message: "" };
+          },
+        },
+      ],
+    },
+    {
+      type: "group",
+      inputKey: "fileSize",
+      columns: 2,
+      children: [
+        {
+          type: "number",
+          inputKey: "maxFileSize",
+          title: "Max Direct Download Size (in MB)",
+          description: `Max file size that can be downloaded directly from the server
+Please check your deploy platform for the maximum response size limit
+If you're using Vercel, the maximum size is around 4 - 4.5MB, any file larger than this size will return an error
+
+Set to 0 to disable the limit`,
+          required: true,
+          value: get.api.maxFileSize / 1024 / 1024,
+          onValueChange: (key, value) => set("api", key, value * 1024 * 1024),
+          error: error.get.maxFileSize,
+          minMax: { min: 0 },
+          validation: async (value) => {
+            const num = Number(value);
+            if (isNaN(num)) return { success: false, message: "Value must be a number" };
+            if (num < 0) return { success: false, message: "Size must be greater than or equal to 0" };
+            return { success: true, message: "" };
+          },
+        },
+        {
+          type: "number",
+          inputKey: "streamMaxSize",
+          title: "Max Stream Size (in MB)",
+          description: `For previewing large files, the file will be streamed in chunks
+Make sure to set this value to a reasonable number, since it will count towards your server bandwidth usage
+
+This will also affect the maximum file size that can be previewed. Especially for media files like video, audio, and images
+(Manga preview will automatically limited to the first 5MB)
+
+Set to 0 to disable the limit
+Default: 100`,
+          required: true,
+          value: get.api.streamMaxSize / 1024 / 1024,
+          onValueChange: (key, value) => set("api", key, value * 1024 * 1024),
+          error: error.get.streamMaxSize,
+          minMax: { min: 0 },
+          validation: async (value) => {
+            const num = Number(value);
+            if (isNaN(num)) return { success: false, message: "Value must be a number" };
+            if (num < 0) return { success: false, message: "Size must be greater than or equal to 0" };
+            return { success: true, message: "" };
+          },
+        },
+      ],
+    },
+  ];
+
+  function onFileLoad() {
+    fileLoadHelper({
+      accept: ".config.ts",
+      fileName: "gindex.config.ts",
+      async onLoad(result) {
+        const config = parseConfigFile(result);
+        if ("success" in config) return toast.error(config.message);
+
+        if (get.environment.ENCRYPTION_KEY) {
+          try {
+            const root = config.api.rootFolder;
+            const shared = config.api.sharedDrive || null;
+            if (root) {
+              const decrypted = await decryptData(root, get.environment.ENCRYPTION_KEY);
+              if (decrypted) set("api", "rootFolder", decrypted);
+            }
+            if (shared) {
+              const decrypted = await decryptData(shared, get.environment.ENCRYPTION_KEY);
+              if (decrypted) set("api", "sharedDrive", decrypted);
+            }
+          } catch (error) {
+            const e = error as Error;
+            console.error(e.message);
+            toast.error("Skipping decryption of folder ID, please check your Encryption Key and try again.");
+          }
+        } else {
+          toast.error("Can't decrypt folder ID without Encryption Key");
+        }
+        config.api.isTeamDrive && set("api", "isTeamDrive", config.api.isTeamDrive);
+        config.api.itemsPerPage && set("api", "itemsPerPage", config.api.itemsPerPage);
+        config.api.searchResult && set("api", "searchResult", config.api.searchResult);
+        config.api.proxyThumbnail && set("api", "proxyThumbnail", config.api.proxyThumbnail);
+        config.api.allowDownloadProtectedFile &&
+          set("api", "allowDownloadProtectedFile", config.api.allowDownloadProtectedFile);
+        config.api.temporaryTokenDuration && set("api", "temporaryTokenDuration", config.api.temporaryTokenDuration);
+        config.api.maxFileSize && set("api", "maxFileSize", config.api.maxFileSize);
+        config.api.streamMaxSize && set("api", "streamMaxSize", config.api.streamMaxSize);
+
+        // Other config
+        config.api.defaultQuery && set("api", "defaultQuery", config.api.defaultQuery);
+        config.api.defaultField && set("api", "defaultField", config.api.defaultField);
+        config.api.defaultOrder && set("api", "defaultOrder", config.api.defaultOrder);
+        config.api.specialFile && set("api", "specialFile", config.api.specialFile);
+        config.api.hiddenFiles && set("api", "hiddenFiles", config.api.hiddenFiles);
+
+        // Site config
+        config.site.siteName && set("site", "siteName", config.site.siteName);
+        config.site.siteNameTemplate && set("site", "siteNameTemplate", config.site.siteNameTemplate);
+        config.site.siteDescription && set("site", "siteDescription", config.site.siteDescription);
+        config.site.siteIcon && set("site", "siteIcon", config.site.siteIcon);
+        config.site.favIcon && set("site", "favIcon", config.site.favIcon);
+        config.site.siteAuthor && set("site", "siteAuthor", config.site.siteAuthor);
+        config.site.twitterHandle && set("site", "twitterHandle", config.site.twitterHandle);
+        config.site.robots && set("site", "robots", config.site.robots);
+
+        config.site.showFileExtension && set("site", "showFileExtension", config.site.showFileExtension);
+        config.site.footer && set("site", "footer", config.site.footer);
+        config.site.privateIndex && set("site", "privateIndex", config.site.privateIndex);
+        config.site.breadcrumbMax && set("site", "breadcrumbMax", config.site.breadcrumbMax);
+        config.site.toaster && set("site", "toaster", config.site.toaster);
+        config.site.navbarItems && set("site", "navbarItems", config.site.navbarItems);
+        config.site.supports && set("site", "supports", config.site.supports);
+
+        toast.success("API configuration has been loaded.");
+      },
+    });
+  }
+  function onFormReset(e: FormEvent<HTMLFormElement>) {
+    e.preventDefault();
+    onReset("api");
+    toast.success("API section has been reset to default values.");
+  }
+
+  return (
+    <form
+      className='flex w-full flex-col gap-3 py-3'
+      onReset={onFormReset}
+    >
+      <ConfigurationHeader
+        title='API Configuration'
+        onLoad={onFileLoad}
+      />
+      <Separator />
+
+      <div
+        slot='inputs'
+        className='flex flex-col gap-3'
+      >
+        {inputs.map((props, index) => (
+          <ConfigurationInput<"api", ConfigurationKeys<"api">>
+            key={String(props.inputKey)}
+            {...props}
+          />
+        ))}
+      </div>
+    </form>
+  );
+}
diff --git a/src/components/Guide/Configuration/EnvironmentForm.tsx b/src/components/Guide/Configuration/EnvironmentForm.tsx
new file mode 100644
index 0000000..d90d56c
--- /dev/null
+++ b/src/components/Guide/Configuration/EnvironmentForm.tsx
@@ -0,0 +1,232 @@
+import { FormEvent, useState } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+
+import { type ConfigInputs, ConfigurationHeader, ConfigurationInput } from "~/components/Guide/Configuration";
+import { Separator } from "~/components/ui/separator";
+
+import { fileLoadHelper } from "~/utils/fileLoadHelper";
+
+import {
+  ButtonState,
+  ConfigurationCategory,
+  ConfigurationKeys,
+  ConfigurationValue,
+  Schema_App_Configuration,
+  Schema_ServiceAccount,
+} from "~/types/schema";
+
+import { GenerateAESKey, VerifyAESKey } from "actions";
+
+type Props = {
+  state: {
+    get: z.input<typeof Schema_App_Configuration>;
+    set: <
+      T extends ConfigurationCategory = ConfigurationCategory,
+      K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+    >(
+      category: T,
+      key: K,
+      value: ConfigurationValue<T, K>,
+    ) => void;
+  };
+  error: {
+    get: Partial<Record<ConfigurationKeys<"environment">, string>>;
+    set: <T extends ConfigurationKeys<"environment">>(key: T, value: string) => void;
+  };
+  onReset: (category: ConfigurationCategory | "all") => void;
+};
+
+export default function ConfigEnvironment({ state: { get, set }, error, onReset }: Props) {
+  const [encryptionState, setEncryptionState] = useState<ButtonState>("idle");
+  const [serviceAuthState, setServiceAuthState] = useState<ButtonState>("idle");
+  const [isRevealPassword, setIsRevealPassword] = useState<boolean>(false);
+
+  const inputs: ConfigInputs<"environment", ConfigurationKeys<"environment">>[] = [
+    {
+      inputKey: "ENCRYPTION_KEY",
+      title: "Encryption Key",
+      description:
+        "The key used to encrypt and decrypt sensitive data. Must be a alphanumeric string of 16 characters.",
+      type: "text",
+      required: true,
+      action: {
+        label: "Generate",
+        state: encryptionState,
+        icon: "RefreshCw",
+        async onClick(e) {
+          e.preventDefault();
+          setEncryptionState("loading");
+          error.set("ENCRYPTION_KEY", "");
+
+          try {
+            const key = await GenerateAESKey();
+            const isValid = await VerifyAESKey("This is a test", key);
+            if (!isValid) throw new Error("Invalid key generated, please try again.");
+
+            set("environment", "ENCRYPTION_KEY", key);
+          } catch (err) {
+            const e = err as Error;
+            console.error(e.message);
+            toast.error(e.message);
+            error.set("ENCRYPTION_KEY", e.message);
+          } finally {
+            setEncryptionState("idle");
+          }
+        },
+      },
+      value: get.environment.ENCRYPTION_KEY,
+      onValueChange: (key, value) => set("environment", key, value),
+      error: error.get.ENCRYPTION_KEY,
+      onError: (err) => error.set("ENCRYPTION_KEY", err),
+      validation: async (value) => {
+        if (!value) return { success: false, message: "Encryption key is required" };
+        if (value.length !== 16) return { success: false, message: "Encryption key must be 16 characters long" };
+
+        const valid = await VerifyAESKey("This is a test", value);
+        if (!valid) return { success: false, message: "Invalid encryption key" };
+        return { success: true, message: "" };
+      },
+      placeholder: "16 alphanumeric characters secret key",
+    },
+    {
+      inputKey: "GD_SERVICE_B64",
+      title: "Google Drive Service Account",
+      description: `The base64 encoded Google Drive Service Account JSON file.
+To avoid error when input, please use the "Load JSON" button to load the file.`,
+      type: "text",
+      required: true,
+      readOnly: true,
+      action: {
+        label: "Load JSON",
+        state: serviceAuthState,
+        icon: "Upload",
+        async onClick(e) {
+          e.preventDefault();
+          setServiceAuthState("loading");
+
+          try {
+            fileLoadHelper({
+              accept: ".json",
+              onLoad(result) {
+                const objectFile = JSON.parse(result);
+                const parse = Schema_ServiceAccount.safeParse(objectFile);
+                if (!parse.success)
+                  return toast.error("Invalid Service Account JSON file. Please make sure the file is correct.");
+
+                set("environment", "GD_SERVICE_B64", btoa(result));
+                error.set("GD_SERVICE_B64", "");
+
+                toast.success("Service Account JSON file has been loaded successfully.");
+              },
+            });
+          } catch (err) {
+            const e = err as Error;
+            console.error(e.message);
+            error.set("GD_SERVICE_B64", e.message);
+            toast.error(e.message);
+          } finally {
+            setServiceAuthState("idle");
+          }
+        },
+      },
+      value: get.environment.GD_SERVICE_B64,
+      onValueChange: (key, value) => set("environment", key, value),
+      error: error.get.GD_SERVICE_B64,
+      onError: (err) => error.set("GD_SERVICE_B64", err),
+      placeholder: "Base64 encoded JSON file",
+    },
+    {
+      inputKey: "NEXT_PUBLIC_DOMAIN",
+      title: "Site Domain",
+      description: `The domain for the site, without the protocol`,
+      type: "text",
+      value: get.environment.NEXT_PUBLIC_DOMAIN,
+      onValueChange: (key, value) => set("environment", key, value),
+      error: error.get.NEXT_PUBLIC_DOMAIN,
+      onError: (err) => error.set("NEXT_PUBLIC_DOMAIN", err),
+      placeholder: "e.g. drive-demo.mbaharip.com or mbaharip.com",
+    },
+    {
+      inputKey: "SITE_PASSWORD",
+      title: "Site Password",
+      description: `The password to access the site
+Only required if the site is set to private`,
+      type: isRevealPassword ? "text" : "password",
+      action: {
+        label: isRevealPassword ? "Hide" : "Reveal",
+        icon: isRevealPassword ? "EyeOff" : "Eye",
+        onClick(e) {
+          e.preventDefault();
+          setIsRevealPassword((prev) => !prev);
+        },
+        state: "idle",
+      },
+      value: get.environment.SITE_PASSWORD,
+      onValueChange: (key, value) => set("environment", key, value),
+      error: error.get.SITE_PASSWORD,
+      onError: (err) => error.set("SITE_PASSWORD", err),
+      validation: async (value) => {
+        if (get.site.privateIndex && !value) return { success: false, message: "Site password is required" };
+        return { success: true, message: "" };
+      },
+      placeholder: "Not required if the site is public",
+    },
+  ];
+
+  function onFileLoad() {
+    fileLoadHelper({
+      accept: ".env, .env.local, .env.development, .env.production",
+      onLoad(result) {
+        const lines = result.split("\n");
+        const env: Record<string, string> = {};
+        for (const line of lines) {
+          const [key, value] = line.split("=");
+          if (!key || !value) continue;
+          const formattedValue = value
+            ?.replace(/"/g, "")
+            .replace(/'/g, "")
+            .replace(/\\/g, "")
+            .replace(/\r/g, "")
+            .trim();
+          env[key] = formattedValue;
+        }
+        set("environment", "ENCRYPTION_KEY", env.ENCRYPTION_KEY);
+        set("environment", "GD_SERVICE_B64", env.GD_SERVICE_B64);
+        set("environment", "NEXT_PUBLIC_DOMAIN", env.NEXT_PUBLIC_DOMAIN);
+        set("environment", "SITE_PASSWORD", env.SITE_PASSWORD);
+        toast.success("Environment section has been loaded successfully.");
+      },
+    });
+  }
+  function onFormReset(e: FormEvent<HTMLFormElement>) {
+    e.preventDefault();
+    onReset("environment");
+    toast.success("Environment section has been reset to default values.");
+  }
+
+  return (
+    <form
+      className='flex w-full flex-col gap-3 py-3'
+      onReset={onFormReset}
+    >
+      <ConfigurationHeader
+        title='Environment Configuration'
+        onLoad={onFileLoad}
+      />
+      <Separator />
+
+      <div
+        slot='inputs'
+        className='flex flex-col gap-3'
+      >
+        {inputs.map((props, index) => (
+          <ConfigurationInput<"environment", ConfigurationKeys<"environment">>
+            key={props.inputKey}
+            {...props}
+          />
+        ))}
+      </div>
+    </form>
+  );
+}
diff --git a/src/components/Guide/Configuration/Header.tsx b/src/components/Guide/Configuration/Header.tsx
new file mode 100644
index 0000000..821963c
--- /dev/null
+++ b/src/components/Guide/Configuration/Header.tsx
@@ -0,0 +1,62 @@
+"use client";
+
+import { useState } from "react";
+import toast from "react-hot-toast";
+
+import { ButtonLoading } from "~/components/Global";
+import { Button } from "~/components/ui/button";
+
+import { ButtonState } from "~/types/schema";
+
+type Props = {
+  title: string;
+  onLoad?: () => void;
+};
+export default function ConfigurationHeader({ title, onLoad }: Props) {
+  const [loadState, setLoadState] = useState<ButtonState>("idle");
+
+  return (
+    <div
+      slot='header'
+      className='flex flex-col gap-3 tablet:flex-row tablet:items-center tablet:justify-between'
+    >
+      <h4>{title}</h4>
+
+      <div
+        slot='actions'
+        className='flex w-full items-center gap-3 tablet:w-fit'
+      >
+        {onLoad && (
+          <ButtonLoading
+            variant={"outline"}
+            size={"sm"}
+            state={loadState}
+            onClick={(e) => {
+              e.preventDefault();
+              setLoadState("loading");
+
+              try {
+                onLoad();
+              } catch (error) {
+                const e = error as Error;
+                console.error(e.message);
+                toast.error(e.message);
+              } finally {
+                setLoadState("idle");
+              }
+            }}
+          >
+            Load File
+          </ButtonLoading>
+        )}
+        <Button
+          variant={"destructive"}
+          type='reset'
+          size={"sm"}
+        >
+          Reset Section
+        </Button>
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/Guide/Configuration/Input.tsx b/src/components/Guide/Configuration/Input.tsx
new file mode 100644
index 0000000..580c068
--- /dev/null
+++ b/src/components/Guide/Configuration/Input.tsx
@@ -0,0 +1,232 @@
+"use client";
+
+import { icons } from "lucide-react";
+
+import { ButtonLoading, Icon } from "~/components/Global";
+import { Input } from "~/components/ui/input";
+import { Label } from "~/components/ui/label";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "~/components/ui/select";
+import { Separator } from "~/components/ui/separator";
+import { Tooltip, TooltipContent, TooltipTrigger } from "~/components/ui/tooltip";
+
+import { cn } from "~/utils/cn";
+
+import { ButtonState, ConfigurationCategory, ConfigurationKeys, ConfigurationValue } from "~/types/schema";
+
+export type ConfigInputs<
+  T extends ConfigurationCategory = ConfigurationCategory,
+  K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+> = ConfigInputProps<T, K> | ConfigInputGroupProps<T, K> | ConfigInputSeparatorProps;
+
+type ConfigInputProps<
+  T extends ConfigurationCategory = ConfigurationCategory,
+  K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+> = {
+  inputKey: K;
+  title: string;
+  type: "text" | "password" | "number" | "select";
+  description?: string;
+  required?: boolean;
+  action?: {
+    label: string;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    state: ButtonState;
+    icon?: keyof typeof icons;
+  };
+  value: ConfigurationValue<T, K>;
+  onValueChange: (key: K, value: any) => void;
+  error?: string;
+  onError?: (error: string) => void;
+  validation?: (value: string) =>
+    | { success: boolean; message: string }
+    | Promise<{
+        success: boolean;
+        message: string;
+      }>;
+  readOnly?: boolean;
+  minMax?: { min?: number; max?: number };
+  disabled?: boolean;
+  placeholder?: string;
+};
+
+type ConfigInputGroupProps<
+  T extends ConfigurationCategory = ConfigurationCategory,
+  K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+> = {
+  inputKey: string;
+  type: "group";
+  columns: number;
+  children: (ConfigInputProps<T, K> & {
+    columnSpan?: number;
+  })[];
+};
+type ConfigInputSeparatorProps = {
+  inputKey: string;
+  type: "separator";
+};
+export default function ConfigurationInput<
+  T extends ConfigurationCategory = ConfigurationCategory,
+  K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+>(props: ConfigInputProps<T, K> | ConfigInputGroupProps<T, K> | ConfigInputSeparatorProps) {
+  const key = String(props.inputKey);
+  return (
+    <>
+      {props.type !== "separator" && props.type !== "group" && (
+        <>
+          <Inputs<T, K> {...props} />
+        </>
+      )}
+
+      {props.type === "separator" && <Separator />}
+
+      {props.type === "group" && (
+        <div
+          slot='group'
+          className='grid w-full gap-1.5'
+          style={{
+            gridTemplateColumns: `repeat(${props.columns}, 1fr)`,
+          }}
+        >
+          {props.children.map((child, index) => (
+            <Inputs<T, K>
+              key={`${child.inputKey as string}@${index}`}
+              columnSpan={child.columnSpan}
+              {...child}
+            />
+          ))}
+        </div>
+      )}
+    </>
+  );
+}
+
+function Inputs<
+  T extends ConfigurationCategory = ConfigurationCategory,
+  K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+>(
+  props: ConfigInputProps<T, K> & {
+    columnSpan?: number;
+  },
+) {
+  const key = String(props.inputKey);
+  return (
+    <div
+      id={key}
+      slot={`input-${key}`}
+      className='flex w-full flex-col gap-1.5'
+      style={{
+        gridColumn: `span ${props.columnSpan || 1} / span ${props.columnSpan || 1}`,
+      }}
+    >
+      <div
+        slot='label'
+        className='flex items-center gap-1.5'
+      >
+        <Label
+          htmlFor={key}
+          aria-required={props.required}
+        >
+          {props.title} <span className='text-sm text-muted-foreground'>{!props.required ? "(optional)" : ""}</span>
+        </Label>
+        {props.description && (
+          <Tooltip>
+            <TooltipTrigger
+              onClick={(e) => e.preventDefault()}
+              className='cursor-default'
+            >
+              <Icon
+                name='Info'
+                size={"1rem"}
+                className='text-muted-foreground'
+              />
+            </TooltipTrigger>
+            <TooltipContent
+              side='right'
+              className='max-w-screen-sm'
+            >
+              <p className='max-w-screen-sm !whitespace-pre-wrap'>{props.description}</p>
+            </TooltipContent>
+          </Tooltip>
+        )}
+      </div>
+
+      <div
+        slot='input'
+        className='grid w-full grid-cols-6 gap-1.5'
+      >
+        <div className={cn("w-full", props.action ? "col-span-5" : "col-span-full")}>
+          {props.type === "text" || props.type === "password" || props.type === "number" ? (
+            <Input
+              id={key}
+              name={key}
+              type={props.type}
+              value={props.value as string}
+              readOnly={props.readOnly || false}
+              min={props.minMax?.min}
+              max={props.minMax?.max}
+              disabled={props.disabled}
+              placeholder={props.placeholder}
+              onChange={(e) => {
+                if (props.error) {
+                  props.onError?.("");
+                }
+                props.onValueChange(props.inputKey, e.target.value as ConfigurationValue<T, K>);
+              }}
+              onBlur={async () => {
+                try {
+                  props.onError?.("");
+
+                  if (props.required && !(props.value as string).trim()) {
+                    throw new Error(`${props.title} is required.`);
+                  }
+
+                  if (props.validation) {
+                    const result = await props.validation(props.value as string);
+                    if (!result.success) throw new Error(result.message);
+                  }
+                } catch (error) {
+                  const e = error as Error;
+                  props.onError?.(e.message);
+                }
+              }}
+            />
+          ) : (
+            props.type === "select" && (
+              <Select
+                disabled={props.disabled}
+                value={String(props.value)}
+                onValueChange={(value) => {
+                  props.onValueChange(props.inputKey, (value as string) === "true");
+                }}
+              >
+                <SelectTrigger>
+                  <SelectValue placeholder='Select an option' />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value='true'>Enabled</SelectItem>
+                  <SelectItem value='false'>Disabled</SelectItem>
+                </SelectContent>
+              </Select>
+            )
+          )}
+        </div>
+        {props.action && (
+          <ButtonLoading
+            variant={"secondary"}
+            onClick={props.action.onClick}
+            state={props.action.state}
+            icon={props.action.icon}
+          >
+            {props.action.label}
+          </ButtonLoading>
+        )}
+      </div>
+
+      <div slot='message'>
+        <span className={cn("block text-sm text-destructive", props.error ? "opacity-100" : "select-none opacity-0")}>
+          {props.error}
+        </span>
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/Guide/Configuration/Layout.tsx b/src/components/Guide/Configuration/Layout.tsx
new file mode 100644
index 0000000..789ad4a
--- /dev/null
+++ b/src/components/Guide/Configuration/Layout.tsx
@@ -0,0 +1,300 @@
+"use client";
+
+import { AsyncZippable, strToU8, zip } from "fflate";
+import { useMemo, useState } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+import { generateConfig } from "~/data/template";
+
+import { ButtonLoading, Loader, Markdown } from "~/components/Global";
+import { ConfigAPI, ConfigEnvironment, ConfigSite } from "~/components/Guide/Configuration";
+import { Button } from "~/components/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
+
+import useLoading from "~/hooks/useLoading";
+import { downloadBlob } from "~/utils/downloadBlob";
+
+import {
+  ButtonState,
+  ConfigurationCategory,
+  ConfigurationKeys,
+  ConfigurationValue,
+  Schema_App_Configuration,
+} from "~/types/schema";
+
+import config from "config";
+
+export default function ConfigurationForm() {
+  const loading = useLoading();
+  const initialConfiguration = useMemo<z.input<typeof Schema_App_Configuration>>(() => {
+    return {
+      environment: {
+        GD_SERVICE_B64: "",
+        ENCRYPTION_KEY: "",
+        SITE_PASSWORD: "",
+        NEXT_PUBLIC_DOMAIN: "",
+      },
+      api: {
+        ...config.apiConfig,
+        rootFolder: "",
+        isTeamDrive: false,
+        sharedDrive: "",
+        itemsPerPage: 50,
+        searchResult: 5,
+
+        proxyThumbnail: true,
+        streamMaxSize: 100 * 1024 * 1024,
+
+        allowDownloadProtectedFile: false,
+        temporaryTokenDuration: 6,
+        maxFileSize: 4 * 1024 * 1024,
+      },
+      site: {
+        ...config.siteConfig,
+        siteName: "next-gdrive-index",
+        siteNameTemplate: "%s - %t",
+        siteDescription: "A Google Drive Index built using Next.js",
+        siteAuthor: "mbahArip",
+        twitterHandle: "@mbahArip",
+
+        showFileExtension: false,
+        footer: ["{{ siteName }} *v{{ version }}* @ {{ repository }}", "{{ year }} - Made with ❤️ by **{{ author }}**"],
+
+        privateIndex: false,
+        breadcrumbMax: 3,
+
+        toaster: {
+          position: "bottom-right",
+          duration: 3000,
+        },
+
+        navbarItems: [],
+        supports: [],
+      },
+    };
+  }, []);
+  const [configuration, setConfiguration] = useState<z.input<typeof Schema_App_Configuration>>(initialConfiguration);
+  const [error, setError] = useState<Schema_App_Configuration_Error>({
+    environment: {},
+    api: {},
+    site: {},
+  });
+
+  const [downloadState, setDownloadState] = useState<ButtonState>("idle");
+
+  function onConfigurationChange<
+    T extends ConfigurationCategory = ConfigurationCategory,
+    K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+  >(category: T, key: K, value: ConfigurationValue<T, K>) {
+    setConfiguration((prev) => ({
+      ...prev,
+      [category]: {
+        ...prev[category],
+        [key]: value,
+      },
+    }));
+  }
+  function onErrorChange<
+    T extends ConfigurationCategory = ConfigurationCategory,
+    K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+  >(category: T, key: K, value: string) {
+    setError((prev) => ({
+      ...prev,
+      [category]: {
+        ...prev[category],
+        [key]: value,
+      },
+    }));
+  }
+
+  function onReset(category: ConfigurationCategory | "all") {
+    if (category === "all") {
+      setConfiguration(initialConfiguration);
+      setError({
+        environment: {},
+        api: {},
+        site: {},
+      });
+    } else {
+      setConfiguration((prev) => ({
+        ...prev,
+        [category]: initialConfiguration[category],
+      }));
+      setError((prev) => ({
+        ...prev,
+        [category]: {},
+      }));
+    }
+  }
+  async function onDownload(e: React.MouseEvent) {
+    e.preventDefault();
+    setDownloadState("loading");
+    toast.loading("Generating configuration file...", {
+      id: "generate-config",
+    });
+
+    try {
+      // Check required fields
+      const requiredEmpty = [
+        !configuration.environment.ENCRYPTION_KEY.length, // Encryption Key are required
+        !configuration.environment.GD_SERVICE_B64.length, // Service Account are required
+        !configuration.api.rootFolder.length, // Root Folder are required
+        configuration.api.isTeamDrive && !configuration.api.sharedDrive?.length, // If isTeamDrive, sharedDrive are required
+        !configuration.site.siteName.length, // Site Name are required
+        !configuration.site.siteDescription.length, // Site Description are required
+        configuration.site.privateIndex && !configuration.environment.SITE_PASSWORD?.length, // If privateIndex, SITE_PASSWORD are required
+      ];
+      if (requiredEmpty.filter((v) => v).length) {
+        throw new Error("Looks like you missed some required fields.");
+      }
+
+      const errors = [];
+      for (const err of Object.values(error.environment)) {
+        if (err) errors.push(err);
+      }
+      for (const err of Object.values(error.api)) {
+        if (err) errors.push(err);
+      }
+      for (const err of Object.values(error.site)) {
+        if (err) errors.push(err);
+      }
+      if (errors.length) {
+        throw new Error("Errors found in the configuration form. Please fix them first");
+      }
+
+      // Create string content
+      const envContent = Object.entries(configuration.environment)
+        .map(([key, value]) => `${key}=${value}`)
+        .join("\n");
+      const configContent = await generateConfig(configuration);
+
+      // Create zip structure
+      const structure: AsyncZippable = {
+        ".env": [
+          strToU8(envContent),
+          {
+            level: 6,
+          },
+        ],
+        "gIndex.config.ts": [
+          strToU8(configContent),
+          {
+            level: 6,
+          },
+        ],
+      };
+
+      zip(structure, {}, (err, data) => {
+        if (err) throw err;
+
+        const zipBlob = new Blob([data], { type: "application/zip" });
+        downloadBlob(zipBlob, `${Date.now()}__gIndex-config.zip`);
+        toast.success("Configuration file generated successfully", {
+          id: "generate-config",
+        });
+      });
+    } catch (error) {
+      const e = error as Error;
+      console.error(e);
+      toast.error(e.message, {
+        id: "generate-config",
+      });
+    } finally {
+      setDownloadState("idle");
+    }
+  }
+
+  if (loading)
+    return (
+      <Card>
+        <CardContent>
+          <Loader message='Loading configuration...' />
+        </CardContent>
+      </Card>
+    );
+
+  return (
+    <Card>
+      <CardHeader className='pb-0'>
+        <div className='flex items-end justify-between gap-3'>
+          <CardTitle id='config'>App Configuration</CardTitle>
+          <small className='text-muted-foreground'>v{config.version}</small>
+        </div>
+      </CardHeader>
+
+      <CardContent className='space-y-3 py-3'>
+        <Markdown
+          content={`This configuration only covering the most basic things you need to get started.
+You can check the configuration file itself to see all the available configuration. _(Each configuration has a description to help you understand it)_
+If you're migrating from previous version, you can load your old environment and config file to update the configuration.
+
+> If you found any bugs or issues with this configuration, please report it to the [issue tracker](https://github.com/mbahArip/next-gdrive-index/issues)
+> I'll try to fix it as soon as possible`}
+        />
+
+        <ConfigEnvironment
+          state={{
+            get: configuration,
+            set: onConfigurationChange,
+          }}
+          error={{
+            get: error.environment,
+            set: (key, value) => onErrorChange("environment", key, value),
+          }}
+          onReset={onReset}
+        />
+
+        <ConfigAPI
+          state={{
+            get: configuration,
+            set: onConfigurationChange,
+          }}
+          error={{
+            get: error.api,
+            set: (key, value) => onErrorChange("api", key, value),
+          }}
+          onReset={onReset}
+        />
+
+        <ConfigSite
+          state={{
+            get: configuration,
+            set: onConfigurationChange,
+          }}
+          error={{
+            get: error.site,
+            set: (key, value) => onErrorChange("site", key, value),
+          }}
+          onReset={onReset}
+        />
+
+        <div className='flex w-full flex-col gap-3 tablet:flex-row tablet:items-center tablet:justify-end'>
+          <Button
+            variant={"destructive"}
+            size={"sm"}
+            onClick={(e) => {
+              e.preventDefault();
+              onReset("all");
+            }}
+          >
+            Reset All
+          </Button>
+          <ButtonLoading
+            state={downloadState}
+            size={"sm"}
+            icon={"Save"}
+            onClick={onDownload}
+          >
+            Download Config
+          </ButtonLoading>
+        </div>
+      </CardContent>
+    </Card>
+  );
+}
+
+type Schema_App_Configuration_Error = {
+  environment: Partial<Record<ConfigurationKeys<"environment">, string>>;
+  api: Partial<Record<ConfigurationKeys<"api">, string>>;
+  site: Partial<Record<ConfigurationKeys<"site">, string>>;
+};
diff --git a/src/components/Guide/Configuration/SiteForm.tsx b/src/components/Guide/Configuration/SiteForm.tsx
new file mode 100644
index 0000000..99d7e2d
--- /dev/null
+++ b/src/components/Guide/Configuration/SiteForm.tsx
@@ -0,0 +1,226 @@
+import { FormEvent } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+
+import { Icon } from "~/components/Global";
+import { type ConfigInputs, ConfigurationHeader, ConfigurationInput } from "~/components/Guide/Configuration";
+import { Separator } from "~/components/ui/separator";
+
+import { ConfigurationCategory, ConfigurationKeys, ConfigurationValue, Schema_App_Configuration } from "~/types/schema";
+
+type Props = {
+  state: {
+    get: z.input<typeof Schema_App_Configuration>;
+    set: <
+      T extends ConfigurationCategory = ConfigurationCategory,
+      K extends ConfigurationKeys<T> = ConfigurationKeys<T>,
+    >(
+      category: T,
+      key: K,
+      value: ConfigurationValue<T, K>,
+    ) => void;
+  };
+  error: {
+    get: Partial<Record<ConfigurationKeys<"site">, string>>;
+    set: <T extends ConfigurationKeys<"site">>(key: T, value: string) => void;
+  };
+  onReset: (category: ConfigurationCategory | "all") => void;
+};
+
+export default function ConfigSite({ state: { get, set }, error, onReset }: Props) {
+  const metadataInputs: ConfigInputs<"site", ConfigurationKeys<"site">>[] = [
+    {
+      type: "text",
+      inputKey: "siteName",
+      title: "Site Name",
+      required: true,
+      value: get.site.siteName,
+      onValueChange: (key, value) => set("site", key, value),
+      error: error.get.siteName,
+      onError: (err) => error.set("siteName", err),
+    },
+    {
+      type: "text",
+      inputKey: "siteNameTemplate",
+      title: "Site Name Template",
+      description: `The template used to generate the site name
+      
+Available variables:
+%s - Page title
+%t - Site name`,
+      required: true,
+      value: get.site.siteNameTemplate,
+      onValueChange: (key, value) => set("site", key, value),
+      error: error.get.siteNameTemplate,
+      onError: (err) => error.set("siteNameTemplate", err),
+    },
+    {
+      type: "text",
+      inputKey: "siteDescription",
+      title: "Site Description",
+      required: true,
+      value: get.site.siteDescription,
+      onValueChange: (key, value) => set("site", key, value),
+      error: error.get.siteDescription,
+      onError: (err) => error.set("siteDescription", err),
+    },
+    {
+      type: "group",
+      inputKey: "author",
+      columns: 2,
+      children: [
+        {
+          type: "text",
+          inputKey: "siteAuthor",
+          title: "Site Author",
+          description: `Will be used for metadata, also affect the footer variable`,
+          value: get.site.siteAuthor,
+          onValueChange: (key, value) => set("site", key, value),
+          error: error.get.siteAuthor,
+          onError: (err) => error.set("siteAuthor", err),
+          placeholder: "Your username here",
+        },
+        {
+          type: "text",
+          inputKey: "twitterHandle",
+          title: "Twitter Handle",
+          description: `Will be used for metadata, also affect the footer variable`,
+          value: get.site.twitterHandle,
+          onValueChange: (key, value) => set("site", key, value),
+          error: error.get.twitterHandle,
+          onError: (err) => error.set("twitterHandle", err),
+          placeholder: "e.g. @__mbaharip__",
+        },
+      ],
+    },
+  ];
+  const inputs: ConfigInputs<"site", ConfigurationKeys<"site">>[] = [
+    {
+      type: "select",
+      inputKey: "privateIndex",
+      title: "Private Index",
+      description: `Lock the whole site behind a password
+Will use the Site Password in the Environment section`,
+      required: true,
+      value: get.site.privateIndex,
+      onValueChange: (key, value) => set("site", key, value),
+      error: error.get.privateIndex,
+      onError: (err) => error.set("privateIndex", err),
+    },
+    {
+      type: "select",
+      inputKey: "showFileExtension",
+      title: "Show File Extension",
+      description: `Show file extension in file explorer
+
+e.g. "file.mp4" instead of "file"`,
+      required: true,
+      value: get.site.showFileExtension,
+      onValueChange: (key, value) => set("site", key, value),
+      error: error.get.showFileExtension,
+      onError: (err) => error.set("showFileExtension", err),
+    },
+    {
+      type: "text",
+      inputKey: "favIcon",
+      title: "Favicon",
+      description: `The favicon of the site`,
+      required: true,
+      value: get.site.favIcon,
+      onValueChange: (key, value) => set("site", key, value),
+      error: error.get.favIcon,
+      onError: (err) => error.set("favIcon", err),
+    },
+  ];
+
+  function onFormReset(e: FormEvent<HTMLFormElement>) {
+    e.preventDefault();
+    onReset("site");
+    toast.success("Site section has been reset to default values.");
+  }
+
+  return (
+    <form
+      className='flex w-full flex-col gap-3 py-3'
+      onReset={onFormReset}
+    >
+      <ConfigurationHeader title='Site Configuration' />
+      <Separator />
+
+      <div
+        slot='inputs'
+        className='flex flex-col gap-3'
+      >
+        <div className='grid grid-cols-3 gap-3'>
+          <div className='col-span-2 flex flex-col gap-3'>
+            {metadataInputs.map((props, index) => (
+              <ConfigurationInput<"site", ConfigurationKeys<"site">>
+                key={String(props.inputKey)}
+                {...props}
+              />
+            ))}
+          </div>
+          <div className='flex flex-col gap-3'>
+            <div className='flex flex-col'>
+              <div className='flex flex-col items-start gap-1.5 pt-3'>
+                <div className='flex select-none items-center gap-1.5 rounded-t-lg border border-border px-3 py-1.5'>
+                  <img
+                    src={get.site.favIcon}
+                    className='size-4'
+                    alt='favicon'
+                  />
+                  <span className='text-sm'>{get.site.siteName}</span>
+                  <Icon
+                    name='X'
+                    size={"0.75rem"}
+                    className='text-muted-foreground'
+                  />
+                </div>
+
+                <div className='flex select-none items-center gap-1.5 rounded-t-lg border border-border px-3 py-1.5'>
+                  <img
+                    src={get.site.favIcon}
+                    className='size-4'
+                    alt='favicon'
+                  />
+                  <span className='text-sm'>
+                    {get.site.siteNameTemplate!.replace("%s", "Page Title").replace("%t", get.site.siteName)}
+                  </span>
+                  <Icon
+                    name='X'
+                    size={"0.75rem"}
+                    className='text-muted-foreground'
+                  />
+                </div>
+              </div>
+            </div>
+
+            <div className='h-fit select-none overflow-hidden rounded-md border bg-popover p-0 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2'>
+              <img
+                src={"/og.png"}
+                alt='Opengraph Preview'
+                className='w-full'
+              />
+              <div className='flex flex-col px-3 py-1.5'>
+                <span className='line-clamp-1 w-full text-lg font-medium'>
+                  {(get.site.siteNameTemplate || "%s").replace("%s", "Page Title").replace("%t", get.site.siteName)}
+                </span>
+                <span className='text-xs text-muted-foreground'>
+                  {get.environment.NEXT_PUBLIC_DOMAIN || "http://localhost:3000"}
+                </span>
+                <span className='line-clamp-2 text-sm text-muted-foreground'>{get.site.siteDescription}</span>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        {inputs.map((props, index) => (
+          <ConfigurationInput<"site", ConfigurationKeys<"site">>
+            key={String(props.inputKey)}
+            {...props}
+          />
+        ))}
+      </div>
+    </form>
+  );
+}
diff --git a/src/components/Guide/Configuration/index.tsx b/src/components/Guide/Configuration/index.tsx
new file mode 100644
index 0000000..21c10d4
--- /dev/null
+++ b/src/components/Guide/Configuration/index.tsx
@@ -0,0 +1,9 @@
+export { default as ConfigurationForm } from "./Layout";
+
+export { default as ConfigAPI } from "./ApiForm";
+export { default as ConfigEnvironment } from "./EnvironmentForm";
+export { default as ConfigSite } from "./SiteForm";
+
+export { default as ConfigurationHeader } from "./Header";
+export { default as ConfigurationInput } from "./Input";
+export type { ConfigInputs } from "./Input";
diff --git a/src/components/Guide/Theme/FormInputs.tsx b/src/components/Guide/Theme/FormInputs.tsx
new file mode 100644
index 0000000..0512f0f
--- /dev/null
+++ b/src/components/Guide/Theme/FormInputs.tsx
@@ -0,0 +1,201 @@
+import { Fragment } from "react";
+import { z } from "zod";
+
+import { ThemeInput, type ThemeInputProps } from "~/components/Guide/Theme";
+import { Input } from "~/components/ui/input";
+import { Separator } from "~/components/ui/separator";
+import { Slider } from "~/components/ui/slider";
+
+import { parseThemeValue } from "~/utils/parseConfigFile";
+
+import { Schema_Theme, ThemeKeys } from "~/types/schema";
+
+type Props = {
+  currentTheme: "light" | "dark";
+  state: {
+    get: {
+      light: z.input<typeof Schema_Theme>;
+      dark: z.input<typeof Schema_Theme>;
+    };
+    set: (theme: "light" | "dark", key: ThemeKeys, value: string) => void;
+  };
+};
+export default function ThemeFormInputs({ currentTheme, state: { get, set } }: Props) {
+  const inputs: ThemeInputProps[][] = [
+    [
+      {
+        inputKey: "background",
+        title: "Background",
+        value: parseThemeValue(get[currentTheme].background),
+        onChange: (val) => set(currentTheme, "background", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "foreground",
+        title: "Text",
+        value: parseThemeValue(get[currentTheme].foreground),
+        onChange: (val) => set(currentTheme, "foreground", `${val.h} ${val.s} ${val.l}`),
+      },
+    ],
+    [
+      {
+        inputKey: "card",
+        title: "Card",
+        value: parseThemeValue(get[currentTheme].card),
+        onChange: (val) => set(currentTheme, "card", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "card-foreground",
+        title: "Card Text",
+        value: parseThemeValue(get[currentTheme]["card-foreground"]),
+        onChange: (val) => set(currentTheme, "card-foreground", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "popover",
+        title: "Popover",
+        value: parseThemeValue(get[currentTheme].popover),
+        onChange: (val) => set(currentTheme, "popover", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "popover-foreground",
+        title: "Popover Text",
+        value: parseThemeValue(get[currentTheme]["popover-foreground"]),
+        onChange: (val) => set(currentTheme, "popover-foreground", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "accent",
+        title: "Accent",
+        value: parseThemeValue(get[currentTheme].accent),
+        onChange: (val) => set(currentTheme, "accent", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "accent-foreground",
+        title: "Accent Text",
+        value: parseThemeValue(get[currentTheme]["accent-foreground"]),
+        onChange: (val) => set(currentTheme, "accent-foreground", `${val.h} ${val.s} ${val.l}`),
+      },
+    ],
+    [
+      {
+        inputKey: "primary",
+        title: "Primary",
+        value: parseThemeValue(get[currentTheme].primary),
+        onChange: (val) => set(currentTheme, "primary", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "primary-foreground",
+        title: "Primary Text",
+        value: parseThemeValue(get[currentTheme]["primary-foreground"]),
+        onChange: (val) => set(currentTheme, "primary-foreground", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "secondary",
+        title: "Secondary",
+        value: parseThemeValue(get[currentTheme].secondary),
+        onChange: (val) => set(currentTheme, "secondary", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "secondary-foreground",
+        title: "Secondary Text",
+        value: parseThemeValue(get[currentTheme]["secondary-foreground"]),
+        onChange: (val) => set(currentTheme, "secondary-foreground", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "muted",
+        title: "Muted",
+        value: parseThemeValue(get[currentTheme].muted),
+        onChange: (val) => set(currentTheme, "muted", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "muted-foreground",
+        title: "Muted Text",
+        value: parseThemeValue(get[currentTheme]["muted-foreground"]),
+        onChange: (val) => set(currentTheme, "muted-foreground", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "destructive",
+        title: "Destructive",
+        value: parseThemeValue(get[currentTheme].destructive),
+        onChange: (val) => set(currentTheme, "destructive", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "destructive-foreground",
+        title: "Destructive Text",
+        value: parseThemeValue(get[currentTheme]["destructive-foreground"]),
+        onChange: (val) => set(currentTheme, "destructive-foreground", `${val.h} ${val.s} ${val.l}`),
+      },
+    ],
+    [
+      {
+        inputKey: "border",
+        title: "Element Border",
+        value: parseThemeValue(get[currentTheme].border),
+        onChange: (val) => set(currentTheme, "border", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "input",
+        title: "Input Border",
+        value: parseThemeValue(get[currentTheme].input),
+        onChange: (val) => set(currentTheme, "input", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "ring",
+        title: "Focus Ring",
+        value: parseThemeValue(get[currentTheme].ring),
+        onChange: (val) => set(currentTheme, "ring", `${val.h} ${val.s} ${val.l}`),
+      },
+      {
+        inputKey: "radius",
+        title: "Roundness",
+        value: { h: 0, s: 0, l: 0 },
+        onChange: (val) => {},
+        children: (
+          <div className='flex w-full items-center gap-3'>
+            <Slider
+              className='w-full'
+              defaultValue={[parseFloat(get[currentTheme].radius) * 16 || 0]}
+              min={0}
+              max={24}
+              value={[parseFloat(get[currentTheme].radius) * 16 || 0]}
+              onValueChange={(val) => {
+                const value = val[0] / 16;
+                set(currentTheme, "radius", `${value}rem`);
+              }}
+            />
+            <Input
+              value={parseFloat(get[currentTheme].radius) * 16 || 0}
+              onChange={(e) => {
+                const value = parseFloat(e.currentTarget.value) / 16;
+                set(currentTheme, "radius", `${value}rem`);
+              }}
+              type='number'
+              className='w-16 min-w-0 '
+              min={0}
+              max={24}
+            />
+          </div>
+        ),
+      },
+    ],
+  ];
+
+  return (
+    <div className='flex h-auto flex-grow flex-col justify-between gap-3'>
+      <div
+        slot='theme-form'
+        className='flex flex-col gap-1.5'
+      >
+        {inputs.map((item, i) => (
+          <Fragment key={`input-group-${i}`}>
+            {item.map((input) => (
+              <ThemeInput
+                key={input.inputKey}
+                {...input}
+              />
+            ))}
+            {i !== inputs.length - 1 && <Separator className='my-1.5' />}
+          </Fragment>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/Guide/Theme/Input.tsx b/src/components/Guide/Theme/Input.tsx
new file mode 100644
index 0000000..cd7994b
--- /dev/null
+++ b/src/components/Guide/Theme/Input.tsx
@@ -0,0 +1,207 @@
+"use client";
+
+import { PopoverTrigger } from "@radix-ui/react-popover";
+import { HslColor, HslColorPicker } from "react-colorful";
+import toast from "react-hot-toast";
+import { z } from "zod";
+
+import { ButtonLoading, Icon } from "~/components/Global";
+import { Input } from "~/components/ui/input";
+import { Label } from "~/components/ui/label";
+import { Popover, PopoverContent } from "~/components/ui/popover";
+import { Tooltip, TooltipContent, TooltipTrigger } from "~/components/ui/tooltip";
+
+import { Schema_Theme } from "~/types/schema";
+
+export type ThemeInputProps = {
+  inputKey: keyof z.infer<typeof Schema_Theme>;
+  title: string;
+  description?: string;
+  value: HslColor;
+  onChange: (color: HslColor) => void;
+  children?: React.ReactNode;
+};
+export default function ThemeInput(props: ThemeInputProps) {
+  return (
+    <div
+      id={props.inputKey}
+      slot={`input-${props.inputKey}`}
+      className='grid w-full grid-cols-3 gap-6'
+    >
+      <div
+        slot='label'
+        className='flex items-center gap-3'
+      >
+        <span className='text-base'>{props.title}</span>
+        {props.description && (
+          <Tooltip>
+            <TooltipTrigger
+              onClick={(e) => e.preventDefault()}
+              className='cursor-default'
+            >
+              <Icon
+                name='Info'
+                size='1rem'
+                className='text-muted-foreground'
+              />
+            </TooltipTrigger>
+            <TooltipContent
+              side='right'
+              className='max-w-screen-sm'
+            >
+              <p className='max-w-screen-sm !whitespace-pre-wrap'>{props.description}</p>
+            </TooltipContent>
+          </Tooltip>
+        )}
+      </div>
+
+      <div
+        slot='input'
+        className='col-span-2 flex flex-grow items-center justify-end gap-3'
+      >
+        {props.children ? (
+          props.children
+        ) : (
+          <>
+            <span className='select-none text-sm text-muted-foreground'>
+              hsl({props.value.h}, {props.value.s}%, {props.value.l}%)
+            </span>
+            <Popover>
+              <PopoverTrigger>
+                <div className='size-8 rounded-[var(--radius)] border border-border p-0.5'>
+                  <div
+                    className='size-full rounded-[calc(var(--radius)-0.125rem)]'
+                    style={{
+                      background: `hsl(${props.value.h}, ${props.value.s}%, ${props.value.l}%)`,
+                    }}
+                  />
+                </div>
+              </PopoverTrigger>
+              <PopoverContent className='flex flex-col gap-3'>
+                <div className='flex gap-6'>
+                  <HslColorPicker
+                    color={props.value}
+                    onChange={props.onChange}
+                  />
+                  <div className='flex flex-grow flex-col items-center justify-between'>
+                    <div className='flex flex-col gap-1.5'>
+                      <Label htmlFor={`${props.inputKey}-h`}>Hue</Label>
+                      <Input
+                        id={`${props.inputKey}-h`}
+                        name={`${props.inputKey}-h`}
+                        type='number'
+                        value={props.value.h}
+                        min={0}
+                        max={360}
+                        onChange={(e) => {
+                          const value = props.value;
+                          props.onChange({
+                            h: Number(e.target.value),
+                            s: value.s,
+                            l: value.l,
+                          });
+                        }}
+                      />
+                    </div>
+                    <div className='flex flex-col gap-1.5'>
+                      <Label htmlFor={`${props.inputKey}-s`}>Saturation</Label>
+                      <Input
+                        id={`${props.inputKey}-s`}
+                        name={`${props.inputKey}-s`}
+                        type='number'
+                        value={props.value.s}
+                        min={0}
+                        max={100}
+                        onChange={(e) => {
+                          const value = props.value;
+                          props.onChange({
+                            h: value.h,
+                            s: Number(e.target.value),
+                            l: value.l,
+                          });
+                        }}
+                      />
+                    </div>
+                    <div className='flex flex-col gap-1.5'>
+                      <Label htmlFor={`${props.inputKey}-l`}>Lightness</Label>
+                      <Input
+                        id={`${props.inputKey}-l`}
+                        name={`${props.inputKey}-l`}
+                        type='number'
+                        value={props.value.l}
+                        min={0}
+                        max={100}
+                        onChange={(e) => {
+                          const value = props.value;
+                          props.onChange({
+                            h: value.h,
+                            s: value.s,
+                            l: Number(e.target.value),
+                          });
+                        }}
+                      />
+                    </div>
+                  </div>
+                </div>
+                <div className='flex w-full items-center gap-3'>
+                  <ButtonLoading
+                    className='w-full'
+                    size={"sm"}
+                    variant={"outline"}
+                    state='idle'
+                    onClick={async (e) => {
+                      e.preventDefault();
+                      try {
+                        const text = `hsl(${props.value.h}, ${props.value.s}%, ${props.value.l}%)`;
+                        await navigator.clipboard.writeText(text);
+                        toast.success(`${props.title} color copied!`);
+                      } catch (error) {
+                        const e = error as Error;
+                        console.error(e);
+                        toast.error(e.message);
+                      }
+                    }}
+                  >
+                    Copy
+                  </ButtonLoading>
+                  <ButtonLoading
+                    className='w-full'
+                    size={"sm"}
+                    variant={"outline"}
+                    state='idle'
+                    onClick={async (e) => {
+                      e.preventDefault();
+                      try {
+                        const text = await navigator.clipboard.readText();
+                        const color = text.match(
+                          /\bhsl\(\s*(\d+)\s*,\s*(\d+(?:\.\d+)?)\s*%\s*,\s*(\d+(?:\.\d+)?)\s*%\s*\)/,
+                        );
+                        if (!color) {
+                          throw new Error("Color does not match the format!");
+                        }
+                        const h = Number(color[1]);
+                        const s = Number(color[2]);
+                        const l = Number(color[3]);
+                        if (isNaN(h) || isNaN(s) || isNaN(l)) {
+                          throw new Error("HSL values are not numbers!");
+                        }
+                        props.onChange({ h, s, l });
+                        toast.success(`Color pasted!`);
+                      } catch (error) {
+                        const e = error as Error;
+                        console.error(e);
+                        toast.error(e.message);
+                      }
+                    }}
+                  >
+                    Paste
+                  </ButtonLoading>
+                </div>
+              </PopoverContent>
+            </Popover>
+          </>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/Guide/Theme/Layout.tsx b/src/components/Guide/Theme/Layout.tsx
new file mode 100644
index 0000000..4ff9a19
--- /dev/null
+++ b/src/components/Guide/Theme/Layout.tsx
@@ -0,0 +1,427 @@
+"use client";
+
+import Link from "next/link";
+import { useMemo, useState } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+import { generateTheme } from "~/data/template";
+
+import { ButtonLoading, Icon, Loader, Markdown } from "~/components/Global";
+import { FormInputs, ThemePreview } from "~/components/Guide/Theme";
+import { Button } from "~/components/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "~/components/ui/dialog";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "~/components/ui/dropdown-menu";
+import { Textarea } from "~/components/ui/textarea";
+
+import useLoading from "~/hooks/useLoading";
+import { downloadBlob } from "~/utils/downloadBlob";
+import { fileLoadHelper } from "~/utils/fileLoadHelper";
+import { parseThemeValue } from "~/utils/parseConfigFile";
+
+import { ButtonState, Schema_Theme, ThemeKeys } from "~/types/schema";
+
+export default function ThemeForm() {
+  const loading = useLoading();
+
+  const initialTheme = useMemo<Record<"light" | "dark", z.input<typeof Schema_Theme>>>(
+    () => ({
+      light: {
+        "background": "0 0% 100%",
+        "foreground": "0 0% 3.9%",
+        "card": "0 0% 100%",
+        "card-foreground": "0 0% 3.9%",
+        "popover": "0 0% 100%",
+        "popover-foreground": "0 0% 3.9%",
+        "primary": "0 0% 9%",
+        "primary-foreground": "0 0% 98%",
+        "secondary": "0 0% 96.1%",
+        "secondary-foreground": "0 0% 9%",
+        "muted": "0 0% 96.1%",
+        "muted-foreground": "0 0% 45.1%",
+        "accent": "0 0% 96.1%",
+        "accent-foreground": "0 0% 9%",
+        "destructive": "0 84.2% 60.2%",
+        "destructive-foreground": "0 0% 98%",
+        "border": "0 0% 89.8%",
+        "input": "0 0% 89.8%",
+        "ring": "0 0% 89.8%",
+        "radius": "0.5rem",
+      },
+      dark: {
+        "background": "0 0% 3.9%",
+        "foreground": "0 0% 98%",
+        "card": "0 0% 3.9%",
+        "card-foreground": "0 0% 98%",
+        "popover": "0 0% 3.9%",
+        "popover-foreground": "0 0% 98%",
+        "primary": "0 0% 98%",
+        "primary-foreground": "0 0% 9%",
+        "secondary": "0 0% 14.9%",
+        "secondary-foreground": "0 0% 98%",
+        "muted": "0 0% 14.9%",
+        "muted-foreground": "0 0% 63.9%",
+        "accent": "0 0% 14.9%",
+        "accent-foreground": "0 0% 98%",
+        "destructive": "0 62.8% 30.6%",
+        "destructive-foreground": "0 0% 98%",
+        "border": "0 0% 14.9%",
+        "input": "0 0% 14.9%",
+        "ring": "0 0% 14.9%",
+        "radius": "0.5rem",
+      },
+    }),
+    [],
+  );
+  const [currentTheme, setCurrentTheme] = useState<"light" | "dark">("light");
+  const [theme, setTheme] = useState<Record<"light" | "dark", z.input<typeof Schema_Theme>>>(initialTheme);
+
+  const [codeValue, setCodeValue] = useState<string>("");
+  const [pasteDialog, setPasteDialog] = useState<boolean>(false);
+  const [pasteState, setPasteState] = useState<ButtonState>("idle");
+
+  const [downloadState, setDownloadState] = useState<ButtonState>("idle");
+  const [resetState, setResetState] = useState<ButtonState>("idle");
+
+  function assignTheme(theme: "light" | "dark", values: string[]) {
+    for (const value of values) {
+      const [k, v] = value.split(":").map((v) => v.replace("--", "").trim());
+      if (k === "radius") {
+        onThemeChange(theme, k as ThemeKeys, v.replace(";", ""));
+      } else {
+        const color = parseThemeValue(v);
+        if (!color) continue;
+        onThemeChange(theme, k as ThemeKeys, `${color.h} ${color.s}% ${color.l}%`);
+      }
+    }
+  }
+  function onLoadCSS() {
+    fileLoadHelper({
+      accept: ".css",
+      async onLoad(result) {
+        const themeRegex = /\/\* Shadcn\/ui theme \*\/.*?\:root \{(.*?)\}.*?.dark \{(.*?) \}/gm;
+        const themeMatch = themeRegex.exec(result.replace(/\r?\n?/g, ""));
+        if (!themeMatch) return toast.error("Can't find theme, are you sure it's the right file?");
+
+        const light = themeMatch[1]
+          .replace(/\s{2,4}/g, "\n")
+          .split("\n")
+          .map((v) => v.trim())
+          .filter((v) => v.length && (v.startsWith("/*") && v.endsWith("*/") ? false : true));
+        const dark = themeMatch[2]
+          .replace(/\s{2,4}/g, "\n")
+          .split("\n")
+          .map((v) => v.trim())
+          .filter((v) => v.length && (v.startsWith("/*") && v.endsWith("*/") ? false : true));
+
+        if (!light || !dark)
+          return toast.error("File loaded doesn't seem like shadcn theme, are you sure it's the right file?");
+
+        assignTheme("light", light);
+        assignTheme("dark", dark);
+
+        toast.success("Theme loaded successfully");
+      },
+    });
+  }
+  function onLoadCode(value: string) {
+    const themeRegex = /\@layer base.*?\:root \{(.*?)\}.*?.dark \{(.*?) \}/gm;
+    const themeMatch = themeRegex.exec(value.replace(/\r\n/g, ""));
+    if (!themeMatch) throw new Error("Unknown format, make sure it's satisfies the shadcn/ui theme format");
+
+    const light = themeMatch[1]
+      .replace(/\s{2,4}/g, "\n")
+      .split("\n")
+      .map((v) => v.trim())
+      .filter((v) => v.length && (v.startsWith("/*") && v.endsWith("*/") ? false : true));
+    const dark = themeMatch[2]
+      .replace(/\s{2,4}/g, "\n")
+      .split("\n")
+      .map((v) => v.trim())
+      .filter((v) => v.length && (v.startsWith("/*") && v.endsWith("*/") ? false : true));
+
+    if (!light || !dark) throw new Error("It doesn't seem like shadcn theme, are you sure it's the right format?");
+
+    assignTheme("light", light);
+    assignTheme("dark", dark);
+
+    toast.success("Theme loaded successfully");
+  }
+  function onThemeChange(theme: "light" | "dark", key: ThemeKeys, value: string) {
+    setTheme((prev) => ({
+      ...prev,
+      [theme]: {
+        ...prev[theme],
+        [key]: value,
+      },
+    }));
+  }
+
+  async function onDownload(copy?: boolean) {
+    setDownloadState("loading");
+    try {
+      const generated = generateTheme(theme);
+      if (copy) {
+        await navigator.clipboard.writeText(generated);
+        return toast.success("Theme copied to clipboard");
+      }
+
+      const blob = new Blob([generated], { type: "text/css" });
+      downloadBlob(blob, "globals.css");
+      toast.success("Theme downloaded successfully");
+    } catch (error) {
+      const e = error as Error;
+      console.error(e);
+      toast.error(e.message);
+    } finally {
+      setDownloadState("idle");
+    }
+  }
+  async function onReset() {
+    setResetState("loading");
+    try {
+      setTheme(initialTheme);
+      toast.success("Theme reset to default");
+    } catch (error) {
+      const e = error as Error;
+      console.error(e);
+      toast.error(e.message);
+    } finally {
+      setResetState("idle");
+    }
+  }
+
+  if (loading)
+    return (
+      <Card>
+        <CardContent>
+          <Loader message='Loading theme...' />
+        </CardContent>
+      </Card>
+    );
+
+  return (
+    <>
+      <Card>
+        <CardHeader className='pb-0'>
+          <div className='flex items-center justify-between gap-3'>
+            <CardTitle id='theme'>Theme Customization</CardTitle>
+            <div
+              slot='actions'
+              className='flex w-full items-center gap-3 tablet:w-fit'
+            >
+              <Dialog
+                open={pasteDialog}
+                onOpenChange={setPasteDialog}
+              >
+                <DialogTrigger>
+                  <></>
+                </DialogTrigger>
+                <DialogContent>
+                  <DialogHeader>
+                    <DialogTitle>Paste CSS Code</DialogTitle>
+                    <DialogDescription>
+                      Paste the CSS code from your theme file
+                      <br />
+                      <Link
+                        href={"https://ui.shadcn.com/themes"}
+                        target='_blank'
+                        className='text-blue-600 opacity-80 transition-all duration-300 hover:opacity-100 dark:text-blue-400'
+                      >
+                        Get themes from shadcn/ui
+                      </Link>
+                    </DialogDescription>
+                  </DialogHeader>
+
+                  <form
+                    className='space-y-3'
+                    onSubmit={(e) => {
+                      e.preventDefault();
+                      setPasteState("loading");
+
+                      try {
+                        if (!codeValue) throw new Error("No CSS code provided");
+
+                        const flatten = codeValue.replace(/\r\n/g, "");
+                        onLoadCode(flatten);
+                        setPasteDialog(false);
+                      } catch (error) {
+                        const e = error as Error;
+                        console.error(e);
+                        toast.error(e.message);
+                      } finally {
+                        setPasteState("idle");
+                      }
+                    }}
+                  >
+                    <Textarea
+                      id='css-paste'
+                      name='css-paste'
+                      className='w-full'
+                      rows={10}
+                      placeholder='Paste your CSS code here'
+                      value={codeValue}
+                      onChange={(e) => setCodeValue(e.target.value)}
+                    />
+
+                    <DialogFooter>
+                      <DialogClose asChild>
+                        <Button
+                          size={"sm"}
+                          variant={"destructive"}
+                          type='reset'
+                        >
+                          Cancel
+                        </Button>
+                      </DialogClose>
+                      <ButtonLoading
+                        state={pasteState}
+                        size={"sm"}
+                        type='submit'
+                        icon='Save'
+                      >
+                        Load Theme
+                      </ButtonLoading>
+                    </DialogFooter>
+                  </form>
+                </DialogContent>
+              </Dialog>
+
+              <DropdownMenu>
+                <DropdownMenuTrigger asChild>
+                  <Button
+                    variant={"outline"}
+                    size={"sm"}
+                  >
+                    <Icon
+                      name='Import'
+                      size={"1rem"}
+                      className='mr-2'
+                    />
+                    Import Theme
+                  </Button>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent>
+                  <DropdownMenuItem onClick={onLoadCSS}>
+                    <Icon
+                      name='Upload'
+                      size={"1rem"}
+                      className='mr-2'
+                    />
+                    Load from file
+                  </DropdownMenuItem>
+                  <DropdownMenuItem
+                    onClick={async () => {
+                      // setPasteDialog(true);
+                      const themeRegex = /\@layer base \{\s+\:root \{\s+.*\}  \.dark \{\s+.*\}/gm;
+                      const clipboard = await navigator.clipboard.readText();
+                      if (clipboard) {
+                        const flattenClipboard = clipboard.replace(/\r\n/g, "").trim();
+                        const match = themeRegex.exec(flattenClipboard);
+                        if (match) {
+                          setCodeValue(clipboard.trim());
+                          toast.success("Theme found in clipboard! Click 'Load Theme' to apply it");
+                        }
+                      }
+
+                      setPasteDialog(true);
+                    }}
+                  >
+                    <Icon
+                      name='Code'
+                      size={"1rem"}
+                      className='mr-2'
+                    />
+                    Paste CSS code
+                  </DropdownMenuItem>
+                </DropdownMenuContent>
+              </DropdownMenu>
+            </div>
+          </div>
+        </CardHeader>
+
+        <CardContent className='space-y-3 py-3'>
+          <Markdown
+            content={`You can personalize the theme of your index by changing the color of the elements.
+You can either use default colors from [shadcn/ui](https://ui.shadcn.com/themes) or create your own theme by changing the color code of each element.`}
+          />
+
+          <div className='flex w-full items-center justify-between gap-3'>
+            <div className='flex items-center'>
+              <Button
+                size={"sm"}
+                variant={currentTheme === "light" ? "default" : "outline"}
+                className='rounded-r-none'
+                onClick={() => setCurrentTheme("light")}
+              >
+                <Icon
+                  name='Sun'
+                  size='1rem'
+                  className='mr-2'
+                />
+                Light theme
+              </Button>
+              <Button
+                size={"sm"}
+                variant={currentTheme === "dark" ? "default" : "outline"}
+                className='rounded-l-none'
+                onClick={() => setCurrentTheme("dark")}
+              >
+                <Icon
+                  name='Moon'
+                  size='1rem'
+                  className='mr-2'
+                />
+                Dark theme
+              </Button>
+            </div>
+
+            <div className='flex items-center gap-3'>
+              <ButtonLoading
+                size={"sm"}
+                state={downloadState}
+                icon={"Save"}
+                onClick={() => onDownload()}
+              >
+                Download theme
+              </ButtonLoading>
+              <ButtonLoading
+                size={"sm"}
+                state={resetState}
+                variant={"destructive"}
+                icon='History'
+                onClick={onReset}
+              >
+                Reset theme
+              </ButtonLoading>
+            </div>
+          </div>
+          <div className='grid grid-cols-1 gap-3 rounded-[var(--radius)] border border-border p-4 tablet:grid-cols-2'>
+            <FormInputs
+              currentTheme={currentTheme}
+              state={{
+                get: theme,
+                set: onThemeChange,
+              }}
+            />
+            <ThemePreview theme={theme[currentTheme]} />
+          </div>
+        </CardContent>
+      </Card>
+    </>
+  );
+}
diff --git a/src/components/Guide/Theme/Preview.tsx b/src/components/Guide/Theme/Preview.tsx
new file mode 100644
index 0000000..5d9d9bd
--- /dev/null
+++ b/src/components/Guide/Theme/Preview.tsx
@@ -0,0 +1,304 @@
+"use client";
+
+import { PopoverTrigger } from "@radix-ui/react-popover";
+import NextTopLoader from "nextjs-toploader";
+import nProgress from "nprogress";
+import { useMemo, useState } from "react";
+import toast from "react-hot-toast";
+import { z } from "zod";
+
+import { Grid as FileGrid, List as FileList } from "~/components/Explorer";
+import { ButtonLoading } from "~/components/Global";
+import { Button } from "~/components/ui/button";
+import { Dialog, DialogContent, DialogTrigger } from "~/components/ui/dialog";
+import {
+  Drawer,
+  DrawerContent,
+  DrawerDescription,
+  DrawerHeader,
+  DrawerTitle,
+  DrawerTrigger,
+} from "~/components/ui/drawer";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "~/components/ui/dropdown-menu";
+import { Input } from "~/components/ui/input";
+import { Popover, PopoverContent } from "~/components/ui/popover";
+import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle, SheetTrigger } from "~/components/ui/sheet";
+import { Textarea } from "~/components/ui/textarea";
+import { Tooltip, TooltipContent, TooltipTrigger } from "~/components/ui/tooltip";
+
+import { cn } from "~/utils/cn";
+
+import { ButtonState, Schema_File, Schema_Theme } from "~/types/schema";
+
+type Props = {
+  theme: z.input<typeof Schema_Theme>;
+};
+export default function ThemePreview({ theme }: Props) {
+  const fileMockData = useMemo<z.infer<typeof Schema_File>>(
+    () => ({
+      encryptedId: "1",
+      name: "File Name",
+      modifiedTime: "2021-09-01T00:00:00.000Z",
+      mimeType: "text/plain",
+      trashed: false,
+      size: 1024 * 1024 * 100,
+    }),
+    [],
+  );
+  const [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);
+  const [toastState, setToastState] = useState<ButtonState>("idle");
+  const [loadingState, setLoadingState] = useState<ButtonState>("idle");
+
+  return (
+    <div
+      slot='container'
+      className='overflow-hidden rounded-[var(--radius)] border border-border'
+    >
+      <div
+        slot='preview'
+        ref={setPortalContainer}
+        className='preview flex flex-col gap-3 bg-background p-3 text-foreground'
+        style={
+          {
+            "--background": theme.background,
+            "--foreground": theme.foreground,
+            "--card": theme.card,
+            "--card-foreground": theme["card-foreground"],
+            "--popover": theme.popover,
+            "--popover-foreground": theme["popover-foreground"],
+            "--primary": theme.primary,
+            "--primary-foreground": theme["primary-foreground"],
+            "--secondary": theme.secondary,
+            "--secondary-foreground": theme["secondary-foreground"],
+            "--muted": theme.muted,
+            "--muted-foreground": theme["muted-foreground"],
+            "--accent": theme.accent,
+            "--accent-foreground": theme["accent-foreground"],
+            "--destructive": theme.destructive,
+            "--destructive-foreground": theme["destructive-foreground"],
+            "--border": theme.border,
+            "--input": theme.input,
+            "--ring": theme.ring,
+            "--radius": theme.radius,
+          } as React.CSSProperties
+        }
+      >
+        <Wrapper
+          title='Button'
+          extra={`Primary, Secondary, Accent, Destructive, Input Border`}
+          className='grid grid-cols-3 gap-1.5'
+        >
+          {["default", "secondary", "destructive", "outline", "ghost", "link"].map((btn) => (
+            <Button
+              key={btn}
+              size={"sm"}
+              variant={btn as any}
+              onClick={(e) => e.preventDefault()}
+              className='capitalize'
+            >
+              {btn}
+            </Button>
+          ))}
+        </Wrapper>
+
+        <Wrapper
+          title='Input'
+          extra={`Muted, Input Border`}
+          className='space-y-1.5'
+        >
+          <Input placeholder='Input' />
+          <Textarea placeholder='Textarea' />
+        </Wrapper>
+
+        <Wrapper
+          title='Popover'
+          extra={`Popover, Element Border`}
+          className='grid grid-cols-3 gap-1.5'
+        >
+          <Tooltip>
+            <TooltipTrigger asChild>
+              <Button
+                size={"sm"}
+                variant={"outline"}
+                className='w-full'
+              >
+                Hover me
+              </Button>
+            </TooltipTrigger>
+            <TooltipContent>
+              <p>Hello</p>
+            </TooltipContent>
+          </Tooltip>
+
+          <Popover>
+            <PopoverTrigger asChild>
+              <Button
+                size={"sm"}
+                variant={"outline"}
+                className='w-full'
+              >
+                Click me
+              </Button>
+            </PopoverTrigger>
+            <PopoverContent portal={portalContainer}>
+              <p>Hello</p>
+            </PopoverContent>
+          </Popover>
+
+          <DropdownMenu>
+            <DropdownMenuTrigger asChild>
+              <Button
+                size={"sm"}
+                variant={"outline"}
+                className='w-full'
+              >
+                Dropdown
+              </Button>
+            </DropdownMenuTrigger>
+            <DropdownMenuContent portal={portalContainer}>
+              <DropdownMenuItem>Item 1</DropdownMenuItem>
+              <DropdownMenuItem>Item 2</DropdownMenuItem>
+              <DropdownMenuItem disabled>Item 3</DropdownMenuItem>
+            </DropdownMenuContent>
+          </DropdownMenu>
+        </Wrapper>
+
+        <Wrapper
+          title='Overlay'
+          extra={`Background, Primary, Muted, Element Border`}
+          className='grid grid-cols-3 gap-1.5'
+        >
+          <Dialog>
+            <DialogTrigger asChild>
+              <Button
+                size='sm'
+                variant='outline'
+                className='w-full'
+              >
+                Open Dialog
+              </Button>
+            </DialogTrigger>
+            <DialogContent portal={portalContainer}>Dialog Content</DialogContent>
+          </Dialog>
+
+          <Drawer>
+            <DrawerTrigger asChild>
+              <Button
+                size='sm'
+                variant='outline'
+                className='w-full'
+              >
+                Open Drawer
+              </Button>
+            </DrawerTrigger>
+            <DrawerContent portal={portalContainer}>
+              <DrawerHeader>
+                <DrawerTitle>Drawer Title</DrawerTitle>
+                <DrawerDescription>Description</DrawerDescription>
+              </DrawerHeader>
+              <div className='p-6'>Drawer only used for mobile devices</div>
+            </DrawerContent>
+          </Drawer>
+
+          <Sheet>
+            <SheetTrigger asChild>
+              <Button
+                size='sm'
+                variant='outline'
+                className='w-full'
+              >
+                Open Sheet
+              </Button>
+            </SheetTrigger>
+            <SheetContent portal={portalContainer}>
+              <SheetHeader>
+                <SheetTitle>Sheet Title</SheetTitle>
+                <SheetDescription>Description</SheetDescription>
+              </SheetHeader>
+              <div>Sheet only used for mobile devices</div>
+            </SheetContent>
+          </Sheet>
+
+          <ButtonLoading
+            size='sm'
+            variant='outline'
+            className='w-full'
+            state={toastState}
+            onClick={async (e) => {
+              e.preventDefault();
+              setToastState("loading");
+              const style = {
+                background: `hsl(${theme.background})`,
+                color: `hsl(${theme.foreground})`,
+                borderRadius: `var(${theme.radius})`,
+                border: `1px solid hsl(${theme.border})`,
+              };
+              toast.loading("Toast!", { duration: 1500, style });
+              toast.success("Toast!", { duration: 1500, style });
+              toast.error("Toast!", { duration: 1500, style });
+
+              await new Promise((resolve) => setTimeout(resolve, 1500));
+              setToastState("idle");
+            }}
+          >
+            Toast!
+          </ButtonLoading>
+          <NextTopLoader color={`hsl(${theme.primary})`} />
+          <ButtonLoading
+            size={"sm"}
+            variant={"outline"}
+            className={"w-full"}
+            state={loadingState}
+            onClick={async (e) => {
+              e.preventDefault();
+              setLoadingState("loading");
+
+              nProgress.start();
+              await new Promise((resolve) => setTimeout(resolve, 1500));
+              nProgress.done();
+              setLoadingState("idle");
+            }}
+          >
+            Loading bar
+          </ButtonLoading>
+        </Wrapper>
+
+        <Wrapper
+          title='File'
+          className='grid grid-cols-1 gap-1.5'
+        >
+          <FileList
+            data={fileMockData}
+            disabled
+          />
+          <FileGrid
+            data={fileMockData}
+            disabled
+          />
+        </Wrapper>
+      </div>
+    </div>
+  );
+}
+
+type WrapperProps = {
+  title: string;
+  extra?: string;
+  className?: string;
+};
+function Wrapper({ title, extra, className, children }: React.PropsWithChildren<WrapperProps>) {
+  return (
+    <div className='flex w-full flex-col gap-3'>
+      <div className='flex flex-col'>
+        <h3>{title}</h3>
+        {extra && <p className='text-xs opacity-50'>{extra}</p>}
+      </div>
+      <div className={cn("w-full", className)}>{children}</div>
+    </div>
+  );
+}
diff --git a/src/components/Guide/Theme/index.tsx b/src/components/Guide/Theme/index.tsx
new file mode 100644
index 0000000..c13224e
--- /dev/null
+++ b/src/components/Guide/Theme/index.tsx
@@ -0,0 +1,5 @@
+export { default as FormInputs } from "./FormInputs";
+export { default as ThemeInput } from "./Input";
+export type { ThemeInputProps } from "./Input";
+export { default as ThemeForm } from "./Layout";
+export { default as ThemePreview } from "./Preview";
diff --git a/src/components/Guide/index.tsx b/src/components/Guide/index.tsx
new file mode 100644
index 0000000..430a580
--- /dev/null
+++ b/src/components/Guide/index.tsx
@@ -0,0 +1,2 @@
+export * from "./Configuration";
+export * from "./Theme";
diff --git a/src/app/@footer.tsx b/src/components/Layout/Footer.tsx
similarity index 97%
rename from src/app/@footer.tsx
rename to src/components/Layout/Footer.tsx
index 3287b41..ef4bf45 100644
--- a/src/app/@footer.tsx
+++ b/src/components/Layout/Footer.tsx
@@ -3,7 +3,7 @@
 import ReactMarkdown from "react-markdown";
 import remarkBreaks from "remark-breaks";
 
-import isDev from "~/utils/isDev";
+import { isDev } from "~/utils/isDev";
 
 type Props = {
   content: string;
diff --git a/src/app/@navbar.tsx b/src/components/Layout/Navbar.tsx
similarity index 86%
rename from src/app/@navbar.tsx
rename to src/components/Layout/Navbar.tsx
index 5aee01b..60cf708 100644
--- a/src/app/@navbar.tsx
+++ b/src/components/Layout/Navbar.tsx
@@ -1,14 +1,12 @@
 "use client";
 
-import { TooltipTrigger } from "@radix-ui/react-tooltip";
 import { useTheme } from "next-themes";
 import Link from "next/link";
 import { usePathname, useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
 import toast from "react-hot-toast";
-import { cn } from "~/utils";
 
-import Icon from "~/components/Icon";
+import { Icon } from "~/components/Global";
 import { Button } from "~/components/ui/button";
 import {
   Dialog,
@@ -36,19 +34,15 @@ import {
   DropdownMenuTrigger,
 } from "~/components/ui/dropdown-menu";
 import { Separator } from "~/components/ui/separator";
-import {
-  Sheet,
-  SheetContent,
-  SheetFooter,
-  SheetTrigger,
-} from "~/components/ui/sheet";
-import { Tooltip, TooltipContent } from "~/components/ui/tooltip";
+import { Sheet, SheetContent, SheetFooter, SheetTrigger } from "~/components/ui/sheet";
+import { Tooltip, TooltipContent, TooltipTrigger } from "~/components/ui/tooltip";
+
+import { cn } from "~/utils/cn";
 
 import useMediaQuery from "~/hooks/useMediaQuery";
 
-import config from "~/config/gIndex.config";
-
-import { ClearPassword } from "./actions";
+import { ClearPassword } from "actions";
+import config from "config";
 
 export default function Navbar() {
   const pathname = usePathname();
@@ -86,19 +80,13 @@ export default function Navbar() {
         slot='nav'
         className={cn(
           "bg-background",
-          // "sticky left-0 top-0",
           "h-12 w-full",
           "px-6 py-3",
           "flex flex-grow flex-row items-center justify-between",
           "border-b border-border",
         )}
       >
-        <div
-          className={cn(
-            "flex flex-row items-center justify-between",
-            "mx-auto w-full max-w-screen-desktop",
-          )}
-        >
+        <div className={cn("flex flex-row items-center justify-between", "mx-auto w-full max-w-screen-desktop")}>
           <Link
             href={"/"}
             onClick={() => setOpen(false)}
@@ -110,9 +98,7 @@ export default function Navbar() {
               className={cn("h-10 w-10")}
               loading='eager'
             />
-            <span className={cn("large", "hidden", "tablet:block")}>
-              {config.siteConfig.siteName}
-            </span>
+            <span className={cn("large", "hidden", "tablet:block")}>{config.siteConfig.siteName}</span>
           </Link>
 
           {isDesktop ? (
@@ -128,16 +114,14 @@ export default function Navbar() {
                         "flex flex-col items-center justify-center",
                         "opacity-80",
                         "hover:opacity-100",
-                        pathname === item.href
-                          ? "cursor-default opacity-100"
-                          : "cursor-pointer",
+                        pathname === item.href ? "cursor-default opacity-100" : "cursor-pointer",
                         "p-1.5",
                       )}
                     >
                       <Icon
                         name={item.icon}
                         className='text-foreground'
-                        size={20}
+                        size={"1.25rem"}
                       />
                     </Link>
                   </TooltipTrigger>
@@ -170,14 +154,8 @@ export default function Navbar() {
                         )}
                       >
                         <Icon
-                          name={
-                            theme === "system"
-                              ? "LaptopMinimal"
-                              : theme === "light"
-                              ? "Sun"
-                              : "Moon"
-                          }
-                          size={20}
+                          name={theme === "system" ? "LaptopMinimal" : theme === "light" ? "Sun" : "Moon"}
+                          size={"1.25rem"}
                         />
                       </div>
                     </DropdownMenuTrigger>
@@ -186,7 +164,7 @@ export default function Navbar() {
                     <p>Site theme</p>
                   </TooltipContent>
                 </Tooltip>
-                <DropdownMenuContent align='end'>
+                <DropdownMenuContent align='start'>
                   {themes.map((item) => (
                     <DropdownMenuItem
                       key={item}
@@ -195,14 +173,7 @@ export default function Navbar() {
                       onClick={() => setTheme(item)}
                     >
                       <div className='flex w-full items-center justify-between'>
-                        <span
-                          className={cn(
-                            "capitalize",
-                            // item === theme && "text-muted-foreground",
-                          )}
-                        >
-                          {item}
-                        </span>
+                        <span className={cn("capitalize")}>{item}</span>
                         <Icon
                           name={
                             item === theme
@@ -213,11 +184,7 @@ export default function Navbar() {
                               ? "Sun"
                               : "Moon"
                           }
-                          className={
-                            cn()
-                            // item === theme && "text-muted-foreground",
-                          }
-                          size={16}
+                          size={"1rem"}
                         />
                       </div>
                     </DropdownMenuItem>
@@ -241,7 +208,7 @@ export default function Navbar() {
                         >
                           <Icon
                             name='Heart'
-                            size={20}
+                            size={"1.25rem"}
                           />
                         </div>
                       </DropdownMenuTrigger>
@@ -250,7 +217,7 @@ export default function Navbar() {
                       <p>Support</p>
                     </TooltipContent>
                   </Tooltip>
-                  <DropdownMenuContent align='end'>
+                  <DropdownMenuContent align='center'>
                     {config.siteConfig.supports.map((item) => (
                       <DropdownMenuItem key={item.name}>
                         <Link
@@ -283,12 +250,12 @@ export default function Navbar() {
                     >
                       <Icon
                         name={"Book"}
-                        size={20}
+                        size={"1.25rem"}
                       />
                       <span className='text-sm'>Guide</span>
                     </Link>
                   </TooltipTrigger>
-                  <TooltipContent side='bottom'>
+                  <TooltipContent>
                     <p>Deploy Guide</p>
                   </TooltipContent>
                 </Tooltip>
@@ -315,7 +282,7 @@ export default function Navbar() {
                         <Icon
                           name='LogOut'
                           className='text-red-500'
-                          size={20}
+                          size={"1.25rem"}
                         />
                       </div>
                     </DialogTrigger>
@@ -328,8 +295,7 @@ export default function Navbar() {
                 <DialogContent>
                   <DialogTitle>Clear all saved password?</DialogTitle>
                   <DialogDescription>
-                    You will need to re-enter the password to access the
-                    protected content.
+                    You will need to re-enter the password to access the protected content.
                     <br />
                     <b>Are you sure you want to continue?</b>
                   </DialogDescription>
@@ -354,6 +320,7 @@ export default function Navbar() {
               <Drawer
                 open={themeOpen}
                 onOpenChange={setThemeOpen}
+                shouldScaleBackground
               >
                 <DrawerTrigger asChild>
                   <Button
@@ -361,14 +328,8 @@ export default function Navbar() {
                     size={"icon"}
                   >
                     <Icon
-                      name={
-                        theme === "system"
-                          ? "LaptopMinimal"
-                          : theme === "light"
-                          ? "Sun"
-                          : "Moon"
-                      }
-                      size={18}
+                      name={theme === "system" ? "LaptopMinimal" : theme === "light" ? "Sun" : "Moon"}
+                      size={"1.125rem"}
                       className='text-foreground'
                     />
                   </Button>
@@ -376,16 +337,14 @@ export default function Navbar() {
                 <DrawerContent>
                   <DrawerHeader className='text-start'>
                     <DrawerTitle>Theme</DrawerTitle>
-                    <DrawerDescription>
-                      Choose your preferred theme
-                    </DrawerDescription>
+                    <DrawerDescription>Choose your preferred theme</DrawerDescription>
                   </DrawerHeader>
 
-                  <div className='flex flex-col px-4'>
+                  <div className='grid gap-1.5 px-4'>
                     {themes.map((item) => (
                       <Button
                         key={item}
-                        variant={"ghost"}
+                        variant={theme === item ? "default" : "outline"}
                         size={"sm"}
                         className='w-full'
                         disabled={item === theme}
@@ -412,11 +371,7 @@ export default function Navbar() {
                                 ? "Sun"
                                 : "Moon"
                             }
-                            className={
-                              cn()
-                              // item === theme && "text-muted-foreground",
-                            }
-                            size={16}
+                            size={"1rem"}
                           />
                         </div>
                       </Button>
@@ -446,7 +401,7 @@ export default function Navbar() {
                   >
                     <Icon
                       name='Menu'
-                      size={18}
+                      size={"1.125rem"}
                       className='text-foreground'
                     />
                   </Button>
@@ -464,9 +419,7 @@ export default function Navbar() {
                           <Link
                             href={item.href}
                             target={item.external ? "_blank" : undefined}
-                            rel={
-                              item.external ? "noopener noreferrer" : undefined
-                            }
+                            rel={item.external ? "noopener noreferrer" : undefined}
                             className='flex w-full items-center justify-between gap-3'
                             onClick={() => setOpen(false)}
                           >
@@ -474,14 +427,14 @@ export default function Navbar() {
                               <Icon
                                 name={item.icon}
                                 className='text-foreground'
-                                size={18}
+                                size={"1.125rem"}
                               />
                               {item.name}
                             </div>
                             {item.external && (
                               <Icon
                                 name='ExternalLink'
-                                size={12}
+                                size={"0.75rem"}
                                 className='text-muted-foreground'
                               />
                             )}
@@ -504,7 +457,7 @@ export default function Navbar() {
                               <Icon
                                 name={"Book"}
                                 className='text-foreground'
-                                size={18}
+                                size={"1.125rem"}
                               />
                               Deploy Guide
                             </div>
@@ -513,7 +466,7 @@ export default function Navbar() {
                       )}
                     </div>
 
-                    <div className='flex flex-col'>
+                    <div className='hidden flex-col'>
                       <p className='large'>Theme</p>
                       <Separator className='my-1.5' />
                       {themes.map((item) => (
@@ -550,7 +503,7 @@ export default function Navbar() {
                                 cn()
                                 // item === theme && "text-muted-foreground",
                               }
-                              size={18}
+                              size={"1.125rem"}
                             />
                           </div>
                         </Button>
@@ -599,8 +552,7 @@ export default function Navbar() {
                         <DrawerHeader className='text-left'>
                           <DrawerTitle>Clear all saved password?</DrawerTitle>
                           <DrawerDescription>
-                            You will need to re-enter the password to access the
-                            protected content.
+                            You will need to re-enter the password to access the protected content.
                             <br />
                             <b>Are you sure you want to continue?</b>
                           </DrawerDescription>
diff --git a/src/components/Layout/NotFound.tsx b/src/components/Layout/NotFound.tsx
new file mode 100644
index 0000000..6471214
--- /dev/null
+++ b/src/components/Layout/NotFound.tsx
@@ -0,0 +1,37 @@
+"use client";
+
+import { Status } from "~/components/Global";
+import { Button } from "~/components/ui/button";
+
+import { cn } from "~/utils/cn";
+
+import useRouter from "~/hooks/usePRouter";
+
+export default function NotFound() {
+  const router = useRouter();
+
+  return (
+    <div className={cn("mx-auto h-full w-full max-w-md", "flex flex-grow flex-col items-center justify-center gap-12")}>
+      <Status
+        icon='Frown'
+        message='The file you are looking for does not exist'
+      />
+
+      <div className={cn("w-full", "flex flex-col items-center gap-3")}>
+        <Button
+          className='w-full'
+          onClick={() => router.push("/")}
+        >
+          Back to Home
+        </Button>
+        <Button
+          variant={"outline"}
+          className='w-full'
+          onClick={() => router.back()}
+        >
+          Back to Previous Page
+        </Button>
+      </div>
+    </div>
+  );
+}
diff --git a/src/app/@password.tsx b/src/components/Layout/Password.tsx
similarity index 70%
rename from src/app/@password.tsx
rename to src/components/Layout/Password.tsx
index 06e285f..8461902 100644
--- a/src/app/@password.tsx
+++ b/src/components/Layout/Password.tsx
@@ -1,20 +1,18 @@
 "use client";
 
 import { useRouter } from "next/navigation";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import toast from "react-hot-toast";
-import { cn } from "~/utils";
 
-import Icon from "~/components/Icon";
+import { Icon, Loader } from "~/components/Global";
 import { Button } from "~/components/ui/button";
 import { Input } from "~/components/ui/input";
 
-import {
-  CheckPassword,
-  CheckSitePassword,
-  SetPassword,
-  SetSitePassword,
-} from "./actions";
+import { cn } from "~/utils/cn";
+
+import useLoading from "~/hooks/useLoading";
+
+import { CheckPassword, CheckSitePassword, SetPassword, SetSitePassword } from "actions";
 
 type Props = {
   path: string;
@@ -23,10 +21,10 @@ type Props = {
 };
 export default function Password({ path, checkPaths, errorMessage }: Props) {
   const router = useRouter();
+  const loading = useLoading();
 
   const [input, setInput] = useState<string>("");
   const [submitLoading, setSubmitLoading] = useState<boolean>(false);
-  const [loading, setLoading] = useState<boolean>(true);
 
   const onSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
@@ -44,8 +42,7 @@ export default function Password({ path, checkPaths, errorMessage }: Props) {
         const check = await CheckSitePassword();
         if (!check.success) throw new Error(check.message);
       } else {
-        if (!checkPaths)
-          throw new Error("No path found, try to refresh the page.");
+        if (!checkPaths) throw new Error("No path found, try to refresh the page.");
         const set = await SetPassword(path, input);
         if (!set.success) throw new Error(set.message);
 
@@ -70,34 +67,10 @@ export default function Password({ path, checkPaths, errorMessage }: Props) {
     }
   };
 
-  useEffect(() => {
-    setLoading(false);
-  }, []);
-
-  if (loading)
-    return (
-      <div
-        className={cn(
-          "mx-auto h-full w-full max-w-md",
-          "flex flex-grow flex-col items-center justify-center gap-3",
-        )}
-      >
-        <Icon
-          name='LoaderCircle'
-          size={32}
-          className='animate-spin text-foreground'
-        />
-        <p>Checking password...</p>
-      </div>
-    );
+  if (loading) return <Loader message='Checking password...' />;
 
   return (
-    <div
-      className={cn(
-        "mx-auto h-full w-full max-w-md",
-        "flex flex-grow flex-col items-center justify-center gap-3",
-      )}
-    >
+    <div className={cn("mx-auto h-full w-full max-w-md", "flex flex-grow flex-col items-center justify-center gap-3")}>
       <img
         src='/images/undraw_vault.svg'
         alt='Password illustration'
@@ -110,9 +83,6 @@ export default function Password({ path, checkPaths, errorMessage }: Props) {
             ? "This site are password protected"
             : "The folder or file you are trying to access is password protected"}
         </h3>
-        {/* <span className='muted text-pretty text-center'>
-          Please enter the password to access the content
-        </span> */}
       </div>
 
       <form
@@ -136,7 +106,7 @@ export default function Password({ path, checkPaths, errorMessage }: Props) {
             <>
               <Icon
                 name='LoaderCircle'
-                size={16}
+                size={"1rem"}
                 className='animate-spin'
               />
               Loading...
@@ -146,12 +116,7 @@ export default function Password({ path, checkPaths, errorMessage }: Props) {
           )}
         </Button>
       </form>
-      <span
-        className={cn(
-          "muted text-pretty text-center text-red-500",
-          errorMessage ? "visible" : "invisible",
-        )}
-      >
+      <span className={cn("text-pretty text-center text-destructive", errorMessage ? "visible" : "invisible")}>
         {errorMessage || "Nothing wrong here, just a password wall"}
       </span>
     </div>
diff --git a/src/components/Layout/ResponsiveDropdown.tsx b/src/components/Layout/ResponsiveDropdown.tsx
new file mode 100644
index 0000000..33509b1
--- /dev/null
+++ b/src/components/Layout/ResponsiveDropdown.tsx
@@ -0,0 +1,222 @@
+"use client";
+
+import { icons } from "lucide-react";
+import { HTMLProps } from "react";
+
+import { Icon } from "~/components/Global";
+import { Button } from "~/components/ui/button";
+import {
+  Drawer,
+  DrawerClose,
+  DrawerContent,
+  DrawerDescription,
+  DrawerFooter,
+  DrawerHeader,
+  DrawerTitle,
+  DrawerTrigger,
+} from "~/components/ui/drawer";
+import {
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "~/components/ui/dropdown-menu";
+import { Separator } from "~/components/ui/separator";
+
+import useMediaQuery from "~/hooks/useMediaQuery";
+
+type DropdownItem =
+  | {
+      type: "label";
+      key: string;
+      title: React.ReactNode;
+      className?: string;
+    }
+  | {
+      type: "separator";
+      key: string;
+      className?: string;
+    }
+  | {
+      type: "item";
+      key: string;
+      title: React.ReactNode;
+      onClick: (e: React.MouseEvent) => void;
+      disabled?: boolean;
+      icon?: keyof typeof icons;
+      className?: string;
+    }
+  | {
+      type: "checkbox";
+      key: string;
+      title: React.ReactNode;
+      checked: boolean;
+      onCheckedChange: (checked: boolean) => void;
+      disabled?: boolean;
+      className?: string;
+    }
+  | {
+      type: "radio";
+      key: string;
+      value: string;
+      onValueChange: (value: string) => void;
+      items: {
+        key: string;
+        value: string;
+        title: string;
+        className?: string;
+      }[];
+    };
+type Props = {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  trigger: React.ReactNode;
+  mobile: {
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    content: React.ReactNode;
+    closeOnFooter?: boolean;
+    footer?: React.ReactNode;
+  };
+  desktop: {
+    align?: "start" | "center" | "end";
+    alignOffset?: number;
+    placement?: "top" | "right" | "bottom" | "left";
+    placementOffset?: number;
+    items: DropdownItem[];
+  };
+} & HTMLProps<HTMLDivElement>;
+export default function ResponsiveDropdown({ open, onOpenChange, trigger, mobile, desktop, ...rest }: Props) {
+  const isDesktop = useMediaQuery("(min-width: 768px)");
+
+  return (
+    <div
+      slot='responsive-menu'
+      {...rest}
+    >
+      {isDesktop ? (
+        <DropdownMenu
+          open={open}
+          onOpenChange={onOpenChange}
+        >
+          <DropdownMenuTrigger asChild>{trigger}</DropdownMenuTrigger>
+          <DropdownMenuContent
+            align={desktop.align}
+            alignOffset={desktop.alignOffset}
+            side={desktop.placement}
+            sideOffset={desktop.placementOffset}
+          >
+            {desktop.items.map((item, index) => {
+              switch (item.type) {
+                case "label":
+                  return (
+                    <DropdownMenuLabel
+                      key={item.key}
+                      className={item.className}
+                    >
+                      {item.title}
+                    </DropdownMenuLabel>
+                  );
+                case "separator":
+                  return (
+                    <DropdownMenuSeparator
+                      key={item.key}
+                      className={item.className}
+                    />
+                  );
+                case "checkbox":
+                  return (
+                    <DropdownMenuCheckboxItem
+                      key={item.key}
+                      checked={item.checked}
+                      onCheckedChange={item.onCheckedChange}
+                      disabled={item.disabled}
+                      className={item.className}
+                    >
+                      {item.title}
+                    </DropdownMenuCheckboxItem>
+                  );
+                case "radio":
+                  return (
+                    <DropdownMenuRadioGroup
+                      value={item.value}
+                      onValueChange={item.onValueChange}
+                    >
+                      {item.items.map((radio) => (
+                        <DropdownMenuRadioItem
+                          key={radio.key}
+                          value={radio.value}
+                          className={radio.className}
+                        >
+                          {radio.title}
+                        </DropdownMenuRadioItem>
+                      ))}
+                    </DropdownMenuRadioGroup>
+                  );
+                default:
+                  return (
+                    <DropdownMenuItem
+                      key={item.key}
+                      disabled={item.disabled}
+                      onClick={item.onClick}
+                      className={item.className}
+                    >
+                      {item.icon && (
+                        <Icon
+                          name={item.icon}
+                          size={"1rem"}
+                          className='mr-2'
+                        />
+                      )}
+                      {item.title}
+                    </DropdownMenuItem>
+                  );
+              }
+            })}
+          </DropdownMenuContent>
+        </DropdownMenu>
+      ) : (
+        <Drawer
+          open={open}
+          onOpenChange={onOpenChange}
+          shouldScaleBackground
+        >
+          <DrawerTrigger asChild>{trigger}</DrawerTrigger>
+          <DrawerContent>
+            {(mobile.title || mobile.description) && (
+              <DrawerHeader className='text-start'>
+                {mobile.title && <DrawerTitle>{mobile.title}</DrawerTitle>}
+                {mobile.description && <DrawerDescription>{mobile.description}</DrawerDescription>}
+              </DrawerHeader>
+            )}
+
+            <div className='grid gap-1.5 px-4'>{mobile.content}</div>
+
+            {(mobile.footer || mobile.closeOnFooter) && (
+              <DrawerFooter>
+                <Separator />
+                {mobile.footer}
+
+                {mobile.closeOnFooter && (
+                  <DrawerClose asChild>
+                    <Button
+                      size={"sm"}
+                      variant='secondary'
+                    >
+                      Close
+                    </Button>
+                  </DrawerClose>
+                )}
+              </DrawerFooter>
+            )}
+          </DrawerContent>
+        </Drawer>
+      )}
+    </div>
+  );
+}
diff --git a/src/app/theme-provider.tsx b/src/components/Layout/ThemeProvider.tsx
similarity index 83%
rename from src/app/theme-provider.tsx
rename to src/components/Layout/ThemeProvider.tsx
index e77b9d0..8717913 100644
--- a/src/app/theme-provider.tsx
+++ b/src/components/Layout/ThemeProvider.tsx
@@ -4,18 +4,15 @@ import { ThemeProvider as NextThemeProvider } from "next-themes";
 import { type ThemeProviderProps } from "next-themes/dist/types";
 import NextTopLoader from "nextjs-toploader";
 import { Toaster } from "react-hot-toast";
-import { cn } from "~/utils";
 
 import { TooltipProvider } from "~/components/ui/tooltip";
 
 import LayoutProvider from "~/context/layoutContext";
+import { cn } from "~/utils/cn";
 
-import config from "~/config/gIndex.config";
+import config from "config";
 
-export default function ThemeProvider({
-  children,
-  ...props
-}: ThemeProviderProps) {
+export default function ThemeProvider({ children, ...props }: ThemeProviderProps) {
   return (
     <LayoutProvider>
       <NextTopLoader color='hsl(var(--primary))' />
@@ -39,8 +36,8 @@ export default function ThemeProvider({
           position={config.siteConfig.toaster?.position}
           toastOptions={{
             style: {
-              background: "hsl(var(--accent))",
-              color: "hsl(var(--accent-foreground))",
+              background: "hsl(var(--background))",
+              color: "hsl(var(--foreground))",
               borderRadius: "var(--radius)",
               border: "1px solid hsl(var(--border))",
             },
diff --git a/src/components/Layout/ToTop.tsx b/src/components/Layout/ToTop.tsx
new file mode 100644
index 0000000..cd401ce
--- /dev/null
+++ b/src/components/Layout/ToTop.tsx
@@ -0,0 +1,47 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+import { Icon } from "~/components/Global";
+import { Button } from "~/components/ui/button";
+
+import { cn } from "~/utils/cn";
+
+export default function ToTop() {
+  const [show, setShow] = useState<boolean>(false);
+
+  useEffect(() => {
+    const handler = () => {
+      setShow(window.scrollY > 100);
+    };
+
+    window.addEventListener("scroll", handler);
+
+    return () => {
+      window.removeEventListener("scroll", handler);
+    };
+  }, []);
+
+  return (
+    <div
+      slot='to-top-fab'
+      className={cn(
+        "fixed bottom-6 right-6 z-10 transition",
+        show ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0",
+      )}
+    >
+      <Button
+        size={"icon"}
+        variant={"outline"}
+        onClick={() => {
+          window.scrollTo({ top: 0, behavior: "smooth" });
+        }}
+      >
+        <Icon
+          name='ChevronUp'
+          size='1rem'
+        />
+      </Button>
+    </div>
+  );
+}
diff --git a/src/components/Layout/index.tsx b/src/components/Layout/index.tsx
new file mode 100644
index 0000000..6551fb5
--- /dev/null
+++ b/src/components/Layout/index.tsx
@@ -0,0 +1,6 @@
+export { default as Footer } from "./Footer";
+export { default as Navbar } from "./Navbar";
+export { default as NotFound } from "./NotFound";
+export { default as Password } from "./Password";
+export { default as ResponsiveDropdown } from "./ResponsiveDropdown";
+export { default as ThemeProvider } from "./ThemeProvider";
diff --git a/src/components/Preview/Audio.tsx b/src/components/Preview/Audio.tsx
new file mode 100644
index 0000000..40d9669
--- /dev/null
+++ b/src/components/Preview/Audio.tsx
@@ -0,0 +1,98 @@
+"use client";
+
+import dynamic from "next/dynamic";
+import { useState } from "react";
+import "react-h5-audio-player/lib/styles.css";
+import { z } from "zod";
+
+import { Loader, Status } from "~/components/Global";
+
+import useLoading from "~/hooks/useLoading";
+
+import { Schema_File } from "~/types/schema";
+
+import { CreateDownloadToken } from "actions";
+
+const Plyr = dynamic(() => import("plyr-react"), {
+  ssr: false,
+  loading: () => <Loader message='Loading player...' />,
+});
+
+type Props = {
+  file: z.infer<typeof Schema_File>;
+};
+export default function PreviewAudio({ file }: Props) {
+  const [audioSrc, setAudioSrc] = useState<string>("");
+  const [error, setError] = useState<string>("");
+
+  const loading = useLoading(async () => {
+    try {
+      if (!file.encryptedWebContentLink) {
+        setError("No audio to preview");
+        return;
+      }
+      const token = await CreateDownloadToken();
+      setAudioSrc(`/api/stream/${file.encryptedId}?token=${token}`);
+    } catch (error) {
+      const e = error as Error;
+      console.error(e);
+      setError(e.message);
+    }
+  }, [file]);
+
+  return (
+    <div className='flex h-full min-h-[33dvh] w-full items-center justify-center py-3'>
+      {loading ? (
+        <Loader message='Loading audio...' />
+      ) : error ? (
+        <Status
+          icon='TriangleAlert'
+          message={error}
+          destructive
+        />
+      ) : (
+        <div className='w-full'>
+          <Plyr
+            source={{
+              type: "audio",
+              sources: [
+                {
+                  src: audioSrc,
+                  type: file.mimeType,
+                  size: file.size,
+                },
+              ],
+              title: file.name,
+            }}
+            options={{
+              controls: [
+                "play-large",
+                "play",
+                "progress",
+                "current-time",
+                "duration",
+                "mute",
+                "volume",
+                "settings",
+                "fullscreen",
+              ],
+              volume: 0.5,
+              muted: false,
+              loop: {
+                active: false,
+              },
+              speed: {
+                selected: 1,
+                options: [0.5, 1, 1.5, 2],
+              },
+              keyboard: {
+                focused: true,
+                global: false,
+              },
+            }}
+          />
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/app/@preview.doc.tsx b/src/components/Preview/Document.tsx
similarity index 51%
rename from src/app/@preview.doc.tsx
rename to src/components/Preview/Document.tsx
index 85c6ceb..3bf9447 100644
--- a/src/app/@preview.doc.tsx
+++ b/src/components/Preview/Document.tsx
@@ -1,21 +1,22 @@
 "use client";
 
 import DocViewer, { DocRenderer } from "@cyntler/react-doc-viewer";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
 
-import Icon from "~/components/Icon";
+import { Icon, Loader, Status } from "~/components/Global";
 import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
 
-import config from "~/config/gIndex.config";
+import { cn } from "~/utils/cn";
 
-import { CreateDownloadToken } from "./actions";
+import useLoading from "~/hooks/useLoading";
 
-const GoogleDocsViewerRenderer: DocRenderer = ({
-  mainState: { currentDocument, documentLoading },
-}) => {
+import { Schema_File } from "~/types/schema";
+
+import { CreateDownloadToken } from "actions";
+import config from "config";
+
+const GoogleDocsViewerRenderer: DocRenderer = ({ mainState: { currentDocument, documentLoading } }) => {
   if (!currentDocument || !currentDocument.uri) return null;
 
   const viewerUrl = new URL(`/gview`, "https://docs.google.com");
@@ -23,21 +24,7 @@ const GoogleDocsViewerRenderer: DocRenderer = ({
   viewerUrl.searchParams.set("embedded", "true");
 
   if (documentLoading) {
-    return (
-      <div
-        className={cn(
-          "h-auto min-h-[50dvh] w-full",
-          "flex flex-grow flex-col items-center justify-center gap-3",
-        )}
-      >
-        <Icon
-          name='LoaderCircle'
-          size={32}
-          className='animate-spin text-foreground'
-        />
-        <p>Loading document...</p>
-      </div>
-    );
+    return <Loader message='Loading document...' />;
   }
 
   return (
@@ -70,60 +57,53 @@ type Props = {
 
 export default function PreviewDoc({ file }: Props) {
   const [docSrc, setDocSrc] = useState<string>("");
-  const [loading, setLoading] = useState<boolean>(true);
   const [error, setError] = useState<string>("");
 
-  useEffect(() => {
-    (async () => {
-      try {
-        if (!file.encryptedWebContentLink) {
-          setError("Nothing to preview");
-          return;
-        }
-        const token = await CreateDownloadToken();
-        const streamURL = new URL(
-          `/api/stream/${file.encryptedId}`,
-          config.basePath,
-        );
-        streamURL.searchParams.set("token", token);
-        setDocSrc(streamURL.toString());
-      } catch (error) {
-        const e = error as Error;
-        console.error(e);
-        setError(e.message);
-      } finally {
-        setLoading(false);
+  const loading = useLoading(async () => {
+    try {
+      if (!file.encryptedWebContentLink) {
+        setError("Nothing to preview");
+        return;
       }
-    })();
+      const token = await CreateDownloadToken();
+      const streamURL = new URL(`/api/stream/${file.encryptedId}`, config.basePath);
+      streamURL.searchParams.set("token", token);
+      setDocSrc(streamURL.toString());
+    } catch (error) {
+      const e = error as Error;
+      console.error(e);
+      setError(e.message);
+    }
   }, [file]);
 
   return (
     <div className='flex h-full min-h-[33dvh] w-full items-center justify-center py-3'>
       {loading ? (
-        <div
-          className={cn(
-            "h-auto min-h-[50dvh] w-full",
-            "flex flex-grow flex-col items-center justify-center gap-3",
-          )}
-        >
-          <Icon
-            name='LoaderCircle'
-            size={32}
-            className='animate-spin text-foreground'
-          />
-          <p>Loading document...</p>
-        </div>
+        <Loader message='Loading document...' />
       ) : error ? (
-        <div className='flex h-full flex-col items-center justify-center gap-3'>
-          <Icon
-            name='CircleX'
-            size={24}
-            className='text-destructive'
-          />
-          <span className='text-center text-destructive'>{error}</span>
-        </div>
+        <Status
+          icon='TriangleAlert'
+          message={error}
+          destructive
+        />
       ) : (
         <div className='h-fit w-full space-y-3 overflow-hidden rounded-[var(--radius)]'>
+          <Alert className='bg-yellow-50 text-yellow-600 dark:bg-yellow-950 dark:text-yellow-500'>
+            <div className='flex items-start gap-3'>
+              <Icon
+                name='TriangleAlert'
+                className='size-5'
+              />
+              <div className='flex flex-col'>
+                <AlertTitle>Preview Only</AlertTitle>
+                <AlertDescription>
+                  It might failed to load the document, you can try to refresh the page or download the document to view
+                  it.
+                </AlertDescription>
+              </div>
+            </div>
+          </Alert>
+
           <DocViewer
             key={file.encryptedId}
             documents={[
@@ -139,35 +119,16 @@ export default function PreviewDoc({ file }: Props) {
                 disableHeader: true,
               },
               loadingRenderer: {
-                overrideComponent: () => (
-                  <div
-                    className={cn(
-                      "h-auto min-h-[50dvh] w-full",
-                      "flex flex-grow flex-col items-center justify-center gap-3",
-                    )}
-                  >
-                    <Icon
-                      name='LoaderCircle'
-                      size={32}
-                      className='animate-spin text-foreground'
-                    />
-                    <p>Loading document...</p>
-                  </div>
-                ),
+                overrideComponent: () => <Loader message='Loading document...' />,
                 showLoadingTimeout: 10000,
               },
               noRenderer: {
                 overrideComponent: () => (
-                  <div className='flex h-full flex-col items-center justify-center gap-3'>
-                    <Icon
-                      name='CircleX'
-                      size={24}
-                      className='text-destructive'
-                    />
-                    <span className='text-center text-destructive'>
-                      Error loading document
-                    </span>
-                  </div>
+                  <Status
+                    icon='CircleX'
+                    message='Failed to load document'
+                    destructive
+                  />
                 ),
               },
             }}
@@ -179,22 +140,6 @@ export default function PreviewDoc({ file }: Props) {
               disableThemeScrollbar: true,
             }}
           />
-
-          <Alert className='bg-yellow-50 text-yellow-600 dark:bg-yellow-950 dark:text-yellow-500'>
-            <div className='flex items-start gap-3'>
-              <Icon
-                name='TriangleAlert'
-                className='size-5'
-              />
-              <div className='flex flex-col'>
-                <AlertTitle>Preview Only</AlertTitle>
-                <AlertDescription>
-                  It might failed to load the document, you can try to refresh
-                  the page or download the document to view it.
-                </AlertDescription>
-              </div>
-            </div>
-          </Alert>
         </div>
       )}
     </div>
diff --git a/src/components/Preview/Image.tsx b/src/components/Preview/Image.tsx
new file mode 100644
index 0000000..5ab208f
--- /dev/null
+++ b/src/components/Preview/Image.tsx
@@ -0,0 +1,106 @@
+"use client";
+
+import { useState } from "react";
+import { z } from "zod";
+
+import { Icon, Loader, Status } from "~/components/Global";
+import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
+
+import { cn } from "~/utils/cn";
+
+import useLoading from "~/hooks/useLoading";
+
+import { Schema_File } from "~/types/schema";
+
+import { CreateDownloadToken } from "actions";
+import config from "config";
+
+type Props = {
+  file: z.infer<typeof Schema_File>;
+};
+export default function PreviewImage({ file }: Props) {
+  const [imgSrc, setImgSrc] = useState<string>(`/api/thumb/${file.encryptedId}?size=4`);
+  const [imgLoaded, setImgLoaded] = useState<boolean>(false);
+  const [error, setError] = useState<string>("");
+
+  const loading = useLoading(async () => {
+    try {
+      if (!file.encryptedWebContentLink) {
+        setError("No image to preview");
+        return;
+      }
+      const token = await CreateDownloadToken();
+
+      const streamURL = new URL(`/api/thumb/${file.encryptedId}?size=1000`, config.basePath);
+      streamURL.searchParams.set("token", token);
+      fetch(streamURL, {
+        headers: {
+          Range: `bytes=0-${(file.size || 1) - 1}`,
+        },
+      })
+        .then((res) => {
+          if (!res.ok) {
+            throw new Error("Could not load image");
+          }
+          return res.blob();
+        })
+        .then((blob) => {
+          const urlobject = URL.createObjectURL(blob);
+          setImgSrc(urlobject);
+          const timeout = setTimeout(() => {
+            setImgLoaded(true);
+            clearTimeout(timeout);
+          }, 150); // Add a delay to show the image
+        });
+    } catch (error) {
+      const e = error as Error;
+      console.error(e);
+      setError(e.message);
+    }
+  }, [file]);
+
+  return (
+    <div className='flex min-h-[33dvh] w-full items-center justify-center py-3'>
+      {loading ? (
+        <Loader message='Loading image...' />
+      ) : error ? (
+        <Status
+          icon='TriangleAlert'
+          message={error}
+          destructive
+        />
+      ) : (
+        <div className='h-fit w-full space-y-3 overflow-hidden'>
+          <Alert className='bg-yellow-50 text-yellow-600 dark:bg-yellow-950 dark:text-yellow-500'>
+            <div className='flex items-start gap-3'>
+              <Icon
+                name='TriangleAlert'
+                className='size-5'
+              />
+              <div className='flex flex-col'>
+                <AlertTitle>Preview Only</AlertTitle>
+                <AlertDescription>
+                  This image is a preview and may not be the full resolution. Please download the file for the full
+                  resolution.
+                </AlertDescription>
+              </div>
+            </div>
+          </Alert>
+
+          <img
+            src={imgSrc}
+            alt={file.name}
+            className={cn(
+              "h-full max-h-[70dvh] w-full rounded-[var(--radius)] bg-muted object-contain object-center transition",
+              imgLoaded ? "blur-none" : "animate-pulse blur",
+            )}
+            onError={(e) => {
+              console.error(e);
+              setError("Could not preview this image, try downloading the file");
+            }}
+          />
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/app/@preview.action.tsx b/src/components/Preview/Information.tsx
similarity index 75%
rename from src/app/@preview.action.tsx
rename to src/components/Preview/Information.tsx
index cd46359..f5c665c 100644
--- a/src/app/@preview.action.tsx
+++ b/src/components/Preview/Information.tsx
@@ -5,43 +5,34 @@ import { usePathname } from "next/navigation";
 import { useMemo, useState } from "react";
 import toast from "react-hot-toast";
 import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
 
-import Icon from "~/components/Icon";
+import { ButtonLoading } from "~/components/Global";
 import { Button } from "~/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
 import { Dialog, DialogContent, DialogTrigger } from "~/components/ui/dialog";
-import {
-  Drawer,
-  DrawerClose,
-  DrawerContent,
-  DrawerFooter,
-  DrawerHeader,
-  DrawerTrigger,
-} from "~/components/ui/drawer";
+import { Drawer, DrawerClose, DrawerContent, DrawerFooter, DrawerHeader, DrawerTrigger } from "~/components/ui/drawer";
 import { Separator } from "~/components/ui/separator";
 
-import useMediaQuery from "~/hooks/useMediaQuery";
-import bytesToReadable from "~/utils/bytesFormat";
+import { bytesToReadable } from "~/utils/bytesFormat";
+import { cn } from "~/utils/cn";
 import { durationToReadable } from "~/utils/durationFormat";
 import { getFileType } from "~/utils/previewHelper";
 
-import config from "~/config/gIndex.config";
+import useMediaQuery from "~/hooks/useMediaQuery";
 
-import { CreateDownloadToken } from "./actions";
+import { ButtonState, Schema_File } from "~/types/schema";
+
+import { CreateDownloadToken } from "actions";
+import config from "config";
 
 type Props = {
   file: z.infer<typeof Schema_File>;
 };
-export default function PreviewAction({ file }: Props) {
+export default function PreviewInformation({ file }: Props) {
   const pathname = usePathname();
+
   const showRaw = useMemo<boolean>(() => {
-    return (
-      file.mimeType.startsWith("image") ||
-      file.mimeType.startsWith("video") ||
-      file.mimeType.startsWith("audio")
-    );
+    return file.mimeType.startsWith("image") || file.mimeType.startsWith("video") || file.mimeType.startsWith("audio");
   }, [file]);
   const showViewDoc = useMemo<boolean>(() => {
     const fileExtensionFallback = file.name.split(".").pop();
@@ -63,7 +54,7 @@ export default function PreviewAction({ file }: Props) {
       },
       {
         label: "Size",
-        value: bytesToReadable(file.size || 0),
+        value: `${bytesToReadable(file.size || 0)} (${file.size || 0} bytes)`,
       },
       {
         label: "Last Modified",
@@ -90,29 +81,33 @@ export default function PreviewAction({ file }: Props) {
     return value;
   }, [file]);
 
-  const [downloading, setDownloading] = useState<boolean>(false);
-  const [diffOpen, setDiffOpen] = useState<boolean>(false);
+  const [viewerState, setViewerState] = useState<ButtonState>("idle");
+  const [copyRawState, setCopyRawState] = useState<ButtonState>("idle");
+  const [copyDownloadState, setCopyDownloadState] = useState<ButtonState>("idle");
+  const [downloadState, setDownloadState] = useState<ButtonState>("idle");
+  const [isRawExplanationOpen, setIsRawExplanationOpen] = useState<boolean>(false);
   const isDesktop = useMediaQuery("(min-width: 768px)");
 
   const onCopyRaw = async () => {
+    setCopyRawState("loading");
     try {
-      const rawURL = new URL(
-        `/api/raw/${pathname}`.replace(/\/+/g, "/"),
-        config.basePath,
-      );
+      const rawURL = new URL(`/api/raw/${pathname}`.replace(/\/+/g, "/"), config.basePath);
       rawURL.searchParams.append("token", file.encryptedId);
       toast.promise(navigator.clipboard.writeText(rawURL.toString()), {
         loading: "Copying link...",
-        success: "Link copied!",
+        success: "Raw link copied!",
         error: "Failed to copy link",
       });
     } catch (error) {
       const e = error as Error;
       console.error(e.message);
+    } finally {
+      setCopyRawState("idle");
     }
   };
   const onCopy = async (e: React.MouseEvent) => {
     e.stopPropagation();
+    setCopyDownloadState("loading");
     toast.loading("Creating download token...", {
       id: `download-${file.encryptedId}`,
     });
@@ -120,12 +115,9 @@ export default function PreviewAction({ file }: Props) {
       const token = await CreateDownloadToken();
       if (!token) throw new Error("Failed to create download token");
       await navigator.clipboard.writeText(
-        new URL(
-          `/api/download/${file.encryptedId}?token=${token}`,
-          config.basePath,
-        ).toString(),
+        new URL(`/api/download/${file.encryptedId}?token=${token}`, config.basePath).toString(),
       );
-      toast.success("Link copied...", {
+      toast.success("Download link copied!", {
         id: `download-${file.encryptedId}`,
       });
     } catch (error) {
@@ -134,11 +126,13 @@ export default function PreviewAction({ file }: Props) {
       toast.error(e.message, {
         id: `download-${file.encryptedId}`,
       });
+    } finally {
+      setCopyDownloadState("idle");
     }
   };
   const onDownload = async (e: React.MouseEvent) => {
     e.stopPropagation();
-    setDownloading(true);
+    setDownloadState("loading");
     toast.loading("Creating download token...", {
       id: `download-${file.encryptedId}`,
     });
@@ -152,15 +146,15 @@ export default function PreviewAction({ file }: Props) {
       const timeout = setTimeout(() => {
         clearTimeout(timeout);
         window.open(`/api/download/${file.encryptedId}?token=${token}`);
-        setDownloading(false);
-      }, 1000);
+      }, 250);
     } catch (error) {
       const e = error as Error;
       console.error(e.message);
       toast.error(e.message, {
         id: `download-${file.encryptedId}`,
       });
-      setDownloading(false);
+    } finally {
+      setDownloadState("idle");
     }
   };
   const onOpenViewer = async (e: React.MouseEvent) => {
@@ -168,13 +162,11 @@ export default function PreviewAction({ file }: Props) {
     toast.loading("Creating view token...", {
       id: `view-${file.encryptedId}`,
     });
+    setViewerState("loading");
     try {
       const token = await CreateDownloadToken();
       if (!token) throw new Error("Failed to create view token");
-      const streamURL = new URL(
-        `/api/stream/${file.encryptedId}`,
-        config.basePath,
-      );
+      const streamURL = new URL(`/api/stream/${file.encryptedId}`, config.basePath);
       streamURL.searchParams.set("token", token);
       toast.success("Opening viewer link...", {
         id: `view-${file.encryptedId}`,
@@ -186,13 +178,15 @@ export default function PreviewAction({ file }: Props) {
         viewerUrl.searchParams.set("url", streamURL.toString());
         viewerUrl.searchParams.set("embedded", "true");
         window.open(viewerUrl.toString(), "_blank");
-      }, 150);
+      }, 250);
     } catch (error) {
       const e = error as Error;
       console.error(e.message);
       toast.error(e.message, {
         id: `view-${file.encryptedId}`,
       });
+    } finally {
+      setViewerState("idle");
     }
   };
 
@@ -200,11 +194,14 @@ export default function PreviewAction({ file }: Props) {
     <div className='grid grid-cols-1 gap-3'>
       <Card slot='file-actions'>
         <div className='flex flex-col-reverse gap-3 p-6 tablet:flex-row tablet:items-center tablet:justify-between'>
-          <div className={cn("flex gap-3", !showRaw && "invisible")}>
+          <div
+            slot='raw-explanation'
+            className={cn("flex gap-3", !showRaw && "invisible")}
+          >
             {isDesktop ? (
               <Dialog
-                open={diffOpen}
-                onOpenChange={setDiffOpen}
+                open={isRawExplanationOpen}
+                onOpenChange={setIsRawExplanationOpen}
               >
                 <DialogTrigger asChild>
                   <span className='cursor-pointer text-center text-sm text-blue-600 opacity-80 transition-all duration-300 hover:opacity-100 dark:text-blue-400 tablet:text-start'>
@@ -215,26 +212,20 @@ export default function PreviewAction({ file }: Props) {
                   <div className='flex h-fit flex-col gap-3'>
                     <h4>Why?</h4>
                     <p>
-                      Some services need the file extension to be present in the
-                      URL to properly embed the file.
+                      Some services need the file extension to be present in the URL to properly embed the file.
                       <br />
                       - The download link only have encrypted file id.
                       <br />
-                      - The raw link will have the whole path includes the file
-                      name and extension.
+                      - The raw link will have the whole path includes the file name and extension.
                       <br />
                       <br />
-                      So if you want to embed the file, it&apos;s recommended to
-                      use the raw link instead of the download link.
-                    </p>
-                    <p className='muted'>
-                      Note: This is only applicable for video, audio, and image
-                      files.
+                      So if you want to embed the file, it&apos;s recommended to use the raw link instead of the
+                      download link.
                     </p>
+                    <p className='muted'>Note: This is only applicable for video, audio, and image files.</p>
                     <h4>Ref</h4>
                     <p>
-                      This information is based on the onedrive-vercel-index
-                      project documentation.
+                      This information is based on the onedrive-vercel-index project documentation.
                       <br />
                       <Link
                         href='https://ovi.swo.moe/docs/features/customise-direct-link'
@@ -250,8 +241,8 @@ export default function PreviewAction({ file }: Props) {
               </Dialog>
             ) : (
               <Drawer
-                open={diffOpen}
-                onOpenChange={setDiffOpen}
+                open={isRawExplanationOpen}
+                onOpenChange={setIsRawExplanationOpen}
                 shouldScaleBackground
               >
                 <DrawerTrigger asChild>
@@ -264,22 +255,19 @@ export default function PreviewAction({ file }: Props) {
                   <div className='flex h-fit flex-col gap-3 px-4'>
                     <h4>Why?</h4>
                     <p>
-                      Some services need the file extension to be present in the
-                      URL to properly embed the file.
+                      Some services need the file extension to be present in the URL to properly embed the file.
                       <br />
                       - The download link only have encrypted file id.
                       <br />
-                      - The raw link will have the whole path includes the file
-                      name and extension.
+                      - The raw link will have the whole path includes the file name and extension.
                       <br />
                       <br />
-                      So if you want to embed the file, it&apos;s recommended to
-                      use the raw link instead of the download link.
+                      So if you want to embed the file, it&apos;s recommended to use the raw link instead of the
+                      download link.
                     </p>
                     <h4>Ref</h4>
                     <p>
-                      This information is based on the onedrive-vercel-index
-                      project documentation.
+                      This information is based on the onedrive-vercel-index project documentation.
                       <br />
                       <Link
                         href='https://ovi.swo.moe/docs/features/customise-direct-link'
@@ -305,78 +293,66 @@ export default function PreviewAction({ file }: Props) {
               </Drawer>
             )}
           </div>
+
           <div className='flex flex-col-reverse gap-3 tablet:flex-row tablet:items-center'>
             {showRaw ? (
-              <Button
+              <ButtonLoading
                 size={"sm"}
                 variant={"outline"}
-                className='gap-3'
+                icon='Copy'
                 onClick={onCopyRaw}
+                state={copyRawState}
               >
-                <Icon
-                  name='Copy'
-                  size={16}
-                />
                 Raw Link
-              </Button>
+              </ButtonLoading>
             ) : null}
             {showViewDoc ? (
-              <Button
+              <ButtonLoading
                 size={"sm"}
                 variant={"outline"}
-                className='gap-3'
+                icon='ExternalLink'
                 onClick={onOpenViewer}
+                state={viewerState}
               >
-                <Icon
-                  name='ExternalLink'
-                  size={16}
-                />
                 Open in Viewer
-              </Button>
+              </ButtonLoading>
             ) : null}
-            <Button
+
+            <ButtonLoading
               size={"sm"}
               variant={"outline"}
-              className='gap-3'
               onClick={onCopy}
+              state={copyDownloadState}
+              icon={"Copy"}
             >
-              <Icon
-                name='Copy'
-                size={16}
-              />
               Download Link
-            </Button>
-            <Button
+            </ButtonLoading>
+
+            <ButtonLoading
               size={"sm"}
-              className='gap-3'
               onClick={onDownload}
-              disabled={downloading}
+              state={downloadState}
+              icon='Download'
             >
-              <Icon
-                name={downloading ? "LoaderCircle" : "Download"}
-                size={16}
-                className={cn(downloading && "animate-spin")}
-              />
               Download
-            </Button>
+            </ButtonLoading>
           </div>
         </div>
       </Card>
+
       <Card slot='file-info'>
         <CardHeader>
           <CardTitle>File Information</CardTitle>
         </CardHeader>
         <CardContent>
-          <div className='flex flex-col'>
+          <div className='flex flex-col gap-1.5'>
             {fileInfo.map((info) => (
               <div
                 key={info.label}
                 className='group flex flex-col'
               >
-                <span className='font-semibold'>{info.label}:</span>
-                <span className='col-span-3 whitespace-pre-wrap break-all'>
-                  {info.value}
-                </span>
+                <span className='text-sm font-semibold'>{info.label}:</span>
+                <span className='col-span-3 whitespace-pre-wrap break-all'>{info.value}</span>
                 <Separator className='my-1.5 group-last-of-type:hidden' />
               </div>
             ))}
diff --git a/src/components/Preview/Layout.tsx b/src/components/Preview/Layout.tsx
new file mode 100644
index 0000000..3c8a0c6
--- /dev/null
+++ b/src/components/Preview/Layout.tsx
@@ -0,0 +1,119 @@
+"use client";
+
+import { useState } from "react";
+import { z } from "zod";
+
+import { Status } from "~/components/Global";
+import {
+  PreviewAudio,
+  PreviewDocument,
+  PreviewImage,
+  PreviewInformation,
+  PreviewManga,
+  PreviewRich,
+  PreviewUnknown,
+  PreviewVideo,
+} from "~/components/Preview";
+import { Button } from "~/components/ui/button";
+import { Card, CardContent, CardHeader } from "~/components/ui/card";
+import { Separator } from "~/components/ui/separator";
+
+import { cn } from "~/utils/cn";
+import { getFileType } from "~/utils/previewHelper";
+
+import { Schema_File } from "~/types/schema";
+
+import config from "config";
+
+type Props = {
+  data: z.infer<typeof Schema_File>;
+  fileType: "unknown" | ReturnType<typeof getFileType>;
+};
+export default function PreviewLayout({ data, fileType }: Props) {
+  const [view, setView] = useState<"markdown" | "raw">("markdown");
+  return (
+    <div
+      slot='preview-container'
+      className='flex flex-col gap-3'
+    >
+      <Card>
+        <CardHeader className='pb-0'>
+          <div
+            className={cn(
+              "flex flex-col gap-3 overflow-hidden",
+              "mobile:flex-row mobile:items-center mobile:justify-between",
+            )}
+          >
+            <h3 className='line-clamp-1 flex-grow whitespace-pre-wrap break-all'>{data.name}</h3>
+            {["text", "markdown", "code"].includes(fileType) && (
+              <div className='flex w-full items-center mobile:w-fit'>
+                <Button
+                  size={"sm"}
+                  variant={view === "markdown" ? "default" : "outline"}
+                  onClick={() => setView("markdown")}
+                  className='w-full rounded-r-none mobile:w-fit'
+                >
+                  Markdown
+                </Button>
+                <Button
+                  size={"sm"}
+                  variant={view === "raw" ? "default" : "outline"}
+                  onClick={() => setView("raw")}
+                  className='w-full rounded-l-none mobile:w-fit'
+                >
+                  Raw
+                </Button>
+              </div>
+            )}
+          </div>
+          <Separator />
+        </CardHeader>
+
+        <CardContent className='p-1.5 pt-0 tablet:p-3 tablet:pt-0'>
+          {config.apiConfig.streamMaxSize && Number(data.size || 0) > config.apiConfig.streamMaxSize ? (
+            <Status
+              icon='Frown'
+              message='File is too large to preview'
+            />
+          ) : (
+            <div className='px-3'>
+              {fileType === "image" ? (
+                <PreviewImage file={data} />
+              ) : fileType === "audio" ? (
+                <PreviewAudio file={data} />
+              ) : fileType === "video" ? (
+                <PreviewVideo file={data} />
+              ) : fileType === "code" ? (
+                <PreviewRich
+                  file={data}
+                  code
+                  view={view}
+                />
+              ) : fileType === "text" ? (
+                <PreviewRich
+                  file={data}
+                  view={view}
+                />
+              ) : fileType === "markdown" ? (
+                <PreviewRich
+                  file={data}
+                  view={view}
+                />
+              ) : fileType === "document" ? (
+                <PreviewDocument file={data} />
+              ) : fileType === "pdf" ? (
+                <PreviewDocument file={data} />
+              ) : fileType === "manga" ? (
+                <PreviewManga file={data} />
+              ) : (
+                <PreviewUnknown />
+              )}
+            </div>
+          )}
+        </CardContent>
+      </Card>
+
+      <PreviewInformation file={data} />
+    </div>
+  );
+}
diff --git a/src/app/@preview.manga.tsx b/src/components/Preview/Manga.tsx
similarity index 64%
rename from src/app/@preview.manga.tsx
rename to src/components/Preview/Manga.tsx
index bf07b07..67b4f07 100644
--- a/src/app/@preview.manga.tsx
+++ b/src/components/Preview/Manga.tsx
@@ -3,10 +3,8 @@
 import { AsyncUnzipInflate, Unzip } from "fflate";
 import { useEffect, useRef, useState } from "react";
 import { z } from "zod";
-import { Schema_File } from "~/schema";
-import { cn } from "~/utils";
 
-import Icon from "~/components/Icon";
+import { Icon, Loader, Status } from "~/components/Global";
 import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
 import { Button } from "~/components/ui/button";
 import {
@@ -19,11 +17,14 @@ import {
 } from "~/components/ui/carousel";
 import { Progress } from "~/components/ui/progress";
 
+import { cn } from "~/utils/cn";
+
 import useMediaQuery from "~/hooks/useMediaQuery";
 
-import config from "~/config/gIndex.config";
+import { Schema_File } from "~/types/schema";
 
-import { CreateDownloadToken } from "./actions";
+import { CreateDownloadToken } from "actions";
+import config from "config";
 
 type Props = {
   file: z.infer<typeof Schema_File>;
@@ -38,7 +39,7 @@ export default function PreviewManga({ file }: Props) {
   const [api, setApi] = useState<CarouselApi>();
 
   const [loadedPercent, setLoadedPercent] = useState<number>(0);
-  const [loadFirstX, setLoadFirstX] = useState<number>(5); // 5MB
+  const [loadFirstX] = useState<number>(5); // 5MB
 
   const abortController = useRef<AbortController>(new AbortController());
 
@@ -55,18 +56,13 @@ export default function PreviewManga({ file }: Props) {
           return;
         }
         const token = await CreateDownloadToken();
-        const streamURL = new URL(
-          `/api/stream/${file.encryptedId}`,
-          config.basePath,
-        );
+        const streamURL = new URL(`/api/stream/${file.encryptedId}`, config.basePath);
         streamURL.searchParams.set("token", token);
 
         const bufferStream = await fetch(streamURL, {
           signal: abortController.current.signal,
           headers: {
-            Range: `bytes=0-${
-              Math.min(Number(file.size || 1), loadFirstX * 1024 * 1024) - 1
-            }`,
+            Range: `bytes=0-${Math.min(Number(file.size || 1), loadFirstX * 1024 * 1024) - 1}`,
           },
         });
 
@@ -105,12 +101,7 @@ export default function PreviewManga({ file }: Props) {
             file.ondata = (err, data, final) => {
               if (err) throw err;
               // Check if the file is an image
-              if (
-                !file.name
-                  .toLowerCase()
-                  .includes(".jpg" || ".jpeg" || ".png" || ".gif" || ".webp")
-              )
-                return;
+              if (!file.name.toLowerCase().includes(".jpg" || ".jpeg" || ".png" || ".gif" || ".webp")) return;
               if (!final) return; // Skip if not fully loaded
 
               const blob = new Blob([data]);
@@ -119,10 +110,7 @@ export default function PreviewManga({ file }: Props) {
                 setImages((prev) => {
                   const exist = prev.find((p) => p.name === file.name);
                   if (exist) return prev;
-                  return [
-                    ...prev,
-                    { name: file.name, blob: reader.result as string },
-                  ];
+                  return [...prev, { name: file.name, blob: reader.result as string }];
                 });
               };
               reader.readAsDataURL(blob);
@@ -140,10 +128,6 @@ export default function PreviewManga({ file }: Props) {
         setLoading(false);
       }
     })();
-
-    // return () => {
-    //   abortController.current.abort("Cancelled by user");
-    // };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
@@ -159,60 +143,62 @@ export default function PreviewManga({ file }: Props) {
   return (
     <div className='flex h-full min-h-[33dvh] w-full items-center justify-center py-3'>
       {loading ? (
-        <div
-          className={cn(
-            "h-auto min-h-[50dvh] w-full",
-            "flex flex-grow flex-col items-center justify-center gap-3",
-          )}
-        >
-          <Icon
-            name='LoaderCircle'
-            size={32}
-            className='animate-spin text-foreground'
-          />
-          <p>Please wait while we downloading the content for preview</p>
-          <div className='flex w-full max-w-sm flex-col gap-1'>
-            <Progress
-              className='h-2 w-full'
-              value={loadedPercent}
-            />
-            <span className='text-center text-xs text-muted-foreground'>
-              {Math.round(loadedPercent)}% loaded
-            </span>
-          </div>
-          <Button
-            size={"sm"}
-            variant={"secondary"}
-            onClick={async () => {
-              abortController.current.abort("Cancelled by user");
-
-              const timeout = setTimeout(() => {
-                setLoading(false);
-                setError("Preview cancelled by user");
-                clearTimeout(timeout);
-              }, 100);
-            }}
-          >
-            Cancel Preview
-          </Button>
-        </div>
+        <Loader
+          message='Please wait while we downloading the content for preview'
+          extra={
+            <div className='flex w-full max-w-sm flex-col items-center gap-1'>
+              <Progress
+                className='h-2 w-full'
+                value={loadedPercent}
+              />
+              <span className='text-center text-xs text-muted-foreground'>{Math.round(loadedPercent)}% loaded</span>
+              <Button
+                size={"sm"}
+                variant={"secondary"}
+                onClick={async () => {
+                  abortController.current.abort("Cancelled by user");
+                  const timeout = setTimeout(() => {
+                    setLoading(false);
+                    setError("Preview cancelled by user");
+                    clearTimeout(timeout);
+                  }, 100);
+                }}
+              >
+                Cancel Preview
+              </Button>
+            </div>
+          }
+        />
       ) : error ? (
-        <div className='flex h-full flex-col items-center justify-center gap-3'>
-          <Icon
-            name='CircleX'
-            size={24}
-            className='text-destructive'
-          />
-          <span className='text-center text-destructive'>{error}</span>
-        </div>
+        <Status
+          icon='TriangleAlert'
+          message={error}
+          destructive
+        />
       ) : (
         <div className='flex w-full flex-col items-center justify-center gap-3'>
-          <div className='h-full w-full tablet:px-8'>
+          <Alert className='bg-yellow-50 text-yellow-600 dark:bg-yellow-950 dark:text-yellow-500'>
+            <div className='flex items-start gap-3'>
+              <Icon
+                name='TriangleAlert'
+                className='size-5'
+              />
+              <div className='flex flex-col'>
+                <AlertTitle>Preview Only</AlertTitle>
+                <AlertDescription>
+                  We only load the first {loadFirstX}MB of the file for preview. Please download the file for full
+                  content.
+                </AlertDescription>
+              </div>
+            </div>
+          </Alert>
+
+          <div
+            slot='manga-content'
+            className='h-full w-full tablet:px-8'
+          >
             <Carousel
-              className={cn(
-                "w-full",
-                viewSize === "fit" ? "h-full max-h-[70dvh]" : "h-full",
-              )}
+              className={cn("w-full", viewSize === "fit" ? "h-full max-h-[70dvh]" : "h-full")}
               opts={{
                 loop: false,
               }}
@@ -229,16 +215,9 @@ export default function PreviewManga({ file }: Props) {
                       <img
                         src={image.blob}
                         alt={`${image.name} - Page ${index + 1}`}
-                        className={cn(
-                          "w-full object-contain",
-                          viewSize === "fit"
-                            ? "h-full max-h-[70dvh]"
-                            : "h-full",
-                        )}
+                        className={cn("w-full object-contain", viewSize === "fit" ? "h-full max-h-[70dvh]" : "h-full")}
                       />
-                      <span className='muted text-center text-xs'>
-                        {image.name}
-                      </span>
+                      <span className='muted text-center text-xs'>{image.name}</span>
                     </CarouselItem>
                   ))}
               </CarouselContent>
@@ -250,8 +229,11 @@ export default function PreviewManga({ file }: Props) {
               ) : null}
             </Carousel>
           </div>
-          <div className='flex w-full items-center justify-end gap-3'>
-            <span className='text-primary-foreground'>
+          <div
+            slot='manga-info'
+            className='flex w-full items-center justify-end gap-3'
+          >
+            <span className='text-muted-foreground'>
               {currentImage}/{images.length}
             </span>
             <Button
@@ -270,32 +252,7 @@ export default function PreviewManga({ file }: Props) {
                 size={16}
               />
             </Button>
-            {/* <div
-              className='relative z-10 cursor-pointer p-0.5 text-foreground/80 transition hover:text-foreground'
-              onClick={() => setViewSize(viewSize === "fit" ? "full" : "fit")}
-            >
-              <Icon
-                name={viewSize === "fit" ? "Maximize" : "Minimize"}
-                size={14}
-              />
-            </div> */}
           </div>
-
-          <Alert className='bg-yellow-50 text-yellow-600 dark:bg-yellow-950 dark:text-yellow-500'>
-            <div className='flex items-start gap-3'>
-              <Icon
-                name='TriangleAlert'
-                className='size-5'
-              />
-              <div className='flex flex-col'>
-                <AlertTitle>Preview Only</AlertTitle>
-                <AlertDescription>
-                  We only load the first {loadFirstX}MB of the file for preview.
-                  Please download the file for full content.
-                </AlertDescription>
-              </div>
-            </div>
-          </Alert>
         </div>
       )}
     </div>
diff --git a/src/components/Preview/Rich.tsx b/src/components/Preview/Rich.tsx
new file mode 100644
index 0000000..dd9eed7
--- /dev/null
+++ b/src/components/Preview/Rich.tsx
@@ -0,0 +1,92 @@
+"use client";
+
+import { useState } from "react";
+import { z } from "zod";
+
+import { Icon, Loader, Markdown, Status } from "~/components/Global";
+import { Button } from "~/components/ui/button";
+
+import { cn } from "~/utils/cn";
+
+import useLoading from "~/hooks/useLoading";
+
+import { Schema_File } from "~/types/schema";
+
+import { GetContent } from "actions";
+
+type Props = {
+  file: z.infer<typeof Schema_File>;
+  view: "markdown" | "raw";
+  code?: boolean;
+};
+export default function PreviewRich({ file, code, view }: Props) {
+  const [content, setContent] = useState<string>("");
+  const [error, setError] = useState<string>("");
+  const [expand, setExpand] = useState<boolean>(false);
+
+  const loading = useLoading(async () => {
+    try {
+      const text = await GetContent(file.encryptedId);
+      if (!text) {
+        setError("Looks like there is no content to preview");
+        return;
+      }
+      setContent(text.trim());
+    } catch (error) {
+      const e = error as Error;
+      console.error(e);
+      setError(e.message);
+    }
+  }, [file]);
+
+  return (
+    <div className='flex h-fit min-h-[33dvh] w-full items-center justify-center py-3'>
+      {loading ? (
+        <Loader message='Loading content...' />
+      ) : error ? (
+        <Status
+          icon='TriangleAlert'
+          message={error}
+          destructive
+        />
+      ) : (
+        <div className={cn("relative w-full overflow-hidden", expand ? "h-full" : "max-h-[50dvh]")}>
+          <div
+            className={cn(
+              "w-full overflow-hidden",
+              expand
+                ? "[mask-image:linear-gradient(180deg,white_65%,white] h-full"
+                : "h-[50dvh] max-h-[50dvh] [mask-image:linear-gradient(180deg,white_65%,rgba(255,255,255,0))]",
+            )}
+          >
+            <Markdown
+              content={code && view === "markdown" ? `\`\`\`${file.fileExtension}\n${content}` : content}
+              view={view}
+            />
+          </div>
+          <div
+            className={cn(
+              "bottom-0 z-10 flex w-full items-center justify-center py-3 transition",
+              expand ? "relative" : "absolute",
+            )}
+          >
+            <Button
+              size={"sm"}
+              variant={"secondary"}
+              className='gap-1.5'
+              onClick={() => {
+                setExpand((prev) => !prev);
+              }}
+            >
+              <Icon
+                name={expand ? "ChevronUp" : "ChevronDown"}
+                size={16}
+              />
+              {expand ? "Collapse" : "Expand"}
+            </Button>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/components/Preview/Unknown.tsx b/src/components/Preview/Unknown.tsx
new file mode 100644
index 0000000..4c89b13
--- /dev/null
+++ b/src/components/Preview/Unknown.tsx
@@ -0,0 +1,18 @@
+"use client";
+
+import { Loader, Status } from "~/components/Global";
+
+import useLoading from "~/hooks/useLoading";
+
+export default function PreviewUnknown() {
+  const loading = useLoading();
+
+  if (loading) return <Loader message='Loading content...' />;
+
+  return (
+    <Status
+      icon='Frown'
+      message='This file type is not supported for preview, try downloading the file instead.'
+    />
+  );
+}
diff --git a/src/components/Preview/Video.tsx b/src/components/Preview/Video.tsx
new file mode 100644
index 0000000..8cfceaa
--- /dev/null
+++ b/src/components/Preview/Video.tsx
@@ -0,0 +1,96 @@
+"use client";
+
+import dynamic from "next/dynamic";
+import { useState } from "react";
+import { z } from "zod";
+
+import { Loader, Status } from "~/components/Global";
+
+import useLoading from "~/hooks/useLoading";
+
+import { Schema_File } from "~/types/schema";
+
+import { CreateDownloadToken } from "actions";
+
+const Plyr = dynamic(() => import("plyr-react"), {
+  ssr: false,
+  loading: () => <Loader message='Loading player...' />,
+});
+
+type Props = {
+  file: z.infer<typeof Schema_File>;
+};
+export default function PreviewVideo({ file }: Props) {
+  const [videoSrc, setVideoSrc] = useState<string>("");
+  const [error, setError] = useState<string>("");
+  const loading = useLoading(async () => {
+    try {
+      if (!file.encryptedWebContentLink) {
+        setError("No video to preview");
+        return;
+      }
+      const token = await CreateDownloadToken();
+      setVideoSrc(`/api/stream/${file.encryptedId}?token=${token}`);
+    } catch (error) {
+      const e = error as Error;
+      console.error(e);
+      setError(e.message);
+    }
+  }, [file]);
+
+  return (
+    <div className='flex h-full min-h-[33dvh] w-full items-center justify-center py-3'>
+      {loading ? (
+        <Loader message='Loading video...' />
+      ) : error ? (
+        <Status
+          icon='TriangleAlert'
+          message={error}
+          destructive
+        />
+      ) : (
+        <div className='h-full w-full'>
+          <Plyr
+            source={{
+              type: "video",
+              sources: [
+                {
+                  src: videoSrc,
+                  type: file.mimeType,
+                  size: file.size,
+                },
+              ],
+              poster: `/api/thumb/${file.encryptedId}?size=1000`,
+            }}
+            options={{
+              toggleInvert: true,
+              settings: ["quality", "speed"],
+              ratio: "16:9",
+              controls: [
+                "play-large",
+                "play",
+                "progress",
+                "current-time",
+                "duration",
+                "mute",
+                "volume",
+                "settings",
+                "pip",
+                "download",
+                "fullscreen",
+              ],
+              volume: 0.5,
+              muted: false,
+              loop: { active: false },
+              speed: { selected: 1, options: [0.5, 1, 1.5, 2] },
+              keyboard: {
+                focused: true,
+                global: true,
+              },
+            }}
+          />
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/components/Preview/index.tsx b/src/components/Preview/index.tsx
new file mode 100644
index 0000000..08df912
--- /dev/null
+++ b/src/components/Preview/index.tsx
@@ -0,0 +1,10 @@
+export { default as PreviewInformation } from "./Information";
+export { default as PreviewLayout } from "./Layout";
+
+export { default as PreviewAudio } from "./Audio";
+export { default as PreviewDocument } from "./Document";
+export { default as PreviewImage } from "./Image";
+export { default as PreviewManga } from "./Manga";
+export { default as PreviewRich } from "./Rich";
+export { default as PreviewUnknown } from "./Unknown";
+export { default as PreviewVideo } from "./Video";
diff --git a/src/components/ui/alert.tsx b/src/components/ui/alert.tsx
index bc3af5a..f468dab 100644
--- a/src/components/ui/alert.tsx
+++ b/src/components/ui/alert.tsx
@@ -1,7 +1,7 @@
-import * as React from "react"
-import { cva, type VariantProps } from "class-variance-authority"
+import { type VariantProps, cva } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
 const alertVariants = cva(
   "relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",
@@ -9,15 +9,14 @@ const alertVariants = cva(
     variants: {
       variant: {
         default: "bg-background text-foreground",
-        destructive:
-          "border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
+        destructive: "border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
       },
     },
     defaultVariants: {
       variant: "default",
     },
-  }
-)
+  },
+);
 
 const Alert = React.forwardRef<
   HTMLDivElement,
@@ -25,35 +24,33 @@ const Alert = React.forwardRef<
 >(({ className, variant, ...props }, ref) => (
   <div
     ref={ref}
-    role="alert"
+    role='alert'
     className={cn(alertVariants({ variant }), className)}
     {...props}
   />
-))
-Alert.displayName = "Alert"
+));
+Alert.displayName = "Alert";
 
-const AlertTitle = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLHeadingElement>
->(({ className, ...props }, ref) => (
-  <h5
-    ref={ref}
-    className={cn("mb-1 font-medium leading-none tracking-tight", className)}
-    {...props}
-  />
-))
-AlertTitle.displayName = "AlertTitle"
+const AlertTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => (
+    <h5
+      ref={ref}
+      className={cn("mb-1 font-medium leading-none tracking-tight", className)}
+      {...props}
+    />
+  ),
+);
+AlertTitle.displayName = "AlertTitle";
 
-const AlertDescription = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLParagraphElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("text-sm [&_p]:leading-relaxed", className)}
-    {...props}
-  />
-))
-AlertDescription.displayName = "AlertDescription"
+const AlertDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(
+  ({ className, ...props }, ref) => (
+    <div
+      ref={ref}
+      className={cn("text-sm [&_p]:leading-relaxed", className)}
+      {...props}
+    />
+  ),
+);
+AlertDescription.displayName = "AlertDescription";
 
-export { Alert, AlertTitle, AlertDescription }
+export { Alert, AlertDescription, AlertTitle };
diff --git a/src/components/ui/breadcrumb.tsx b/src/components/ui/breadcrumb.tsx
index 0564996..96a7403 100644
--- a/src/components/ui/breadcrumb.tsx
+++ b/src/components/ui/breadcrumb.tsx
@@ -1,51 +1,55 @@
-import * as React from "react"
-import { Slot } from "@radix-ui/react-slot"
-import { ChevronRight, MoreHorizontal } from "lucide-react"
+import { Slot } from "@radix-ui/react-slot";
+import { ChevronRight, MoreHorizontal } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
 const Breadcrumb = React.forwardRef<
   HTMLElement,
   React.ComponentPropsWithoutRef<"nav"> & {
-    separator?: React.ReactNode
+    separator?: React.ReactNode;
   }
->(({ ...props }, ref) => <nav ref={ref} aria-label="breadcrumb" {...props} />)
-Breadcrumb.displayName = "Breadcrumb"
-
-const BreadcrumbList = React.forwardRef<
-  HTMLOListElement,
-  React.ComponentPropsWithoutRef<"ol">
->(({ className, ...props }, ref) => (
-  <ol
+>(({ ...props }, ref) => (
+  <nav
     ref={ref}
-    className={cn(
-      "flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5",
-      className
-    )}
+    aria-label='breadcrumb'
     {...props}
   />
-))
-BreadcrumbList.displayName = "BreadcrumbList"
+));
+Breadcrumb.displayName = "Breadcrumb";
 
-const BreadcrumbItem = React.forwardRef<
-  HTMLLIElement,
-  React.ComponentPropsWithoutRef<"li">
->(({ className, ...props }, ref) => (
-  <li
-    ref={ref}
-    className={cn("inline-flex items-center gap-1.5", className)}
-    {...props}
-  />
-))
-BreadcrumbItem.displayName = "BreadcrumbItem"
+const BreadcrumbList = React.forwardRef<HTMLOListElement, React.ComponentPropsWithoutRef<"ol">>(
+  ({ className, ...props }, ref) => (
+    <ol
+      ref={ref}
+      className={cn(
+        "flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5",
+        className,
+      )}
+      {...props}
+    />
+  ),
+);
+BreadcrumbList.displayName = "BreadcrumbList";
+
+const BreadcrumbItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<"li">>(
+  ({ className, ...props }, ref) => (
+    <li
+      ref={ref}
+      className={cn("inline-flex items-center gap-1.5", className)}
+      {...props}
+    />
+  ),
+);
+BreadcrumbItem.displayName = "BreadcrumbItem";
 
 const BreadcrumbLink = React.forwardRef<
   HTMLAnchorElement,
   React.ComponentPropsWithoutRef<"a"> & {
-    asChild?: boolean
+    asChild?: boolean;
   }
 >(({ asChild, className, ...props }, ref) => {
-  const Comp = asChild ? Slot : "a"
+  const Comp = asChild ? Slot : "a";
 
   return (
     <Comp
@@ -53,63 +57,55 @@ const BreadcrumbLink = React.forwardRef<
       className={cn("transition-colors hover:text-foreground", className)}
       {...props}
     />
-  )
-})
-BreadcrumbLink.displayName = "BreadcrumbLink"
+  );
+});
+BreadcrumbLink.displayName = "BreadcrumbLink";
 
-const BreadcrumbPage = React.forwardRef<
-  HTMLSpanElement,
-  React.ComponentPropsWithoutRef<"span">
->(({ className, ...props }, ref) => (
-  <span
-    ref={ref}
-    role="link"
-    aria-disabled="true"
-    aria-current="page"
-    className={cn("font-normal text-foreground", className)}
-    {...props}
-  />
-))
-BreadcrumbPage.displayName = "BreadcrumbPage"
+const BreadcrumbPage = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<"span">>(
+  ({ className, ...props }, ref) => (
+    <span
+      ref={ref}
+      role='link'
+      aria-disabled='true'
+      aria-current='page'
+      className={cn("font-normal text-foreground", className)}
+      {...props}
+    />
+  ),
+);
+BreadcrumbPage.displayName = "BreadcrumbPage";
 
-const BreadcrumbSeparator = ({
-  children,
-  className,
-  ...props
-}: React.ComponentProps<"li">) => (
+const BreadcrumbSeparator = ({ children, className, ...props }: React.ComponentProps<"li">) => (
   <li
-    role="presentation"
-    aria-hidden="true"
+    role='presentation'
+    aria-hidden='true'
     className={cn("[&>svg]:size-3.5", className)}
     {...props}
   >
     {children ?? <ChevronRight />}
   </li>
-)
-BreadcrumbSeparator.displayName = "BreadcrumbSeparator"
+);
+BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
 
-const BreadcrumbEllipsis = ({
-  className,
-  ...props
-}: React.ComponentProps<"span">) => (
+const BreadcrumbEllipsis = ({ className, ...props }: React.ComponentProps<"span">) => (
   <span
-    role="presentation"
-    aria-hidden="true"
+    role='presentation'
+    aria-hidden='true'
     className={cn("flex h-9 w-9 items-center justify-center", className)}
     {...props}
   >
-    <MoreHorizontal className="h-4 w-4" />
-    <span className="sr-only">More</span>
+    <MoreHorizontal className='h-4 w-4' />
+    <span className='sr-only'>More</span>
   </span>
-)
-BreadcrumbEllipsis.displayName = "BreadcrumbElipssis"
+);
+BreadcrumbEllipsis.displayName = "BreadcrumbElipssis";
 
 export {
   Breadcrumb,
-  BreadcrumbList,
+  BreadcrumbEllipsis,
   BreadcrumbItem,
   BreadcrumbLink,
+  BreadcrumbList,
   BreadcrumbPage,
   BreadcrumbSeparator,
-  BreadcrumbEllipsis,
-}
+};
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index 0807807..52080d0 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -1,8 +1,8 @@
-import * as React from "react"
-import { Slot } from "@radix-ui/react-slot"
-import { cva, type VariantProps } from "class-variance-authority"
+import { Slot } from "@radix-ui/react-slot";
+import { type VariantProps, cva } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
 const buttonVariants = cva(
   "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
@@ -10,12 +10,9 @@ const buttonVariants = cva(
     variants: {
       variant: {
         default: "bg-primary text-primary-foreground hover:bg-primary/90",
-        destructive:
-          "bg-destructive text-destructive-foreground hover:bg-destructive/90",
-        outline:
-          "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
-        secondary:
-          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+        outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
         ghost: "hover:bg-accent hover:text-accent-foreground",
         link: "text-primary underline-offset-4 hover:underline",
       },
@@ -30,27 +27,27 @@ const buttonVariants = cva(
       variant: "default",
       size: "default",
     },
-  }
-)
+  },
+);
 
 export interface ButtonProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement>,
     VariantProps<typeof buttonVariants> {
-  asChild?: boolean
+  asChild?: boolean;
 }
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
-    const Comp = asChild ? Slot : "button"
+    const Comp = asChild ? Slot : "button";
     return (
       <Comp
         className={cn(buttonVariants({ variant, size, className }))}
         ref={ref}
         {...props}
       />
-    )
-  }
-)
-Button.displayName = "Button"
+    );
+  },
+);
+Button.displayName = "Button";
 
-export { Button, buttonVariants }
+export { Button, buttonVariants };
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
index 5516e98..d30cbee 100644
--- a/src/components/ui/card.tsx
+++ b/src/components/ui/card.tsx
@@ -1,79 +1,69 @@
-import * as React from "react"
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const Card = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
+const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
   <div
     ref={ref}
-    className={cn(
-      "rounded-lg border bg-card text-card-foreground shadow-sm",
-      className
-    )}
+    className={cn("rounded-lg border bg-card text-card-foreground shadow-sm", className)}
     {...props}
   />
-))
-Card.displayName = "Card"
+));
+Card.displayName = "Card";
 
-const CardHeader = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("flex flex-col space-y-1.5 p-6", className)}
-    {...props}
-  />
-))
-CardHeader.displayName = "CardHeader"
+const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div
+      ref={ref}
+      className={cn("flex flex-col space-y-1.5 p-6", className)}
+      {...props}
+    />
+  ),
+);
+CardHeader.displayName = "CardHeader";
 
-const CardTitle = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLHeadingElement>
->(({ className, ...props }, ref) => (
-  <h3
-    ref={ref}
-    className={cn(
-      "text-2xl font-semibold leading-none tracking-tight",
-      className
-    )}
-    {...props}
-  />
-))
-CardTitle.displayName = "CardTitle"
+const CardTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => (
+    <h3
+      ref={ref}
+      className={cn("text-2xl font-semibold leading-none tracking-tight", className)}
+      {...props}
+    />
+  ),
+);
+CardTitle.displayName = "CardTitle";
 
-const CardDescription = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLParagraphElement>
->(({ className, ...props }, ref) => (
-  <p
-    ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
-    {...props}
-  />
-))
-CardDescription.displayName = "CardDescription"
+const CardDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(
+  ({ className, ...props }, ref) => (
+    <p
+      ref={ref}
+      className={cn("text-sm text-muted-foreground", className)}
+      {...props}
+    />
+  ),
+);
+CardDescription.displayName = "CardDescription";
 
-const CardContent = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
-))
-CardContent.displayName = "CardContent"
+const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div
+      ref={ref}
+      className={cn("p-6 pt-0", className)}
+      {...props}
+    />
+  ),
+);
+CardContent.displayName = "CardContent";
 
-const CardFooter = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("flex items-center p-6 pt-0", className)}
-    {...props}
-  />
-))
-CardFooter.displayName = "CardFooter"
+const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div
+      ref={ref}
+      className={cn("flex items-center p-6 pt-0", className)}
+      {...props}
+    />
+  ),
+);
+CardFooter.displayName = "CardFooter";
 
-export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
diff --git a/src/components/ui/carousel.tsx b/src/components/ui/carousel.tsx
index 1a4b7cb..e950b92 100644
--- a/src/components/ui/carousel.tsx
+++ b/src/components/ui/carousel.tsx
@@ -1,124 +1,109 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import useEmblaCarousel, {
-  type UseEmblaCarouselType,
-} from "embla-carousel-react"
-import { ArrowLeft, ArrowRight } from "lucide-react"
+import useEmblaCarousel, { type UseEmblaCarouselType } from "embla-carousel-react";
+import { ArrowLeft, ArrowRight } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/utils"
-import { Button } from "~/components/ui/button"
+import { Button } from "~/components/ui/button";
 
-type CarouselApi = UseEmblaCarouselType[1]
-type UseCarouselParameters = Parameters<typeof useEmblaCarousel>
-type CarouselOptions = UseCarouselParameters[0]
-type CarouselPlugin = UseCarouselParameters[1]
+import { cn } from "~/utils/cn";
+
+type CarouselApi = UseEmblaCarouselType[1];
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
+type CarouselOptions = UseCarouselParameters[0];
+type CarouselPlugin = UseCarouselParameters[1];
 
 type CarouselProps = {
-  opts?: CarouselOptions
-  plugins?: CarouselPlugin
-  orientation?: "horizontal" | "vertical"
-  setApi?: (api: CarouselApi) => void
-}
+  opts?: CarouselOptions;
+  plugins?: CarouselPlugin;
+  orientation?: "horizontal" | "vertical";
+  setApi?: (api: CarouselApi) => void;
+};
 
 type CarouselContextProps = {
-  carouselRef: ReturnType<typeof useEmblaCarousel>[0]
-  api: ReturnType<typeof useEmblaCarousel>[1]
-  scrollPrev: () => void
-  scrollNext: () => void
-  canScrollPrev: boolean
-  canScrollNext: boolean
-} & CarouselProps
+  carouselRef: ReturnType<typeof useEmblaCarousel>[0];
+  api: ReturnType<typeof useEmblaCarousel>[1];
+  scrollPrev: () => void;
+  scrollNext: () => void;
+  canScrollPrev: boolean;
+  canScrollNext: boolean;
+} & CarouselProps;
 
-const CarouselContext = React.createContext<CarouselContextProps | null>(null)
+const CarouselContext = React.createContext<CarouselContextProps | null>(null);
 
 function useCarousel() {
-  const context = React.useContext(CarouselContext)
+  const context = React.useContext(CarouselContext);
 
   if (!context) {
-    throw new Error("useCarousel must be used within a <Carousel />")
+    throw new Error("useCarousel must be used within a <Carousel />");
   }
 
-  return context
+  return context;
 }
 
-const Carousel = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement> & CarouselProps
->(
-  (
-    {
-      orientation = "horizontal",
-      opts,
-      setApi,
-      plugins,
-      className,
-      children,
-      ...props
-    },
-    ref
-  ) => {
+const Carousel = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement> & CarouselProps>(
+  ({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }, ref) => {
     const [carouselRef, api] = useEmblaCarousel(
       {
         ...opts,
         axis: orientation === "horizontal" ? "x" : "y",
       },
-      plugins
-    )
-    const [canScrollPrev, setCanScrollPrev] = React.useState(false)
-    const [canScrollNext, setCanScrollNext] = React.useState(false)
+      plugins,
+    );
+    const [canScrollPrev, setCanScrollPrev] = React.useState(false);
+    const [canScrollNext, setCanScrollNext] = React.useState(false);
 
     const onSelect = React.useCallback((api: CarouselApi) => {
       if (!api) {
-        return
+        return;
       }
 
-      setCanScrollPrev(api.canScrollPrev())
-      setCanScrollNext(api.canScrollNext())
-    }, [])
+      setCanScrollPrev(api.canScrollPrev());
+      setCanScrollNext(api.canScrollNext());
+    }, []);
 
     const scrollPrev = React.useCallback(() => {
-      api?.scrollPrev()
-    }, [api])
+      api?.scrollPrev();
+    }, [api]);
 
     const scrollNext = React.useCallback(() => {
-      api?.scrollNext()
-    }, [api])
+      api?.scrollNext();
+    }, [api]);
 
     const handleKeyDown = React.useCallback(
       (event: React.KeyboardEvent<HTMLDivElement>) => {
         if (event.key === "ArrowLeft") {
-          event.preventDefault()
-          scrollPrev()
+          event.preventDefault();
+          scrollPrev();
         } else if (event.key === "ArrowRight") {
-          event.preventDefault()
-          scrollNext()
+          event.preventDefault();
+          scrollNext();
         }
       },
-      [scrollPrev, scrollNext]
-    )
+      [scrollPrev, scrollNext],
+    );
 
     React.useEffect(() => {
       if (!api || !setApi) {
-        return
+        return;
       }
 
-      setApi(api)
-    }, [api, setApi])
+      setApi(api);
+    }, [api, setApi]);
 
     React.useEffect(() => {
       if (!api) {
-        return
+        return;
       }
 
-      onSelect(api)
-      api.on("reInit", onSelect)
-      api.on("select", onSelect)
+      onSelect(api);
+      api.on("reInit", onSelect);
+      api.on("select", onSelect);
 
       return () => {
-        api?.off("select", onSelect)
-      }
-    }, [api, onSelect])
+        api?.off("select", onSelect);
+      };
+    }, [api, onSelect]);
 
     return (
       <CarouselContext.Provider
@@ -126,8 +111,7 @@ const Carousel = React.forwardRef<
           carouselRef,
           api: api,
           opts,
-          orientation:
-            orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
+          orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
           scrollPrev,
           scrollNext,
           canScrollPrev,
@@ -138,125 +122,109 @@ const Carousel = React.forwardRef<
           ref={ref}
           onKeyDownCapture={handleKeyDown}
           className={cn("relative", className)}
-          role="region"
-          aria-roledescription="carousel"
+          role='region'
+          aria-roledescription='carousel'
           {...props}
         >
           {children}
         </div>
       </CarouselContext.Provider>
-    )
-  }
-)
-Carousel.displayName = "Carousel"
+    );
+  },
+);
+Carousel.displayName = "Carousel";
 
-const CarouselContent = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => {
-  const { carouselRef, orientation } = useCarousel()
+const CarouselContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => {
+    const { carouselRef, orientation } = useCarousel();
 
-  return (
-    <div ref={carouselRef} className="overflow-hidden">
+    return (
+      <div
+        ref={carouselRef}
+        className='overflow-hidden'
+      >
+        <div
+          ref={ref}
+          className={cn("flex", orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col", className)}
+          {...props}
+        />
+      </div>
+    );
+  },
+);
+CarouselContent.displayName = "CarouselContent";
+
+const CarouselItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => {
+    const { orientation } = useCarousel();
+
+    return (
       <div
         ref={ref}
-        className={cn(
-          "flex",
-          orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col",
-          className
-        )}
+        role='group'
+        aria-roledescription='slide'
+        className={cn("min-w-0 shrink-0 grow-0 basis-full", orientation === "horizontal" ? "pl-4" : "pt-4", className)}
         {...props}
       />
-    </div>
-  )
-})
-CarouselContent.displayName = "CarouselContent"
+    );
+  },
+);
+CarouselItem.displayName = "CarouselItem";
 
-const CarouselItem = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => {
-  const { orientation } = useCarousel()
+const CarouselPrevious = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(
+  ({ className, variant = "outline", size = "icon", ...props }, ref) => {
+    const { orientation, scrollPrev, canScrollPrev } = useCarousel();
 
-  return (
-    <div
-      ref={ref}
-      role="group"
-      aria-roledescription="slide"
-      className={cn(
-        "min-w-0 shrink-0 grow-0 basis-full",
-        orientation === "horizontal" ? "pl-4" : "pt-4",
-        className
-      )}
-      {...props}
-    />
-  )
-})
-CarouselItem.displayName = "CarouselItem"
+    return (
+      <Button
+        ref={ref}
+        variant={variant}
+        size={size}
+        className={cn(
+          "absolute  h-8 w-8 rounded-full",
+          orientation === "horizontal"
+            ? "-left-12 top-1/2 -translate-y-1/2"
+            : "-top-12 left-1/2 -translate-x-1/2 rotate-90",
+          className,
+        )}
+        disabled={!canScrollPrev}
+        onClick={scrollPrev}
+        {...props}
+      >
+        <ArrowLeft className='h-4 w-4' />
+        <span className='sr-only'>Previous slide</span>
+      </Button>
+    );
+  },
+);
+CarouselPrevious.displayName = "CarouselPrevious";
 
-const CarouselPrevious = React.forwardRef<
-  HTMLButtonElement,
-  React.ComponentProps<typeof Button>
->(({ className, variant = "outline", size = "icon", ...props }, ref) => {
-  const { orientation, scrollPrev, canScrollPrev } = useCarousel()
+const CarouselNext = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(
+  ({ className, variant = "outline", size = "icon", ...props }, ref) => {
+    const { orientation, scrollNext, canScrollNext } = useCarousel();
 
-  return (
-    <Button
-      ref={ref}
-      variant={variant}
-      size={size}
-      className={cn(
-        "absolute  h-8 w-8 rounded-full",
-        orientation === "horizontal"
-          ? "-left-12 top-1/2 -translate-y-1/2"
-          : "-top-12 left-1/2 -translate-x-1/2 rotate-90",
-        className
-      )}
-      disabled={!canScrollPrev}
-      onClick={scrollPrev}
-      {...props}
-    >
-      <ArrowLeft className="h-4 w-4" />
-      <span className="sr-only">Previous slide</span>
-    </Button>
-  )
-})
-CarouselPrevious.displayName = "CarouselPrevious"
+    return (
+      <Button
+        ref={ref}
+        variant={variant}
+        size={size}
+        className={cn(
+          "absolute h-8 w-8 rounded-full",
+          orientation === "horizontal"
+            ? "-right-12 top-1/2 -translate-y-1/2"
+            : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
+          className,
+        )}
+        disabled={!canScrollNext}
+        onClick={scrollNext}
+        {...props}
+      >
+        <ArrowRight className='h-4 w-4' />
+        <span className='sr-only'>Next slide</span>
+      </Button>
+    );
+  },
+);
+CarouselNext.displayName = "CarouselNext";
 
-const CarouselNext = React.forwardRef<
-  HTMLButtonElement,
-  React.ComponentProps<typeof Button>
->(({ className, variant = "outline", size = "icon", ...props }, ref) => {
-  const { orientation, scrollNext, canScrollNext } = useCarousel()
-
-  return (
-    <Button
-      ref={ref}
-      variant={variant}
-      size={size}
-      className={cn(
-        "absolute h-8 w-8 rounded-full",
-        orientation === "horizontal"
-          ? "-right-12 top-1/2 -translate-y-1/2"
-          : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
-        className
-      )}
-      disabled={!canScrollNext}
-      onClick={scrollNext}
-      {...props}
-    >
-      <ArrowRight className="h-4 w-4" />
-      <span className="sr-only">Next slide</span>
-    </Button>
-  )
-})
-CarouselNext.displayName = "CarouselNext"
-
-export {
-  type CarouselApi,
-  Carousel,
-  CarouselContent,
-  CarouselItem,
-  CarouselPrevious,
-  CarouselNext,
-}
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type CarouselApi };
diff --git a/src/components/ui/dialog.tsx b/src/components/ui/dialog.tsx
index fe03109..c2fd8f9 100644
--- a/src/components/ui/dialog.tsx
+++ b/src/components/ui/dialog.tsx
@@ -1,18 +1,18 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as DialogPrimitive from "@radix-ui/react-dialog"
-import { X } from "lucide-react"
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { X } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const Dialog = DialogPrimitive.Root
+const Dialog = DialogPrimitive.Root;
 
-const DialogTrigger = DialogPrimitive.Trigger
+const DialogTrigger = DialogPrimitive.Trigger;
 
-const DialogPortal = DialogPrimitive.Portal
+const DialogPortal = DialogPrimitive.Portal;
 
-const DialogClose = DialogPrimitive.Close
+const DialogClose = DialogPrimitive.Close;
 
 const DialogOverlay = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Overlay>,
@@ -22,64 +22,52 @@ const DialogOverlay = React.forwardRef<
     ref={ref}
     className={cn(
       "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
+      className,
     )}
     {...props}
   />
-))
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 
 const DialogContent = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & { portal?: HTMLElement | null }
 >(({ className, children, ...props }, ref) => (
-  <DialogPortal>
+  <DialogPortal container={props.portal}>
     <DialogOverlay />
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
         "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
-        className
+        className,
       )}
       {...props}
     >
       {children}
-      <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
-        <X className="h-4 w-4" />
-        <span className="sr-only">Close</span>
+      <DialogPrimitive.Close className='absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground'>
+        <X className='h-4 w-4' />
+        <span className='sr-only'>Close</span>
       </DialogPrimitive.Close>
     </DialogPrimitive.Content>
   </DialogPortal>
-))
-DialogContent.displayName = DialogPrimitive.Content.displayName
+));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
 
-const DialogHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn(
-      "flex flex-col space-y-1.5 text-center sm:text-left",
-      className
-    )}
+    className={cn("flex flex-col space-y-1.5 text-center sm:text-left", className)}
     {...props}
   />
-)
-DialogHeader.displayName = "DialogHeader"
+);
+DialogHeader.displayName = "DialogHeader";
 
-const DialogFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
-    )}
+    className={cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className)}
     {...props}
   />
-)
-DialogFooter.displayName = "DialogFooter"
+);
+DialogFooter.displayName = "DialogFooter";
 
 const DialogTitle = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Title>,
@@ -87,14 +75,11 @@ const DialogTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DialogPrimitive.Title
     ref={ref}
-    className={cn(
-      "text-lg font-semibold leading-none tracking-tight",
-      className
-    )}
+    className={cn("text-lg font-semibold leading-none tracking-tight", className)}
     {...props}
   />
-))
-DialogTitle.displayName = DialogPrimitive.Title.displayName
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
 
 const DialogDescription = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Description>,
@@ -105,18 +90,18 @@ const DialogDescription = React.forwardRef<
     className={cn("text-sm text-muted-foreground", className)}
     {...props}
   />
-))
-DialogDescription.displayName = DialogPrimitive.Description.displayName
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
 
 export {
   Dialog,
-  DialogPortal,
-  DialogOverlay,
   DialogClose,
-  DialogTrigger,
   DialogContent,
-  DialogHeader,
-  DialogFooter,
-  DialogTitle,
   DialogDescription,
-}
+  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger,
+};
diff --git a/src/components/ui/drawer.tsx b/src/components/ui/drawer.tsx
index db275ad..2913732 100644
--- a/src/components/ui/drawer.tsx
+++ b/src/components/ui/drawer.tsx
@@ -1,26 +1,23 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import { Drawer as DrawerPrimitive } from "vaul"
+import * as React from "react";
+import { Drawer as DrawerPrimitive } from "vaul";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const Drawer = ({
-  shouldScaleBackground = true,
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Root>) => (
+const Drawer = ({ shouldScaleBackground = true, ...props }: React.ComponentProps<typeof DrawerPrimitive.Root>) => (
   <DrawerPrimitive.Root
     shouldScaleBackground={shouldScaleBackground}
     {...props}
   />
-)
-Drawer.displayName = "Drawer"
+);
+Drawer.displayName = "Drawer";
 
-const DrawerTrigger = DrawerPrimitive.Trigger
+const DrawerTrigger = DrawerPrimitive.Trigger;
 
-const DrawerPortal = DrawerPrimitive.Portal
+const DrawerPortal = DrawerPrimitive.Portal;
 
-const DrawerClose = DrawerPrimitive.Close
+const DrawerClose = DrawerPrimitive.Close;
 
 const DrawerOverlay = React.forwardRef<
   React.ElementRef<typeof DrawerPrimitive.Overlay>,
@@ -31,51 +28,45 @@ const DrawerOverlay = React.forwardRef<
     className={cn("fixed inset-0 z-50 bg-black/80", className)}
     {...props}
   />
-))
-DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName
+));
+DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
 
 const DrawerContent = React.forwardRef<
   React.ElementRef<typeof DrawerPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content>
+  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content> & { portal?: HTMLElement | null }
 >(({ className, children, ...props }, ref) => (
-  <DrawerPortal>
+  <DrawerPortal container={props.portal}>
     <DrawerOverlay />
     <DrawerPrimitive.Content
       ref={ref}
       className={cn(
         "fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background",
-        className
+        className,
       )}
       {...props}
     >
-      <div className="mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted" />
+      <div className='mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted' />
       {children}
     </DrawerPrimitive.Content>
   </DrawerPortal>
-))
-DrawerContent.displayName = "DrawerContent"
+));
+DrawerContent.displayName = "DrawerContent";
 
-const DrawerHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const DrawerHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn("grid gap-1.5 p-4 text-center sm:text-left", className)}
     {...props}
   />
-)
-DrawerHeader.displayName = "DrawerHeader"
+);
+DrawerHeader.displayName = "DrawerHeader";
 
-const DrawerFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const DrawerFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn("mt-auto flex flex-col gap-2 p-4", className)}
     {...props}
   />
-)
-DrawerFooter.displayName = "DrawerFooter"
+);
+DrawerFooter.displayName = "DrawerFooter";
 
 const DrawerTitle = React.forwardRef<
   React.ElementRef<typeof DrawerPrimitive.Title>,
@@ -83,14 +74,11 @@ const DrawerTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DrawerPrimitive.Title
     ref={ref}
-    className={cn(
-      "text-lg font-semibold leading-none tracking-tight",
-      className
-    )}
+    className={cn("text-lg font-semibold leading-none tracking-tight", className)}
     {...props}
   />
-))
-DrawerTitle.displayName = DrawerPrimitive.Title.displayName
+));
+DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
 
 const DrawerDescription = React.forwardRef<
   React.ElementRef<typeof DrawerPrimitive.Description>,
@@ -101,18 +89,18 @@ const DrawerDescription = React.forwardRef<
     className={cn("text-sm text-muted-foreground", className)}
     {...props}
   />
-))
-DrawerDescription.displayName = DrawerPrimitive.Description.displayName
+));
+DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
 
 export {
   Drawer,
-  DrawerPortal,
-  DrawerOverlay,
-  DrawerTrigger,
   DrawerClose,
   DrawerContent,
-  DrawerHeader,
-  DrawerFooter,
-  DrawerTitle,
   DrawerDescription,
-}
+  DrawerFooter,
+  DrawerHeader,
+  DrawerOverlay,
+  DrawerPortal,
+  DrawerTitle,
+  DrawerTrigger,
+};
diff --git a/src/components/ui/dropdown-menu.tsx b/src/components/ui/dropdown-menu.tsx
index 026d7ae..9bbbbca 100644
--- a/src/components/ui/dropdown-menu.tsx
+++ b/src/components/ui/dropdown-menu.tsx
@@ -1,27 +1,27 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
-import { Check, ChevronRight, Circle } from "lucide-react"
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
+import { Check, ChevronRight, Circle } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const DropdownMenu = DropdownMenuPrimitive.Root
+const DropdownMenu = DropdownMenuPrimitive.Root;
 
-const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger
+const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 
-const DropdownMenuGroup = DropdownMenuPrimitive.Group
+const DropdownMenuGroup = DropdownMenuPrimitive.Group;
 
-const DropdownMenuPortal = DropdownMenuPrimitive.Portal
+const DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 
-const DropdownMenuSub = DropdownMenuPrimitive.Sub
+const DropdownMenuSub = DropdownMenuPrimitive.Sub;
 
-const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup
+const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
 
 const DropdownMenuSubTrigger = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,
   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {
-    inset?: boolean
+    inset?: boolean;
   }
 >(({ className, inset, children, ...props }, ref) => (
   <DropdownMenuPrimitive.SubTrigger
@@ -29,16 +29,15 @@ const DropdownMenuSubTrigger = React.forwardRef<
     className={cn(
       "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   >
     {children}
-    <ChevronRight className="ml-auto h-4 w-4" />
+    <ChevronRight className='ml-auto h-4 w-4' />
   </DropdownMenuPrimitive.SubTrigger>
-))
-DropdownMenuSubTrigger.displayName =
-  DropdownMenuPrimitive.SubTrigger.displayName
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
 
 const DropdownMenuSubContent = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
@@ -48,36 +47,35 @@ const DropdownMenuSubContent = React.forwardRef<
     ref={ref}
     className={cn(
       "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
+      className,
     )}
     {...props}
   />
-))
-DropdownMenuSubContent.displayName =
-  DropdownMenuPrimitive.SubContent.displayName
+));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
 
 const DropdownMenuContent = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & { portal?: HTMLElement | null }
 >(({ className, sideOffset = 4, ...props }, ref) => (
-  <DropdownMenuPrimitive.Portal>
+  <DropdownMenuPrimitive.Portal container={props.portal}>
     <DropdownMenuPrimitive.Content
       ref={ref}
       sideOffset={sideOffset}
       className={cn(
         "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        className
+        className,
       )}
       {...props}
     />
   </DropdownMenuPrimitive.Portal>
-))
-DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
+));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
 
 const DropdownMenuItem = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Item>,
   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {
-    inset?: boolean
+    inset?: boolean;
   }
 >(({ className, inset, ...props }, ref) => (
   <DropdownMenuPrimitive.Item
@@ -85,12 +83,12 @@ const DropdownMenuItem = React.forwardRef<
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   />
-))
-DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
 
 const DropdownMenuCheckboxItem = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,
@@ -100,21 +98,20 @@ const DropdownMenuCheckboxItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     checked={checked}
     {...props}
   >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span className='absolute left-2 flex h-3.5 w-3.5 items-center justify-center'>
       <DropdownMenuPrimitive.ItemIndicator>
-        <Check className="h-4 w-4" />
+        <Check className='h-4 w-4' />
       </DropdownMenuPrimitive.ItemIndicator>
     </span>
     {children}
   </DropdownMenuPrimitive.CheckboxItem>
-))
-DropdownMenuCheckboxItem.displayName =
-  DropdownMenuPrimitive.CheckboxItem.displayName
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
 
 const DropdownMenuRadioItem = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,
@@ -124,37 +121,33 @@ const DropdownMenuRadioItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span className='absolute left-2 flex h-3.5 w-3.5 items-center justify-center'>
       <DropdownMenuPrimitive.ItemIndicator>
-        <Circle className="h-2 w-2 fill-current" />
+        <Circle className='h-2 w-2 fill-current' />
       </DropdownMenuPrimitive.ItemIndicator>
     </span>
     {children}
   </DropdownMenuPrimitive.RadioItem>
-))
-DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
 
 const DropdownMenuLabel = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Label>,
   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {
-    inset?: boolean
+    inset?: boolean;
   }
 >(({ className, inset, ...props }, ref) => (
   <DropdownMenuPrimitive.Label
     ref={ref}
-    className={cn(
-      "px-2 py-1.5 text-sm font-semibold",
-      inset && "pl-8",
-      className
-    )}
+    className={cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className)}
     {...props}
   />
-))
-DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
 
 const DropdownMenuSeparator = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Separator>,
@@ -165,36 +158,33 @@ const DropdownMenuSeparator = React.forwardRef<
     className={cn("-mx-1 my-1 h-px bg-muted", className)}
     {...props}
   />
-))
-DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
 
-const DropdownMenuShortcut = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLSpanElement>) => {
+const DropdownMenuShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {
   return (
     <span
       className={cn("ml-auto text-xs tracking-widest opacity-60", className)}
       {...props}
     />
-  )
-}
-DropdownMenuShortcut.displayName = "DropdownMenuShortcut"
+  );
+};
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 
 export {
   DropdownMenu,
-  DropdownMenuTrigger,
-  DropdownMenuContent,
-  DropdownMenuItem,
   DropdownMenuCheckboxItem,
-  DropdownMenuRadioItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
   DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
   DropdownMenuSeparator,
   DropdownMenuShortcut,
-  DropdownMenuGroup,
-  DropdownMenuPortal,
   DropdownMenuSub,
   DropdownMenuSubContent,
   DropdownMenuSubTrigger,
-  DropdownMenuRadioGroup,
-}
+  DropdownMenuTrigger,
+};
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
index 2f3425f..234f101 100644
--- a/src/components/ui/input.tsx
+++ b/src/components/ui/input.tsx
@@ -1,25 +1,22 @@
-import * as React from "react"
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-export interface InputProps
-  extends React.InputHTMLAttributes<HTMLInputElement> {}
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
 
-const Input = React.forwardRef<HTMLInputElement, InputProps>(
-  ({ className, type, ...props }, ref) => {
-    return (
-      <input
-        type={type}
-        className={cn(
-          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-          className
-        )}
-        ref={ref}
-        {...props}
-      />
-    )
-  }
-)
-Input.displayName = "Input"
+const Input = React.forwardRef<HTMLInputElement, InputProps>(({ className, type, ...props }, ref) => {
+  return (
+    <input
+      type={type}
+      className={cn(
+        "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+        className,
+      )}
+      ref={ref}
+      {...props}
+    />
+  );
+});
+Input.displayName = "Input";
 
-export { Input }
+export { Input };
diff --git a/src/components/ui/label.tsx b/src/components/ui/label.tsx
index 1b3e1a8..29e71de 100644
--- a/src/components/ui/label.tsx
+++ b/src/components/ui/label.tsx
@@ -1,26 +1,23 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as LabelPrimitive from "@radix-ui/react-label"
-import { cva, type VariantProps } from "class-variance-authority"
+import * as LabelPrimitive from "@radix-ui/react-label";
+import { type VariantProps, cva } from "class-variance-authority";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const labelVariants = cva(
-  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-)
+const labelVariants = cva("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
 
 const Label = React.forwardRef<
   React.ElementRef<typeof LabelPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
-    VariantProps<typeof labelVariants>
+  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>
 >(({ className, ...props }, ref) => (
   <LabelPrimitive.Root
     ref={ref}
     className={cn(labelVariants(), className)}
     {...props}
   />
-))
-Label.displayName = LabelPrimitive.Root.displayName
+));
+Label.displayName = LabelPrimitive.Root.displayName;
 
-export { Label }
+export { Label };
diff --git a/src/components/ui/menubar.tsx b/src/components/ui/menubar.tsx
index 324efcc..9b4eb91 100644
--- a/src/components/ui/menubar.tsx
+++ b/src/components/ui/menubar.tsx
@@ -1,20 +1,20 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as MenubarPrimitive from "@radix-ui/react-menubar"
-import { Check, ChevronRight, Circle } from "lucide-react"
+import * as MenubarPrimitive from "@radix-ui/react-menubar";
+import { Check, ChevronRight, Circle } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const MenubarMenu = MenubarPrimitive.Menu
+const MenubarMenu = MenubarPrimitive.Menu;
 
-const MenubarGroup = MenubarPrimitive.Group
+const MenubarGroup = MenubarPrimitive.Group;
 
-const MenubarPortal = MenubarPrimitive.Portal
+const MenubarPortal = MenubarPrimitive.Portal;
 
-const MenubarSub = MenubarPrimitive.Sub
+const MenubarSub = MenubarPrimitive.Sub;
 
-const MenubarRadioGroup = MenubarPrimitive.RadioGroup
+const MenubarRadioGroup = MenubarPrimitive.RadioGroup;
 
 const Menubar = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.Root>,
@@ -22,14 +22,11 @@ const Menubar = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <MenubarPrimitive.Root
     ref={ref}
-    className={cn(
-      "flex h-10 items-center space-x-1 rounded-md border bg-background p-1",
-      className
-    )}
+    className={cn("flex h-10 items-center space-x-1 rounded-md border bg-background p-1", className)}
     {...props}
   />
-))
-Menubar.displayName = MenubarPrimitive.Root.displayName
+));
+Menubar.displayName = MenubarPrimitive.Root.displayName;
 
 const MenubarTrigger = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.Trigger>,
@@ -39,17 +36,17 @@ const MenubarTrigger = React.forwardRef<
     ref={ref}
     className={cn(
       "flex cursor-default select-none items-center rounded-sm px-3 py-1.5 text-sm font-medium outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
-      className
+      className,
     )}
     {...props}
   />
-))
-MenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName
+));
+MenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName;
 
 const MenubarSubTrigger = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.SubTrigger>,
   React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubTrigger> & {
-    inset?: boolean
+    inset?: boolean;
   }
 >(({ className, inset, children, ...props }, ref) => (
   <MenubarPrimitive.SubTrigger
@@ -57,15 +54,15 @@ const MenubarSubTrigger = React.forwardRef<
     className={cn(
       "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   >
     {children}
-    <ChevronRight className="ml-auto h-4 w-4" />
+    <ChevronRight className='ml-auto h-4 w-4' />
   </MenubarPrimitive.SubTrigger>
-))
-MenubarSubTrigger.displayName = MenubarPrimitive.SubTrigger.displayName
+));
+MenubarSubTrigger.displayName = MenubarPrimitive.SubTrigger.displayName;
 
 const MenubarSubContent = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.SubContent>,
@@ -75,42 +72,37 @@ const MenubarSubContent = React.forwardRef<
     ref={ref}
     className={cn(
       "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
+      className,
     )}
     {...props}
   />
-))
-MenubarSubContent.displayName = MenubarPrimitive.SubContent.displayName
+));
+MenubarSubContent.displayName = MenubarPrimitive.SubContent.displayName;
 
 const MenubarContent = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Content>
->(
-  (
-    { className, align = "start", alignOffset = -4, sideOffset = 8, ...props },
-    ref
-  ) => (
-    <MenubarPrimitive.Portal>
-      <MenubarPrimitive.Content
-        ref={ref}
-        align={align}
-        alignOffset={alignOffset}
-        sideOffset={sideOffset}
-        className={cn(
-          "z-50 min-w-[12rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-          className
-        )}
-        {...props}
-      />
-    </MenubarPrimitive.Portal>
-  )
-)
-MenubarContent.displayName = MenubarPrimitive.Content.displayName
+>(({ className, align = "start", alignOffset = -4, sideOffset = 8, ...props }, ref) => (
+  <MenubarPrimitive.Portal>
+    <MenubarPrimitive.Content
+      ref={ref}
+      align={align}
+      alignOffset={alignOffset}
+      sideOffset={sideOffset}
+      className={cn(
+        "z-50 min-w-[12rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className,
+      )}
+      {...props}
+    />
+  </MenubarPrimitive.Portal>
+));
+MenubarContent.displayName = MenubarPrimitive.Content.displayName;
 
 const MenubarItem = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.Item>,
   React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Item> & {
-    inset?: boolean
+    inset?: boolean;
   }
 >(({ className, inset, ...props }, ref) => (
   <MenubarPrimitive.Item
@@ -118,12 +110,12 @@ const MenubarItem = React.forwardRef<
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       inset && "pl-8",
-      className
+      className,
     )}
     {...props}
   />
-))
-MenubarItem.displayName = MenubarPrimitive.Item.displayName
+));
+MenubarItem.displayName = MenubarPrimitive.Item.displayName;
 
 const MenubarCheckboxItem = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.CheckboxItem>,
@@ -133,20 +125,20 @@ const MenubarCheckboxItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     checked={checked}
     {...props}
   >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span className='absolute left-2 flex h-3.5 w-3.5 items-center justify-center'>
       <MenubarPrimitive.ItemIndicator>
-        <Check className="h-4 w-4" />
+        <Check className='h-4 w-4' />
       </MenubarPrimitive.ItemIndicator>
     </span>
     {children}
   </MenubarPrimitive.CheckboxItem>
-))
-MenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName
+));
+MenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName;
 
 const MenubarRadioItem = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.RadioItem>,
@@ -156,37 +148,33 @@ const MenubarRadioItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span className='absolute left-2 flex h-3.5 w-3.5 items-center justify-center'>
       <MenubarPrimitive.ItemIndicator>
-        <Circle className="h-2 w-2 fill-current" />
+        <Circle className='h-2 w-2 fill-current' />
       </MenubarPrimitive.ItemIndicator>
     </span>
     {children}
   </MenubarPrimitive.RadioItem>
-))
-MenubarRadioItem.displayName = MenubarPrimitive.RadioItem.displayName
+));
+MenubarRadioItem.displayName = MenubarPrimitive.RadioItem.displayName;
 
 const MenubarLabel = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.Label>,
   React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Label> & {
-    inset?: boolean
+    inset?: boolean;
   }
 >(({ className, inset, ...props }, ref) => (
   <MenubarPrimitive.Label
     ref={ref}
-    className={cn(
-      "px-2 py-1.5 text-sm font-semibold",
-      inset && "pl-8",
-      className
-    )}
+    className={cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className)}
     {...props}
   />
-))
-MenubarLabel.displayName = MenubarPrimitive.Label.displayName
+));
+MenubarLabel.displayName = MenubarPrimitive.Label.displayName;
 
 const MenubarSeparator = React.forwardRef<
   React.ElementRef<typeof MenubarPrimitive.Separator>,
@@ -197,40 +185,34 @@ const MenubarSeparator = React.forwardRef<
     className={cn("-mx-1 my-1 h-px bg-muted", className)}
     {...props}
   />
-))
-MenubarSeparator.displayName = MenubarPrimitive.Separator.displayName
+));
+MenubarSeparator.displayName = MenubarPrimitive.Separator.displayName;
 
-const MenubarShortcut = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLSpanElement>) => {
+const MenubarShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {
   return (
     <span
-      className={cn(
-        "ml-auto text-xs tracking-widest text-muted-foreground",
-        className
-      )}
+      className={cn("ml-auto text-xs tracking-widest text-muted-foreground", className)}
       {...props}
     />
-  )
-}
-MenubarShortcut.displayname = "MenubarShortcut"
+  );
+};
+MenubarShortcut.displayname = "MenubarShortcut";
 
 export {
   Menubar,
-  MenubarMenu,
-  MenubarTrigger,
-  MenubarContent,
-  MenubarItem,
-  MenubarSeparator,
-  MenubarLabel,
   MenubarCheckboxItem,
+  MenubarContent,
+  MenubarGroup,
+  MenubarItem,
+  MenubarLabel,
+  MenubarMenu,
+  MenubarPortal,
   MenubarRadioGroup,
   MenubarRadioItem,
-  MenubarPortal,
+  MenubarSeparator,
+  MenubarShortcut,
+  MenubarSub,
   MenubarSubContent,
   MenubarSubTrigger,
-  MenubarGroup,
-  MenubarSub,
-  MenubarShortcut,
-}
+  MenubarTrigger,
+};
diff --git a/src/components/ui/popover.tsx b/src/components/ui/popover.tsx
index 0687c19..40c5493 100644
--- a/src/components/ui/popover.tsx
+++ b/src/components/ui/popover.tsx
@@ -1,31 +1,31 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as PopoverPrimitive from "@radix-ui/react-popover"
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const Popover = PopoverPrimitive.Root
+const Popover = PopoverPrimitive.Root;
 
-const PopoverTrigger = PopoverPrimitive.Trigger
+const PopoverTrigger = PopoverPrimitive.Trigger;
 
 const PopoverContent = React.forwardRef<
   React.ElementRef<typeof PopoverPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
+  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content> & { portal?: HTMLElement | null }
 >(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
-  <PopoverPrimitive.Portal>
+  <PopoverPrimitive.Portal container={props.portal}>
     <PopoverPrimitive.Content
       ref={ref}
       align={align}
       sideOffset={sideOffset}
       className={cn(
         "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        className
+        className,
       )}
       {...props}
     />
   </PopoverPrimitive.Portal>
-))
-PopoverContent.displayName = PopoverPrimitive.Content.displayName
+));
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
 
-export { Popover, PopoverTrigger, PopoverContent }
+export { Popover, PopoverContent, PopoverTrigger };
diff --git a/src/components/ui/progress.tsx b/src/components/ui/progress.tsx
index cdacbbd..efb979e 100644
--- a/src/components/ui/progress.tsx
+++ b/src/components/ui/progress.tsx
@@ -1,9 +1,9 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as ProgressPrimitive from "@radix-ui/react-progress"
+import * as ProgressPrimitive from "@radix-ui/react-progress";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
 const Progress = React.forwardRef<
   React.ElementRef<typeof ProgressPrimitive.Root>,
@@ -11,18 +11,15 @@ const Progress = React.forwardRef<
 >(({ className, value, ...props }, ref) => (
   <ProgressPrimitive.Root
     ref={ref}
-    className={cn(
-      "relative h-4 w-full overflow-hidden rounded-full bg-secondary",
-      className
-    )}
+    className={cn("relative h-4 w-full overflow-hidden rounded-full bg-secondary", className)}
     {...props}
   >
     <ProgressPrimitive.Indicator
-      className="h-full w-full flex-1 bg-primary transition-all"
+      className='h-full w-full flex-1 bg-primary transition-all'
       style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
     />
   </ProgressPrimitive.Root>
-))
-Progress.displayName = ProgressPrimitive.Root.displayName
+));
+Progress.displayName = ProgressPrimitive.Root.displayName;
 
-export { Progress }
+export { Progress };
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index bbaa4fd..54fd855 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -1,16 +1,16 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as SelectPrimitive from "@radix-ui/react-select"
-import { Check, ChevronDown, ChevronUp } from "lucide-react"
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { Check, ChevronDown, ChevronUp } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const Select = SelectPrimitive.Root
+const Select = SelectPrimitive.Root;
 
-const SelectGroup = SelectPrimitive.Group
+const SelectGroup = SelectPrimitive.Group;
 
-const SelectValue = SelectPrimitive.Value
+const SelectValue = SelectPrimitive.Value;
 
 const SelectTrigger = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Trigger>,
@@ -20,17 +20,17 @@ const SelectTrigger = React.forwardRef<
     ref={ref}
     className={cn(
       "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
-      className
+      className,
     )}
     {...props}
   >
     {children}
     <SelectPrimitive.Icon asChild>
-      <ChevronDown className="h-4 w-4 opacity-50" />
+      <ChevronDown className='h-4 w-4 opacity-50' />
     </SelectPrimitive.Icon>
   </SelectPrimitive.Trigger>
-))
-SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
+));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
 
 const SelectScrollUpButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
@@ -38,16 +38,13 @@ const SelectScrollUpButton = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.ScrollUpButton
     ref={ref}
-    className={cn(
-      "flex cursor-default items-center justify-center py-1",
-      className
-    )}
+    className={cn("flex cursor-default items-center justify-center py-1", className)}
     {...props}
   >
-    <ChevronUp className="h-4 w-4" />
+    <ChevronUp className='h-4 w-4' />
   </SelectPrimitive.ScrollUpButton>
-))
-SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
+));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
 
 const SelectScrollDownButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
@@ -55,17 +52,13 @@ const SelectScrollDownButton = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.ScrollDownButton
     ref={ref}
-    className={cn(
-      "flex cursor-default items-center justify-center py-1",
-      className
-    )}
+    className={cn("flex cursor-default items-center justify-center py-1", className)}
     {...props}
   >
-    <ChevronDown className="h-4 w-4" />
+    <ChevronDown className='h-4 w-4' />
   </SelectPrimitive.ScrollDownButton>
-))
-SelectScrollDownButton.displayName =
-  SelectPrimitive.ScrollDownButton.displayName
+));
+SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
 
 const SelectContent = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Content>,
@@ -78,7 +71,7 @@ const SelectContent = React.forwardRef<
         "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         position === "popper" &&
           "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-        className
+        className,
       )}
       position={position}
       {...props}
@@ -88,7 +81,7 @@ const SelectContent = React.forwardRef<
         className={cn(
           "p-1",
           position === "popper" &&
-            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",
         )}
       >
         {children}
@@ -96,8 +89,8 @@ const SelectContent = React.forwardRef<
       <SelectScrollDownButton />
     </SelectPrimitive.Content>
   </SelectPrimitive.Portal>
-))
-SelectContent.displayName = SelectPrimitive.Content.displayName
+));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
 
 const SelectLabel = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Label>,
@@ -108,8 +101,8 @@ const SelectLabel = React.forwardRef<
     className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
     {...props}
   />
-))
-SelectLabel.displayName = SelectPrimitive.Label.displayName
+));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
 
 const SelectItem = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Item>,
@@ -119,20 +112,20 @@ const SelectItem = React.forwardRef<
     ref={ref}
     className={cn(
       "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      className,
     )}
     {...props}
   >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span className='absolute left-2 flex h-3.5 w-3.5 items-center justify-center'>
       <SelectPrimitive.ItemIndicator>
-        <Check className="h-4 w-4" />
+        <Check className='h-4 w-4' />
       </SelectPrimitive.ItemIndicator>
     </span>
 
     <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
   </SelectPrimitive.Item>
-))
-SelectItem.displayName = SelectPrimitive.Item.displayName
+));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
 
 const SelectSeparator = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Separator>,
@@ -143,18 +136,18 @@ const SelectSeparator = React.forwardRef<
     className={cn("-mx-1 my-1 h-px bg-muted", className)}
     {...props}
   />
-))
-SelectSeparator.displayName = SelectPrimitive.Separator.displayName
+));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 export {
   Select,
-  SelectGroup,
-  SelectValue,
-  SelectTrigger,
   SelectContent,
-  SelectLabel,
+  SelectGroup,
   SelectItem,
-  SelectSeparator,
-  SelectScrollUpButton,
+  SelectLabel,
   SelectScrollDownButton,
-}
+  SelectScrollUpButton,
+  SelectSeparator,
+  SelectTrigger,
+  SelectValue,
+};
diff --git a/src/components/ui/separator.tsx b/src/components/ui/separator.tsx
index 76100ad..8e44508 100644
--- a/src/components/ui/separator.tsx
+++ b/src/components/ui/separator.tsx
@@ -1,31 +1,22 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as SeparatorPrimitive from "@radix-ui/react-separator"
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
 const Separator = React.forwardRef<
   React.ElementRef<typeof SeparatorPrimitive.Root>,
   React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
->(
-  (
-    { className, orientation = "horizontal", decorative = true, ...props },
-    ref
-  ) => (
-    <SeparatorPrimitive.Root
-      ref={ref}
-      decorative={decorative}
-      orientation={orientation}
-      className={cn(
-        "shrink-0 bg-border",
-        orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
-        className
-      )}
-      {...props}
-    />
-  )
-)
-Separator.displayName = SeparatorPrimitive.Root.displayName
+>(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => (
+  <SeparatorPrimitive.Root
+    ref={ref}
+    decorative={decorative}
+    orientation={orientation}
+    className={cn("shrink-0 bg-border", orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]", className)}
+    {...props}
+  />
+));
+Separator.displayName = SeparatorPrimitive.Root.displayName;
 
-export { Separator }
+export { Separator };
diff --git a/src/components/ui/sheet.tsx b/src/components/ui/sheet.tsx
index c52cd5a..db2a330 100644
--- a/src/components/ui/sheet.tsx
+++ b/src/components/ui/sheet.tsx
@@ -1,19 +1,19 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as SheetPrimitive from "@radix-ui/react-dialog"
-import { cva, type VariantProps } from "class-variance-authority"
-import { X } from "lucide-react"
+import * as SheetPrimitive from "@radix-ui/react-dialog";
+import { type VariantProps, cva } from "class-variance-authority";
+import { X } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const Sheet = SheetPrimitive.Root
+const Sheet = SheetPrimitive.Root;
 
-const SheetTrigger = SheetPrimitive.Trigger
+const SheetTrigger = SheetPrimitive.Trigger;
 
-const SheetClose = SheetPrimitive.Close
+const SheetClose = SheetPrimitive.Close;
 
-const SheetPortal = SheetPrimitive.Portal
+const SheetPortal = SheetPrimitive.Portal;
 
 const SheetOverlay = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Overlay>,
@@ -22,13 +22,13 @@ const SheetOverlay = React.forwardRef<
   <SheetPrimitive.Overlay
     className={cn(
       "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
+      className,
     )}
     {...props}
     ref={ref}
   />
-))
-SheetOverlay.displayName = SheetPrimitive.Overlay.displayName
+));
+SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
 
 const sheetVariants = cva(
   "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
@@ -46,8 +46,8 @@ const sheetVariants = cva(
     defaultVariants: {
       side: "right",
     },
-  }
-)
+  },
+);
 
 interface SheetContentProps
   extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
@@ -55,9 +55,9 @@ interface SheetContentProps
 
 const SheetContent = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Content>,
-  SheetContentProps
+  SheetContentProps & { portal?: HTMLElement | null }
 >(({ side = "right", className, children, ...props }, ref) => (
-  <SheetPortal>
+  <SheetPortal container={props.portal}>
     <SheetOverlay />
     <SheetPrimitive.Content
       ref={ref}
@@ -65,42 +65,30 @@ const SheetContent = React.forwardRef<
       {...props}
     >
       {children}
-      <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
-        <X className="h-4 w-4" />
-        <span className="sr-only">Close</span>
+      <SheetPrimitive.Close className='absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary'>
+        <X className='h-4 w-4' />
+        <span className='sr-only'>Close</span>
       </SheetPrimitive.Close>
     </SheetPrimitive.Content>
   </SheetPortal>
-))
-SheetContent.displayName = SheetPrimitive.Content.displayName
+));
+SheetContent.displayName = SheetPrimitive.Content.displayName;
 
-const SheetHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
-      className
-    )}
+    className={cn("flex flex-col space-y-2 text-center sm:text-left", className)}
     {...props}
   />
-)
-SheetHeader.displayName = "SheetHeader"
+);
+SheetHeader.displayName = "SheetHeader";
 
-const SheetFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
-    )}
+    className={cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className)}
     {...props}
   />
-)
-SheetFooter.displayName = "SheetFooter"
+);
+SheetFooter.displayName = "SheetFooter";
 
 const SheetTitle = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Title>,
@@ -111,8 +99,8 @@ const SheetTitle = React.forwardRef<
     className={cn("text-lg font-semibold text-foreground", className)}
     {...props}
   />
-))
-SheetTitle.displayName = SheetPrimitive.Title.displayName
+));
+SheetTitle.displayName = SheetPrimitive.Title.displayName;
 
 const SheetDescription = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Description>,
@@ -123,18 +111,18 @@ const SheetDescription = React.forwardRef<
     className={cn("text-sm text-muted-foreground", className)}
     {...props}
   />
-))
-SheetDescription.displayName = SheetPrimitive.Description.displayName
+));
+SheetDescription.displayName = SheetPrimitive.Description.displayName;
 
 export {
   Sheet,
-  SheetPortal,
-  SheetOverlay,
-  SheetTrigger,
   SheetClose,
   SheetContent,
-  SheetHeader,
-  SheetFooter,
-  SheetTitle,
   SheetDescription,
-}
+  SheetFooter,
+  SheetHeader,
+  SheetOverlay,
+  SheetPortal,
+  SheetTitle,
+  SheetTrigger,
+};
diff --git a/src/components/ui/skeleton.tsx b/src/components/ui/skeleton.tsx
index 0396410..d54779e 100644
--- a/src/components/ui/skeleton.tsx
+++ b/src/components/ui/skeleton.tsx
@@ -1,15 +1,12 @@
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-function Skeleton({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) {
+function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {
   return (
     <div
       className={cn("animate-pulse rounded-md bg-muted", className)}
       {...props}
     />
-  )
+  );
 }
 
-export { Skeleton }
+export { Skeleton };
diff --git a/src/components/ui/slider.tsx b/src/components/ui/slider.tsx
index adddd98..690a0d4 100644
--- a/src/components/ui/slider.tsx
+++ b/src/components/ui/slider.tsx
@@ -1,9 +1,9 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as SliderPrimitive from "@radix-ui/react-slider"
+import * as SliderPrimitive from "@radix-ui/react-slider";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
 const Slider = React.forwardRef<
   React.ElementRef<typeof SliderPrimitive.Root>,
@@ -11,18 +11,15 @@ const Slider = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SliderPrimitive.Root
     ref={ref}
-    className={cn(
-      "relative flex w-full touch-none select-none items-center",
-      className
-    )}
+    className={cn("relative flex w-full touch-none select-none items-center", className)}
     {...props}
   >
-    <SliderPrimitive.Track className="relative h-2 w-full grow overflow-hidden rounded-full bg-secondary">
-      <SliderPrimitive.Range className="absolute h-full bg-primary" />
+    <SliderPrimitive.Track className='relative h-2 w-full grow overflow-hidden rounded-full bg-secondary'>
+      <SliderPrimitive.Range className='absolute h-full bg-primary' />
     </SliderPrimitive.Track>
-    <SliderPrimitive.Thumb className="block h-5 w-5 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" />
+    <SliderPrimitive.Thumb className='block h-5 w-5 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50' />
   </SliderPrimitive.Root>
-))
-Slider.displayName = SliderPrimitive.Root.displayName
+));
+Slider.displayName = SliderPrimitive.Root.displayName;
 
-export { Slider }
+export { Slider };
diff --git a/src/components/ui/table.tsx b/src/components/ui/table.tsx
index f817a92..4e26516 100644
--- a/src/components/ui/table.tsx
+++ b/src/components/ui/table.tsx
@@ -1,117 +1,98 @@
-import * as React from "react"
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const Table = React.forwardRef<
-  HTMLTableElement,
-  React.HTMLAttributes<HTMLTableElement>
->(({ className, ...props }, ref) => (
-  <div className="relative w-full overflow-auto">
-    <table
+const Table = React.forwardRef<HTMLTableElement, React.HTMLAttributes<HTMLTableElement>>(
+  ({ className, ...props }, ref) => (
+    <div className='relative w-full overflow-auto'>
+      <table
+        ref={ref}
+        className={cn("w-full caption-bottom text-sm", className)}
+        {...props}
+      />
+    </div>
+  ),
+);
+Table.displayName = "Table";
+
+const TableHeader = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(
+  ({ className, ...props }, ref) => (
+    <thead
       ref={ref}
-      className={cn("w-full caption-bottom text-sm", className)}
+      className={cn("[&_tr]:border-b", className)}
       {...props}
     />
-  </div>
-))
-Table.displayName = "Table"
+  ),
+);
+TableHeader.displayName = "TableHeader";
 
-const TableHeader = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
-))
-TableHeader.displayName = "TableHeader"
+const TableBody = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(
+  ({ className, ...props }, ref) => (
+    <tbody
+      ref={ref}
+      className={cn("[&_tr:last-child]:border-0", className)}
+      {...props}
+    />
+  ),
+);
+TableBody.displayName = "TableBody";
 
-const TableBody = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tbody
-    ref={ref}
-    className={cn("[&_tr:last-child]:border-0", className)}
-    {...props}
-  />
-))
-TableBody.displayName = "TableBody"
+const TableFooter = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(
+  ({ className, ...props }, ref) => (
+    <tfoot
+      ref={ref}
+      className={cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className)}
+      {...props}
+    />
+  ),
+);
+TableFooter.displayName = "TableFooter";
 
-const TableFooter = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tfoot
-    ref={ref}
-    className={cn(
-      "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
-      className
-    )}
-    {...props}
-  />
-))
-TableFooter.displayName = "TableFooter"
+const TableRow = React.forwardRef<HTMLTableRowElement, React.HTMLAttributes<HTMLTableRowElement>>(
+  ({ className, ...props }, ref) => (
+    <tr
+      ref={ref}
+      className={cn("border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted", className)}
+      {...props}
+    />
+  ),
+);
+TableRow.displayName = "TableRow";
 
-const TableRow = React.forwardRef<
-  HTMLTableRowElement,
-  React.HTMLAttributes<HTMLTableRowElement>
->(({ className, ...props }, ref) => (
-  <tr
-    ref={ref}
-    className={cn(
-      "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
-      className
-    )}
-    {...props}
-  />
-))
-TableRow.displayName = "TableRow"
+const TableHead = React.forwardRef<HTMLTableCellElement, React.ThHTMLAttributes<HTMLTableCellElement>>(
+  ({ className, ...props }, ref) => (
+    <th
+      ref={ref}
+      className={cn(
+        "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
+        className,
+      )}
+      {...props}
+    />
+  ),
+);
+TableHead.displayName = "TableHead";
 
-const TableHead = React.forwardRef<
-  HTMLTableCellElement,
-  React.ThHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <th
-    ref={ref}
-    className={cn(
-      "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
-      className
-    )}
-    {...props}
-  />
-))
-TableHead.displayName = "TableHead"
+const TableCell = React.forwardRef<HTMLTableCellElement, React.TdHTMLAttributes<HTMLTableCellElement>>(
+  ({ className, ...props }, ref) => (
+    <td
+      ref={ref}
+      className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
+      {...props}
+    />
+  ),
+);
+TableCell.displayName = "TableCell";
 
-const TableCell = React.forwardRef<
-  HTMLTableCellElement,
-  React.TdHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <td
-    ref={ref}
-    className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
-    {...props}
-  />
-))
-TableCell.displayName = "TableCell"
+const TableCaption = React.forwardRef<HTMLTableCaptionElement, React.HTMLAttributes<HTMLTableCaptionElement>>(
+  ({ className, ...props }, ref) => (
+    <caption
+      ref={ref}
+      className={cn("mt-4 text-sm text-muted-foreground", className)}
+      {...props}
+    />
+  ),
+);
+TableCaption.displayName = "TableCaption";
 
-const TableCaption = React.forwardRef<
-  HTMLTableCaptionElement,
-  React.HTMLAttributes<HTMLTableCaptionElement>
->(({ className, ...props }, ref) => (
-  <caption
-    ref={ref}
-    className={cn("mt-4 text-sm text-muted-foreground", className)}
-    {...props}
-  />
-))
-TableCaption.displayName = "TableCaption"
-
-export {
-  Table,
-  TableHeader,
-  TableBody,
-  TableFooter,
-  TableHead,
-  TableRow,
-  TableCell,
-  TableCaption,
-}
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };
diff --git a/src/components/ui/tabs.tsx b/src/components/ui/tabs.tsx
index 7a3d9dc..5c5d0c4 100644
--- a/src/components/ui/tabs.tsx
+++ b/src/components/ui/tabs.tsx
@@ -1,11 +1,11 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as TabsPrimitive from "@radix-ui/react-tabs"
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const Tabs = TabsPrimitive.Root
+const Tabs = TabsPrimitive.Root;
 
 const TabsList = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.List>,
@@ -15,12 +15,12 @@ const TabsList = React.forwardRef<
     ref={ref}
     className={cn(
       "inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground",
-      className
+      className,
     )}
     {...props}
   />
-))
-TabsList.displayName = TabsPrimitive.List.displayName
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
 
 const TabsTrigger = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.Trigger>,
@@ -30,12 +30,12 @@ const TabsTrigger = React.forwardRef<
     ref={ref}
     className={cn(
       "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
-      className
+      className,
     )}
     {...props}
   />
-))
-TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
 
 const TabsContent = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.Content>,
@@ -45,11 +45,11 @@ const TabsContent = React.forwardRef<
     ref={ref}
     className={cn(
       "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-      className
+      className,
     )}
     {...props}
   />
-))
-TabsContent.displayName = TabsPrimitive.Content.displayName
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
 
-export { Tabs, TabsList, TabsTrigger, TabsContent }
+export { Tabs, TabsContent, TabsList, TabsTrigger };
diff --git a/src/components/ui/textarea.tsx b/src/components/ui/textarea.tsx
index 5fbebb8..e795997 100644
--- a/src/components/ui/textarea.tsx
+++ b/src/components/ui/textarea.tsx
@@ -1,24 +1,21 @@
-import * as React from "react"
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-export interface TextareaProps
-  extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
+export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
 
-const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
-  ({ className, ...props }, ref) => {
-    return (
-      <textarea
-        className={cn(
-          "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-          className
-        )}
-        ref={ref}
-        {...props}
-      />
-    )
-  }
-)
-Textarea.displayName = "Textarea"
+const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(({ className, ...props }, ref) => {
+  return (
+    <textarea
+      className={cn(
+        "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+        className,
+      )}
+      ref={ref}
+      {...props}
+    />
+  );
+});
+Textarea.displayName = "Textarea";
 
-export { Textarea }
+export { Textarea };
diff --git a/src/components/ui/toast.tsx b/src/components/ui/toast.tsx
index 4fd7688..7ef3d43 100644
--- a/src/components/ui/toast.tsx
+++ b/src/components/ui/toast.tsx
@@ -1,13 +1,13 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as ToastPrimitives from "@radix-ui/react-toast"
-import { cva, type VariantProps } from "class-variance-authority"
-import { X } from "lucide-react"
+import * as ToastPrimitives from "@radix-ui/react-toast";
+import { type VariantProps, cva } from "class-variance-authority";
+import { X } from "lucide-react";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const ToastProvider = ToastPrimitives.Provider
+const ToastProvider = ToastPrimitives.Provider;
 
 const ToastViewport = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Viewport>,
@@ -17,12 +17,12 @@ const ToastViewport = React.forwardRef<
     ref={ref}
     className={cn(
       "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
-      className
+      className,
     )}
     {...props}
   />
-))
-ToastViewport.displayName = ToastPrimitives.Viewport.displayName
+));
+ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
 
 const toastVariants = cva(
   "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
@@ -30,20 +30,18 @@ const toastVariants = cva(
     variants: {
       variant: {
         default: "border bg-background text-foreground",
-        destructive:
-          "destructive group border-destructive bg-destructive text-destructive-foreground",
+        destructive: "destructive group border-destructive bg-destructive text-destructive-foreground",
       },
     },
     defaultVariants: {
       variant: "default",
     },
-  }
-)
+  },
+);
 
 const Toast = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Root>,
-  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
-    VariantProps<typeof toastVariants>
+  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> & VariantProps<typeof toastVariants>
 >(({ className, variant, ...props }, ref) => {
   return (
     <ToastPrimitives.Root
@@ -51,9 +49,9 @@ const Toast = React.forwardRef<
       className={cn(toastVariants({ variant }), className)}
       {...props}
     />
-  )
-})
-Toast.displayName = ToastPrimitives.Root.displayName
+  );
+});
+Toast.displayName = ToastPrimitives.Root.displayName;
 
 const ToastAction = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Action>,
@@ -63,12 +61,12 @@ const ToastAction = React.forwardRef<
     ref={ref}
     className={cn(
       "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
-      className
+      className,
     )}
     {...props}
   />
-))
-ToastAction.displayName = ToastPrimitives.Action.displayName
+));
+ToastAction.displayName = ToastPrimitives.Action.displayName;
 
 const ToastClose = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Close>,
@@ -78,15 +76,15 @@ const ToastClose = React.forwardRef<
     ref={ref}
     className={cn(
       "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
-      className
+      className,
     )}
-    toast-close=""
+    toast-close=''
     {...props}
   >
-    <X className="h-4 w-4" />
+    <X className='h-4 w-4' />
   </ToastPrimitives.Close>
-))
-ToastClose.displayName = ToastPrimitives.Close.displayName
+));
+ToastClose.displayName = ToastPrimitives.Close.displayName;
 
 const ToastTitle = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Title>,
@@ -97,8 +95,8 @@ const ToastTitle = React.forwardRef<
     className={cn("text-sm font-semibold", className)}
     {...props}
   />
-))
-ToastTitle.displayName = ToastPrimitives.Title.displayName
+));
+ToastTitle.displayName = ToastPrimitives.Title.displayName;
 
 const ToastDescription = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Description>,
@@ -109,21 +107,21 @@ const ToastDescription = React.forwardRef<
     className={cn("text-sm opacity-90", className)}
     {...props}
   />
-))
-ToastDescription.displayName = ToastPrimitives.Description.displayName
+));
+ToastDescription.displayName = ToastPrimitives.Description.displayName;
 
-type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>
+type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
 
-type ToastActionElement = React.ReactElement<typeof ToastAction>
+type ToastActionElement = React.ReactElement<typeof ToastAction>;
 
 export {
-  type ToastProps,
-  type ToastActionElement,
-  ToastProvider,
-  ToastViewport,
   Toast,
-  ToastTitle,
-  ToastDescription,
-  ToastClose,
   ToastAction,
-}
+  ToastClose,
+  ToastDescription,
+  ToastProvider,
+  ToastTitle,
+  ToastViewport,
+  type ToastActionElement,
+  type ToastProps,
+};
diff --git a/src/components/ui/tooltip.tsx b/src/components/ui/tooltip.tsx
index e0dd4e8..3d2f8a4 100644
--- a/src/components/ui/tooltip.tsx
+++ b/src/components/ui/tooltip.tsx
@@ -1,15 +1,15 @@
-"use client"
+"use client";
 
-import * as React from "react"
-import * as TooltipPrimitive from "@radix-ui/react-tooltip"
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import * as React from "react";
 
-import { cn } from "~/utils"
+import { cn } from "~/utils/cn";
 
-const TooltipProvider = TooltipPrimitive.Provider
+const TooltipProvider = TooltipPrimitive.Provider;
 
-const Tooltip = TooltipPrimitive.Root
+const Tooltip = TooltipPrimitive.Root;
 
-const TooltipTrigger = TooltipPrimitive.Trigger
+const TooltipTrigger = TooltipPrimitive.Trigger;
 
 const TooltipContent = React.forwardRef<
   React.ElementRef<typeof TooltipPrimitive.Content>,
@@ -20,11 +20,11 @@ const TooltipContent = React.forwardRef<
     sideOffset={sideOffset}
     className={cn(
       "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
+      className,
     )}
     {...props}
   />
-))
-TooltipContent.displayName = TooltipPrimitive.Content.displayName
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
diff --git a/src/config/gIndex.config.ts b/src/config/gIndex.config.ts
index d86f18c..638d7fc 100644
--- a/src/config/gIndex.config.ts
+++ b/src/config/gIndex.config.ts
@@ -1,7 +1,8 @@
 import { z } from "zod";
-import { Schema_Config } from "~/schema";
 
-import isDev from "~/utils/isDev";
+import { isDev } from "~/utils/isDev";
+
+import { Schema_Config } from "~/types/schema";
 
 const config: z.input<typeof Schema_Config> = {
   /**
@@ -19,9 +20,7 @@ const config: z.input<typeof Schema_Config> = {
    */
   basePath: isDev
     ? "http://localhost:3000"
-    : `https://${
-        process.env.NEXT_PUBLIC_DOMAIN || process.env.NEXT_PUBLIC_VERCEL_URL
-      }`,
+    : `https://${process.env.NEXT_PUBLIC_DOMAIN || process.env.NEXT_PUBLIC_VERCEL_URL}`,
 
   /**
    * Allow access to the deploy guide
@@ -52,8 +51,7 @@ const config: z.input<typeof Schema_Config> = {
      * You need to create a new folder and share it with the service account
      * Then, copy the folder id and paste it here
      */
-    rootFolder:
-      "b76c7c22083307a3aa99c28ab7cc69851d682f5a250d995679d4be5276cab16ab6c37f4d5b7ad1a9b93fb9bf768e752c",
+    rootFolder: "b76c7c22083307a3aa99c28ab7cc69851d682f5a250d995679d4be5276cab16ab6c37f4d5b7ad1a9b93fb9bf768e752c",
 
     /**
      * If your rootfolder inside a shared drive, you NEED to set this to true
@@ -69,13 +67,9 @@ const config: z.input<typeof Schema_Config> = {
      * Then you need to encrypt it using `/api/internal/encrypt?q=:shared_drive_id` route
      */
     isTeamDrive: true,
-    sharedDrive:
-      "77bfa156c9c9d159112fcb0494ed8545bdaf7a3d567cd760ba2e2e2cd33fcbfc",
+    sharedDrive: "77bfa156c9c9d159112fcb0494ed8545bdaf7a3d567cd760ba2e2e2cd33fcbfc",
 
-    defaultQuery: [
-      "trashed = false",
-      "(not mimeType contains 'google-apps' or mimeType contains 'folder')",
-    ],
+    defaultQuery: ["trashed = false", "(not mimeType contains 'google-apps' or mimeType contains 'folder')"],
     defaultField:
       "id, name, mimeType, thumbnailLink, fileExtension, modifiedTime, size, imageMediaMetadata, videoMediaMetadata, webContentLink, trashed",
     defaultOrder: "folder, name asc, modifiedTime desc",
@@ -134,14 +128,7 @@ const config: z.input<typeof Schema_Config> = {
      *
      * You can add more extensions if you want
      */
-    hiddenFiles: [
-      ".password",
-      ".readme.md",
-      ".banner",
-      ".banner.jpg",
-      ".banner.png",
-      ".banner.webp",
-    ],
+    hiddenFiles: [".password", ".readme.md", ".banner", ".banner.jpg", ".banner.png", ".banner.webp"],
 
     /**
      * Allow user to download protected file without password.
@@ -229,10 +216,7 @@ const config: z.input<typeof Schema_Config> = {
      * - {{ handle }} will be replaced with the twitter handle from twitterHandle config above
      * - {{ creator }} will be replaced with mbaharip if you want to credit me
      */
-    footer: [
-      "{{ siteName }} *v{{ version }}* @ {{ repository }}",
-      "{{ year }} - Made with ❤️ by **{{ author }}**",
-    ],
+    footer: ["{{ siteName }} *v{{ version }}* @ {{ repository }}", "{{ year }} - Made with ❤️ by **{{ author }}**"],
 
     /**
      * Site wide password protection
diff --git a/src/data/docs/getting-started.ts b/src/data/docs/getting-started.ts
new file mode 100644
index 0000000..a45a661
--- /dev/null
+++ b/src/data/docs/getting-started.ts
@@ -0,0 +1,9 @@
+export const getting_started = `Welcome to the deployment guide! This guide will help you to deploy the application to Vercel or similar services.
+
+If you are new to this project, you can follow along from the beginning.
+But if you've already deployed the app before and want to upgrade from v1, you can skip to the [Migrating from v1](#migrating) section.  
+You can also use this guide to [configure the app](#config) and [customize the theme](#theme).
+
+_**Note:** This guide assumes you have a basic understanding of how to deploy a Next.js app on Vercel or other platforms._
+
+#### We recommend you to use this deployment guide on a desktop browser.`;
diff --git a/src/data/docs/index.ts b/src/data/docs/index.ts
new file mode 100644
index 0000000..5f2f1fd
--- /dev/null
+++ b/src/data/docs/index.ts
@@ -0,0 +1,4 @@
+export { getting_started } from "./getting-started";
+export { migration } from "./migration";
+export { new_user } from "./new-user";
+export { shared_drive } from "./shared-drive";
diff --git a/src/data/docs/migration.ts b/src/data/docs/migration.ts
new file mode 100644
index 0000000..5163c40
--- /dev/null
+++ b/src/data/docs/migration.ts
@@ -0,0 +1,22 @@
+export const migration = `If you've already deployed the app before and want to upgrade from v1, you can follow this guide to migrate the app to the latest version.
+
+### Update your environment and configuration
+
+If you still have the \`.env.local file\`, you can go to the [configuration](#config) section, and load the file to update the environment variables.
+If you don't have it, go to your deployment platform and copy the environment variables from the platform to the [configuration](#config) section.
+
+You can also load the old \`gindex.config.ts\` file to the [configuration](#config) section to set the default configuration.
+
+### Update the repository
+
+First, you need to update the repository to the latest version.
+If you open your forked repository, you will see a notification that the repository is behind the original repository.
+You can sync the repository by clicking the \`Sync fork\` button.
+After the repository is updated, you can replace the \`gindex.config.ts\` file with the new one.
+
+### Update deployment
+
+Now go to your Vercel project page (or other platforms).
+Go to the \`Settings\` tab, and click the \`Environment Variables\` menu.
+You can delete all the old environment variables, and copy the new environment variables from the updated \`.env.local\` file.
+Now you can redeploy the app to apply the changes.`;
diff --git a/src/data/docs/new-user.ts b/src/data/docs/new-user.ts
new file mode 100644
index 0000000..a01d61e
--- /dev/null
+++ b/src/data/docs/new-user.ts
@@ -0,0 +1,81 @@
+export const new_user = `Prerequisites:
+
+- A basic understanding of Vercel (or similar services)
+- Google Cloud Platform account
+
+### Fork or Clone the repository
+
+It's pretty obvious, but you need to fork the repository to your account.
+You can [click here](https://github.com/mbahArip/next-gdrive-index/fork) to fork the repository.  
+You can choose any repository name, description, and visibility.
+
+But if you want to run it locally, you can clone the repository instead.
+
+### Create a Google Cloud Platform project and enable Google Drive API
+
+We need an access to Google Drive API to get the files from Google Drive.
+So you need to create a project in Google Cloud Platform and enable Google Drive API to get your own credentials.
+
+1. Go to [Google Cloud Platform](https://console.cloud.google.com/)
+2. Click the \`New Project\` button
+3. Enter a project name, and click the \`Create\` button
+4. After the project is created, click the \`Enable APIs and Services\` button
+5. Search for Google Drive API, and click the \`Enable\` button
+
+### Create a Service Account and get the credentials
+
+After enabling the Google Drive API, we need to create a service account to get the credentials.
+The credentials will be used to authenticate the application to access the Google Drive API and get the files.
+
+1. On [APIs & Services](https://console.cloud.google.com/apis/dashboard) page, click the \`Credentials\` menu on the sidebar
+2. Click the \`Create Credentials\` button, and choose \`Service account\`
+3. Enter your service account name and description, and then click the \`Done\` button
+4. You will see the service account you just created on \`Service Account\` table, click the name of the service account to open the details
+5. Go to \`Keys\` tab, then click the \`Add Key\` button and choose the \`Create new key\`
+6. Pick \`JSON\` as the key type and click the \`Create\` button
+7. The JSON file will be downloaded to your computer, and **keep it safe**. We will use it later on the configuration
+
+_**Note:** The JSON file contains sensitive information, don't share it with anyone_
+
+### Create shared folder in Google Drive
+
+Since the service account can't access your Root folder, you need to create a new folder, and share it with the service account.
+This folder will be used as the root folder for the application.
+
+> If you're using or the folder you want to share inside Shared Drive, you can skip this step and go to the [Shared Drive Guide](#shared-drive)
+
+1. Go to [Google Drive](https://drive.google.com/)
+2. Click the \`New\` button, and choose \`Folder\` to create a new folder, you can name it anything you want
+3. Right-click the folder you just created, and choose \`Share\`
+4. Enter the email address of the service account you just created (you can find it on the JSON file, or on the service account details page)
+5. To allow download files larger than deployment limit, you need to enable \`Link sharing\` and set it to \`Anyone with the link\`
+6. Copy the folder ID from the URL, it's the part after \`/folders/\` in the URL (e.g: https://drive.google.com/drive/u/0/folders/ \`<folder_id>\` )
+
+### Configuring the app and Customizing the theme
+
+Now we need to configure the app to use the credentials and folder ID we just created.
+You can follow the [App Configuration](#config) and [Customize Theme](#theme) sections to configure the app and customize the theme.
+
+_**Note:** You can skip the theme customization, but you **NEED** to configure the app_
+
+### Deploy the app
+
+On this guide we will use Vercel to deploy the app, but you can use other platforms like Netlify, Heroku, etc.
+But don't forget to adjust the \`fileSizeLimit\` on the [configuration](#config) if you use other platforms.
+
+> Before deploying, make sure you have pushed the changes to your repository
+
+1. Go to [Vercel](https://vercel.com/)
+2. Click on the \`Add new\` button, and choose \`Project\`
+3. Choose the repository you just forked
+4. On the \`Environment Variables\` section, copy the whole content from \`.env.local\` you just downloaded from [configuration](#config) section, and paste it on the key fields. It will automatically add all the environment variables needed
+5. Click the \`Deploy\` button
+6. Wait for the deployment to finish, and open project
+7. Go to \`Settings\` tab, and click the \`Functions\` menu, and select your \`Function Region\` to the nearest region to your location for optimal speed
+8. Go to \`Deployment\` tab, click the 3 dots on the right side of the latest \`Production\` deployment, and click the \`Redeploy\` button to apply the changes
+
+For other platforms, you can check their own documentation for Next.js deployment guide.
+
+### Done! 🎉
+
+Congratulations! You have successfully deployed the app.`;
diff --git a/src/data/docs/shared-drive.ts b/src/data/docs/shared-drive.ts
new file mode 100644
index 0000000..7458d82
--- /dev/null
+++ b/src/data/docs/shared-drive.ts
@@ -0,0 +1,16 @@
+export const shared_drive = `I'm separating this guide in case someone who already using v1 can see this guide easily.
+
+As of version 2.0.2 we added support for Shared Drive, and the demo actually using a Shared Drive.
+You can follow this guide to use Shared Drive as the root folder for the application.
+
+1. Go to [Google Drive](https://drive.google.com/)
+2. Open the \`Shared Drives\` menu from the sidebar
+3. Right click on the Shared Drive you want to use, and choose \`Manage members\`
+4. Add your service account email address to the members list, and give it at least \`Viewer\` permission
+5. Open the \`Shared Drive\`, and copy the ID from the URL, it's the part after \`/drive/u/0/folders/\` in the URL (e.g: https://drive.google.com/drive/u/0/folders/ \`<drive_id>\` )
+6. Paste the ID to \`Shared Drive\` field on the [configuration](#config) section, and set the \`is Team Drive\` to \`true\`
+7. For the root folder, you can set it to the folder ID inside the Shared Drive, or use the Shared Drive ID as the root folder ID
+8. Update the configuration file, and redeploy the app to apply the changes
+9. Done! 🎉
+
+If you don't want to use the configuration section below, you can encrypt your \`Shared Drive\` ID using the \`/api/internal/encrypt?q=<drive_id>\` endpoint, and update the config file directly.`;
diff --git a/src/data/template/configuration.ts b/src/data/template/configuration.ts
new file mode 100644
index 0000000..5253e19
--- /dev/null
+++ b/src/data/template/configuration.ts
@@ -0,0 +1,339 @@
+import { z } from "zod";
+import pkg from "~/../package.json";
+
+import { encryptData } from "~/utils/encryptionHelper";
+
+import { Schema_App_Configuration } from "~/types/schema";
+
+const config_template = `import { z } from "zod";
+import { isDev } from "~/utils/isDev";
+import { Schema_Config } from "~/types/schema";
+
+const config: z.input<typeof Schema_Config> = {
+  /**
+   * If possible, please don't change this value
+   * Even if you're creating a PR, just let me change it myself
+   */
+  version: {{version}},
+
+  /**
+   * Base path of the app, used for generating links
+   *
+   * If you're using another port for development, you can set it here
+   *
+   * @default process.env.NEXT_PUBLIC_DOMAIN
+   * @fallback process.env.NEXT_PUBLIC_VERCEL_URL
+   */
+  basePath: isDev
+    ? "http://localhost:3000"
+    : \`https://\${process.env.NEXT_PUBLIC_DOMAIN || process.env.NEXT_PUBLIC_VERCEL_URL}\`,
+
+  /**
+   * Allow access to the deploy guide
+   * Will use the \`/deploy\` route, might be overlap with file / folder name
+   *
+   * Set this to false on final deployment
+   *
+   * I'm using this to show the deploy guide on my own demo deployment
+   *
+   * @default false
+   */
+  showDeployGuide: false,
+
+  /**
+   * How long the cache will be stored in the browser
+   * Used for all pages and api routes
+   *
+   * @default "max-age=0, s-maxage=60, stale-while-revalidate"
+   */
+  cacheControl: "max-age=0, s-maxage=60, stale-while-revalidate",
+
+  apiConfig: {
+    /**
+     * Starting point of the drive.
+     * Will be used for '/' route.
+     *
+     * Since service account can't access 'root' folder
+     * You need to create a new folder and share it with the service account
+     * Then, copy the folder id and paste it here
+     */
+    rootFolder: {{apiConfig.rootFolder}},
+
+    /**
+     * If your rootfolder inside a shared drive, you NEED to set this to true
+     * If not, you can set this to false
+     *
+     * You also need to set the shared drive ID to make it work
+     * Make sure you have add your service account to the shared drive since the service account can't access the shared drive by default
+     *
+     * Where to get the shared drive id?
+     * Go to your Shared Drive > Click on the shared drive > copy the ID from the url
+     * ex: https://drive.google.com/drive/u/0/folders/:shared_drive_id
+     *
+     * Then you need to encrypt it using \`/api/internal/encrypt?q=:shared_drive_id\` route
+     */
+    isTeamDrive: {{apiConfig.isTeamDrive}},
+    sharedDrive: {{apiConfig.sharedDrive}},
+
+    defaultQuery: [
+      "trashed = false",
+      "(not mimeType contains 'google-apps' or mimeType contains 'folder')",
+    ],
+    defaultField:
+      "id, name, mimeType, thumbnailLink, fileExtension, modifiedTime, size, imageMediaMetadata, videoMediaMetadata, webContentLink, trashed",
+    defaultOrder: "folder, name asc, modifiedTime desc",
+
+    /**
+     * Set how many items to display per page in the file list
+     * It's recommended to set this to a reasonable number
+     * Since it will affect the load time
+     * 
+     * @default: 50 items per page | 5 search result
+    */
+    itemsPerPage: {{apiConfig.itemsPerPage}},
+    searchResult: {{apiConfig.searchResult}},
+
+    /**
+     * By default, the app will use the thumbnail URL from Google Drive
+     *
+     * Sometimes, the thumbnail can't be accessed because of CORS policy
+     * If you're having this issue, you can set this to true
+     *
+     * This will make the api fetch the thumbnail and serve it from the server
+     * instead of using the Google Drive thumbnail
+     *
+     * This will increase the server load, so use it wisely
+     *
+     * @default: true
+     */
+    proxyThumbnail: {{apiConfig.proxyThumbnail}},
+
+    /**
+     * Special file name that will be used for certain purposes
+     * These files will be ignored when searching for files
+     * and will be hidden from the files list by default
+     * 
+     * Banner will be used for opengraph image for folder
+     * By default, all folder will use default og image
+     */
+    specialFile: {
+      password: ".password",
+      readme: ".readme.md",
+      banner: ".banner",
+    },
+
+    /**
+     * Reason why banner has multiple extensions:
+     * - If I use contains query, it will also match the file or folder that contains the word.
+     *   (e.g: File / folder with the name of "Test Password" will be matched)
+     * - If I use = query, it will only match the exact name, hence the multiple extensions
+     *
+     * You can add more extensions if you want
+     */
+    hiddenFiles: [
+      ".password",
+      ".readme.md",
+      ".banner",
+      ".banner.jpg",
+      ".banner.png",
+      ".banner.webp",
+    ],
+
+    /**
+     * Allow user to download protected file without password.
+     * If this set to false, download link will have temporary token attached to it
+     * If this set to true, user can download the file without password as long as they have the link
+     *
+     * @default: false
+     */
+    allowDownloadProtectedFile: {{apiConfig.allowDownloadProtectedFile}},
+
+    /**
+     * Duration in hours.
+     * In version 2, this will be used for download link expiration.
+     * If you need it under 1 hour, you can use math expression. (e.g: (5 / 60) * 1 = 5 minutes)
+     *
+     * This only affect when the user download the file
+     * For example if you set it for example 30 minutes (0.5)
+     * After 30 minutes, and the user still downloading the file, the download will NOT be interrupted
+     * But if the user refresh the page / trying to download again, the download link will be expired
+     *
+     * @default: 6 hours
+     */
+    temporaryTokenDuration: {{apiConfig.temporaryTokenDuration}},
+
+    /**
+     * Maximum file size that can be downloaded via api routes
+     * If it's larger than this, it will be redirected to the file url
+     *
+     * If you're using Vercel, they have a limit of ~4 - ~4.5MB response size
+     * ref: https://vercel.com/docs/platform/limits#serverless-function-payload-size-limit
+     * If you're using another platform, you can match the limit with your platform
+     * Or you can set this to 0 to disable the limit
+     *
+     * @default: 4MB
+     */
+    maxFileSize: {{apiConfig.maxFileSize}},
+
+    /**
+     * Only show preview for files that are smaller than this size
+     * If the file is larger than this size, it will show "can't preview" message instead
+     *
+     * Why?
+     * Since the stream endpoint are counted as a bandwidth usage
+     * I want to limit the preview to only small files
+     * It also to prevent abuse from the user
+     *
+     * You can also set this to 0 to disable the limit
+     *
+     * @default: 100MB
+     */
+    streamMaxSize: {{apiConfig.streamMaxSize}},
+  },
+
+  siteConfig: {
+    /**
+     * Site Name will be used for default metadata title
+     * Site Name Template will be used if the page has a title
+     * %s will be replaced with the page title
+     * %t will be replaced with the site name
+     *
+     * You can set it to undefined if you don't want to use it
+     */
+    siteName: {{siteConfig.siteName}},
+    siteNameTemplate: {{siteConfig.siteNameTemplate}},
+    siteDescription: {{siteConfig.siteDescription}},
+
+    /**
+     * Site Icon will be used on navbar
+     * Favicon will be used as website icon
+    */
+    siteIcon: "/logo.svg",
+    favIcon: "/favicon.png",
+
+    /**
+     * Both are used on metadata
+     * Affects the value of footer
+    */
+    siteAuthor: {{siteConfig.siteAuthor}},
+    twitterHandle: {{siteConfig.twitterHandle}},
+
+    /**
+     * Next.js Metadata robots object
+     *
+     * ref: https://nextjs.org/docs/app/api-reference/functions/generate-metadata#robots
+     */
+    robots: "noindex, nofollow",
+
+    /**
+     * Show file extension on the file name
+     * Example:
+     *    true       |   false
+     *    file.txt   |   file
+     *    100KB      |   txt / 100KB
+     *
+     * @default: false
+     */
+    showFileExtension: {{siteConfig.showFileExtension}},
+
+    /**
+     * Footer content
+     * You can also set it to empty array if you don't want to use it
+     *
+     * Basic markdown is supported (bold, italic, and link)
+     * External link will be opened in new tab
+     *
+     * Template:
+     * - {{ year }} will be replaced with the current year
+     * - {{ repository }} will be replaced with the original repository link
+     * - {{ author }} will be replaced with author from siteAuthor config above (If it's not set, it will be set to mbaharip)
+     * - {{ version }} will be replaced with the current version
+     * - {{ siteName }} will be replaced with the siteName config above
+     * - {{ handle }} will be replaced with the twitter handle from twitterHandle config above
+     * - {{ creator }} will be replaced with mbaharip if you want to credit me
+     */
+    footer: [
+      "{{ siteName }} *v{{ version }}* @ {{ repository }}",
+      "{{ year }} - Made with ❤️ by **{{ author }}**",
+    ],
+
+    /**
+     * Site wide password protection
+     * If this is set, all files and folders will be protected by this password
+     *
+     * The site password are set from Environment Variable (NEXT_GDRIVE_INDEX_PASSWORD)
+     * It's because I don't want to store sensitive data in the code
+     */
+    privateIndex: {{siteConfig.privateIndex}},
+
+    /**
+     * Maximum breadcrumb length
+     * If the breadcrumb is longer than this, it will be shortened
+     */
+    breadcrumbMax: 3,
+
+    /**
+     * Toast notification configuration
+     *
+     * position: Self-explanatory
+     * duration: duration before the toast disappear in milliseconds
+     */
+    toaster: {
+      position: "bottom-right",
+      duration: 3000,
+    },
+
+    /**
+     * Example item:
+     * {
+     *  icon: string, // icon name from lucide icons (https://lucide.dev/icons/)
+     *  name: string,
+     *  href: string,
+     *  external?: boolean
+     * }
+     */
+    navbarItems: [],
+
+    /**
+     * Add support / donation links on the navbar
+     * Example item:
+     * {
+     *  name: string,
+     *  currency: string,
+     *  href: string,
+     * }
+     */
+    supports: [],
+  },
+};
+
+export default config;`;
+
+export async function generateConfig(data: z.input<typeof Schema_App_Configuration>) {
+  const generated = config_template
+    .replace("{{version}}", `"${pkg.version}"`)
+
+    .replace("{{apiConfig.rootFolder}}", `"${await encryptData(data.api.rootFolder, data.environment.ENCRYPTION_KEY)}"`)
+    .replace("{{apiConfig.isTeamDrive}}", `${data.api.isTeamDrive}`)
+    .replace(
+      "{{apiConfig.sharedDrive}}",
+      `"${data.api.sharedDrive ? await encryptData(data.api.sharedDrive, data.environment.ENCRYPTION_KEY) : ""}"`,
+    )
+    .replace("{{apiConfig.itemsPerPage}}", `${data.api.itemsPerPage}`)
+    .replace("{{apiConfig.searchResult}}", `${data.api.searchResult}`)
+    .replace("{{apiConfig.proxyThumbnail}}", `${data.api.proxyThumbnail}`)
+    .replace("{{apiConfig.allowDownloadProtectedFile}}", `${data.api.allowDownloadProtectedFile}`)
+    .replace("{{apiConfig.temporaryTokenDuration}}", `${data.api.temporaryTokenDuration}`)
+    .replace("{{apiConfig.maxFileSize}}", `${data.api.maxFileSize}`)
+    .replace("{{apiConfig.streamMaxSize}}", `${data.api.streamMaxSize}`)
+
+    .replace("{{siteConfig.siteName}}", `"${data.site.siteName}"`)
+    .replace("{{siteConfig.siteNameTemplate}}", `"${data.site.siteNameTemplate}"`)
+    .replace("{{siteConfig.siteDescription}}", `"${data.site.siteDescription}"`)
+    .replace("{{siteConfig.siteAuthor}}", `"${data.site.siteAuthor}"`)
+    .replace("{{siteConfig.twitterHandle}}", `"${data.site.twitterHandle}"`)
+    .replace("{{siteConfig.showFileExtension}}", `${data.site.showFileExtension}`)
+    .replace("{{siteConfig.privateIndex}}", `${data.site.privateIndex}`);
+
+  return generated;
+}
diff --git a/src/data/template/index.ts b/src/data/template/index.ts
new file mode 100644
index 0000000..3ea24a0
--- /dev/null
+++ b/src/data/template/index.ts
@@ -0,0 +1,2 @@
+export { generateConfig } from "./configuration";
+export { generateTheme } from "./theme";
diff --git a/src/data/template/theme.ts b/src/data/template/theme.ts
new file mode 100644
index 0000000..53f8a9a
--- /dev/null
+++ b/src/data/template/theme.ts
@@ -0,0 +1,96 @@
+import { z } from "zod";
+import pkg from "~/../package.json";
+
+import { Schema_Theme } from "~/types/schema";
+
+const template = `/* Version: ${pkg.version} */
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* Shadcn/ui theme */
+@layer base {
+  :root {
+{{lightTheme}}
+  }
+
+  .dark {
+{{darkTheme}}
+  }
+
+  div.preview * {
+    @apply !transition-none;
+  }
+}
+
+html,
+body {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+@layer base {
+  :root {
+    @apply text-[100%];
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+
+  ::-webkit-scrollbar {
+    @apply h-1.5 w-1.5;
+  }
+  ::-webkit-scrollbar-track {
+    @apply bg-primary/5;
+  }
+  ::-webkit-scrollbar-thumb {
+    @apply rounded-full bg-primary/25 hover:bg-primary/50;
+  }
+
+  /* Typography */
+  h1 {
+    @apply scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl;
+  }
+  h2 {
+    @apply scroll-m-20 text-3xl font-semibold tracking-tight first:mt-0;
+  }
+  h3 {
+    @apply scroll-m-20 text-2xl font-semibold tracking-tight;
+  }
+  h4 {
+    @apply scroll-m-20 text-xl font-semibold tracking-tight;
+  }
+  .paragraph {
+    @apply leading-7 [&:not(:first-child)]:mt-6;
+  }
+  blockquote {
+    @apply mt-6 border-l-2 pl-6 italic;
+  }
+  ul {
+    @apply my-6 ml-6 list-disc [&>li]:mt-2;
+  }
+  .lead {
+    @apply text-xl text-muted-foreground;
+  }
+  .large {
+    @apply text-lg font-semibold;
+  }
+  .muted {
+    @apply text-sm text-muted-foreground;
+  }
+  small {
+    @apply text-sm font-medium leading-none;
+  }
+}
+`;
+
+export function generateTheme(theme: Record<"light" | "dark", z.input<typeof Schema_Theme>>) {
+  const lightTheme = Object.entries(theme.light)
+    .map(([key, value]) => `    --${key}: ${value};`)
+    .join("\n");
+  const darkTheme = Object.entries(theme.dark)
+    .map(([key, value]) => `    --${key}: ${value};`)
+    .join("\n");
+
+  return template.replace("{{lightTheme}}", lightTheme).replace("{{darkTheme}}", darkTheme);
+}
diff --git a/src/hooks/useLoading.ts b/src/hooks/useLoading.ts
new file mode 100644
index 0000000..6637b8b
--- /dev/null
+++ b/src/hooks/useLoading.ts
@@ -0,0 +1,23 @@
+"use client";
+
+import { DependencyList, useEffect, useState } from "react";
+
+type Props = {
+  awaitFor?: () => Promise<void>;
+  deps?: DependencyList;
+};
+export default function useLoading(awaitFor?: () => Promise<void>, deps: DependencyList = []) {
+  const [loading, setLoading] = useState<boolean>(true);
+
+  useEffect(() => {
+    if (awaitFor) {
+      awaitFor().finally(() => setLoading(false));
+    } else {
+      setLoading(false);
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, deps);
+
+  return loading;
+}
diff --git a/src/hooks/useLocalStorage.ts b/src/hooks/useLocalStorage.ts
index 2fd82bf..450a1f9 100644
--- a/src/hooks/useLocalStorage.ts
+++ b/src/hooks/useLocalStorage.ts
@@ -1,3 +1,5 @@
+"use client";
+
 import { useEffect, useState } from "react";
 
 type SetValue<T> = (value: T | ((val: T) => T)) => void;
diff --git a/src/hooks/useMediaQuery.ts b/src/hooks/useMediaQuery.ts
index 8188657..0403df2 100644
--- a/src/hooks/useMediaQuery.ts
+++ b/src/hooks/useMediaQuery.ts
@@ -1,3 +1,5 @@
+"use client";
+
 import { useEffect, useState } from "react";
 
 export default function useMediaQuery(query: string) {
diff --git a/src/styles/globals.css b/src/styles/globals.css
deleted file mode 100644
index d285b99..0000000
--- a/src/styles/globals.css
+++ /dev/null
@@ -1,39 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-html,
-body {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-
-@layer base {
-  * {
-    @apply outline-none;
-    @apply focus-visible:outline-accent-500 focus-visible:outline-2 focus-visible:-outline-offset-1;
-  }
-
-  html,
-  body {
-    @apply bg-primary-950;
-  }
-
-  ::-webkit-scrollbar {
-    @apply h-1 w-1;
-  }
-
-  ::-webkit-scrollbar-track {
-    @apply bg-primary-950;
-  }
-
-  ::-webkit-scrollbar-thumb {
-    @apply bg-primary-600 hover:bg-primary-500;
-  }
-
-  input::-ms-reveal,
-  input::-ms-clear {
-    @apply hidden;
-  }
-}
diff --git a/src/styles/highlight.css b/src/styles/highlight.css
deleted file mode 100644
index d7542db..0000000
--- a/src/styles/highlight.css
+++ /dev/null
@@ -1,472 +0,0 @@
-:root {
-  /**
-    * One Light theme for prism.js
-    * Based on Atom's One Light theme: https://github.com/atom/atom/tree/master/packages/one-light-syntax
-    */
-  /* From colors.less */
-  --mono-1: hsl(230, 8%, 24%);
-  --mono-2: hsl(230, 6%, 44%);
-  --mono-3: hsl(230, 4%, 64%);
-  --hue-1: hsl(198, 99%, 37%);
-  --hue-2: hsl(221, 87%, 60%);
-  --hue-3: hsl(301, 63%, 40%);
-  --hue-4: hsl(119, 34%, 47%);
-  --hue-5: hsl(5, 74%, 59%);
-  --hue-5-2: hsl(344, 84%, 43%);
-  --hue-6: hsl(35, 99%, 36%);
-  --hue-6-2: hsl(35, 99%, 40%);
-  --syntax-fg: hsl(230, 8%, 24%);
-  --syntax-bg: hsl(230, 1%, 98%);
-  --syntax-gutter: hsl(230, 1%, 62%);
-  --syntax-guide: hsla(230, 8%, 24%, 0.2);
-  --syntax-accent: hsl(230, 100%, 66%);
-  /* From syntax-variables.less */
-  --syntax-selection-color: hsl(230, 1%, 90%);
-  --syntax-gutter-background-color-selected: hsl(230, 1%, 90%);
-  --syntax-cursor-line: hsla(230, 8%, 24%, 0.05);
-}
-
-body {
-  /**
-    * One Dark theme for prism.js
-    * Based on Atom's One Dark theme: https://github.com/atom/atom/tree/master/packages/one-dark-syntax
-    */
-  /* From colors.less */
-  --mono-1: hsl(220, 14%, 71%);
-  --mono-2: hsl(220, 9%, 55%);
-  --mono-3: hsl(220, 10%, 40%);
-  --hue-1: hsl(187, 47%, 55%);
-  --hue-2: hsl(207, 82%, 66%);
-  --hue-3: hsl(286, 60%, 67%);
-  --hue-4: hsl(95, 38%, 62%);
-  --hue-5: hsl(355, 65%, 65%);
-  --hue-5-2: hsl(5, 48%, 51%);
-  --hue-6: hsl(29, 54%, 61%);
-  --hue-6-2: hsl(39, 67%, 69%);
-  --syntax-fg: hsl(220, 14%, 71%);
-  --syntax-bg: hsl(220, 13%, 18%);
-  --syntax-gutter: hsl(220, 14%, 45%);
-  --syntax-guide: hsla(220, 14%, 71%, 0.15);
-  --syntax-accent: hsl(220, 100%, 66%);
-  /* From syntax-variables.less */
-  --syntax-selection-color: hsl(220, 13%, 28%);
-  --syntax-gutter-background-color-selected: hsl(220, 13%, 26%);
-  --syntax-cursor-line: hsla(220, 100%, 80%, 0.04);
-}
-
-code[class*="language-"],
-pre[class*="language-"],
-pre {
-  background: var(--syntax-bg);
-  color: var(--syntax-fg);
-  text-shadow: 0 1px rgba(0, 0, 0, 0);
-  font-size: inherit;
-  direction: ltr;
-  text-align: left;
-  white-space: pre;
-  word-spacing: normal;
-  word-break: normal;
-  line-height: 1.5;
-  -moz-tab-size: 2;
-  tab-size: 2;
-  -webkit-hyphens: none;
-  -moz-hyphens: none;
-  -ms-hyphens: none;
-  hyphens: none;
-}
-
-/* Selection */
-code[class*="language-"]::-moz-selection,
-code[class*="language-"] *::-moz-selection,
-pre[class*="language-"] *::-moz-selection {
-  background: var(--syntax-selection-color);
-  color: inherit;
-  text-shadow: none;
-}
-
-code[class*="language-"]::selection,
-code[class*="language-"] *::selection,
-pre[class*="language-"] *::selection {
-  background: var(--syntax-selection-color);
-  color: inherit;
-  text-shadow: none;
-}
-
-/* Code blocks */
-pre[class*="language-"],
-pre {
-  padding: 1em;
-  margin: 0.5em 0;
-  overflow: auto;
-  border-radius: 0.3em;
-}
-
-/* Inline code */
-:not(pre) > code[class*="language-"] {
-  padding: 0.2em 0.3em;
-  border-radius: 0.3em;
-  white-space: normal;
-}
-
-/* Print */
-@media print {
-  code[class*="language-"],
-  pre[class*="language-"] {
-    text-shadow: none;
-  }
-}
-
-.token.comment,
-.token.prolog,
-.token.cdata {
-  color: var(--mono-3);
-}
-
-.token.doctype,
-.token.punctuation,
-.token.entity {
-  color: var(--syntax-fg);
-}
-
-.token.attr-name,
-.token.class-name,
-.token.boolean,
-.token.constant,
-.token.number,
-.token.atrule {
-  color: var(--hue-6);
-}
-
-.token.keyword {
-  color: var(--hue-3);
-}
-
-.token.property,
-.token.tag,
-.token.symbol,
-.token.deleted,
-.token.important {
-  color: var(--hue-5);
-}
-
-.token.selector,
-.token.string,
-.token.char,
-.token.builtin,
-.token.inserted,
-.token.regex,
-.token.attr-value,
-.token.attr-value > .token.punctuation {
-  color: var(--hue-4);
-}
-
-.token.variable,
-.token.operator,
-.token.function {
-  color: var(--hue-2);
-}
-
-.token.url {
-  color: var(--hue-1);
-}
-
-/* HTML overrides */
-.token.attr-value > .token.punctuation.attr-equals,
-.token.special-attr > .token.attr-value > .token.value.css {
-  color: var(--syntax-fg);
-}
-
-/* CSS overrides */
-.language-css .token.selector {
-  color: var(--hue-5);
-}
-
-.language-css .token.property {
-  color: var(--syntax-fg);
-}
-
-.language-css .token.function,
-.language-css .token.url > .token.function {
-  color: var(--hue-1);
-}
-
-.language-css .token.url > .token.string.url {
-  color: var(--hue-4);
-}
-
-.language-css .token.important,
-.language-css .token.atrule .token.rule {
-  color: var(--hue-3);
-}
-
-/* JS overrides */
-.language-javascript .token.operator {
-  color: var(--hue-3);
-}
-
-.language-javascript
-  .token.template-string
-  > .token.interpolation
-  > .token.interpolation-punctuation.punctuation {
-  color: var(--hue-5-2);
-}
-
-/* JSON overrides */
-.language-json .token.operator {
-  color: var(--syntax-fg);
-}
-
-.language-json .token.null.keyword {
-  color: var(--hue-6);
-}
-
-/* MD overrides */
-.language-markdown .token.url,
-.language-markdown .token.url > .token.operator,
-.language-markdown .token.url-reference.url > .token.string {
-  color: var(--syntax-fg);
-}
-
-.language-markdown .token.url > .token.content {
-  color: var(--hue-2);
-}
-
-.language-markdown .token.url > .token.url,
-.language-markdown .token.url-reference.url {
-  color: var(--hue-1);
-}
-
-.language-markdown .token.blockquote.punctuation,
-.language-markdown .token.hr.punctuation {
-  color: var(--mono-3);
-  font-style: italic;
-}
-
-.language-markdown .token.code-snippet {
-  color: var(--hue-4);
-}
-
-.language-markdown .token.bold .token.content {
-  color: var(--hue-6);
-}
-
-.language-markdown .token.italic .token.content {
-  color: var(--hue-3);
-}
-
-.language-markdown .token.strike .token.content,
-.language-markdown .token.strike .token.punctuation,
-.language-markdown .token.list.punctuation,
-.language-markdown .token.title.important > .token.punctuation {
-  color: var(--hue-5);
-}
-
-/* General */
-.token.bold {
-  font-weight: bold;
-}
-
-.token.comment,
-.token.italic {
-  font-style: italic;
-}
-
-.token.entity {
-  cursor: help;
-}
-
-.token.namespace {
-  opacity: 0.8;
-}
-
-/* Plugin overrides */
-/* Selectors should have higher specificity than those in the plugins' default stylesheets */
-
-/* Show Invisible plugin overrides */
-.token.token.tab:not(:empty):before,
-.token.token.cr:before,
-.token.token.lf:before,
-.token.token.space:before {
-  color: var(--syntax-guide);
-  text-shadow: none;
-}
-
-/* Toolbar plugin overrides */
-/* Space out all buttons and move them away from the right edge of the code block */
-div.code-toolbar > .toolbar.toolbar > .toolbar-item {
-  margin-right: 0.4em;
-}
-
-/* Styling the buttons */
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > button,
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > a,
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > span {
-  background: var(--syntax-gutter-background-color-selected);
-  color: var(--mono-2);
-  padding: 0.1em 0.4em;
-  border-radius: 0.3em;
-}
-
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:hover,
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:focus,
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:hover,
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:focus,
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:hover,
-div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus {
-  background: var(--syntax-selection-color);
-  color: var(--syntax-fg);
-}
-
-/* Line Highlight plugin overrides */
-/* The highlighted line itself */
-.line-highlight.line-highlight {
-  background: var(--syntax-cursor-line);
-}
-
-/* Default line numbers in Line Highlight plugin */
-.line-highlight.line-highlight:before,
-.line-highlight.line-highlight[data-end]:after {
-  background: var(--syntax-gutter-background-color-selected);
-  color: var(--syntax-fg);
-  padding: 0.1em 0.6em;
-  border-radius: 0.3em;
-  box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.2); /* same as Toolbar plugin default */
-}
-
-/* Hovering over a linkable line number (in the gutter area) */
-/* Requires Line Numbers plugin as well */
-pre[id].linkable-line-numbers.linkable-line-numbers
-  span.line-numbers-rows
-  > span:hover:before {
-  background-color: var(--syntax-cursor-line);
-}
-
-/* Line Numbers and Command Line plugins overrides */
-/* Line separating gutter from coding area */
-.line-numbers.line-numbers .line-numbers-rows,
-.command-line .command-line-prompt {
-  border-right-color: var(--syntax-guide);
-}
-
-/* Stuff in the gutter */
-.line-numbers .line-numbers-rows > span:before,
-.command-line .command-line-prompt > span:before {
-  color: var(--syntax-gutter);
-}
-
-/* Match Braces plugin overrides */
-/* Note: Outline colour is inherited from the braces */
-.rainbow-braces .token.token.punctuation.brace-level-1,
-.rainbow-braces .token.token.punctuation.brace-level-5,
-.rainbow-braces .token.token.punctuation.brace-level-9 {
-  color: var(--hue-5);
-}
-
-.rainbow-braces .token.token.punctuation.brace-level-2,
-.rainbow-braces .token.token.punctuation.brace-level-6,
-.rainbow-braces .token.token.punctuation.brace-level-10 {
-  color: var(--hue-4);
-}
-
-.rainbow-braces .token.token.punctuation.brace-level-3,
-.rainbow-braces .token.token.punctuation.brace-level-7,
-.rainbow-braces .token.token.punctuation.brace-level-11 {
-  color: var(--hue-2);
-}
-
-.rainbow-braces .token.token.punctuation.brace-level-4,
-.rainbow-braces .token.token.punctuation.brace-level-8,
-.rainbow-braces .token.token.punctuation.brace-level-12 {
-  color: var(--hue-3);
-}
-
-/* Diff Highlight plugin overrides */
-/* Taken from https://github.com/atom/github/blob/master/styles/variables.less */
-pre.diff-highlight > code .token.token.deleted:not(.prefix),
-pre > code.diff-highlight .token.token.deleted:not(.prefix) {
-  background-color: hsla(353, 100%, 66%, 0.15);
-}
-
-pre.diff-highlight > code .token.token.deleted:not(.prefix)::-moz-selection,
-pre.diff-highlight > code .token.token.deleted:not(.prefix) *::-moz-selection,
-pre > code.diff-highlight .token.token.deleted:not(.prefix)::-moz-selection,
-pre > code.diff-highlight .token.token.deleted:not(.prefix) *::-moz-selection {
-  background-color: hsla(353, 95%, 66%, 0.25);
-}
-
-pre.diff-highlight > code .token.token.deleted:not(.prefix)::selection,
-pre.diff-highlight > code .token.token.deleted:not(.prefix) *::selection,
-pre > code.diff-highlight .token.token.deleted:not(.prefix)::selection,
-pre > code.diff-highlight .token.token.deleted:not(.prefix) *::selection {
-  background-color: hsla(353, 95%, 66%, 0.25);
-}
-
-pre.diff-highlight > code .token.token.inserted:not(.prefix),
-pre > code.diff-highlight .token.token.inserted:not(.prefix) {
-  background-color: hsla(137, 100%, 55%, 0.15);
-}
-
-pre.diff-highlight > code .token.token.inserted:not(.prefix)::-moz-selection,
-pre.diff-highlight > code .token.token.inserted:not(.prefix) *::-moz-selection,
-pre > code.diff-highlight .token.token.inserted:not(.prefix)::-moz-selection,
-pre > code.diff-highlight .token.token.inserted:not(.prefix) *::-moz-selection {
-  background-color: hsla(135, 73%, 55%, 0.25);
-}
-
-pre.diff-highlight > code .token.token.inserted:not(.prefix)::selection,
-pre.diff-highlight > code .token.token.inserted:not(.prefix) *::selection,
-pre > code.diff-highlight .token.token.inserted:not(.prefix)::selection,
-pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection {
-  background-color: hsla(135, 73%, 55%, 0.25);
-}
-
-/* Previewers plugin overrides */
-/* Based on https://github.com/atom-community/atom-ide-datatip/blob/master/styles/atom-ide-datatips.less and https://github.com/atom/atom/blob/master/packages/one-dark-ui */
-/* Border around popup */
-.prism-previewer.prism-previewer:before,
-.prism-previewer-gradient.prism-previewer-gradient div {
-  border-color: hsl(224, 13%, 17%);
-}
-
-/* Angle and time should remain as circles and are hence not included */
-.prism-previewer-color.prism-previewer-color:before,
-.prism-previewer-gradient.prism-previewer-gradient div,
-.prism-previewer-easing.prism-previewer-easing:before {
-  border-radius: 0.3em;
-}
-
-/* Triangles pointing to the code */
-.prism-previewer.prism-previewer:after {
-  border-top-color: hsl(224, 13%, 17%);
-}
-
-.prism-previewer-flipped.prism-previewer-flipped.after {
-  border-bottom-color: hsl(224, 13%, 17%);
-}
-
-/* Background colour within the popup */
-.prism-previewer-angle.prism-previewer-angle:before,
-.prism-previewer-time.prism-previewer-time:before,
-.prism-previewer-easing.prism-previewer-easing {
-  background: hsl(219, 13%, 22%);
-}
-
-/* For angle, this is the positive area (eg. 90deg will display one quadrant in this colour) */
-/* For time, this is the alternate colour */
-.prism-previewer-angle.prism-previewer-angle circle,
-.prism-previewer-time.prism-previewer-time circle {
-  stroke: var(--syntax-fg);
-  stroke-opacity: 1;
-}
-
-/* Stroke colours of the handle, direction point, and vector itself */
-.prism-previewer-easing.prism-previewer-easing circle,
-.prism-previewer-easing.prism-previewer-easing path,
-.prism-previewer-easing.prism-previewer-easing line {
-  stroke: var(--syntax-fg);
-}
-
-/* Fill colour of the handle */
-.prism-previewer-easing.prism-previewer-easing circle {
-  fill: transparent;
-}
diff --git a/src/styles/markdown.css b/src/styles/markdown.css
deleted file mode 100644
index c247657..0000000
--- a/src/styles/markdown.css
+++ /dev/null
@@ -1,107 +0,0 @@
-@tailwind components;
-
-@layer components {
-  .markdown {
-    @apply bg-inherit text-base leading-relaxed tracking-wide;
-  }
-
-  .markdown p {
-    @apply leading-loose;
-  }
-
-  .markdown h1 {
-    @apply text-4xl font-medium;
-  }
-  .markdown h2 {
-    @apply text-3xl font-medium;
-  }
-  .markdown h3 {
-    @apply text-2xl font-medium;
-  }
-  .markdown h4 {
-    @apply text-xl font-medium;
-  }
-  .markdown h5 {
-    @apply text-lg font-medium;
-  }
-  .markdown h6 {
-    @apply text-base;
-  }
-
-  .markdown h1,
-  .markdown h2,
-  .markdown h3 {
-    @apply border-b-primary-700 my-4 border-b-2 first-letter:capitalize;
-  }
-
-  .markdown code:not(pre code) {
-    @apply bg-primary-800 rounded-md px-2 py-0.5 leading-normal;
-  }
-
-  .markdown a {
-    @apply text-accent-500 transition-smooth opacity-80 hover:opacity-100;
-  }
-
-  .markdown p {
-    @apply whitespace-normal;
-  }
-
-  .markdown img {
-    @apply rounded-lg;
-  }
-
-  .markdown ul {
-    @apply list-disc leading-loose;
-  }
-
-  .markdown ol {
-    @apply list-decimal leading-loose;
-  }
-
-  .markdown li {
-    @apply ml-8;
-  }
-
-  .markdown table {
-    @apply mb-4 block w-full border-collapse border-spacing-0 overflow-auto;
-  }
-
-  .markdown table th,
-  .markdown table td {
-    @apply border-primary-700 border px-2 py-1;
-  }
-
-  .markdown table th {
-    @apply bg-primary-950 text-primary-50;
-  }
-
-  .markdown table tr {
-    @apply bg-primary-900;
-  }
-
-  .markdown table tr:nth-child(2n) {
-    @apply bg-primary-800;
-  }
-
-  .markdown ul.contains-task-list {
-    @apply list-none;
-  }
-
-  .markdown ul.contains-task-list li {
-    @apply ml-1 flex items-center;
-  }
-
-  .markdown input[type="checkbox"] {
-    @apply mr-2 aspect-square h-4 w-4 rounded-full p-2;
-    @apply border-primary-500 appearance-none border;
-    @apply disabled:bg-primary-600 disabled:checked:bg-accent-400;
-  }
-
-  .markdown blockquote {
-    @apply border-l-info-500 bg-primary-800 my-2 rounded-r-md border-l-4 py-4 pl-2;
-  }
-
-  .markdown hr {
-    @apply border-b-primary-500 my-4 border-b border-t-0;
-  }
-}
diff --git a/src/schema.ts b/src/types/schema.ts
similarity index 99%
rename from src/schema.ts
rename to src/types/schema.ts
index eeb3ef3..2e38049 100644
--- a/src/schema.ts
+++ b/src/types/schema.ts
@@ -212,7 +212,7 @@ export type ConfigurationValue<
   K extends keyof z.infer<typeof Schema_App_Configuration>[T],
 > = z.infer<typeof Schema_App_Configuration>[T][K];
 
-export type ConfigState = "idle" | "loading";
+export type ButtonState = "idle" | "loading";
 
 export const Schema_Theme = z.object({
   "background": z.string(),
diff --git a/src/utils/bytesFormat.ts b/src/utils/bytesFormat.ts
index 6689bf2..b0fb08b 100644
--- a/src/utils/bytesFormat.ts
+++ b/src/utils/bytesFormat.ts
@@ -1,4 +1,4 @@
-export default function bytesToReadable(bytes: number) {
+export function bytesToReadable(bytes: number) {
   const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
   if (bytes === 0) return "0 Byte";
   const i = Math.floor(Math.log(bytes) / Math.log(1024));
diff --git a/src/utils.ts b/src/utils/cn.ts
similarity index 100%
rename from src/utils.ts
rename to src/utils/cn.ts
diff --git a/src/utils/downloadBlob.ts b/src/utils/downloadBlob.ts
new file mode 100644
index 0000000..551f6e1
--- /dev/null
+++ b/src/utils/downloadBlob.ts
@@ -0,0 +1,17 @@
+export function downloadBlob(data: Blob, filename: string) {
+  const url = URL.createObjectURL(data);
+  const anchor = document.createElement("a");
+  anchor.href = url;
+  anchor.download = filename;
+
+  const afterClick = () => {
+    setTimeout(() => {
+      URL.revokeObjectURL(url);
+      removeEventListener("click", afterClick);
+      anchor.remove();
+    }, 100);
+  };
+  anchor.addEventListener("click", afterClick);
+
+  anchor.click();
+}
diff --git a/src/utils/encryptionHelper/hash.ts b/src/utils/encryptionHelper.ts
similarity index 100%
rename from src/utils/encryptionHelper/hash.ts
rename to src/utils/encryptionHelper.ts
diff --git a/src/utils/fileLoadHelper.ts b/src/utils/fileLoadHelper.ts
new file mode 100644
index 0000000..c969d04
--- /dev/null
+++ b/src/utils/fileLoadHelper.ts
@@ -0,0 +1,40 @@
+import toast from "react-hot-toast";
+
+type Props = {
+  accept: string;
+  fileName?: string;
+  onLoad: (result: string) => void;
+};
+export function fileLoadHelper({ accept, fileName, onLoad }: Props) {
+  const fileInput = document.createElement("input");
+  fileInput.type = "file";
+  fileInput.accept = accept;
+  fileInput.onchange = async (fileEvent) => {
+    const file = (fileEvent.target as HTMLInputElement).files?.[0];
+    if (!file) return toast.error("No file selected.");
+
+    if (fileName) {
+      const filename = file.name;
+      if (filename.toLocaleLowerCase() !== fileName.toLocaleLowerCase()) {
+        return toast.error(`Invalid file selected. Expected ${fileName}.`);
+      }
+    }
+
+    const reader = new FileReader();
+    reader.onload = async (readerEvent) => {
+      const result = readerEvent.target?.result as string;
+      if (!result) return toast.error("Failed to read file.");
+
+      onLoad(result);
+
+      fileInput.value = "";
+    };
+    reader.onloadend = () => {
+      fileInput.remove();
+    };
+
+    reader.readAsText(file);
+  };
+  fileInput.click();
+  fileInput.remove();
+}
diff --git a/src/utils/footerFormatter.ts b/src/utils/footerFormatter.ts
index 5039b3d..b5bb638 100644
--- a/src/utils/footerFormatter.ts
+++ b/src/utils/footerFormatter.ts
@@ -1,19 +1,13 @@
-import config from "~/config/gIndex.config";
+import config from "config";
 
 export function formatFooter(text: string[]): string {
   return text
     .join("\n")
     .replaceAll("{{ year }}", new Date().getFullYear().toString())
-    .replaceAll(
-      "{{ repository }}",
-      "[Repository](https://github.com/mbaharip/next-gdrive-index)",
-    )
+    .replaceAll("{{ repository }}", "[Repository](https://github.com/mbaharip/next-gdrive-index)")
     .replaceAll("{{ author }}", config.siteConfig.siteAuthor || "mbaharip")
     .replaceAll("{{ version }}", config.version || "0.0.0")
     .replaceAll("{{ siteName }}", config.siteConfig.siteName)
-    .replaceAll(
-      "{{ handle }}",
-      config.siteConfig.twitterHandle || "@__mbaharip__",
-    )
+    .replaceAll("{{ handle }}", config.siteConfig.twitterHandle || "@__mbaharip__")
     .replaceAll("{{ creator }}", "mbaharip");
 }
diff --git a/src/utils/gdriveInstance.ts b/src/utils/gdriveInstance.ts
index f399f0e..35b252c 100644
--- a/src/utils/gdriveInstance.ts
+++ b/src/utils/gdriveInstance.ts
@@ -18,16 +18,6 @@ const serviceB64: {
   client_x509_cert_url: string;
   universe_domain: string;
 } = JSON.parse(base64Decode(process.env.GD_SERVICE_B64 as string));
-// const serviceAccount = {
-//   email: process.env.GD_SERVICE_EMAIL,
-//   key: (process.env.GD_SERVICE_PVKEY as string).replace(
-//     /\\n/g,
-//     "\n",
-//   ),
-//   projectId: process.env.GD_SERVICE_PROJECT_ID,
-//   clientId: process.env.GD_SERVICE_CLIENT_ID,
-//   scopes: ["https://www.googleapis.com/auth/drive"],
-// };
 const serviceAccount = {
   email: serviceB64.client_email,
   key: serviceB64.private_key,
diff --git a/src/utils/isDev.ts b/src/utils/isDev.ts
index 6a1d0fa..035944b 100644
--- a/src/utils/isDev.ts
+++ b/src/utils/isDev.ts
@@ -2,9 +2,7 @@
  * It is a helper to check if it's not in production environment.
  * If you're developing, and not using vercel, you can add your own condition.
  */
-const isDev =
+export const isDev =
   process.env.NODE_ENV === "development" ||
   process.env.VERCEL_ENV === "development" ||
   process.env.VERCEL_ENV === "preview";
-
-export default isDev;
diff --git a/src/utils/parseConfigFile.ts b/src/utils/parseConfigFile.ts
index 01edba9..22a9e83 100644
--- a/src/utils/parseConfigFile.ts
+++ b/src/utils/parseConfigFile.ts
@@ -1,12 +1,8 @@
 // Used for configuration on deploy guide page
 import { HslColor } from "react-colorful";
 import { z } from "zod";
-import {
-  Schema_Config,
-  Schema_Config_API,
-  Schema_Config_Site,
-  Schema_Old_Config,
-} from "~/schema";
+
+import { Schema_Config, Schema_Config_API, Schema_Config_Site, Schema_Old_Config } from "~/types/schema";
 
 export function parseConfigFile(config: string):
   | {
@@ -60,14 +56,9 @@ export function parseConfigFile(config: string):
 
     const parseJSON = JSON.parse(configuration);
     const version: string | undefined = parseJSON.version;
-    if (!version)
-      throw new Error(
-        "Version not found, please check your configuration file.",
-      );
+    if (!version) throw new Error("Version not found, please check your configuration file.");
 
-    const data = parseJSON as
-      | z.infer<typeof Schema_Old_Config>
-      | z.infer<typeof Schema_Config>;
+    const data = parseJSON as z.infer<typeof Schema_Old_Config> | z.infer<typeof Schema_Config>;
 
     return {
       api: data.apiConfig as z.infer<typeof Schema_Config_API>,
diff --git a/src/utils/previewHelper.ts b/src/utils/previewHelper.ts
index 6295a2e..965f057 100644
--- a/src/utils/previewHelper.ts
+++ b/src/utils/previewHelper.ts
@@ -70,18 +70,6 @@ const extensionsMap: Record<FileTypes, string[]> = {
   manga: ["cbz"],
 };
 
-// const previewMap: Record<FileTypes | "unknown", (props: PreviewProps) => JSX.Element> = {
-//   image: ImagePreview,
-//   audio: AudioPreview,
-//   video: VideoPreview,
-//   markdown: RichPreview,
-//   pdf: DocumentPreview,
-//   document: DocumentPreview,
-//   code: CodePreview,
-//   text: CodePreview,
-//   manga: MangaPreview,
-//   unknown: UnknownPreview,
-// };
 const iconMap: Record<FileTypes | "unknown", keyof typeof icons> = {
   image: "Image",
   audio: "Music",
@@ -96,24 +84,7 @@ const iconMap: Record<FileTypes | "unknown", keyof typeof icons> = {
   unknown: "File",
 };
 
-// export function getPreviewComponent(fileExtension: string, mimeType: string) {
-//   if (fileExtension === "ts") {
-//     if (mimeType.includes("video")) {
-//       return previewMap["video"];
-//     } else {
-//       return previewMap["code"];
-//     }
-//   }
-//   const type = Object.keys(extensionsMap).find((key) =>
-//     extensionsMap[key as keyof typeof extensionsMap].includes(fileExtension),
-//   );
-//   return previewMap[type as keyof typeof previewMap] ?? previewMap["unknown"];
-// }
-
-export function getFileType(
-  fileExtension: string,
-  mimeType: string,
-): FileTypes | "unknown" {
+export function getFileType(fileExtension: string, mimeType: string): FileTypes | "unknown" {
   if (fileExtension === "ts") {
     if (mimeType.includes("video")) {
       return "video";

From 486ea322e76832ea08f7c6322a4ab53cd9176d23 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Sat, 18 May 2024 15:18:03 +0700
Subject: [PATCH 15/20] Bump version and other

---
 .prettierrc.js  |   8 +-
 components.json |   2 +-
 package.json    |   2 +-
 tsconfig.json   |  29 +-
 yarn.lock       | 785 +++++++++++++++++++++++++-----------------------
 5 files changed, 413 insertions(+), 413 deletions(-)

diff --git a/.prettierrc.js b/.prettierrc.js
index 1f50f3e..3c2169e 100644
--- a/.prettierrc.js
+++ b/.prettierrc.js
@@ -1,10 +1,7 @@
 "use strict";
 module.exports = {
-  plugins: [
-    "@trivago/prettier-plugin-sort-imports",
-    "prettier-plugin-tailwindcss",
-  ],
-  printWidth: 80,
+  plugins: ["@trivago/prettier-plugin-sort-imports", "prettier-plugin-tailwindcss"],
+  printWidth: 120,
   tabWidth: 2,
   useTabs: false,
   semi: true,
@@ -31,6 +28,7 @@ module.exports = {
     "^~/(utils|hooks|context)/(.*)$",
     "^~/types/(.*)$",
     "^~/(config|styles)/(.*)$",
+    "^(config|actions)$",
     "^[./]",
   ],
   importOrderSeparation: true,
diff --git a/components.json b/components.json
index e048066..848837b 100644
--- a/components.json
+++ b/components.json
@@ -12,6 +12,6 @@
   },
   "aliases": {
     "components": "~/components",
-    "utils": "~/utils"
+    "utils": "~/utils/cn"
   }
 }
diff --git a/package.json b/package.json
index 06ccf5e..0fe4e26 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "next-gdrive-index",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "private": true,
   "scripts": {
     "dev": "next dev -p 3000",
diff --git a/tsconfig.json b/tsconfig.json
index 32d8714..bfb6a63 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -16,18 +16,9 @@
     "incremental": true,
     "baseUrl": "./src",
     "paths": {
-      // "@/*": ["./src/*"],
-      // "components/*": [
-      //   "app/(__components)/*"
-      // ],
       "~/*": ["*"],
-      "components/*": ["components/*"],
-      "config": ["config/gIndex.config.ts"],
-      "hooks/*": ["hooks/*"],
-      "styles/*": ["styles/*"],
-      "utils/*": ["utils/*"],
-      "types/*": ["types/*"],
-      "context/*": ["context/*"]
+      "actions": ["app/actions.ts"],
+      "config": ["config/gIndex.config.ts"]
     },
     "plugins": [
       {
@@ -35,18 +26,6 @@
       }
     ]
   },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    "**/*.js",
-    ".next/types/**/*.ts"
-  ],
-  "exclude": [
-    "node_modules",
-    ".next",
-    "**/*/_legacy/**/*",
-    "**/*/_app/**/*",
-    "**/*/_page/**/*"
-  ]
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "**/*.js", ".next/types/**/*.ts"],
+  "exclude": ["node_modules", ".next", "**/*/_legacy/**/*", "**/*/_app/**/*", "**/*/_page/**/*"]
 }
diff --git a/yarn.lock b/yarn.lock
index e71512b..806e955 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5,13 +5,6 @@ __metadata:
   version: 8
   cacheKey: 10c0
 
-"@aashutoshrathi/word-wrap@npm:^1.2.3":
-  version: 1.2.6
-  resolution: "@aashutoshrathi/word-wrap@npm:1.2.6"
-  checksum: 10c0/53c2b231a61a46792b39a0d43bc4f4f776bb4542aa57ee04930676802e5501282c2fc8aac14e4cd1f1120ff8b52616b6ff5ab539ad30aa2277d726444b71619f
-  languageName: node
-  linkType: hard
-
 "@alloc/quick-lru@npm:^5.2.0":
   version: 5.2.0
   resolution: "@alloc/quick-lru@npm:5.2.0"
@@ -41,14 +34,14 @@ __metadata:
   linkType: hard
 
 "@babel/generator@npm:^7.23.0":
-  version: 7.24.4
-  resolution: "@babel/generator@npm:7.24.4"
+  version: 7.24.5
+  resolution: "@babel/generator@npm:7.24.5"
   dependencies:
-    "@babel/types": "npm:^7.24.0"
+    "@babel/types": "npm:^7.24.5"
     "@jridgewell/gen-mapping": "npm:^0.3.5"
     "@jridgewell/trace-mapping": "npm:^0.3.25"
     jsesc: "npm:^2.5.1"
-  checksum: 10c0/67a1b2f7cc985aaaa11b01e8ddd4fffa4f285837bc7a209738eb8203aa34bdafeb8507ed75fd883ddbabd641a036ca0a8d984e760f28ad4a9d60bff29d0a60bb
+  checksum: 10c0/0d64f880150e7dfb92ceff2b4ac865f36aa1e295120920246492ffd0146562dabf79ba8699af1c8833f8a7954818d4d146b7b02f808df4d6024fb99f98b2f78d
   languageName: node
   linkType: hard
 
@@ -79,55 +72,55 @@ __metadata:
   linkType: hard
 
 "@babel/helper-split-export-declaration@npm:^7.22.6":
-  version: 7.22.6
-  resolution: "@babel/helper-split-export-declaration@npm:7.22.6"
+  version: 7.24.5
+  resolution: "@babel/helper-split-export-declaration@npm:7.24.5"
   dependencies:
-    "@babel/types": "npm:^7.22.5"
-  checksum: 10c0/d83e4b623eaa9622c267d3c83583b72f3aac567dc393dda18e559d79187961cb29ae9c57b2664137fc3d19508370b12ec6a81d28af73a50e0846819cb21c6e44
+    "@babel/types": "npm:^7.24.5"
+  checksum: 10c0/d7a812d67d031a348f3fb0e6263ce2dbe6038f81536ba7fb16db385383bcd6542b71833194303bf6d3d0e4f7b6b584c9c8fae8772122e2ce68fc9bdf07f4135d
   languageName: node
   linkType: hard
 
-"@babel/helper-string-parser@npm:^7.23.4":
+"@babel/helper-string-parser@npm:^7.24.1":
   version: 7.24.1
   resolution: "@babel/helper-string-parser@npm:7.24.1"
   checksum: 10c0/2f9bfcf8d2f9f083785df0501dbab92770111ece2f90d120352fda6dd2a7d47db11b807d111e6f32aa1ba6d763fe2dc6603d153068d672a5d0ad33ca802632b2
   languageName: node
   linkType: hard
 
-"@babel/helper-validator-identifier@npm:^7.16.7, @babel/helper-validator-identifier@npm:^7.22.20":
-  version: 7.22.20
-  resolution: "@babel/helper-validator-identifier@npm:7.22.20"
-  checksum: 10c0/dcad63db345fb110e032de46c3688384b0008a42a4845180ce7cd62b1a9c0507a1bed727c4d1060ed1a03ae57b4d918570259f81724aaac1a5b776056f37504e
+"@babel/helper-validator-identifier@npm:^7.16.7, @babel/helper-validator-identifier@npm:^7.24.5":
+  version: 7.24.5
+  resolution: "@babel/helper-validator-identifier@npm:7.24.5"
+  checksum: 10c0/05f957229d89ce95a137d04e27f7d0680d84ae48b6ad830e399db0779341f7d30290f863a93351b4b3bde2166737f73a286ea42856bb07c8ddaa95600d38645c
   languageName: node
   linkType: hard
 
 "@babel/highlight@npm:^7.24.2":
-  version: 7.24.2
-  resolution: "@babel/highlight@npm:7.24.2"
+  version: 7.24.5
+  resolution: "@babel/highlight@npm:7.24.5"
   dependencies:
-    "@babel/helper-validator-identifier": "npm:^7.22.20"
+    "@babel/helper-validator-identifier": "npm:^7.24.5"
     chalk: "npm:^2.4.2"
     js-tokens: "npm:^4.0.0"
     picocolors: "npm:^1.0.0"
-  checksum: 10c0/98ce00321daedeed33a4ed9362dc089a70375ff1b3b91228b9f05e6591d387a81a8cba68886e207861b8871efa0bc997ceabdd9c90f6cce3ee1b2f7f941b42db
+  checksum: 10c0/e98047d3ad24608bfa596d000c861a2cc875af897427f2833b91a4e0d4cead07301a7ec15fa26093dcd61e036e2eed2db338ae54f93016fe0dc785fadc4159db
   languageName: node
   linkType: hard
 
 "@babel/parser@npm:^7.20.5, @babel/parser@npm:^7.23.0, @babel/parser@npm:^7.24.0":
-  version: 7.24.4
-  resolution: "@babel/parser@npm:7.24.4"
+  version: 7.24.5
+  resolution: "@babel/parser@npm:7.24.5"
   bin:
     parser: ./bin/babel-parser.js
-  checksum: 10c0/8381e1efead5069cb7ed2abc3a583f4a86289b2f376c75cecc69f59a8eb36df18274b1886cecf2f97a6a0dff5334b27330f58535be9b3e4e26102cc50e12eac8
+  checksum: 10c0/8333a6ad5328bad34fa0e12bcee147c3345ea9a438c0909e7c68c6cfbea43c464834ffd7eabd1cbc1c62df0a558e22ffade9f5b29440833ba7b33d96a71f88c0
   languageName: node
   linkType: hard
 
-"@babel/runtime@npm:^7.10.2, @babel/runtime@npm:^7.13.10, @babel/runtime@npm:^7.23.2, @babel/runtime@npm:^7.24.0":
-  version: 7.24.4
-  resolution: "@babel/runtime@npm:7.24.4"
+"@babel/runtime@npm:^7.10.2, @babel/runtime@npm:^7.13.10, @babel/runtime@npm:^7.23.2, @babel/runtime@npm:^7.24.1":
+  version: 7.24.5
+  resolution: "@babel/runtime@npm:7.24.5"
   dependencies:
     regenerator-runtime: "npm:^0.14.0"
-  checksum: 10c0/785aff96a3aa8ff97f90958e1e8a7b1d47f793b204b47c6455eaadc3f694f48c97cd5c0a921fe3596d818e71f18106610a164fb0f1c71fd68c622a58269d537c
+  checksum: 10c0/05730e43e8ba6550eae9fd4fb5e7d9d3cb91140379425abcb2a1ff9cebad518a280d82c4c4b0f57ada26a863106ac54a748d90c775790c0e2cd0ddd85ccdf346
   languageName: node
   linkType: hard
 
@@ -170,40 +163,41 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/types@npm:^7.17.0, @babel/types@npm:^7.22.5, @babel/types@npm:^7.23.0, @babel/types@npm:^7.24.0, @babel/types@npm:^7.8.3":
-  version: 7.24.0
-  resolution: "@babel/types@npm:7.24.0"
+"@babel/types@npm:^7.17.0, @babel/types@npm:^7.22.5, @babel/types@npm:^7.23.0, @babel/types@npm:^7.24.0, @babel/types@npm:^7.24.5, @babel/types@npm:^7.8.3":
+  version: 7.24.5
+  resolution: "@babel/types@npm:7.24.5"
   dependencies:
-    "@babel/helper-string-parser": "npm:^7.23.4"
-    "@babel/helper-validator-identifier": "npm:^7.22.20"
+    "@babel/helper-string-parser": "npm:^7.24.1"
+    "@babel/helper-validator-identifier": "npm:^7.24.5"
     to-fast-properties: "npm:^2.0.0"
-  checksum: 10c0/777a0bb5dbe038ca4c905fdafb1cdb6bdd10fe9d63ce13eca0bd91909363cbad554a53dc1f902004b78c1dcbc742056f877f2c99eeedff647333b1fadf51235d
+  checksum: 10c0/e1284eb046c5e0451b80220d1200e2327e0a8544a2fe45bb62c952e5fdef7099c603d2336b17b6eac3cc046b7a69bfbce67fe56e1c0ea48cd37c65cb88638f2a
   languageName: node
   linkType: hard
 
 "@cyntler/react-doc-viewer@npm:^1.13.0":
-  version: 1.14.1
-  resolution: "@cyntler/react-doc-viewer@npm:1.14.1"
+  version: 1.15.0
+  resolution: "@cyntler/react-doc-viewer@npm:1.15.0"
   dependencies:
-    "@types/mustache": "npm:^4.2.3"
-    "@types/papaparse": "npm:^5.3.9"
+    "@types/mustache": "npm:^4.2.5"
+    "@types/papaparse": "npm:^5.3.14"
+    ajv: "npm:^7"
     mustache: "npm:^4.2.0"
     papaparse: "npm:^5.4.1"
-    react-pdf: "npm:7.5.0"
-    styled-components: "npm:^6.0.8"
+    react-pdf: "npm:latest"
+    styled-components: "npm:^6.1.11"
   peerDependencies:
     react: ">=16.13.1"
     react-dom: ">=16.13.1"
-  checksum: 10c0/a9c3348eef033e9394079b9236365e0d9be4a04b818d5369bc83d22124d5b9905057d3880d43a9c365cf41c55835c2c88806b27e3ad5dbbfe647fb45d3f0ac67
+  checksum: 10c0/b934d0553ab2114e67d8af35d01de5ac36eeb61130e3314c2c63cff838ffbcf9527f585752a62f8ca6e358348cedbd9aee5e68c0cfa6a7321a5501f28d4a681f
   languageName: node
   linkType: hard
 
-"@emotion/is-prop-valid@npm:1.2.1":
-  version: 1.2.1
-  resolution: "@emotion/is-prop-valid@npm:1.2.1"
+"@emotion/is-prop-valid@npm:1.2.2":
+  version: 1.2.2
+  resolution: "@emotion/is-prop-valid@npm:1.2.2"
   dependencies:
     "@emotion/memoize": "npm:^0.8.1"
-  checksum: 10c0/7c2aabdf0ca9986ca25abc9dae711348308cf18d418d64ffa4c8ffd2114806c47f2e06ba8ee769f38ec67d65bd59ec73f34d94023e81baa1c43510ac86ccd5e6
+  checksum: 10c0/bb1530dcb4e0e5a4fabb219279f2d0bc35796baf66f6241f98b0d03db1985c890a8cafbea268e0edefd5eeda143dbd5c09a54b5fba74cee8c69b98b13194af50
   languageName: node
   linkType: hard
 
@@ -214,10 +208,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emotion/unitless@npm:0.8.0":
-  version: 0.8.0
-  resolution: "@emotion/unitless@npm:0.8.0"
-  checksum: 10c0/1f2cfb7c0ccb83c20b1c6d8d92a74a93da4b2a440f9a0d49ded08647faf299065a2ffde17e1335920fa10397b85f8635bbfe14f3cd29222a59ea81d978478072
+"@emotion/unitless@npm:0.8.1":
+  version: 0.8.1
+  resolution: "@emotion/unitless@npm:0.8.1"
+  checksum: 10c0/a1ed508628288f40bfe6dd17d431ed899c067a899fa293a13afe3aed1d70fac0412b8a215fafab0b42829360db687fecd763e5f01a64ddc4a4b58ec3112ff548
   languageName: node
   linkType: hard
 
@@ -271,40 +265,40 @@ __metadata:
   linkType: hard
 
 "@floating-ui/core@npm:^1.0.0":
-  version: 1.6.0
-  resolution: "@floating-ui/core@npm:1.6.0"
+  version: 1.6.1
+  resolution: "@floating-ui/core@npm:1.6.1"
   dependencies:
-    "@floating-ui/utils": "npm:^0.2.1"
-  checksum: 10c0/667a68036f7dd5ed19442c7792a6002ca02d1799221c4396691bbe0b6008b48f6ccad581225e81fa266bb91232f6c66838a5f825f554217e1ec886178b93381b
+    "@floating-ui/utils": "npm:^0.2.0"
+  checksum: 10c0/7d78b3788d438807d3c1a52477ee1693a29b8a4416dd6e13761427925d9fba1d45c849527752d8fd9776842182d919fddf7ecbc34f3bf2de3bafa1717619a56f
   languageName: node
   linkType: hard
 
-"@floating-ui/dom@npm:^1.6.1":
-  version: 1.6.3
-  resolution: "@floating-ui/dom@npm:1.6.3"
+"@floating-ui/dom@npm:^1.0.0":
+  version: 1.6.5
+  resolution: "@floating-ui/dom@npm:1.6.5"
   dependencies:
     "@floating-ui/core": "npm:^1.0.0"
     "@floating-ui/utils": "npm:^0.2.0"
-  checksum: 10c0/d6cac10877918ce5a8d1a24b21738d2eb130a0191043d7c0dd43bccac507844d3b4dc5d4107d3891d82f6007945ca8fb4207a1252506e91c37e211f0f73cf77e
+  checksum: 10c0/ebdc14806f786e60df8e7cc2c30bf9cd4d75fe734f06d755588bbdef2f60d0a0f21dffb14abdc58dea96e5577e2e366feca6d66ba962018efd1bc91a3ece4526
   languageName: node
   linkType: hard
 
 "@floating-ui/react-dom@npm:^2.0.0":
-  version: 2.0.8
-  resolution: "@floating-ui/react-dom@npm:2.0.8"
+  version: 2.0.9
+  resolution: "@floating-ui/react-dom@npm:2.0.9"
   dependencies:
-    "@floating-ui/dom": "npm:^1.6.1"
+    "@floating-ui/dom": "npm:^1.0.0"
   peerDependencies:
     react: ">=16.8.0"
     react-dom: ">=16.8.0"
-  checksum: 10c0/4d87451e2dcc54b4753a0d81181036e47821cfd0d4c23f7e9c31590c7c91fb15fb0a5a458969a5ddabd61601eca5875ebd4e40bff37cee31f373b8f1ccc64518
+  checksum: 10c0/d8cd1fb2b8a5012ca692d6f677a0af923ef81131f69accea8ce8b5413202ab4c3c79e6eda1446f4dad06a2dfd596ece748c562ba28c289678a856755db4f528f
   languageName: node
   linkType: hard
 
-"@floating-ui/utils@npm:^0.2.0, @floating-ui/utils@npm:^0.2.1":
-  version: 0.2.1
-  resolution: "@floating-ui/utils@npm:0.2.1"
-  checksum: 10c0/ee77756712cf5b000c6bacf11992ffb364f3ea2d0d51cc45197a7e646a17aeb86ea4b192c0b42f3fbb29487aee918a565e84f710b8c3645827767f406a6b4cc9
+"@floating-ui/utils@npm:^0.2.0":
+  version: 0.2.2
+  resolution: "@floating-ui/utils@npm:0.2.2"
+  checksum: 10c0/b2becdcafdf395af1641348da0031ff1eaad2bc60c22e14bd3abad4acfe2c8401e03097173d89a2f646a99b75819a78ef21ebb2572cab0042a56dd654b0065cd
   languageName: node
   linkType: hard
 
@@ -435,81 +429,81 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@next/env@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/env@npm:14.1.4"
-  checksum: 10c0/35f5e817bb47993565bc4b2b9961f9697e0f08b05bc008984de7e89c3626f4ef6db314629a52302786b2f386539005666b7ad56b441e45cc79b0a49835f8062b
+"@next/env@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/env@npm:14.2.3"
+  checksum: 10c0/25ab3ac2739c8e5ce35e1f50373238c5c428ab6b01d448ba78a6068dcdef88978b64f9a92790c324b2926ccc41390a67107154a0b0fee32fe980a485f4ef20d8
   languageName: node
   linkType: hard
 
-"@next/eslint-plugin-next@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/eslint-plugin-next@npm:14.1.4"
+"@next/eslint-plugin-next@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/eslint-plugin-next@npm:14.2.3"
   dependencies:
     glob: "npm:10.3.10"
-  checksum: 10c0/fb49237153bf528ef3939e1ceae0f658e44abcf0ca155d8042c7961f523e4d9aeba3de18532b633734f3b5524b644e9c3c5187089e0d400896c1c35812bbbdd3
+  checksum: 10c0/de9af2c7465cce4eb4cb50654aa2548d4d2af788c8992d02e2b863b1bf4f99e3b6604d1f0775f8e50aca6a53cf30d51f4ac56810d1625d401548267ca5f1d883
   languageName: node
   linkType: hard
 
-"@next/swc-darwin-arm64@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-darwin-arm64@npm:14.1.4"
+"@next/swc-darwin-arm64@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-darwin-arm64@npm:14.2.3"
   conditions: os=darwin & cpu=arm64
   languageName: node
   linkType: hard
 
-"@next/swc-darwin-x64@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-darwin-x64@npm:14.1.4"
+"@next/swc-darwin-x64@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-darwin-x64@npm:14.2.3"
   conditions: os=darwin & cpu=x64
   languageName: node
   linkType: hard
 
-"@next/swc-linux-arm64-gnu@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-linux-arm64-gnu@npm:14.1.4"
+"@next/swc-linux-arm64-gnu@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-linux-arm64-gnu@npm:14.2.3"
   conditions: os=linux & cpu=arm64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@next/swc-linux-arm64-musl@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-linux-arm64-musl@npm:14.1.4"
+"@next/swc-linux-arm64-musl@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-linux-arm64-musl@npm:14.2.3"
   conditions: os=linux & cpu=arm64 & libc=musl
   languageName: node
   linkType: hard
 
-"@next/swc-linux-x64-gnu@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-linux-x64-gnu@npm:14.1.4"
+"@next/swc-linux-x64-gnu@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-linux-x64-gnu@npm:14.2.3"
   conditions: os=linux & cpu=x64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@next/swc-linux-x64-musl@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-linux-x64-musl@npm:14.1.4"
+"@next/swc-linux-x64-musl@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-linux-x64-musl@npm:14.2.3"
   conditions: os=linux & cpu=x64 & libc=musl
   languageName: node
   linkType: hard
 
-"@next/swc-win32-arm64-msvc@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-win32-arm64-msvc@npm:14.1.4"
+"@next/swc-win32-arm64-msvc@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-win32-arm64-msvc@npm:14.2.3"
   conditions: os=win32 & cpu=arm64
   languageName: node
   linkType: hard
 
-"@next/swc-win32-ia32-msvc@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-win32-ia32-msvc@npm:14.1.4"
+"@next/swc-win32-ia32-msvc@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-win32-ia32-msvc@npm:14.2.3"
   conditions: os=win32 & cpu=ia32
   languageName: node
   linkType: hard
 
-"@next/swc-win32-x64-msvc@npm:14.1.4":
-  version: 14.1.4
-  resolution: "@next/swc-win32-x64-msvc@npm:14.1.4"
+"@next/swc-win32-x64-msvc@npm:14.2.3":
+  version: 14.2.3
+  resolution: "@next/swc-win32-x64-msvc@npm:14.2.3"
   conditions: os=win32 & cpu=x64
   languageName: node
   linkType: hard
@@ -555,11 +549,11 @@ __metadata:
   linkType: hard
 
 "@npmcli/fs@npm:^3.1.0":
-  version: 3.1.0
-  resolution: "@npmcli/fs@npm:3.1.0"
+  version: 3.1.1
+  resolution: "@npmcli/fs@npm:3.1.1"
   dependencies:
     semver: "npm:^7.3.5"
-  checksum: 10c0/162b4a0b8705cd6f5c2470b851d1dc6cd228c86d2170e1769d738c1fbb69a87160901411c3c035331e9e99db72f1f1099a8b734bf1637cc32b9a5be1660e4e1e
+  checksum: 10c0/c37a5b4842bfdece3d14dfdb054f73fe15ed2d3da61b34ff76629fb5b1731647c49166fd2a8bf8b56fcfa51200382385ea8909a3cbecdad612310c114d3f6c99
   languageName: node
   linkType: hard
 
@@ -1772,24 +1766,32 @@ __metadata:
   linkType: hard
 
 "@rushstack/eslint-patch@npm:^1.3.3":
-  version: 1.10.1
-  resolution: "@rushstack/eslint-patch@npm:1.10.1"
-  checksum: 10c0/db96bfdf83ededcd70de41876bfe7ecb2450b93e4c5e46bc0f2bc9dd0e0ea60e8bc5fc0d1d3b6addf902e640ea78855ed77b6c883d0d0d104269492141232995
+  version: 1.10.2
+  resolution: "@rushstack/eslint-patch@npm:1.10.2"
+  checksum: 10c0/3712b8994bfed0968d4c4f21ff10bf5f2abb47f47d65d4e616de4311d2f372f2528b03b1d4e0dcaa7392f8626ccdf114e753db4f790e92436fc5a4e52195d181
   languageName: node
   linkType: hard
 
-"@swc/helpers@npm:0.5.2":
-  version: 0.5.2
-  resolution: "@swc/helpers@npm:0.5.2"
+"@swc/counter@npm:^0.1.3":
+  version: 0.1.3
+  resolution: "@swc/counter@npm:0.1.3"
+  checksum: 10c0/8424f60f6bf8694cfd2a9bca45845bce29f26105cda8cf19cdb9fd3e78dc6338699e4db77a89ae449260bafa1cc6bec307e81e7fb96dbf7dcfce0eea55151356
+  languageName: node
+  linkType: hard
+
+"@swc/helpers@npm:0.5.5":
+  version: 0.5.5
+  resolution: "@swc/helpers@npm:0.5.5"
   dependencies:
+    "@swc/counter": "npm:^0.1.3"
     tslib: "npm:^2.4.0"
-  checksum: 10c0/b6fa49bcf6c00571d0eb7837b163f8609960d4d77538160585e27ed167361e9776bd6e5eb9646ffac2fb4d43c58df9ca50dab9d96ab097e6591bc82a75fd1164
+  checksum: 10c0/21a9b9cfe7e00865f9c9f3eb4c1cc5b397143464f7abee76a2c5366e591e06b0155b5aac93fe8269ef8d548df253f6fd931e9ddfc0fd12efd405f90f45506e7d
   languageName: node
   linkType: hard
 
 "@tailwindcss/typography@npm:^0.5.9":
-  version: 0.5.12
-  resolution: "@tailwindcss/typography@npm:0.5.12"
+  version: 0.5.13
+  resolution: "@tailwindcss/typography@npm:0.5.13"
   dependencies:
     lodash.castarray: "npm:^4.4.0"
     lodash.isplainobject: "npm:^4.0.6"
@@ -1797,7 +1799,7 @@ __metadata:
     postcss-selector-parser: "npm:6.0.10"
   peerDependencies:
     tailwindcss: "*"
-  checksum: 10c0/3410b06594b89b5650cd4c985e6b4f48d1ba2cfbe146bb5ea2a2cfc1c9b065cd3ca2215436a814f458936683836f9cf792a8d6341345feccf6fb9910c565c092
+  checksum: 10c0/6c01287e7492c001595cd5a39765f313e48e1d2997ea78823919edabd692300d144c42b6e16dee6e077a683e635b9164ff985d5a0f8eeff7824b2d119151899e
   languageName: node
   linkType: hard
 
@@ -1917,7 +1919,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/mustache@npm:^4.2.3":
+"@types/mustache@npm:^4.2.5":
   version: 4.2.5
   resolution: "@types/mustache@npm:4.2.5"
   checksum: 10c0/624975c39068d47407eadb89628aaff5ef60f3b7a71eef92a254310896a4e90518a01dcf71d95779ab2c986034a6ca5403d22fea237c67ff87f2e2b3fb794ea6
@@ -1925,22 +1927,22 @@ __metadata:
   linkType: hard
 
 "@types/node@npm:*, @types/node@npm:^20":
-  version: 20.12.5
-  resolution: "@types/node@npm:20.12.5"
+  version: 20.12.11
+  resolution: "@types/node@npm:20.12.11"
   dependencies:
     undici-types: "npm:~5.26.4"
-  checksum: 10c0/2da65516fba98f0417620e42bddbe53e144d4782d69cd37f99df2537c6850b9cfbdb8a017f02c61e9a074bcac84f9f3f221b250474ac8c6b95d507a47e8d53f9
+  checksum: 10c0/efaa7b08c50ba6e6982ac7d531ba08d5935539ba76e954807df1ff9382a319ead7e003ccaca5ad7cf33ecf53f212507f7c1f2794bd2ff52df6365fef21f6e1fb
   languageName: node
   linkType: hard
 
-"@types/nprogress@npm:^0.2.2, @types/nprogress@npm:^0.2.3":
+"@types/nprogress@npm:^0.2.3":
   version: 0.2.3
   resolution: "@types/nprogress@npm:0.2.3"
   checksum: 10c0/cac0fe73aca79bc1472a1556f56303df72026f2fcd8dbe311fe84b1f46e454b9040c1e69223d94e3bf156a5986382170c52ebda19aa70f555f1b6855d8f744a6
   languageName: node
   linkType: hard
 
-"@types/papaparse@npm:^5.3.9":
+"@types/papaparse@npm:^5.3.14":
   version: 5.3.14
   resolution: "@types/papaparse@npm:5.3.14"
   dependencies:
@@ -1957,9 +1959,9 @@ __metadata:
   linkType: hard
 
 "@types/prismjs@npm:^1.0.0":
-  version: 1.26.3
-  resolution: "@types/prismjs@npm:1.26.3"
-  checksum: 10c0/3e8a64bcf0ab5f9a47ec2590938c5a8a20ac849b4949a95ed96e73e64cb890fc56e9c9b724286914717458267b28405f965709e1b9f80db5d68817a7ce5a18a9
+  version: 1.26.4
+  resolution: "@types/prismjs@npm:1.26.4"
+  checksum: 10c0/996be7d119779c4cbe66e58342115a12d35a02226dae3aaa4a744c9652d5a3939c93c26182e18156965ac4f93575ebb309c3469c36f52e60ee5c0f8f27e874df
   languageName: node
   linkType: hard
 
@@ -1971,21 +1973,21 @@ __metadata:
   linkType: hard
 
 "@types/react-dom@npm:^18":
-  version: 18.2.24
-  resolution: "@types/react-dom@npm:18.2.24"
+  version: 18.3.0
+  resolution: "@types/react-dom@npm:18.3.0"
   dependencies:
     "@types/react": "npm:*"
-  checksum: 10c0/9ec38e5ab4727c56ef17bd8e938ead88748ba19db314b8d9807714a5cae430f5b799514667b221b4f2dc8d9b4ca17dd1c3da8c41c083c2de9eddcc31bec6b8ff
+  checksum: 10c0/6c90d2ed72c5a0e440d2c75d99287e4b5df3e7b011838cdc03ae5cd518ab52164d86990e73246b9d812eaf02ec351d74e3b4f5bd325bf341e13bf980392fd53b
   languageName: node
   linkType: hard
 
 "@types/react@npm:*, @types/react@npm:^18":
-  version: 18.2.74
-  resolution: "@types/react@npm:18.2.74"
+  version: 18.3.2
+  resolution: "@types/react@npm:18.3.2"
   dependencies:
     "@types/prop-types": "npm:*"
     csstype: "npm:^3.0.2"
-  checksum: 10c0/347e38b4c5dc20d50ff71bf04b7caaef490e5ff695e74a0088a13fbb2a0c5d125a5ecfd142adfa30f0176da0e2734942c91ba61d95ce269c43b3265bd7379361
+  checksum: 10c0/9fb2f1fcf7e889ee4ea7c3c5978df595c66e770e5fd3a245dbdd2589b9b911524c11dab25a6275d8af4e336e4cb5fa850d447884b84c335a187a338c89df99ba
   languageName: node
   linkType: hard
 
@@ -1996,10 +1998,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/stylis@npm:4.2.0":
-  version: 4.2.0
-  resolution: "@types/stylis@npm:4.2.0"
-  checksum: 10c0/c76c13e76ca485f598a13984cfb5e07bb88a851da5bee213587424a5f101f182c74f4f92d633cebf9abcec40ccebb645d600d184b7e4b42793e3eeca8729b110
+"@types/stylis@npm:4.2.5":
+  version: 4.2.5
+  resolution: "@types/stylis@npm:4.2.5"
+  checksum: 10c0/23f5b35a3a04f6bb31a29d404fa1bc8e0035fcaff2356b4047743a057e0c37b2eba7efe14d57dd2b95b398cea3bac294d9c6cd93ed307d8c0b7f5d282224b469
   languageName: node
   linkType: hard
 
@@ -2030,53 +2032,53 @@ __metadata:
   linkType: hard
 
 "@types/webxr@npm:*":
-  version: 0.5.15
-  resolution: "@types/webxr@npm:0.5.15"
-  checksum: 10c0/4d96d6c09e2cc748c8ca5a1c12831c0ee3c7794383055dd720d9257d9fa4f2c1ca12174eef66cb11246be6d6ca626b1b22f96e87ef98f185d291c645a765c9b7
+  version: 0.5.16
+  resolution: "@types/webxr@npm:0.5.16"
+  checksum: 10c0/7df4f693c58dc15a6749f37dcf0d29dc72c8e63dc8a7b8990120b2ab3492ad998e6c23a9d175b34a31ced36612b94658b1d6a25abf26d22c9ef35bdce512bcc9
   languageName: node
   linkType: hard
 
-"@typescript-eslint/parser@npm:^5.4.2 || ^6.0.0":
-  version: 6.21.0
-  resolution: "@typescript-eslint/parser@npm:6.21.0"
+"@typescript-eslint/parser@npm:^5.4.2 || ^6.0.0 || 7.0.0 - 7.2.0":
+  version: 7.2.0
+  resolution: "@typescript-eslint/parser@npm:7.2.0"
   dependencies:
-    "@typescript-eslint/scope-manager": "npm:6.21.0"
-    "@typescript-eslint/types": "npm:6.21.0"
-    "@typescript-eslint/typescript-estree": "npm:6.21.0"
-    "@typescript-eslint/visitor-keys": "npm:6.21.0"
+    "@typescript-eslint/scope-manager": "npm:7.2.0"
+    "@typescript-eslint/types": "npm:7.2.0"
+    "@typescript-eslint/typescript-estree": "npm:7.2.0"
+    "@typescript-eslint/visitor-keys": "npm:7.2.0"
     debug: "npm:^4.3.4"
   peerDependencies:
-    eslint: ^7.0.0 || ^8.0.0
+    eslint: ^8.56.0
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10c0/a8f99820679decd0d115c0af61903fb1de3b1b5bec412dc72b67670bf636de77ab07f2a68ee65d6da7976039bbf636907f9d5ca546db3f0b98a31ffbc225bc7d
+  checksum: 10c0/11ce36c68212fdbf98fc6fd32ba0977d46b645fd669a3f4fdb8be2036225f86ad005b31a66f97097e90517c44c92cf9cc5fb1d6e9647ee2fa125c4af21cdb477
   languageName: node
   linkType: hard
 
-"@typescript-eslint/scope-manager@npm:6.21.0":
-  version: 6.21.0
-  resolution: "@typescript-eslint/scope-manager@npm:6.21.0"
+"@typescript-eslint/scope-manager@npm:7.2.0":
+  version: 7.2.0
+  resolution: "@typescript-eslint/scope-manager@npm:7.2.0"
   dependencies:
-    "@typescript-eslint/types": "npm:6.21.0"
-    "@typescript-eslint/visitor-keys": "npm:6.21.0"
-  checksum: 10c0/eaf868938d811cbbea33e97e44ba7050d2b6892202cea6a9622c486b85ab1cf801979edf78036179a8ba4ac26f1dfdf7fcc83a68c1ff66be0b3a8e9a9989b526
+    "@typescript-eslint/types": "npm:7.2.0"
+    "@typescript-eslint/visitor-keys": "npm:7.2.0"
+  checksum: 10c0/4d088c127e6ba1a7de8567f70684779083be24b48746c3b4a86a0ec7062bca58693ee08482349ad6572a17ada8aa6f26b74d1c7139c8fcf7101fa09a572e0ea6
   languageName: node
   linkType: hard
 
-"@typescript-eslint/types@npm:6.21.0":
-  version: 6.21.0
-  resolution: "@typescript-eslint/types@npm:6.21.0"
-  checksum: 10c0/020631d3223bbcff8a0da3efbdf058220a8f48a3de221563996ad1dcc30d6c08dadc3f7608cc08830d21c0d565efd2db19b557b9528921c78aabb605eef2d74d
+"@typescript-eslint/types@npm:7.2.0":
+  version: 7.2.0
+  resolution: "@typescript-eslint/types@npm:7.2.0"
+  checksum: 10c0/135aae061720185855bea61ea6cfd33f4801d2de57f65e50079bbdb505100f844632aa4e4bdeec9e9e79d29aaddad949178d0e918e41867da6ab4b1390820e33
   languageName: node
   linkType: hard
 
-"@typescript-eslint/typescript-estree@npm:6.21.0":
-  version: 6.21.0
-  resolution: "@typescript-eslint/typescript-estree@npm:6.21.0"
+"@typescript-eslint/typescript-estree@npm:7.2.0":
+  version: 7.2.0
+  resolution: "@typescript-eslint/typescript-estree@npm:7.2.0"
   dependencies:
-    "@typescript-eslint/types": "npm:6.21.0"
-    "@typescript-eslint/visitor-keys": "npm:6.21.0"
+    "@typescript-eslint/types": "npm:7.2.0"
+    "@typescript-eslint/visitor-keys": "npm:7.2.0"
     debug: "npm:^4.3.4"
     globby: "npm:^11.1.0"
     is-glob: "npm:^4.0.3"
@@ -2086,17 +2088,17 @@ __metadata:
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10c0/af1438c60f080045ebb330155a8c9bb90db345d5069cdd5d01b67de502abb7449d6c75500519df829f913a6b3f490ade3e8215279b6bdc63d0fb0ae61034df5f
+  checksum: 10c0/2730bb17730e6f3ca4061f00688a70386a808f5d174fdeb757c3cfa92c455373f69080df33237c1a8970e818af0cea0ae5a083970ed8ba493f3b04458c6f9271
   languageName: node
   linkType: hard
 
-"@typescript-eslint/visitor-keys@npm:6.21.0":
-  version: 6.21.0
-  resolution: "@typescript-eslint/visitor-keys@npm:6.21.0"
+"@typescript-eslint/visitor-keys@npm:7.2.0":
+  version: 7.2.0
+  resolution: "@typescript-eslint/visitor-keys@npm:7.2.0"
   dependencies:
-    "@typescript-eslint/types": "npm:6.21.0"
+    "@typescript-eslint/types": "npm:7.2.0"
     eslint-visitor-keys: "npm:^3.4.1"
-  checksum: 10c0/7395f69739cfa1cb83c1fb2fad30afa2a814756367302fb4facd5893eff66abc807e8d8f63eba94ed3b0fe0c1c996ac9a1680bcbf0f83717acedc3f2bb724fbf
+  checksum: 10c0/2d7467495b2b76f3edb1b3047e97076c2242e7eca6d50bbbdd88219f9ff754dbcb9334a0568fe0ceb4c562823980938bd278aa2ba53da6343e7d99a167924f24
   languageName: node
   linkType: hard
 
@@ -2172,6 +2174,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ajv@npm:^7":
+  version: 7.2.4
+  resolution: "ajv@npm:7.2.4"
+  dependencies:
+    fast-deep-equal: "npm:^3.1.1"
+    json-schema-traverse: "npm:^1.0.0"
+    require-from-string: "npm:^2.0.2"
+    uri-js: "npm:^4.2.2"
+  checksum: 10c0/420b72d7f6af89c7e63e00856b894e16a8a2ea107b2b2a76ff36d8dd05f6d708ab120a8c7cc627983ad1f75c6990363eda7c68f45943635f084de62353ca1c56
+  languageName: node
+  linkType: hard
+
 "ansi-regex@npm:^5.0.1":
   version: 5.0.1
   resolution: "ansi-regex@npm:5.0.1"
@@ -2570,8 +2584,8 @@ __metadata:
   linkType: hard
 
 "cacache@npm:^18.0.0":
-  version: 18.0.2
-  resolution: "cacache@npm:18.0.2"
+  version: 18.0.3
+  resolution: "cacache@npm:18.0.3"
   dependencies:
     "@npmcli/fs": "npm:^3.1.0"
     fs-minipass: "npm:^3.0.0"
@@ -2585,7 +2599,7 @@ __metadata:
     ssri: "npm:^10.0.0"
     tar: "npm:^6.1.11"
     unique-filename: "npm:^3.0.0"
-  checksum: 10c0/7992665305cc251a984f4fdbab1449d50e88c635bc43bf2785530c61d239c61b349e5734461baa461caaee65f040ab14e2d58e694f479c0810cffd181ba5eabc
+  checksum: 10c0/dfda92840bb371fb66b88c087c61a74544363b37a265023223a99965b16a16bbb87661fe4948718d79df6e0cc04e85e62784fbcf1832b2a5e54ff4c46fbb45b7
   languageName: node
   linkType: hard
 
@@ -2624,9 +2638,9 @@ __metadata:
   linkType: hard
 
 "caniuse-lite@npm:^1.0.30001579, caniuse-lite@npm:^1.0.30001587, caniuse-lite@npm:^1.0.30001599":
-  version: 1.0.30001606
-  resolution: "caniuse-lite@npm:1.0.30001606"
-  checksum: 10c0/fc9816f7d073e4f655c00acf9d6625f923e722430545b0aabefb9dc01347f3093608eb18841cf981acbd464fcac918a708908549738a8cd9517a14ac005bf8fc
+  version: 1.0.30001617
+  resolution: "caniuse-lite@npm:1.0.30001617"
+  checksum: 10c0/711702501063968b2807d1a8f40981e66f45eb8962968b4b84c70392dc804cee62845e8e391e9749f78ff41ca48be2a4a7a38620c44af526b5e03bc3c7a1bc0a
   languageName: node
   linkType: hard
 
@@ -2755,9 +2769,9 @@ __metadata:
   linkType: hard
 
 "clsx@npm:^2.0.0, clsx@npm:^2.1.0":
-  version: 2.1.0
-  resolution: "clsx@npm:2.1.0"
-  checksum: 10c0/c09c00ad14f638366ca814097e6cab533dfa1972a358da5b557be487168acbb25b4c1395e89ffa842a8a61ba87a462d2b4885bc9d4f8410b598f3cb339599cdb
+  version: 2.1.1
+  resolution: "clsx@npm:2.1.1"
+  checksum: 10c0/c4c8eb865f8c82baab07e71bfa8897c73454881c4f99d6bc81585aecd7c441746c1399d08363dc096c550cceaf97bd4ce1e8854e1771e9998d9f94c4fe075839
   languageName: node
   linkType: hard
 
@@ -2904,14 +2918,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"csstype@npm:3.1.2":
-  version: 3.1.2
-  resolution: "csstype@npm:3.1.2"
-  checksum: 10c0/32c038af259897c807ac738d9eab16b3d86747c72b09d5c740978e06f067f9b7b1737e1b75e407c7ab1fe1543dc95f20e202b4786aeb1b8d3bdf5d5ce655e6c6
-  languageName: node
-  linkType: hard
-
-"csstype@npm:^3.0.2":
+"csstype@npm:3.1.3, csstype@npm:^3.0.2":
   version: 3.1.3
   resolution: "csstype@npm:3.1.3"
   checksum: 10c0/80c089d6f7e0c5b2bd83cf0539ab41474198579584fa10d86d0cafe0642202343cbc119e076a0b1aece191989477081415d66c9fefbf3c957fc2fc4b7009f248
@@ -3036,7 +3043,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"define-properties@npm:^1.1.3, define-properties@npm:^1.2.0, define-properties@npm:^1.2.1":
+"define-properties@npm:^1.2.0, define-properties@npm:^1.2.1":
   version: 1.2.1
   resolution: "define-properties@npm:1.2.1"
   dependencies:
@@ -3156,37 +3163,37 @@ __metadata:
   linkType: hard
 
 "electron-to-chromium@npm:^1.4.668":
-  version: 1.4.729
-  resolution: "electron-to-chromium@npm:1.4.729"
-  checksum: 10c0/9f093b873a5e02da5fd5db5a1038c3a3f84bd43ff6d0e894280848717e5892953cc814a4ddf1de2acbfa9af4fe356c714f036f39b82d52bc6c8c3aed6e97fbde
+  version: 1.4.763
+  resolution: "electron-to-chromium@npm:1.4.763"
+  checksum: 10c0/8787092e2c237699d145860564635391eb856febad3d2ab171a12c671788d1aee323a42822daf0fc8ee49d615b85776470c97ecf212edeb64794f1ffc171f842
   languageName: node
   linkType: hard
 
 "embla-carousel-react@npm:^8.0.2":
-  version: 8.0.2
-  resolution: "embla-carousel-react@npm:8.0.2"
+  version: 8.0.4
+  resolution: "embla-carousel-react@npm:8.0.4"
   dependencies:
-    embla-carousel: "npm:8.0.2"
-    embla-carousel-reactive-utils: "npm:8.0.2"
+    embla-carousel: "npm:8.0.4"
+    embla-carousel-reactive-utils: "npm:8.0.4"
   peerDependencies:
     react: ^16.8.0 || ^17.0.1 || ^18.0.0
-  checksum: 10c0/7e45266d4251a960515a3283e65454b61e54d6f400f2dee7f56a3ac50532f7ce4735d926494cb1570d81de4bf299c3d1417ab4e64467cda139a7f60b49583757
+  checksum: 10c0/6ef8090e611e33e00e96b32f1350524f6aaabe13741a59311ae8e257e37ae8e8c12fd3857f943fd6b7e210bd5c207c194dea55f50d9930d3ae1e247025d8c5a2
   languageName: node
   linkType: hard
 
-"embla-carousel-reactive-utils@npm:8.0.2":
-  version: 8.0.2
-  resolution: "embla-carousel-reactive-utils@npm:8.0.2"
+"embla-carousel-reactive-utils@npm:8.0.4":
+  version: 8.0.4
+  resolution: "embla-carousel-reactive-utils@npm:8.0.4"
   peerDependencies:
-    embla-carousel: 8.0.2
-  checksum: 10c0/e7e81916971008642700af0b96a59117324214c020759a53feb1d96edb34649329018777dc00b87c631c9d04efd544945f5914dc3cbd5289766a6cdcea253f4e
+    embla-carousel: 8.0.4
+  checksum: 10c0/4178011f8d05e1752d36b90b76254e223534ad2060bf383013f0d58d365bd05475c2f739049d8f651b98345c1b9315b6a4fbca232bed3b103ccee2f78fbb1868
   languageName: node
   linkType: hard
 
-"embla-carousel@npm:8.0.2":
-  version: 8.0.2
-  resolution: "embla-carousel@npm:8.0.2"
-  checksum: 10c0/e63ce4e387c0e227ce211a1131f81c74dbe6c4bb32a5d072e0c1e30774305ca9a30fc86ebb042707bf8d6ec8cb57575628dfa1b18b36dd3206d4774cd34b73bc
+"embla-carousel@npm:8.0.4":
+  version: 8.0.4
+  resolution: "embla-carousel@npm:8.0.4"
+  checksum: 10c0/f20e07d022e6514e2a6429e9e532f96cfdc49a94947c4f3c54f26fd0c99adfd2e41d29d88f9eead74be68a62e6c61f7af2d436b232414906ddb28be96d71f874
   languageName: node
   linkType: hard
 
@@ -3214,12 +3221,12 @@ __metadata:
   linkType: hard
 
 "enhanced-resolve@npm:^5.12.0":
-  version: 5.16.0
-  resolution: "enhanced-resolve@npm:5.16.0"
+  version: 5.16.1
+  resolution: "enhanced-resolve@npm:5.16.1"
   dependencies:
     graceful-fs: "npm:^4.2.4"
     tapable: "npm:^2.2.0"
-  checksum: 10c0/dd69669cbb638ccacefd03e04d5e195ee6a99b7f5f8012f86d2df7781834de357923e06064ea621137c4ce0b37cc12b872b4e6d1ac6ab15fe98e7f1dfbbb08c4
+  checksum: 10c0/57d52625b978f18b32351a03006699de1e3695ce27af936ab4f1f98d3a4c825b219b445910bb4eef398303bbb5f37d7e382f842513d0f3a32614b78f6fd07ab7
   languageName: node
   linkType: hard
 
@@ -3244,7 +3251,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"es-abstract@npm:^1.22.1, es-abstract@npm:^1.22.3, es-abstract@npm:^1.23.0, es-abstract@npm:^1.23.1, es-abstract@npm:^1.23.2":
+"es-abstract@npm:^1.22.1, es-abstract@npm:^1.22.3, es-abstract@npm:^1.23.0, es-abstract@npm:^1.23.1, es-abstract@npm:^1.23.2, es-abstract@npm:^1.23.3":
   version: 1.23.3
   resolution: "es-abstract@npm:1.23.3"
   dependencies:
@@ -3315,12 +3322,12 @@ __metadata:
   linkType: hard
 
 "es-iterator-helpers@npm:^1.0.15, es-iterator-helpers@npm:^1.0.17":
-  version: 1.0.18
-  resolution: "es-iterator-helpers@npm:1.0.18"
+  version: 1.0.19
+  resolution: "es-iterator-helpers@npm:1.0.19"
   dependencies:
     call-bind: "npm:^1.0.7"
     define-properties: "npm:^1.2.1"
-    es-abstract: "npm:^1.23.0"
+    es-abstract: "npm:^1.23.3"
     es-errors: "npm:^1.3.0"
     es-set-tostringtag: "npm:^2.0.3"
     function-bind: "npm:^1.1.2"
@@ -3332,7 +3339,7 @@ __metadata:
     internal-slot: "npm:^1.0.7"
     iterator.prototype: "npm:^1.1.2"
     safe-array-concat: "npm:^1.1.2"
-  checksum: 10c0/93be402e01fa3d8bf62fcadd2fb3055126ffcfe8846911b10b85918ef46775252696c84e6191ec8125bedb61e92242ad1a54a86118436ba19814720cb9ff4aed
+  checksum: 10c0/ae8f0241e383b3d197383b9842c48def7fce0255fb6ed049311b686ce295595d9e389b466f6a1b7d4e7bb92d82f5e716d6fae55e20c1040249bf976743b038c5
   languageName: node
   linkType: hard
 
@@ -3376,7 +3383,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"escalade@npm:^3.1.1":
+"escalade@npm:^3.1.2":
   version: 3.1.2
   resolution: "escalade@npm:3.1.2"
   checksum: 10c0/6b4adafecd0682f3aa1cd1106b8fff30e492c7015b178bc81b2d2f75106dabea6c6d6e8508fc491bd58e597c74abb0e8e2368f943ecb9393d4162e3c2f3cf287
@@ -3405,12 +3412,12 @@ __metadata:
   linkType: hard
 
 "eslint-config-next@npm:^14.1.4":
-  version: 14.1.4
-  resolution: "eslint-config-next@npm:14.1.4"
+  version: 14.2.3
+  resolution: "eslint-config-next@npm:14.2.3"
   dependencies:
-    "@next/eslint-plugin-next": "npm:14.1.4"
+    "@next/eslint-plugin-next": "npm:14.2.3"
     "@rushstack/eslint-patch": "npm:^1.3.3"
-    "@typescript-eslint/parser": "npm:^5.4.2 || ^6.0.0"
+    "@typescript-eslint/parser": "npm:^5.4.2 || ^6.0.0 || 7.0.0 - 7.2.0"
     eslint-import-resolver-node: "npm:^0.3.6"
     eslint-import-resolver-typescript: "npm:^3.5.2"
     eslint-plugin-import: "npm:^2.28.1"
@@ -3423,7 +3430,7 @@ __metadata:
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10c0/05f1108a2192708b4d4dab2bcb454c551bb8af5802c99f7abf98318ade95d52ed9459a03f3fa6498b2d144a0f8e846c27cdc1b23370962da83d22fdfb3d50bde
+  checksum: 10c0/52a3d48bb783d3e8d76a571a3636f658e4789e1a4a51ebbd14d184b7f6f5dd91281b71d99e49a7bb7e3ab32a2dddd321285110005ca0969a471be5ab2e579887
   languageName: node
   linkType: hard
 
@@ -3980,11 +3987,11 @@ __metadata:
   linkType: hard
 
 "get-tsconfig@npm:^4.5.0":
-  version: 4.7.3
-  resolution: "get-tsconfig@npm:4.7.3"
+  version: 4.7.5
+  resolution: "get-tsconfig@npm:4.7.5"
   dependencies:
     resolve-pkg-maps: "npm:^1.0.0"
-  checksum: 10c0/b15ca9d5d0887ebfccadc9fe88b6ff3827a5691ec90e7608a5e9c74bef959c14aba62f6bb88ac7f50322395731789a2cf654244f00e10f4f76349911b6846d6f
+  checksum: 10c0/a917dff2ba9ee187c41945736bf9bbab65de31ce5bc1effd76267be483a7340915cff232199406379f26517d2d0a4edcdbcda8cca599c2480a0f2cf1e1de3efa
   languageName: node
   linkType: hard
 
@@ -4036,17 +4043,17 @@ __metadata:
   linkType: hard
 
 "glob@npm:^10.2.2, glob@npm:^10.3.10":
-  version: 10.3.12
-  resolution: "glob@npm:10.3.12"
+  version: 10.3.15
+  resolution: "glob@npm:10.3.15"
   dependencies:
     foreground-child: "npm:^3.1.0"
     jackspeak: "npm:^2.3.6"
     minimatch: "npm:^9.0.1"
     minipass: "npm:^7.0.4"
-    path-scurry: "npm:^1.10.2"
+    path-scurry: "npm:^1.11.0"
   bin:
     glob: dist/esm/bin.mjs
-  checksum: 10c0/f60cefdc1cf3f958b2bb5823e1b233727f04916d489dc4641d76914f016e6704421e06a83cbb68b0cb1cb9382298b7a88075b844ad2127fc9727ea22b18b0711
+  checksum: 10c0/cda748ddc181b31b3df9548c0991800406d5cc3b3f8110e37a8751ec1e39f37cdae7d7782d5422d7df92775121cdf00599992dff22f7ff1260344843af227c2b
   languageName: node
   linkType: hard
 
@@ -4081,11 +4088,12 @@ __metadata:
   linkType: hard
 
 "globalthis@npm:^1.0.3":
-  version: 1.0.3
-  resolution: "globalthis@npm:1.0.3"
+  version: 1.0.4
+  resolution: "globalthis@npm:1.0.4"
   dependencies:
-    define-properties: "npm:^1.1.3"
-  checksum: 10c0/0db6e9af102a5254630351557ac15e6909bc7459d3e3f6b001e59fe784c96d31108818f032d9095739355a88467459e6488ff16584ee6250cd8c27dec05af4b0
+    define-properties: "npm:^1.2.1"
+    gopd: "npm:^1.0.1"
+  checksum: 10c0/9d156f313af79d80b1566b93e19285f481c591ad6d0d319b4be5e03750d004dde40a39a0f26f7e635f9007a3600802f53ecd85a759b86f109e80a5f705e01846
   languageName: node
   linkType: hard
 
@@ -4982,6 +4990,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"json-schema-traverse@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "json-schema-traverse@npm:1.0.0"
+  checksum: 10c0/71e30015d7f3d6dc1c316d6298047c8ef98a06d31ad064919976583eb61e1018a60a0067338f0f79cabc00d84af3fcc489bd48ce8a46ea165d9541ba17fb30c6
+  languageName: node
+  linkType: hard
+
 "json-stable-stringify-without-jsonify@npm:^1.0.1":
   version: 1.0.1
   resolution: "json-stable-stringify-without-jsonify@npm:1.0.1"
@@ -5265,9 +5280,9 @@ __metadata:
   linkType: hard
 
 "lru-cache@npm:^10.0.1, lru-cache@npm:^10.2.0":
-  version: 10.2.0
-  resolution: "lru-cache@npm:10.2.0"
-  checksum: 10c0/c9847612aa2daaef102d30542a8d6d9b2c2bb36581c1bf0dc3ebf5e5f3352c772a749e604afae2e46873b930a9e9523743faac4e5b937c576ab29196774712ee
+  version: 10.2.2
+  resolution: "lru-cache@npm:10.2.2"
+  checksum: 10c0/402d31094335851220d0b00985084288136136992979d0e015f0f1697e15d1c86052d7d53ae86b614e5b058425606efffc6969a31a091085d7a2b80a8a1e26d6
   languageName: node
   linkType: hard
 
@@ -5313,8 +5328,8 @@ __metadata:
   linkType: hard
 
 "make-fetch-happen@npm:^13.0.0":
-  version: 13.0.0
-  resolution: "make-fetch-happen@npm:13.0.0"
+  version: 13.0.1
+  resolution: "make-fetch-happen@npm:13.0.1"
   dependencies:
     "@npmcli/agent": "npm:^2.0.0"
     cacache: "npm:^18.0.0"
@@ -5325,9 +5340,10 @@ __metadata:
     minipass-flush: "npm:^1.0.5"
     minipass-pipeline: "npm:^1.2.4"
     negotiator: "npm:^0.6.3"
+    proc-log: "npm:^4.2.0"
     promise-retry: "npm:^2.0.1"
     ssri: "npm:^10.0.0"
-  checksum: 10c0/43b9f6dcbc6fe8b8604cb6396957c3698857a15ba4dbc38284f7f0e61f248300585ef1eb8cc62df54e9c724af977e45b5cdfd88320ef7f53e45070ed3488da55
+  checksum: 10c0/df5f4dbb6d98153b751bccf4dc4cc500de85a96a9331db9805596c46aa9f99d9555983954e6c1266d9f981ae37a9e4647f42b9a4bb5466f867f4012e582c9e7e
   languageName: node
   linkType: hard
 
@@ -5557,15 +5573,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"merge-refs@npm:^1.2.1":
-  version: 1.2.2
-  resolution: "merge-refs@npm:1.2.2"
+"merge-refs@npm:^1.3.0":
+  version: 1.3.0
+  resolution: "merge-refs@npm:1.3.0"
   peerDependencies:
-    "@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0
+    "@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
   peerDependenciesMeta:
     "@types/react":
       optional: true
-  checksum: 10c0/edecc14ba90557df94df9a0ebd77540cbd99a894d47e4a73d31afdbcf5b0bab9f371dad6035d676dddad6f6737f87067402fdacba57359239c165705563bf2ce
+  checksum: 10c0/403d20d283a595565a6bef813415df509dad12a5ad157f0ae04861b3aee4a3691971ccae7079e20497d9f367a478ad60e5b63a2ca9ffb2cc3d511284b49b4bd6
   languageName: node
   linkType: hard
 
@@ -5997,8 +6013,8 @@ __metadata:
   linkType: hard
 
 "minipass-fetch@npm:^3.0.0":
-  version: 3.0.4
-  resolution: "minipass-fetch@npm:3.0.4"
+  version: 3.0.5
+  resolution: "minipass-fetch@npm:3.0.5"
   dependencies:
     encoding: "npm:^0.1.13"
     minipass: "npm:^7.0.3"
@@ -6007,7 +6023,7 @@ __metadata:
   dependenciesMeta:
     encoding:
       optional: true
-  checksum: 10c0/1b63c1f3313e88eeac4689f1b71c9f086598db9a189400e3ee960c32ed89e06737fa23976c9305c2d57464fb3fcdc12749d3378805c9d6176f5569b0d0ee8a75
+  checksum: 10c0/9d702d57f556274286fdd97e406fc38a2f5c8d15e158b498d7393b1105974b21249289ec571fa2b51e038a4872bfc82710111cf75fae98c662f3d6f95e72152b
   languageName: node
   linkType: hard
 
@@ -6055,9 +6071,9 @@ __metadata:
   linkType: hard
 
 "minipass@npm:^5.0.0 || ^6.0.2 || ^7.0.0, minipass@npm:^7.0.2, minipass@npm:^7.0.3, minipass@npm:^7.0.4":
-  version: 7.0.4
-  resolution: "minipass@npm:7.0.4"
-  checksum: 10c0/6c7370a6dfd257bf18222da581ba89a5eaedca10e158781232a8b5542a90547540b4b9b7e7f490e4cda43acfbd12e086f0453728ecf8c19e0ef6921bc5958ac5
+  version: 7.1.1
+  resolution: "minipass@npm:7.1.1"
+  checksum: 10c0/fdccc2f99c31083f45f881fd1e6971d798e333e078ab3c8988fb818c470fbd5e935388ad9adb286397eba50baebf46ef8ff487c8d3f455a69c6f3efc327bdff9
   languageName: node
   linkType: hard
 
@@ -6262,20 +6278,20 @@ __metadata:
   linkType: hard
 
 "next@npm:^14.1.4":
-  version: 14.1.4
-  resolution: "next@npm:14.1.4"
+  version: 14.2.3
+  resolution: "next@npm:14.2.3"
   dependencies:
-    "@next/env": "npm:14.1.4"
-    "@next/swc-darwin-arm64": "npm:14.1.4"
-    "@next/swc-darwin-x64": "npm:14.1.4"
-    "@next/swc-linux-arm64-gnu": "npm:14.1.4"
-    "@next/swc-linux-arm64-musl": "npm:14.1.4"
-    "@next/swc-linux-x64-gnu": "npm:14.1.4"
-    "@next/swc-linux-x64-musl": "npm:14.1.4"
-    "@next/swc-win32-arm64-msvc": "npm:14.1.4"
-    "@next/swc-win32-ia32-msvc": "npm:14.1.4"
-    "@next/swc-win32-x64-msvc": "npm:14.1.4"
-    "@swc/helpers": "npm:0.5.2"
+    "@next/env": "npm:14.2.3"
+    "@next/swc-darwin-arm64": "npm:14.2.3"
+    "@next/swc-darwin-x64": "npm:14.2.3"
+    "@next/swc-linux-arm64-gnu": "npm:14.2.3"
+    "@next/swc-linux-arm64-musl": "npm:14.2.3"
+    "@next/swc-linux-x64-gnu": "npm:14.2.3"
+    "@next/swc-linux-x64-musl": "npm:14.2.3"
+    "@next/swc-win32-arm64-msvc": "npm:14.2.3"
+    "@next/swc-win32-ia32-msvc": "npm:14.2.3"
+    "@next/swc-win32-x64-msvc": "npm:14.2.3"
+    "@swc/helpers": "npm:0.5.5"
     busboy: "npm:1.6.0"
     caniuse-lite: "npm:^1.0.30001579"
     graceful-fs: "npm:^4.2.11"
@@ -6283,6 +6299,7 @@ __metadata:
     styled-jsx: "npm:5.1.1"
   peerDependencies:
     "@opentelemetry/api": ^1.1.0
+    "@playwright/test": ^1.41.2
     react: ^18.2.0
     react-dom: ^18.2.0
     sass: ^1.3.0
@@ -6308,26 +6325,27 @@ __metadata:
   peerDependenciesMeta:
     "@opentelemetry/api":
       optional: true
+    "@playwright/test":
+      optional: true
     sass:
       optional: true
   bin:
     next: dist/bin/next
-  checksum: 10c0/7576d7af913f6e24997126b1b13c9bfd0de926ecce72b16944f9f9ba221a3563d3a16b13d7aad7774a428462534afe71879ea0ca5ad80cc9075f08773d13a3b1
+  checksum: 10c0/2c409154720846d07a7a995cc3bfba24b9ee73c87360ce3266528c8a217f5f1ab6f916cffbe1be83509b4e8d7b1d713921bb5c69338b4ecaa57df3212f79a8c5
   languageName: node
   linkType: hard
 
 "nextjs-toploader@npm:^1.6.11":
-  version: 1.6.11
-  resolution: "nextjs-toploader@npm:1.6.11"
+  version: 1.6.12
+  resolution: "nextjs-toploader@npm:1.6.12"
   dependencies:
-    "@types/nprogress": "npm:^0.2.2"
     nprogress: "npm:^0.2.0"
     prop-types: "npm:^15.8.1"
   peerDependencies:
     next: ">= 6.0.0"
     react: ">= 16.0.0"
     react-dom: ">= 16.0.0"
-  checksum: 10c0/02884ceccac931ff158c894e06500207f5407937d7930d133109a6eb395b7fd00f75fa9201d71f7d87bd40e7ff0ee7fa2a4ed1f1e677bd14e4bac1cdf35285a1
+  checksum: 10c0/0ea939842800df92da1844a2bc63a6a2d190d12156b84f758d9117fab47e23809766e6791c3a3f27093656588b09616e8e9d97f17d0555c3ba2b7f48fe1eb7dc
   languageName: node
   linkType: hard
 
@@ -6391,13 +6409,13 @@ __metadata:
   linkType: hard
 
 "nopt@npm:^7.0.0":
-  version: 7.2.0
-  resolution: "nopt@npm:7.2.0"
+  version: 7.2.1
+  resolution: "nopt@npm:7.2.1"
   dependencies:
     abbrev: "npm:^2.0.0"
   bin:
     nopt: bin/nopt.js
-  checksum: 10c0/9bd7198df6f16eb29ff16892c77bcf7f0cc41f9fb5c26280ac0def2cf8cf319f3b821b3af83eba0e74c85807cc430a16efe0db58fe6ae1f41e69519f585b6aff
+  checksum: 10c0/a069c7c736767121242037a22a788863accfa932ab285a1eb569eb8cd534b09d17206f68c37f096ae785647435e0c5a5a0a67b42ec743e481a455e5ae6a6df81
   languageName: node
   linkType: hard
 
@@ -6540,16 +6558,16 @@ __metadata:
   linkType: hard
 
 "optionator@npm:^0.9.1":
-  version: 0.9.3
-  resolution: "optionator@npm:0.9.3"
+  version: 0.9.4
+  resolution: "optionator@npm:0.9.4"
   dependencies:
-    "@aashutoshrathi/word-wrap": "npm:^1.2.3"
     deep-is: "npm:^0.1.3"
     fast-levenshtein: "npm:^2.0.6"
     levn: "npm:^0.4.1"
     prelude-ls: "npm:^1.2.1"
     type-check: "npm:^0.4.0"
-  checksum: 10c0/66fba794d425b5be51353035cf3167ce6cfa049059cbb93229b819167687e0f48d2bc4603fcb21b091c99acb516aae1083624675b15c4765b2e4693a085e959c
+    word-wrap: "npm:^1.2.5"
+  checksum: 10c0/4afb687a059ee65b61df74dfe87d8d6815cd6883cb8b3d5883a910df72d0f5d029821f37025e4bccf4048873dbdb09acc6d303d27b8f76b1a80dd5a7d5334675
   languageName: node
   linkType: hard
 
@@ -6663,13 +6681,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"path-scurry@npm:^1.10.1, path-scurry@npm:^1.10.2":
-  version: 1.10.2
-  resolution: "path-scurry@npm:1.10.2"
+"path-scurry@npm:^1.10.1, path-scurry@npm:^1.11.0":
+  version: 1.11.1
+  resolution: "path-scurry@npm:1.11.1"
   dependencies:
     lru-cache: "npm:^10.2.0"
     minipass: "npm:^5.0.0 || ^6.0.2 || ^7.0.0"
-  checksum: 10c0/d723777fbf9627f201e64656680f66ebd940957eebacf780e6cce1c2919c29c116678b2d7dbf8821b3a2caa758d125f4444005ccec886a25c8f324504e48e601
+  checksum: 10c0/32a13711a2a505616ae1cc1b5076801e453e7aae6ac40ab55b388bb91b9d0547a52f5aaceff710ea400205f18691120d4431e520afbe4266b836fadede15872d
   languageName: node
   linkType: hard
 
@@ -6859,7 +6877,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"postcss@npm:^8.4.23, postcss@npm:^8.4.38":
+"postcss@npm:8.4.38, postcss@npm:^8.4.23, postcss@npm:^8.4.38":
   version: 8.4.38
   resolution: "postcss@npm:8.4.38"
   dependencies:
@@ -6947,6 +6965,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"proc-log@npm:^4.2.0":
+  version: 4.2.0
+  resolution: "proc-log@npm:4.2.0"
+  checksum: 10c0/17db4757c2a5c44c1e545170e6c70a26f7de58feb985091fb1763f5081cab3d01b181fb2dd240c9f4a4255a1d9227d163d5771b7e69c9e49a561692db865efb9
+  languageName: node
+  linkType: hard
+
 "promise-retry@npm:^2.0.1":
   version: 2.0.1
   resolution: "promise-retry@npm:2.0.1"
@@ -6957,7 +6982,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"prop-types@npm:^15.0.0, prop-types@npm:^15.6.2, prop-types@npm:^15.7.2, prop-types@npm:^15.8.1":
+"prop-types@npm:^15.0.0, prop-types@npm:^15.7.2, prop-types@npm:^15.8.1":
   version: 15.8.1
   resolution: "prop-types@npm:15.8.1"
   dependencies:
@@ -6990,11 +7015,11 @@ __metadata:
   linkType: hard
 
 "qs@npm:^6.7.0":
-  version: 6.12.0
-  resolution: "qs@npm:6.12.0"
+  version: 6.12.1
+  resolution: "qs@npm:6.12.1"
   dependencies:
     side-channel: "npm:^1.0.6"
-  checksum: 10c0/e165a77ac5f3ca60c15c5f3d51b321ddec7aa438804436b29d160117bc6fb7bf7dab94abd0c7d7c0785890d3a75ae41e1d6346e158aaf1540c6fe53a31f11675
+  checksum: 10c0/439e6d7c6583e7c69f2cab2c39c55b97db7ce576e4c7c469082b938b7fc8746e8d547baacb69b4cd2b6666484776c3f4840ad7163a4c5326300b0afa0acdd84b
   languageName: node
   linkType: hard
 
@@ -7035,24 +7060,24 @@ __metadata:
   linkType: hard
 
 "react-day-picker@npm:^8.10.0":
-  version: 8.10.0
-  resolution: "react-day-picker@npm:8.10.0"
+  version: 8.10.1
+  resolution: "react-day-picker@npm:8.10.1"
   peerDependencies:
     date-fns: ^2.28.0 || ^3.0.0
     react: ^16.8.0 || ^17.0.0 || ^18.0.0
-  checksum: 10c0/e9868aced1e40b4cb7d6cf8d50e250226b38ec7ebea944b65aa9db20a0f36d0581b8a501297d09dcbf2d812de852168952b3fb27990915381629d6e314c2a4d8
+  checksum: 10c0/a0ff28c4b61b3882e6a825b19e5679e2fdf3256cf1be8eb0a0c028949815c1ae5a6561474c2c19d231c010c8e0e0b654d3a322610881e0655abca05a2e03d9df
   languageName: node
   linkType: hard
 
 "react-dom@npm:^18":
-  version: 18.2.0
-  resolution: "react-dom@npm:18.2.0"
+  version: 18.3.1
+  resolution: "react-dom@npm:18.3.1"
   dependencies:
     loose-envify: "npm:^1.1.0"
-    scheduler: "npm:^0.23.0"
+    scheduler: "npm:^0.23.2"
   peerDependencies:
-    react: ^18.2.0
-  checksum: 10c0/66dfc5f93e13d0674e78ef41f92ed21dfb80f9c4ac4ac25a4b51046d41d4d2186abc915b897f69d3d0ebbffe6184e7c5876f2af26bfa956f179225d921be713a
+    react: ^18.3.1
+  checksum: 10c0/a752496c1941f958f2e8ac56239172296fcddce1365ce45222d04a1947e0cc5547df3e8447f855a81d6d39f008d7c32eab43db3712077f09e3f67c4874973e85
   languageName: node
   linkType: hard
 
@@ -7077,11 +7102,11 @@ __metadata:
   linkType: hard
 
 "react-hook-form@npm:^7.51.2":
-  version: 7.51.2
-  resolution: "react-hook-form@npm:7.51.2"
+  version: 7.51.4
+  resolution: "react-hook-form@npm:7.51.4"
   peerDependencies:
     react: ^16.8.0 || ^17 || ^18
-  checksum: 10c0/9d5e303b64f77330f244304854522e4f588fd3a5554734d2daebf64230195eb42c44504e074d5acfabd6f33a2272ffca4ebef7a54fad7019ae519471b720327e
+  checksum: 10c0/73b585adb80bd99ae1fc21208e389fd9830f82c8c8bab4b6c4d5853f858a3259b8dc8fd4aa4608a0bd95bc69883c9332f2fa5e8c80dc17dbb2866de9744dbdb6
   languageName: node
   linkType: hard
 
@@ -7105,9 +7130,9 @@ __metadata:
   linkType: hard
 
 "react-is@npm:^18.0.0, react-is@npm:^18.2.0":
-  version: 18.2.0
-  resolution: "react-is@npm:18.2.0"
-  checksum: 10c0/6eb5e4b28028c23e2bfcf73371e72cd4162e4ac7ab445ddae2afe24e347a37d6dc22fae6e1748632cd43c6d4f9b8f86dcf26bf9275e1874f436d129952528ae0
+  version: 18.3.1
+  resolution: "react-is@npm:18.3.1"
+  checksum: 10c0/f2f1e60010c683479e74c63f96b09fb41603527cd131a9959e2aee1e5a8b0caf270b365e5ca77d4a6b18aae659b60a86150bb3979073528877029b35aecd2072
   languageName: node
   linkType: hard
 
@@ -7137,32 +7162,32 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-pdf@npm:7.5.0":
-  version: 7.5.0
-  resolution: "react-pdf@npm:7.5.0"
+"react-pdf@npm:latest":
+  version: 8.0.2
+  resolution: "react-pdf@npm:8.0.2"
   dependencies:
     clsx: "npm:^2.0.0"
+    dequal: "npm:^2.0.3"
     make-cancellable-promise: "npm:^1.3.1"
     make-event-props: "npm:^1.6.0"
-    merge-refs: "npm:^1.2.1"
+    merge-refs: "npm:^1.3.0"
     pdfjs-dist: "npm:3.11.174"
-    prop-types: "npm:^15.6.2"
     tiny-invariant: "npm:^1.0.0"
-    tiny-warning: "npm:^1.0.0"
+    warning: "npm:^4.0.0"
   peerDependencies:
-    "@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0
-    react: ^16.8.0 || ^17.0.0 || ^18.0.0
-    react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    "@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+    react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
   peerDependenciesMeta:
     "@types/react":
       optional: true
-  checksum: 10c0/4f0cab3d0749d00dcebb6a836d6a8f6716da706bd9ad1461a2d0616d3cf6637ce542f246cb52a2d9614e18b19780397ffcd2767a3bc7e15b8319132eb80fdc64
+  checksum: 10c0/83064e77030207bf4a7c80e24968c8957c9dedccadbf6f8e28b1a28166d9b7aa6cc473dc31bddcc57660d636756db763a39c0fdf1bc0d4cea49ffc3bb0f5d1d1
   languageName: node
   linkType: hard
 
 "react-player@npm:^2.13.0":
-  version: 2.15.1
-  resolution: "react-player@npm:2.15.1"
+  version: 2.16.0
+  resolution: "react-player@npm:2.16.0"
   dependencies:
     deepmerge: "npm:^4.0.0"
     load-script: "npm:^1.0.0"
@@ -7171,7 +7196,7 @@ __metadata:
     react-fast-compare: "npm:^3.0.1"
   peerDependencies:
     react: ">=16.6.0"
-  checksum: 10c0/0d17002c08b333cfc9844d762e6cb064c992f4b58088895af6a445a6850f48a318fb39c54a5e0e3bc5c5d7027c76a8d8ed796a0fa723c011450634ba2ff881ca
+  checksum: 10c0/ee0f4cd3bd468b28af38dbbb65cae1659218153956f43c0bdd15cd8b38aaaf151deec43b93b7dd887c0ac28242a4ba7e9d01823351e78ba60ae04d5fb51defb4
   languageName: node
   linkType: hard
 
@@ -7225,12 +7250,12 @@ __metadata:
   linkType: hard
 
 "react-resizable-panels@npm:^2.0.16":
-  version: 2.0.16
-  resolution: "react-resizable-panels@npm:2.0.16"
+  version: 2.0.19
+  resolution: "react-resizable-panels@npm:2.0.19"
   peerDependencies:
     react: ^16.14.0 || ^17.0.0 || ^18.0.0
     react-dom: ^16.14.0 || ^17.0.0 || ^18.0.0
-  checksum: 10c0/91e125a10de5908cdca9c82247106927a98a2686097cca5aa31415d3ba7013425f3b3c10f1465eadcc6a4977a2d549cabadb71c58586cddfae4995c8bb575ace
+  checksum: 10c0/eb9cb511aec917895dba842cb933c9885ea510f752b4f3b8c358bf33be8b7b6bf2fc4a81db7a16977e6b09f614a14c6652f15232ff03bce68a8845dcf179abf7
   languageName: node
   linkType: hard
 
@@ -7264,11 +7289,11 @@ __metadata:
   linkType: hard
 
 "react@npm:^18":
-  version: 18.2.0
-  resolution: "react@npm:18.2.0"
+  version: 18.3.1
+  resolution: "react@npm:18.3.1"
   dependencies:
     loose-envify: "npm:^1.1.0"
-  checksum: 10c0/b562d9b569b0cb315e44b48099f7712283d93df36b19a39a67c254c6686479d3980b7f013dc931f4a5a3ae7645eae6386b4aa5eea933baa54ecd0f9acb0902b8
+  checksum: 10c0/283e8c5efcf37802c9d1ce767f302dd569dd97a70d9bb8c7be79a789b9902451e0d16334b05d73299b20f048cbc3c7d288bbbde10b701fa194e2089c237dbea3
   languageName: node
   linkType: hard
 
@@ -7481,6 +7506,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"require-from-string@npm:^2.0.2":
+  version: 2.0.2
+  resolution: "require-from-string@npm:2.0.2"
+  checksum: 10c0/aaa267e0c5b022fc5fd4eef49d8285086b15f2a1c54b28240fdf03599cbd9c26049fee3eab894f2e1f6ca65e513b030a7c264201e3f005601e80c49fb2937ce2
+  languageName: node
+  linkType: hard
+
 "resolve-from@npm:^4.0.0":
   version: 4.0.0
   resolution: "resolve-from@npm:4.0.0"
@@ -7627,12 +7659,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"scheduler@npm:^0.23.0":
-  version: 0.23.0
-  resolution: "scheduler@npm:0.23.0"
+"scheduler@npm:^0.23.2":
+  version: 0.23.2
+  resolution: "scheduler@npm:0.23.2"
   dependencies:
     loose-envify: "npm:^1.1.0"
-  checksum: 10c0/b777f7ca0115e6d93e126ac490dbd82642d14983b3079f58f35519d992fa46260be7d6e6cede433a92db70306310c6f5f06e144f0e40c484199e09c1f7be53dd
+  checksum: 10c0/26383305e249651d4c58e6705d5f8425f153211aef95f15161c151f7b8de885f24751b377e4a0b3dd42cce09aad3f87a61dab7636859c0d89b7daf1a1e2a5c78
   languageName: node
   linkType: hard
 
@@ -7646,13 +7678,11 @@ __metadata:
   linkType: hard
 
 "semver@npm:^7.3.5, semver@npm:^7.5.4":
-  version: 7.6.0
-  resolution: "semver@npm:7.6.0"
-  dependencies:
-    lru-cache: "npm:^6.0.0"
+  version: 7.6.2
+  resolution: "semver@npm:7.6.2"
   bin:
     semver: bin/semver.js
-  checksum: 10c0/fbfe717094ace0aa8d6332d7ef5ce727259815bd8d8815700853f4faf23aacbd7192522f0dc5af6df52ef4fa85a355ebd2f5d39f554bd028200d6cf481ab9b53
+  checksum: 10c0/97d3441e97ace8be4b1976433d1c32658f6afaff09f143e52c593bae7eef33de19e3e369c88bd985ce1042c6f441c80c6803078d1de2a9988080b66684cbb30c
   languageName: node
   linkType: hard
 
@@ -7782,12 +7812,12 @@ __metadata:
   linkType: hard
 
 "socks@npm:^2.7.1":
-  version: 2.8.1
-  resolution: "socks@npm:2.8.1"
+  version: 2.8.3
+  resolution: "socks@npm:2.8.3"
   dependencies:
     ip-address: "npm:^9.0.5"
     smart-buffer: "npm:^4.2.0"
-  checksum: 10c0/ac77b515c260473cc7c4452f09b20939e22510ce3ae48385c516d1d5784374d5cc75be3cb18ff66cc985a7f4f2ef8fef84e984c5ec70aad58355ed59241f40a8
+  checksum: 10c0/d54a52bf9325165770b674a67241143a3d8b4e4c8884560c4e0e078aace2a728dffc7f70150660f51b85797c4e1a3b82f9b7aa25e0a0ceae1a243365da5c51a7
   languageName: node
   linkType: hard
 
@@ -7830,11 +7860,11 @@ __metadata:
   linkType: hard
 
 "ssri@npm:^10.0.0":
-  version: 10.0.5
-  resolution: "ssri@npm:10.0.5"
+  version: 10.0.6
+  resolution: "ssri@npm:10.0.6"
   dependencies:
     minipass: "npm:^7.0.3"
-  checksum: 10c0/b091f2ae92474183c7ac5ed3f9811457e1df23df7a7e70c9476eaa9a0c4a0c8fc190fb45acefbf023ca9ee864dd6754237a697dc52a0fb182afe65d8e77443d8
+  checksum: 10c0/e5a1e23a4057a86a97971465418f22ea89bd439ac36ade88812dd920e4e61873e8abd6a9b72a03a67ef50faa00a2daf1ab745c5a15b46d03e0544a0296354227
   languageName: node
   linkType: hard
 
@@ -7971,23 +8001,23 @@ __metadata:
   languageName: node
   linkType: hard
 
-"styled-components@npm:^6.0.8":
-  version: 6.1.8
-  resolution: "styled-components@npm:6.1.8"
+"styled-components@npm:^6.1.11":
+  version: 6.1.11
+  resolution: "styled-components@npm:6.1.11"
   dependencies:
-    "@emotion/is-prop-valid": "npm:1.2.1"
-    "@emotion/unitless": "npm:0.8.0"
-    "@types/stylis": "npm:4.2.0"
+    "@emotion/is-prop-valid": "npm:1.2.2"
+    "@emotion/unitless": "npm:0.8.1"
+    "@types/stylis": "npm:4.2.5"
     css-to-react-native: "npm:3.2.0"
-    csstype: "npm:3.1.2"
-    postcss: "npm:8.4.31"
+    csstype: "npm:3.1.3"
+    postcss: "npm:8.4.38"
     shallowequal: "npm:1.1.0"
-    stylis: "npm:4.3.1"
-    tslib: "npm:2.5.0"
+    stylis: "npm:4.3.2"
+    tslib: "npm:2.6.2"
   peerDependencies:
     react: ">= 16.8.0"
     react-dom: ">= 16.8.0"
-  checksum: 10c0/fafe4b9198d5d7980c2358821d1a89f86200d55c8eec03670cf12cf43b8a05a77eafaf0872cd85821f68238308e0f5c9d9aa43a62e6987c65b70baa2c3277ab8
+  checksum: 10c0/1d149a51d24f779bba700c8c23ec0538b2d2b57745ccd49d1cfdc2dfce8bcea21e8ff81fed1143d1b35d127cc591717a398da72ea6671abbf705432b13e59e56
   languageName: node
   linkType: hard
 
@@ -8007,10 +8037,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"stylis@npm:4.3.1":
-  version: 4.3.1
-  resolution: "stylis@npm:4.3.1"
-  checksum: 10c0/33e8ebd2bfa5f0bd0215f718dc2d3be896e1d00c5bcaeb9a4ae03cf239db6867af9eee230f57229bf1c29499357073ba3e6b547484ba1db2f5de1e8be7d4eee9
+"stylis@npm:4.3.2":
+  version: 4.3.2
+  resolution: "stylis@npm:4.3.2"
+  checksum: 10c0/0410e1404cbeee3388a9e17587875211ce2f014c8379af0d1e24ca55878867c9f1ccc7b0ce9a156ca53f5d6e301391a82b0645522a604674a378b3189a4a1994
   languageName: node
   linkType: hard
 
@@ -8058,11 +8088,11 @@ __metadata:
   linkType: hard
 
 "tailwind-merge@npm:^2.2.2":
-  version: 2.2.2
-  resolution: "tailwind-merge@npm:2.2.2"
+  version: 2.3.0
+  resolution: "tailwind-merge@npm:2.3.0"
   dependencies:
-    "@babel/runtime": "npm:^7.24.0"
-  checksum: 10c0/68a5e199848a467aed4f8d1a8d7b6a5b583ff72f1d2801e018bf245eaa41e6564b63ead9e2b708a214cefbd843970c5e0a21754d5f2a20e2c1238e25955685ce
+    "@babel/runtime": "npm:^7.24.1"
+  checksum: 10c0/5ea308e23c3ab1cf4c3f35f0a471753f4d3ed232d63dd7c09151a74428737321902203d90e9f0cb76ea5c3978e71b0adbc503dc455e56cda967a7674ae4b94b5
   languageName: node
   linkType: hard
 
@@ -8161,13 +8191,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tiny-warning@npm:^1.0.0":
-  version: 1.0.3
-  resolution: "tiny-warning@npm:1.0.3"
-  checksum: 10c0/ef8531f581b30342f29670cb41ca248001c6fd7975ce22122bd59b8d62b4fc84ad4207ee7faa95cde982fa3357cd8f4be650142abc22805538c3b1392d7084fa
-  languageName: node
-  linkType: hard
-
 "to-fast-properties@npm:^2.0.0":
   version: 2.0.0
   resolution: "to-fast-properties@npm:2.0.0"
@@ -8233,14 +8256,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tslib@npm:2.5.0":
-  version: 2.5.0
-  resolution: "tslib@npm:2.5.0"
-  checksum: 10c0/e32fc99cc730dd514e53c44e668d76016e738f0bcc726aad5dbd2d335cf19b87a95a9b1e4f0a9993e370f1d702b5e471cdd4acabcac428a3099d496b9af2021e
-  languageName: node
-  linkType: hard
-
-"tslib@npm:^2.0.0, tslib@npm:^2.1.0, tslib@npm:^2.4.0":
+"tslib@npm:2.6.2, tslib@npm:^2.0.0, tslib@npm:^2.1.0, tslib@npm:^2.4.0":
   version: 2.6.2
   resolution: "tslib@npm:2.6.2"
   checksum: 10c0/e03a8a4271152c8b26604ed45535954c0a45296e32445b4b87f8a5abdb2421f40b59b4ca437c4346af0f28179780d604094eb64546bee2019d903d01c6c19bdb
@@ -8316,22 +8332,22 @@ __metadata:
   linkType: hard
 
 "typescript@npm:^5":
-  version: 5.4.4
-  resolution: "typescript@npm:5.4.4"
+  version: 5.4.5
+  resolution: "typescript@npm:5.4.5"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 10c0/4d8de0291204ed61ca97ad0cba2ce064e09c4988ca1c451c787e4653ba76296ba35177a52694e8a00cf4ef899d0ee83338663b926d8b7d55167ff0ba81549999
+  checksum: 10c0/2954022ada340fd3d6a9e2b8e534f65d57c92d5f3989a263754a78aba549f7e6529acc1921913560a4b816c46dce7df4a4d29f9f11a3dc0d4213bb76d043251e
   languageName: node
   linkType: hard
 
 "typescript@patch:typescript@npm%3A^5#optional!builtin<compat/typescript>":
-  version: 5.4.4
-  resolution: "typescript@patch:typescript@npm%3A5.4.4#optional!builtin<compat/typescript>::version=5.4.4&hash=5adc0c"
+  version: 5.4.5
+  resolution: "typescript@patch:typescript@npm%3A5.4.5#optional!builtin<compat/typescript>::version=5.4.5&hash=5adc0c"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 10c0/1fa41b9964a9ff0ed913b339c90b46031b2d2da3cb1a192af516610733f7f1d5f7f9754a8e22b9ac7076d3d8aedd2c4f84db3f113bad060eac3a95962443a1bf
+  checksum: 10c0/db2ad2a16ca829f50427eeb1da155e7a45e598eec7b086d8b4e8ba44e5a235f758e606d681c66992230d3fc3b8995865e5fd0b22a2c95486d0b3200f83072ec9
   languageName: node
   linkType: hard
 
@@ -8517,16 +8533,16 @@ __metadata:
   linkType: hard
 
 "update-browserslist-db@npm:^1.0.13":
-  version: 1.0.13
-  resolution: "update-browserslist-db@npm:1.0.13"
+  version: 1.0.15
+  resolution: "update-browserslist-db@npm:1.0.15"
   dependencies:
-    escalade: "npm:^3.1.1"
+    escalade: "npm:^3.1.2"
     picocolors: "npm:^1.0.0"
   peerDependencies:
     browserslist: ">= 4.21.0"
   bin:
     update-browserslist-db: cli.js
-  checksum: 10c0/e52b8b521c78ce1e0c775f356cd16a9c22c70d25f3e01180839c407a5dc787fb05a13f67560cbaf316770d26fa99f78f1acd711b1b54a4f35d4820d4ea7136e6
+  checksum: 10c0/c5f67dc68aba9a37701a14199e57e22f20c579411d386f47b4d81f6e3f06fd3ec256310594f4f9d6b01bc1cfb93cb1ebb1a1da70c4fa28720bc1d030f55bb8a1
   languageName: node
   linkType: hard
 
@@ -8624,14 +8640,14 @@ __metadata:
   linkType: hard
 
 "vaul@npm:^0.9.0":
-  version: 0.9.0
-  resolution: "vaul@npm:0.9.0"
+  version: 0.9.1
+  resolution: "vaul@npm:0.9.1"
   dependencies:
     "@radix-ui/react-dialog": "npm:^1.0.4"
   peerDependencies:
     react: ^16.8 || ^17.0 || ^18.0
     react-dom: ^16.8 || ^17.0 || ^18.0
-  checksum: 10c0/3b4290f7bbc984c7ab3784e6b5a16f6cd2f380798d8c0d1a01818f215f473ecefc6a3f5ccf6724107282a9ceb1a7f8fce8f841ae3eb70cc63b23776bd42fd9e7
+  checksum: 10c0/33fc4ab9554acdcb218fb5048f270607aaa3eb58909cf2e4300c1bca8ba8b989845500b9f116e62fde8d3f56a26e42bdd722a1e7fcd5a074a480b86d11612005
   languageName: node
   linkType: hard
 
@@ -8688,7 +8704,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"warning@npm:^4.0.2":
+"warning@npm:^4.0.0, warning@npm:^4.0.2":
   version: 4.0.3
   resolution: "warning@npm:4.0.3"
   dependencies:
@@ -8810,6 +8826,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"word-wrap@npm:^1.2.5":
+  version: 1.2.5
+  resolution: "word-wrap@npm:1.2.5"
+  checksum: 10c0/e0e4a1ca27599c92a6ca4c32260e8a92e8a44f4ef6ef93f803f8ed823f486e0889fc0b93be4db59c8d51b3064951d25e43d434e95dc8c960cc3a63d65d00ba20
+  languageName: node
+  linkType: hard
+
 "wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
   version: 7.0.0
   resolution: "wrap-ansi@npm:7.0.0"
@@ -8847,11 +8870,11 @@ __metadata:
   linkType: hard
 
 "yaml@npm:^2.3.4":
-  version: 2.4.1
-  resolution: "yaml@npm:2.4.1"
+  version: 2.4.2
+  resolution: "yaml@npm:2.4.2"
   bin:
     yaml: bin.mjs
-  checksum: 10c0/816057dbaea16a7dfb0b868ace930f143dece96bbb4c4fbb6f38aa389166f897240d9fa535dbfd6b1b0d9442416f4abcc698e63f82394d0c67b329aa6c2be576
+  checksum: 10c0/280ddb2e43ffa7d91a95738e80c8f33e860749cdc25aa6d9e4d350a28e174fd7e494e4aa023108aaee41388e451e3dc1292261d8f022aabcf90df9c63d647549
   languageName: node
   linkType: hard
 
@@ -8863,9 +8886,9 @@ __metadata:
   linkType: hard
 
 "zod@npm:^3.22.4":
-  version: 3.22.4
-  resolution: "zod@npm:3.22.4"
-  checksum: 10c0/7578ab283dac0eee66a0ad0fc4a7f28c43e6745aadb3a529f59a4b851aa10872b3890398b3160f257f4b6817b4ce643debdda4fb21a2c040adda7862cab0a587
+  version: 3.23.8
+  resolution: "zod@npm:3.23.8"
+  checksum: 10c0/8f14c87d6b1b53c944c25ce7a28616896319d95bc46a9660fe441adc0ed0a81253b02b5abdaeffedbeb23bdd25a0bf1c29d2c12dd919aef6447652dd295e3e69
   languageName: node
   linkType: hard
 

From 356c8fc3e9ca79d67225b4cd7e8ac74ef2b67819 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Sat, 18 May 2024 15:19:07 +0700
Subject: [PATCH 16/20] chore: prettier format

---
 src/app/highlight.css                  | 9 ++-------
 src/components/Explorer/Actions.tsx    | 7 +++----
 src/components/Explorer/Layout.tsx     | 5 ++---
 src/components/Layout/Navbar.tsx       | 3 +--
 src/components/Layout/NotFound.tsx     | 3 +--
 src/components/Layout/Password.tsx     | 3 +--
 src/components/Preview/Document.tsx    | 3 +--
 src/components/Preview/Image.tsx       | 3 +--
 src/components/Preview/Information.tsx | 3 +--
 src/components/Preview/Manga.tsx       | 3 +--
 src/components/Preview/Rich.tsx        | 3 +--
 11 files changed, 15 insertions(+), 30 deletions(-)

diff --git a/src/app/highlight.css b/src/app/highlight.css
index cf8359e..54e65c1 100644
--- a/src/app/highlight.css
+++ b/src/app/highlight.css
@@ -204,10 +204,7 @@ pre {
   color: var(--hue-3);
 }
 
-.language-javascript
-  .token.template-string
-  > .token.interpolation
-  > .token.interpolation-punctuation.punctuation {
+.language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation {
   color: var(--hue-5-2);
 }
 
@@ -335,9 +332,7 @@ div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus {
 
 /* Hovering over a linkable line number (in the gutter area) */
 /* Requires Line Numbers plugin as well */
-pre[id].linkable-line-numbers.linkable-line-numbers
-  span.line-numbers-rows
-  > span:hover:before {
+pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before {
   background-color: var(--syntax-cursor-line);
 }
 
diff --git a/src/components/Explorer/Actions.tsx b/src/components/Explorer/Actions.tsx
index 4c9c950..da9daf1 100644
--- a/src/components/Explorer/Actions.tsx
+++ b/src/components/Explorer/Actions.tsx
@@ -29,14 +29,13 @@ import { Input } from "~/components/ui/input";
 import { Separator } from "~/components/ui/separator";
 import { Skeleton } from "~/components/ui/skeleton";
 
-import { bytesToReadable } from "~/utils/bytesFormat";
-import { cn } from "~/utils/cn";
-import { getPreviewIcon } from "~/utils/previewHelper";
-
 import { LayoutContext } from "~/context/layoutContext";
 import useLoading from "~/hooks/useLoading";
 import useMediaQuery from "~/hooks/useMediaQuery";
 import useRouter from "~/hooks/usePRouter";
+import { bytesToReadable } from "~/utils/bytesFormat";
+import { cn } from "~/utils/cn";
+import { getPreviewIcon } from "~/utils/previewHelper";
 
 import { Schema_File } from "~/types/schema";
 
diff --git a/src/components/Explorer/Layout.tsx b/src/components/Explorer/Layout.tsx
index 0236238..35d547c 100644
--- a/src/components/Explorer/Layout.tsx
+++ b/src/components/Explorer/Layout.tsx
@@ -10,11 +10,10 @@ import { Grid, List } from "~/components/Explorer";
 import { ButtonLoading, Icon, Loader, Status } from "~/components/Global";
 import { Button } from "~/components/ui/button";
 
-import { cn } from "~/utils/cn";
-import { decryptData } from "~/utils/encryptionHelper";
-
 import { LayoutContext } from "~/context/layoutContext";
 import useLoading from "~/hooks/useLoading";
+import { cn } from "~/utils/cn";
+import { decryptData } from "~/utils/encryptionHelper";
 
 import { ButtonState, Schema_File } from "~/types/schema";
 
diff --git a/src/components/Layout/Navbar.tsx b/src/components/Layout/Navbar.tsx
index 60cf708..665e325 100644
--- a/src/components/Layout/Navbar.tsx
+++ b/src/components/Layout/Navbar.tsx
@@ -37,9 +37,8 @@ import { Separator } from "~/components/ui/separator";
 import { Sheet, SheetContent, SheetFooter, SheetTrigger } from "~/components/ui/sheet";
 import { Tooltip, TooltipContent, TooltipTrigger } from "~/components/ui/tooltip";
 
-import { cn } from "~/utils/cn";
-
 import useMediaQuery from "~/hooks/useMediaQuery";
+import { cn } from "~/utils/cn";
 
 import { ClearPassword } from "actions";
 import config from "config";
diff --git a/src/components/Layout/NotFound.tsx b/src/components/Layout/NotFound.tsx
index 6471214..25ea8bc 100644
--- a/src/components/Layout/NotFound.tsx
+++ b/src/components/Layout/NotFound.tsx
@@ -3,9 +3,8 @@
 import { Status } from "~/components/Global";
 import { Button } from "~/components/ui/button";
 
-import { cn } from "~/utils/cn";
-
 import useRouter from "~/hooks/usePRouter";
+import { cn } from "~/utils/cn";
 
 export default function NotFound() {
   const router = useRouter();
diff --git a/src/components/Layout/Password.tsx b/src/components/Layout/Password.tsx
index 8461902..7ee630a 100644
--- a/src/components/Layout/Password.tsx
+++ b/src/components/Layout/Password.tsx
@@ -8,9 +8,8 @@ import { Icon, Loader } from "~/components/Global";
 import { Button } from "~/components/ui/button";
 import { Input } from "~/components/ui/input";
 
-import { cn } from "~/utils/cn";
-
 import useLoading from "~/hooks/useLoading";
+import { cn } from "~/utils/cn";
 
 import { CheckPassword, CheckSitePassword, SetPassword, SetSitePassword } from "actions";
 
diff --git a/src/components/Preview/Document.tsx b/src/components/Preview/Document.tsx
index 3bf9447..9d994b0 100644
--- a/src/components/Preview/Document.tsx
+++ b/src/components/Preview/Document.tsx
@@ -7,9 +7,8 @@ import { z } from "zod";
 import { Icon, Loader, Status } from "~/components/Global";
 import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
 
-import { cn } from "~/utils/cn";
-
 import useLoading from "~/hooks/useLoading";
+import { cn } from "~/utils/cn";
 
 import { Schema_File } from "~/types/schema";
 
diff --git a/src/components/Preview/Image.tsx b/src/components/Preview/Image.tsx
index 5ab208f..2dd8e50 100644
--- a/src/components/Preview/Image.tsx
+++ b/src/components/Preview/Image.tsx
@@ -6,9 +6,8 @@ import { z } from "zod";
 import { Icon, Loader, Status } from "~/components/Global";
 import { Alert, AlertDescription, AlertTitle } from "~/components/ui/alert";
 
-import { cn } from "~/utils/cn";
-
 import useLoading from "~/hooks/useLoading";
+import { cn } from "~/utils/cn";
 
 import { Schema_File } from "~/types/schema";
 
diff --git a/src/components/Preview/Information.tsx b/src/components/Preview/Information.tsx
index f5c665c..dc5a0f3 100644
--- a/src/components/Preview/Information.tsx
+++ b/src/components/Preview/Information.tsx
@@ -13,13 +13,12 @@ import { Dialog, DialogContent, DialogTrigger } from "~/components/ui/dialog";
 import { Drawer, DrawerClose, DrawerContent, DrawerFooter, DrawerHeader, DrawerTrigger } from "~/components/ui/drawer";
 import { Separator } from "~/components/ui/separator";
 
+import useMediaQuery from "~/hooks/useMediaQuery";
 import { bytesToReadable } from "~/utils/bytesFormat";
 import { cn } from "~/utils/cn";
 import { durationToReadable } from "~/utils/durationFormat";
 import { getFileType } from "~/utils/previewHelper";
 
-import useMediaQuery from "~/hooks/useMediaQuery";
-
 import { ButtonState, Schema_File } from "~/types/schema";
 
 import { CreateDownloadToken } from "actions";
diff --git a/src/components/Preview/Manga.tsx b/src/components/Preview/Manga.tsx
index 67b4f07..3a19367 100644
--- a/src/components/Preview/Manga.tsx
+++ b/src/components/Preview/Manga.tsx
@@ -17,9 +17,8 @@ import {
 } from "~/components/ui/carousel";
 import { Progress } from "~/components/ui/progress";
 
-import { cn } from "~/utils/cn";
-
 import useMediaQuery from "~/hooks/useMediaQuery";
+import { cn } from "~/utils/cn";
 
 import { Schema_File } from "~/types/schema";
 
diff --git a/src/components/Preview/Rich.tsx b/src/components/Preview/Rich.tsx
index dd9eed7..1851769 100644
--- a/src/components/Preview/Rich.tsx
+++ b/src/components/Preview/Rich.tsx
@@ -6,9 +6,8 @@ import { z } from "zod";
 import { Icon, Loader, Markdown, Status } from "~/components/Global";
 import { Button } from "~/components/ui/button";
 
-import { cn } from "~/utils/cn";
-
 import useLoading from "~/hooks/useLoading";
+import { cn } from "~/utils/cn";
 
 import { Schema_File } from "~/types/schema";
 

From e5367e9a1a5e58bc062df2ce32e0f47e8578205f Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Sat, 18 May 2024 15:19:11 +0700
Subject: [PATCH 17/20] prettier format

---
 src/components/ui/toaster.tsx  |  30 +++-----
 src/components/ui/use-toast.ts | 133 ++++++++++++++++-----------------
 src/context/layoutContext.tsx  |   6 +-
 src/context/themeContext.tsx   |   6 +-
 src/hooks/useLocalStorage.ts   |   3 +-
 src/types/schema.ts            |  15 +---
 src/utils/encryptionHelper.ts  |  24 ++----
 tailwind.config.ts             |   7 +-
 8 files changed, 89 insertions(+), 135 deletions(-)

diff --git a/src/components/ui/toaster.tsx b/src/components/ui/toaster.tsx
index 8b67a2d..1c0e5ed 100644
--- a/src/components/ui/toaster.tsx
+++ b/src/components/ui/toaster.tsx
@@ -1,35 +1,29 @@
-"use client"
+"use client";
 
-import {
-  Toast,
-  ToastClose,
-  ToastDescription,
-  ToastProvider,
-  ToastTitle,
-  ToastViewport,
-} from "~/components/ui/toast"
-import { useToast } from "~/components/ui/use-toast"
+import { Toast, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport } from "~/components/ui/toast";
+import { useToast } from "~/components/ui/use-toast";
 
 export function Toaster() {
-  const { toasts } = useToast()
+  const { toasts } = useToast();
 
   return (
     <ToastProvider>
       {toasts.map(function ({ id, title, description, action, ...props }) {
         return (
-          <Toast key={id} {...props}>
-            <div className="grid gap-1">
+          <Toast
+            key={id}
+            {...props}
+          >
+            <div className='grid gap-1'>
               {title && <ToastTitle>{title}</ToastTitle>}
-              {description && (
-                <ToastDescription>{description}</ToastDescription>
-              )}
+              {description && <ToastDescription>{description}</ToastDescription>}
             </div>
             {action}
             <ToastClose />
           </Toast>
-        )
+        );
       })}
       <ToastViewport />
     </ToastProvider>
-  )
+  );
 }
diff --git a/src/components/ui/use-toast.ts b/src/components/ui/use-toast.ts
index d6698ef..84c8ad7 100644
--- a/src/components/ui/use-toast.ts
+++ b/src/components/ui/use-toast.ts
@@ -1,78 +1,75 @@
-"use client"
+"use client";
 
 // Inspired by react-hot-toast library
-import * as React from "react"
+import * as React from "react";
 
-import type {
-  ToastActionElement,
-  ToastProps,
-} from "~/components/ui/toast"
+import type { ToastActionElement, ToastProps } from "~/components/ui/toast";
 
-const TOAST_LIMIT = 1
-const TOAST_REMOVE_DELAY = 1000000
+const TOAST_LIMIT = 1;
+const TOAST_REMOVE_DELAY = 1000000;
 
 type ToasterToast = ToastProps & {
-  id: string
-  title?: React.ReactNode
-  description?: React.ReactNode
-  action?: ToastActionElement
-}
+  id: string;
+  title?: React.ReactNode;
+  description?: React.ReactNode;
+  action?: ToastActionElement;
+};
 
 const actionTypes = {
   ADD_TOAST: "ADD_TOAST",
   UPDATE_TOAST: "UPDATE_TOAST",
   DISMISS_TOAST: "DISMISS_TOAST",
   REMOVE_TOAST: "REMOVE_TOAST",
-} as const
+} as const;
 
-let count = 0
+let count = 0;
 
 function genId() {
-  count = (count + 1) % Number.MAX_SAFE_INTEGER
-  return count.toString()
+  count = (count + 1) % Number.MAX_SAFE_INTEGER;
+  return count.toString();
 }
 
-type ActionType = typeof actionTypes
+type ActionType = typeof actionTypes;
 
 type Action =
   | {
-      type: ActionType["ADD_TOAST"]
-      toast: ToasterToast
+      type: ActionType["ADD_TOAST"];
+      toast: ToasterToast;
     }
   | {
-      type: ActionType["UPDATE_TOAST"]
-      toast: Partial<ToasterToast>
+      type: ActionType["UPDATE_TOAST"];
+      toast: Partial<ToasterToast>;
     }
   | {
-      type: ActionType["DISMISS_TOAST"]
-      toastId?: ToasterToast["id"]
+      type: ActionType["DISMISS_TOAST"];
+      toastId?: ToasterToast["id"];
     }
   | {
-      type: ActionType["REMOVE_TOAST"]
-      toastId?: ToasterToast["id"]
-    }
+      type: ActionType["REMOVE_TOAST"];
+      toastId?: ToasterToast["id"];
+    };
 
 interface State {
-  toasts: ToasterToast[]
+  toasts: ToasterToast[];
 }
 
-const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>()
+const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>();
 
 const addToRemoveQueue = (toastId: string) => {
   if (toastTimeouts.has(toastId)) {
-    return
+    return;
   }
 
   const timeout = setTimeout(() => {
-    toastTimeouts.delete(toastId)
+    toastTimeouts.delete(toastId);
     dispatch({
       type: "REMOVE_TOAST",
       toastId: toastId,
-    })
-  }, TOAST_REMOVE_DELAY)
+    });
+  }, TOAST_REMOVE_DELAY);
 
-  toastTimeouts.set(toastId, timeout)
-}
+  toastTimeouts.set(toastId, timeout);
+};
 
 export const reducer = (state: State, action: Action): State => {
   switch (action.type) {
@@ -80,27 +77,25 @@ export const reducer = (state: State, action: Action): State => {
       return {
         ...state,
         toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
-      }
+      };
 
     case "UPDATE_TOAST":
       return {
         ...state,
-        toasts: state.toasts.map((t) =>
-          t.id === action.toast.id ? { ...t, ...action.toast } : t
-        ),
-      }
+        toasts: state.toasts.map((t) => (t.id === action.toast.id ? { ...t, ...action.toast } : t)),
+      };
 
     case "DISMISS_TOAST": {
-      const { toastId } = action
+      const { toastId } = action;
 
       // ! Side effects ! - This could be extracted into a dismissToast() action,
       // but I'll keep it here for simplicity
       if (toastId) {
-        addToRemoveQueue(toastId)
+        addToRemoveQueue(toastId);
       } else {
         state.toasts.forEach((toast) => {
-          addToRemoveQueue(toast.id)
-        })
+          addToRemoveQueue(toast.id);
+        });
       }
 
       return {
@@ -111,46 +106,46 @@ export const reducer = (state: State, action: Action): State => {
                 ...t,
                 open: false,
               }
-            : t
+            : t,
         ),
-      }
+      };
     }
     case "REMOVE_TOAST":
       if (action.toastId === undefined) {
         return {
           ...state,
           toasts: [],
-        }
+        };
       }
       return {
         ...state,
         toasts: state.toasts.filter((t) => t.id !== action.toastId),
-      }
+      };
   }
-}
+};
 
-const listeners: Array<(state: State) => void> = []
+const listeners: Array<(state: State) => void> = [];
 
-let memoryState: State = { toasts: [] }
+let memoryState: State = { toasts: [] };
 
 function dispatch(action: Action) {
-  memoryState = reducer(memoryState, action)
+  memoryState = reducer(memoryState, action);
   listeners.forEach((listener) => {
-    listener(memoryState)
-  })
+    listener(memoryState);
+  });
 }
 
-type Toast = Omit<ToasterToast, "id">
+type Toast = Omit<ToasterToast, "id">;
 
 function toast({ ...props }: Toast) {
-  const id = genId()
+  const id = genId();
 
   const update = (props: ToasterToast) =>
     dispatch({
       type: "UPDATE_TOAST",
       toast: { ...props, id },
-    })
-  const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id })
+    });
+  const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
 
   dispatch({
     type: "ADD_TOAST",
@@ -159,36 +154,36 @@ function toast({ ...props }: Toast) {
       id,
       open: true,
       onOpenChange: (open) => {
-        if (!open) dismiss()
+        if (!open) dismiss();
       },
     },
-  })
+  });
 
   return {
     id: id,
     dismiss,
     update,
-  }
+  };
 }
 
 function useToast() {
-  const [state, setState] = React.useState<State>(memoryState)
+  const [state, setState] = React.useState<State>(memoryState);
 
   React.useEffect(() => {
-    listeners.push(setState)
+    listeners.push(setState);
     return () => {
-      const index = listeners.indexOf(setState)
+      const index = listeners.indexOf(setState);
       if (index > -1) {
-        listeners.splice(index, 1)
+        listeners.splice(index, 1);
       }
-    }
-  }, [state])
+    };
+  }, [state]);
 
   return {
     ...state,
     toast,
     dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }),
-  }
+  };
 }
 
-export { useToast, toast }
+export { useToast, toast };
diff --git a/src/context/layoutContext.tsx b/src/context/layoutContext.tsx
index c3552ae..9203684 100644
--- a/src/context/layoutContext.tsx
+++ b/src/context/layoutContext.tsx
@@ -37,10 +37,6 @@ const LayoutProvider = ({ children }: TLayoutProvider) => {
     localStorage.setItem("layout", layout);
   };
 
-  return (
-    <LayoutContext.Provider value={{ layout, setLayout: onChangeLayout }}>
-      {children}
-    </LayoutContext.Provider>
-  );
+  return <LayoutContext.Provider value={{ layout, setLayout: onChangeLayout }}>{children}</LayoutContext.Provider>;
 };
 export default LayoutProvider;
diff --git a/src/context/themeContext.tsx b/src/context/themeContext.tsx
index 7413e0e..4395fd6 100644
--- a/src/context/themeContext.tsx
+++ b/src/context/themeContext.tsx
@@ -35,9 +35,5 @@ const ThemeProvider = ({ children }: TThemeProvider) => {
     setTheme(getThemeFromLocalStorage());
   }, []);
 
-  return (
-    <ThemeContext.Provider value={{ theme, setTheme }}>
-      {children}
-    </ThemeContext.Provider>
-  );
+  return <ThemeContext.Provider value={{ theme, setTheme }}>{children}</ThemeContext.Provider>;
 };
diff --git a/src/hooks/useLocalStorage.ts b/src/hooks/useLocalStorage.ts
index 450a1f9..dc26a4b 100644
--- a/src/hooks/useLocalStorage.ts
+++ b/src/hooks/useLocalStorage.ts
@@ -23,8 +23,7 @@ export default function useLocalStorage<T>(key: string, initialValue: T) {
   // Create dispatch function to set or remove localStorage
   const setValue: SetValue<T> = (value) => {
     try {
-      const valueToStore =
-        value instanceof Function ? value(storedValue) : value;
+      const valueToStore = value instanceof Function ? value(storedValue) : value;
       setStoredValue(valueToStore);
       window.localStorage.setItem(key, JSON.stringify(valueToStore));
     } catch (error) {
diff --git a/src/types/schema.ts b/src/types/schema.ts
index 2e38049..91abdee 100644
--- a/src/types/schema.ts
+++ b/src/types/schema.ts
@@ -133,12 +133,7 @@ export const Schema_Config_Site = z.object({
 
   toaster: z
     .object({
-      position: z.enum([
-        "top-left",
-        "top-right",
-        "bottom-left",
-        "bottom-right",
-      ]),
+      position: z.enum(["top-left", "top-right", "bottom-left", "bottom-right"]),
       duration: z.number().positive(),
     })
     .optional()
@@ -201,12 +196,10 @@ export const Schema_App_Configuration = z.object({
   site: Schema_Config_Site,
 });
 
-export type ConfigurationCategory = keyof z.infer<
+export type ConfigurationCategory = keyof z.infer<typeof Schema_App_Configuration>;
+export type ConfigurationKeys<T extends keyof z.infer<typeof Schema_App_Configuration>> = keyof z.infer<
   typeof Schema_App_Configuration
->;
-export type ConfigurationKeys<
-  T extends keyof z.infer<typeof Schema_App_Configuration>,
-> = keyof z.infer<typeof Schema_App_Configuration>[T];
+>[T];
 export type ConfigurationValue<
   T extends keyof z.infer<typeof Schema_App_Configuration>,
   K extends keyof z.infer<typeof Schema_App_Configuration>[T],
diff --git a/src/utils/encryptionHelper.ts b/src/utils/encryptionHelper.ts
index 64c0a56..520d373 100644
--- a/src/utils/encryptionHelper.ts
+++ b/src/utils/encryptionHelper.ts
@@ -15,17 +15,11 @@ const generateKey = () => {
 };
 const key = generateKey();
 
-export async function encryptData(
-  data: string,
-  encryptKey: string = key,
-): Promise<string> {
+export async function encryptData(data: string, encryptKey: string = key): Promise<string> {
   try {
     const ivKey = Buffer.from(key);
     const cipher = crypto.createCipheriv("aes-128-cbc", encryptKey, ivKey);
-    return Buffer.concat([
-      cipher.update(data, "utf-8"),
-      cipher.final(),
-    ]).toString("hex");
+    return Buffer.concat([cipher.update(data, "utf-8"), cipher.final()]).toString("hex");
   } catch (error) {
     const e = error as Error;
     console.error(e.message);
@@ -33,23 +27,15 @@ export async function encryptData(
   }
 }
 
-export async function decryptData(
-  hash: string,
-  encryptKey: string = key,
-): Promise<string> {
+export async function decryptData(hash: string, encryptKey: string = key): Promise<string> {
   try {
     const ivKey = Buffer.from(key);
     const decipher = crypto.createDecipheriv("aes-128-cbc", encryptKey, ivKey);
 
-    return Buffer.concat([
-      decipher.update(hash, "hex"),
-      decipher.final(),
-    ]).toString("utf-8");
+    return Buffer.concat([decipher.update(hash, "hex"), decipher.final()]).toString("utf-8");
   } catch (error) {
     const e = error as Error;
     console.error(e.message);
-    throw new Error(
-      "Failed to decrypt data, either invalid hash or encryption key.",
-    );
+    throw new Error("Failed to decrypt data, either invalid hash or encryption key.");
   }
 }
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 83d0966..445dca2 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -3,12 +3,7 @@ import tw from "tailwindcss/defaultTheme";
 
 const config: Config = {
   darkMode: ["class"],
-  content: [
-    "./pages/**/*.{ts,tsx}",
-    "./components/**/*.{ts,tsx}",
-    "./app/**/*.{ts,tsx}",
-    "./src/**/*.{ts,tsx}",
-  ],
+  content: ["./pages/**/*.{ts,tsx}", "./components/**/*.{ts,tsx}", "./app/**/*.{ts,tsx}", "./src/**/*.{ts,tsx}"],
   prefix: "",
   theme: {
     container: {

From 7c15cd5a87b957a23644cfb3e7eb1ed1cb6898fe Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Sat, 18 May 2024 15:20:00 +0700
Subject: [PATCH 18/20] remove console.log statements

---
 src/app/[...rest]/page.tsx         | 6 ------
 src/app/actions.ts                 | 1 -
 src/components/Layout/Password.tsx | 1 -
 3 files changed, 8 deletions(-)

diff --git a/src/app/[...rest]/page.tsx b/src/app/[...rest]/page.tsx
index d7417b3..4081c4d 100644
--- a/src/app/[...rest]/page.tsx
+++ b/src/app/[...rest]/page.tsx
@@ -103,12 +103,6 @@ export default async function RestPage({ params: { rest } }: Props) {
       return values as [{ files: z.infer<typeof Schema_File>[]; nextPageToken?: string }, string];
     }
   });
-  console.log(
-    rest.map((item, index, array) => ({
-      label: decodeURIComponent(item),
-      href: index === array.length - 1 ? undefined : `${item}`,
-    })),
-  );
 
   return (
     <div className={cn("h-fit w-full", "flex flex-col gap-3")}>
diff --git a/src/app/actions.ts b/src/app/actions.ts
index f5081b7..6ea365f 100644
--- a/src/app/actions.ts
+++ b/src/app/actions.ts
@@ -639,7 +639,6 @@ export async function GetReadme(encryptedId: string | undefined): Promise<string
       }),
     });
 
-    console.log(data.files?.length);
     if (!data.files?.length) return null;
 
     let file;
diff --git a/src/components/Layout/Password.tsx b/src/components/Layout/Password.tsx
index 7ee630a..1f7f554 100644
--- a/src/components/Layout/Password.tsx
+++ b/src/components/Layout/Password.tsx
@@ -52,7 +52,6 @@ export default function Password({ path, checkPaths, errorMessage }: Props) {
       toast.success("Password accepted! Refreshing...", {
         id: "password",
       });
-      console.log("Password accepted! Refreshing...");
       router.refresh();
     } catch (error) {
       const e = error as Error;

From 611026a2c5e7f26eb4ef7a1efe0a56e417bcb0b1 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Sat, 18 May 2024 18:38:35 +0700
Subject: [PATCH 19/20] Update Readme and Add License

---
 LICENSE   | 661 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 README.md | 276 +++++++++++------------
 2 files changed, 786 insertions(+), 151 deletions(-)
 create mode 100644 LICENSE

diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..3972c30
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,661 @@
+                    GNU AFFERO GENERAL PUBLIC LICENSE
+                       Version 3, 19 November 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The GNU Affero General Public License is a free, copyleft license for
+software and other kinds of works, specifically designed to ensure
+cooperation with the community in the case of network server software.
+
+  The licenses for most software and other practical works are designed
+to take away your freedom to share and change the works.  By contrast,
+our General Public Licenses are intended to guarantee your freedom to
+share and change all versions of a program--to make sure it remains free
+software for all its users.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+them if you wish), that you receive source code or can get it if you
+want it, that you can change the software or use pieces of it in new
+free programs, and that you know you can do these things.
+
+  Developers that use our General Public Licenses protect your rights
+with two steps: (1) assert copyright on the software, and (2) offer
+you this License which gives you legal permission to copy, distribute
+and/or modify the software.
+
+  A secondary benefit of defending all users' freedom is that
+improvements made in alternate versions of the program, if they
+receive widespread use, become available for other developers to
+incorporate.  Many developers of free software are heartened and
+encouraged by the resulting cooperation.  However, in the case of
+software used on network servers, this result may fail to come about.
+The GNU General Public License permits making a modified version and
+letting the public access it on a server without ever releasing its
+source code to the public.
+
+  The GNU Affero General Public License is designed specifically to
+ensure that, in such cases, the modified source code becomes available
+to the community.  It requires the operator of a network server to
+provide the source code of the modified version running there to the
+users of that server.  Therefore, public use of a modified version, on
+a publicly accessible server, gives the public access to the source
+code of the modified version.
+
+  An older license, called the Affero General Public License and
+published by Affero, was designed to accomplish similar goals.  This is
+a different license, not a version of the Affero GPL, but Affero has
+released a new version of the Affero GPL which permits relicensing under
+this license.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                       TERMS AND CONDITIONS
+
+  0. Definitions.
+
+  "This License" refers to version 3 of the GNU Affero General Public License.
+
+  "Copyright" also means copyright-like laws that apply to other kinds of
+works, such as semiconductor masks.
+
+  "The Program" refers to any copyrightable work licensed under this
+License.  Each licensee is addressed as "you".  "Licensees" and
+"recipients" may be individuals or organizations.
+
+  To "modify" a work means to copy from or adapt all or part of the work
+in a fashion requiring copyright permission, other than the making of an
+exact copy.  The resulting work is called a "modified version" of the
+earlier work or a work "based on" the earlier work.
+
+  A "covered work" means either the unmodified Program or a work based
+on the Program.
+
+  To "propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy.  Propagation includes copying,
+distribution (with or without modification), making available to the
+public, and in some countries other activities as well.
+
+  To "convey" a work means any kind of propagation that enables other
+parties to make or receive copies.  Mere interaction with a user through
+a computer network, with no transfer of a copy, is not conveying.
+
+  An interactive user interface displays "Appropriate Legal Notices"
+to the extent that it includes a convenient and prominently visible
+feature that (1) displays an appropriate copyright notice, and (2)
+tells the user that there is no warranty for the work (except to the
+extent that warranties are provided), that licensees may convey the
+work under this License, and how to view a copy of this License.  If
+the interface presents a list of user commands or options, such as a
+menu, a prominent item in the list meets this criterion.
+
+  1. Source Code.
+
+  The "source code" for a work means the preferred form of the work
+for making modifications to it.  "Object code" means any non-source
+form of a work.
+
+  A "Standard Interface" means an interface that either is an official
+standard defined by a recognized standards body, or, in the case of
+interfaces specified for a particular programming language, one that
+is widely used among developers working in that language.
+
+  The "System Libraries" of an executable work include anything, other
+than the work as a whole, that (a) is included in the normal form of
+packaging a Major Component, but which is not part of that Major
+Component, and (b) serves only to enable use of the work with that
+Major Component, or to implement a Standard Interface for which an
+implementation is available to the public in source code form.  A
+"Major Component", in this context, means a major essential component
+(kernel, window system, and so on) of the specific operating system
+(if any) on which the executable work runs, or a compiler used to
+produce the work, or an object code interpreter used to run it.
+
+  The "Corresponding Source" for a work in object code form means all
+the source code needed to generate, install, and (for an executable
+work) run the object code and to modify the work, including scripts to
+control those activities.  However, it does not include the work's
+System Libraries, or general-purpose tools or generally available free
+programs which are used unmodified in performing those activities but
+which are not part of the work.  For example, Corresponding Source
+includes interface definition files associated with source files for
+the work, and the source code for shared libraries and dynamically
+linked subprograms that the work is specifically designed to require,
+such as by intimate data communication or control flow between those
+subprograms and other parts of the work.
+
+  The Corresponding Source need not include anything that users
+can regenerate automatically from other parts of the Corresponding
+Source.
+
+  The Corresponding Source for a work in source code form is that
+same work.
+
+  2. Basic Permissions.
+
+  All rights granted under this License are granted for the term of
+copyright on the Program, and are irrevocable provided the stated
+conditions are met.  This License explicitly affirms your unlimited
+permission to run the unmodified Program.  The output from running a
+covered work is covered by this License only if the output, given its
+content, constitutes a covered work.  This License acknowledges your
+rights of fair use or other equivalent, as provided by copyright law.
+
+  You may make, run and propagate covered works that you do not
+convey, without conditions so long as your license otherwise remains
+in force.  You may convey covered works to others for the sole purpose
+of having them make modifications exclusively for you, or provide you
+with facilities for running those works, provided that you comply with
+the terms of this License in conveying all material for which you do
+not control copyright.  Those thus making or running the covered works
+for you must do so exclusively on your behalf, under your direction
+and control, on terms that prohibit them from making any copies of
+your copyrighted material outside their relationship with you.
+
+  Conveying under any other circumstances is permitted solely under
+the conditions stated below.  Sublicensing is not allowed; section 10
+makes it unnecessary.
+
+  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
+
+  No covered work shall be deemed part of an effective technological
+measure under any applicable law fulfilling obligations under article
+11 of the WIPO copyright treaty adopted on 20 December 1996, or
+similar laws prohibiting or restricting circumvention of such
+measures.
+
+  When you convey a covered work, you waive any legal power to forbid
+circumvention of technological measures to the extent such circumvention
+is effected by exercising rights under this License with respect to
+the covered work, and you disclaim any intention to limit operation or
+modification of the work as a means of enforcing, against the work's
+users, your or third parties' legal rights to forbid circumvention of
+technological measures.
+
+  4. Conveying Verbatim Copies.
+
+  You may convey verbatim copies of the Program's source code as you
+receive it, in any medium, provided that you conspicuously and
+appropriately publish on each copy an appropriate copyright notice;
+keep intact all notices stating that this License and any
+non-permissive terms added in accord with section 7 apply to the code;
+keep intact all notices of the absence of any warranty; and give all
+recipients a copy of this License along with the Program.
+
+  You may charge any price or no price for each copy that you convey,
+and you may offer support or warranty protection for a fee.
+
+  5. Conveying Modified Source Versions.
+
+  You may convey a work based on the Program, or the modifications to
+produce it from the Program, in the form of source code under the
+terms of section 4, provided that you also meet all of these conditions:
+
+    a) The work must carry prominent notices stating that you modified
+    it, and giving a relevant date.
+
+    b) The work must carry prominent notices stating that it is
+    released under this License and any conditions added under section
+    7.  This requirement modifies the requirement in section 4 to
+    "keep intact all notices".
+
+    c) You must license the entire work, as a whole, under this
+    License to anyone who comes into possession of a copy.  This
+    License will therefore apply, along with any applicable section 7
+    additional terms, to the whole of the work, and all its parts,
+    regardless of how they are packaged.  This License gives no
+    permission to license the work in any other way, but it does not
+    invalidate such permission if you have separately received it.
+
+    d) If the work has interactive user interfaces, each must display
+    Appropriate Legal Notices; however, if the Program has interactive
+    interfaces that do not display Appropriate Legal Notices, your
+    work need not make them do so.
+
+  A compilation of a covered work with other separate and independent
+works, which are not by their nature extensions of the covered work,
+and which are not combined with it such as to form a larger program,
+in or on a volume of a storage or distribution medium, is called an
+"aggregate" if the compilation and its resulting copyright are not
+used to limit the access or legal rights of the compilation's users
+beyond what the individual works permit.  Inclusion of a covered work
+in an aggregate does not cause this License to apply to the other
+parts of the aggregate.
+
+  6. Conveying Non-Source Forms.
+
+  You may convey a covered work in object code form under the terms
+of sections 4 and 5, provided that you also convey the
+machine-readable Corresponding Source under the terms of this License,
+in one of these ways:
+
+    a) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by the
+    Corresponding Source fixed on a durable physical medium
+    customarily used for software interchange.
+
+    b) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by a
+    written offer, valid for at least three years and valid for as
+    long as you offer spare parts or customer support for that product
+    model, to give anyone who possesses the object code either (1) a
+    copy of the Corresponding Source for all the software in the
+    product that is covered by this License, on a durable physical
+    medium customarily used for software interchange, for a price no
+    more than your reasonable cost of physically performing this
+    conveying of source, or (2) access to copy the
+    Corresponding Source from a network server at no charge.
+
+    c) Convey individual copies of the object code with a copy of the
+    written offer to provide the Corresponding Source.  This
+    alternative is allowed only occasionally and noncommercially, and
+    only if you received the object code with such an offer, in accord
+    with subsection 6b.
+
+    d) Convey the object code by offering access from a designated
+    place (gratis or for a charge), and offer equivalent access to the
+    Corresponding Source in the same way through the same place at no
+    further charge.  You need not require recipients to copy the
+    Corresponding Source along with the object code.  If the place to
+    copy the object code is a network server, the Corresponding Source
+    may be on a different server (operated by you or a third party)
+    that supports equivalent copying facilities, provided you maintain
+    clear directions next to the object code saying where to find the
+    Corresponding Source.  Regardless of what server hosts the
+    Corresponding Source, you remain obligated to ensure that it is
+    available for as long as needed to satisfy these requirements.
+
+    e) Convey the object code using peer-to-peer transmission, provided
+    you inform other peers where the object code and Corresponding
+    Source of the work are being offered to the general public at no
+    charge under subsection 6d.
+
+  A separable portion of the object code, whose source code is excluded
+from the Corresponding Source as a System Library, need not be
+included in conveying the object code work.
+
+  A "User Product" is either (1) a "consumer product", which means any
+tangible personal property which is normally used for personal, family,
+or household purposes, or (2) anything designed or sold for incorporation
+into a dwelling.  In determining whether a product is a consumer product,
+doubtful cases shall be resolved in favor of coverage.  For a particular
+product received by a particular user, "normally used" refers to a
+typical or common use of that class of product, regardless of the status
+of the particular user or of the way in which the particular user
+actually uses, or expects or is expected to use, the product.  A product
+is a consumer product regardless of whether the product has substantial
+commercial, industrial or non-consumer uses, unless such uses represent
+the only significant mode of use of the product.
+
+  "Installation Information" for a User Product means any methods,
+procedures, authorization keys, or other information required to install
+and execute modified versions of a covered work in that User Product from
+a modified version of its Corresponding Source.  The information must
+suffice to ensure that the continued functioning of the modified object
+code is in no case prevented or interfered with solely because
+modification has been made.
+
+  If you convey an object code work under this section in, or with, or
+specifically for use in, a User Product, and the conveying occurs as
+part of a transaction in which the right of possession and use of the
+User Product is transferred to the recipient in perpetuity or for a
+fixed term (regardless of how the transaction is characterized), the
+Corresponding Source conveyed under this section must be accompanied
+by the Installation Information.  But this requirement does not apply
+if neither you nor any third party retains the ability to install
+modified object code on the User Product (for example, the work has
+been installed in ROM).
+
+  The requirement to provide Installation Information does not include a
+requirement to continue to provide support service, warranty, or updates
+for a work that has been modified or installed by the recipient, or for
+the User Product in which it has been modified or installed.  Access to a
+network may be denied when the modification itself materially and
+adversely affects the operation of the network or violates the rules and
+protocols for communication across the network.
+
+  Corresponding Source conveyed, and Installation Information provided,
+in accord with this section must be in a format that is publicly
+documented (and with an implementation available to the public in
+source code form), and must require no special password or key for
+unpacking, reading or copying.
+
+  7. Additional Terms.
+
+  "Additional permissions" are terms that supplement the terms of this
+License by making exceptions from one or more of its conditions.
+Additional permissions that are applicable to the entire Program shall
+be treated as though they were included in this License, to the extent
+that they are valid under applicable law.  If additional permissions
+apply only to part of the Program, that part may be used separately
+under those permissions, but the entire Program remains governed by
+this License without regard to the additional permissions.
+
+  When you convey a copy of a covered work, you may at your option
+remove any additional permissions from that copy, or from any part of
+it.  (Additional permissions may be written to require their own
+removal in certain cases when you modify the work.)  You may place
+additional permissions on material, added by you to a covered work,
+for which you have or can give appropriate copyright permission.
+
+  Notwithstanding any other provision of this License, for material you
+add to a covered work, you may (if authorized by the copyright holders of
+that material) supplement the terms of this License with terms:
+
+    a) Disclaiming warranty or limiting liability differently from the
+    terms of sections 15 and 16 of this License; or
+
+    b) Requiring preservation of specified reasonable legal notices or
+    author attributions in that material or in the Appropriate Legal
+    Notices displayed by works containing it; or
+
+    c) Prohibiting misrepresentation of the origin of that material, or
+    requiring that modified versions of such material be marked in
+    reasonable ways as different from the original version; or
+
+    d) Limiting the use for publicity purposes of names of licensors or
+    authors of the material; or
+
+    e) Declining to grant rights under trademark law for use of some
+    trade names, trademarks, or service marks; or
+
+    f) Requiring indemnification of licensors and authors of that
+    material by anyone who conveys the material (or modified versions of
+    it) with contractual assumptions of liability to the recipient, for
+    any liability that these contractual assumptions directly impose on
+    those licensors and authors.
+
+  All other non-permissive additional terms are considered "further
+restrictions" within the meaning of section 10.  If the Program as you
+received it, or any part of it, contains a notice stating that it is
+governed by this License along with a term that is a further
+restriction, you may remove that term.  If a license document contains
+a further restriction but permits relicensing or conveying under this
+License, you may add to a covered work material governed by the terms
+of that license document, provided that the further restriction does
+not survive such relicensing or conveying.
+
+  If you add terms to a covered work in accord with this section, you
+must place, in the relevant source files, a statement of the
+additional terms that apply to those files, or a notice indicating
+where to find the applicable terms.
+
+  Additional terms, permissive or non-permissive, may be stated in the
+form of a separately written license, or stated as exceptions;
+the above requirements apply either way.
+
+  8. Termination.
+
+  You may not propagate or modify a covered work except as expressly
+provided under this License.  Any attempt otherwise to propagate or
+modify it is void, and will automatically terminate your rights under
+this License (including any patent licenses granted under the third
+paragraph of section 11).
+
+  However, if you cease all violation of this License, then your
+license from a particular copyright holder is reinstated (a)
+provisionally, unless and until the copyright holder explicitly and
+finally terminates your license, and (b) permanently, if the copyright
+holder fails to notify you of the violation by some reasonable means
+prior to 60 days after the cessation.
+
+  Moreover, your license from a particular copyright holder is
+reinstated permanently if the copyright holder notifies you of the
+violation by some reasonable means, this is the first time you have
+received notice of violation of this License (for any work) from that
+copyright holder, and you cure the violation prior to 30 days after
+your receipt of the notice.
+
+  Termination of your rights under this section does not terminate the
+licenses of parties who have received copies or rights from you under
+this License.  If your rights have been terminated and not permanently
+reinstated, you do not qualify to receive new licenses for the same
+material under section 10.
+
+  9. Acceptance Not Required for Having Copies.
+
+  You are not required to accept this License in order to receive or
+run a copy of the Program.  Ancillary propagation of a covered work
+occurring solely as a consequence of using peer-to-peer transmission
+to receive a copy likewise does not require acceptance.  However,
+nothing other than this License grants you permission to propagate or
+modify any covered work.  These actions infringe copyright if you do
+not accept this License.  Therefore, by modifying or propagating a
+covered work, you indicate your acceptance of this License to do so.
+
+  10. Automatic Licensing of Downstream Recipients.
+
+  Each time you convey a covered work, the recipient automatically
+receives a license from the original licensors, to run, modify and
+propagate that work, subject to this License.  You are not responsible
+for enforcing compliance by third parties with this License.
+
+  An "entity transaction" is a transaction transferring control of an
+organization, or substantially all assets of one, or subdividing an
+organization, or merging organizations.  If propagation of a covered
+work results from an entity transaction, each party to that
+transaction who receives a copy of the work also receives whatever
+licenses to the work the party's predecessor in interest had or could
+give under the previous paragraph, plus a right to possession of the
+Corresponding Source of the work from the predecessor in interest, if
+the predecessor has it or can get it with reasonable efforts.
+
+  You may not impose any further restrictions on the exercise of the
+rights granted or affirmed under this License.  For example, you may
+not impose a license fee, royalty, or other charge for exercise of
+rights granted under this License, and you may not initiate litigation
+(including a cross-claim or counterclaim in a lawsuit) alleging that
+any patent claim is infringed by making, using, selling, offering for
+sale, or importing the Program or any portion of it.
+
+  11. Patents.
+
+  A "contributor" is a copyright holder who authorizes use under this
+License of the Program or a work on which the Program is based.  The
+work thus licensed is called the contributor's "contributor version".
+
+  A contributor's "essential patent claims" are all patent claims
+owned or controlled by the contributor, whether already acquired or
+hereafter acquired, that would be infringed by some manner, permitted
+by this License, of making, using, or selling its contributor version,
+but do not include claims that would be infringed only as a
+consequence of further modification of the contributor version.  For
+purposes of this definition, "control" includes the right to grant
+patent sublicenses in a manner consistent with the requirements of
+this License.
+
+  Each contributor grants you a non-exclusive, worldwide, royalty-free
+patent license under the contributor's essential patent claims, to
+make, use, sell, offer for sale, import and otherwise run, modify and
+propagate the contents of its contributor version.
+
+  In the following three paragraphs, a "patent license" is any express
+agreement or commitment, however denominated, not to enforce a patent
+(such as an express permission to practice a patent or covenant not to
+sue for patent infringement).  To "grant" such a patent license to a
+party means to make such an agreement or commitment not to enforce a
+patent against the party.
+
+  If you convey a covered work, knowingly relying on a patent license,
+and the Corresponding Source of the work is not available for anyone
+to copy, free of charge and under the terms of this License, through a
+publicly available network server or other readily accessible means,
+then you must either (1) cause the Corresponding Source to be so
+available, or (2) arrange to deprive yourself of the benefit of the
+patent license for this particular work, or (3) arrange, in a manner
+consistent with the requirements of this License, to extend the patent
+license to downstream recipients.  "Knowingly relying" means you have
+actual knowledge that, but for the patent license, your conveying the
+covered work in a country, or your recipient's use of the covered work
+in a country, would infringe one or more identifiable patents in that
+country that you have reason to believe are valid.
+
+  If, pursuant to or in connection with a single transaction or
+arrangement, you convey, or propagate by procuring conveyance of, a
+covered work, and grant a patent license to some of the parties
+receiving the covered work authorizing them to use, propagate, modify
+or convey a specific copy of the covered work, then the patent license
+you grant is automatically extended to all recipients of the covered
+work and works based on it.
+
+  A patent license is "discriminatory" if it does not include within
+the scope of its coverage, prohibits the exercise of, or is
+conditioned on the non-exercise of one or more of the rights that are
+specifically granted under this License.  You may not convey a covered
+work if you are a party to an arrangement with a third party that is
+in the business of distributing software, under which you make payment
+to the third party based on the extent of your activity of conveying
+the work, and under which the third party grants, to any of the
+parties who would receive the covered work from you, a discriminatory
+patent license (a) in connection with copies of the covered work
+conveyed by you (or copies made from those copies), or (b) primarily
+for and in connection with specific products or compilations that
+contain the covered work, unless you entered into that arrangement,
+or that patent license was granted, prior to 28 March 2007.
+
+  Nothing in this License shall be construed as excluding or limiting
+any implied license or other defenses to infringement that may
+otherwise be available to you under applicable patent law.
+
+  12. No Surrender of Others' Freedom.
+
+  If conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot convey a
+covered work so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you may
+not convey it at all.  For example, if you agree to terms that obligate you
+to collect a royalty for further conveying from those to whom you convey
+the Program, the only way you could satisfy both those terms and this
+License would be to refrain entirely from conveying the Program.
+
+  13. Remote Network Interaction; Use with the GNU General Public License.
+
+  Notwithstanding any other provision of this License, if you modify the
+Program, your modified version must prominently offer all users
+interacting with it remotely through a computer network (if your version
+supports such interaction) an opportunity to receive the Corresponding
+Source of your version by providing access to the Corresponding Source
+from a network server at no charge, through some standard or customary
+means of facilitating copying of software.  This Corresponding Source
+shall include the Corresponding Source for any work covered by version 3
+of the GNU General Public License that is incorporated pursuant to the
+following paragraph.
+
+  Notwithstanding any other provision of this License, you have
+permission to link or combine any covered work with a work licensed
+under version 3 of the GNU General Public License into a single
+combined work, and to convey the resulting work.  The terms of this
+License will continue to apply to the part which is the covered work,
+but the work with which it is combined will remain governed by version
+3 of the GNU General Public License.
+
+  14. Revised Versions of this License.
+
+  The Free Software Foundation may publish revised and/or new versions of
+the GNU Affero General Public License from time to time.  Such new versions
+will be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+  Each version is given a distinguishing version number.  If the
+Program specifies that a certain numbered version of the GNU Affero General
+Public License "or any later version" applies to it, you have the
+option of following the terms and conditions either of that numbered
+version or of any later version published by the Free Software
+Foundation.  If the Program does not specify a version number of the
+GNU Affero General Public License, you may choose any version ever published
+by the Free Software Foundation.
+
+  If the Program specifies that a proxy can decide which future
+versions of the GNU Affero General Public License can be used, that proxy's
+public statement of acceptance of a version permanently authorizes you
+to choose that version for the Program.
+
+  Later license versions may give you additional or different
+permissions.  However, no additional obligations are imposed on any
+author or copyright holder as a result of your choosing to follow a
+later version.
+
+  15. Disclaimer of Warranty.
+
+  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
+APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
+HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
+OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
+THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
+IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
+ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
+
+  16. Limitation of Liability.
+
+  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
+THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
+GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
+USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
+DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
+PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
+EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
+SUCH DAMAGES.
+
+  17. Interpretation of Sections 15 and 16.
+
+  If the disclaimer of warranty and limitation of liability provided
+above cannot be given local legal effect according to their terms,
+reviewing courts shall apply local law that most closely approximates
+an absolute waiver of all civil liability in connection with the
+Program, unless a warranty or assumption of liability accompanies a
+copy of the Program in return for a fee.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+state the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) 2024  <name of author>
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as published
+    by the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <https://www.gnu.org/licenses/>.
+
+Also add information on how to contact you by electronic and paper mail.
+
+  If your software can interact with users remotely through a computer
+network, you should also make sure that it provides a way for users to
+get its source.  For example, if your program is a web application, its
+interface could display a "Source" link that leads users to an archive
+of the code.  There are many ways you could offer source, and different
+solutions will be better for different programs; see section 13 for the
+specific requirements.
+
+  You should also get your employer (if you work as a programmer) or school,
+if any, to sign a "copyright disclaimer" for the program, if necessary.
+For more information on this, and how to apply and follow the GNU AGPL, see
+<https://www.gnu.org/licenses/>.
diff --git a/README.md b/README.md
index 36ff322..8fffb55 100644
--- a/README.md
+++ b/README.md
@@ -1,201 +1,175 @@
-![next-gdrive-index](./public/og.png)
+![E:\Dev Project\drive-manager\public\og.png](file:///e%3A/Dev%20Project/drive-manager/public/og.png)
 
 <p align='center'>
-  <a href='https://drive-demo.mbaharip.com'>Demo</a>
-  ·
-  <a href='https://github.com/mbahArip/next-gdrive-index/wiki/Deploying'>Deploying Guide</a>
-  ·
-  <a href='https://github.com/mbahArip/next-gdrive-index/wiki/FAQ'>FAQ</a>
+	<a href='https://drive-demo.mbaharip.com' target='_blank'>Demo Site</a>
+		·
+	<a href='https://drive-demo.mbaharip.com/deploy' target='_blank'>Deploy / Version Upgrade Guide</a>
+		·
+	<a href='https://github.com/mbahArip/next-gdrive-index/wiki/FAQ' target='_blank'>FAQ</a>
+</p>
+<p align='center'>
+	<img src='https://img.shields.io/github/package-json/v/mbaharip/next-gdrive-index?label=prod' alt='Demo version' />
+	<img src='https://img.shields.io/github/package-json/v/mbaharip/next-gdrive-index/v2?label=dev' alt='Dev' />
 </p>
 
-## Version 2 is here!
+---
 
-It seems there are some bugs on mobile devices that prevent the files list from rendering properly.  
-So I will use this chance to upgrade the project to `Next.js 14`, use `shadcn/ui`, and also add some new features.
+<!-- Generate TOC -->
 
-There also some changes on the configuration file, so make sure to read the [Migration Guide](#migration-guide) if you're upgrading from version 1.x.
+## Table of Contents
 
-Here's what changed in version 2:
-
-### New Features
-
-- **Theme Select**, light mode? dark mode? you choose.
-- **[shadcn/ui](https://ui.shadcn.com/)**, change the UI library to `shadcn/ui`.
-- **Faster Response Time**, added cache to improve the response time.
-- **Revalidate Data**, data fetching now utilizing revalidate. (can be changed from config file)
-  > You can manually revalidate the data by sending POST request to `/api/revalidate` with `Authorization` header set to `{{ process.env.SITE_PASSWORD }}`.
-
-### Changed
-
-- **General Layout**, New fresh look with `shadcn/ui`.
-- **Download Link**, Added token that will be expired after x hour(s). (can be changed from config file)
-- **Raw Link**, Raw link only available for image, video, and audio files. Raw link are recommended for hosting web project assets or comments on forum.
-- **Footer**, now you can customize the footer from config file, also added support for Markdown.
-- **Data Fetching**, now using `Server Actions` instead of `API Routes`.
-- **Encryption**, moved to `Server Actions`.
-- **Typescript Config**, target changed from `ES5` to `ES2021`.
-- **Environment Variable**, now focus on Server Side Environment Variable.
-  - `NEXT_PUBLIC_ENCRYPTION_KEY` changed to `ENCRYPTION_KEY`.
-  - `NEXT_PUBLIC_SITE_PASSWORD` changed to `SITE_PASSWORD`.
-  - `MASTER_KEY` added.
-- **Configuration File**, things are changed:
-  - `version` bumped to `2.0`.
-  - `masterKey` moved to `Environment Variable`.
-  - `apiConfig.revalidate` added.
-  - `siteConfig.siteNameTemplate` added.
-  - `siteConfig.siteAuthor` added.
-  - `siteConfig.robots` added.
-  - `siteConfig.footer` added.
-  - `siteConfig.defaultAccentColor` deprecated.
-  - `siteConfig.breadcrumbMax` added.
-  - `siteConfig.toaster` added.
-  - `siteConfig.navbarItems[number].icons` changed to `lucide icons`.
-  - `siteConfig.supports` added.
-
-### Fixed
-
-- Rendering issue on mobile devices.
-
-### Dependency Update
-
-- `@iconify/react` switched to `lucide-react`.
-- `@mdx-js/loader` removed.
-- `@mdx-js/react` removed.
-- `@next/mdx` removed.
-- `@popperjs/core` removed.
-- `next` updated to `^14.1.4`.
-- `next-seo` removed.
-- `tailwind-merge` updated to `^2.2.2`.
+- [What is this?](#what-is-this)
+- [Why I made this?](#why-i-made-this)
+- [Features](#features)
+- [Known Issues](#known-issues)
+  - [File size limit](#file-size-limit)
+  - [No support for Google Docs, Sheets, and Slides](#no-support-for-google-docs-sheets-and-slides)
+  - [Can't seek on audio and video preview](#cant-seek-on-audio-and-video-preview)
+  - [Shared Drive is not supported](#shared-drive-is-not-supported)
+- [Might be Implemented](#might-be-implemented)
+  - [Internationalization / i18n](#internationalization--i18n)
+  - [Multiple drive](#multiple-drive)
+  - [Authentication](#authentication)
+- [Running on Local](#running-on-local)
+- [How to Contribute](#how-to-contribute)
+- [Support and Donations](#support-and-donations)
+- [License](#license)
 
 ## What is this?
 
-`next-gdrive-index` is an indexer for Google Drive, it's a simple project that I made to index my files in Google Drive.  
-It's aim to simplify the process of sharing files using Google Drive, and also implements some features that I think is useful for sharing files.
+`next-gdrive-index` is a Google Drive directory index.
+The aim of this project is to simplify the process of sharing files using Google Drive, and also add some features that _I think_ is useful when sharing a files.
 
-This project are **HEAVILY INSPIRED** by [onedrive-vercel-index](https://github.com/spencerwooo/onedrive-vercel-index) by SpencerWooo.
+> This project are **HEAVILY INSPIRED** by [onedrive-vercel-index](https://github.com/spencerwooo/onedrive-vercel-index) by [SpencerWooo](https://github.com/spencerwooo).
 
-### Why I made this?
+## Why I made this?
 
-when I compare the price between these two services, Google Drive still cheaper than Onedrive.  
-For 100GB plan, Google Drive is IDR 269.000 / ~$18 USD annually, and Onedrive is IDR 319.000 / ~$21 USD annually.  
-For free plan, Google Drive offering 15GB of storage, and Onedrive offering 5GB of storage.
+> **TLDR;**
+> It is cheaper to use Google Drive than other similar service
 
-I know there are a lot of people selling cheap edu account for Google Drive and Onedrive, but most of the time those account doesn't last long, especially Google Drive account. So I want to do it legit without buying cheap edu account or anything similar this time.
+There are a lot cloud storage service like Onedrive, Dropbox, Mega, etc.
+But, between all those service, I think Google Drive is a lot cheaper than others (at least in my region).
+
+Here are the pricing comparison between free and cheapest plan
+_Price are converted to IDR, since it's easier for me to compare this using my own currency_
+
+| Service          | Free plan       | Paid plan | Price                  | Price to Storage                            | Transfer Quota |
+| :--------------- | :-------------- | :-------- | :--------------------- | :------------------------------------------ | :------------: |
+| **Google Drive** | 15GB            | 2TB       | 135k IDR<br>~112k IDR  | <u>14.8GB / 1k / mo<br>17.8GB / 1k / yr</u> |  **<u>X</u>**  |
+| **Onedrive**\*\* | 5GB             | 1TB       | 96k IDR<br>80k IDR     | 10.4GB / 1k / mo<br>12.5GB / 1k / yr        |  **<u>X</u>**  |
+| **Dropbox**\*    | 2GB             | 2TB       | ~191k IDR<br>~159k IDR | 10.5GB / 1k / mo<br>12.5GB / 1k / yr        |       O        |
+| **MEGA**         | **<u>20GB</u>** | 2TB       | ~174k IDR<br>~145k IDR | 11.5GB / 1k / mo<br>13.8GB / 1k / yr        |       O        |
+
+\* Price are in USD, and there are no regional price for IDR
+\*\* There are no 2TB plan
+
+By using this data, I picked Google Drive instead other service.
+I know there are a lot of people selling cheap education account especially for Google Drive and Onedrive, but most of the time <u>those account doesn't last long</u>.
 
 ## Features
 
-- **Private Index**, lock the whole index site with password.
-- **Folder and file protection**, you can protect your folder and files with password.
-- **Readme file**, you can add readme file for your folder, so you can add some description for your folder.
-- **File preview**, you can preview some file types directly from the browser, without downloading it first.
+- **Private Index**, protect the whole site with a password
+- **Folder and file protection**, protect certain path with a password
+- **Readme file**, add description (or whatever) inside a readme to be rendered when you open the folder
+- **File preview**, preview the file before download ( Preview file size limit can be adjusted )
   - Image preview
   - Video preview
   - Audio preview
-  - Markdown preview
-  - PDF preview
-  - Document preview (docx, pptx, xlsx)
-  - Code preview
-  - Text preview
+  - Document preview
+  - Code / Text / Markdown preview
   - Manga preview (cbz)
-- **File search**, you can search for files and folders easily.
-- **Direct download**, you can download files directly from index site without opening Google Drive.
-- **Raw file link**, you can use the raw file link for hosting your web project assets or comments on forum.
+- **File search**, search by the file or folder name
+- **Direct download**, download directly via API route instead of google drive link ( Size limit can be adjusted )
+- **Raw file link**, embed your media files
+- **Light/Dark mode**, choose your side!
+- **Customizable Theme**, we are using `shadcn/ui` now! you can customize your site [https;//drive-demo.mbaharip.com/deploy#theme]
+- **Links**, add social, or information link on the navbar
+- **Sponsors**, using this for thing for community? add a sponsor / donate button on your navbar!
 
-## File Security
-
-> This only apply if `maxFileSize` is enabled.
-
-You need to set the file sharing permission to `Anyone with the link can view` for the files that you want to share.
-
-**Why?** because the download link will be redirected to the Google Drive download link, and it can only be accessed if the file is shared with `Anyone with the link can view` permission.
-
-If not, the download link will be redirected to the Google Drive web content link, and it can be accessed without sharing the file.
-
-But this might expose the file ID, so people might be able to access the files directly from Google Drive. (But I'm sure they can't access the folder itself, only the file that are being downloaded)
-
-## Known Issue
+## Known Issues
 
 ### File size limit
 
-> This only apply if you're using platform that have file size limit, like Vercel.  
-> If you're using VPS or other platform that doesn't have file size limit, you can disable `maxFileSize` inside config file.
+> This only apply if `maxFileSize` is enabled / more than 0
 
-File size limit causing some files can't be previewed, and the download will be redirected to the raw file link.  
-**This won't be fixed**, because it's a limitation from the deployment platform itself.
+You need to set the file sharing permission to `Anyone with the link can view` on the root folder.
 
-### Long Response Time
+**Why?**
+The download link will be redirected if the file you're trying to download is bigger than the `maxFileSize`, and most of platform are limiting the response body size (ex: Vercel limit is 4MB).  
+If you don't set the permission, people can't access or download the file.
 
-From version 2.0, We are using Cache to improve the response time.  
-It might take a long time for deep nested folders, but once the data is fetched, it will be cached and the response time will be faster.
-
-I also add [revalidate](https://nextjs.org/docs/app/building-your-application/data-fetching/fetching-caching-and-revalidating#revalidating-data) config on page file to 5 minutes. You can change the value inside `src/app/page.tsx` & `src/app/[...rest]/page.tsx`.
-
-~~The flow of the project are:~~
-
-- ~~Validate the path is valid or not. (Only applied for `/...[path]`)~~
-- ~~Fetch the password, readme, and files from Google Drive.~~
-- ~~Show to the user.~~
-
-~~So, if you have a lot of files in your Google Drive, it might take a long time to fetch all the files.  
-To improve the response time, I added a cache to the response, so the next time you access the same path, it will be faster.~~
-
-~~ATM, it roughly take around 600 - 2 seconds to fetch all the data on my Google Drive.~~
-
-### Can't seek on audio and video preview
-
-It looks like the audio and video preview can't seek, so you need to listen/watch from the beginning.  
-I'm still looking for a solution for this.
-
-### ~~Shared Drive is now supported~~
-
-~~I don't have Google Shared Drive, so I can't test it and implement it.~~  
-Implemented by [@loadingthedev](https://github.com/loadingthedev) [(PR #4)](https://github.com/mbahArip/next-gdrive-index/pull/4)
+This will <u>expose the file ID</u>, and people can access the file directly from Google Drive.  
+But it <u>only apply to the file</u>, and they can't see or browse the folder directly from Google Drive.
 
 ### No support for Google Docs, Sheets, and Slides
 
-For now, I don't have any plan to implement this, because I think it's not necessary.  
-All Google Drive files like Docs, Sheets, and Slides are hidden from the list.
+For now, I don't have any plan to implement this, because I think it's not necessary.
 
-**PR are welcome if you want to implement this.**
+### ~~Can't seek on audio and video preview~~
 
-## Migration Guide
+~~It looks like you can't seek the audio and video preview, so you need to listen / watch from the beginning.~~
+Fixed on v2.0.2
 
-If you're upgrading from version 1.x to version 2, there are some changes that you need to do:
+### ~~Shared Drive is not supported~~
 
-### Configuration File
+~~I don't have Shared Drive, so I can't test it and implement it~~
+Implemented by [@loadingthedev](https://github.com/loadingthedev) [(PR #4)](https://github.com/mbahArip/next-gdrive-index/pull/4)
 
-> You can check the new Configuration Schema on `/src/schema.ts`
+## Might be Implemented
 
-There are some changes on the configuration file, here's the list of changes:
+Here are things that I want, and might be implemented on the future
 
-- `masterKey` **REMOVED**, we don't need this anymore
+### Internationalization / i18n
 
-- `apiConfig.rootFolder` **CHANGED**, you need to encrypt the folder ID on your localhost first  
-  `http://localhost:3000/api/internal/encrypt?q={{ folderId }}`
+It should be a good idea to have the site and deploying guide with multiple language support.
 
-- `apiConfig.proxyThumbnail` **ADDED**, default value is `true`
-- `siteConfig.siteNameTemplate` **ADDED**, default value is `%s - next-gdrive-index`
-- `siteConfig.siteAuthor` **ADDED**, default value is `mbahArip`
-- `siteConfig.robots` **ADDED**, default value is `noindex, nofollow`
-- `siteConfig.footer` **ADDED**, default value is `Powered by next-gdrive-index`
-- `siteConfig.defaultAccentColor` **REMOVED**, you can set the theme from `/src/app/globals.css` (more information about [shadcn/ui theme](https://ui.shadcn.com/docs/theming))
-- `siteConfig.breadcrumbMax` **ADDED**, default value is `3`
-- `siteConfig.toaster` **ADDED**, default value is `{ position: "bottom-right', duration: 3000 }`
-- `siteConfig.navbarItems[number].icons` **CHANGED**, you need to use [Lucide Icons](https://lucide.dev/icons) now
-- `siteConfig.supports` **ADDED**, you can leave it empty if you don't want to use it
+### Multiple drive
 
-### Environment Variable
+It's either from multiple Google Drive account with multiple Service Account, or a basic single Google Drive account with multiple root start point either in their own Drive or Shared Drive
 
-Now all the environment variable are on the server side, so you need to change the environment variable:
+### Authentication
 
-- `NEXT_PUBLIC_ENCRYPTION_KEY` **CHANGED** to `ENCRYPTION_KEY`
-- `NEXT_PUBLIC_SITE_PASSWORD` **CHANGED** to `SITE_PASSWORD`
-- `NEXT_PUBLIC_VERCEL_URL` **CHANGED** to `NEXT_PUBLIC_DOMAIN`
+Probably a good feature if you are a content creator that only want the one who subscribed to you get the files.  
+It might need a database, but idk if I can implement it without the need of database
 
-## Sponsors and Donations
+## Running on Local
+
+- **Clone the repository**
+  `git clone https://github.com/mbaharip/next-gdrive-index.git`
+  `cd next-gdrive-index`
+- **Install required dependencies**
+  `npm install`
+  `yarn install`
+- **Add environment file**
+  - **Using Configuration**
+    - Open [Deploy guide page](https://drive-demo.mbaharip.com/deploy#config)
+    - Scroll to the bottom to see the configuration form
+    - Fill out the form and download the file
+    - Extract the `.env` file to the root folder
+  - **Using example file**
+    - `cp .env.example .env`
+    - Fill out everything
+- Run the app
+  `npm run dev`
+  `yarn dev`
+- Check the app on `http://localhost:3000`
+
+## How to Contribute
+
+Want to add new feature or improve the existing one? or you find a bug and fixed it yourself?
+
+- Please check the issue tab first to see if someone already reporting a bug, or if you want to check any new feature / enhancement that not yet implemented
+- Use code base from `v2` branch instead of the `main`, since it was made for development on current version
+- Create a Pull Request, and wait for me checking your code
+
+## Support and Donations
 
 If you think I deserve it, you can support me by:
 
 - [Paypal (USD)](https://paypal.me/mbaharip)
 - [Ko-fi (USD)](https://ko-fi.com/mbaharip)
 - [Saweria (IDR)](https://saweria.co/mbaharip)
+
+## License
+
+This project is licensed under the AGPL-3.0 License - see the [LICENSE](LICENSE) file for details.

From 9d27ae76bb93d9bac048d299ed6655823939b791 Mon Sep 17 00:00:00 2001
From: mbaharip <62494292+mbahArip@users.noreply.github.com>
Date: Sat, 18 May 2024 18:43:37 +0700
Subject: [PATCH 20/20] Fix banner

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 8fffb55..21d862f 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-![E:\Dev Project\drive-manager\public\og.png](file:///e%3A/Dev%20Project/drive-manager/public/og.png)
+![banner](/public/og.png)
 
 <p align='center'>
 	<a href='https://drive-demo.mbaharip.com' target='_blank'>Demo Site</a>