From 1842caff0fb497ce2ccd207704db041a2d890ec1 Mon Sep 17 00:00:00 2001
From: Daniel Valdivia <18384552+dvaldivia@users.noreply.github.com>
Date: Tue, 25 Jan 2022 11:49:39 -0800
Subject: [PATCH] Fix secure component having multiple childs (#1455)

Signed-off-by: Daniel Valdivia <18384552+dvaldivia@users.noreply.github.com>
---
 .../Objects/ListObjects/ListObjects.tsx       | 58 ++++++++++---------
 .../Buckets/ListBuckets/UploadFilesButton.tsx |  2 +-
 portal-ui/tests/permissions/bucketRead.ts     |  8 +--
 3 files changed, 35 insertions(+), 33 deletions(-)

diff --git a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx
index 51a1bc165..3f5429e19 100644
--- a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx
+++ b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx
@@ -1158,35 +1158,37 @@ const ListObjects = ({
                   scopes={[IAM_SCOPES.S3_PUT_OBJECT]}
                   errorProps={{ disabled: true }}
                 >
-                  <UploadFilesButton
-                    uploadFileFunction={(closeMenu) => {
-                      if (fileUpload && fileUpload.current) {
-                        fileUpload.current.click();
-                      }
-                      closeMenu();
-                    }}
-                    uploadFolderFunction={(closeMenu) => {
-                      if (folderUpload && folderUpload.current) {
-                        folderUpload.current.click();
-                      }
-                      closeMenu();
-                    }}
-                  />
+                  <Fragment>
+                    <UploadFilesButton
+                      uploadFileFunction={(closeMenu) => {
+                        if (fileUpload && fileUpload.current) {
+                          fileUpload.current.click();
+                        }
+                        closeMenu();
+                      }}
+                      uploadFolderFunction={(closeMenu) => {
+                        if (folderUpload && folderUpload.current) {
+                          folderUpload.current.click();
+                        }
+                        closeMenu();
+                      }}
+                    />
 
-                  <input
-                    type="file"
-                    multiple
-                    onChange={handleUploadButton}
-                    style={{ display: "none" }}
-                    ref={fileUpload}
-                  />
-                  <input
-                    type="file"
-                    multiple
-                    onChange={handleUploadButton}
-                    style={{ display: "none" }}
-                    ref={folderUpload}
-                  />
+                    <input
+                      type="file"
+                      multiple
+                      onChange={handleUploadButton}
+                      style={{ display: "none" }}
+                      ref={fileUpload}
+                    />
+                    <input
+                      type="file"
+                      multiple
+                      onChange={handleUploadButton}
+                      style={{ display: "none" }}
+                      ref={folderUpload}
+                    />
+                  </Fragment>
                 </SecureComponent>
               </Fragment>
             }
diff --git a/portal-ui/src/screens/Console/Buckets/ListBuckets/UploadFilesButton.tsx b/portal-ui/src/screens/Console/Buckets/ListBuckets/UploadFilesButton.tsx
index 549f66525..35af2c3c7 100644
--- a/portal-ui/src/screens/Console/Buckets/ListBuckets/UploadFilesButton.tsx
+++ b/portal-ui/src/screens/Console/Buckets/ListBuckets/UploadFilesButton.tsx
@@ -36,7 +36,7 @@ const styles = (theme: Theme) =>
     listUploadIcons: {
       "& .min-icon": {
         width: 18,
-        fill: "rgba(0,0,0,0.87)"
+        fill: "rgba(0,0,0,0.87)",
       },
     },
   });
diff --git a/portal-ui/tests/permissions/bucketRead.ts b/portal-ui/tests/permissions/bucketRead.ts
index 0b626b703..31a1f2ce2 100644
--- a/portal-ui/tests/permissions/bucketRead.ts
+++ b/portal-ui/tests/permissions/bucketRead.ts
@@ -85,12 +85,12 @@ test
       .setFilesToUpload(elements.uploadInput, "../uploads/test.txt")
       .click(logoutItem);
   })("Object list table is enabled", async (t) => {
-    const bucketsTableExists = elements.table.exists;
-    const testBucketBrowseButton = testBucketBrowseButtonFor("bucketread3");
+    await new Promise((resolve) => setTimeout(resolve, 2000));
     await t
       .useRole(roles.bucketRead)
-      .click(testBucketBrowseButton)
-      .expect(bucketsTableExists)
+      .navigateTo("http://localhost:9090/buckets")
+      .click(testBucketBrowseButtonFor("bucketread3"))
+      .expect(elements.table.exists)
       .ok();
   })
   .after(async (t) => {