Files
supabase/apps/studio/components/interfaces/ProjectCreation/HighAvailabilityInput.tsx
Joshen Lim 2f64b5401e Shift internal only fields on new project form into a collapsible (#45873)
## Context

Changes here aren't public facing - we're just shifting some internal
only fields on the new project page to consolidate them into the
"internal-only" collapsible

Mainly to improve clarity from our POV RE what fields do users see and
the general look of the new project form
<img width="727" height="558" alt="image"
src="https://github.com/user-attachments/assets/7d8f2915-3a81-4d9d-a067-cd45c1725726"
/>

So everything that's not within the collapsible are essentially fields
that users will see on prod. The changes here also subsequently
deprecates the use of 2 feature flags on the new project page:
- `showPostgresVersionSelector` -> replaced by new flag
`newProjectInternalOnlyConfiguration`
- `enableFlyCloudProvider` -> was used to control the visibility of the
cloud provider field, now replaced by
`newProjectInternalOnlyConfiguration`


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Refactor**
* Reorganized project creation form layout and field ordering for
improved structure.
  * Updated project resume flow with refined confirmation modal UI.
  * Simplified cloud provider selection interface.
  * Streamlined high-availability configuration presentation.

<!-- review_stack_entry_start -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45873)

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-15 15:40:46 +08:00

45 lines
1.4 KiB
TypeScript

import Link from 'next/link'
import { UseFormReturn } from 'react-hook-form'
import { FormControl, FormField, Switch } from 'ui'
import { FormItemLayout } from 'ui-patterns/form/FormItemLayout/FormItemLayout'
import { CreateProjectForm } from './ProjectCreation.schema'
import { useCheckEntitlements } from '@/hooks/misc/useCheckEntitlements'
interface HighAvailabilityInputProps {
form: UseFormReturn<CreateProjectForm>
}
export const HighAvailabilityInput = ({ form }: HighAvailabilityInputProps) => {
const { hasAccess } = useCheckEntitlements('instances.high_availability')
if (!hasAccess) return null
return (
<FormField
control={form.control}
name="highAvailability"
render={({ field }) => (
<FormItemLayout
label="High Availability"
description={
<>
Powered by{' '}
<Link href="https://multigres.com/" target="_blank" className="text-link">
Multigres
</Link>
: horizontally scalable Postgres for multi-tenant, highly available, globally
distributed deployments while staying true to standard Postgres.
</>
}
layout="horizontal"
>
<FormControl>
<Switch checked={field.value} onCheckedChange={field.onChange} />
</FormControl>
</FormItemLayout>
)}
/>
)
}