mirror of
https://github.com/supabase/supabase.git
synced 2026-10-14 13:49:09 +03:00
Ivan VasilovandJoshen Lim
1bc28c7f85
* Initial work. * Add missing import. * Minor fixes. * Minor fixes. * Add a feature flag for the refresh toast. * Add a commit for testing. Revert before merging. * Remove header caching for testing. * Tiny lint * Fix * One more --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
61 lines
2.3 KiB
TypeScript
61 lines
2.3 KiB
TypeScript
import { useRouter } from 'next/router'
|
|
import { PropsWithChildren } from 'react'
|
|
|
|
import { useParams } from 'common'
|
|
import { AppBannerWrapper } from 'components/interfaces/App'
|
|
import { AppBannerContextProvider } from 'components/interfaces/App/AppBannerWrapperContext'
|
|
import { Sidebar } from 'components/interfaces/Sidebar'
|
|
import { useCheckLatestDeploy } from 'hooks/use-check-latest-deploy'
|
|
import { SidebarProvider } from 'ui'
|
|
import { LayoutHeader } from './ProjectLayout/LayoutHeader'
|
|
import MobileNavigationBar from './ProjectLayout/NavigationBar/MobileNavigationBar'
|
|
import { ProjectContextProvider } from './ProjectLayout/ProjectContext'
|
|
|
|
export interface DefaultLayoutProps {
|
|
headerTitle?: string
|
|
}
|
|
|
|
/**
|
|
* Base layout for all project pages in the dashboard, rendered as the first child on all page files within a project.
|
|
*
|
|
* A second layout as the child to this is required, and the layout depends on which section of the dashboard the page is on. (e.g Auth - AuthLayout)
|
|
*
|
|
* The base layout handles rendering the following UI components:
|
|
* - App banner (e.g for notices or incidents)
|
|
* - Mobile navigation bar
|
|
* - First level side navigation bar (e.g For navigating to Table Editor, SQL Editor, Database page, etc)
|
|
*/
|
|
const DefaultLayout = ({ children, headerTitle }: PropsWithChildren<DefaultLayoutProps>) => {
|
|
const { ref } = useParams()
|
|
const router = useRouter()
|
|
const showProductMenu = !!ref && router.pathname !== '/project/[ref]'
|
|
|
|
useCheckLatestDeploy()
|
|
|
|
return (
|
|
<SidebarProvider defaultOpen={false}>
|
|
<ProjectContextProvider projectRef={ref}>
|
|
<AppBannerContextProvider>
|
|
<div className="flex flex-col h-screen w-screen">
|
|
{/* Top Banner */}
|
|
<AppBannerWrapper />
|
|
<div className="flex-shrink-0">
|
|
<MobileNavigationBar />
|
|
<LayoutHeader showProductMenu={showProductMenu} headerTitle={headerTitle} />
|
|
</div>
|
|
{/* Main Content Area */}
|
|
<div className="flex flex-1 w-full overflow-y-hidden">
|
|
{/* Sidebar */}
|
|
<Sidebar />
|
|
{/* Main Content */}
|
|
<div className="flex-grow h-full overflow-y-auto">{children}</div>
|
|
</div>
|
|
</div>
|
|
</AppBannerContextProvider>
|
|
</ProjectContextProvider>
|
|
</SidebarProvider>
|
|
)
|
|
}
|
|
|
|
export default DefaultLayout
|