AuthLayout.utils.ts241 lines · main
1import { useFlag, useParams } from 'common'
2
3import type { ProductMenuGroup } from '@/components/ui/ProductMenu/ProductMenu.types'
4import { useIsFeatureEnabled } from '@/hooks/misc/useIsFeatureEnabled'
5import { IS_PLATFORM } from '@/lib/constants'
6import { SHORTCUT_IDS } from '@/state/shortcuts/registry'
7
8export interface GenerateAuthMenuOptions {
9 ref?: string
10 isPlatform: boolean
11 showOverview: boolean
12 features: {
13 signInProviders: boolean
14 rateLimits: boolean
15 emails: boolean
16 multiFactor: boolean
17 attackProtection: boolean
18 performance: boolean
19 passkeys?: boolean
20 }
21}
22
23export function generateAuthMenu(options: GenerateAuthMenuOptions): ProductMenuGroup[] {
24 const { ref, isPlatform, showOverview, features } = options
25 const passkeysInMenu = Boolean(features.passkeys)
26 const baseUrl = `/project/${ref}/auth`
27
28 return [
29 {
30 title: 'Manage',
31 items: [
32 ...(showOverview
33 ? [
34 {
35 name: 'Overview',
36 key: 'overview',
37 url: `${baseUrl}/overview`,
38 items: [],
39 shortcutId: SHORTCUT_IDS.NAV_AUTH_OVERVIEW,
40 },
41 ]
42 : []),
43 {
44 name: 'Users',
45 key: 'users',
46 url: `${baseUrl}/users`,
47 items: [],
48 shortcutId: SHORTCUT_IDS.NAV_AUTH_USERS,
49 },
50 ...(isPlatform
51 ? [
52 {
53 name: 'OAuth Apps',
54 key: 'oauth-apps',
55 url: `${baseUrl}/oauth-apps`,
56 items: [],
57 shortcutId: SHORTCUT_IDS.NAV_AUTH_OAUTH_APPS,
58 },
59 ]
60 : []),
61 ],
62 },
63 ...(features.emails && isPlatform
64 ? [
65 {
66 title: 'Notifications',
67 items: [
68 ...(features.emails
69 ? [
70 {
71 name: 'Emails',
72 key: 'email',
73 pages: ['templates', 'smtp'],
74 url: `${baseUrl}/templates`,
75 items: [],
76 shortcutId: SHORTCUT_IDS.NAV_AUTH_EMAIL,
77 },
78 ]
79 : []),
80 ],
81 },
82 ]
83 : []),
84 {
85 title: 'Configuration',
86 items: [
87 {
88 name: 'Policies',
89 key: 'policies',
90 url: `${baseUrl}/policies`,
91 items: [],
92 shortcutId: SHORTCUT_IDS.NAV_AUTH_POLICIES,
93 },
94 ...(isPlatform
95 ? [
96 ...(features.signInProviders
97 ? [
98 {
99 name: 'Sign In / Providers',
100 key: 'sign-in-up',
101 pages: ['providers', 'third-party'],
102 url: `${baseUrl}/providers`,
103 items: [],
104 shortcutId: SHORTCUT_IDS.NAV_AUTH_SIGN_IN,
105 },
106 ]
107 : []),
108 ...(passkeysInMenu
109 ? [
110 {
111 name: 'Passkeys',
112 key: 'passkeys',
113 url: `${baseUrl}/passkeys`,
114 label: 'Beta',
115 shortcutId: SHORTCUT_IDS.NAV_AUTH_PASSKEYS,
116 },
117 ]
118 : []),
119 {
120 name: 'OAuth Server',
121 key: 'oauth-server',
122 url: `${baseUrl}/oauth-server`,
123 label: 'Beta',
124 shortcutId: SHORTCUT_IDS.NAV_AUTH_OAUTH_SERVER,
125 },
126 {
127 name: 'Sessions',
128 key: 'sessions',
129 url: `${baseUrl}/sessions`,
130 items: [],
131 shortcutId: SHORTCUT_IDS.NAV_AUTH_SESSIONS,
132 },
133 ...(features.rateLimits
134 ? [
135 {
136 name: 'Rate Limits',
137 key: 'rate-limits',
138 url: `${baseUrl}/rate-limits`,
139 items: [],
140 shortcutId: SHORTCUT_IDS.NAV_AUTH_RATE_LIMITS,
141 },
142 ]
143 : []),
144 ...(features.multiFactor
145 ? [
146 {
147 name: 'Multi-Factor',
148 key: 'mfa',
149 url: `${baseUrl}/mfa`,
150 items: [],
151 shortcutId: SHORTCUT_IDS.NAV_AUTH_MFA,
152 },
153 ]
154 : []),
155 {
156 name: 'URL Configuration',
157 key: 'url-configuration',
158 url: `${baseUrl}/url-configuration`,
159 items: [],
160 shortcutId: SHORTCUT_IDS.NAV_AUTH_URL_CONFIGURATION,
161 },
162 ...(features.attackProtection
163 ? [
164 {
165 name: 'Attack Protection',
166 key: 'protection',
167 url: `${baseUrl}/protection`,
168 items: [],
169 shortcutId: SHORTCUT_IDS.NAV_AUTH_PROTECTION,
170 },
171 ]
172 : []),
173 {
174 name: 'Auth Hooks',
175 key: 'hooks',
176 url: `${baseUrl}/hooks`,
177 items: [],
178 label: 'Beta',
179 shortcutId: SHORTCUT_IDS.NAV_AUTH_HOOKS,
180 },
181 {
182 name: 'Audit Logs',
183 key: 'audit-logs',
184 url: `${baseUrl}/audit-logs`,
185 items: [],
186 shortcutId: SHORTCUT_IDS.NAV_AUTH_AUDIT_LOGS,
187 },
188 ...(features.performance
189 ? [
190 {
191 name: 'Performance',
192 key: 'performance',
193 url: `${baseUrl}/performance`,
194 items: [],
195 shortcutId: SHORTCUT_IDS.NAV_AUTH_PERFORMANCE,
196 },
197 ]
198 : []),
199 ]
200 : []),
201 ],
202 },
203 ]
204}
205
206export const useGenerateAuthMenu = (): ProductMenuGroup[] => {
207 const { ref } = useParams()
208 const showOverview = useFlag('authOverviewPage')
209 const enablePasskeyAuth = useFlag('enablePasskeyAuth')
210
211 const {
212 authenticationSignInProviders,
213 authenticationRateLimits,
214 authenticationEmails,
215 authenticationMultiFactor,
216 authenticationAttackProtection,
217 authenticationPerformance,
218 } = useIsFeatureEnabled([
219 'authentication:sign_in_providers',
220 'authentication:rate_limits',
221 'authentication:emails',
222 'authentication:multi_factor',
223 'authentication:attack_protection',
224 'authentication:performance',
225 ])
226
227 return generateAuthMenu({
228 ref,
229 isPlatform: IS_PLATFORM,
230 showOverview,
231 features: {
232 signInProviders: authenticationSignInProviders,
233 rateLimits: authenticationRateLimits,
234 emails: authenticationEmails,
235 multiFactor: authenticationMultiFactor,
236 attackProtection: authenticationAttackProtection,
237 performance: authenticationPerformance,
238 passkeys: enablePasskeyAuth,
239 },
240 })
241}