From e88f389fa594401f6c376ff37da402b295d565e0 Mon Sep 17 00:00:00 2001
From: Jordi Enric <37541088+jordienr@users.noreply.github.com>
Date: Tue, 24 Mar 2026 18:13:32 +0100
Subject: [PATCH] fix(auth): scope permissions and org list cache keys by user
 ID FE-2872 (#44139)

## Problem

React Query cache keys for permissions and organizations are generic
(`['permissions']`, `['organizations']`) with no user identifier. When a
new session is established without going through the explicit sign-out
flow (e.g. clicking an email verification link while still logged in as
another account), stale data from the previous user persists in cache.
The new user ends up seeing the old user's permissions and org list,
which makes the project creation form appear enabled. When submitted,
the backend rejects with "not an owner" because the token belongs to the
new account which has no ownership of the old org.

A hard refresh clears the in-memory React Query state and forces a fresh
fetch, which is why it resolved the issue.

## Fix

Scope `permissionKeys.list` and `organizationKeys.list` by user ID so
different accounts never share the same cache slot. When a different
user logs in, their queries simply get fresh cache entries and never see
data from the previous session. Updated all invalidation and
`setQueriesData` call sites across 18 files to pass the current user ID.

## How to test

I don't think it can be tested in the preview environment sadly since
the request to verify has to go to auth.supabase.green instead of
vercel-ref.supabase.green

---------

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../ProjectCreation/OrganizationSelector.tsx          | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/apps/studio/components/interfaces/ProjectCreation/OrganizationSelector.tsx b/apps/studio/components/interfaces/ProjectCreation/OrganizationSelector.tsx
index a2b6777f7d6..c27ef8867ef 100644
--- a/apps/studio/components/interfaces/ProjectCreation/OrganizationSelector.tsx
+++ b/apps/studio/components/interfaces/ProjectCreation/OrganizationSelector.tsx
@@ -1,10 +1,13 @@
 import { PermissionAction } from '@supabase/shared-types/out/constants'
+import { useQueryClient } from '@tanstack/react-query'
 import { useRouter } from 'next/router'
+import { useEffect } from 'react'
 import { UseFormReturn } from 'react-hook-form'
 
 import { useParams } from 'common'
 import { NoPermission } from 'components/ui/NoPermission'
 import Panel from 'components/ui/Panel'
+import { permissionKeys } from 'data/permissions/keys'
 import { useOrganizationsQuery } from 'data/organizations/organizations-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
 import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
@@ -30,9 +33,17 @@ interface OrganizationSelectorProps {
 export const OrganizationSelector = ({ form }: OrganizationSelectorProps) => {
   const router = useRouter()
   const { slug } = useParams()
+  const queryClient = useQueryClient()
   const { data: currentOrg } = useSelectedOrganizationQuery()
   const { can: isAdmin } = useAsyncCheckPermissions(PermissionAction.CREATE, 'projects')
 
+  // Permissions may be stale for newly created accounts due to replication lag between
+  // org setup and the permissions endpoint. Invalidate in the background on mount so the
+  // check reflects the latest state before the user tries to create a project.
+  useEffect(() => {
+    queryClient.invalidateQueries({ queryKey: permissionKeys.list() })
+  }, [queryClient])
+
   const { data: organizations, isSuccess: isOrganizationsSuccess } = useOrganizationsQuery()
   const isInvalidSlug = isOrganizationsSuccess && currentOrg === undefined
   const orgNotFound = (organizations?.length ?? 0) > 0 && isInvalidSlug