feat: add api and adjust spacing ui

app/[locale]/(protected)/app/chat/layout copy.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/app/email/layout copy.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/app/kanban/kanban-app.tsx

@@ -14,7 +14,7 @@ import {
 import { SortableContext, arrayMove } from "@dnd-kit/sortable";
 import ColumnContainer from "./column"
 import TaskCard from './task';
-import { createPortal } from "react-dom";
+// import { createPortal } from "react-dom";
 import AddBoard from './add-board';
 import CreateTask from "./create-task";
 import { useTranslations } from 'next-intl';
@@ -147,7 +147,7 @@ const KanBanApp = ({ defaultCols, defaultTasks }: { defaultCols: Column[], defau
                         </div>
                     </div>
 
-                    {createPortal(
+                    {/* {createPortal(
                         <DragOverlay>
                             {activeColumn && (
                                 <ColumnContainer
@@ -159,7 +159,7 @@ const KanBanApp = ({ defaultCols, defaultTasks }: { defaultCols: Column[], defau
                             {activeTask && <TaskCard task={activeTask} />}
                         </DragOverlay>,
                         document.body
-                    )}
+                    )} */}
                 </DndContext>
             </div>
             <CreateTask

app/[locale]/(protected)/app/kanban/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/app/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/blocks/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/changelog/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/charts/appex-charts/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/charts/chart-js/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/charts/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/charts/rechart/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/accordion/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/alert-dialog/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/alert/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/avatar/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/badge/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/breadcrumb/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/button/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/calendar/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/card/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/carousel/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/collapsible/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/colors/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/context-menu/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/dialog/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/drawer/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/dropdown/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/hover-card/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/menu-bar/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/navigation-menu/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/pagination/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/popover/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/progress/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/resizable/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/scroll-area/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/separator/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/sheet/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/skeleton/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/sonner/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/tabs/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/toast/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/toggle/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/tooltip/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/components/typography/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/contributor/content/audio/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/contributor/content/image/components/columns.tsx

@@ -12,6 +12,7 @@ import {
 import { Button } from "@/components/ui/button";
 import { Badge } from "@/components/ui/badge";
 import { format } from "date-fns";
+import { Link } from "@/components/navigation";
 
 const columns: ColumnDef<any>[] = [
   {
@@ -139,12 +140,12 @@ const columns: ColumnDef<any>[] = [
             </Button>
           </DropdownMenuTrigger>
           <DropdownMenuContent className="p-0" align="end">
-            <a href="/contributor/task/detail/[id]">
+            <Link href={`/contributor/content/image/detail/${row.original.id}`}>
               <DropdownMenuItem className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none">
                 <Eye className="w-4 h-4 me-1.5" />
                 View
               </DropdownMenuItem>
-            </a>
+            </Link>
             <DropdownMenuItem className="p-2 border-b text-destructive bg-destructive/30  focus:bg-destructive focus:text-destructive-foreground rounded-none">
               <Trash2 className="w-4 h-4 me-1.5" />
               Delete

app/[locale]/(protected)/contributor/content/image/detail/[id]/page.tsx

@@ -0,0 +1,15 @@
+import SiteBreadcrumb from "@/components/site-breadcrumb";
+import FormImageDetail from "@/components/form/content/image-detail-form";
+
+const ImageDetailPage = async () => {
+  return (
+    <div>
+      <SiteBreadcrumb />
+      <div className="space-y-4">
+        <FormImageDetail />
+      </div>
+    </div>
+  );
+};
+
+export default ImageDetailPage;

app/[locale]/(protected)/contributor/content/image/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/contributor/content/nulis-ai/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/contributor/content/spit/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/contributor/content/teks/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/contributor/content/video/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/contributor/task/components/columns.tsx

@@ -118,10 +118,12 @@ const columns: ColumnDef<any>[] = [
                 View
               </DropdownMenuItem>
             </Link>
+            <Link href={`/contributor/task/update/${row.original.id}`}>
               <DropdownMenuItem className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none">
                 <SquarePen className="w-4 h-4 me-1.5" />
                 Edit
               </DropdownMenuItem>
+            </Link>
             <DropdownMenuItem className="p-2 border-b text-destructive bg-destructive/30  focus:bg-destructive focus:text-destructive-foreground rounded-none">
               <Trash2 className="w-4 h-4 me-1.5" />
               Delete

app/[locale]/(protected)/contributor/task/update/[id]/page.tsx

@@ -0,0 +1,18 @@
+import { Card, CardContent } from "@/components/ui/card";
+import SiteBreadcrumb from "@/components/site-breadcrumb";
+import FormTask from "@/components/form/task/task-form";
+import FormTaskDetail from "@/components/form/task/task-detail-form";
+import FormTaskEdit from "@/components/form/task/task-edit-form";
+
+const TaskDetailPage = async () => {
+  return (
+    <div>
+      <SiteBreadcrumb />
+      <div className="space-y-4">
+        <FormTaskEdit />
+      </div>
+    </div>
+  );
+};
+
+export default TaskDetailPage;

app/[locale]/(protected)/dashboard/layout.tsx

@@ -1,14 +1,16 @@
 import PageTitle from "@/components/page-title";
 import { Metadata } from "next";
+import { Suspense } from "react";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {
   return <>
       <PageTitle className="mb-6" />
-    {children}</>;
+      {children}
+  </>
 };
 
 export default Layout;

app/[locale]/(protected)/dashboard/page.tsx

@@ -1,3 +1,5 @@
+'use client'
+
 import { StatisticsBlock } from "@/components/blocks/statistics-block";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import DashboardDropdown from "@/components/dashboard-dropdown";
@@ -11,10 +13,12 @@ import BlogTable from "../contributor/blog/components/blog-table";
 import ContentTable from "./routine-task/components/content-table";
 import RecentActivity from "./routine-task/components/recent-activity";
 import { Link } from "@/components/navigation";
+import { Suspense } from "react";
 
 const DashboardPage = () => {
   const t = useTranslations("AnalyticsDashboard");
   return (
+    <Suspense>
       <div>
         <div className="my-3">
           <Tabs defaultValue="routine-task" className="w-full">
@@ -167,6 +171,7 @@ const DashboardPage = () => {
           </Tabs>
         </div>
       </div>
+    </Suspense>
   );
 };
 

app/[locale]/(protected)/ecommerce/backend/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/ecommerce/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/checkbox/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/combobox/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/command/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/form-validation/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/input-file/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/input-group/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/input-layout/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/input-mask/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/input-otp/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/input/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/radio/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/select/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/slider/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/switch/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/forms/textarea/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/icons/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/layout.tsx

@@ -4,15 +4,14 @@ import DashCodeSidebar from "@/components/partials/sidebar";
 import DashCodeFooter from "@/components/partials/footer";
 import ThemeCustomize from "@/components/partials/customizer";
 import DashCodeHeader from "@/components/partials/header";
-import { auth } from "@/lib/auth";
+import MountedProvider from "@/providers/mounted.provider";
-import { redirect } from "@/components/navigation";
+
-const layout = async ({ children }: { children: React.ReactNode }) => {
+const layout = async ({ children }: { children: React.ReactNode }) => {
-  const session = await auth();
   
-  if (!session) {
-    redirect("/");
-  }
   return (
+    <MountedProvider
+      isProtected={true} 
+    >
       <LayoutProvider>
         <ThemeCustomize />
         <DashCodeHeader />
@@ -20,6 +19,7 @@ const layout = async ({ children }: { children: React.ReactNode }) => {
         <LayoutContentProvider>{children}</LayoutContentProvider>
         <DashCodeFooter />
       </LayoutProvider>
+    </MountedProvider>
   );
 };
 

app/[locale]/(protected)/maps/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/maps/maps-vector/layer-links.tsx

@@ -8,7 +8,7 @@ const LayerLinks = ({ height = 350 }: { height?: number }) => {
   const onClick = (event: React.MouseEvent<SVGPathElement>) => {
     const name = event.currentTarget.getAttribute("name");
     if (name) {
-      window.open(`https://www.google.com/search?q=${name}%20nz`);
+     // window.open(`https://www.google.com/search?q=${name}%20nz`);
     }
   };
 

app/[locale]/(protected)/shared/curated-content/giat-routine/document/detail/[id]/page.tsx

@@ -34,6 +34,7 @@ import "swiper/css/navigation";
 import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules";
 import { Avatar, AvatarImage } from "@/components/ui/avatar";
 import JoditEditor from "jodit-react";
+import { Badge } from "@/components/ui/badge";
 
 const detailSchema = z.object({
   title: z.string().min(1, { message: "Judul diperlukan" }),
@@ -286,12 +287,19 @@ export default function DetailDocument() {
                         </div>
                       </RadioGroup>
                     </div>
-                    <div className=" py-3">
+                    <div className="py-3">
                       <div className="space-y-2">
                         <Label>Tag</Label>
-                        <p className="border rounded-md text-blue-600 px-2 py-2">
+                        <div className="flex flex-wrap gap-2">
-                          {detail?.tags}
+                          {detail?.tags?.split(",").map((tag, index) => (
-                        </p>
+                            <Badge
+                              key={index}
+                              className="border rounded-md  px-2 py-2"
+                            >
+                              {tag.trim()}
+                            </Badge>
+                          ))}
+                        </div>
                       </div>
                     </div>
                     <div className=" py-3">

app/[locale]/(protected)/shared/curated-content/giat-routine/image/detail/[id]/page.tsx

@@ -33,6 +33,7 @@ import "swiper/css";
 import "swiper/css/navigation";
 import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules";
 import { Avatar, AvatarImage } from "@/components/ui/avatar";
+import { Badge } from "@/components/ui/badge";
 
 const detailSchema = z.object({
   title: z.string().min(1, { message: "Judul diperlukan" }),
@@ -285,12 +286,19 @@ export default function DetailImage() {
                         </div>
                       </RadioGroup>
                     </div>
-                    <div className=" py-3">
+                    <div className="py-3">
                       <div className="space-y-2">
                         <Label>Tag</Label>
-                        <p className="border rounded-md text-blue-600 px-2 py-2">
+                        <div className="flex flex-wrap gap-2">
-                          {detail?.tags}
+                          {detail?.tags?.split(",").map((tag, index) => (
-                        </p>
+                            <Badge
+                              key={index}
+                              className="border rounded-md  px-2 py-2"
+                            >
+                              {tag.trim()}
+                            </Badge>
+                          ))}
+                        </div>
                       </div>
                     </div>
                     <div className=" py-3">

app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx

@@ -33,6 +33,7 @@ import "swiper/css";
 import "swiper/css/navigation";
 import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules";
 import { Avatar, AvatarImage } from "@/components/ui/avatar";
+import { Badge } from "@/components/ui/badge";
 
 const detailSchema = z.object({
   title: z.string().min(1, { message: "Judul diperlukan" }),
@@ -292,12 +293,19 @@ export default function DetailImage() {
                         </div>
                       </RadioGroup>
                     </div>
-                    <div className=" py-3">
+                    <div className="py-3">
                       <div className="space-y-2">
                         <Label>Tag</Label>
-                        <p className="border rounded-md text-blue-600 px-2 py-2">
+                        <div className="flex flex-wrap gap-2">
-                          {detail?.tags}
+                          {detail?.tags?.split(",").map((tag, index) => (
-                        </p>
+                            <Badge
+                              key={index}
+                              className="border rounded-md  px-2 py-2"
+                            >
+                              {tag.trim()}
+                            </Badge>
+                          ))}
+                        </div>
                       </div>
                     </div>
                     <div className=" py-3">

app/[locale]/(protected)/table/react-table/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/utility/blank-page/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/utility/blog/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/utility/faq/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/utility/invoice/add/layout.tsx

@@ -1,5 +1,5 @@
 export const metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 

app/[locale]/(protected)/utility/invoice/edit/layout.tsx

@@ -1,5 +1,5 @@
 export const metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 

app/[locale]/(protected)/utility/invoice/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/utility/pricing/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(protected)/utility/profile/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/(public)/error.tsx

@@ -0,0 +1,24 @@
+"use client"; // Error components must be Client Components
+
+import { useEffect } from "react";
+import { Button } from "@/components/ui/button";
+import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
+import { Info } from "lucide-react";
+
+export default function Error({ error, reset }: {
+    error: Error & { digest?: string }
+    reset: () => void
+}) {
+    return (
+        <div className="space-y-4">
+            <Alert color="destructive" variant="soft">
+                <Info className="h-5 w-5" />
+                <AlertDescription>Something went wrong!</AlertDescription>
+            </Alert>
+            <Button onClick={() => reset()} color="destructive" size="sm">
+                Try again
+            </Button>
+        </div>
+    );
+}
+

app/[locale]/(public)/layout.tsx

@@ -0,0 +1,20 @@
+import LayoutProvider from "@/providers/layout.provider";
+import LayoutContentProvider from "@/providers/content.provider";
+import DashCodeSidebar from "@/components/partials/sidebar";
+import DashCodeFooter from "@/components/partials/footer";
+import ThemeCustomize from "@/components/partials/customizer";
+import DashCodeHeader from "@/components/partials/header";
+import MountedProvider from "@/providers/mounted.provider";
+
+const layout = async ({ children }: { children: React.ReactNode }) => {
+  
+  return (
+    <MountedProvider 
+      isProtected={false} 
+    >
+      {children}
+    </MountedProvider>
+  );
+};
+
+export default layout;

app/[locale]/auth/404/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/auth/coming-soon/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/auth/forgot-password/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/auth/forgot-password2/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/auth/forgot-password3/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/auth/lock-screen/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/auth/lock-screen2/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {

app/[locale]/auth/lock-screen3/layout.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
-  title: "Dashcode Next Js",
+  title: "Media Hub | POLRI",
   description: "Dashcode is a popular dashboard template.",
 };
 const Layout = ({ children }: { children: React.ReactNode }) => {