mediahub
/
mediahub-fe
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: fixing layout, sidebar, etc on Admin

This commit is contained in:
hanif salafi 2024-12-07 23:32:39 +07:00
parent 1a7732bf3f
commit a82977105e
14 changed files with 58 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/landing-page/Navbar.tsx
View File

@ -1,3 +1,5 @@
"use client"
import React, { useState } from "react";
import ThemeSwitcher from "@/components/partials/header/theme-switcher";
import {

4
components/logo.tsx
View File

@ -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>
);
};

10
components/partials/footer/index.tsx
View File

@ -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'>

4
components/partials/header/locale-switcher.tsx
View File

@ -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>

2
components/partials/sidebar/common/menu-item.tsx
View File

@ -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

8
components/partials/sidebar/menu/menu-classic.tsx
View File

@ -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}>

4
components/partials/sidebar/sidebar-content.tsx
View File

@ -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',

2
components/partials/sidebar/sidebar-hover-toggle.tsx
View File

@ -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
}

2
components/partials/sidebar/sidebar-toggle.tsx
View File

@ -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') {

2
hooks/use-config.ts
View File

@ -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,

28
lib/menus.ts
View File

@ -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: [],

12
messages/en.json
View File

@ -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",

12
messages/in.json
View File

@ -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",

3
package-lock.json generated
View File

@ -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",