vasceannie/supabase
1
0
Fork 0
Code Issues Pull Requests Actions 8 Packages Projects Releases Wiki Activity

Another slug file

Browse Source
This commit is contained in:
Chase Granberry
2023-03-28 10:51:13 -07:00
parent dc551a4471
commit 1dfc3dc997
1 changed files with 169 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

169
apps/docs/pages/reference/analytics/[...slug].tsx Normal file
View File

@@ -0,0 +1,169 @@
import specFile from '~/../../spec/transforms/analytics_v0_openapi_deparsed.json' assert { type: 'json' }
import { gen_v3, enrichedOperation } from '~/lib/refGenerator/helpers'
import { Tabs } from '~/../../packages/ui'
// @ts-ignore
import CodeBlock from '~/components/CodeBlock/CodeBlock'
import RefSubLayout from '~/layouts/ref/RefSubLayout'
export type AcceptedValue = {
id: string
name: string
type: 'string' | 'boolean' | 'object'
description?: string
}
export type Flag = {
id: string
name: string
description: string
default_value: string
accepted_values: AcceptedValue[]
}
export type ApiParameter = {
example: string
in: string
name: string
required: boolean
schema: {
type: string
example: string
}
}
// @ts-ignore
const generatedSpec = gen_v3(specFile, 'wat', { apiUrl: 'apiv0' })
export default function Config() {
return (
<RefSubLayout>
<div className="flex my-16">
<div className="w-full">
<div className="grid gap-16">
<h1 className="text-4xl uppercase">{generatedSpec.info.title}</h1>
<p>{generatedSpec.info.description}</p>
</div>
<div className="grid gap-32 mx-auto max-w-5xl mt-24">
{generatedSpec.operations.map((operation: any) => (
<div className="border-b pb-8">
<RefSubLayout.Section
slug={operation.id}
title={operation.summary}
id={operation.operationId}
monoFont={false}
>
<RefSubLayout.Details>
<div className="mt-4">
<code className="text-md flex gap-4 text-md text-scale-900 break-all">
<span className="uppercase whitespace-nowrap ">{operation.operation}</span>
{operation.fullPath}
</code>
</div>
{/* Path Parameters */}
{operation.parameters &&
operation.parameters.filter((parameter) => parameter.in === 'path').length >
0 && (
<div className="mt-12">
<h2 className="border-b pb-2 text-xl">Path parameters</h2>
<ul className="mt-4">
{operation.parameters &&
operation.parameters
.filter((parameter: any) => parameter.in === 'path')
.map((parameter: any) => (
<li className="mt-8 border-b pb-6">
<div>
<div className="flex gap-4 items-center">
<span className="font-bold">{parameter.name}</span>
<div className="font-mono text-xs break-all">
{parameter.required && (
<div className="text-[10px] border border-amber-700 bg-amber-300 text-amber-900 px-2 tracking-wide font-mono py-0.25 rounded-full">
REQUIRED
</div>
)}
</div>
</div>
<p className="mt-4">{parameter.description}</p>
</div>
{parameter.example && (
<div className="mt-4 flex gap-4 items-center">
<span>Example:</span>
<span className="font-mono text-xs break-all">
{parameter.example}
</span>
</div>
)}
</li>
))}
</ul>
</div>
)}
{/* Header Parameters */}
{operation.parameters &&
operation.parameters.filter((parameter) => parameter.in === 'header').length >
0 && (
<div className="mt-12">
<h2 className="border-b pb-2 text-xl">Header parameters</h2>
<ul className="mt-4">
{operation.parameters &&
operation.parameters
.filter((parameter: any) => parameter.in === 'header')
.map((parameter: any) => (
<li className="mt-8 border-b pb-6">
<div className="flex gap-4 items-center">
<span className="font-bold">{parameter.name}</span>
<span className="font-mono text-xs break-all">
{parameter.required && 'required'}
</span>
</div>
<div className="mt-4 flex gap-4 items-center">
<span>Example:</span>
<span className="font-mono text-xs break-all">
{parameter.example}
</span>
</div>
</li>
))}
</ul>
</div>
)}
</RefSubLayout.Details>
<RefSubLayout.Examples>
{operation.responseList.length > 0 && (
<>
<h2 className="text-xl">Responses</h2>
<Tabs
scrollable
size="small"
type="underlined"
defaultActiveId={
operation.responseList[0].responseCode ??
operation.responseList[0].responseCode
}
>
{operation.responseList.map((response: any) => (
<Tabs.Panel id={response.responseCode} label={response.responseCode}>
<p>{response.description}</p>
{response?.content && response?.content['application/json'] && (
<div className="mt-8">
<CodeBlock language="bash" className="relative">
{JSON.stringify(response.content['application/json'], null, 2)}
</CodeBlock>
</div>
)}
</Tabs.Panel>
))}
</Tabs>
</>
)}
</RefSubLayout.Examples>
</RefSubLayout.Section>
</div>
))}
</div>
</div>
</div>
</RefSubLayout>
)
}