mirror of
https://github.com/supabase/supabase.git
synced 2026-09-07 18:38:50 +08:00
2d1a2ff9a2
## Context Sets up the Explorer behind the feature preview modal + removes the temporary entry point from the SQL Editor Changes are still not live on production, so will only affect local + staging. Enabling the feature preview will replace the sidebar nav for SQL Editor to new Explorer (Icon remains unchanged, just the label) <img width="918" height="647" alt="image" src="https://github.com/user-attachments/assets/b088eb47-1176-4618-b345-d1ec0521b092" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added an “Explorer & Notebooks” feature preview with an overview image and direct access to Explorer or SQL Editor. - Added Explorer navigation when the preview is enabled. - **Improvements** - Updated desktop and mobile navigation to consistently display the available editor destination. - Improved the Explorer shortcut tooltip to clearly say “Go to Explorer.” - Organized SQL Editor previews under the Editors category. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
56 lines
2.1 KiB
TypeScript
56 lines
2.1 KiB
TypeScript
import { useParams } from 'common'
|
|
import Image from 'next/image'
|
|
|
|
import { useIsExplorerEnabled } from './FeaturePreviewContext'
|
|
import { InlineLink } from '@/components/ui/InlineLink'
|
|
import { BASE_PATH } from '@/lib/constants'
|
|
|
|
export const ExplorerPreview = () => {
|
|
const { ref } = useParams()
|
|
const isExplorerEnabled = useIsExplorerEnabled()
|
|
|
|
return (
|
|
<div className="flex flex-col gap-y-4">
|
|
<p className="text-sm text-foreground-light">
|
|
The Explorer is a new unified workspace for querying your data and chatting with the
|
|
Assistant, and is an early preview of where we're heading with the SQL Editor.
|
|
</p>
|
|
<p className="text-sm text-foreground-light">
|
|
Notebooks are the first new feature of the Explorer — mix query cells and markdown notes in
|
|
a single document, so your queries and context stay together. Use them to write runbooks,
|
|
document incidents, build reusable reports, and more!
|
|
</p>
|
|
|
|
<Image
|
|
src={`${BASE_PATH}/img/previews/explorer-preview.png`}
|
|
width={1296}
|
|
height={900}
|
|
alt="explorer-preview"
|
|
className="rounded-sm border"
|
|
/>
|
|
|
|
<div className="space-y-2">
|
|
<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 existing SQL Editor with the new{' '}
|
|
<InlineLink
|
|
href={isExplorerEnabled ? `/project/${ref}/explorer` : `/project/${ref}/sql/new`}
|
|
>
|
|
Explorer
|
|
</InlineLink>
|
|
.
|
|
<ul className="list-disc pl-6 text-sm text-foreground-light">
|
|
<li>
|
|
We're looking to replace the SQL Editor with the Explorer in the long term, but for
|
|
now it lives alongside the SQL Editor, toggleable via this feature preview.
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>Enable managing of Notebooks through both the dashboard and the Assistant.</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|