Files
supabase/apps/studio/components/layouts/ProjectSettingsLayout/SettingsMenu.utils.tsx
T
Stojan DimitrovskiandIvan Vasilov 4945ba1861 feat: add asymmetric JWT UI (#36519)
* original files from previous PR

* get rid of router in jwt-secrets to make it show up

* rename jwt-secrets page to jwt-signing-keys

* add jwt-signing-keys query

* add legacy jwt signing keys query

* wire-up JwtSecretKeysTable with queries

* add jwt signing keys page to settings menu

* deduplicate labels, descriptions, etc

* add create, update jwt-signing-key mutations

* update types

* remove unused components, to be refactored later

* make everything into a mostly working state

* legacy migration added

* put jwt keys page like api keys

* fully migrate legacy jwt secret page

* fix prettier

* fix typecheck ts-expect-error

* rm unneeded file

* Fix compile errors.

* Rename the files and move them to the same folder.

* Merge the two constant files.

* Fix the imports.

* Fix a bug in the API keys page when opening it in a new tab.

* Change the page to be at /signing-keys

* Fix some minor types.

* Break apart some of the components in the signing keys UI.

* Use a feature banner for the initial action.

* Make a create key dialog and move functionality there.

* Fix some cosmetic issues.

* Minor cosmetic fixes.

* Remove extra keys in RQ cache.

* Add a missing link

* Add a banner when the feature flag is false.

* Minor type fix.

* more tiny type fix

* fix error on create standby key

* add alert to prevent revoking legacy jwt secret without disabling legacy api keys first

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2025-06-23 09:36:07 +12:00

171 lines
4.5 KiB
TypeScript

import { ArrowUpRight } from 'lucide-react'
import type { ProductMenuGroup } from 'components/ui/ProductMenu/ProductMenu.types'
import type { Project } from 'data/projects/project-detail-query'
import { IS_PLATFORM, PROJECT_STATUS } from 'lib/constants'
import type { Organization } from 'types'
export const generateSettingsMenu = (
ref?: string,
project?: Project,
organization?: Organization,
features?: {
auth?: boolean
edgeFunctions?: boolean
storage?: boolean
invoices?: boolean
}
): ProductMenuGroup[] => {
const isProjectBuilding = project?.status === PROJECT_STATUS.COMING_UP
const buildingUrl = `/project/${ref}`
const authEnabled = features?.auth ?? true
const edgeFunctionsEnabled = features?.edgeFunctions ?? true
const storageEnabled = features?.storage ?? true
return [
{
title: 'Project Settings',
items: [
{
name: 'General',
key: 'general',
url: `/project/${ref}/settings/general`,
items: [],
},
...(IS_PLATFORM
? [
{
name: 'Compute and Disk',
key: 'compute-and-disk',
url: `/project/${ref}/settings/compute-and-disk`,
items: [],
},
]
: []),
{
name: 'Infrastructure',
key: 'infrastructure',
url: isProjectBuilding ? buildingUrl : `/project/${ref}/settings/infrastructure`,
items: [],
},
...(IS_PLATFORM
? [
{
name: 'Integrations',
key: 'integrations',
url: `/project/${ref}/settings/integrations`,
items: [],
},
{
name: 'API Keys',
key: 'api-keys',
url: `/project/${ref}/settings/api-keys`,
items: [],
label: 'NEW',
},
{
name: 'JWT Keys',
key: 'jwt',
url: `/project/${ref}/settings/jwt`,
items: [],
label: 'NEW',
},
]
: []),
{
name: 'Add Ons',
key: 'addons',
url: `/project/${ref}/settings/addons`,
items: [],
},
{
name: 'Vault',
key: 'vault',
url: isProjectBuilding ? buildingUrl : `/project/${ref}/integrations/vault/overview`,
items: [],
rightIcon: <ArrowUpRight strokeWidth={1} className="h-4 w-4" />,
label: 'Alpha',
},
],
},
{
title: 'Configuration',
items: [
{
name: 'Database',
key: 'database',
url: isProjectBuilding ? buildingUrl : `/project/${ref}/settings/database`,
items: [],
},
{
name: 'Data API',
key: 'api',
url: isProjectBuilding ? buildingUrl : `/project/${ref}/settings/api`,
items: [],
},
...(IS_PLATFORM && authEnabled
? [
{
name: 'Authentication',
key: 'auth',
url: isProjectBuilding ? buildingUrl : `/project/${ref}/settings/auth`,
items: [],
},
]
: []),
...(IS_PLATFORM && storageEnabled
? [
{
name: 'Storage',
key: 'storage',
url: `/project/${ref}/settings/storage`,
items: [],
},
]
: []),
...(IS_PLATFORM && edgeFunctionsEnabled
? [
{
name: 'Edge Functions',
key: 'functions',
url: `/project/${ref}/functions/secrets`,
items: [],
rightIcon: <ArrowUpRight strokeWidth={1} className="h-4 w-4" />,
},
]
: []),
...(IS_PLATFORM
? [
{
name: `Log Drains`,
key: `log-drains`,
url: `/project/${ref}/settings/log-drains`,
items: [],
},
]
: []),
],
},
{
title: 'Billing',
items: [
{
name: 'Subscription',
key: 'subscription',
url: `/org/${organization?.slug}/billing`,
items: [],
},
{
name: 'Usage',
key: 'usage',
url: `/org/${organization?.slug}/usage?projectRef=${ref}`,
items: [],
},
],
},
]
}