LogsLayout.tsx61 lines · main

1	import { PermissionAction } from '@supabase/shared-types/out/constants'
2	import { useParams } from 'common'
3	import { PropsWithChildren } from 'react'
4
5	import { ProjectLayout } from '../ProjectLayout'
6	import { LogsSidebarMenuV2 } from './LogsSidebarMenuV2'
7	import NoPermission from '@/components/ui/NoPermission'
8	import { UnknownInterface } from '@/components/ui/UnknownInterface'
9	import { useAsyncCheckPermissions } from '@/hooks/misc/useCheckPermissions'
10	import { useIsFeatureEnabled } from '@/hooks/misc/useIsFeatureEnabled'
11	import { withAuth } from '@/hooks/misc/withAuth'
12
13	interface LogsLayoutProps {
14	title: string
15	}
16
17	const LogsLayout = ({ title, children }: PropsWithChildren<LogsLayoutProps>) => {
18	const { ref } = useParams()
19	const logsEnabled = useIsFeatureEnabled('logs:all')
20
21	const { isLoading, can: canUseLogsExplorer } = useAsyncCheckPermissions(
22	PermissionAction.ANALYTICS_READ,
23	'logflare'
24	)
25
26	if (!logsEnabled) {
27	return (
28	<ProjectLayout product="logs" browserTitle={{ section: title }}>
29	<UnknownInterface urlBack={`/project/${ref}`} />
30	</ProjectLayout>
31	)
32	}
33
34	if (!canUseLogsExplorer) {
35	if (isLoading) {
36	return (
37	<ProjectLayout isLoading product="logs" browserTitle={{ section: title }} />
38	)
39	}
40
41	if (!isLoading && !canUseLogsExplorer) {
42	return (
43	<ProjectLayout product="logs" browserTitle={{ section: title }}>
44	<NoPermission isFullPage resourceText="access your project's logs" />
45	</ProjectLayout>
46	)
47	}
48	}
49
50	return (
51	<ProjectLayout
52	product="logs"
53	browserTitle={{ section: title }}
54	productMenu={<LogsSidebarMenuV2 />}
55	>
56	{children}
57	</ProjectLayout>
58	)
59	}
60
61	export default withAuth(LogsLayout)