-
- {isCountsPending
- ? 'Loading tables...'
+
+
+
+
+ {isCountsPending
+ ? 'Loading tables...'
+ : totalCount === 0
+ ? 'No tables available'
: `${grantsCount} of ${totalCount} tables exposed${
pendingCount > 0
? `, ${pendingCount} pending ${pluralize(pendingCount, 'change')}`
: ''
}`}
-
-
-
-
-
-
- {isPending ? (
- <>
-
-
-
-
-
- ) : isError ? (
-
-
Failed to retrieve tables
+
+
+
+
+
+ {isPending ? (
+ <>
+
+
- ) : (
- <>
- {search.length > 0 && tables.length === 0 && (
-
- No tables found
-
- )}
- 7 ? 'h-[210px]' : ''}
- >
- {tables.map((table) => {
- const isSchemaExposed = selectedSchemas.includes(table.schema)
- const hasPendingAdd = pendingAddSet.has(table.id)
- const hasPendingRemove = pendingRemoveSet.has(table.id)
+
+
+
+ ) : isError ? (
+
+
Failed to retrieve tables
+
+ {search.length > 0 ? 'No tables found' : 'No tables available'}
+
+ )}
+ 7 ? 'h-[210px]' : ''}>
+ {tables.map((table) => {
+ const isSchemaExposed = selectedSchemas.includes(table.schema)
+ const hasPendingAdd = pendingAddSet.has(table.id)
+ const hasPendingRemove = pendingRemoveSet.has(table.id)
- const isCustomTable = table.status === 'custom'
- const isGranted = table.status === 'granted'
+ const isCustomTable = table.status === 'custom'
+ const isGranted = table.status === 'granted'
- const isCustomNeutral = isCustomTable && !hasPendingAdd && !hasPendingRemove
- const isExposed =
- isSchemaExposed &&
- (isCustomTable
- ? hasPendingAdd
- : isGranted
- ? !hasPendingRemove
- : hasPendingAdd)
+ const isCustomNeutral = isCustomTable && !hasPendingAdd && !hasPendingRemove
+ const isExposed =
+ isSchemaExposed &&
+ (isCustomTable
+ ? hasPendingAdd
+ : isGranted
+ ? !hasPendingRemove
+ : hasPendingAdd)
- const customGrantsTooltip = getCustomGrantsTooltip({
- hasPendingAdd,
- hasPendingRemove,
- })
+ const customGrantsTooltip = getCustomGrantsTooltip({
+ hasPendingAdd,
+ hasPendingRemove,
+ })
- return (
- {
- if (!isSchemaExposed) return
+ return (
+ {
+ if (!isSchemaExposed) return
- if (isCustomTable) {
- if (hasPendingAdd) {
- onTogglePendingAdd(table.id)
- onTogglePendingRemove(table.id)
- } else if (hasPendingRemove) {
- onTogglePendingRemove(table.id)
- onTogglePendingAdd(table.id)
- } else {
- onTogglePendingAdd(table.id)
- }
- return
- }
-
- if (isGranted) {
+ if (isCustomTable) {
+ if (hasPendingAdd) {
+ onTogglePendingAdd(table.id)
onTogglePendingRemove(table.id)
+ } else if (hasPendingRemove) {
+ onTogglePendingRemove(table.id)
+ onTogglePendingAdd(table.id)
} else {
onTogglePendingAdd(table.id)
}
- }}
- >
-
-
- {isExposed &&
-
- {`${table.schema}.${table.name}`}
-
+ return
+ }
-
- {isCustomTable && (
-
-
-
-
-
-
+
+
+ {isExposed &&
+
+
- {customGrantsTooltip}
-
-
- )}
- {!isSchemaExposed && (
-
-
-
-
-
-
- {`The schema "${table.schema}" must be exposed before enabling this table.`}
-
-
- )}
-
+
+
+
+
+ The schema "{table.schema}" must be exposed before enabling this
+ table.
+
+
+ )}
- {hasNextPage && (
-
-
- )}
-
-
- )}
-
-
-
-
-
-
+
+ {`${table.schema}.${table.name}`}
+
+
+
+ {isCustomTable && (
+
+
+
+
+
+
+ {customGrantsTooltip}
+
+
+ )}
+
+
+ )
+ })}
+
+ {hasNextPage && (
+
+
+ )}
+
+
+ )}
+
+
+
+
+
)
}
diff --git a/apps/studio/components/interfaces/Settings/API/PostgrestConfig.tsx b/apps/studio/components/interfaces/Settings/API/PostgrestConfig.tsx
index 24df32ed986..6be39205375 100644
--- a/apps/studio/components/interfaces/Settings/API/PostgrestConfig.tsx
+++ b/apps/studio/components/interfaces/Settings/API/PostgrestConfig.tsx
@@ -35,6 +35,7 @@ import { z } from 'zod'
import { ExposedSchemaSelector } from './ExposedSchemaSelector'
import { HardenAPIModal } from './HardenAPIModal'
+import { ExposedFunctionSelector } from '@/components/interfaces/Settings/API/ExposedFunctionSelector'
import { ExposedTableSelector } from '@/components/interfaces/Settings/API/ExposedTableSelector'
import { FormActions } from '@/components/ui/Forms/FormActions'
import { useProjectPostgrestConfigQuery } from '@/data/config/project-postgrest-config-query'
@@ -42,7 +43,7 @@ import { useProjectPostgrestConfigUpdateMutation } from '@/data/config/project-p
import { useDatabaseExtensionsQuery } from '@/data/database-extensions/database-extensions-query'
import { useSchemasQuery } from '@/data/database/schemas-query'
import { privilegeKeys } from '@/data/privileges/keys'
-import { useUpdateExposedTablesMutation } from '@/data/privileges/update-exposed-tables-mutation'
+import { useUpdateExposedEntitiesMutation } from '@/data/privileges/update-exposed-entities-mutation'
import { useAsyncCheckPermissions } from '@/hooks/misc/useCheckPermissions'
import { useDataApiGrantTogglesEnabled } from '@/hooks/misc/useDataApiGrantTogglesEnabled'
import useLatest from '@/hooks/misc/useLatest'
@@ -66,6 +67,8 @@ const formSchema = z.object({
// Fields for expose toggles
tableIdsToAdd: z.array(z.number()),
tableIdsToRemove: z.array(z.number()),
+ functionNamesToAdd: z.array(z.string()),
+ functionNamesToRemove: z.array(z.string()),
})
export const PostgrestConfig = () => {
@@ -119,7 +122,7 @@ export const PostgrestConfig = () => {
const { mutateAsync: updatePostgrestConfig } = useProjectPostgrestConfigUpdateMutation()
- const { mutateAsync: updateExposedTables } = useUpdateExposedTablesMutation()
+ const { mutateAsync: updateExposedEntities } = useUpdateExposedEntitiesMutation()
const [isUpdating, setIsUpdating] = useState(false)
@@ -143,6 +146,8 @@ export const PostgrestConfig = () => {
dbPool: config?.db_pool,
tableIdsToAdd: [] as number[],
tableIdsToRemove: [] as number[],
+ functionNamesToAdd: [] as string[],
+ functionNamesToRemove: [] as string[],
}
}, [config, configDbSchemas])
@@ -165,11 +170,13 @@ export const PostgrestConfig = () => {
let dbSchema = values.dbSchema.join(',')
if (isApiGrantTogglesEnabled) {
- await updateExposedTables({
+ await updateExposedEntities({
projectRef,
connectionString: project?.connectionString,
tableIdsToAdd: values.tableIdsToAdd,
tableIdsToRemove: values.tableIdsToRemove,
+ functionNamesToAdd: values.functionNamesToAdd,
+ functionNamesToRemove: values.functionNamesToRemove,
})
}
@@ -191,6 +198,12 @@ export const PostgrestConfig = () => {
queryClient.invalidateQueries({
queryKey: privilegeKeys.exposedTableCounts(projectRef, watchedDbSchema),
}),
+ queryClient.invalidateQueries({
+ queryKey: privilegeKeys.exposedFunctionsInfinite(projectRef),
+ }),
+ queryClient.invalidateQueries({
+ queryKey: privilegeKeys.exposedFunctionCounts(projectRef, watchedDbSchema),
+ }),
])
toast.success('Successfully saved settings')
@@ -204,6 +217,8 @@ export const PostgrestConfig = () => {
dbPool: values.dbPool,
tableIdsToAdd: [],
tableIdsToRemove: [],
+ functionNamesToAdd: [],
+ functionNamesToRemove: [],
})
} catch (error) {
toast.error('Failed to save settings: ' + (error as ResponseError).message || 'Unknown error')
@@ -227,6 +242,14 @@ export const PostgrestConfig = () => {
control: form.control,
name: 'tableIdsToRemove',
})
+ const watchedFunctionNamesToAdd = useWatch_Shadcn_({
+ control: form.control,
+ name: 'functionNamesToAdd',
+ })
+ const watchedFunctionNamesToRemove = useWatch_Shadcn_({
+ control: form.control,
+ name: 'functionNamesToRemove',
+ })
return (
@@ -312,6 +335,47 @@ export const PostgrestConfig = () => {
/>
+
+ {
+ const current = form.getValues('functionNamesToAdd')
+ if (current.includes(functionName)) {
+ form.setValue(
+ 'functionNamesToAdd',
+ current.filter((x) => x !== functionName),
+ { shouldDirty: true }
+ )
+ } else {
+ form.setValue('functionNamesToAdd', [...current, functionName], {
+ shouldDirty: true,
+ })
+ }
+ }}
+ onTogglePendingRemove={(functionName) => {
+ const current = form.getValues('functionNamesToRemove')
+ if (current.includes(functionName)) {
+ form.setValue(
+ 'functionNamesToRemove',
+ current.filter((x) => x !== functionName),
+ { shouldDirty: true }
+ )
+ } else {
+ form.setValue('functionNamesToRemove', [...current, functionName], {
+ shouldDirty: true,
+ })
+ }
+ }}
+ />
+
+
{watchedDbSchema.length === 0 && (
{
}
const domain = form.watch('domain')
+ const trimmedDomain = domain.trim()
const isSubmitting = isCheckingRecord || isCreating
return (
@@ -112,12 +114,31 @@ export const CustomDomainsConfigureHostname = () => {
{domain ? {domain} : 'your custom domain'}{' '}
resolving to{' '}
{endpoint ? (
- {endpoint}
+
+ {endpoint}
+
) : (
"your project's API URL"
)}{' '}
with as low a TTL as possible. If you're using Cloudflare as your DNS provider,
disable the proxy option.
+ {trimmedDomain.split('.')[0]}, while
+ others accept the full hostname{' '}
+ {trimmedDomain}.
+
+ ) : (
+ 'Some DNS providers expect only the subdomain label, while others accept the full hostname.'
+ )}
diff --git a/apps/studio/components/interfaces/SignIn/SignUpForm.tsx b/apps/studio/components/interfaces/SignIn/SignUpForm.tsx
index c8e54c963d6..03a4aa3bf69 100644
--- a/apps/studio/components/interfaces/SignIn/SignUpForm.tsx
+++ b/apps/studio/components/interfaces/SignIn/SignUpForm.tsx
@@ -1,29 +1,29 @@
import HCaptcha from '@hcaptcha/react-hcaptcha'
import { zodResolver } from '@hookform/resolvers/zod'
+import { useSignUpMutation } from 'data/misc/signup-mutation'
import { motion } from 'framer-motion'
+import { BASE_PATH } from 'lib/constants'
+import { buildPathWithParams } from 'lib/gotrue'
import { CheckCircle, Eye, EyeOff } from 'lucide-react'
import { useRouter } from 'next/router'
import { parseAsString, useQueryStates } from 'nuqs'
import { useRef, useState } from 'react'
import { SubmitHandler, useForm } from 'react-hook-form'
import { toast } from 'sonner'
-import z from 'zod'
-
-import { useSignUpMutation } from 'data/misc/signup-mutation'
-import { BASE_PATH } from 'lib/constants'
-import { buildPathWithParams } from 'lib/gotrue'
import {
+ Alert_Shadcn_,
AlertDescription_Shadcn_,
AlertTitle_Shadcn_,
- Alert_Shadcn_,
Button,
+ cn,
+ Form_Shadcn_,
FormControl_Shadcn_,
FormField_Shadcn_,
- Form_Shadcn_,
Input_Shadcn_,
- cn,
} from 'ui'
import { FormItemLayout } from 'ui-patterns/form/FormItemLayout/FormItemLayout'
+import z from 'zod'
+
import PasswordConditionsHelper from './PasswordConditionsHelper'
const schema = z.object({
@@ -183,8 +183,8 @@ export const SignUpForm = () => {
/>
:
}
disabled={isSubmitting}
diff --git a/apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/ColumnEditor/ColumnEditor.tsx b/apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/ColumnEditor/ColumnEditor.tsx
index d0f96cdad89..a6168620d14 100644
--- a/apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/ColumnEditor/ColumnEditor.tsx
+++ b/apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/ColumnEditor/ColumnEditor.tsx
@@ -243,6 +243,7 @@ export const ColumnEditor = ({
General}>
): AuthorizedApp => ({
id: 'authorized-app-1',
app_id: 'oauth-app-1',
@@ -36,6 +42,7 @@ describe('ProjectOAuthIntegrationsBanner', () => {
mockUseSelectedOrganizationQuery.mockReturnValue({
data: { slug: 'acme' },
})
+ mockUseIsProjectOauthIntegrationsBannerEnabled.mockReturnValue(true)
mockUseAuthorizedAppsQuery.mockReturnValue({
data: [createAuthorizedApp({ name: 'Lovable' })],
@@ -71,6 +78,18 @@ describe('ProjectOAuthIntegrationsBanner', () => {
)
})
+ it('does not render when feature preview is disabled', () => {
+ mockUseIsProjectOauthIntegrationsBannerEnabled.mockReturnValue(false)
+
+ render(
+
{showEmails ? (
{
useAuthConfigPrefetch({ projectRef })
const page = router.pathname.split('/')[4]
-
const menu = useGenerateAuthMenu()
return
+
{authenticationSignInProviders ? (
{
@@ -18,9 +18,14 @@ const DatabaseProductMenu = () => {
return ) => {
+const DatabaseLayout = ({ children, title }: PropsWithChildren) => {
return (
-
+
{isPermissionsLoaded && !canReadTriggers ? (
)
}
-
-export default DatabaseTriggersLayout
diff --git a/apps/studio/components/layouts/EdgeFunctionsLayout/EdgeFunctionDetailsLayout.tsx b/apps/studio/components/layouts/EdgeFunctionsLayout/EdgeFunctionDetailsLayout.tsx
index 394d0b66546..847804170e6 100644
--- a/apps/studio/components/layouts/EdgeFunctionsLayout/EdgeFunctionDetailsLayout.tsx
+++ b/apps/studio/components/layouts/EdgeFunctionsLayout/EdgeFunctionDetailsLayout.tsx
@@ -1,9 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-import { Download, FileArchive, Send } from 'lucide-react'
-import { useRouter } from 'next/router'
-import React, { useEffect, useState, type PropsWithChildren } from 'react'
-import { toast } from 'sonner'
-
import { BlobReader, BlobWriter, ZipWriter } from '@zip.js/zip.js'
import { IS_PLATFORM, useParams } from 'common'
import { useIsAPIDocsSidePanelEnabled } from 'components/interfaces/App/FeaturePreview/FeaturePreviewContext'
@@ -18,7 +13,11 @@ import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
import { withAuth } from 'hooks/misc/withAuth'
import { DOCS_URL } from 'lib/constants'
+import { Download, FileArchive, Send } from 'lucide-react'
import Link from 'next/link'
+import { useRouter } from 'next/router'
+import React, { useEffect, useState, type PropsWithChildren } from 'react'
+import { toast } from 'sonner'
import {
BreadcrumbItem_Shadcn_ as BreadcrumbItem,
BreadcrumbLink_Shadcn_ as BreadcrumbLink,
@@ -42,11 +41,12 @@ import {
PageHeaderSummary,
PageHeaderTitle,
} from 'ui-patterns/PageHeader'
+
import { ProjectLayout } from '../ProjectLayout'
import EdgeFunctionsLayout from './EdgeFunctionsLayout'
interface EdgeFunctionDetailsLayoutProps {
- title?: string
+ title: string
}
const EdgeFunctionDetailsLayout = ({
@@ -91,6 +91,10 @@ const EdgeFunctionDetailsLayout = ({
)
const name = selectedFunction?.name || ''
+ const browserTitle = {
+ entity: functionSlug ? name || functionSlug : undefined,
+ section: title,
+ }
const breadcrumbItems = [
{
@@ -215,14 +219,18 @@ const EdgeFunctionDetailsLayout = ({
if (!isLoading && !canReadFunctions) {
return (
-
+
)
}
return (
-
+
{breadcrumbItems.length > 0 && (
diff --git a/apps/studio/components/layouts/EdgeFunctionsLayout/EdgeFunctionsLayout.tsx b/apps/studio/components/layouts/EdgeFunctionsLayout/EdgeFunctionsLayout.tsx
index b2967dfe84b..dd2f03aa7ba 100644
--- a/apps/studio/components/layouts/EdgeFunctionsLayout/EdgeFunctionsLayout.tsx
+++ b/apps/studio/components/layouts/EdgeFunctionsLayout/EdgeFunctionsLayout.tsx
@@ -1,9 +1,9 @@
-import { useRouter } from 'next/router'
-import { PropsWithChildren } from 'react'
-
import { useParams } from 'common'
import { ProductMenu } from 'components/ui/ProductMenu'
import { withAuth } from 'hooks/misc/withAuth'
+import { useRouter } from 'next/router'
+import { ComponentProps, PropsWithChildren } from 'react'
+
import { ProjectLayout } from '../ProjectLayout'
const EdgeFunctionsProductMenu = () => {
@@ -35,11 +35,21 @@ const EdgeFunctionsProductMenu = () => {
return ['browserTitle']
+}
+
+const EdgeFunctionsLayout = ({
+ children,
+ title,
+ browserTitle,
+}: PropsWithChildren) => {
return (
diff --git a/apps/studio/components/ui-patterns/Dialogs/DiscardChangesConfirmationDialog.tsx b/apps/studio/components/ui-patterns/Dialogs/DiscardChangesConfirmationDialog.tsx
index b7d920062ed..d1cb633596a 100644
--- a/apps/studio/components/ui-patterns/Dialogs/DiscardChangesConfirmationDialog.tsx
+++ b/apps/studio/components/ui-patterns/Dialogs/DiscardChangesConfirmationDialog.tsx
@@ -14,7 +14,7 @@ import {
AlertDialogTitle,
} from 'ui'
-interface DiscardChangesConfirmationDialogProps extends ConfirmOnCloseModalProps {
+export interface DiscardChangesConfirmationDialogProps extends ConfirmOnCloseModalProps {
title?: ReactNode
description?: ReactNode
confirmLabel?: ReactNode
diff --git a/apps/studio/components/ui-patterns/Dialogs/PreventNavigationOnUnsavedChanges.tsx b/apps/studio/components/ui-patterns/Dialogs/PreventNavigationOnUnsavedChanges.tsx
new file mode 100644
index 00000000000..a7e0a8f3dcc
--- /dev/null
+++ b/apps/studio/components/ui-patterns/Dialogs/PreventNavigationOnUnsavedChanges.tsx
@@ -0,0 +1,70 @@
+import { useRouter } from 'next/router'
+import { useEffect, useState } from 'react'
+import { BASE_PATH } from 'lib/constants'
+
+import {
+ DiscardChangesConfirmationDialog,
+ type DiscardChangesConfirmationDialogProps,
+} from './DiscardChangesConfirmationDialog'
+
+export const PreventNavigationOnUnsavedChanges = ({
+ hasChanges,
+ ...props
+}: { hasChanges: boolean } & Omit<
+ DiscardChangesConfirmationDialogProps,
+ 'visible' | 'onClose' | 'onCancel'
+>) => {
+ const router = useRouter()
+ const [navigateUrl, setNavigateUrl] = useState()
+ const [confirmNavigate, setConfirmNavigate] = useState(false)
+
+ useEffect(() => {
+ const handleBeforeUnload = (e: BeforeUnloadEvent) => {
+ if (hasChanges) {
+ e.preventDefault()
+ e.returnValue = '' // deprecated, but older browsers still require this
+ }
+ }
+
+ const handleBrowseAway = (url: string) => {
+ if (hasChanges && !confirmNavigate) {
+ setNavigateUrl(url)
+ throw 'Route change declined' // Just to prevent the route change
+ return
+ }
+ setNavigateUrl(undefined)
+ }
+ window.addEventListener('beforeunload', handleBeforeUnload)
+ router.events.on('routeChangeStart', handleBrowseAway)
+
+ return () => {
+ window.removeEventListener('beforeunload', handleBeforeUnload)
+ router.events.off('routeChangeStart', handleBrowseAway)
+ }
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [confirmNavigate, hasChanges])
+
+ const handleCancel = () => {
+ setNavigateUrl(undefined)
+ }
+
+ const handleClose = () => {
+ setConfirmNavigate(true)
+ let urlToNavigate = navigateUrl ?? '/'
+ if (BASE_PATH && urlToNavigate.startsWith(BASE_PATH)) {
+ urlToNavigate = urlToNavigate.slice(BASE_PATH.length) || '/'
+ }
+ if (!urlToNavigate.startsWith('/')) urlToNavigate = `/${urlToNavigate}`
+ setNavigateUrl(undefined)
+ router.push(urlToNavigate)
+ }
+
+ return (
+ {
+ if (!projectRef) throw new Error('projectRef is required')
+ if (!selectedSchemas) throw new Error('selectedSchemas is required')
+
+ const sql = getExposedFunctionCountsSql({ selectedSchemas })
+
+ const { result } = await executeSql(
+ {
+ projectRef,
+ connectionString,
+ sql,
+ queryKey: ['exposed-function-counts', selectedSchemas],
+ },
+ signal
+ )
+
+ return result[0] as ExposedFunctionCountsResponse
+}
+
+export type ExposedFunctionCountsData = Awaited>
+export type ExposedFunctionCountsError = ResponseError
+
+export const exposedFunctionCountsQueryOptions = (
+ { projectRef, connectionString, selectedSchemas }: ExposedFunctionCountsVariables,
+ { enabled = true }: { enabled?: boolean } = {}
+) => {
+ return queryOptions({
+ // eslint-disable-next-line @tanstack/query/exhaustive-deps -- connection string doesn't change the result of the query
+ queryKey: privilegeKeys.exposedFunctionCounts(projectRef, selectedSchemas),
+ queryFn: ({ signal }) =>
+ getExposedFunctionCounts(
+ {
+ projectRef,
+ connectionString,
+ selectedSchemas,
+ },
+ signal
+ ),
+ enabled: enabled && typeof projectRef !== 'undefined',
+ })
+}
diff --git a/apps/studio/data/privileges/exposed-functions-infinite-query.ts b/apps/studio/data/privileges/exposed-functions-infinite-query.ts
new file mode 100644
index 00000000000..dda8ec5151a
--- /dev/null
+++ b/apps/studio/data/privileges/exposed-functions-infinite-query.ts
@@ -0,0 +1,90 @@
+import { infiniteQueryOptions } from '@tanstack/react-query'
+import { executeSql } from 'data/sql/execute-sql-query'
+import type { ResponseError } from 'types'
+
+import { privilegeKeys } from './keys'
+import { getExposedFunctionsSql } from './privileges.sql'
+
+export const EXPOSED_FUNCTIONS_PAGE_LIMIT = 50
+
+export type ExposedFunctionsVariables = {
+ projectRef?: string
+ connectionString?: string | null
+ search?: string
+}
+
+export type ExposedFunction = {
+ schema: string
+ name: string
+ status: 'granted' | 'revoked' | 'custom'
+}
+
+export type ExposedFunctionsResponse = {
+ total_count: number
+ functions: ExposedFunction[]
+}
+
+export async function getExposedFunctions(
+ {
+ projectRef,
+ connectionString,
+ search,
+ page = 0,
+ limit = EXPOSED_FUNCTIONS_PAGE_LIMIT,
+ }: ExposedFunctionsVariables & { page?: number; limit?: number },
+ signal?: AbortSignal
+): Promise {
+ if (!projectRef) throw new Error('projectRef is required')
+
+ const offset = page * limit
+
+ const sql = getExposedFunctionsSql({ search, offset, limit })
+
+ const { result } = await executeSql(
+ {
+ projectRef,
+ connectionString,
+ sql,
+ queryKey: ['exposed-functions', page],
+ },
+ signal
+ )
+
+ return result[0] as ExposedFunctionsResponse
+}
+
+export type ExposedFunctionsData = Awaited>
+export type ExposedFunctionsError = ResponseError
+
+export const exposedFunctionsInfiniteQueryOptions = (
+ { projectRef, connectionString, search }: ExposedFunctionsVariables,
+ { enabled = true }: { enabled?: boolean } = {}
+) => {
+ return infiniteQueryOptions({
+ // eslint-disable-next-line @tanstack/query/exhaustive-deps -- connection string doesn't change the result of the query
+ queryKey: privilegeKeys.exposedFunctionsInfinite(projectRef, search),
+ queryFn: ({ signal, pageParam }) =>
+ getExposedFunctions(
+ {
+ projectRef,
+ connectionString,
+ search,
+ page: pageParam,
+ },
+ signal
+ ),
+ enabled: enabled && typeof projectRef !== 'undefined',
+ initialPageParam: 0,
+ getNextPageParam(lastPage, pages) {
+ const page = pages.length
+ const currentTotalCount = page * EXPOSED_FUNCTIONS_PAGE_LIMIT
+ const totalCount = lastPage.total_count ?? 0
+
+ if (currentTotalCount >= totalCount) {
+ return undefined
+ }
+
+ return page
+ },
+ })
+}
diff --git a/apps/studio/data/privileges/keys.ts b/apps/studio/data/privileges/keys.ts
index 328e39c325f..95f1b3519b1 100644
--- a/apps/studio/data/privileges/keys.ts
+++ b/apps/studio/data/privileges/keys.ts
@@ -13,4 +13,14 @@ export const privilegeKeys = {
] as const,
exposedTableCounts: (projectRef: string | undefined, selectedSchemas: string[]) =>
['projects', projectRef, 'privileges', 'exposed-table-counts', ...selectedSchemas] as const,
+ exposedFunctionsInfinite: (projectRef: string | undefined, search?: string) =>
+ [
+ 'projects',
+ projectRef,
+ 'privileges',
+ 'exposed-functions-infinite',
+ ...(search ? ([{ search }] as const) : []),
+ ] as const,
+ exposedFunctionCounts: (projectRef: string | undefined, selectedSchemas: string[]) =>
+ ['projects', projectRef, 'privileges', 'exposed-function-counts', ...selectedSchemas] as const,
}
diff --git a/apps/studio/data/privileges/privileges.sql.ts b/apps/studio/data/privileges/privileges.sql.ts
index 2f72c9699f2..46e08d894ff 100644
--- a/apps/studio/data/privileges/privileges.sql.ts
+++ b/apps/studio/data/privileges/privileges.sql.ts
@@ -121,42 +121,164 @@ export function getExposedTableCountsSql({ selectedSchemas }: { selectedSchemas:
return /* SQL */ `
with ${getTableGrantsCTEs()}
- select
+ select
count(*)::int as total_count,
(count(*) filter (where status = 'granted' and schema_name in (${schemasList})))::int as grants_count
- from table_grants
+ from table_grants
`
}
-export function getExposedSchemasSql() {
+/**
+ * Builds the shared `function_privileges` and `function_grants` CTEs used by
+ * both the exposed-functions list query and the counts-only query.
+ *
+ * Returns SQL text meant to follow `WITH` (no leading `WITH` keyword).
+ * Callers that append additional CTEs should add a comma after interpolation.
+ */
+function getFunctionGrantsCTEs({ search }: { search?: string } = {}) {
return /* SQL */ `
- select coalesce(
- (
- select jsonb_agg(distinct schema_name order by schema_name)
- from (
- select n.nspname as schema_name
- from pg_class c
- join pg_namespace n on n.oid = c.relnamespace
- left join lateral aclexplode(coalesce(c.relacl, acldefault('r', c.relowner))) as acl on true
- where c.relkind in ('r', 'p', 'v', 'm', 'f')
- and n.nspname not in (${IGNORED_SCHEMAS_LIST})
- group by c.oid, n.nspname
- having
- bool_or(
- pg_catalog.pg_get_userbyid(acl.grantee) = 'anon'
- and acl.privilege_type in ('SELECT', 'INSERT', 'UPDATE', 'DELETE')
+ function_privileges as (
+ select
+ n.nspname as schema_name,
+ p.proname as name,
+
+ -- Aggregate EXECUTE across all overloads + all 3 roles
+ bool_or(pr.rolname = 'anon' and acl.privilege_type = 'EXECUTE') as anon_execute,
+ bool_or(pr.rolname = 'authenticated' and acl.privilege_type = 'EXECUTE') as auth_execute,
+ bool_or(pr.rolname = 'service_role' and acl.privilege_type = 'EXECUTE') as srv_execute
+
+ from pg_proc p
+ join pg_namespace n
+ on n.oid = p.pronamespace
+ left join lateral aclexplode(coalesce(p.proacl, acldefault('f', p.proowner))) as acl
+ on true
+ left join pg_roles pr
+ on pr.oid = acl.grantee
+ where p.prokind in ('f', 'w')
+ and n.nspname not in (${IGNORED_SCHEMAS_LIST})
+ ${search ? `and (n.nspname || '.' || p.proname) ilike '%${search}%'` : ''}
+ group by n.nspname, p.proname
+ ),
+ function_grants as (
+ select
+ schema_name,
+ name,
+ case
+ when anon_execute and auth_execute and srv_execute then 'granted'
+ when not (anon_execute or auth_execute or srv_execute) then 'revoked'
+ else 'custom'
+ end as status
+ from function_privileges
+ )
+ `
+}
+
+export function getExposedFunctionsSql({
+ search,
+ offset,
+ limit,
+}: {
+ search?: string
+ offset: number
+ limit: number
+}) {
+ return /* SQL */ `
+ with ${getFunctionGrantsCTEs({ search })}
+ select
+ (select count(*)::int from function_grants) as total_count,
+ coalesce(
+ (
+ select jsonb_agg(
+ jsonb_build_object(
+ 'schema', fg.schema_name,
+ 'name', fg.name,
+ 'status', fg.status
)
- and bool_or(
- pg_catalog.pg_get_userbyid(acl.grantee) = 'authenticated'
- and acl.privilege_type in ('SELECT', 'INSERT', 'UPDATE', 'DELETE')
- )
- and bool_or(
- pg_catalog.pg_get_userbyid(acl.grantee) = 'service_role'
- and acl.privilege_type in ('SELECT', 'INSERT', 'UPDATE', 'DELETE')
- )
- ) t
- ),
- '[]'::jsonb
- ) as schemas;
+ )
+ from (
+ select *
+ from function_grants
+ order by schema_name, name
+ offset ${offset}
+ limit ${limit}
+ ) fg
+ ),
+ '[]'::jsonb
+ ) as functions;
+ `
+}
+
+export function getExposedFunctionCountsSql({ selectedSchemas }: { selectedSchemas: string[] }) {
+ const schemasList =
+ selectedSchemas.length > 0 ? selectedSchemas.map((s) => `'${s}'`).join(', ') : "''"
+
+ return /* SQL */ `
+ with ${getFunctionGrantsCTEs()}
+ select
+ count(*)::int as total_count,
+ (count(*) filter (where status = 'granted' and schema_name in (${schemasList})))::int as grants_count
+ from function_grants
+ `
+}
+
+export const buildTablePrivilegesSql = (oids: number[], action: 'grant' | 'revoke') => {
+ if (oids.length === 0) return ''
+
+ const privilegeClause =
+ action === 'grant'
+ ? 'grant select, insert, update, delete on table %I.%I to anon, authenticated, service_role'
+ : 'revoke all on table %I.%I from anon, authenticated, service_role'
+
+ return /* SQL */ `
+ do $$
+ declare
+ nspname name;
+ relname name;
+ begin
+ for nspname, relname in
+ select n.nspname, c.relname
+ from pg_class c
+ join pg_namespace n on n.oid = c.relnamespace
+ where c.oid in (${oids.join(', ')})
+ loop
+ execute format('${privilegeClause}', nspname, relname);
+ end loop;
+ end $$;
+ `
+}
+
+export const buildFunctionPrivilegesSql = (schemaNames: string[], action: 'grant' | 'revoke') => {
+ if (schemaNames.length === 0) return ''
+
+ const tuples = schemaNames
+ .map((sn) => {
+ const dotIdx = sn.indexOf('.')
+ const schema = sn.slice(0, dotIdx)
+ const name = sn.slice(dotIdx + 1)
+ return `('${schema}','${name}')`
+ })
+ .join(', ')
+
+ const privilegeClause =
+ action === 'grant'
+ ? 'grant execute on function %I.%I(%s) to anon, authenticated, service_role'
+ : 'revoke all on function %I.%I(%s) from anon, authenticated, service_role'
+
+ return /* SQL */ `
+ do $$
+ declare
+ nspname name;
+ proname name;
+ arg_types text;
+ begin
+ for nspname, proname, arg_types in
+ select n.nspname, p.proname, pg_get_function_identity_arguments(p.oid)
+ from pg_proc p
+ join pg_namespace n on n.oid = p.pronamespace
+ where (n.nspname, p.proname) in (${tuples})
+ loop
+ execute format('${privilegeClause}', nspname, proname, arg_types);
+ end loop;
+ end $$;
`
}
diff --git a/apps/studio/data/privileges/update-exposed-entities-mutation.ts b/apps/studio/data/privileges/update-exposed-entities-mutation.ts
new file mode 100644
index 00000000000..b5768804ac7
--- /dev/null
+++ b/apps/studio/data/privileges/update-exposed-entities-mutation.ts
@@ -0,0 +1,72 @@
+import { useMutation } from '@tanstack/react-query'
+import { executeSql } from 'data/sql/execute-sql-query'
+import { toast } from 'sonner'
+import type { UseCustomMutationOptions } from 'types'
+
+import type { ConnectionVars } from '../common.types'
+import { buildFunctionPrivilegesSql, buildTablePrivilegesSql } from './privileges.sql'
+
+export type UpdateExposedEntitiesVariables = ConnectionVars & {
+ tableIdsToAdd: number[]
+ tableIdsToRemove: number[]
+ functionNamesToAdd: string[]
+ functionNamesToRemove: string[]
+}
+
+export async function updateExposedEntities({
+ projectRef,
+ connectionString,
+ tableIdsToAdd,
+ tableIdsToRemove,
+ functionNamesToAdd,
+ functionNamesToRemove,
+}: UpdateExposedEntitiesVariables): Promise {
+ if (!projectRef) throw new Error('projectRef is required')
+
+ const sqlParts: string[] = []
+
+ if (tableIdsToAdd.length > 0) {
+ sqlParts.push(buildTablePrivilegesSql(tableIdsToAdd, 'grant'))
+ }
+
+ if (tableIdsToRemove.length > 0) {
+ sqlParts.push(buildTablePrivilegesSql(tableIdsToRemove, 'revoke'))
+ }
+
+ if (functionNamesToAdd.length > 0) {
+ sqlParts.push(buildFunctionPrivilegesSql(functionNamesToAdd, 'grant'))
+ }
+
+ if (functionNamesToRemove.length > 0) {
+ sqlParts.push(buildFunctionPrivilegesSql(functionNamesToRemove, 'revoke'))
+ }
+
+ if (sqlParts.length === 0) return
+
+ await executeSql({
+ projectRef,
+ connectionString,
+ sql: sqlParts.join('\n'),
+ queryKey: ['update-exposed-entities'],
+ })
+}
+
+type UpdateExposedEntitiesData = Awaited>
+
+export const useUpdateExposedEntitiesMutation = ({
+ onSuccess,
+ onError,
+ ...options
+}: Omit<
+ UseCustomMutationOptions,
+ 'mutationFn'
+> = {}) => {
+ return useMutation({
+ mutationFn: (vars: UpdateExposedEntitiesVariables) => updateExposedEntities(vars),
+ onError(error: Error) {
+ toast.error(`Failed to update entity access: ${error.message}`)
+ },
+ ...(onError ? { onError } : {}),
+ ...options,
+ })
+}
diff --git a/apps/studio/data/privileges/update-exposed-tables-mutation.ts b/apps/studio/data/privileges/update-exposed-tables-mutation.ts
deleted file mode 100644
index 47b576d0209..00000000000
--- a/apps/studio/data/privileges/update-exposed-tables-mutation.ts
+++ /dev/null
@@ -1,88 +0,0 @@
-import { useMutation } from '@tanstack/react-query'
-import { executeSql } from 'data/sql/execute-sql-query'
-import { toast } from 'sonner'
-import type { UseCustomMutationOptions } from 'types'
-
-import type { ConnectionVars } from '../common.types'
-import { getExposedSchemasSql } from './privileges.sql'
-
-export type UpdateExposedTablesVariables = ConnectionVars & {
- tableIdsToAdd: number[]
- tableIdsToRemove: number[]
-}
-
-const buildTablePrivilegesSql = (oids: number[], action: 'grant' | 'revoke') => {
- if (oids.length === 0) return ''
-
- const privilegeClause =
- action === 'grant'
- ? 'grant select, insert, update, delete on table %I.%I to anon, authenticated, service_role'
- : 'revoke all on table %I.%I from anon, authenticated, service_role'
-
- return /* SQL */ `
- do $$
- declare
- relname name;
- nspname name;
- begin
- for nspname, relname in
- select n.nspname, c.relname
- from pg_class c
- join pg_namespace n on n.oid = c.relnamespace
- where c.oid in (${oids.join(', ')})
- loop
- execute format('${privilegeClause}', relname, nspname);
- end loop;
- end $$;
- `
-}
-
-export async function updateExposedTables({
- projectRef,
- connectionString,
- tableIdsToAdd,
- tableIdsToRemove,
-}: UpdateExposedTablesVariables): Promise {
- if (!projectRef) throw new Error('projectRef is required')
-
- const sqlParts: string[] = []
-
- if (tableIdsToAdd.length > 0) {
- sqlParts.push(buildTablePrivilegesSql(tableIdsToAdd, 'grant'))
- }
-
- if (tableIdsToRemove.length > 0) {
- sqlParts.push(buildTablePrivilegesSql(tableIdsToRemove, 'revoke'))
- }
-
- sqlParts.push(getExposedSchemasSql())
-
- const { result } = await executeSql({
- projectRef,
- connectionString,
- sql: sqlParts.join('\n'),
- queryKey: ['update-exposed-tables'],
- })
-
- return (result[0] as { schemas: string[] }).schemas
-}
-
-type UpdateExposedTablesData = Awaited>
-
-export const useUpdateExposedTablesMutation = ({
- onSuccess,
- onError,
- ...options
-}: Omit<
- UseCustomMutationOptions,
- 'mutationFn'
-> = {}) => {
- return useMutation({
- mutationFn: (vars: UpdateExposedTablesVariables) => updateExposedTables(vars),
- onError(error: Error) {
- toast.error(`Failed to update table access: ${error.message}`)
- },
- ...(onError ? { onError } : {}),
- ...options,
- })
-}
diff --git a/apps/studio/data/tables/tables-query.ts b/apps/studio/data/tables/tables-query.ts
index f0923b3ecc7..5ac76f2df89 100644
--- a/apps/studio/data/tables/tables-query.ts
+++ b/apps/studio/data/tables/tables-query.ts
@@ -64,7 +64,7 @@ export async function getTables(
return sortBy(data, (t) => t[sortByProperty]) as PostgresTable[]
}
- return data as Omit[]
+ return data as PostgresTable[]
}
export type TablesData = Awaited>
diff --git a/apps/studio/next.config.js b/apps/studio/next.config.js
index fe823976497..a81b145ff77 100644
--- a/apps/studio/next.config.js
+++ b/apps/studio/next.config.js
@@ -88,6 +88,11 @@ const nextConfig = {
destination: '/sign-in',
permanent: false,
},
+ {
+ source: '/project/:ref/building',
+ destination: '/project/:ref',
+ permanent: false,
+ },
]
: [
{
@@ -120,6 +125,11 @@ const nextConfig = {
destination: '/project/default',
permanent: false,
},
+ {
+ source: '/project/:ref/building',
+ destination: '/project/:ref',
+ permanent: false,
+ },
]),
{
source: '/project/:ref/auth',
diff --git a/apps/studio/pages/new/[slug].tsx b/apps/studio/pages/new/[slug].tsx
index 13a3cac2222..7a7322ea882 100644
--- a/apps/studio/pages/new/[slug].tsx
+++ b/apps/studio/pages/new/[slug].tsx
@@ -85,7 +85,6 @@ const Wizard: NextPageWithLayout = () => {
const projectCreationDisabled = useFlag('disableProjectCreationAndUpdate')
const showPostgresVersionSelector = useFlag('showPostgresVersionSelector')
const cloudProviderEnabled = useFlag('enableFlyCloudProvider')
- const isHomeNew = usePHFlag('homeNew') === 'new-home'
const showNonProdFields = process.env.NEXT_PUBLIC_ENVIRONMENT !== 'prod'
const isNotOnHigherPlan = !['team', 'enterprise', 'platform'].includes(currentOrg?.plan.id ?? '')
@@ -253,7 +252,7 @@ const Wizard: NextPageWithLayout = () => {
organization: res.organization_slug,
}
)
- router.push(isHomeNew ? `/project/${res.ref}` : `/project/${res.ref}/building`)
+ router.push(`/project/${res.ref}`)
},
})
diff --git a/apps/studio/pages/project/[ref]/auth/audit-logs.tsx b/apps/studio/pages/project/[ref]/auth/audit-logs.tsx
index d3d5b1725ec..00f1987dc9b 100644
--- a/apps/studio/pages/project/[ref]/auth/audit-logs.tsx
+++ b/apps/studio/pages/project/[ref]/auth/audit-logs.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { AuditLogsForm } from 'components/interfaces/Auth/AuditLogsForm'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
@@ -62,7 +61,7 @@ const AuditLogsPage: NextPageWithLayout = () => {
AuditLogsPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/hooks.tsx b/apps/studio/pages/project/[ref]/auth/hooks.tsx
index e4eed3e87a5..6a2056593fc 100644
--- a/apps/studio/pages/project/[ref]/auth/hooks.tsx
+++ b/apps/studio/pages/project/[ref]/auth/hooks.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { HooksListing } from 'components/interfaces/Auth/Hooks/HooksListing'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
@@ -60,7 +59,7 @@ const Hooks: NextPageWithLayout = () => {
Hooks.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/index.tsx b/apps/studio/pages/project/[ref]/auth/index.tsx
deleted file mode 100644
index 8bef5974447..00000000000
--- a/apps/studio/pages/project/[ref]/auth/index.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
-import DefaultLayout from 'components/layouts/DefaultLayout'
-import type { NextPageWithLayout } from 'types'
-
-const Authentication: NextPageWithLayout = () => {
- return <>{/* Use this as a template for authentication pages */}
-}
-
-Authentication.getLayout = (page) => (
-
- {page}
-
-)
-
-export default Authentication
diff --git a/apps/studio/pages/project/[ref]/auth/mfa.tsx b/apps/studio/pages/project/[ref]/auth/mfa.tsx
index f9237a052e1..4c6170b5023 100644
--- a/apps/studio/pages/project/[ref]/auth/mfa.tsx
+++ b/apps/studio/pages/project/[ref]/auth/mfa.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { useParams } from 'common'
import { MfaAuthSettingsForm } from 'components/interfaces/Auth/MfaAuthSettingsForm/MfaAuthSettingsForm'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
@@ -66,7 +65,7 @@ const MfaPage: NextPageWithLayout = () => {
MfaPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/oauth-apps.tsx b/apps/studio/pages/project/[ref]/auth/oauth-apps.tsx
index 1afacb80cc8..b3a16cfbc8c 100644
--- a/apps/studio/pages/project/[ref]/auth/oauth-apps.tsx
+++ b/apps/studio/pages/project/[ref]/auth/oauth-apps.tsx
@@ -38,7 +38,7 @@ const OAuthApps: NextPageWithLayout = () => (
OAuthApps.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/oauth-server.tsx b/apps/studio/pages/project/[ref]/auth/oauth-server.tsx
index 169a032c191..340c771b1ae 100644
--- a/apps/studio/pages/project/[ref]/auth/oauth-server.tsx
+++ b/apps/studio/pages/project/[ref]/auth/oauth-server.tsx
@@ -44,7 +44,7 @@ const ProvidersPage: NextPageWithLayout = () => {
ProvidersPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/overview.tsx b/apps/studio/pages/project/[ref]/auth/overview.tsx
index 6caef37cf1c..0855d7a60f7 100644
--- a/apps/studio/pages/project/[ref]/auth/overview.tsx
+++ b/apps/studio/pages/project/[ref]/auth/overview.tsx
@@ -1,6 +1,3 @@
-import { useRouter } from 'next/router'
-import { useContext, useEffect } from 'react'
-
import { FeatureFlagContext, useFlag, useParams } from 'common'
import { OverviewLearnMore } from 'components/interfaces/Auth/Overview/OverviewLearnMore'
import { OverviewMetrics } from 'components/interfaces/Auth/Overview/OverviewMetrics'
@@ -9,6 +6,8 @@ import DefaultLayout from 'components/layouts/DefaultLayout'
import { DocsButton } from 'components/ui/DocsButton'
import { useAuthOverviewQuery } from 'data/auth/auth-overview-query'
import { DOCS_URL } from 'lib/constants'
+import { useRouter } from 'next/router'
+import { useContext, useEffect } from 'react'
import { NextPageWithLayout } from 'types'
import { PageContainer } from 'ui-patterns/PageContainer'
import {
@@ -69,7 +68,7 @@ const AuthOverview: NextPageWithLayout = () => {
AuthOverview.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/performance.tsx b/apps/studio/pages/project/[ref]/auth/performance.tsx
index 745e9c45fd7..04967ab9d9d 100644
--- a/apps/studio/pages/project/[ref]/auth/performance.tsx
+++ b/apps/studio/pages/project/[ref]/auth/performance.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { useParams } from 'common'
import { PerformanceSettingsForm } from 'components/interfaces/Auth/PerformanceSettingsForm'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
@@ -66,7 +65,7 @@ const PerformancePage: NextPageWithLayout = () => {
PerformancePage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/policies.tsx b/apps/studio/pages/project/[ref]/auth/policies.tsx
index f6ce2a7f3f1..3ba6e76f7dd 100644
--- a/apps/studio/pages/project/[ref]/auth/policies.tsx
+++ b/apps/studio/pages/project/[ref]/auth/policies.tsx
@@ -367,7 +367,7 @@ const AuthPoliciesPage: NextPageWithLayout = () => {
AuthPoliciesPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/protection.tsx b/apps/studio/pages/project/[ref]/auth/protection.tsx
index 7f1c6666926..ffff8d7a779 100644
--- a/apps/studio/pages/project/[ref]/auth/protection.tsx
+++ b/apps/studio/pages/project/[ref]/auth/protection.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { useParams } from 'common'
import { ProtectionAuthSettingsForm } from 'components/interfaces/Auth/ProtectionAuthSettingsForm/ProtectionAuthSettingsForm'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
@@ -66,7 +65,7 @@ const ProtectionPage: NextPageWithLayout = () => {
ProtectionPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/rate-limits.tsx b/apps/studio/pages/project/[ref]/auth/rate-limits.tsx
index fd626ae0ee2..25a4ce7bc98 100644
--- a/apps/studio/pages/project/[ref]/auth/rate-limits.tsx
+++ b/apps/studio/pages/project/[ref]/auth/rate-limits.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { useParams } from 'common'
import { RateLimits } from 'components/interfaces/Auth/RateLimits/RateLimits'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
@@ -74,7 +73,7 @@ const RateLimitsPage: NextPageWithLayout = () => {
RateLimitsPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/sessions.tsx b/apps/studio/pages/project/[ref]/auth/sessions.tsx
index 3d1751f787a..96cf40900ba 100644
--- a/apps/studio/pages/project/[ref]/auth/sessions.tsx
+++ b/apps/studio/pages/project/[ref]/auth/sessions.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { SessionsAuthSettingsForm } from 'components/interfaces/Auth/SessionsAuthSettingsForm/SessionsAuthSettingsForm'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
@@ -56,7 +55,7 @@ const SessionsPage: NextPageWithLayout = () => {
SessionsPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/templates/[templateId].tsx b/apps/studio/pages/project/[ref]/auth/templates/[templateId].tsx
index d16a6ac2acb..f9dfc1323e1 100644
--- a/apps/studio/pages/project/[ref]/auth/templates/[templateId].tsx
+++ b/apps/studio/pages/project/[ref]/auth/templates/[templateId].tsx
@@ -1,12 +1,5 @@
import { zodResolver } from '@hookform/resolvers/zod'
import { PermissionAction } from '@supabase/shared-types/out/constants'
-import Link from 'next/link'
-import { useRouter } from 'next/router'
-import { useEffect } from 'react'
-import { useForm } from 'react-hook-form'
-import { toast } from 'sonner'
-import { z } from 'zod'
-
import { useParams } from 'common'
import { TEMPLATES_SCHEMAS } from 'components/interfaces/Auth/AuthTemplatesValidation'
import { slugifyTitle } from 'components/interfaces/Auth/EmailTemplates/EmailTemplates.utils'
@@ -19,6 +12,11 @@ import { useAuthConfigQuery } from 'data/auth/auth-config-query'
import { useAuthConfigUpdateMutation } from 'data/auth/auth-config-update-mutation'
import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
import { DOCS_URL } from 'lib/constants'
+import Link from 'next/link'
+import { useRouter } from 'next/router'
+import { useEffect } from 'react'
+import { useForm } from 'react-hook-form'
+import { toast } from 'sonner'
import type { NextPageWithLayout } from 'types'
import {
Button,
@@ -56,6 +54,7 @@ import {
BreadcrumbPage,
BreadcrumbSeparator,
} from 'ui/src/components/shadcn/ui/breadcrumb'
+import { z } from 'zod'
const TemplatePage: NextPageWithLayout = () => {
return
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/third-party.tsx b/apps/studio/pages/project/[ref]/auth/third-party.tsx
index 1ce5724e89e..e2621ec8376 100644
--- a/apps/studio/pages/project/[ref]/auth/third-party.tsx
+++ b/apps/studio/pages/project/[ref]/auth/third-party.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { useParams } from 'common'
import { ThirdPartyAuthForm } from 'components/interfaces/Auth/ThirdPartyAuthForm'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
@@ -23,7 +22,7 @@ const ThirdPartyPage: NextPageWithLayout = () => {
if (!showThirdPartyAuth) {
return (
-
+
)
diff --git a/apps/studio/pages/project/[ref]/auth/url-configuration.tsx b/apps/studio/pages/project/[ref]/auth/url-configuration.tsx
index 9f74bc06b88..0fee7d3fbb3 100644
--- a/apps/studio/pages/project/[ref]/auth/url-configuration.tsx
+++ b/apps/studio/pages/project/[ref]/auth/url-configuration.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { RedirectUrls } from 'components/interfaces/Auth/RedirectUrls/RedirectUrls'
import SiteUrl from 'components/interfaces/Auth/SiteUrl/SiteUrl'
import AuthLayout from 'components/layouts/AuthLayout/AuthLayout'
@@ -60,7 +59,7 @@ const URLConfiguration: NextPageWithLayout = () => {
URLConfiguration.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/auth/users.tsx b/apps/studio/pages/project/[ref]/auth/users.tsx
index 33cde059efa..35ee67c1d73 100644
--- a/apps/studio/pages/project/[ref]/auth/users.tsx
+++ b/apps/studio/pages/project/[ref]/auth/users.tsx
@@ -9,7 +9,7 @@ const UsersPage: NextPageWithLayout = () => {
UsersPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/building.tsx b/apps/studio/pages/project/[ref]/building.tsx
deleted file mode 100644
index 73d694b1bbc..00000000000
--- a/apps/studio/pages/project/[ref]/building.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import DefaultLayout from 'components/layouts/DefaultLayout'
-import { ProjectLayoutWithAuth } from 'components/layouts/ProjectLayout'
-import { useRouter } from 'next/router'
-import { useEffect } from 'react'
-import type { NextPageWithLayout } from 'types'
-
-const ProjectBuildingPage: NextPageWithLayout = () => {
- return
- {page}
-
-)
-
-export default ProjectBuildingPage
-
-const RedirectToDashboard = () => {
- const router = useRouter()
- const { ref } = router.query
-
- useEffect(() => {
- // Use redirect to reload store data properly after project has been
- // been created or unpaused, this is necessarily especially for unpausing
- // so that the dashboard fetches the updated connection strings
- // window.location.replace(`/project/${ref}`)
-
- // TODO: for experiment only
- // Cos we already pulling new connectionString after project building/restoring
- // just use normal router.push is enough
- router.push(`/project/${ref}`)
- }, [])
-
- return null
-}
diff --git a/apps/studio/pages/project/[ref]/database/backups/pitr.tsx b/apps/studio/pages/project/[ref]/database/backups/pitr.tsx
index 96b0fd6a934..da113de653b 100644
--- a/apps/studio/pages/project/[ref]/database/backups/pitr.tsx
+++ b/apps/studio/pages/project/[ref]/database/backups/pitr.tsx
@@ -1,6 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-import { AlertCircle } from 'lucide-react'
-
import { useParams } from 'common'
import DatabaseBackupsNav from 'components/interfaces/Database/Backups/DatabaseBackupsNav'
import { PITRNotice } from 'components/interfaces/Database/Backups/PITR/PITRNotice'
@@ -16,6 +14,7 @@ import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
import { useIsOrioleDbInAws, useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
import { DOCS_URL, PROJECT_STATUS } from 'lib/constants'
+import { AlertCircle } from 'lucide-react'
import type { NextPageWithLayout } from 'types'
import { Alert_Shadcn_, AlertDescription_Shadcn_, AlertTitle_Shadcn_ } from 'ui'
import { Admonition } from 'ui-patterns'
@@ -29,6 +28,7 @@ import {
} from 'ui-patterns/PageHeader'
import { PageSection, PageSectionContent } from 'ui-patterns/PageSection'
import { GenericSkeletonLoader } from 'ui-patterns/ShimmeringLoader'
+
import { useCheckEntitlements } from '@/hooks/misc/useCheckEntitlements'
const DatabasePhysicalBackups: NextPageWithLayout = () => {
@@ -59,7 +59,7 @@ const DatabasePhysicalBackups: NextPageWithLayout = () => {
DatabasePhysicalBackups.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/backups/restore-to-new-project.tsx b/apps/studio/pages/project/[ref]/database/backups/restore-to-new-project.tsx
index afa77cc8358..4f120488697 100644
--- a/apps/studio/pages/project/[ref]/database/backups/restore-to-new-project.tsx
+++ b/apps/studio/pages/project/[ref]/database/backups/restore-to-new-project.tsx
@@ -51,7 +51,7 @@ const RestoreToNewProjectPage: NextPageWithLayout = () => {
RestoreToNewProjectPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/backups/scheduled.tsx b/apps/studio/pages/project/[ref]/database/backups/scheduled.tsx
index fdb99fae7de..d79d687d345 100644
--- a/apps/studio/pages/project/[ref]/database/backups/scheduled.tsx
+++ b/apps/studio/pages/project/[ref]/database/backups/scheduled.tsx
@@ -125,7 +125,7 @@ const DatabaseScheduledBackups: NextPageWithLayout = () => {
DatabaseScheduledBackups.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/extensions.tsx b/apps/studio/pages/project/[ref]/database/extensions.tsx
index a3b7b8e55d7..628c21b13ea 100644
--- a/apps/studio/pages/project/[ref]/database/extensions.tsx
+++ b/apps/studio/pages/project/[ref]/database/extensions.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { Extensions } from 'components/interfaces/Database/Extensions/Extensions'
import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
@@ -57,7 +56,7 @@ const DatabaseExtensions: NextPageWithLayout = () => {
DatabaseExtensions.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/functions.tsx b/apps/studio/pages/project/[ref]/database/functions.tsx
index 18f07bf4076..61b37d0363a 100644
--- a/apps/studio/pages/project/[ref]/database/functions.tsx
+++ b/apps/studio/pages/project/[ref]/database/functions.tsx
@@ -52,7 +52,7 @@ const DatabaseFunctionsPage: NextPageWithLayout = () => {
DatabaseFunctionsPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/index.tsx b/apps/studio/pages/project/[ref]/database/index.tsx
deleted file mode 100644
index adbea34ac88..00000000000
--- a/apps/studio/pages/project/[ref]/database/index.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
-import DefaultLayout from 'components/layouts/DefaultLayout'
-import type { NextPageWithLayout } from 'types'
-
-const Database: NextPageWithLayout = () => {
- return <>{/* Use this as a page template for database */}
-}
-
-Database.getLayout = (page) => (
-
- {page}
-
-)
-
-export default Database
diff --git a/apps/studio/pages/project/[ref]/database/publications/[id].tsx b/apps/studio/pages/project/[ref]/database/publications/[id].tsx
index 2905ae2a7c1..1d82acf59e3 100644
--- a/apps/studio/pages/project/[ref]/database/publications/[id].tsx
+++ b/apps/studio/pages/project/[ref]/database/publications/[id].tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { PublicationsTables } from 'components/interfaces/Database/Publications/PublicationsTables'
import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
@@ -30,9 +29,7 @@ const DatabasePublications: NextPageWithLayout = () => {
DatabasePublications.getLayout = (page) => (
-
- {page}
-
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/publications/index.tsx b/apps/studio/pages/project/[ref]/database/publications/index.tsx
index 587808a83f0..9a241e4cedd 100644
--- a/apps/studio/pages/project/[ref]/database/publications/index.tsx
+++ b/apps/studio/pages/project/[ref]/database/publications/index.tsx
@@ -1,5 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-
import { PublicationsList } from 'components/interfaces/Database/Publications/PublicationsList'
import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
@@ -47,7 +46,7 @@ const DatabasePublications: NextPageWithLayout = () => {
DatabasePublications.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/replication/[pipelineId].tsx b/apps/studio/pages/project/[ref]/database/replication/[pipelineId].tsx
index 8eab0e175f2..255c0efca44 100644
--- a/apps/studio/pages/project/[ref]/database/replication/[pipelineId].tsx
+++ b/apps/studio/pages/project/[ref]/database/replication/[pipelineId].tsx
@@ -1,6 +1,3 @@
-import { useRouter } from 'next/router'
-import { useContext, useEffect } from 'react'
-
import { FeatureFlagContext, useParams } from 'common'
import { ReplicationPipelineStatus } from 'components/interfaces/Database/Replication/ReplicationPipelineStatus/ReplicationPipelineStatus'
import { useIsETLPrivateAlpha } from 'components/interfaces/Database/Replication/useIsETLPrivateAlpha'
@@ -8,6 +5,8 @@ import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
import { ScaffoldContainer, ScaffoldSection } from 'components/layouts/Scaffold'
import { FormHeader } from 'components/ui/Forms/FormHeader'
+import { useRouter } from 'next/router'
+import { useContext, useEffect } from 'react'
import { PipelineRequestStatusProvider } from 'state/replication-pipeline-request-status'
import type { NextPageWithLayout } from 'types'
@@ -43,7 +42,7 @@ const DatabaseReplicationPage: NextPageWithLayout = () => {
DatabaseReplicationPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/replication/index.tsx b/apps/studio/pages/project/[ref]/database/replication/index.tsx
index 46c71518f67..b11a66035a5 100644
--- a/apps/studio/pages/project/[ref]/database/replication/index.tsx
+++ b/apps/studio/pages/project/[ref]/database/replication/index.tsx
@@ -47,7 +47,7 @@ const DatabaseReplicationPage: NextPageWithLayout = () => {
DatabaseReplicationPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/replication/replica/[replicaId].tsx b/apps/studio/pages/project/[ref]/database/replication/replica/[replicaId].tsx
index c50ac678475..3d7730e40d5 100644
--- a/apps/studio/pages/project/[ref]/database/replication/replica/[replicaId].tsx
+++ b/apps/studio/pages/project/[ref]/database/replication/replica/[replicaId].tsx
@@ -1,7 +1,15 @@
+import { useParams } from 'common'
+import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
+import { DefaultLayout } from 'components/layouts/DefaultLayout'
+import { Database } from 'icons'
import { Loader2, Trash } from 'lucide-react'
import Link from 'next/link'
import { useRouter } from 'next/router'
import { useEffect, useMemo, useState } from 'react'
+import { AWS_REGIONS } from 'shared-data'
+import type { NextPageWithLayout } from 'types'
+import { Badge, Button } from 'ui'
+import { ShimmeringLoader } from 'ui-patterns'
import { ReadReplicaDetails } from '@/components/interfaces/Database/Replication/ReadReplicas/ReadReplicaDetails'
import {
@@ -20,14 +28,6 @@ import {
ReplicaInitializationStatus,
useReadReplicasStatusesQuery,
} from '@/data/read-replicas/replicas-status-query'
-import { useParams } from 'common'
-import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
-import { DefaultLayout } from 'components/layouts/DefaultLayout'
-import { Database } from 'icons'
-import { AWS_REGIONS } from 'shared-data'
-import type { NextPageWithLayout } from 'types'
-import { Badge, Button } from 'ui'
-import { ShimmeringLoader } from 'ui-patterns'
const DatabaseReadReplicaPage: NextPageWithLayout = () => {
const router = useRouter()
@@ -179,7 +179,7 @@ const DatabaseReadReplicaPage: NextPageWithLayout = () => {
DatabaseReadReplicaPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/roles.tsx b/apps/studio/pages/project/[ref]/database/roles.tsx
index c4ed69b5c5f..bde0ff8163c 100644
--- a/apps/studio/pages/project/[ref]/database/roles.tsx
+++ b/apps/studio/pages/project/[ref]/database/roles.tsx
@@ -48,7 +48,7 @@ const DatabaseRoles: NextPageWithLayout = () => {
DatabaseRoles.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/schemas.tsx b/apps/studio/pages/project/[ref]/database/schemas.tsx
index 3b65542418b..7cfcb036b1f 100644
--- a/apps/studio/pages/project/[ref]/database/schemas.tsx
+++ b/apps/studio/pages/project/[ref]/database/schemas.tsx
@@ -1,8 +1,7 @@
-import { ReactFlowProvider } from 'reactflow'
-
import { SchemaGraph } from 'components/interfaces/Database/Schemas/SchemaGraph'
import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
+import { ReactFlowProvider } from 'reactflow'
import type { NextPageWithLayout } from 'types'
const SchemasPage: NextPageWithLayout = () => {
@@ -17,7 +16,7 @@ const SchemasPage: NextPageWithLayout = () => {
SchemasPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/settings.tsx b/apps/studio/pages/project/[ref]/database/settings.tsx
index 45260e8a107..4c90c843d39 100644
--- a/apps/studio/pages/project/[ref]/database/settings.tsx
+++ b/apps/studio/pages/project/[ref]/database/settings.tsx
@@ -76,7 +76,7 @@ const ProjectSettings: NextPageWithLayout = () => {
ProjectSettings.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/tables/[id].tsx b/apps/studio/pages/project/[ref]/database/tables/[id].tsx
index 3401092bacc..94b4a029eda 100644
--- a/apps/studio/pages/project/[ref]/database/tables/[id].tsx
+++ b/apps/studio/pages/project/[ref]/database/tables/[id].tsx
@@ -1,5 +1,3 @@
-import { ChevronRight } from 'lucide-react'
-
import { useParams } from 'common'
import { ColumnList } from 'components/interfaces/Database/Tables/ColumnList'
import DeleteConfirmationDialogs from 'components/interfaces/TableGridEditor/DeleteConfirmationDialogs'
@@ -11,6 +9,7 @@ import { FormHeader } from 'components/ui/Forms/FormHeader'
import { useTableEditorQuery } from 'data/table-editor/table-editor-query'
import { isTableLike } from 'data/table-editor/table-editor-types'
import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
+import { ChevronRight } from 'lucide-react'
import { useTableEditorStateSnapshot } from 'state/table-editor'
import { TableEditorTableStateContextProvider } from 'state/table-editor-table'
import type { NextPageWithLayout } from 'types'
@@ -68,7 +67,7 @@ const DatabaseTables: NextPageWithLayout = () => {
DatabaseTables.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/tables/index.tsx b/apps/studio/pages/project/[ref]/database/tables/index.tsx
index 40c0367c00a..be5c94888f3 100644
--- a/apps/studio/pages/project/[ref]/database/tables/index.tsx
+++ b/apps/studio/pages/project/[ref]/database/tables/index.tsx
@@ -1,6 +1,4 @@
import { PostgresTable } from '@supabase/postgres-meta'
-import { useState } from 'react'
-
import { useParams } from 'common'
import { TableList } from 'components/interfaces/Database/Tables/TableList'
import DeleteConfirmationDialogs from 'components/interfaces/TableGridEditor/DeleteConfirmationDialogs'
@@ -8,6 +6,7 @@ import { SidePanelEditor } from 'components/interfaces/TableGridEditor/SidePanel
import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
import DefaultLayout from 'components/layouts/DefaultLayout'
import { Entity, isTableLike, postgresTableToEntity } from 'data/table-editor/table-editor-types'
+import { useState } from 'react'
import { useTableEditorStateSnapshot } from 'state/table-editor'
import { TableEditorTableStateContextProvider } from 'state/table-editor-table'
import type { NextPageWithLayout } from 'types'
@@ -75,7 +74,7 @@ const DatabaseTables: NextPageWithLayout = () => {
DatabaseTables.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/database/triggers/data.tsx b/apps/studio/pages/project/[ref]/database/triggers/data.tsx
index 11d2a3b31bd..2d947170ab9 100644
--- a/apps/studio/pages/project/[ref]/database/triggers/data.tsx
+++ b/apps/studio/pages/project/[ref]/database/triggers/data.tsx
@@ -1,5 +1,5 @@
import { TriggersList } from 'components/interfaces/Database/Triggers/TriggersList/TriggersList'
-import DatabaseTriggersLayout from 'components/layouts/DatabaseLayout/DatabaseTriggersLayout'
+import { DatabaseTriggersLayout } from 'components/layouts/DatabaseLayout/DatabaseTriggersLayout'
import { DefaultLayout } from 'components/layouts/DefaultLayout'
import type { NextPageWithLayout } from 'types'
import { PageContainer } from 'ui-patterns/PageContainer'
diff --git a/apps/studio/pages/project/[ref]/database/triggers/event.tsx b/apps/studio/pages/project/[ref]/database/triggers/event.tsx
index 3f9a07af2dc..0bb86a88cb9 100644
--- a/apps/studio/pages/project/[ref]/database/triggers/event.tsx
+++ b/apps/studio/pages/project/[ref]/database/triggers/event.tsx
@@ -1,5 +1,5 @@
import { EventTriggersList } from 'components/interfaces/Database/Triggers/EventTriggersList/EventTriggersList'
-import DatabaseTriggersLayout from 'components/layouts/DatabaseLayout/DatabaseTriggersLayout'
+import { DatabaseTriggersLayout } from 'components/layouts/DatabaseLayout/DatabaseTriggersLayout'
import { DefaultLayout } from 'components/layouts/DefaultLayout'
import type { NextPageWithLayout } from 'types'
import { PageContainer } from 'ui-patterns/PageContainer'
diff --git a/apps/studio/pages/project/[ref]/database/types.tsx b/apps/studio/pages/project/[ref]/database/types.tsx
index edb6bec6861..ddee121bc4f 100644
--- a/apps/studio/pages/project/[ref]/database/types.tsx
+++ b/apps/studio/pages/project/[ref]/database/types.tsx
@@ -38,7 +38,7 @@ const DatabaseEnumeratedTypes: NextPageWithLayout = () => {
DatabaseEnumeratedTypes.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/functions/[functionSlug]/code.tsx b/apps/studio/pages/project/[ref]/functions/[functionSlug]/code.tsx
index 76cc03bb879..1947ece5ee4 100644
--- a/apps/studio/pages/project/[ref]/functions/[functionSlug]/code.tsx
+++ b/apps/studio/pages/project/[ref]/functions/[functionSlug]/code.tsx
@@ -1,12 +1,4 @@
import { PermissionAction } from '@supabase/shared-types/out/constants'
-import { isEqual } from 'lodash'
-import { AlertCircle, CornerDownLeft, Loader2 } from 'lucide-react'
-import { useEffect, useMemo, useState } from 'react'
-import { toast } from 'sonner'
-
-import { formatFunctionBodyToFiles } from '@/components/interfaces/EdgeFunctions/EdgeFunctions.utils'
-import { FileData } from '@/components/ui/FileExplorerAndEditor/FileExplorerAndEditor.types'
-import { useLatest } from '@/hooks/misc/useLatest'
import { IS_PLATFORM, useParams } from 'common'
import { DeployEdgeFunctionWarningModal } from 'components/interfaces/EdgeFunctions/DeployEdgeFunctionWarningModal'
import { DefaultLayout } from 'components/layouts/DefaultLayout'
@@ -21,8 +13,16 @@ import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
import { BASE_PATH } from 'lib/constants'
+import { isEqual } from 'lodash'
+import { AlertCircle, CornerDownLeft, Loader2 } from 'lucide-react'
+import { useEffect, useMemo, useState } from 'react'
+import { toast } from 'sonner'
import { LogoLoader } from 'ui'
+import { formatFunctionBodyToFiles } from '@/components/interfaces/EdgeFunctions/EdgeFunctions.utils'
+import { PreventNavigationOnUnsavedChanges } from '@/components/ui-patterns/Dialogs/PreventNavigationOnUnsavedChanges'
+import { FileData } from '@/components/ui/FileExplorerAndEditor/FileExplorerAndEditor.types'
+
const CodePage = () => {
const { ref, functionSlug } = useParams()
const { data: project } = useSelectedProjectQuery()
@@ -146,27 +146,11 @@ const CodePage = () => {
setFiles(initialFiles)
}, [initialFiles])
- // [Joshen] Probably a candidate for useStaticEffectEvent
- const filesRef = useLatest(files)
- const initialFilesRef = useLatest(initialFiles)
- useEffect(() => {
- const handleBeforeUnload = (e: BeforeUnloadEvent) => {
- const normalizeFiles = (list: FileData[]) =>
- list.map(({ id, name, content }) => ({ id, name, content }))
- const hasUnsavedChanges = !isEqual(
- normalizeFiles(initialFilesRef.current),
- normalizeFiles(filesRef.current)
- )
-
- if (hasUnsavedChanges) {
- e.preventDefault()
- e.returnValue = '' // deprecated, but older browsers still require this
- }
- }
- window.addEventListener('beforeunload', handleBeforeUnload)
- return () => window.removeEventListener('beforeunload', handleBeforeUnload)
- // eslint-disable-next-line react-hooks/exhaustive-deps
- }, [])
+ const hasUnsavedChanges = useMemo(() => {
+ const normalizeFiles = (list: FileData[]) =>
+ list.map(({ id, name, content }) => ({ id, name, content }))
+ return !isEqual(normalizeFiles(initialFiles), normalizeFiles(files))
+ }, [initialFiles, files])
return (
@@ -252,6 +236,7 @@ const CodePage = () => {
onConfirm={handleDeployConfirm}
isDeploying={isDeploying}
/>
+
- {page}
+ {page}
)
}
diff --git a/apps/studio/pages/project/[ref]/functions/[functionSlug]/details.tsx b/apps/studio/pages/project/[ref]/functions/[functionSlug]/details.tsx
index 44850089399..d64f95d72d3 100644
--- a/apps/studio/pages/project/[ref]/functions/[functionSlug]/details.tsx
+++ b/apps/studio/pages/project/[ref]/functions/[functionSlug]/details.tsx
@@ -7,7 +7,7 @@ const PageLayout: NextPageWithLayout = () =>
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/functions/[functionSlug]/index.tsx b/apps/studio/pages/project/[ref]/functions/[functionSlug]/index.tsx
index 62863ee2593..dc2d55a6d0f 100644
--- a/apps/studio/pages/project/[ref]/functions/[functionSlug]/index.tsx
+++ b/apps/studio/pages/project/[ref]/functions/[functionSlug]/index.tsx
@@ -431,7 +431,7 @@ const PageLayout: NextPageWithLayout = () => {
PageLayout.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/functions/[functionSlug]/invocations.tsx b/apps/studio/pages/project/[ref]/functions/[functionSlug]/invocations.tsx
index d585211d813..d1aebb10ac1 100644
--- a/apps/studio/pages/project/[ref]/functions/[functionSlug]/invocations.tsx
+++ b/apps/studio/pages/project/[ref]/functions/[functionSlug]/invocations.tsx
@@ -28,7 +28,7 @@ export const LogPage: NextPageWithLayout = () => {
LogPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/functions/[functionSlug]/logs.tsx b/apps/studio/pages/project/[ref]/functions/[functionSlug]/logs.tsx
index 1861a026530..6f96e611922 100644
--- a/apps/studio/pages/project/[ref]/functions/[functionSlug]/logs.tsx
+++ b/apps/studio/pages/project/[ref]/functions/[functionSlug]/logs.tsx
@@ -29,7 +29,7 @@ export const LogPage: NextPageWithLayout = () => {
LogPage.getLayout = (page) => (
- {page}
+ {page}
)
diff --git a/apps/studio/pages/project/[ref]/functions/index.tsx b/apps/studio/pages/project/[ref]/functions/index.tsx
index 9737243ae13..d3cd3f47005 100644
--- a/apps/studio/pages/project/[ref]/functions/index.tsx
+++ b/apps/studio/pages/project/[ref]/functions/index.tsx
@@ -178,7 +178,7 @@ const EdgeFunctionsPage: NextPageWithLayout = () => {
EdgeFunctionsPage.getLayout = (page: React.ReactElement) => {
return (
-
+
diff --git a/apps/studio/pages/project/[ref]/functions/new.tsx b/apps/studio/pages/project/[ref]/functions/new.tsx
index b8bb08b7321..42d0b7bd125 100644
--- a/apps/studio/pages/project/[ref]/functions/new.tsx
+++ b/apps/studio/pages/project/[ref]/functions/new.tsx
@@ -45,6 +45,7 @@ import {
} from 'ui'
import * as z from 'zod'
+import { PreventNavigationOnUnsavedChanges } from '@/components/ui-patterns/Dialogs/PreventNavigationOnUnsavedChanges'
import { FileData } from '@/components/ui/FileExplorerAndEditor/FileExplorerAndEditor.types'
import { useLatest } from '@/hooks/misc/useLatest'
@@ -276,21 +277,7 @@ const NewFunctionPage = () => {
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [template])
- // [Joshen] Probably a candidate for useStaticEffectEvent
- const filesRef = useLatest(files)
- useEffect(() => {
- const handleBeforeUnload = (e: BeforeUnloadEvent) => {
- const hasUnsavedChanges = !isEqual(INITIAL_FILES, filesRef.current)
-
- if (hasUnsavedChanges) {
- e.preventDefault()
- e.returnValue = '' // deprecated, but older browsers still require this
- }
- }
- window.addEventListener('beforeunload', handleBeforeUnload)
- return () => window.removeEventListener('beforeunload', handleBeforeUnload)
- // eslint-disable-next-line react-hooks/exhaustive-deps
- }, [])
+ const hasUnsavedChanges = useMemo(() => !isEqual(INITIAL_FILES, files), [files])
return (
{
+
)
}
@@ -435,7 +423,7 @@ const NewFunctionPage = () => {
NewFunctionPage.getLayout = (page: React.ReactNode) => {
return (
- {page}
+ {page}
)
}
diff --git a/apps/studio/pages/project/[ref]/functions/secrets.tsx b/apps/studio/pages/project/[ref]/functions/secrets.tsx
index 6ee8617a4a5..8794a94ea0e 100644
--- a/apps/studio/pages/project/[ref]/functions/secrets.tsx
+++ b/apps/studio/pages/project/[ref]/functions/secrets.tsx
@@ -29,7 +29,7 @@ const SecretsPage: NextPageWithLayout = () => {
SecretsPage.getLayout = (page) => {
return (
-
+
diff --git a/apps/studio/pages/project/[ref]/index.tsx b/apps/studio/pages/project/[ref]/index.tsx
index a81026a90f4..fdc368a43c6 100644
--- a/apps/studio/pages/project/[ref]/index.tsx
+++ b/apps/studio/pages/project/[ref]/index.tsx
@@ -1,25 +1,10 @@
-import { IS_PLATFORM } from 'common'
-import { Home } from 'components/interfaces/Home/Home'
-import { HomeV2 } from 'components/interfaces/HomeNew/Home'
+import { ProjectHome } from 'components/interfaces/ProjectHome/Home'
import DefaultLayout from 'components/layouts/DefaultLayout'
import { ProjectLayoutWithAuth } from 'components/layouts/ProjectLayout'
-import { useTrackExperimentExposure } from 'hooks/misc/useTrackExperimentExposure'
-import { usePHFlag } from 'hooks/ui/useFlag'
import type { NextPageWithLayout } from 'types'
const HomePage: NextPageWithLayout = () => {
- const homeNewVariant = usePHFlag('homeNew')
- const isHomeNew = homeNewVariant === 'new-home'
-
- useTrackExperimentExposure(
- 'home_new',
- IS_PLATFORM && typeof homeNewVariant !== 'boolean' ? homeNewVariant : undefined
- )
-
- if (isHomeNew) {
- return (
+ () =>
+ posthogClient.getFeatureFlag(EXPERIMENT_ID) as PricingCalculatorVariant | false | undefined
+ )
+
+ useEffect(() => {
+ return posthogClient.onFeatureFlags(() => {
+ const value = posthogClient.getFeatureFlag(EXPERIMENT_ID)
+ setFlagValue(value as PricingCalculatorVariant | false | undefined)
+ })
+ }, [])
+
+ const isTestVariant = flagValue === 'test'
+ const isInExperiment = flagValue === 'control' || flagValue === 'test'
+
+ useEffect(() => {
+ if (!isInExperiment) return
+
+ posthogClient.captureExperimentExposure(EXPERIMENT_ID, { variant: flagValue }, hasConsented())
+ }, [isInExperiment, flagValue])
+
return (
@@ -88,7 +119,27 @@ export default function PricingContent() {
id="addon-compute"
className="container relative mx-auto px-4 lg:px-12 pt-16 md:pt-24 lg:pt-32 lg:pb-16"
>
-
+ {isTestVariant && (
+
+
+ How compute pricing works
+
+
+ Choose a plan, add projects, and see your total cost
+
+
+
+ What is “compute”?
+
+ Think of compute as the computer your database runs on. As your app grows, you
+ scale CPU and memory to handle more traffic and data.
+
+
+
+
+ )}
+
+ {isTestVariant ?
:
}
+ instance.columns?.find((col: any) => col.key === column)?.value
+
+const parsePrice = (price: string) => {
+ const n = parseInt(price?.toString().replace('$', '').replace(',', ''), 10)
+ return Number.isNaN(n) ? 0 : n
+}
+
+interface ComputePricingCalculatorProps {
+ activePlan?: {
+ name: string
+ price: number
+ }
+}
+
+const NewComputePricingCalculator = ({
+ activePlan = { name: 'Pro', price: 25 },
+}: ComputePricingCalculatorProps) => {
+ // Filter out rows with no specific pricing
+ const computeInstances = pricingAddOn.database.rows.filter((row) =>
+ row.columns.some((it) => it.key === 'pricing' && it.value !== 'Contact Us')
+ )
+ const priceSteps = computeInstances.map((instance) =>
+ parsePrice(findInstanceValueByColumn(instance, 'pricing'))
+ )
+ // Base discount credits that come with every paid plan
+ const COMPUTE_CREDITS = 10
+
+ const [activeInstances, setActiveInstances] = useState([{ ...computeInstances[0], position: 0 }])
+ // Final calculated price: plan cost + compute aggregate - compute credits
+ const [activePrice, setActivePrice] = useState(activePlan.price + priceSteps[0] - COMPUTE_CREDITS)
+ const [hasInteractedWithSlider, setHasInteractedWithSlider] = useState(false)
+
+ const handleUpdateInstance = (position: number, value: number[]) => {
+ setHasInteractedWithSlider(true)
+ const newArray = activeInstances.map((activeInstance) => {
+ // only update the instance corresponding to the correct slider
+ if (activeInstance.position === position) {
+ return { ...computeInstances[value[0] - 1], position }
+ } else {
+ return activeInstance
+ }
+ })
+
+ setActiveInstances(newArray)
+ }
+
+ const calculateComputeAggregate = (price: number) => {
+ return activeInstances.reduce(
+ (acc, activeInstance: any) =>
+ acc + parsePrice(findInstanceValueByColumn(activeInstance, 'pricing')),
+ price
+ )
+ }
+
+ useEffect(() => {
+ const computeAggregate = calculateComputeAggregate(0)
+ setActivePrice(Math.max(0, computeAggregate + activePlan.price - COMPUTE_CREDITS))
+ }, [activeInstances, activePlan])
+
+ const removeInstance = (position: number) => {
+ const newArray = activeInstances
+ .filter((activeInstance) => activeInstance.position !== position)
+ .map((instance, index) => ({ ...instance, position: index }))
+
+ setActiveInstances(newArray)
+ }
+
+ const findSliderComputeValue = (activeInstance: any) => {
+ // find index of compute based on active compute name
+ const selectedCompute = computeInstances
+ .map((compute) => findInstanceValueByColumn(compute, 'plan'))
+ .indexOf(findInstanceValueByColumn(activeInstance, 'plan'))
+
+ return [selectedCompute + 1]
+ }
+
+ return (
+
+
+
+
Monthly estimate:
+
+
+ Plan subscription
+
+ ${activePlan.price}
+
+
+
+ Total Compute
+ ${calculateComputeAggregate(0)}
+
+
+ Compute Credits
+
+ - ${COMPUTE_CREDITS}
+
+
+
+
+ Total
+
+
+ This estimate only includes Plan and Compute add-on monthly costs. Other resources
+ might incur additional costs in the final invoice.
+
+ ${activePrice}
+
+
+
+
+
+
+ {activeInstances.map((activeInstance, index) => (
+
+
+
+
+
+ Project {activeInstance.position + 1}
+
+
+
+ {findInstanceValueByColumn(activeInstance, 'pricing')}
+
+
+
+ {!hasInteractedWithSlider && (
+
+ Drag to adjust
+
+ )}
+ handleUpdateInstance(activeInstance.position, value)}
+ value={findSliderComputeValue(activeInstance)}
+ min={1}
+ key={`${index}-${activeInstance.position}`}
+ max={priceSteps.length}
+ step={1}
+ className={cn(
+ 'w-full cursor-grab active:cursor-grabbing',
+ !hasInteractedWithSlider && "[&_[data-slot='slider-thumb']]:animate-pulse"
+ )}
+ />
+
+
+
+
+ {findInstanceValueByColumn(activeInstance, 'memory')} RAM /{' '}
+ {findInstanceValueByColumn(activeInstance, 'cpu')} CPU / Connections: Direct{' '}
+ {findInstanceValueByColumn(activeInstance, 'directConnections')}, Pooler{' '}
+ {findInstanceValueByColumn(activeInstance, 'poolerConnections')}
+
+
+
+ {activeInstances.length > 1 && (
+ removeInstance(activeInstance.position)}
+ >
+
+ )}
+
+
+
+ ))}
+
+
+ Add Project
+
+
+
+
+ )
+}
+
+export default NewComputePricingCalculator
diff --git a/apps/www/components/Pricing/NewPricingComputeSection.tsx b/apps/www/components/Pricing/NewPricingComputeSection.tsx
new file mode 100644
index 00000000000..c180ac11a24
--- /dev/null
+++ b/apps/www/components/Pricing/NewPricingComputeSection.tsx
@@ -0,0 +1,205 @@
+import { ChevronDownIcon } from '@heroicons/react/outline'
+import Link from 'next/link'
+import React, { useEffect, useRef, useState } from 'react'
+import { useWindowSize } from 'react-use'
+import { plans as allPlans } from 'shared-data/plans'
+import { Button, cn } from 'ui'
+import { InfoTooltip } from 'ui-patterns/info-tooltip'
+import { ToggleGroup, ToggleGroupItem } from 'ui/src/components/shadcn/ui/toggle-group'
+
+import Panel from '../Panel'
+import ComputePricingTable from './ComputePricingTable'
+import NewComputePricingCalculator from './NewComputePricingCalculator'
+import PricingComputeAnimation from './PricingComputeAnimation'
+
+const plans = allPlans
+ .filter((plan) => plan.planId === 'pro' || plan.planId === 'team')
+ .map((plan) => ({
+ name: plan.name,
+ price: plan.priceMonthly as number,
+ }))
+
+const NewPricingComputeSection = () => {
+ const ref = useRef
(null)
+ const [showTable, setShowTable] = useState(false)
+ const { width } = useWindowSize()
+ const [height, setHeight] = useState(ref?.current?.clientHeight)
+ const [activePlan, setActivePlan] = useState(plans[0])
+
+ useEffect(() => {
+ setHeight(ref?.current?.clientHeight)
+ }, [width])
+
+ return (
+
+
+
+
+
1. Choose your plan
+
+
{
+ const selectedPlan = plans.find((p) => p.name === value)
+ if (selectedPlan) setActivePlan(selectedPlan)
+ }}
+ className="grid grid-cols-2 gap-2 w-full bg-surface-200 rounded-md"
+ >
+ {plans.map((plan) => (
+
+ {plan.name}
+
+ ))}
+
+
+
+
{activePlan.name}
+
+
+ ${activePlan.price}
+ /month
+
+
+
+ {activePlan.name === 'Pro' && (
+ <>
+
+ Everything in the Free Plan, plus:
+
+
100K monthly active users
+
8 GB disk size per project
+
250 GB bandwidth
+
Daily backups (7 day retention)
+
Email support
+
+ )}
+ {activePlan.name === 'Team' && (
+ <>
+
+ Everything in the Pro Plan, plus:
+
+
SOC2
+
Project-scoped and read-only access
+
HIPAA available as paid add-on
+
SSO for Supabase Dashboard
+
Priority email support & SLAs
+
Daily backups (14 day retention)
+
+ )}
+
+ Paid plans include $10/mo in compute credits, enough to cover one Micro instance.
+
+
+
+
+
+
+ 2. Configure compute for your projects
+
+
+ Add projects and adjust compute to estimate your monthly cost.
+
+
+
+
+
+
+
+
+
+ Starts from $10 /month
+
+
+
+ Scale compute up to
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Choose the best compute size for you
+
+ Every project on the Supabase Platform comes with its own dedicated Postgres
+ instance. Select the compute size that fits your needs.
+
+
+ Compute instances are billed hourly and you can scale up or down at any time. Paid
+ Plans come with $10 /month in compute credits to cover
+ one Micro instance or offset the cost of any other instance.
+
+
+ Read more on{' '}
+
+
+
+
+
+
+
setShowTable(!showTable)}
+ className="w-full p-2 border-t border-muted text-foreground focus-visible:outline-brand-600 focus-visible:rounded-b-xl text-sm bg-alternative flex items-center justify-center gap-2"
+ >
+
+
+ )
+}
+
+export default NewPricingComputeSection
diff --git a/apps/www/data/solutions/agencies.tsx b/apps/www/data/solutions/agencies.tsx
index 3586e2b0de9..d07347f33fd 100644
--- a/apps/www/data/solutions/agencies.tsx
+++ b/apps/www/data/solutions/agencies.tsx
@@ -143,7 +143,7 @@ const data: {
},
{
icon: '/images/logos/publicity/brthrs.svg',
- avatar: '/images/avatars/zimo-holdijk.jpeg',
+ avatar: '/images/avatars/zimo-holdijk.png',
author: 'Zimo Holdijk',
authorTitle: 'Lead Product Manager, Brthrs',
quote: (
diff --git a/apps/www/lib/authors.json b/apps/www/lib/authors.json
index 67522c51e34..e10767ca96f 100644
--- a/apps/www/lib/authors.json
+++ b/apps/www/lib/authors.json
@@ -708,6 +708,14 @@
"author_url": "https://www.linkedin.com/in/harry-roper",
"author_image_url": "/images/avatars/harry-roper.png"
},
+ {
+ "author_id": "zimo_holdijk",
+ "author": "Zimo Holdijk",
+ "position": "Lead Product Builder",
+ "company": "Brthrs",
+ "author_url": "https://www.linkedin.com/in/zimoholdijk",
+ "author_image_url": "/images/avatars/zimo-holdijk.png"
+ },
{
"author_id": "shahed_islam",
"author": "Shahed Islam",
diff --git a/apps/www/public/images/avatars/harry-roper.png b/apps/www/public/images/avatars/harry-roper.png
index 7dd12e3e1e7..04811f1ae27 100644
Binary files a/apps/www/public/images/avatars/harry-roper.png and b/apps/www/public/images/avatars/harry-roper.png differ
diff --git a/apps/www/public/images/avatars/zimo-holdijk.png b/apps/www/public/images/avatars/zimo-holdijk.png
new file mode 100644
index 00000000000..1ec0a113bab
Binary files /dev/null and b/apps/www/public/images/avatars/zimo-holdijk.png differ
diff --git a/apps/www/public/rss.xml b/apps/www/public/rss.xml
index 5092c77217f..18f8f9cccd0 100644
--- a/apps/www/public/rss.xml
+++ b/apps/www/public/rss.xml
@@ -13,6 +13,13 @@
Supabase Pro users can now send their Supabase logs to their own logging backend, enabling them to debug in the same place as the rest of their stack.
Thu, 05 Mar 2026 00:00:00 -0700
+-
+
https://supabase.com/blog/supabase-storage-performance-security-reliability-updates
+ Supabase Storage: major performance, security, and reliability updates
+ Storage ships a rewritten object listing system, path traversal prevention, idempotent migrations, OpenTelemetry metrics, and fixes for the most common reliability issues.
+ Thu, 05 Mar 2026 00:00:00 -0700
+
-
https://supabase.com/blog/supabase-incident-on-february-12-2026
Supabase incident on February 12, 2026
diff --git a/e2e/studio/features/database.spec.ts b/e2e/studio/features/database.spec.ts
index 3058602b6c4..fd257460c5d 100644
--- a/e2e/studio/features/database.spec.ts
+++ b/e2e/studio/features/database.spec.ts
@@ -10,8 +10,6 @@ import {
waitForDatabaseToLoad,
} from '../utils/wait-for-response.js'
-const databaseColumnName = 'pw_database_column'
-
test.describe('Database', () => {
test.describe('Schema Visualizer', () => {
test('actions works as expected', async ({ page, ref }) => {
@@ -36,7 +34,7 @@ test.describe('Database', () => {
// validates table and column exists
await expect(page.getByText(databaseTableName, { exact: true })).toBeVisible()
- await expect(page.getByText(databaseColumnName)).toBeVisible()
+ await expect(page.getByText(databaseColumnName, { exact: true })).toBeVisible()
// copies schema definition to clipboard
await page.getByRole('button', { name: 'Copy as SQL' }).click()
@@ -60,21 +58,61 @@ test.describe('Database', () => {
await page.getByTestId('schema-selector').click()
await page.getByRole('option', { name: 'auth' }).click()
await waitForDatabaseToLoad(page, ref, 'auth')
- await expect(page.getByText('users')).toBeVisible()
- await expect(page.getByText('sso_providers')).toBeVisible()
- await expect(page.getByText('saml_providers')).toBeVisible()
+ await expect(page.getByText('users', { exact: true })).toBeVisible()
+ await expect(page.getByText('sso_providers', { exact: true })).toBeVisible()
+ await expect(page.getByText('saml_providers', { exact: true })).toBeVisible()
// navigate to table editor when icon is clicked
- const samlProvidersHeader = await page.getByText('saml_providers')
+ const samlProvidersHeader = await page.getByText('saml_providers', { exact: true })
await samlProvidersHeader.locator('..').getByRole('link').click()
await page.waitForURL(/.*\/editor\/\d+/)
await page.getByRole('button', { name: 'View saml_providers', exact: true }).click()
})
+
+ test('columns actions work as expected', async ({ page, ref }) => {
+ const databaseTableName = 'pw_database_schema_columns_actions'
+ const databaseColumnName = 'pw_database_schema_column_actions'
+ await using _ = await withSetupCleanup(
+ async () => {
+ await createTable(databaseTableName, databaseColumnName)
+ },
+ async () => {
+ await dropTable(databaseTableName)
+ }
+ )
+ const wait = createApiResponseWaiter(
+ page,
+ 'pg-meta',
+ ref,
+ 'tables?include_columns=true&included_schemas=public'
+ )
+ await page.goto(toUrl(`/project/${env.PROJECT_REF}/database/schemas?schema=public`))
+ await wait
+
+ // validates table and column exists
+ await expect(page.getByText(databaseTableName, { exact: true })).toBeVisible()
+ await expect(page.getByText(databaseColumnName, { exact: true })).toBeVisible()
+ // test we can edit the column
+ await page.getByText(databaseColumnName, { exact: true }).hover()
+ await page.getByText(`Edit ${databaseTableName} ${databaseColumnName} column`).click()
+ await page.getByLabel('Description').fill('Bazinga')
+ await page.getByRole('button', { name: 'Save' }).click()
+ await expect(
+ page.getByText(`Successfully updated column "${databaseColumnName}"`)
+ ).toBeVisible()
+ await expect(page.getByRole('dialog')).not.toBeVisible()
+
+ // test the schema view has been refreshed
+ await page.getByText(databaseColumnName, { exact: true }).hover()
+ await page.getByText(`Edit ${databaseTableName} ${databaseColumnName} column`).click()
+ await expect(page.getByLabel('Description')).toHaveValue('Bazinga')
+ })
})
test.describe('Tables', () => {
test('actions works as expected', async ({ page, ref }) => {
- const databaseTableName = 'pw_database_actions_table'
+ const databaseTableName = 'pw_database_table_actions'
+ const databaseColumnName = 'pw_database_column_actions'
await using _ = await withSetupCleanup(
async () => {
await createTable(databaseTableName, databaseColumnName)
@@ -124,10 +162,11 @@ test.describe('Database', () => {
})
test('CRUD operations and copy works as expected', async ({ page, ref }) => {
- const databaseTableName = 'pw_database_tablecrud_table'
- const databaseTableNameNew = 'pw_database_table_new'
- const databaseTableNameUpdated = 'pw_database_table_updated'
- const databaseTableNameDuplicate = 'pw_database_table_duplicate'
+ const databaseTableName = 'pw_database_table_crud_table'
+ const databaseTableNameNew = 'pw_database_table_crud_new'
+ const databaseTableNameUpdated = 'pw_database_table_crud_updated'
+ const databaseTableNameDuplicate = 'pw_database_table_crud_duplicate'
+ const databaseColumnName = 'pw_database_column_table_crud'
await using _ = await withSetupCleanup(
async () => {
@@ -238,8 +277,9 @@ test.describe('Database', () => {
test.describe('Tables columns', () => {
test('can view, create, update, delete, and filter table columns', async ({ page, ref }) => {
const databaseTableName = 'pw_database_columns_table'
- const databaseColumnName2 = 'pw_database_column_2'
- const databaseColumnName3 = 'pw_database_column_3'
+ const databaseColumnName = 'pw_database_column_crud'
+ const databaseColumnName2 = 'pw_database_column_crud_2'
+ const databaseColumnName3 = 'pw_database_column_crud_3'
await using _ = await withSetupCleanup(
async () => {
@@ -267,9 +307,8 @@ test.describe('Database', () => {
// create a new table column
await page.getByRole('button', { name: 'New column' }).click()
- await page
- .getByRole('textbox', { name: 'column_name', exact: true })
- .fill('pw_database_column_2')
+ await expect(page.getByRole('dialog')).toBeVisible()
+ await page.getByLabel('name').fill(databaseColumnName2)
await page.getByText('Choose a column type...').click()
await page.getByText('numeric', { exact: true }).click()
const columnCreateWait = createApiResponseWaiter(
@@ -296,7 +335,7 @@ test.describe('Database', () => {
// update table column
await columnDatabase2Row.getByRole('button').click()
await page.getByRole('button', { name: 'Edit column' }).click()
- await page.getByRole('textbox', { name: 'column_name' }).fill(databaseColumnName3)
+ await page.getByLabel('name').fill(databaseColumnName3)
const columnUpdateWait = createApiResponseWaiter(
page,
'pg-meta',
@@ -375,6 +414,7 @@ test.describe('Database', () => {
test('CRUD operations works as expected', async ({ page, ref }) => {
const databaseTableName = 'pw_database_trigger_table'
+ const databaseColumnName = 'pw_database_column_trigger'
const databaseTriggerName = 'pw_database_trigger'
const databaseTriggerNameUpdated = 'pw_database_trigger_updated'
@@ -513,6 +553,7 @@ test.describe('Database', () => {
test('CRUD operations works as expected', async ({ page, ref }) => {
const databaseTableName = 'pw_database_indexes_table'
+ const databaseColumnName = 'pw_database_column_index'
const databaseIndexName = 'pw_database_index'
await using _ = await withSetupCleanup(
@@ -754,8 +795,8 @@ test.describe('Database Functions', () => {
// Nothing
},
async () => {
- await query(`drop function if exists ${databaseFunctionName}`);
- await query(`drop function if exists ${databaseFunctionNameUpdated}`);
+ await query(`drop function if exists ${databaseFunctionName}`)
+ await query(`drop function if exists ${databaseFunctionNameUpdated}`)
}
)
diff --git a/examples/user-management/expo-user-management/App.tsx b/examples/user-management/expo-user-management/App.tsx
index 7eba4422a83..d98e2245f5d 100644
--- a/examples/user-management/expo-user-management/App.tsx
+++ b/examples/user-management/expo-user-management/App.tsx
@@ -4,24 +4,34 @@ import { supabase } from './lib/supabase'
import Auth from './components/Auth'
import Account from './components/Account'
import { View } from 'react-native'
-import { Session } from '@supabase/supabase-js'
export default function App() {
- const [session, setSession] = useState(null)
+ const [userId, setUserId] = useState(null)
+ const [email, setEmail] = useState(undefined)
useEffect(() => {
- supabase.auth.getSession().then(({ data: { session } }) => {
- setSession(session)
+ supabase.auth.getClaims().then(({ data: { claims } }) => {
+ if (claims) {
+ setUserId(claims.sub)
+ setEmail(claims.email)
+ }
})
- supabase.auth.onAuthStateChange((_event, session) => {
- setSession(session)
+ supabase.auth.onAuthStateChange(async (_event, _session) => {
+ const { data: { claims } } = await supabase.auth.getClaims()
+ if (claims) {
+ setUserId(claims.sub)
+ setEmail(claims.email)
+ } else {
+ setUserId(null)
+ setEmail(undefined)
+ }
})
}, [])
return (
- {session && session.user ?
)
}
diff --git a/examples/user-management/expo-user-management/components/Account.tsx b/examples/user-management/expo-user-management/components/Account.tsx
index 227855abfee..7c1acd8ec99 100644
--- a/examples/user-management/expo-user-management/components/Account.tsx
+++ b/examples/user-management/expo-user-management/components/Account.tsx
@@ -2,28 +2,26 @@ import { useState, useEffect } from 'react'
import { supabase } from '../lib/supabase'
import { StyleSheet, View, Alert } from 'react-native'
import { Button, Input } from '@rneui/themed'
-import { Session } from '@supabase/supabase-js'
import Avatar from './Avatar'
-export default function Account({ session }: { session: Session }) {
+export default function Account({ userId, email }: { userId: string; email?: string }) {
const [loading, setLoading] = useState(true)
const [username, setUsername] = useState('')
const [website, setWebsite] = useState('')
const [avatarUrl, setAvatarUrl] = useState('')
useEffect(() => {
- if (session) getProfile()
- }, [session])
+ if (userId) getProfile()
+ }, [userId])
async function getProfile() {
try {
setLoading(true)
- if (!session?.user) throw new Error('No user on the session!')
let { data, error, status } = await supabase
.from('profiles')
.select(`username, website, avatar_url`)
- .eq('id', session?.user.id)
+ .eq('id', userId)
.single()
if (error && status !== 406) {
throw error
@@ -54,10 +52,9 @@ export default function Account({ session }: { session: Session }) {
}) {
try {
setLoading(true)
- if (!session?.user) throw new Error('No user on the session!')
const updates = {
- id: session?.user.id,
+ id: userId,
username,
website,
avatar_url,
@@ -91,7 +88,7 @@ export default function Account({ session }: { session: Session }) {
/>
-
{avatarUrl ? (
- = new Set()
+ private pendingFeatureFlagCallbacks: Set<() => void> = new Set()
constructor(config: PostHogClientConfig = {}) {
const apiHost =
@@ -107,6 +108,10 @@ class PostHogClient {
this.initStarted = true
posthog.init(this.config.apiKey, config)
+
+ // Register any feature flag callbacks that were queued before init
+ this.pendingFeatureFlagCallbacks.forEach((cb) => posthog.onFeatureFlags(cb))
+ this.pendingFeatureFlagCallbacks.clear()
}
capturePageView(properties: Record, hasConsent: boolean = true) {
@@ -247,6 +252,52 @@ class PostHogClient {
return undefined
}
+ /**
+ * Returns a PostHog feature flag value directly from the client-side SDK.
+ * Use this for www/docs pages where server-side evaluation lacks full person context.
+ * In local dev, DevToolbar overrides (x-ph-flag-overrides cookie) take priority.
+ */
+ getFeatureFlag(key: string): string | boolean | undefined {
+ if (typeof document === 'undefined') return undefined
+
+ if (process.env.NODE_ENV === 'development') {
+ try {
+ const cookieEntry = document.cookie
+ .split(';')
+ .map((c) => c.trim())
+ .find((c) => c.startsWith('x-ph-flag-overrides='))
+ if (cookieEntry) {
+ const overrides = JSON.parse(
+ decodeURIComponent(cookieEntry.substring('x-ph-flag-overrides='.length))
+ )
+ if (key in overrides) return overrides[key]
+ }
+ } catch {}
+ }
+
+ if (!this.initialized) return undefined
+
+ try {
+ return posthog.getFeatureFlag(key)
+ } catch {
+ return undefined
+ }
+ }
+
+ /**
+ * Subscribe to PostHog feature flag loads/reloads.
+ * Returns an unsubscribe function.
+ */
+ onFeatureFlags(callback: () => void): () => void {
+ if (!this.initStarted) {
+ // Queue until init() is called
+ this.pendingFeatureFlagCallbacks.add(callback)
+ return () => this.pendingFeatureFlagCallbacks.delete(callback)
+ }
+ if (typeof posthog.onFeatureFlags !== 'function') return () => {}
+ return posthog.onFeatureFlags(callback) ?? (() => {})
+ }
+
/**
* Returns PostHog's session_id for the current session.
* Returns undefined until PostHog's `loaded` callback fires.
diff --git a/packages/common/telemetry-constants.ts b/packages/common/telemetry-constants.ts
index 4eb26581df4..fffc6a4eede 100644
--- a/packages/common/telemetry-constants.ts
+++ b/packages/common/telemetry-constants.ts
@@ -2675,6 +2675,27 @@ export interface RlsEventTriggerBannerCreateButtonClickedEvent {
groups: TelemetryGroups
}
+/**
+ * User was exposed to the pricing calculator experiment on the /pricing page.
+ *
+ * @group Events
+ * @source www
+ * @page /pricing
+ */
+export interface PricingCalculatorExperimentExposedEvent {
+ action: 'pricing_calculator_experiment_exposed'
+ properties: {
+ /**
+ * Experiment identifier for tracking
+ */
+ experiment_id: 'pricingCalculatorExperiment'
+ /**
+ * Experiment variant: 'control' (existing compute section) or 'test' (new compute section)
+ */
+ variant: 'control' | 'test'
+ }
+}
+
/**
* User clicked the Run button in the log explorer.
*
@@ -2842,3 +2863,4 @@ export type TelemetryEvent =
| IntegrationInstallFailedEvent
| IntegrationUninstallCompletedEvent
| RlsEventTriggerBannerCreateButtonClickedEvent
+ | PricingCalculatorExperimentExposedEvent
diff --git a/packages/common/telemetry.tsx b/packages/common/telemetry.tsx
index b9c2045025e..0ea50a3931e 100644
--- a/packages/common/telemetry.tsx
+++ b/packages/common/telemetry.tsx
@@ -13,7 +13,11 @@ import { IS_PLATFORM, IS_PROD, LOCAL_STORAGE_KEYS } from './constants'
import { useFeatureFlags } from './feature-flags'
import { post } from './fetchWrappers'
import type { FirstReferrerData, MwDiagData } from './first-referrer-cookie'
-import { isExternalReferrer, parseFirstReferrerCookie, parseMwDiagCookie } from './first-referrer-cookie'
+import {
+ isExternalReferrer,
+ parseFirstReferrerCookie,
+ parseMwDiagCookie,
+} from './first-referrer-cookie'
import { ensurePlatformSuffix, isBrowser } from './helpers'
import { useParams, useTelemetryCookie } from './hooks'
import { posthogClient, type ClientTelemetryEvent } from './posthog-client'
diff --git a/packages/shared-data/plans.ts b/packages/shared-data/plans.ts
index b32860d63c5..82a20684e1d 100644
--- a/packages/shared-data/plans.ts
+++ b/packages/shared-data/plans.ts
@@ -50,7 +50,7 @@ export const plans: PricingInformation[] = [
costUnit: '/ month',
href: 'https://supabase.com/dashboard/new?plan=pro',
priceLabel: 'From',
- warning: '$10 in compute credits included',
+ warning: 'Includes one project running on Micro compute.',
priceMonthly: 25,
description: 'For production applications with the power to scale.',
features: [
@@ -75,7 +75,7 @@ export const plans: PricingInformation[] = [
costUnit: '/ month',
href: 'https://supabase.com/dashboard/new?plan=team',
priceLabel: 'From',
- warning: '$10 in compute credits included',
+ warning: 'Includes one project running on Micro compute.',
priceMonthly: 599,
description: 'Add features such as SSO, control over backups, and industry certifications.',
features: [
diff --git a/packages/ui-patterns/src/FilterBar/FilterGroup.tsx b/packages/ui-patterns/src/FilterBar/FilterGroup.tsx
index 0e2c1258c6f..c7ed5178693 100644
--- a/packages/ui-patterns/src/FilterBar/FilterGroup.tsx
+++ b/packages/ui-patterns/src/FilterBar/FilterGroup.tsx
@@ -143,7 +143,7 @@ export function FilterGroup({ group, path }: FilterGroupProps) {
>