Auth0 Approval Flow (Studio + Site)
Auth0 Approval Flow (Studio + Site)
Section titled “Auth0 Approval Flow (Studio + Site)”This adds a simple bridge so approving a request in Sanity also marks the user as approved in Auth0 (via app_metadata).
What this does
Section titled “What this does”- Studio action
Approve
(for documents of typeaccessRequest
) now:- Ensures an
approvedUser
document exists in Sanity - Sets the
accessRequest.status = approved
- Calls a Studio serverless API
POST /api/approve-user { email }
- Ensures an
- The API uses Auth0 Management API to set
app_metadata.approved = true
for that user. - If a user doesn’t exist in Auth0 yet, the API returns 202 and does nothing (they’ll be updated the next time action is triggered after first login).
Configure Auth0 (one-time)
Section titled “Configure Auth0 (one-time)”- Create a Machine-to-Machine application in Auth0
- Name:
Ariane Studio (M2M)
- Allowed Audience:
https://YOUR_DOMAIN/api/v2/
- Permissions (Auth0 Management API):
read:users
,update:users
,read:users_app_metadata
,update:users_app_metadata
- Get credentials
- Domain: e.g.,
your-tenant.eu.auth0.com
- Client ID and Client Secret from the M2M app
- Set env vars in Vercel (Studio project settings)
AUTH0_DOMAIN = your-tenant.eu.auth0.com
AUTH0_CLIENT_ID = <client id>
AUTH0_CLIENT_SECRET = <client secret>
- Redeploy Studio to apply.
Use it
Section titled “Use it”- In Studio, open an
accessRequest
document and clickApprove
. - The request is approved in Sanity, and we best-effort update Auth0.
- You can see the
approved
flag under the user’sapp_metadata
in Auth0.
How Site uses this
Section titled “How Site uses this”- Site already checks approved status via Sanity in:
site/src/lib/sanityServer.ts
→isApproved(email)
- You can also enforce at Auth0 by adding a Rule/Action to block sign-in when
app_metadata.approved !== true
(optional if Cloudflare Access is the outer gate).
Cloudflare Access + Auth0
Section titled “Cloudflare Access + Auth0”- If Cloudflare Access fronts your dev/prod, set it to use Auth0 as the IdP.
- Group/role mapping from Auth0 → Access JWT can be custom (namespace claims). If you want path-based gates in the app:
- Set env in Site:
CF_ACCESS_PROTECTED_PREFIXES
,CF_ACCESS_REQUIRED_GROUPS
and optionallyCF_ACCESS_GROUPS_CLAIM
- Middleware (
site/src/middleware.ts
) will verify and allow/deny accordingly whenAUTH_MODE=cf-access-only
.
- Set env in Site: