From c7fdfdd035c47b0844d017ea8742768ed6158e68 Mon Sep 17 00:00:00 2001
From: jinapurapu <65002498+jinapurapu@users.noreply.github.com>
Date: Thu, 17 Mar 2022 12:30:30 -0700
Subject: [PATCH] Added download all credentials button, added tooltips,
 removed Done button, Updated test to use corner X instead of Done button
 (#1704)

---
 .../CredentialsPrompt/CredentialsPrompt.tsx   | 63 +++++++++++++------
 .../Common/ModalWrapper/ModalWrapper.tsx      |  1 +
 portal-ui/tests/operator/tenants.ts           |  4 +-
 3 files changed, 46 insertions(+), 22 deletions(-)

diff --git a/portal-ui/src/screens/Console/Common/CredentialsPrompt/CredentialsPrompt.tsx b/portal-ui/src/screens/Console/Common/CredentialsPrompt/CredentialsPrompt.tsx
index e83c9ad73..862c58b72 100644
--- a/portal-ui/src/screens/Console/Common/CredentialsPrompt/CredentialsPrompt.tsx
+++ b/portal-ui/src/screens/Console/Common/CredentialsPrompt/CredentialsPrompt.tsx
@@ -20,13 +20,14 @@ import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
 import { NewServiceAccount } from "./types";
-import { Button } from "@mui/material";
 import ModalWrapper from "../ModalWrapper/ModalWrapper";
 import Grid from "@mui/material/Grid";
 import CredentialItem from "./CredentialItem";
 import WarnIcon from "../../../../icons/WarnIcon";
 import { DownloadIcon, ServiceAccountCredentialsIcon } from "../../../../icons";
 
+import RBIconButton from "../../Buckets/BucketDetails/SummaryItems/RBIconButton";
+
 const styles = (theme: Theme) =>
   createStyles({
     warningBlock: {
@@ -164,7 +165,7 @@ const CredentialsPrompt = ({
             </div>
           ) : (
             <div className={classes.warningBlock}>
-              <WarnIcon />
+             <WarnIcon />
               <span>
                 Write these down, as this is the only time the secret will be
                 displayed.
@@ -173,21 +174,13 @@ const CredentialsPrompt = ({
           )}
         </Grid>
         <Grid item xs={12} className={classes.buttonContainer}>
-          <Button
-            id={"done-button"}
-            variant="outlined"
-            className={classes.buttonSpacer}
-            onClick={() => {
-              closeModal();
-            }}
-            color="primary"
-          >
-            Done
-          </Button>
-
-          {!idp && (
-            <Button
+         {!idp && (
+            <>
+            <RBIconButton
               id={"download-button"}
+              tooltip={"Download credentials in a JSON file formatted for import using mc alias import. This will only include the default login credentials."}
+              text={"Download for import"}
+              className={classes.buttonSpacer}
               onClick={() => {
                 let consoleExtras = {};
 
@@ -221,12 +214,42 @@ const CredentialsPrompt = ({
                   })
                 );
               }}
-              endIcon={<DownloadIcon />}
+              icon={<DownloadIcon />}
               variant="contained"
               color="primary"
-            >
-              Download
-            </Button>
+            />
+              
+
+            { (Array.isArray(consoleCreds)) && consoleCreds.length > 1 &&
+              <RBIconButton
+            id={"download-all-button"}
+            tooltip={"Download all access credentials to a JSON file. NOTE: This file is not formatted for import using mc alias import. If you plan to import this alias from the file, please use the Download for Import button. "}
+              text={"Download all access credentials"}
+            className={classes.buttonSpacer}
+            onClick={() => {
+              let allCredentials = {};
+              if (consoleCreds) {
+              const cCreds = consoleCreds.map((itemMap) => {
+                return {
+                  accessKey: itemMap.accessKey,
+                  secretKey: itemMap.secretKey,
+                };
+              });
+              allCredentials = cCreds;
+            }
+              download(
+                "all_credentials.json",
+                JSON.stringify({
+                  ...allCredentials,
+                })
+              );
+            }}
+            icon={<DownloadIcon />}
+            variant="contained"
+            color="primary"            
+            />
+              
+}</>
           )}
         </Grid>
       </Grid>
diff --git a/portal-ui/src/screens/Console/Common/ModalWrapper/ModalWrapper.tsx b/portal-ui/src/screens/Console/Common/ModalWrapper/ModalWrapper.tsx
index f3236dc81..1775e639d 100644
--- a/portal-ui/src/screens/Console/Common/ModalWrapper/ModalWrapper.tsx
+++ b/portal-ui/src/screens/Console/Common/ModalWrapper/ModalWrapper.tsx
@@ -134,6 +134,7 @@ const ModalWrapper = ({
         <div className={classes.closeContainer}>
           <IconButton
             aria-label="close"
+            id={"close"}
             className={classes.closeButton}
             onClick={onClose}
             disableRipple
diff --git a/portal-ui/tests/operator/tenants.ts b/portal-ui/tests/operator/tenants.ts
index 856cd5b5d..82a1ac148 100644
--- a/portal-ui/tests/operator/tenants.ts
+++ b/portal-ui/tests/operator/tenants.ts
@@ -33,7 +33,7 @@ test("Create Tenant and List Tenants", async (t) => {
     .wait(1000)
     .click("#wizard-button-Create")
     .wait(1000)
-    .click("#done-button")
+    .click("#close")
     .expect(Selector(`#list-tenant-${tenantName}`).exists)
     .ok();
 });
@@ -55,7 +55,7 @@ test("Create Tenant Without Audit Log", async (t) => {
     .click("#log-search-enabled")
     .click("#wizard-button-Create")
     .wait(1000)
-    .click("#done-button")
+    .click("#close")
     .expect(Selector(`#list-tenant-${tenantName}`).exists)
     .ok();
 });