From e248ee79b2f3793ff4bec7b16c3df1396f0b937c Mon Sep 17 00:00:00 2001
From: akshat mittal <akshatmittal.0007@gmail.com>
Date: Sat, 10 Jan 2026 18:01:51 +0200
Subject: [PATCH] fix: update cache before node in role creation to prevent
 blank flash

---
 .../teams/[teamId]/hooks/use-create-role.tsx  | 20 +++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/app/teams/[teamId]/hooks/use-create-role.tsx b/src/app/teams/[teamId]/hooks/use-create-role.tsx
index 43df8bc..770fed0 100644
--- a/src/app/teams/[teamId]/hooks/use-create-role.tsx
+++ b/src/app/teams/[teamId]/hooks/use-create-role.tsx
@@ -195,9 +195,13 @@ export function useCreateRole({
     onSuccess: (newRole, _variables, context) => {
       if (!context) return;
 
-      // Invalidate caches to ensure fresh data on next fetch
-      void utils.team.getById.invalidate({ id: teamId });
-      void utils.role.getByTeamId.invalidate({ teamId });
+      // Update cache BEFORE node so RoleCard finds newRole.id on re-render
+      utils.role.getByTeamId.setData({ teamId }, (old) => {
+        if (!old) return [newRole];
+        return old.map((role) =>
+          role.id === context.tempRoleId ? newRole : role,
+        );
+      });
 
       // Update node with real roleId and clear pending state (canvas context only)
       if (storeApi && setNodes) {
@@ -219,13 +223,9 @@ export function useCreateRole({
         setNodes(updatedNodes);
       }
 
-      // Replace temp role with real role in cache
-      utils.role.getByTeamId.setData({ teamId }, (old) => {
-        if (!old) return [newRole];
-        return old.map((role) =>
-          role.id === context.tempRoleId ? newRole : role,
-        );
-      });
+      // Invalidate caches for background refresh
+      void utils.team.getById.invalidate({ id: teamId });
+      void utils.role.getByTeamId.invalidate({ teamId });
     },
     onError: (error, _variables, context) => {
       if (context?.previousRoles !== undefined) {