fix: misc fixes

Signed-off-by: Mason Hu <[email protected]>
canonical · Feb 21, 2025 · 24de60b · 24de60b
1 parent 1db147f
commit 24de60b
Show file tree

Hide file tree

Showing 27 changed files with 170 additions and 109 deletions.
diff --git a/src/api/auth-groups.tsx b/src/api/auth-groups.tsx
@@ -3,12 +3,12 @@ import type { LxdApiResponse } from "types/apiResponse";
 import type { LxdGroup } from "types/permissions";
 import { withEntitlementsQuery } from "util/entitlements/api";
 
-export const groupEntitlements = ["can_edit", "can_delete"];
+export const groupEntitlements = ["can_delete", "can_edit"];
 
 export const fetchGroups = (
   isFineGrained: boolean | null,
 ): Promise<LxdGroup[]> => {
-  const entitlements = `&${withEntitlementsQuery(isFineGrained, groupEntitlements)}`;
+  const entitlements = withEntitlementsQuery(isFineGrained, groupEntitlements);
   return new Promise((resolve, reject) => {
     fetch(`/1.0/auth/groups?recursion=1${entitlements}`)
       .then(handleResponse)

diff --git a/src/api/auth-identities.tsx b/src/api/auth-identities.tsx
@@ -3,12 +3,15 @@ import type { LxdApiResponse } from "types/apiResponse";
 import type { LxdIdentity, TlsIdentityTokenDetail } from "types/permissions";
 import { withEntitlementsQuery } from "util/entitlements/api";
 
-export const identitiesEntitlements = ["can_edit", "can_delete"];
+export const identitiesEntitlements = ["can_delete", "can_edit"];
 
 export const fetchIdentities = (
   isFineGrained: boolean | null,
 ): Promise<LxdIdentity[]> => {
-  const entitlements = `&${withEntitlementsQuery(isFineGrained, identitiesEntitlements)}`;
+  const entitlements = withEntitlementsQuery(
+    isFineGrained,
+    identitiesEntitlements,
+  );
   return new Promise((resolve, reject) => {
     fetch(`/1.0/auth/identities?recursion=1${entitlements}`)
       .then(handleResponse)
@@ -31,7 +34,10 @@ export const fetchIdentity = (
   authMethod: string,
   isFineGrained: boolean | null,
 ): Promise<LxdIdentity> => {
-  const entitlements = `&${withEntitlementsQuery(isFineGrained, identitiesEntitlements)}`;
+  const entitlements = withEntitlementsQuery(
+    isFineGrained,
+    identitiesEntitlements,
+  );
   return new Promise((resolve, reject) => {
     fetch(`/1.0/auth/identities/${authMethod}/${id}?recursion=1${entitlements}`)
       .then(handleResponse)

diff --git a/src/api/auth-idp-groups.tsx b/src/api/auth-idp-groups.tsx
@@ -3,12 +3,15 @@ import type { LxdApiResponse } from "types/apiResponse";
 import type { IdpGroup } from "types/permissions";
 import { withEntitlementsQuery } from "util/entitlements/api";
 
-const idpGroupEntitlements = ["can_edit", "can_delete"];
+const idpGroupEntitlements = ["can_delete", "can_edit"];
 
 export const fetchIdpGroups = (
   isFineGrained: boolean | null,
 ): Promise<IdpGroup[]> => {
-  const entitlements = `&${withEntitlementsQuery(isFineGrained, idpGroupEntitlements)}`;
+  const entitlements = withEntitlementsQuery(
+    isFineGrained,
+    idpGroupEntitlements,
+  );
   return new Promise((resolve, reject) => {
     fetch(`/1.0/auth/identity-provider-groups?recursion=1${entitlements}`)
       .then(handleResponse)

diff --git a/src/components/SelectableMainTable.tsx b/src/components/SelectableMainTable.tsx
@@ -19,14 +19,14 @@ interface SelectableMainTableProps {
   parentName: string;
   selectedNames: string[];
   setSelectedNames: (val: string[], isUnselectAll?: boolean) => void;
-  processingNames: string[];
+  disabledNames: string[];
   rows: MainTableRow[];
   indeterminateNames?: string[];
   disableSelect?: boolean;
   onToggleRow?: (rowName: string) => void;
   hideContextualMenu?: boolean;
   defaultSortKey?: string;
-  disableHeaderCheckbox?: boolean;
+  disableSelectAll?: boolean;
 }
 
 type Props = SelectableMainTableProps & MainTableProps;
@@ -37,15 +37,15 @@ const SelectableMainTable: FC<Props> = ({
   parentName,
   selectedNames,
   setSelectedNames,
-  processingNames,
+  disabledNames,
   rows,
   headers,
   indeterminateNames = [],
   disableSelect = false,
   onToggleRow,
   hideContextualMenu,
   defaultSortKey,
-  disableHeaderCheckbox,
+  disableSelectAll,
   ...props
 }: Props) => {
   const [currentSelectedIndex, setCurrentSelectedIndex] = useState<number>();
@@ -93,7 +93,7 @@ const SelectableMainTable: FC<Props> = ({
             checked={isAllSelected}
             indeterminate={isSomeSelected && !isAllSelected}
             onChange={isSomeSelected ? selectNone : selectPage}
-            disabled={disableSelect || disableHeaderCheckbox}
+            disabled={disableSelect || disableSelectAll}
           />
           {!hideContextualMenu && (
             <ContextualMenu
@@ -130,11 +130,11 @@ const SelectableMainTable: FC<Props> = ({
   ];
 
   const selectedNamesLookup = new Set(selectedNames);
-  const processingNamesLookup = new Set(processingNames);
+  const disabledNamesLookup = new Set(disabledNames);
   const indeterminateNamesLookup = new Set(indeterminateNames);
   const rowsWithCheckbox = rows.map((row, rowIndex) => {
     const isRowSelected = selectedNamesLookup.has(row.name ?? "");
-    const isRowProcessing = processingNamesLookup.has(row.name ?? "");
+    const isRowDisabled = disabledNamesLookup.has(row.name ?? "");
     const isRowIndeterminate = indeterminateNamesLookup.has(row.name ?? "");
 
     const toggleRow = (event: PointerEvent<HTMLInputElement>) => {
@@ -185,7 +185,7 @@ const SelectableMainTable: FC<Props> = ({
             labelClassName="u-no-margin--bottom"
             checked={isRowSelected}
             onChange={toggleRow}
-            disabled={isRowProcessing || !row.name || disableSelect}
+            disabled={isRowDisabled || !row.name || disableSelect}
             indeterminate={isRowIndeterminate && !isRowSelected}
           />
         ),
@@ -197,7 +197,7 @@ const SelectableMainTable: FC<Props> = ({
 
     const className = classnames(row.className, {
       "selected-row": isRowSelected,
-      "processing-row": isRowProcessing,
+      "disabled-row": isRowDisabled,
     });
 
     const key = row.key ?? row.name;

diff --git a/src/context/useIdentities.tsx b/src/context/useIdentities.tsx
@@ -21,7 +21,7 @@ export const useIdentity = (
 ): UseQueryResult<LxdIdentity> => {
   const { isFineGrained } = useAuth();
   return useQuery({
-    queryKey: [queryKeys.identities, id],
+    queryKey: [queryKeys.identities, authMethod, id],
     queryFn: () => fetchIdentity(id, authMethod, isFineGrained),
     enabled: (enabled ?? true) && isFineGrained !== null,
   });

diff --git a/src/pages/cluster/ClusterGroupForm.tsx b/src/pages/cluster/ClusterGroupForm.tsx
@@ -170,7 +170,7 @@ const ClusterGroupForm: FC<Props> = ({ group }) => {
               setSelectedNames={(newMembers: string[]) =>
                 void formik.setFieldValue("members", newMembers)
               }
-              processingNames={[]}
+              disabledNames={[]}
             />
           </Col>
         </Row>

diff --git a/src/pages/images/ImageList.tsx b/src/pages/images/ImageList.tsx
@@ -288,7 +288,7 @@ const ImageList: FC = () => {
                 itemName="image"
                 parentName="project"
                 filteredNames={filteredImages.map((item) => item.fingerprint)}
-                processingNames={processingNames}
+                disabledNames={processingNames}
                 rows={[]}
                 disableSelect={!deletableImages.length}
               />

diff --git a/src/pages/instances/InstanceList.tsx b/src/pages/instances/InstanceList.tsx
@@ -699,7 +699,7 @@ const InstanceList: FC = () => {
                       parentName="project"
                       selectedNames={selectedNames}
                       setSelectedNames={setSelectedNames}
-                      processingNames={processingNames}
+                      disabledNames={processingNames}
                       filteredNames={filteredInstances.map(
                         (instance) => instance.name,
                       )}
@@ -716,7 +716,7 @@ const InstanceList: FC = () => {
                     parentName="project"
                     selectedNames={selectedNames}
                     setSelectedNames={setSelectedNames}
-                    processingNames={processingNames}
+                    disabledNames={processingNames}
                     filteredNames={filteredInstances.map(
                       (instance) => instance.name,
                     )}

diff --git a/src/pages/instances/InstanceSnapshots.tsx b/src/pages/instances/InstanceSnapshots.tsx
@@ -278,7 +278,7 @@ const InstanceSnapshots = (props: Props) => {
                 parentName="instance"
                 selectedNames={selectedNames}
                 setSelectedNames={setSelectedNames}
-                processingNames={processingNames}
+                disabledNames={processingNames}
                 filteredNames={filteredSnapshots.map(
                   (snapshot) => snapshot.name,
                 )}

diff --git a/src/pages/permissions/PermissionGroups.tsx b/src/pages/permissions/PermissionGroups.tsx
@@ -209,7 +209,7 @@ const PermissionGroups: FC = () => {
           parentName=""
           selectedNames={selectedGroupNames}
           setSelectedNames={setSelectedGroupNames}
-          processingNames={[]}
+          disabledNames={[]}
           filteredNames={filteredGroups.map((item) => item.name)}
           disableSelect={!!panelParams.panel}
         />

diff --git a/src/pages/permissions/PermissionIdentities.tsx b/src/pages/permissions/PermissionIdentities.tsx
@@ -35,6 +35,7 @@ import IdentityResource from "components/IdentityResource";
 import CreateTlsIdentityBtn from "./CreateTlsIdentityBtn";
 import { useIdentities } from "context/useIdentities";
 import { useIdentityEntitlements } from "util/entitlements/identities";
+import { pluralize } from "util/instanceBulkActions";
 
 const PermissionIdentities: FC = () => {
   const notify = useNotify();
@@ -113,6 +114,25 @@ const PermissionIdentities: FC = () => {
       setSelectedIdentityIds([identity.id]);
     };
 
+    const getGroupLink = () => {
+      if (canEditIdentity(identity)) {
+        return (
+          <Button appearance="link" dense onClick={openGroupPanelForIdentity}>
+            {identity.groups?.length || 0}
+          </Button>
+        );
+      }
+
+      const groupsText = pluralize("group", identity.groups?.length ?? 0);
+      const groupsList = identity.groups?.join("\n- ");
+      const groupsTitle = `This identity has the following ${groupsText} allocated:\n- ${groupsList}`;
+      return (
+        <div title={identity.groups?.length ? groupsTitle : ""}>
+          {identity.groups?.length || 0}
+        </div>
+      );
+    };
+
     return {
       key: identity.id,
       name: isUnrestricted(identity) ? "" : identity.id,
@@ -149,13 +169,7 @@ const PermissionIdentities: FC = () => {
           className: "u-truncate",
         },
         {
-          content: canEditIdentity(identity) ? (
-            <Button appearance="link" dense onClick={openGroupPanelForIdentity}>
-              {identity.groups?.length || 0}
-            </Button>
-          ) : (
-            identity.groups?.length || 0
-          ),
+          content: getGroupLink(),
           role: "cell",
           className: "u-align--right group-count",
           "aria-label": "Groups for this identity",
@@ -302,7 +316,7 @@ const PermissionIdentities: FC = () => {
                 parentName=""
                 selectedNames={selectedIdentityIds}
                 setSelectedNames={setSelectedIdentityIds}
-                processingNames={[]}
+                disabledNames={[]}
                 filteredNames={fineGrainedIdentities.map(
                   (identity) => identity.id,
                 )}

diff --git a/src/pages/permissions/PermissionIdpGroups.tsx b/src/pages/permissions/PermissionIdpGroups.tsx
@@ -41,7 +41,7 @@ const PermissionIdpGroups: FC = () => {
   const { data: settings } = useSettings();
   const hasCustomClaim = settings?.config?.["oidc.groups.claim"];
   const { canCreateIdpGroups } = useServerEntitlements();
-  const { canEditGroup } = useIdpGroupEntitlements();
+  const { canEditIdpGroup } = useIdpGroupEntitlements();
 
   if (error) {
     notify.failure("Loading provider groups failed", error);
@@ -94,7 +94,7 @@ const PermissionIdpGroups: FC = () => {
           title: idpGroup.name,
         },
         {
-          content: canEditGroup(idpGroup) ? (
+          content: canEditIdpGroup(idpGroup) ? (
             <Button
               appearance="link"
               dense
@@ -125,11 +125,11 @@ const PermissionIdpGroups: FC = () => {
                   type="button"
                   aria-label="Edit IDP group details"
                   title={
-                    canEditGroup(idpGroup)
+                    canEditIdpGroup(idpGroup)
                       ? "Edit details"
-                      : "You do not have permission to edit this IDP group"
+                      : "You do not have permission to modify this IDP group"
                   }
-                  disabled={!canEditGroup(idpGroup)}
+                  disabled={!canEditIdpGroup(idpGroup)}
                 >
                   <Icon name="edit" />
                 </Button>,
@@ -232,7 +232,7 @@ const PermissionIdpGroups: FC = () => {
             parentName=""
             selectedNames={selectedGroupNames}
             setSelectedNames={setSelectedGroupNames}
-            processingNames={[]}
+            disabledNames={[]}
             filteredNames={filteredGroups.map((item) => item.name)}
             disableSelect={!!panelParams.panel}
           />

diff --git a/src/pages/permissions/actions/BulkDeleteIdentitiesBtn.tsx b/src/pages/permissions/actions/BulkDeleteIdentitiesBtn.tsx
@@ -82,13 +82,17 @@ const BulkDeleteIdentitiesBtn: FC<Props & ButtonProps> = ({
                 <li key={identity.name}>{identity.name}</li>
               ))}
             </ul>
-            You do not have permission to delete the following{" "}
-            {pluralize("identity", deletableIdentities.length)}:
-            <ul>
-              {restrictedIdentities.map((identity) => (
-                <li key={identity.name}>{identity.name}</li>
-              ))}
-            </ul>
+            {restrictedIdentities.length ? (
+              <>
+                You do not have permission to delete the following{" "}
+                {pluralize("identity", restrictedIdentities.length)}:
+                <ul>
+                  {restrictedIdentities.map((identity) => (
+                    <li key={identity.name}>{identity.name}</li>
+                  ))}
+                </ul>
+              </>
+            ) : null}
             This action cannot be undone, and can result in data loss.
           </p>
         ),

diff --git a/src/pages/permissions/actions/BulkDeleteIdpGroupsBtn.tsx b/src/pages/permissions/actions/BulkDeleteIdpGroupsBtn.tsx
@@ -12,8 +12,8 @@ interface Props {
 
 const BulkDeleteIdpGroupsBtn: FC<Props> = ({ idpGroups, className }) => {
   const [confirming, setConfirming] = useState(false);
-  const { canDeleteGroup } = useIdpGroupEntitlements();
-  const deletableGroups = idpGroups.filter(canDeleteGroup);
+  const { canEditIdpGroup } = useIdpGroupEntitlements();
+  const deletableGroups = idpGroups.filter(canEditIdpGroup);
 
   const handleConfirmDelete = () => {
     setConfirming(true);