From 1e341e8d3fe4b0b1403e007911f2a7d69e21a8ee Mon Sep 17 00:00:00 2001
From: JunggeunIm <junggeun.im@dslab.global>
Date: Tue, 1 Nov 2022 14:20:03 +0900
Subject: [PATCH] fix: Errors etc.

---
 .../components/Modal/LicenseRegisterModal.js  |  3 +-
 .../src/components/Train/SettingGpuOption.js  | 60 ++++++++++---------
 frontend_app/src/layouts/Admin.js             |  4 +-
 3 files changed, 36 insertions(+), 31 deletions(-)

diff --git a/frontend_app/src/components/Modal/LicenseRegisterModal.js b/frontend_app/src/components/Modal/LicenseRegisterModal.js
index 161530e9..7c20ce10 100644
--- a/frontend_app/src/components/Modal/LicenseRegisterModal.js
+++ b/frontend_app/src/components/Modal/LicenseRegisterModal.js
@@ -161,7 +161,6 @@ const LicenseRegisterModal = () => {
                 >
                   <InputBase
                     variant="outlined"
-                    margin="normal"
                     required
                     fullWidth
                     name="enterpriseKey"
@@ -220,7 +219,7 @@ const LicenseRegisterModal = () => {
                 <Link
                   target="_blank"
                   color="inherit"
-                  href="https://ds2.ai/buy-license/"
+                  to="https://ds2.ai/buy-license/"
                   style={{ color: "var(--secondary1)" }}
                 >
                   <u>{t("Buy License")}</u>
diff --git a/frontend_app/src/components/Train/SettingGpuOption.js b/frontend_app/src/components/Train/SettingGpuOption.js
index cb2031b5..dcb7f652 100644
--- a/frontend_app/src/components/Train/SettingGpuOption.js
+++ b/frontend_app/src/components/Train/SettingGpuOption.js
@@ -1,4 +1,4 @@
-import React, {useEffect, useState} from "react";
+import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import Button from "components/CustomButtons/Button";
@@ -8,11 +8,14 @@ import { Checkbox, Grid } from "@mui/material";
 import LagacySettingGpuOption from "./LegacySettingGpuOption";
 import ModalAddServer from "./ModalAddServer";
 import ModalDeleteServer from "./ModalDeleteServer";
-import {openErrorSnackbarRequestAction, setPlanModalOpenRequestAction} from "../../redux/reducers/messages";
+import {
+  openErrorSnackbarRequestAction,
+  setPlanModalOpenRequestAction,
+} from "../../redux/reducers/messages";
 import * as api from "../../controller/api";
-import {useDispatch, useSelector} from "react-redux";
-import {IS_ENTERPRISE} from "../../variables/common";
-import {checkIsValidKey} from "../Function/globalFunc";
+import { useDispatch, useSelector } from "react-redux";
+import { IS_ENTERPRISE } from "../../variables/common";
+import { checkIsValidKey } from "../Function/globalFunc";
 import LicenseRegisterModal from "../Modal/LicenseRegisterModal";
 
 const SettingGpuOption = ({
@@ -46,7 +49,6 @@ const SettingGpuOption = ({
   const [tokenValue, setTokenValue] = useState("");
   const [availableGpuListTotal, setAvailableGpuListTotal] = useState(gpuList);
 
-
   const submitAddServer = () => {
     console.log("hostValue", hostValue);
     console.log("tokenValue", tokenValue);
@@ -59,28 +61,33 @@ const SettingGpuOption = ({
       return;
     }
 
-    api.postAddServer({
-      ip: hostValue,
-      access_token: tokenValue,
-    }).then((res) => {
+    api
+      .postAddServer({
+        ip: hostValue,
+        access_token: tokenValue,
+      })
+      .then((res) => {
         if (res.data?.gpu_info) {
-          setAvailableGpuListTotal(Object.assign({}, availableGpuListTotal, {
-            [res.data.name]: res.data.gpu_info
-          }))
+          setAvailableGpuListTotal(
+            Object.assign({}, availableGpuListTotal, {
+              [res.data.name]: res.data.gpu_info,
+            })
+          );
           closeAddServerModal();
         } else {
-          dispatch(openErrorSnackbarRequestAction(t("Please check the connection.")));
+          dispatch(
+            openErrorSnackbarRequestAction(t("Please check the connection."))
+          );
         }
       });
-
   };
 
   const submitDelete = () => {
     console.log("selectedServer");
     console.log(selectedServer);
     api.deleteAddServer(selectedServer).then((res) => {
-        window.location.reload();
-      });
+      window.location.reload();
+    });
   };
 
   const openAddServerModal = () => {
@@ -182,8 +189,8 @@ const SettingGpuOption = ({
   //     />
   //   );
   // else
-    return (
-        <>
+  return (
+    <>
       <Grid sx={{ p: 1.5 }}>
         {serverDataList ? (
           <>
@@ -207,10 +214,11 @@ const SettingGpuOption = ({
                 let serverDict = availableGpuListTotal[serverName];
                 // let serverName = serverDict.name;
                 let isLocalServer = serverName === "localhost";
-                let isChecked = serverDict?.length === checkedDict[serverName]?.length;
+                let isChecked =
+                  serverDict?.length === checkedDict[serverName]?.length;
 
                 return (
-                  <Grid item xs={12}>
+                  <Grid item key={serverName} xs={12}>
                     <Grid container sx={{ mb: 1 }}>
                       <span
                         style={{
@@ -254,7 +262,7 @@ const SettingGpuOption = ({
                             : false;
 
                         return (
-                          <Grid container sx={{ mb: 0.5 }}>
+                          <Grid container key={serverName} sx={{ mb: 0.5 }}>
                             {isStatusZero && (
                               <Checkbox
                                 id={`gpu_${gpuId}_checkbox`}
@@ -272,9 +280,7 @@ const SettingGpuOption = ({
                                 }
                               />
                             )}
-                            <span style={{ fontSize: "15px" }}>
-                              {gpuName}
-                            </span>
+                            <span style={{ fontSize: "15px" }}>{gpuName}</span>
                           </Grid>
                         );
                       })}
@@ -304,8 +310,8 @@ const SettingGpuOption = ({
         )}
       </Grid>
       <LicenseRegisterModal />
-      </>
-    );
+    </>
+  );
 };
 
 export default SettingGpuOption;
diff --git a/frontend_app/src/layouts/Admin.js b/frontend_app/src/layouts/Admin.js
index 9fa48b11..878f9725 100644
--- a/frontend_app/src/layouts/Admin.js
+++ b/frontend_app/src/layouts/Admin.js
@@ -537,7 +537,7 @@ const Admin = ({ history, ...rest }) => {
         }}
       >
         <MySnackbar
-          variant={messages.category}
+          variant={messages.category ?? "success"}
           className={classes.margin}
           message={t(messages.message)}
         />
@@ -553,7 +553,7 @@ const Admin = ({ history, ...rest }) => {
       >
         <MySnackbarAction
           classFrom="sample"
-          variant={messages.category}
+          variant={messages.category ?? "success"}
           className={classes.margin}
           message={t(messages.message)}
         />