From a82977105e44bbe600a31e98cb1dc491fbf20e19 Mon Sep 17 00:00:00 2001
From: hanif salafi <hanifsalafi456@gmail.com>
Date: Sat, 7 Dec 2024 23:32:39 +0700
Subject: [PATCH] feat: fixing layout, sidebar, etc on Admin

---
 components/landing-page/Navbar.tsx            |  2 ++
 components/logo.tsx                           |  4 +--
 components/partials/footer/index.tsx          | 10 +------
 .../partials/header/locale-switcher.tsx       |  4 +--
 .../partials/sidebar/common/menu-item.tsx     |  2 +-
 .../partials/sidebar/menu/menu-classic.tsx    |  8 +++---
 .../partials/sidebar/sidebar-content.tsx      |  4 +--
 .../partials/sidebar/sidebar-hover-toggle.tsx |  2 +-
 .../partials/sidebar/sidebar-toggle.tsx       |  2 +-
 hooks/use-config.ts                           |  2 +-
 lib/menus.ts                                  | 28 +++++++++----------
 messages/en.json                              | 12 ++++++++
 messages/in.json                              | 12 ++++++++
 package-lock.json                             |  3 ++
 14 files changed, 58 insertions(+), 37 deletions(-)

diff --git a/components/landing-page/Navbar.tsx b/components/landing-page/Navbar.tsx
index 0efd812c..07e5afd5 100644
--- a/components/landing-page/Navbar.tsx
+++ b/components/landing-page/Navbar.tsx
@@ -1,3 +1,5 @@
+"use client"
+
 import React, { useState } from "react";
 import ThemeSwitcher from "@/components/partials/header/theme-switcher";
 import {
diff --git a/components/logo.tsx b/components/logo.tsx
index 130e98d1..ae258f42 100644
--- a/components/logo.tsx
+++ b/components/logo.tsx
@@ -25,12 +25,12 @@ const Logo = () => {
   if (config.sidebar === "two-column" || !isDesktop) return null;
 
   return (
-    <Link href="/dashboard/analytics" className="flex gap-2 items-center    ">
+    <Link href="/" className="flex items-center">
       {/* <DashCodeLogo className="  text-default-900 h-8 w-8 [&>path:nth-child(3)]:text-background [&>path:nth-child(2)]:text-background" />
       {(!config?.collapsed || hovered) && (
         <h1 className="text-xl font-semibold text-default-900 ">D</h1>
       )} */}
-      <img src="/../images/all-img/mediahub-logo.png" alt="logo" width={150} />
+      <img className="w-100" src="/../images/all-img/mediahub-logo.png" alt="logo" width={150} />
     </Link>
   );
 };
diff --git a/components/partials/footer/index.tsx b/components/partials/footer/index.tsx
index 0dafb785..4d54d40f 100644
--- a/components/partials/footer/index.tsx
+++ b/components/partials/footer/index.tsx
@@ -11,17 +11,9 @@ const DashCodeFooter = async () => {
         <FooterContent>
             <div className=' md:flex  justify-between text-default-600 hidden'>
                 <div className="text-center ltr:md:text-start rtl:md:text-right text-sm">
-                    COPYRIGHT &copy; {new Date().getFullYear()} DashCode, All rights Reserved
                 </div>
                 <div className="ltr:md:text-right rtl:md:text-end text-center text-sm">
-                    Hand-crafted & Made by{" "}
-                    <a
-                        href="https://codeshaper.net"
-                        target="_blank"
-                        className="text-primary font-semibold"
-                    >
-                        Codeshaper
-                    </a>
+                    COPYRIGHT &copy; {new Date().getFullYear()} Media Hub, All rights Reserved
                 </div>
             </div>
             <div className='flex md:hidden justify-around items-center'>
diff --git a/components/partials/header/locale-switcher.tsx b/components/partials/header/locale-switcher.tsx
index daad6afd..b65a1b77 100644
--- a/components/partials/header/locale-switcher.tsx
+++ b/components/partials/header/locale-switcher.tsx
@@ -64,7 +64,7 @@ export default function LocalSwitcher() {
                         <span className='font-medium text-sm text-default-600 dark:text-default-700'>In</span>
                     </div>
                 </SelectItem>
-                <SelectItem value="ar">
+                {/* <SelectItem value="ar">
                     <div className='flex items-center gap-1'>
                         <Image
                             src="/images/all-img/flag-2.png"
@@ -75,7 +75,7 @@ export default function LocalSwitcher() {
                         />
                         <span className='font-medium text-sm text-default-600 dark:text-default-700'>Ar</span>
                     </div>
-                </SelectItem>
+                </SelectItem> */}
             </SelectContent>
         </Select>
 
diff --git a/components/partials/sidebar/common/menu-item.tsx b/components/partials/sidebar/common/menu-item.tsx
index 4e34875d..1e04826d 100644
--- a/components/partials/sidebar/common/menu-item.tsx
+++ b/components/partials/sidebar/common/menu-item.tsx
@@ -137,7 +137,7 @@ const MenuItem = ({ href, label, icon, active, id, collapsed }: MenuItemProps) =
         >
             <Link href={href}>
                 <Icon icon={icon} className={cn('h-5 w-5 ', {
-                    'me-2': !collapsed || hovered
+                    'me-4': !collapsed || hovered
                 })} />
                 {(!collapsed || hovered) && (
                     <p
diff --git a/components/partials/sidebar/menu/menu-classic.tsx b/components/partials/sidebar/menu/menu-classic.tsx
index 3ba36747..4fdae2b2 100644
--- a/components/partials/sidebar/menu/menu-classic.tsx
+++ b/components/partials/sidebar/menu/menu-classic.tsx
@@ -61,7 +61,7 @@ export function MenuClassic({ }) {
     return (
         <>
             {isDesktop && (
-                <div className="flex items-center justify-between  px-4 py-4">
+                <div className="flex items-center justify-center mt-2 px-4 py-4">
                     <Logo />
                     <SidebarHoverToggle />
                 </div>
@@ -71,7 +71,7 @@ export function MenuClassic({ }) {
 
 
             <ScrollArea className="[&>div>div[style]]:!block" dir={direction}>
-                {isDesktop && (
+                {/* {isDesktop && (
                     <div className={cn(' space-y-3 mt-6 ', {
                         'px-4': !collapsed || hovered,
                         'text-center': collapsed || !hovered
@@ -81,9 +81,9 @@ export function MenuClassic({ }) {
                         <SearchBar />
                     </div>
 
-                )}
+                )} */}
 
-                <nav className="mt-8 h-full w-full">
+                <nav className="mt-4 h-full w-full">
                     <ul className=" h-full flex flex-col min-h-[calc(100vh-48px-36px-16px-32px)] lg:min-h-[calc(100vh-32px-40px-32px)] items-start space-y-1 px-4">
                         {menuList?.map(({ groupLabel, menus }, index) => (
                             <li className={cn("w-full", groupLabel ? "" : "")} key={index}>
diff --git a/components/partials/sidebar/sidebar-content.tsx b/components/partials/sidebar/sidebar-content.tsx
index bdc49864..d7e02610 100644
--- a/components/partials/sidebar/sidebar-content.tsx
+++ b/components/partials/sidebar/sidebar-content.tsx
@@ -31,8 +31,8 @@ const SidebarContent = ({ children }: { children: React.ReactNode }) => {
 
     return (
         <aside
-            onMouseEnter={() => config.sidebar === 'classic' && setHoverConfig({ hovered: true })}
-            onMouseLeave={() => config.sidebar === 'classic' && setHoverConfig({ hovered: false })}
+            onMouseEnter={() => config.sidebar === 'draggable' && setHoverConfig({ hovered: true })}
+            onMouseLeave={() => config.sidebar === 'draggable' && setHoverConfig({ hovered: false })}
 
             className={cn('fixed  z-50 w-[248px]  bg-sidebar  shadow-base    xl:block hidden ', sidebarTheme, {
                 'w-[72px]': config.collapsed && config.sidebar !== 'compact',
diff --git a/components/partials/sidebar/sidebar-hover-toggle.tsx b/components/partials/sidebar/sidebar-hover-toggle.tsx
index 8f5a931e..c380dcb9 100644
--- a/components/partials/sidebar/sidebar-hover-toggle.tsx
+++ b/components/partials/sidebar/sidebar-hover-toggle.tsx
@@ -11,7 +11,7 @@ const SidebarHoverToggle = () => {
     const [config, setConfig] = useConfig();
 
     const isDesktop = useMediaQuery("(min-width: 1280px)");
-    if (config.sidebar !== 'classic' || !isDesktop) {
+    if (config.sidebar !== 'draggable' || !isDesktop) {
         return null
 
     }
diff --git a/components/partials/sidebar/sidebar-toggle.tsx b/components/partials/sidebar/sidebar-toggle.tsx
index ba6835f3..33e1c30f 100644
--- a/components/partials/sidebar/sidebar-toggle.tsx
+++ b/components/partials/sidebar/sidebar-toggle.tsx
@@ -14,7 +14,7 @@ export function SidebarToggle() {
     const collapsed = config.collapsed
     const isDesktop = useMediaQuery('(min-width: 1280px)')
     if (!isDesktop) return null
-    if (config.sidebar === 'two-column' && !config.hasSubMenu || config.menuHidden || config.layout === "horizontal" || config.sidebar === 'classic') {
+    if (config.sidebar === 'two-column' && !config.hasSubMenu || config.menuHidden || config.layout === "horizontal" || config.sidebar === 'draggable' ) {
         return null
     }
     if (config.sidebar === 'two-column') {
diff --git a/hooks/use-config.ts b/hooks/use-config.ts
index 127efd58..9eeb3754 100644
--- a/hooks/use-config.ts
+++ b/hooks/use-config.ts
@@ -42,7 +42,7 @@ export const defaultConfig: Config = {
   showSwitcher: true,
   subMenu: false,
   hasSubMenu: false,
-  sidebarTheme: 'light',
+  sidebarTheme: 'dark',
   headerTheme: 'light',
   sidebarBgImage: undefined,
   radius: 0.5,
diff --git a/lib/menus.ts b/lib/menus.ts
index 881d1242..e21c3058 100644
--- a/lib/menus.ts
+++ b/lib/menus.ts
@@ -31,7 +31,7 @@ export type Group = {
 export function getMenuList(pathname: string, t: any): Group[] {
   return [
     {
-      groupLabel: t("dashboard"),
+      groupLabel: t("apps"),
       id: "dashboard",
       menus: [
         {
@@ -51,34 +51,34 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "content",
           href: "/content/image",
-          label: "konten",
+          label: t("content"),
           active: pathname.includes("/content"),
           icon: "line-md:youtube",
           submenus: [
             {
               href: "/content/image",
-              label: "image",
+              label: t("image"),
               active: pathname === "/content/image",
               icon: "ic:outline-image",
               children: [],
             },
             {
               href: "/content/audio-visual",
-              label: "audio visual",
+              label: t("video"),
               active: pathname === "/content/audio-visual",
               icon: "line-md:youtube",
               children: [],
             },
             {
               href: "/content/teks",
-              label: "teks",
+              label: t("text"),
               active: pathname === "/content/teks",
               icon: "heroicons:document",
               children: [],
             },
             {
               href: "/content/audio",
-              label: "audio",
+              label: t("audio"),
               active: pathname === "/content/audio",
               icon: "heroicons:share",
               children: [],
@@ -108,7 +108,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "agenda-setting",
           href: "/agenda-setting",
-          label: "agenda setting",
+          label: t("agenda-setting"),
           active: pathname.includes("/agenda-setting"),
           icon: "iconoir:journal-page",
           submenus: [],
@@ -122,7 +122,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "planning",
           href: "/planning",
-          label: "perencanaan",
+          label: t("planning"),
           active: pathname.includes("/planning"),
           icon: "pajamas:planning",
           submenus: [
@@ -151,7 +151,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "task",
           href: "/task",
-          label: "penugasan",
+          label: t("task"),
           active: pathname.includes("/task"),
           icon: "fluent:clipboard-task-add-24-regular",
           submenus: [],
@@ -165,7 +165,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "schedule",
           href: "/schedule",
-          label: "schedule",
+          label: t("schedule"),
           active: pathname.includes("/schedule"),
           icon: "uil:schedule",
           submenus: [
@@ -201,7 +201,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "blog",
           href: "/blog",
-          label: "indeks",
+          label: t("blog"),
           active: pathname.includes("/blog"),
           icon: "fluent:clipboard-text-32-regular",
           submenus: [],
@@ -215,7 +215,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "curatedcontent",
           href: "/curated-content",
-          label: "kurasi konten",
+          label: t("curated-content"),
           active: pathname.includes("/curated-content"),
           icon: "pixelarticons:calendar-text",
           submenus: [],
@@ -229,7 +229,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "communication",
           href: "/communication",
-          label: "komunikasi",
+          label: t("communication"),
           active: pathname.includes("/communication"),
           icon: "token:chat",
           submenus: [],
@@ -243,7 +243,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
         {
           id: "contest",
           href: "/contest",
-          label: "lomba",
+          label: t("contest"),
           active: pathname.includes("/contest"),
           icon: "ic:outline-emoji-events",
           submenus: [],
diff --git a/messages/en.json b/messages/en.json
index 18df9712..44792f82 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -125,6 +125,18 @@
   },
   "Menu": {
     "dashboard": "Dashboard",
+    "content": "Content",
+    "image": "Image",
+    "video": "Video",
+    "audio": "Audio",
+    "text": "Text",
+    "agenda-setting": "Agenda Setting",
+    "task": "Task",
+    "planning": "Planning",
+    "schedule": "Schedule",
+    "curated-content": "Curated Content",
+    "communication": "Communication",
+    "contest": "Contest",
     "analytics": "Analytics",
     "banking": "Banking",
     "crm": "Crm",
diff --git a/messages/in.json b/messages/in.json
index 18df9712..f1c4c2ad 100644
--- a/messages/in.json
+++ b/messages/in.json
@@ -125,6 +125,18 @@
   },
   "Menu": {
     "dashboard": "Dashboard",
+    "content": "Konten",
+    "image": "Foto",
+    "video": "Audio Visual",
+    "audio": "Audio",
+    "text": "Teks",
+    "agenda-setting": "Agenda Setting",
+    "task": "Penugasan",
+    "planning": "Perencanaan",
+    "schedule": "Jadwal",
+    "curated-content": "Kurasi Konten",
+    "communication": "Komunikasi",
+    "contest": "Kontes",
     "analytics": "Analytics",
     "banking": "Banking",
     "crm": "Crm",
diff --git a/package-lock.json b/package-lock.json
index 0526a8be..71f0e2e6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -6638,6 +6638,7 @@
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
       "hasInstallScript": true,
       "optional": true,
       "os": [
@@ -8551,6 +8552,7 @@
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz",
       "integrity": "sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==",
+      "dev": true,
       "engines": {
         "node": ">=14"
       },
@@ -13149,6 +13151,7 @@
       "version": "3.4.16",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.16.tgz",
       "integrity": "sha512-TI4Cyx7gDiZ6r44ewaJmt0o6BrMCT5aK5e0rmJ/G9Xq3w7CX/5VXl/zIPEJZFUK5VEqwByyhqNPycPlvcK4ZNw==",
+      "dev": true,
       "dependencies": {
         "@alloc/quick-lru": "^5.2.0",
         "arg": "^5.0.2",