1
1
import type { FC , PropsWithChildren , ReactNode } from "react" ;
2
- import { Fragment , useState } from "react" ;
2
+ import { Fragment , useEffect , useState } from "react" ;
3
3
import { Transition } from "@headlessui/react" ;
4
4
import { useAuth } from "../hooks/useAuth" ;
5
5
import type { Session } from "next-auth" ;
@@ -59,7 +59,7 @@ const LinkItem = (props: {
59
59
const SidebarLayout = ( props : Props ) => {
60
60
const router = useRouter ( ) ;
61
61
const { session, signIn, signOut, status } = useAuth ( ) ;
62
- const [ sidebarOpen , setSidebarOpen ] = useState ( true ) ;
62
+ const [ sidebarOpen , setSidebarOpen ] = useState ( false ) ;
63
63
const [ t ] = useTranslation ( "drawer" ) ;
64
64
65
65
const [ showSettings , setShowSettings ] = useState ( false ) ;
@@ -69,6 +69,20 @@ const SidebarLayout = (props: Props) => {
69
69
} ) ;
70
70
const userAgents = query . data ?? [ ] ;
71
71
72
+ useEffect ( ( ) => {
73
+ const handleResize = ( ) => {
74
+ const isDesktop = window . innerWidth >= 1280
75
+ setSidebarOpen ( isDesktop ) ;
76
+ } ;
77
+ handleResize ( ) ; // Initial check on open
78
+ window . addEventListener ( 'resize' , handleResize ) ;
79
+
80
+ return ( ) => {
81
+ window . removeEventListener ( 'resize' , handleResize ) ;
82
+ } ;
83
+ } , [ ] ) ;
84
+
85
+
72
86
return (
73
87
< div >
74
88
< Transition . Root show = { sidebarOpen } as = { Fragment } >
@@ -192,7 +206,7 @@ const SidebarLayout = (props: Props) => {
192
206
< main
193
207
className = { clsx ( "bg-gradient-to-b from-[#2B2B2B] to-[#1F1F1F]" , sidebarOpen && "lg:pl-60" ) }
194
208
>
195
- < DottedGridBackground className = "min-w-screenx " >
209
+ < DottedGridBackground className = "min-w-screen min-h-screen " >
196
210
< div > { props . children } </ div >
197
211
</ DottedGridBackground >
198
212
</ main >
0 commit comments