mirror of
https://github.com/supabase/supabase.git
synced 2026-10-09 19:35:06 +03:00
Gildas Garcia
35571d242e
## Problem We have multiple `Collapsible` components. ## Solution Reduce their number by using only the one from shadcn. I haven't noticed any visual nor functional changes. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Migrated expandable/collapsible UI to a unified shadcn-based implementation for more consistent expand/collapse behavior across the app. * **Style** * Updated listbox check icon sizing and removed obsolete collapsible open/close animations. * **Chores** * Removed deprecated collapsible variants and consolidated UI component surface for simpler maintenance. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
74 lines
2.7 KiB
TypeScript
74 lines
2.7 KiB
TypeScript
import { ChevronRight } from 'lucide-react'
|
|
import { UseFormReturn } from 'react-hook-form'
|
|
import {
|
|
Collapsible_Shadcn_,
|
|
CollapsibleContent_Shadcn_,
|
|
CollapsibleTrigger_Shadcn_,
|
|
FormControl,
|
|
FormField,
|
|
Input_Shadcn_,
|
|
} from 'ui'
|
|
import { FormItemLayout } from 'ui-patterns/form/FormItemLayout/FormItemLayout'
|
|
|
|
import { CreateProjectForm } from './ProjectCreation.schema'
|
|
import Panel from '@/components/ui/Panel'
|
|
|
|
interface InternalOnlyConfigurationProps {
|
|
form: UseFormReturn<CreateProjectForm>
|
|
}
|
|
|
|
export const InternalOnlyConfiguration = ({ form }: InternalOnlyConfigurationProps) => {
|
|
return (
|
|
<Panel.Content>
|
|
<Collapsible_Shadcn_>
|
|
<CollapsibleTrigger_Shadcn_ className="group/advanced-trigger font-mono uppercase tracking-widest text-xs flex items-center gap-1 text-foreground-lighter/75 hover:text-foreground-light transition data-open:text-foreground-light">
|
|
Internal-only Configuration
|
|
<ChevronRight
|
|
size={16}
|
|
strokeWidth={1}
|
|
className="mr-2 group-data-open/advanced-trigger:rotate-90 group-hover/advanced-trigger:text-foreground-light transition"
|
|
/>
|
|
</CollapsibleTrigger_Shadcn_>
|
|
<CollapsibleContent_Shadcn_ className="pt-2 data-closed:animate-collapsible-up data-open:animate-collapsible-down">
|
|
<p className="text-xs text-foreground-lighter mb-6">
|
|
These settings are only applicable for local/staging projects
|
|
</p>
|
|
<div className="flex flex-col gap-y-4">
|
|
<FormField
|
|
control={form.control}
|
|
name="postgresVersion"
|
|
render={({ field }) => (
|
|
<FormItemLayout
|
|
label="Custom Postgres version"
|
|
layout="horizontal"
|
|
description="Specify a custom version of Postgres (defaults to the latest)."
|
|
>
|
|
<FormControl>
|
|
<Input_Shadcn_ placeholder="e.g 17.6.1.104" {...field} autoComplete="off" />
|
|
</FormControl>
|
|
</FormItemLayout>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="instanceType"
|
|
render={({ field }) => (
|
|
<FormItemLayout
|
|
label="Custom instance type"
|
|
layout="horizontal"
|
|
description="Specify a custom instance type."
|
|
>
|
|
<FormControl>
|
|
<Input_Shadcn_ placeholder="e.g t3.nano" {...field} autoComplete="off" />
|
|
</FormControl>
|
|
</FormItemLayout>
|
|
)}
|
|
/>
|
|
</div>
|
|
</CollapsibleContent_Shadcn_>
|
|
</Collapsible_Shadcn_>
|
|
</Panel.Content>
|
|
)
|
|
}
|