mirror of
https://github.com/supabase/supabase.git
synced 2026-10-07 10:25:06 +03:00
* Demo api side panel * Add docs for storage and edge functions * Add content * fix * Add scroll to logic * Add storage docs * Add docs URLs * Add connecting to project section in getting started * Link back to docs site for product + resource specific docs * Add entry points into API side panel for table editor, auth users and storage * Add entry points into API side panel for edge functions * Beef up feature preview modal with content * Fix asset path * Address several feedback * Addressing more feedback * Shift GraphiQL page to database if new api docs flag enabled * Spelling * Wording changes * Spacing and wording * Fix small issues * Fix * Update key showing toggle button --------- Co-authored-by: Terry Sutton <saltcod@gmail.com>
43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
import { useParams } from 'common'
|
|
import { Markdown } from 'components/interfaces/Markdown'
|
|
import { BASE_PATH } from 'lib/constants'
|
|
import Image from 'next/image'
|
|
|
|
const APISidePanelPreview = () => {
|
|
const { ref } = useParams()
|
|
|
|
return (
|
|
<div className="space-y-2">
|
|
<p className="text-foreground-light text-sm mb-4">
|
|
Your project's API documentation will be available on any page across the dashboard. <br />
|
|
Get contextualized code snippets based on what you're viewing in the dashboard. Less
|
|
thinking, more building.
|
|
</p>
|
|
<Image
|
|
src={`${BASE_PATH}/img/previews/api-docs-preview.png`}
|
|
width={1860}
|
|
height={970}
|
|
alt="api-docs-side-panel-preview"
|
|
className="rounded border"
|
|
/>
|
|
<div className="space-y-2 !mt-4">
|
|
<p className="text-sm">Enabling this preview will:</p>
|
|
<ul className="list-disc pl-6 text-sm text-foreground-light space-y-1">
|
|
<li>
|
|
Replace the original API documentation page with a global API documentation side panel
|
|
that can be accessed anywhere while in a project.
|
|
</li>
|
|
<li>
|
|
<Markdown
|
|
className="text-foreground-light"
|
|
content={`Move the GraphiQL interface the Database section of the dashboard [here](/project/${ref}/database/graphiql).`}
|
|
/>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default APISidePanelPreview
|