feat: add mobile dashboard menu, make dashboard pages responsive

This commit is contained in:
swve 2024-10-23 12:03:45 +02:00
parent 56d2007181
commit 3014817d95
13 changed files with 416 additions and 340 deletions

View file

@ -1,8 +1,10 @@
'use client';
import LeftMenu from '@components/Dashboard/UI/LeftMenu'
import DashLeftMenu from '@components/Dashboard/UI/DashLeftMenu'
import DashMobileMenu from '@components/Dashboard/UI/DashMobileMenu'
import AdminAuthorization from '@components/Security/AdminAuthorization'
import { SessionProvider } from 'next-auth/react'
import React from 'react'
import React, { useState, useEffect } from 'react'
import { useMediaQuery } from 'usehooks-ts';
function ClientAdminLayout({
children,
@ -11,11 +13,17 @@ function ClientAdminLayout({
children: React.ReactNode
params: any
}) {
const isMobile = useMediaQuery('(max-width: 768px)')
return (
<SessionProvider>
<AdminAuthorization authorizationMode="page">
<div className="flex">
<LeftMenu />
<div className="flex flex-col md:flex-row">
{isMobile ? (
<DashMobileMenu />
) : (
<DashLeftMenu />
)}
<div className="flex w-full">{children}</div>
</div>
</AdminAuthorization>
@ -23,4 +31,4 @@ function ClientAdminLayout({
)
}
export default ClientAdminLayout
export default ClientAdminLayout