From 9035a03f191e1461f4c51657cf87b50c1ec128e9 Mon Sep 17 00:00:00 2001 From: Mahyar Khanbolooki Date: Tue, 12 Aug 2025 16:57:33 +0330 Subject: [PATCH] refactor: main layout --- src/components/menu/SideMenu.tsx | 11 ++++--- .../wrapper/ClientMenuRouteWrapper.tsx.tsx | 31 +++++++++++-------- 2 files changed, 25 insertions(+), 17 deletions(-) diff --git a/src/components/menu/SideMenu.tsx b/src/components/menu/SideMenu.tsx index 03d80ef..77b5ef3 100644 --- a/src/components/menu/SideMenu.tsx +++ b/src/components/menu/SideMenu.tsx @@ -156,12 +156,15 @@ function SideMenu({ menuState, toggleMenuState, nightModeState, togglenightModeS ) })}
  • - }> - +
  • diff --git a/src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx b/src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx index 1be105c..35bea60 100644 --- a/src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx +++ b/src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx @@ -1,39 +1,44 @@ 'use client'; -import React, { useState } from 'react' +import React, { useEffect } from 'react' import TopBar from '../topbar/TopBar' import SideMenu from '../menu/SideMenu' import BottomNavBar from '../navigation/BottomNavBar' +import useToggle from '@/hooks/helpers/useToggle'; +import { usePathname } from 'next/navigation'; type Props = {} & React.AllHTMLAttributes function ClientMenuRouteWrapper({ children }: Props) { - const [profileDrop, setProfileDrop] = useState(false); - const [nightMode, setNightMode] = useState(false); - const [menuState, setMenuState] = useState(false); - const [searchModal, setSearchModal] = useState(false); + const { state: profileDrop, toggle: _toggleProfileDrop } = useToggle(false); + const { state: nightMode, toggle: _toggleNightMode } = useToggle(false); + const { state: menuState, toggle: _toggleMenuState, set: setMenuState } = useToggle(false); + const { state: searchModal, toggle: _toggleSearchModal } = useToggle(false); const toggleProfileDrop = () => { - setProfileDrop((state) => !state); + _toggleProfileDrop(); } const toggleNightMode = () => { - setNightMode((state) => !state); + _toggleNightMode(); } const toggleMenuState = () => { - setMenuState((state) => !state); + _toggleMenuState(); } const toggleSearchModal = () => { - setSearchModal((state) => !state); + _toggleSearchModal(); } - // const location = useRouter(); + const location = usePathname(); - // useEffect(() => { - // setMenuState(false) - // }, [location]) + useEffect(() => { + if (menuState) { + setMenuState(false) + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [location]) return (