fix: OU-1236 Kebab icon should be disable while "Checking permissions" is happening

Author: zhuje

web/src/components/dashboards/perses/dashboard-list.tsx

@@ -36,6 +36,7 @@ import {
   DuplicateActionModal,
   RenameActionModal,
 } from './dashboard-action-modals';
+import { useEditableProjects } from './hooks/useEditableProjects';
 const perPageOptions = [
   { title: '10', value: 10 },
   { title: '20', value: 20 },
@@ -58,7 +59,9 @@ const DashboardActionsCell = React.memo(
     emptyActions: any[];
   }) => {
     const { t } = useTranslation(process.env.I18N_NAMESPACE);
-    const { canEdit, loading } = usePersesEditPermissions(project);
+
+    const { permissionsLoading } = useEditableProjects();
+    const { canEdit } = usePersesEditPermissions(project);
     const disabled = !canEdit;
 
     const rowSpecificActions = useMemo(
@@ -79,7 +82,7 @@ const DashboardActionsCell = React.memo(
       [dashboard, onRename, onDuplicate, onDelete, t],
     );
 
-    if (disabled || loading) {
+    if (disabled) {
       return (
         <Tooltip content={t("You don't have permissions for dashboard actions")}>
           <div>
@@ -88,6 +91,15 @@ const DashboardActionsCell = React.memo(
         </Tooltip>
       );
     }
+    if (permissionsLoading) {
+      return (
+        <Tooltip content={t('Permissions are loading')}>
+          <div>
+            <ActionsColumn items={emptyActions} isDisabled={true} />
+          </div>
+        </Tooltip>
+      );
+    }
 
     return <ActionsColumn items={rowSpecificActions} isDisabled={false} />;
   },