invocations.tsx36 lines · main

1	import { useParams } from 'common'
2
3	import { LogsPreviewer } from '@/components/interfaces/Settings/Logs/LogsPreviewer'
4	import DefaultLayout from '@/components/layouts/DefaultLayout'
5	import EdgeFunctionDetailsLayout from '@/components/layouts/EdgeFunctionsLayout/EdgeFunctionDetailsLayout'
6	import { useEdgeFunctionQuery } from '@/data/edge-functions/edge-function-query'
7	import type { NextPageWithLayout } from '@/types'
8
9	export const LogPage: NextPageWithLayout = () => {
10	const { ref, functionSlug } = useParams()
11	const { data: selectedFunction, isPending: isLoading } = useEdgeFunctionQuery({
12	projectRef: ref,
13	slug: functionSlug,
14	})
15
16	if (selectedFunction === undefined || isLoading) return null
17
18	return (
19	<div className="flex-1">
20	<LogsPreviewer
21	condensedLayout
22	projectRef={ref as string}
23	queryType="fn_edge"
24	filterOverride={{ 'request.pathname': `/functions/v1/${selectedFunction.slug}` }}
25	/>
26	</div>
27	)
28	}
29
30	LogPage.getLayout = (page) => (
31	<DefaultLayout>
32	<EdgeFunctionDetailsLayout title="Invocations">{page}</EdgeFunctionDetailsLayout>
33	</DefaultLayout>
34	)
35
36	export default LogPage