// ** React Import import { useEffect, useRef } from 'react' // ** Type Import import { LayoutProps } from 'src/@core/layouts/types' // ** Layout Components import VerticalLayout from './VerticalLayout' import HorizontalLayout from './HorizontalLayout' const Layout = (props: LayoutProps) => { // ** Props const { hidden, children, settings, saveSettings } = props // ** Ref const isCollapsed = useRef(settings.navCollapsed) useEffect(() => { if (hidden) { if (settings.navCollapsed) { saveSettings({ ...settings, navCollapsed: false, layout: 'vertical' }) isCollapsed.current = true } } else { if (isCollapsed.current) { saveSettings({ ...settings, navCollapsed: true, layout: settings.lastLayout }) isCollapsed.current = false } else { if (settings.lastLayout !== settings.layout) { saveSettings({ ...settings, layout: settings.lastLayout }) } } } // eslint-disable-next-line react-hooks/exhaustive-deps }, [hidden]) if (settings.layout === 'horizontal') { return {children} } return {children} } export default Layout