mirror of
https://github.com/supabase/supabase.git
synced 2026-10-10 11:55:05 +03:00
Joshen Lim
90d3b56db0
## Context Main fix is to adjust the new home page + connect dialog (and connect sheet) to render the project's custom domain if available <img width="471" height="255" alt="image" src="https://github.com/user-attachments/assets/3a208b2e-bdeb-43f5-a2e7-3495881dbaaa" /> <img width="1065" height="233" alt="image" src="https://github.com/user-attachments/assets/2a7b8f81-8c0b-4803-bf0a-fc16a2f1e0e1" /> ## Changes involved - Created a `useProjectApiUrl` hook that will return the API URL depending if custom domains is available, otherwise default to default project API URL - Refactored all the other places that were manually deriving the project's endpoint - Storage Explorer -> copy URL - Edge Functions - Integrations -> Data API + API Docs - Auth Providers -> Callback URL - Also updated the copy CTA for the addons page - Instead of just "Change xxx", make it a bit more actionable - For add ons with binary states (Custom domains, IPv4) - If not enabled yet, "Enable xxx", otherwise "Toggle xxx" - For PITR - If not enabled yet, "Enable PITR", otherwise "Change recovery duration" - Also added "Edit custom domain" CTA if enabled <img width="1144" height="518" alt="image" src="https://github.com/user-attachments/assets/4f152ea5-0cc7-412c-95e8-ad5bb37c19c3" /> ## To test - [ ] Verify that for a project with custom domain set up, all the affected UI mentioned in the above section look correct
54 lines
2.2 KiB
TypeScript
54 lines
2.2 KiB
TypeScript
import { IS_PLATFORM } from 'common'
|
|
|
|
import { useProjectSettingsV2Query } from './project-settings-v2-query'
|
|
import { useCustomDomainsQuery } from '@/data/custom-domains/custom-domains-query'
|
|
import { useProjectAddonsQuery } from '@/data/subscriptions/project-addons-query'
|
|
|
|
export const useProjectApiUrl = (
|
|
{ projectRef }: { projectRef?: string },
|
|
{ enabled = true }: { enabled?: boolean } = {}
|
|
) => {
|
|
const { data } = useProjectAddonsQuery({ projectRef })
|
|
const hasCustomDomainsAddon = !!data?.selected_addons.find((x) => x.type === 'custom_domain')
|
|
|
|
const {
|
|
data: customDomainData,
|
|
error: customDomainsError,
|
|
isPending: isLoadingCustomDomains,
|
|
isSuccess: isSuccessCustomDomains,
|
|
isError: isErrorCustomDomains,
|
|
} = useCustomDomainsQuery({ projectRef }, { enabled })
|
|
const isCustomDomainsActive = customDomainData?.customDomain?.status === 'active'
|
|
const customEndpoint =
|
|
hasCustomDomainsAddon && isCustomDomainsActive
|
|
? `https://${customDomainData?.customDomain?.hostname}`
|
|
: undefined
|
|
|
|
const {
|
|
data: settings,
|
|
error: projectSettingsError,
|
|
isPending: isLoadingProjectSettings,
|
|
isSuccess: isSuccessProjectSettings,
|
|
isError: isErrorProjectSettings,
|
|
} = useProjectSettingsV2Query({ projectRef }, { enabled })
|
|
const protocol = settings?.app_config?.protocol ?? 'https'
|
|
const endpoint = settings?.app_config?.endpoint
|
|
|
|
const hostEndpoint = isSuccessProjectSettings ? `${protocol}://${endpoint}` : undefined
|
|
const resolvedEndpoint = isCustomDomainsActive ? customEndpoint : hostEndpoint
|
|
const storageEndpoint = settings?.app_config?.storage_endpoint
|
|
? `${IS_PLATFORM ? 'https' : protocol}://${settings?.app_config?.storage_endpoint}`
|
|
: undefined
|
|
|
|
return {
|
|
data: resolvedEndpoint,
|
|
customEndpoint,
|
|
hostEndpoint,
|
|
storageEndpoint,
|
|
error: projectSettingsError || (hasCustomDomainsAddon ? customDomainsError : undefined),
|
|
isPending: isLoadingProjectSettings || (hasCustomDomainsAddon && isLoadingCustomDomains),
|
|
isSuccess: isSuccessProjectSettings && (!hasCustomDomainsAddon || isSuccessCustomDomains),
|
|
isError: isErrorProjectSettings || (hasCustomDomainsAddon && isErrorCustomDomains),
|
|
}
|
|
}
|