Files
supabase/apps/studio/components/layouts/ProjectLayout/ProjectContext.tsx
T
Jonathan Summers-MuirandIvan Vasilov a09ffd0104 Feat/get layout - Project pages updated to use getLayout (#33365)
* Update AppBannerWrapper.tsx

* full width header layout

* layout fixing for sign in pages

* update

* init

* Update app-state.ts

* Update ProjectLayout.tsx

* init project pages

* Update LayoutHeader.tsx

* sign in layout fixed

* Update AppBannerWrapper.tsx

* Update AppBannerWrapper.tsx

* update

* Update DefaultLayout.tsx

* Update WithSidebar.tsx

* Update ProjectLayout.tsx

* Update DefaultLayout.tsx

* layout header updatefix header

* add fragment back in

* Update ProjectLayout.tsx

* Update ProjectLayout.tsx

* Update ProjectLayout.tsx

* Update ProjectLayout.tsx

* Remove ProjectContextFromParams component (duplicate to ProjectContextProvider).

* Fix the loading state of SignInMfa page.

* Update sign-in-fly-tos.tsx

* Update ProjectLayout.tsx

* Update ProjectLayout.tsx

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2025-02-07 15:00:02 +08:00

57 lines
1.8 KiB
TypeScript

import { createContext, PropsWithChildren, useContext, useMemo } from 'react'
import { Project, useProjectDetailQuery } from 'data/projects/project-detail-query'
import { PROJECT_STATUS } from 'lib/constants'
import { DatabaseSelectorStateContextProvider } from 'state/database-selector'
import { RoleImpersonationStateContextProvider } from 'state/role-impersonation-state'
import { TableEditorStateContextProvider } from 'state/table-editor'
export interface ProjectContextType {
project?: Project
isLoading: boolean
}
const ProjectContext = createContext<ProjectContextType>({
project: undefined,
isLoading: true,
})
export default ProjectContext
export const useProjectContext = () => useContext(ProjectContext)
type ProjectContextProviderProps = {
projectRef: string | undefined
}
export const ProjectContextProvider = ({
projectRef,
children,
}: PropsWithChildren<ProjectContextProviderProps>) => {
const { data: selectedProject, isLoading } = useProjectDetailQuery({ ref: projectRef })
const value = useMemo<ProjectContextType>(() => {
return {
project: selectedProject,
isLoading: isLoading,
}
}, [selectedProject, isLoading])
return (
<ProjectContext.Provider value={value}>
<TableEditorStateContextProvider key={`table-editor-state-${projectRef}`}>
<DatabaseSelectorStateContextProvider key={`database-selector-state-${projectRef}`}>
<RoleImpersonationStateContextProvider key={`role-impersonation-state-${projectRef}`}>
{children}
</RoleImpersonationStateContextProvider>
</DatabaseSelectorStateContextProvider>
</TableEditorStateContextProvider>
</ProjectContext.Provider>
)
}
export const useIsProjectActive = () => {
const { project } = useProjectContext()
return project?.status === PROJECT_STATUS.ACTIVE_HEALTHY
}