Fix UI to access Support tools if registered (#2624)

minio · Feb 2, 2023 · fba06cf · fba06cf
1 parent fecf484
commit fba06cf
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 44 deletions.
diff --git a/portal-ui/src/config.ts b/portal-ui/src/config.ts
@@ -38,3 +38,8 @@ export const getLogoVar = (): LogoVar => {
   }
   return logoVar;
 };
+
+export const registeredCluster = (): boolean => {
+  const plan = getLogoVar();
+  return plan === "standard" || plan === "enterprise";
+};
diff --git a/portal-ui/src/screens/Console/HealthInfo/HealthInfo.tsx b/portal-ui/src/screens/Console/HealthInfo/HealthInfo.tsx
@@ -54,6 +54,7 @@ import {
   healthInfoResetMessage,
 } from "./healthInfoSlice";
 import RegisterCluster from "../Support/RegisterCluster";
+import { registeredCluster } from "../../../config";
 
 const styles = (theme: Theme) =>
   createStyles({
@@ -102,12 +103,7 @@ const HealthInfo = ({ classes }: IHealthInfo) => {
 
   const message = useSelector((state: AppState) => state.healthInfo.message);
 
-  const licenseInfo = useSelector(
-    (state: AppState) => state?.system?.licenseInfo
-  );
-
-  const { plan = "" } = licenseInfo || {};
-  const registeredCluster = plan === "STANDARD" || plan === "ENTERPRISE";
+  const clusterRegistered = registeredCluster();
 
   const serverDiagnosticStatus = useSelector(
     (state: AppState) => state.system.serverDiagnosticStatus
@@ -256,7 +252,7 @@ const HealthInfo = ({ classes }: IHealthInfo) => {
   }, [startDiagnostic, dispatch]);
 
   const startDiagnosticAction = () => {
-    if (plan !== "STANDARD" && plan !== "ENTERPRISE") {
+    if (!clusterRegistered) {
       navigate("/support/register");
       return;
     }
@@ -267,7 +263,7 @@ const HealthInfo = ({ classes }: IHealthInfo) => {
     <Fragment>
       <PageHeader label="Health" />
       <PageLayout>
-        {!registeredCluster && <RegisterCluster compactMode />}
+        {!clusterRegistered && <RegisterCluster compactMode />}
         <Grid item xs={12} className={classes.boxy}>
           <TestWrapper title={title} advancedVisible={false}>
             <Grid container className={classes.buttons}>
@@ -305,7 +301,7 @@ const HealthInfo = ({ classes }: IHealthInfo) => {
                       <Button
                         id="start-new-diagnostic"
                         type="submit"
-                        variant={!registeredCluster ? "regular" : "callAction"}
+                        variant={!clusterRegistered ? "regular" : "callAction"}
                         disabled={startDiagnostic}
                         onClick={startDiagnosticAction}
                         label={buttonStartText}
@@ -317,7 +313,7 @@ const HealthInfo = ({ classes }: IHealthInfo) => {
             </Grid>
           </TestWrapper>
         </Grid>
-        {!startDiagnostic && registeredCluster && (
+        {!startDiagnostic && clusterRegistered && (
           <Fragment>
             <br />
             <HelpBox

diff --git a/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx b/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx
@@ -20,7 +20,6 @@ import { IMessageEvent, w3cwebsocket as W3CWebSocket } from "websocket";
 import { Grid } from "@mui/material";
 import { Theme } from "@mui/material/styles";
 import { useNavigate } from "react-router-dom";
-import { AppState } from "../../../store";
 import {
   Button,
   HelpBox,
@@ -54,6 +53,7 @@ import DistributedOnly from "../Common/DistributedOnly/DistributedOnly";
 import { selDistSet } from "../../../systemSlice";
 import makeStyles from "@mui/styles/makeStyles";
 import RegisterCluster from "../Support/RegisterCluster";
+import { registeredCluster } from "../../../config";
 
 const useStyles = makeStyles((theme: Theme) =>
   createStyles({
@@ -85,13 +85,8 @@ const useStyles = makeStyles((theme: Theme) =>
 
 const Speedtest = () => {
   const distributedSetup = useSelector(selDistSet);
-  const licenseInfo = useSelector(
-    (state: AppState) => state?.system?.licenseInfo
-  );
-  const navigate = useNavigate();
 
-  const { plan = "" } = licenseInfo || {};
-  const registeredCluster = plan === "STANDARD" || plan === "ENTERPRISE";
+  const navigate = useNavigate();
 
   const classes = useStyles();
   const [start, setStart] = useState<boolean>(false);
@@ -108,6 +103,7 @@ const Speedtest = () => {
   const [currentValue, setCurrentValue] = useState<number>(0);
   const [totalSeconds, setTotalSeconds] = useState<number>(0);
   const [speedometerValue, setSpeedometerValue] = useState<number>(0);
+  const clusterRegistered = registeredCluster();
 
   useEffect(() => {
     // begin watch if bucketName in bucketList and start pressed
@@ -199,7 +195,7 @@ const Speedtest = () => {
   const buttonLabel = start ? "Start" : stoppedLabel;
 
   const startSpeedtestButton = () => {
-    if (plan !== "STANDARD" && plan !== "ENTERPRISE") {
+    if (!clusterRegistered) {
       navigate("/support/register");
       return;
     }
@@ -212,7 +208,7 @@ const Speedtest = () => {
     <Fragment>
       <PageHeader label="Performance" />
       <PageLayout>
-        {!registeredCluster && <RegisterCluster compactMode />}
+        {!clusterRegistered && <RegisterCluster compactMode />}
         {!distributedSetup ? (
           <DistributedOnly
             iconComponent={<SpeedtestIcon />}
@@ -313,7 +309,7 @@ const Speedtest = () => {
                     type="button"
                     id={"start-speed-test"}
                     variant={
-                      registeredCluster && currStatus !== null && !start
+                      clusterRegistered && currStatus !== null && !start
                         ? "callAction"
                         : "regular"
                     }
@@ -340,7 +336,7 @@ const Speedtest = () => {
               </Grid>
             </Grid>
 
-            {!start && !currStatus && registeredCluster && (
+            {!start && !currStatus && clusterRegistered && (
               <Fragment>
                 <br />
                 <HelpBox

diff --git a/portal-ui/src/screens/Console/Support/Profile.tsx b/portal-ui/src/screens/Console/Support/Profile.tsx
@@ -13,10 +13,9 @@ import {
   containerForHeader,
   inlineCheckboxes,
 } from "../Common/FormComponents/common/styleLibrary";
-import { useSelector } from "react-redux";
-import { AppState } from "../../../store";
 import { useNavigate } from "react-router-dom";
 import RegisterCluster from "./RegisterCluster";
+import { registeredCluster } from "../../../config";
 
 const styles = (theme: Theme) =>
   createStyles({
@@ -60,14 +59,8 @@ interface IProfileProps {
 var c: any = null;
 
 const Profile = ({ classes }: IProfileProps) => {
-  const licenseInfo = useSelector(
-    (state: AppState) => state?.system?.licenseInfo
-  );
   const navigate = useNavigate();
 
-  const { plan = "" } = licenseInfo || {};
-  const registeredCluster = plan === "STANDARD" || plan === "ENTERPRISE";
-
   const [profilingStarted, setProfilingStarted] = useState<boolean>(false);
   const [types, setTypes] = useState<string[]>([
     "cpu",
@@ -76,7 +69,7 @@ const Profile = ({ classes }: IProfileProps) => {
     "mutex",
     "goroutines",
   ]);
-
+  const clusterRegistered = registeredCluster();
   const typesList = [
     { label: "cpu", value: "cpu" },
     { label: "mem", value: "mem" },
@@ -149,7 +142,7 @@ const Profile = ({ classes }: IProfileProps) => {
     <Fragment>
       <PageHeader label="Profile" />
       <PageLayout>
-        {!registeredCluster && <RegisterCluster compactMode />}
+        {!clusterRegistered && <RegisterCluster compactMode />}
         <Grid item xs={12} className={classes.boxy}>
           <Grid item xs={12} className={classes.dropdown}>
             <Grid
@@ -178,10 +171,10 @@ const Profile = ({ classes }: IProfileProps) => {
             <Button
               id={"start-profiling"}
               type="submit"
-              variant={registeredCluster ? "callAction" : "regular"}
+              variant={clusterRegistered ? "callAction" : "regular"}
               disabled={profilingStarted || types.length < 1}
               onClick={() => {
-                if (!registeredCluster) {
+                if (!clusterRegistered) {
                   navigate("/support/register");
                   return;
                 }

diff --git a/portal-ui/src/screens/Console/Tools/Inspect.tsx b/portal-ui/src/screens/Console/Tools/Inspect.tsx
@@ -45,8 +45,9 @@ import {
 import DistributedOnly from "../Common/DistributedOnly/DistributedOnly";
 import KeyRevealer from "./KeyRevealer";
 import { selDistSet, setErrorSnackMessage } from "../../../systemSlice";
-import { AppState, useAppDispatch } from "../../../store";
+import { useAppDispatch } from "../../../store";
 import RegisterCluster from "../Support/RegisterCluster";
+import { registeredCluster } from "../../../config";
 
 const styles = (theme: Theme) =>
   createStyles({
@@ -100,12 +101,6 @@ const Inspect = ({ classes }: { classes: any }) => {
   const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const distributedSetup = useSelector(selDistSet);
-  const licenseInfo = useSelector(
-    (state: AppState) => state?.system?.licenseInfo
-  );
-
-  const { plan = "" } = licenseInfo || {};
-  const registeredCluster = plan === "STANDARD" || plan === "ENTERPRISE";
 
   const [volumeName, setVolumeName] = useState<string>("");
   const [inspectPath, setInspectPath] = useState<string>("");
@@ -118,7 +113,7 @@ const Inspect = ({ classes }: { classes: any }) => {
   const [isFormValid, setIsFormValid] = useState<boolean>(false);
   const [volumeError, setVolumeError] = useState<string>("");
   const [pathError, setPathError] = useState<string>("");
-
+  const clusterRegistered = registeredCluster();
   /**
    * Validation Effect
    */
@@ -205,7 +200,7 @@ const Inspect = ({ classes }: { classes: any }) => {
     <Fragment>
       <PageHeader label={"Inspect"} />
       <PageLayout>
-        {!registeredCluster && <RegisterCluster compactMode />}
+        {!clusterRegistered && <RegisterCluster compactMode />}
         {!distributedSetup ? (
           <DistributedOnly
             iconComponent={<InspectMenuIcon />}
@@ -259,7 +254,7 @@ const Inspect = ({ classes }: { classes: any }) => {
                 autoComplete="off"
                 onSubmit={(e: React.FormEvent<HTMLFormElement>) => {
                   e.preventDefault();
-                  if (plan !== "STANDARD" && plan !== "ENTERPRISE") {
+                  if (!clusterRegistered) {
                     navigate("/support/register");
                     return;
                   }
@@ -349,7 +344,7 @@ const Inspect = ({ classes }: { classes: any }) => {
                   <Button
                     id={"inspect-start"}
                     type="submit"
-                    variant={!registeredCluster ? "regular" : "callAction"}
+                    variant={!clusterRegistered ? "regular" : "callAction"}
                     data-test-id="inspect-submit-button"
                     disabled={!isFormValid}
                     label={"Inspect"}