Chore/disable more sections 02 (#38058)

* Add flags for policies, third party auth, and manual linking + providers in sign in page * Add flag for rate limitm page * Add UnknownInterface components * Update comment * Flip flags to true * Add flags for realtime policies and reports page * Temp * Add flag for sign in providers page * Add flag for stripe wrapper * Add flag for custom domains * Add flag for dedicated ipv4 address addon * Add empty state for realtime policies * Add empty state for reports page * Add flag for disable legacy JWT keys section * Add flag for legacy jwt keys * nit * Remove ConnectionStringMoved call out * Add flag for project settings log drains * Add flag for subscription link in project settings * Deprecate settings/auth page and redirect directly to auth page * Flip back flags
2026-10-05 17:35:10 +03:00 · 2025-08-20 20:17:34 +08:00
1 parent c4b36d9ab0
commit 6a8836f968
@@ -28,6 +28,7 @@ import { useProjectSettingsV2Query } from 'data/config/project-settings-v2-query
 import { useOrgSubscriptionQuery } from 'data/subscriptions/org-subscription-query'
 import { useProjectAddonsQuery } from 'data/subscriptions/project-addons-query'
 import type { ProjectAddonVariantMeta } from 'data/subscriptions/types'
+import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'
 import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
 import {
  useIsOrioleDbInAws,
@@ -45,13 +46,18 @@ import CustomDomainSidePanel from './CustomDomainSidePanel'
 import IPv4SidePanel from './IPv4SidePanel'
 import PITRSidePanel from './PITRSidePanel'

-const Addons = () => {
+export const Addons = () => {
  const { resolvedTheme } = useTheme()
  const { ref: projectRef } = useParams()
  const { setPanel } = useAddonsPagePanel()
  const isProjectActive = useIsProjectActive()
  const isOrioleDbInAws = useIsOrioleDbInAws()

+  const { projectSettingsCustomDomains, projectAddonsDedicatedIpv4Address } = useIsFeatureEnabled([
+    'project_settings:custom_domains',
+    'project_addons:dedicated_ipv4_address',
+  ])
+
  const { data: selectedOrg } = useSelectedOrganizationQuery()
  const { data: selectedProject, isLoading: isLoadingProject } = useSelectedProjectQuery()
  const { data: parentProject } = useProjectByRefQuery(selectedProject?.parent_project_ref)
@@ -330,80 +336,83 @@ const Addons = () => {
            </ScaffoldSection>
          </ScaffoldContainer>

-          <ScaffoldDivider />
-
-          <ScaffoldContainer>
-            <ScaffoldSection>
-              <ScaffoldSectionDetail>
-                <div className="space-y-6">
-                  <p className="m-0">Dedicated IPv4 address</p>
-                  <div className="space-y-2">
-                    <p className="text-sm text-foreground-light m-0">More information</p>
-                    <div>
-                      <Link
-                        href="https://supabase.com/docs/guides/platform/ipv4-address"
-                        target="_blank"
-                        rel="noreferrer"
-                      >
-                        <div className="flex items-center space-x-2 opacity-50 hover:opacity-100 transition">
-                          <p className="text-sm m-0">About IPv4 deprecation</p>
-                          <ExternalLink size={16} strokeWidth={1.5} />
+          {projectAddonsDedicatedIpv4Address && (
+            <>
+              <ScaffoldDivider />
+              <ScaffoldContainer>
+                <ScaffoldSection>
+                  <ScaffoldSectionDetail>
+                    <div className="space-y-6">
+                      <p className="m-0">Dedicated IPv4 address</p>
+                      <div className="space-y-2">
+                        <p className="text-sm text-foreground-light m-0">More information</p>
+                        <div>
+                          <Link
+                            href="https://supabase.com/docs/guides/platform/ipv4-address"
+                            target="_blank"
+                            rel="noreferrer"
+                          >
+                            <div className="flex items-center space-x-2 opacity-50 hover:opacity-100 transition">
+                              <p className="text-sm m-0">About IPv4 deprecation</p>
+                              <ExternalLink size={16} strokeWidth={1.5} />
+                            </div>
+                          </Link>
                        </div>
-                      </Link>
+                      </div>
                    </div>
-                  </div>
-                </div>
-              </ScaffoldSectionDetail>
-              <ScaffoldSectionContent>
-                <div className="flex space-x-6">
-                  <div>
-                    <div className="rounded-md bg-surface-100 border border-muted w-[160px] h-[96px] overflow-hidden">
-                      <img
-                        alt="IPv4"
-                        width={160}
-                        height={96}
-                        src={
-                          ipv4 !== undefined
-                            ? `${BASE_PATH}/img/ipv4-on${
-                                resolvedTheme?.includes('dark') ? '' : '--light'
-                              }.svg?v=2`
-                            : `${BASE_PATH}/img/ipv4-off${
-                                resolvedTheme?.includes('dark') ? '' : '--light'
-                              }.svg?v=2`
-                        }
-                      />
+                  </ScaffoldSectionDetail>
+                  <ScaffoldSectionContent>
+                    <div className="flex space-x-6">
+                      <div>
+                        <div className="rounded-md bg-surface-100 border border-muted w-[160px] h-[96px] overflow-hidden">
+                          <img
+                            alt="IPv4"
+                            width={160}
+                            height={96}
+                            src={
+                              ipv4 !== undefined
+                                ? `${BASE_PATH}/img/ipv4-on${
+                                    resolvedTheme?.includes('dark') ? '' : '--light'
+                                  }.svg?v=2`
+                                : `${BASE_PATH}/img/ipv4-off${
+                                    resolvedTheme?.includes('dark') ? '' : '--light'
+                                  }.svg?v=2`
+                            }
+                          />
+                        </div>
+                      </div>
+                      <div>
+                        <p className="text-sm text-foreground-light">Current option:</p>
+                        <p>
+                          {ipv4 !== undefined
+                            ? 'Dedicated IPv4 address is enabled'
+                            : 'Dedicated IPv4 address is not enabled'}
+                        </p>
+                        <ButtonTooltip
+                          type="default"
+                          className="mt-2 pointer-events-auto"
+                          onClick={() => setPanel('ipv4')}
+                          disabled={
+                            !isProjectActive || projectUpdateDisabled || !(canUpdateIPv4 || ipv4)
+                          }
+                          tooltip={{
+                            content: {
+                              side: 'bottom',
+                              text: !(canUpdateIPv4 || ipv4)
+                                ? 'Temporarily disabled while we are migrating to IPv6, please check back later.'
+                                : undefined,
+                            },
+                          }}
+                        >
+                          Change dedicated IPv4 address
+                        </ButtonTooltip>
+                      </div>
                    </div>
-                  </div>
-                  <div>
-                    <p className="text-sm text-foreground-light">Current option:</p>
-                    <p>
-                      {ipv4 !== undefined
-                        ? 'Dedicated IPv4 address is enabled'
-                        : 'Dedicated IPv4 address is not enabled'}
-                    </p>
-                    <ButtonTooltip
-                      type="default"
-                      className="mt-2 pointer-events-auto"
-                      onClick={() => setPanel('ipv4')}
-                      disabled={
-                        !isProjectActive || projectUpdateDisabled || !(canUpdateIPv4 || ipv4)
-                      }
-                      tooltip={{
-                        content: {
-                          side: 'bottom',
-                          text: !(canUpdateIPv4 || ipv4)
-                            ? 'Temporarily disabled while we are migrating to IPv6, please check back later.'
-                            : undefined,
-                        },
-                      }}
-                    >
-                      Change dedicated IPv4 address
-                    </ButtonTooltip>
-                  </div>
-                </div>
-              </ScaffoldSectionContent>
-            </ScaffoldSection>
-          </ScaffoldContainer>
+                  </ScaffoldSectionContent>
+                </ScaffoldSection>
+              </ScaffoldContainer>
+            </>
+          )}

          <ScaffoldDivider />

@@ -528,75 +537,78 @@ const Addons = () => {
            </ScaffoldSection>
          </ScaffoldContainer>

-          <ScaffoldDivider />
-
-          <ScaffoldContainer>
-            <ScaffoldSection>
-              <ScaffoldSectionDetail>
-                <div className="space-y-6">
-                  <p className="m-0">Custom domain</p>
-                  <div className="space-y-2">
-                    <p className="text-sm text-foreground-light m-0">More information</p>
-                    <div>
-                      <Link
-                        href="https://supabase.com/docs/guides/platform/custom-domains"
-                        target="_blank"
-                        rel="noreferrer"
-                      >
-                        <div className="flex items-center space-x-2 opacity-50 hover:opacity-100 transition">
-                          <p className="text-sm m-0">About custom domains</p>
-                          <ExternalLink size={16} strokeWidth={1.5} />
+          {projectSettingsCustomDomains && (
+            <>
+              <ScaffoldDivider />
+              <ScaffoldContainer>
+                <ScaffoldSection>
+                  <ScaffoldSectionDetail>
+                    <div className="space-y-6">
+                      <p className="m-0">Custom domain</p>
+                      <div className="space-y-2">
+                        <p className="text-sm text-foreground-light m-0">More information</p>
+                        <div>
+                          <Link
+                            href="https://supabase.com/docs/guides/platform/custom-domains"
+                            target="_blank"
+                            rel="noreferrer"
+                          >
+                            <div className="flex items-center space-x-2 opacity-50 hover:opacity-100 transition">
+                              <p className="text-sm m-0">About custom domains</p>
+                              <ExternalLink size={16} strokeWidth={1.5} />
+                            </div>
+                          </Link>
                        </div>
-                      </Link>
+                      </div>
                    </div>
-                  </div>
-                </div>
-              </ScaffoldSectionDetail>
-              <ScaffoldSectionContent>
-                <div className="flex space-x-6">
-                  <div>
-                    <div className="rounded-md bg-surface-100 border border-muted w-[160px] h-[96px] overflow-hidden">
-                      <img
-                        alt="Custom Domain"
-                        width={160}
-                        height={96}
-                        src={
-                          customDomain !== undefined
-                            ? `${BASE_PATH}/img/custom-domain-on${
-                                resolvedTheme?.includes('dark') ? '' : '--light'
-                              }.svg`
-                            : `${BASE_PATH}/img/custom-domain-off${
-                                resolvedTheme?.includes('dark') ? '' : '--light'
-                              }.svg`
-                        }
-                      />
+                  </ScaffoldSectionDetail>
+                  <ScaffoldSectionContent>
+                    <div className="flex space-x-6">
+                      <div>
+                        <div className="rounded-md bg-surface-100 border border-muted w-[160px] h-[96px] overflow-hidden">
+                          <img
+                            alt="Custom Domain"
+                            width={160}
+                            height={96}
+                            src={
+                              customDomain !== undefined
+                                ? `${BASE_PATH}/img/custom-domain-on${
+                                    resolvedTheme?.includes('dark') ? '' : '--light'
+                                  }.svg`
+                                : `${BASE_PATH}/img/custom-domain-off${
+                                    resolvedTheme?.includes('dark') ? '' : '--light'
+                                  }.svg`
+                            }
+                          />
+                        </div>
+                      </div>
+                      <div>
+                        <p className="text-sm text-foreground-light">Current option:</p>
+                        <p>
+                          {customDomain !== undefined
+                            ? 'Custom domain is enabled'
+                            : 'Custom domain is not enabled'}
+                        </p>
+                        <ProjectUpdateDisabledTooltip
+                          projectUpdateDisabled={projectUpdateDisabled}
+                          projectNotActive={!isProjectActive}
+                        >
+                          <Button
+                            type="default"
+                            className="mt-2 pointer-events-auto"
+                            onClick={() => setPanel('customDomain')}
+                            disabled={!isProjectActive || projectUpdateDisabled}
+                          >
+                            Change custom domain
+                          </Button>
+                        </ProjectUpdateDisabledTooltip>
+                      </div>
                    </div>
-                  </div>
-                  <div>
-                    <p className="text-sm text-foreground-light">Current option:</p>
-                    <p>
-                      {customDomain !== undefined
-                        ? 'Custom domain is enabled'
-                        : 'Custom domain is not enabled'}
-                    </p>
-                    <ProjectUpdateDisabledTooltip
-                      projectUpdateDisabled={projectUpdateDisabled}
-                      projectNotActive={!isProjectActive}
-                    >
-                      <Button
-                        type="default"
-                        className="mt-2 pointer-events-auto"
-                        onClick={() => setPanel('customDomain')}
-                        disabled={!isProjectActive || projectUpdateDisabled}
-                      >
-                        Change custom domain
-                      </Button>
-                    </ProjectUpdateDisabledTooltip>
-                  </div>
-                </div>
-              </ScaffoldSectionContent>
-            </ScaffoldSection>
-          </ScaffoldContainer>
+                  </ScaffoldSectionContent>
+                </ScaffoldSection>
+              </ScaffoldContainer>
+            </>
+          )}
        </>
      )}

@@ -606,5 +618,3 @@ const Addons = () => {
    </>
  )
 }
-
-export default Addons
@@ -1,53 +0,0 @@
-import { Button } from 'ui'
-import { Plug, GitBranch, ChevronsUpDown, Pointer } from 'lucide-react'
-
-export const ConnectionStringMoved = () => {
-  return (
-    <div className="w-full flex flex-col xl:flex-row border py-10 pl-10 rounded-md">
-      <div className="flex flex-col gap-0 z-[2]">
-        <p className="text-sm text-foreground">Connection string has moved</p>
-        <p className="text-sm text-foreground-lighter">
-          You can find Project connect details by clicking 'Connect' in the top bar
-        </p>
-      </div>
-      <div className="relative grow flex flex-col -space-y-px">
-        <div className="w-full h-3">
-          <div className="bg-gradient-to-t from-background-surface-300 via-[25%] to-background-200 to-[100%] h-full w-full" />
-        </div>
-        <div className="flex justify-end relative">
-          <div className="bg-dash-sidebar border-b border-t border-t-border-muted py-2 px-10 flex gap-3 relative overflow-hidden">
-            <Button
-              type="text"
-              size="tiny"
-              className="rounded-full pointer-events-none opacity-50"
-              iconRight={<ChevronsUpDown size={12} strokeWidth={1.5} />}
-            >
-              Project name
-            </Button>
-            <Button
-              type="default"
-              size="tiny"
-              className="rounded-full pointer-events-none ring-1 ring-foreground-muted/20"
-              icon={<Plug size={12} className="rotate-90" />}
-            >
-              Connect
-            </Button>
-            <Button
-              type="text"
-              size="tiny"
-              className="rounded-full pointer-events-none -mr-20 opacity-50"
-              icon={<GitBranch size={12} />}
-            >
-              Enable Branching
-            </Button>
-          </div>
-          <Pointer
-            className=" absolute top-7 right-[110px] text-foreground-light fill-background"
-            strokeWidth={1}
-          />
-        </div>
-        <div className="absolute -inset-2 bg-gradient-to-l from-transparent via-background-200 via-[95%] to-background-200 to-[100%] z-[1]" />
-      </div>
-    </div>
-  )
-}
@@ -3,16 +3,22 @@ import { ScaffoldContainer } from 'components/layouts/Scaffold'
 import { PropsWithChildren } from 'react'

 import { useParams } from 'common'
+import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'

 const JWTKeysLayout = ({ children }: PropsWithChildren) => {
  const { ref: projectRef } = useParams()
+  const { projectSettingsLegacyJwtKeys } = useIsFeatureEnabled(['project_settings:legacy_jwt_keys'])

  const navigationItems = [
-    {
-      label: 'Legacy JWT Secret',
-      href: `/project/${projectRef}/settings/jwt`,
-      id: 'legacy-jwt-keys',
-    },
+    ...(projectSettingsLegacyJwtKeys
+      ? [
+          {
+            label: 'Legacy JWT Secret',
+            href: `/project/${projectRef}/settings/jwt`,
+            id: 'legacy-jwt-keys',
+          },
+        ]
+      : []),
    {
      label: 'JWT Signing Keys',
      href: `/project/${projectRef}/settings/jwt/signing-keys`,
@@ -38,11 +38,21 @@ const SettingsLayout = ({ title, children }: PropsWithChildren<SettingsLayoutPro
    projectEdgeFunctionAll: edgeFunctionsEnabled,
    projectStorageAll: storageEnabled,
    billingInvoices: invoicesEnabled,
+    projectSettingsLegacyJwtKeys: legacyJWTKeysEnabled,
+    projectSettingsLogDrains,
+    billingAll,
+    authenticationPolicies,
+    authenticationSignInProviders,
  } = useIsFeatureEnabled([
    'project_auth:all',
    'project_edge_function:all',
    'project_storage:all',
    'billing:invoices',
+    'project_settings:legacy_jwt_keys',
+    'project_settings:log_drains',
+    'billing:all',
+    'authentication:policies',
+    'authentication:sign_in_providers',
  ])

  const menuRoutes = generateSettingsMenu(ref, project, organization, {
@@ -50,6 +60,11 @@ const SettingsLayout = ({ title, children }: PropsWithChildren<SettingsLayoutPro
    edgeFunctions: edgeFunctionsEnabled,
    storage: storageEnabled,
    invoices: invoicesEnabled,
+    legacyJwtKeys: legacyJWTKeysEnabled,
+    logDrains: projectSettingsLogDrains,
+    billing: billingAll,
+    authPolicies: authenticationPolicies,
+    authSignInProviders: authenticationSignInProviders,
  })

  return (
@@ -14,6 +14,11 @@ export const generateSettingsMenu = (
    edgeFunctions?: boolean
    storage?: boolean
    invoices?: boolean
+    legacyJwtKeys?: boolean
+    logDrains?: boolean
+    billing?: boolean
+    authPolicies?: boolean
+    authSignInProviders?: boolean
  }
 ): ProductMenuGroup[] => {
  const isProjectBuilding = project?.status === PROJECT_STATUS.COMING_UP
@@ -22,6 +27,15 @@ export const generateSettingsMenu = (
  const authEnabled = features?.auth ?? true
  const edgeFunctionsEnabled = features?.edgeFunctions ?? true
  const storageEnabled = features?.storage ?? true
+  const legacyJwtKeysEnabled = features?.legacyJwtKeys ?? true
+  const logDrainsEnabled = features?.logDrains ?? true
+  const billingEnabled = features?.billing ?? true
+
+  const authSettingsURL = features?.authPolicies
+    ? `/project/${ref}/auth/policies`
+    : features?.authSignInProviders
+      ? `/project/${ref}/auth/providers`
+      : `/project/${ref}/auth/sessions`

  return [
    {
@@ -57,12 +71,16 @@ export const generateSettingsMenu = (
                url: `/project/${ref}/settings/integrations`,
                items: [],
              },
-              {
-                name: `Log Drains`,
-                key: `log-drains`,
-                url: `/project/${ref}/settings/log-drains`,
-                items: [],
-              },
+              ...(logDrainsEnabled
+                ? [
+                    {
+                      name: `Log Drains`,
+                      key: `log-drains`,
+                      url: `/project/${ref}/settings/log-drains`,
+                      items: [],
+                    },
+                  ]
+                : []),
              {
                name: 'Data API',
                key: 'api',
@@ -79,7 +97,9 @@ export const generateSettingsMenu = (
              {
                name: 'JWT Keys',
                key: 'jwt',
-                url: `/project/${ref}/settings/jwt`,
+                url: legacyJwtKeysEnabled
+                  ? `/project/${ref}/settings/jwt`
+                  : `/project/${ref}/settings/jwt/signing-keys`,
                items: [],
                label: 'NEW',
              },
@@ -116,8 +136,9 @@ export const generateSettingsMenu = (
              {
                name: 'Authentication',
                key: 'auth',
-                url: isProjectBuilding ? buildingUrl : `/project/${ref}/settings/auth`,
+                url: authSettingsURL,
                items: [],
+                rightIcon: <ArrowUpRight strokeWidth={1} className="h-4 w-4" />,
              },
            ]
          : []),
@@ -149,14 +170,17 @@ export const generateSettingsMenu = (
    {
      title: 'Billing',
      items: [
-        {
-          name: 'Subscription',
-          key: 'subscription',
-          url: `/org/${organization?.slug}/billing`,
-          items: [],
-          rightIcon: <ArrowUpRight strokeWidth={1} className="h-4 w-4" />,
-        },
-
+        ...(billingEnabled
+          ? [
+              {
+                name: 'Subscription',
+                key: 'subscription',
+                url: `/org/${organization?.slug}/billing`,
+                items: [],
+                rightIcon: <ArrowUpRight strokeWidth={1} className="h-4 w-4" />,
+              },
+            ]
+          : []),
        {
          name: 'Usage',
          key: 'usage',
@@ -10,6 +10,7 @@ import Panel from 'components/ui/Panel'
 import { useJwtSecretUpdatingStatusQuery } from 'data/config/jwt-secret-updating-status-query'
 import { useProjectSettingsV2Query } from 'data/config/project-settings-v2-query'
 import { useAsyncCheckProjectPermissions } from 'hooks/misc/useCheckPermissions'
+import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'
 import { Input } from 'ui'
 import { getLastUsedAPIKeys, useLastUsedAPIKeysLogQuery } from './DisplayApiSettings.utils'
 import { ToggleLegacyApiKeysPanel } from './ToggleLegacyApiKeys'
@@ -24,6 +25,9 @@ export const DisplayApiSettings = ({
  showLegacyText?: boolean
 }) => {
  const { ref: projectRef } = useParams()
+  const { projectSettingsShowDisableLegacyApiKeys } = useIsFeatureEnabled([
+    'project_settings:show_disable_legacy_api_keys',
+  ])

  const {
    data: settings,
@@ -213,21 +217,22 @@ export const DisplayApiSettings = ({
            </Panel.Content>
          ))
        )}
-        {showNotice ? (
-          <Panel.Notice
-            className="border-t"
-            title="API keys have moved"
-            badgeLabel="Changelog"
-            description={`
+      </Panel>
+
+      {showNotice ? (
+        <Panel.Notice
+          className="border-t"
+          title="API keys have moved"
+          badgeLabel="Changelog"
+          description={`
  \`anon\` and \`service_role\` API keys can now be replaced with \`publishable\` and \`secret\` API keys.
  `}
-            href="https://github.com/orgs/supabase/discussions/29260"
-            buttonText="Read the announcement"
-          />
-        ) : (
-          <ToggleLegacyApiKeysPanel />
-        )}
-      </Panel>
+          href="https://github.com/orgs/supabase/discussions/29260"
+          buttonText="Read the announcement"
+        />
+      ) : projectSettingsShowDisableLegacyApiKeys ? (
+        <ToggleLegacyApiKeysPanel />
+      ) : null}
    </>
  )
 }
@@ -1,14 +1,13 @@
 import { DiskManagementPanelForm } from 'components/interfaces/DiskManagement/DiskManagementPanelForm'
 import { ConnectionPooling, NetworkRestrictions } from 'components/interfaces/Settings/Database'
 import BannedIPs from 'components/interfaces/Settings/Database/BannedIPs'
-import { ConnectionStringMoved } from 'components/interfaces/Settings/Database/ConnectionStringMoved'
 import { DatabaseReadOnlyAlert } from 'components/interfaces/Settings/Database/DatabaseReadOnlyAlert'
 import ResetDbPassword from 'components/interfaces/Settings/Database/DatabaseSettings/ResetDbPassword'
 import DiskSizeConfiguration from 'components/interfaces/Settings/Database/DiskSizeConfiguration'
 import { PoolingModesModal } from 'components/interfaces/Settings/Database/PoolingModesModal'
 import SSLConfiguration from 'components/interfaces/Settings/Database/SSLConfiguration'
-import DefaultLayout from 'components/layouts/DefaultLayout'
 import DatabaseLayout from 'components/layouts/DatabaseLayout/DatabaseLayout'
+import DefaultLayout from 'components/layouts/DefaultLayout'
 import { ScaffoldContainer, ScaffoldHeader, ScaffoldTitle } from 'components/layouts/Scaffold'
 import { useIsAwsCloudProvider, useIsAwsK8sCloudProvider } from 'hooks/misc/useSelectedProject'
 import type { NextPageWithLayout } from 'types'
@@ -30,7 +29,6 @@ const ProjectSettings: NextPageWithLayout = () => {
        <div className="space-y-10">
          <div className="flex flex-col gap-y-10">
            <DatabaseReadOnlyAlert />
-            <ConnectionStringMoved />
            <ResetDbPassword />
            <ConnectionPooling />
          </div>
@@ -1,4 +1,4 @@
-import Addons from 'components/interfaces/Settings/Addons/Addons'
+import { Addons } from 'components/interfaces/Settings/Addons/Addons'
 import DefaultLayout from 'components/layouts/DefaultLayout'
 import SettingsLayout from 'components/layouts/ProjectSettingsLayout/SettingsLayout'
 import {
@@ -1,106 +0,0 @@
-import { useParams } from 'common'
-import DefaultLayout from 'components/layouts/DefaultLayout'
-import SettingsLayout from 'components/layouts/ProjectSettingsLayout/SettingsLayout'
-import ProductEmptyState from 'components/to-be-cleaned/ProductEmptyState'
-import { ChevronRight } from 'lucide-react'
-import Link from 'next/link'
-import type { NextPageWithLayout } from 'types'
-
-const ProjectSettings: NextPageWithLayout = () => {
-  const { ref } = useParams() as { ref: string }
-
-  return (
-    <ProductEmptyState title="Authentication settings have moved">
-      <div className="text-sm">
-        <p className="text-foreground-light mb-4">
-          All settings are now under configuration within the Authentication page.
-        </p>
-        <Link
-          href={`/project/${ref}/auth/providers`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          General user signup
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/providers`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          Password settings in email provider
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/sessions`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          User sessions
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/sessions`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          Refresh tokens
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/protection`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          Bot and abuse protection
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/smtp`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          SMTP settings
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/settings/jwt`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          Access token expiry
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/mfa`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          Multifactor authentication
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/third-party`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          Third party authentication
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/advanced`}
-          className="py-2 hover:text-foreground border-b flex items-center justify-between"
-        >
-          Max request duration
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-        <Link
-          href={`/project/${ref}/auth/advanced`}
-          className="py-2 hover:text-foreground flex items-center justify-between"
-        >
-          Max direct database connections
-          <ChevronRight strokeWidth={1.5} size={16} />
-        </Link>
-      </div>
-    </ProductEmptyState>
-  )
-}
-
-ProjectSettings.getLayout = (page) => (
-  <DefaultLayout>
-    <SettingsLayout title="Authentication">{page}</SettingsLayout>
-  </DefaultLayout>
-)
-
-export default ProjectSettings
@@ -20,7 +20,8 @@ const ProjectSettings: NextPageWithLayout = () => {
  const { data: selectedOrganization } = useSelectedOrganizationQuery()

  const isBranch = !!project?.parent_project_ref
-  const { projectsTransfer: projectTransferEnabled } = useIsFeatureEnabled(['projects:transfer'])
+  const { projectsTransfer: projectTransferEnabled, projectSettingsCustomDomains } =
+    useIsFeatureEnabled(['projects:transfer', 'project_settings:custom_domains'])

  const { data: subscription } = useOrgSubscriptionQuery({ orgSlug: selectedOrganization?.slug })
  const hasHipaaAddon = subscriptionHasHipaaAddon(subscription)
@@ -37,7 +38,7 @@ const ProjectSettings: NextPageWithLayout = () => {

        {/* this is only settable on compliance orgs, currently that means HIPAA orgs */}
        {!isBranch && hasHipaaAddon && <ComplianceConfig />}
-        <CustomDomainConfig />
+        {projectSettingsCustomDomains && <CustomDomainConfig />}
        {!isBranch && projectTransferEnabled && <TransferProjectPanel />}
        {!isBranch && <DeleteProjectPanel />}
      </ScaffoldContainer>
@@ -8,16 +8,22 @@ import { JwtSecretUpdateError, JwtSecretUpdateStatus } from '@supabase/shared-ty
 import { useQueryClient } from '@tanstack/react-query'
 import { useParams } from 'common'
 import { JWT_SECRET_UPDATE_ERROR_MESSAGES } from 'components/interfaces/JwtSecrets/jwt.constants'
+import { UnknownInterface } from 'components/ui/UnknownInterface'
 import { useJwtSecretUpdatingStatusQuery } from 'data/config/jwt-secret-updating-status-query'
 import { configKeys } from 'data/config/keys'
+import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'
 import { useEffect, useRef } from 'react'
 import { toast } from 'sonner'

 const JWTKeysLegacyPage: NextPageWithLayout = () => {
-  const { ref: projectRef, source } = useParams()
  const client = useQueryClient()
+  const { ref: projectRef } = useParams()
+  const { projectSettingsLegacyJwtKeys } = useIsFeatureEnabled(['project_settings:legacy_jwt_keys'])

-  const { data } = useJwtSecretUpdatingStatusQuery({ projectRef })
+  const { data } = useJwtSecretUpdatingStatusQuery(
+    { projectRef },
+    { enabled: projectSettingsLegacyJwtKeys }
+  )
  const jwtSecretUpdateStatus = data?.jwtSecretUpdateStatus
  const jwtSecretUpdateError = data?.jwtSecretUpdateError

@@ -44,14 +50,20 @@ const JWTKeysLegacyPage: NextPageWithLayout = () => {
    previousJwtSecretUpdateStatus.current = jwtSecretUpdateStatus
  }, [jwtSecretUpdateStatus])

-  return <JWTSettings />
+  if (!projectSettingsLegacyJwtKeys) {
+    return <UnknownInterface urlBack={`/project/${projectRef}/settings/jwt/signing-keys`} />
+  }
+
+  return (
+    <JWTKeysLayout>
+      <JWTSettings />
+    </JWTKeysLayout>
+  )
 }

 JWTKeysLegacyPage.getLayout = (page) => (
  <DefaultLayout>
-    <SettingsLayout>
-      <JWTKeysLayout>{page}</JWTKeysLayout>
-    </SettingsLayout>
+    <SettingsLayout>{page}</SettingsLayout>
  </DefaultLayout>
 )

@@ -46,6 +46,12 @@
  "project_homepage:show_instance_size": true,
  "project_homepage:show_examples": true,

+  "project_addons:dedicated_ipv4_address": true,
+  "project_settings:custom_domains": true,
+  "project_settings:show_disable_legacy_api_keys": true,
+  "project_settings:legacy_jwt_keys": true,
+  "project_settings:log_drains": true,
+
  "reports:all": true,

  "table_editor:enable_rls_toggle": true
@@ -153,6 +153,28 @@
      "description": "Show all client libraries examples in the project homepage. When false, all client library examples will be hidden except the JavaScript client library."
    },

+    "project_addons:dedicated_ipv4_address": {
+      "type": "boolean",
+      "description": "Show the dedicated IPv4 address addon"
+    },
+
+    "project_settings:custom_domains": {
+      "type": "boolean",
+      "description": "Show the custom domain configuration section + custom domain addon"
+    },
+    "project_settings:show_disable_legacy_api_keys": {
+      "type": "boolean",
+      "description": "Show the disable legacy API keys section in project settings API Keys page"
+    },
+    "project_settings:legacy_jwt_keys": {
+      "type": "boolean",
+      "description": "Enable the legacy JWT secret page in project settings"
+    },
+    "project_settings:log_drains": {
+      "type": "boolean",
+      "description": "Enable the log drains page in project settings"
+    },
+
    "reports:all": {
      "type": "boolean",
      "description": "Enable the project reports page"
@@ -196,6 +218,11 @@
    "project_homepage:show_instance_size",
    "project_homepage:show_examples",
    "project_homepage:show_all_client_libraries",
+    "project_addons:dedicated_ipv4_address",
+    "project_settings:custom_domains",
+    "project_settings:show_disable_legacy_api_keys",
+    "project_settings:legacy_jwt_keys",
+    "project_settings:log_drains",
    "project_connection:javascript_example",
    "project_connection:dart_example",
    "reports:all",