chore(deps): Upgrade maas-react-components to 2.0.0 (#5833)

Author: ndv99

package.json

@@ -46,7 +46,7 @@
     "build-storybook": "storybook build"
   },
   "dependencies": {
-    "@canonical/maas-react-components": "1.35.0",
+    "@canonical/maas-react-components": "2.0.0",
     "@canonical/macaroon-bakery": "1.3.2",
     "@canonical/react-components": "2.14.0",
     "@redux-devtools/extension": "3.3.0",
@@ -208,4 +208,4 @@
       "prefer-alphabetical-devDependencies": "error"
     }
   }
-}
+}

src/app/base/components/node/StorageTables/AvailableStorageTable/AvailableStorageTable.tsx

@@ -113,14 +113,22 @@ const AvailableStorageTable = ({
   return (
     <>
       <GenericTable
-        canSelect={isMachine ? (_) => !actionsDisabled : false}
         columns={columns}
         data={rows}
-        disabledSelectionTooltip={"This machine's disks cannot be modified."}
         isLoading={false}
         noData="No available disks or partitions."
-        rowSelection={rowSelection}
-        setRowSelection={setRowSelection}
+        selection={
+          isMachine
+            ? {
+                rowSelection,
+                setRowSelection,
+                filterSelectable: (_) => !actionsDisabled,
+                disabledSelectionTooltip:
+                  "This machine's disks cannot be modified.",
+                rowSelectionLabelKey: "name",
+              }
+            : undefined
+        }
         variant="regular"
       />
       {isMachine && canEditStorage && (

src/app/base/components/node/networking/NetworkTable/NetworkTable.test.tsx

@@ -325,9 +325,10 @@ describe("NetworkTable", () => {
         />,
         { state }
       );
-      const rows = screen.getAllByRole("row");
-      const bondRow = rows[1];
-      await userEvent.click(within(bondRow).getByRole("checkbox"));
+
+      await userEvent.click(
+        screen.getByRole("checkbox", { name: "select bond0" })
+      );
       expect(setSelected).toHaveBeenCalledWith([{ linkId: null, nicId: 100 }]);
     });
 

src/app/base/components/node/networking/NetworkTable/NetworkTable.tsx

@@ -266,20 +266,23 @@ const NetworkTable = ({
 
   return (
     <GenericTable
-      canSelect={(_) => !isAllNetworkingDisabled}
       className={classNames("p-table-expanding--light", "network-table", {
         "network-table--has-actions": hasActions,
       })}
       columns={columns}
       data={data}
-      disabledSelectionTooltip={"Network can't be modified for this machine."}
       filterCells={!!setExpanded ? filterCells : filterCellsAndAction}
       filterHeaders={!!setExpanded ? filterHeaders : filterHeadersAndAction}
       getSubRows={(originalRow) => originalRow.children}
       isLoading={!fabricsLoaded || !vlansLoaded}
       noData={"No interfaces available."}
-      rowSelection={rowSelection}
-      setRowSelection={setRowSelection}
+      selection={{
+        rowSelection,
+        setRowSelection,
+        filterSelectable: (_) => !isAllNetworkingDisabled,
+        disabledSelectionTooltip: "Network can't be modified for this machine.",
+        rowSelectionLabelKey: "name",
+      }}
       sorting={[{ id: "name", desc: false }]}
     />
   );

src/app/controllers/views/ControllerList/components/ControllersTable/ControllersTable.tsx

@@ -46,14 +46,16 @@ const ControllersTable = ({
   return (
     <GenericTable
       aria-label="controllers list"
-      canSelect
       className="controllers-table"
       columns={columns}
       data={controllers}
       isLoading={isPending}
       noData="No controllers available."
-      rowSelection={rowSelection}
-      setRowSelection={setRowSelection}
+      selection={{
+        rowSelection,
+        setRowSelection,
+        rowSelectionLabelKey: "fqdn",
+      }}
       sorting={[{ id: "fqdn", desc: false }]}
       variant="regular"
     />

src/app/devices/components/DevicesTable/DevicesTable.tsx

@@ -51,16 +51,18 @@ const DevicesTable = ({
 
   return (
     <GenericTable
-      canSelect
       className="devices-table"
       columns={columns}
       data={devices.map(
         (device): DeviceRow => ({ ...device, zone: device.zone.name })
       )}
       isLoading={devicesLoading}
       noData="No devices available."
-      rowSelection={rowSelection}
-      setRowSelection={setRowSelection}
+      selection={{
+        rowSelection,
+        setRowSelection,
+        rowSelectionLabelKey: "fqdn",
+      }}
       sorting={[{ id: "fqdn", desc: false }]}
     />
   );

src/app/images/components/ImagesTable/ImagesTable.tsx

@@ -62,7 +62,6 @@ const ImagesTable = ({
 
   return (
     <GenericTable
-      canSelect
       columns={columns}
       data={images}
       filterCells={filterCells}
@@ -78,8 +77,11 @@ const ImagesTable = ({
         { value: "Ubuntu", isTop: true },
         { value: "Other", isTop: false },
       ]}
-      rowSelection={selectedRows}
-      setRowSelection={setSelectedRows}
+      selection={{
+        rowSelection: selectedRows,
+        setRowSelection: setSelectedRows,
+        rowSelectionLabelKey: "release",
+      }}
       showChevron
       sorting={[{ id: "release", desc: true }]}
       variant={variant}

src/app/racks/components/RemoveControllers/RemoveControllers.tsx

@@ -79,14 +79,16 @@ const RemoveControllers = ({ id }: RemoveControllersProps) => {
       to re-register the controllers to revert this action.
       {fakeControllers && (
         <GenericTable
-          canSelect
           className="u-border u-margin-top--medium"
           columns={column}
           data={fakeControllers}
           isLoading={rack.isPending}
-          rowSelection={rowSelection}
-          setRowSelection={setRowSelection}
-        ></GenericTable>
+          selection={{
+            rowSelection,
+            setRowSelection,
+            rowSelectionLabelKey: "fqdn",
+          }}
+        />
       )}
     </FormikForm>
   );

yarn.lock

@@ -949,10 +949,10 @@
     "@types/tough-cookie" "^4.0.5"
     tough-cookie "^4.1.4"
 
-"@canonical/maas-react-components@1.35.0":
-  version "1.35.0"
-  resolved "https://registry.yarnpkg.com/@canonical/maas-react-components/-/maas-react-components-1.35.0.tgz#ddc4df191ae7421fcd196d45c98c47c4652ac781"
-  integrity sha512-qrlk0ZfCYjyCKD5ulGVgb2h/a7M9aTvD6e4FYWXCsteQzHCsH7kcK4xI5z1f1Q4eBCLUH0LJOv5mROUNk2cZmQ==
+"@canonical/maas-react-components@2.0.0":
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/@canonical/maas-react-components/-/maas-react-components-2.0.0.tgz#22d5a2c275f8911a3ea58d268a99447b18892040"
+  integrity sha512-r2d77B8+HYhwcXj9fftKt8zUA3rTNA9FKxG23cA+Cp6HCeSs0c+gb4A8sEy17Z0wvPp67v7GTjnOAfdb5wOo3g==
 
 "@canonical/macaroon-bakery@1.3.2":
   version "1.3.2"