mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 09:55:06 +03:00
Feature ## What is the current behavior? Data API settings live under Project Settings. ## What is the new behavior? Data API settings are moved to the Integrations page, treating Data API as a platform integration. Includes security checks when toggling on the Data API to prevent unintended exposure of project data. ## Additional context Towards FE-2517 ## Summary by CodeRabbit * **New Features** * Added a Data API integration with Overview and Settings pages, endpoint display, and enable/disable toggle with safety checks and confirmation flow. * **Navigation Changes** * Data API moved from Project Settings into the Integrations area and routes now redirect to the new Overview page. * **Documentation** * Added an overview doc describing Data API endpoints and configuration. * **Tests** * Added unit tests for endpoint resolution and schema parsing utilities.
41 lines
1.6 KiB
TypeScript
41 lines
1.6 KiB
TypeScript
import { useParams } from 'common'
|
|
import { AlertCircle } from 'lucide-react'
|
|
import { Alert_Shadcn_, AlertTitle_Shadcn_, cn } from 'ui'
|
|
|
|
import { IntegrationOverviewTab } from '../Integration/IntegrationOverviewTab'
|
|
import { DataApiEnableSwitch } from '@/components/interfaces/Settings/API/DataApiEnableSwitch'
|
|
import { DataApiProjectUrlCard } from '@/components/interfaces/Settings/API/DataApiProjectUrlCard'
|
|
import { useIsDataApiEnabled } from '@/hooks/misc/useIsDataApiEnabled'
|
|
import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
|
|
import { PROJECT_STATUS } from '@/lib/constants'
|
|
|
|
export const DataApiOverviewTab = () => {
|
|
const { ref: projectRef } = useParams()
|
|
const { data: project, isPending: isProjectLoading } = useSelectedProjectQuery()
|
|
const { isEnabled, isPending: isConfigLoading } = useIsDataApiEnabled({ projectRef })
|
|
|
|
const isLoading = isProjectLoading || isConfigLoading
|
|
|
|
return (
|
|
<IntegrationOverviewTab>
|
|
<div className="px-10 max-w-4xl flex flex-col">
|
|
{!isProjectLoading && project?.status !== PROJECT_STATUS.ACTIVE_HEALTHY ? (
|
|
<Alert_Shadcn_ variant="destructive">
|
|
<AlertCircle size={16} />
|
|
<AlertTitle_Shadcn_>
|
|
API settings are unavailable as the project is not active
|
|
</AlertTitle_Shadcn_>
|
|
</Alert_Shadcn_>
|
|
) : (
|
|
<>
|
|
<div className={cn((isLoading || !isEnabled) && 'opacity-50 pointer-events-none')}>
|
|
<DataApiProjectUrlCard />
|
|
</div>
|
|
<DataApiEnableSwitch />
|
|
</>
|
|
)}
|
|
</div>
|
|
</IntegrationOverviewTab>
|
|
)
|
|
}
|