mirror of
https://github.com/supabase/supabase.git
synced 2026-10-07 18:35:07 +03:00
Danny White
0a96a5d0ce
## What kind of change does this PR introduce? UI update ## What is the current behavior? - Database settings uses an older, much wider, layout - This will become problematic later on as more complex elements are added to the page - Titles and descriptions are inconsistently formatted ## What is the new behavior? | Before | After | | --- | --- | | <img width="1728" height="994" alt="Oldie 2 Toolshed Supabase-EE998752-3696-45E4-A842-9666049153D8" src="https://github.com/user-attachments/assets/8f0004cf-3bb4-4b00-900a-b116b80371a6" /> | <img width="1728" height="994" alt="Oldie 2 Toolshed Supabase-7E86FD58-35BB-4912-8B2F-8C7AAA03B462" src="https://github.com/user-attachments/assets/606b51b4-21a0-4b7b-870b-ac92ed363f3c" /> |
53 lines
1.9 KiB
TypeScript
53 lines
1.9 KiB
TypeScript
import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
|
|
import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
|
|
import { AlertDescription_Shadcn_, AlertTitle_Shadcn_, Alert_Shadcn_, CriticalIcon } from 'ui'
|
|
import {
|
|
PageSection,
|
|
PageSectionContent,
|
|
PageSectionDescription,
|
|
PageSectionMeta,
|
|
PageSectionSummary,
|
|
PageSectionTitle,
|
|
} from 'ui-patterns/PageSection'
|
|
import { DeleteProjectButton } from './DeleteProjectButton'
|
|
|
|
export const DeleteProjectPanel = () => {
|
|
const { data: project } = useSelectedProjectQuery()
|
|
const { data: selectedOrganization } = useSelectedOrganizationQuery()
|
|
|
|
if (project === undefined) return null
|
|
|
|
const title =
|
|
selectedOrganization?.managed_by === 'vercel-marketplace'
|
|
? 'Deleting this project will also remove your database and uninstall the resource on Vercel.'
|
|
: 'Deleting this project will also remove your database.'
|
|
const description =
|
|
selectedOrganization?.managed_by === 'vercel-marketplace'
|
|
? 'Make sure you have made a backup if you want to keep your data, and that no Vercel project is connected to this resource.'
|
|
: 'Make sure you have made a backup if you want to keep your data.'
|
|
|
|
return (
|
|
<PageSection id="delete-project">
|
|
<PageSectionMeta>
|
|
<PageSectionSummary>
|
|
<PageSectionTitle>Delete project</PageSectionTitle>
|
|
<PageSectionDescription>
|
|
Permanently remove your project and its database
|
|
</PageSectionDescription>
|
|
</PageSectionSummary>
|
|
</PageSectionMeta>
|
|
|
|
<PageSectionContent>
|
|
<Alert_Shadcn_ variant="destructive">
|
|
<CriticalIcon />
|
|
<AlertTitle_Shadcn_>{title}</AlertTitle_Shadcn_>
|
|
<AlertDescription_Shadcn_>{description}</AlertDescription_Shadcn_>
|
|
<div className="mt-2">
|
|
<DeleteProjectButton />
|
|
</div>
|
|
</Alert_Shadcn_>
|
|
</PageSectionContent>
|
|
</PageSection>
|
|
)
|
|
}
|