Changed wrong button structure un buckets list page (#2218)

Also fixed issue with tests part 3 workflow

Signed-off-by: Benjamin Perez <benjamin@bexsoft.net>

portal-ui/src/screens/Console/Buckets/ListBuckets/BucketListItem.tsx

@@ -33,7 +33,7 @@ import {
   prettyNumber,
 } from "../../../../common/utils";
 import CheckboxWrapper from "../../Common/FormComponents/CheckboxWrapper/CheckboxWrapper";
-import { Link } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import {
   IAM_PERMISSIONS,
   IAM_ROLES,
@@ -174,6 +174,8 @@ const BucketListItem = ({
   bulkSelect,
   noManage = false,
 }: IBucketListItem) => {
+  const navigate = useNavigate();
+
   const usage = niceBytes(`${bucket.size}` || "0");
   const usageScalar = usage.split(" ")[0];
   const usageUnit = usage.split(" ")[1];
@@ -243,34 +245,26 @@ const BucketListItem = ({
                 scopes={IAM_PERMISSIONS[IAM_ROLES.BUCKET_ADMIN]}
                 resource={bucket.name}
               >
-                <Link
-                  to={`/buckets/${bucket.name}/admin`}
-                  style={{ textDecoration: "none" }}
-                >
-                  <RBIconButton
-                    tooltip={"Manage"}
-                    onClick={() => {}}
-                    text={"Manage"}
-                    icon={<SettingsIcon />}
-                    color={"primary"}
-                    variant={"outlined"}
-                  />
-                </Link>
+                <RBIconButton
+                  tooltip={"Manage"}
+                  onClick={() => navigate(`/buckets/${bucket.name}/admin`)}
+                  text={"Manage"}
+                  icon={<SettingsIcon />}
+                  color={"primary"}
+                  variant={"outlined"}
+                  id={`manage-${bucket.name}`}
+                />
               </SecureComponent>
             )}
-            <Link
-              to={`/buckets/${bucket.name}/browse`}
-              style={{ textDecoration: "none" }}
-            >
-              <RBIconButton
-                tooltip={"Browse"}
-                onClick={() => {}}
-                text={"Browse"}
-                icon={<ArrowRightIcon />}
-                color={"primary"}
-                variant={"contained"}
-              />
-            </Link>
+            <RBIconButton
+              tooltip={"Browse"}
+              onClick={() => navigate(`/buckets/${bucket.name}/browse`)}
+              text={"Browse"}
+              icon={<ArrowRightIcon />}
+              color={"primary"}
+              variant={"contained"}
+              id={`browse-${bucket.name}`}
+            />
             <Box display={{ xs: "none", sm: "block" }}>
               <div style={{ marginBottom: 10 }} />
             </Box>

portal-ui/tests/permissions-3/bucketRead.ts

@@ -76,11 +76,11 @@ test
 test
   .before(async (t) => {
     // Create a bucket
-    await functions.setUpBucket(t, "bucketread3");
+    await functions.setUpBucket(t, "aread3");
     await t
       .useRole(roles.admin)
       .navigateTo("http://localhost:9090/buckets")
-      .click(testBucketBrowseButtonFor("bucketread3"))
+      .click(testBucketBrowseButtonFor("aread3"))
       // Upload object to bucket
       .setFilesToUpload(elements.uploadInput, "../uploads/test.txt")
       .click(logoutItem);
@@ -90,12 +90,12 @@ test
       .useRole(roles.bucketRead)
       .navigateTo("http://localhost:9090/buckets")
       .wait(2000)
-      .click(testBucketBrowseButtonFor("bucketread3"))
+      .click(testBucketBrowseButtonFor("aread3"))
       .wait(2000)
       .expect(elements.table.exists)
       .ok();
   })
   .after(async (t) => {
     // Cleanup created bucket and corresponding uploads
-    await functions.cleanUpBucketAndUploads(t, "bucketread3");
+    await functions.cleanUpBucketAndUploads(t, "aread3");
   });

portal-ui/tests/utils/functions.ts

@@ -122,10 +122,8 @@ export const cleanUpBucket = (t, modifier) => {
 };
 
 export const namedTestBucketBrowseButtonFor = (name) => {
-  return Selector("h1")
-    .withText(name)
-    .parent(4)
-    .find("button:enabled")
+  return Selector("button:enabled")
+    .withAttribute("id", `browse-${name}`)
     .withText("Browse");
 };