fix: misc fixes

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

Hide file tree

Showing 30 changed files with 384 additions and 324 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)
@@ -21,14 +24,8 @@ export const createIdpGroup = (group: Partial<IdpGroup>): Promise<void> => {
   return new Promise((resolve, reject) => {
     fetch(`/1.0/auth/identity-provider-groups`, {
       method: "POST",
-      body: JSON.stringify({ name: group.name }),
+      body: JSON.stringify({ name: group.name, groups: group.groups }),
     })
-      .then(() =>
-        fetch(`/1.0/auth/identity-provider-groups/${group.name}`, {
-          method: "PUT",
-          body: JSON.stringify(group),
-        }),
-      )
       .then(handleResponse)
       .then(resolve)
       .catch(reject);

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}
         />
@@ -275,14 +275,14 @@ const PermissionGroups: FC = () => {
               )}
               {selectedGroupNames.length > 0 && !panelParams.panel && (
                 <>
-                  <BulkDeleteGroupsBtn
+                  <EditGroupIdentitiesBtn
                     groups={selectedGroups}
                     className="u-no-margin--bottom"
-                    onDelete={() => setSelectedGroupNames([])}
                   />
-                  <EditGroupIdentitiesBtn
+                  <BulkDeleteGroupsBtn
                     groups={selectedGroups}
                     className="u-no-margin--bottom"
+                    onDelete={() => setSelectedGroupNames([])}
                   />
                 </>
               )}

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 = `Assigned ${groupsText}:\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",
@@ -265,7 +279,7 @@ const PermissionIdentities: FC = () => {
               {!!selectedIdentityIds.length && hasAccessManagementTLS && (
                 <BulkDeleteIdentitiesBtn
                   identities={selectedIdentities}
-                  className="u-no-margin--bottom"
+                  className="u-no-margin--bottom has-icon"
                 />
               )}
             </PageHeader.Left>
@@ -302,7 +316,7 @@ const PermissionIdentities: FC = () => {
                 parentName=""
                 selectedNames={selectedIdentityIds}
                 setSelectedNames={setSelectedIdentityIds}
-                processingNames={[]}
+                disabledNames={[]}
                 filteredNames={fineGrainedIdentities.map(
                   (identity) => identity.id,
                 )}