fix(resource): prevent permission-gated breadcrumb items from flashing on load

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/files/files.tsx

@@ -1585,10 +1585,11 @@ export function Files() {
               }
             : undefined,
         dropdownItems:
-          isCurrentFolder && canEdit
+          isCurrentFolder && (canEdit || userPermissions.isLoading)
             ? [
                 {
                   label: 'Rename',
+                  disabled: !canEdit,
                   onClick: () => breadcrumbRenameRef.current.startRename(folder.id, folder.name),
                 },
               ]
@@ -1605,6 +1606,7 @@ export function Files() {
     router,
     workspaceId,
     canEdit,
+    userPermissions.isLoading,
     breadcrumbRename.editingId,
     breadcrumbRename.editValue,
   ])

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx

@@ -814,24 +814,42 @@ export function KnowledgeBase({
           }
         : undefined,
       dropdownItems: [
-        ...(userPermissions.canEdit
+        ...(userPermissions.canEdit || userPermissions.isLoading
           ? [
               {
                 label: 'Rename',
                 icon: Pencil,
+                disabled: !userPermissions.canEdit,
                 onClick: () => kbRename.startRename(id, knowledgeBaseName),
               },
-              { label: 'Tags', icon: Tag, onClick: () => setShowTagsModal(true) },
-              { label: 'Delete', icon: Trash, onClick: () => setShowDeleteDialog(true) },
+              {
+                label: 'Tags',
+                icon: Tag,
+                disabled: !userPermissions.canEdit,
+                onClick: () => setShowTagsModal(true),
+              },
+              {
+                label: 'Delete',
+                icon: Trash,
+                disabled: !userPermissions.canEdit,
+                onClick: () => setShowDeleteDialog(true),
+              },
             ]
           : []),
       ],
     },
   ]
 
   const headerActions: HeaderAction[] = [
-    ...(userPermissions.canEdit
-      ? [{ label: 'New connector', icon: Plus, onClick: () => setShowAddConnectorModal(true) }]
+    ...(userPermissions.canEdit || userPermissions.isLoading
+      ? [
+          {
+            label: 'New connector',
+            icon: Plus,
+            disabled: !userPermissions.canEdit,
+            onClick: () => setShowAddConnectorModal(true),
+          },
+        ]
       : []),
   ]