From 9444dadc16f6f92ae504ba0e7e9819203f5f4a13 Mon Sep 17 00:00:00 2001 From: Alex <33497058+bexsoft@users.noreply.github.com> Date: Fri, 10 Dec 2021 12:47:54 -0600 Subject: [PATCH] Created DistributedOnly component & implemented for Heal & Speedtest pages (#1313) Signed-off-by: Benjamin Perez Co-authored-by: Benjamin Perez --- .../DistributedOnly/DistributedOnly.tsx | 59 +++ portal-ui/src/screens/Console/Heal/Heal.tsx | 255 ++++++------ .../screens/Console/Speedtest/Speedtest.tsx | 382 ++++++++---------- 3 files changed, 363 insertions(+), 333 deletions(-) create mode 100644 portal-ui/src/screens/Console/Common/DistributedOnly/DistributedOnly.tsx diff --git a/portal-ui/src/screens/Console/Common/DistributedOnly/DistributedOnly.tsx b/portal-ui/src/screens/Console/Common/DistributedOnly/DistributedOnly.tsx new file mode 100644 index 000000000..58d9b84e7 --- /dev/null +++ b/portal-ui/src/screens/Console/Common/DistributedOnly/DistributedOnly.tsx @@ -0,0 +1,59 @@ +// This file is part of MinIO Console Server +// Copyright (c) 2021 MinIO, Inc. +// +// This program is free software: you can redistribute it and/or modify +// it under the terms of the GNU Affero General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// (at your option) any later version. +// +// This program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU Affero General Public License for more details. +// +// You should have received a copy of the GNU Affero General Public License +// along with this program. If not, see . + +import React, { Fragment } from "react"; +import { Grid } from "@mui/material"; +import HelpBox from "../../../../common/HelpBox"; + +interface IDistributedOnly { + iconComponent: any; + entity: string; +} + +const DistributedOnly = ({ iconComponent, entity }: IDistributedOnly) => { + return ( + + + + This feature is not available for a single-disk setup. +
+ Please deploy a server in{" "} + + Distributed Mode + {" "} + to use this feature. + + } + /> + + + ); +}; + +export default DistributedOnly; diff --git a/portal-ui/src/screens/Console/Heal/Heal.tsx b/portal-ui/src/screens/Console/Heal/Heal.tsx index 1aee58c2f..e05217197 100644 --- a/portal-ui/src/screens/Console/Heal/Heal.tsx +++ b/portal-ui/src/screens/Console/Heal/Heal.tsx @@ -14,7 +14,7 @@ // You should have received a copy of the GNU Affero General Public License // along with this program. If not, see . -import React, { useEffect, useState } from "react"; +import React, { useEffect, useState, Fragment } from "react"; import { connect } from "react-redux"; import { HorizontalBar } from "react-chartjs-2"; import { Redirect } from "react-router-dom"; @@ -47,12 +47,14 @@ import { } from "../../../common/SecureComponent/permissions"; import { AppState } from "../../../store"; import { ErrorResponseHandler } from "../../../common/types"; +import { HealIcon } from "../../../icons"; import CheckboxWrapper from "../Common/FormComponents/CheckboxWrapper/CheckboxWrapper"; import PageHeader from "../Common/PageHeader/PageHeader"; import api from "../../../common/api"; import BackLink from "../../../common/BackLink"; import PageLayout from "../Common/Layout/PageLayout"; import SecureComponent from "../../../common/SecureComponent/SecureComponent"; +import DistributedOnly from "../Common/DistributedOnly/DistributedOnly"; const styles = (theme: Theme) => createStyles({ @@ -252,142 +254,143 @@ const Heal = ({ classes, distributedSetup }: IHeal) => { label: bucketName.name, value: bucketName.name, })); - if (!distributedSetup) { - return null; - } return ( - + - } - > - - - - { + setBucketName(e.target.value as string); + }} + className={classes.searchField} + input={} + displayEmpty + > + + Select Bucket - ))} - - - { - setPrefix(e.target.value); - }} - variant="standard" - /> + {bucketNames.map((option) => ( + + {option.label} + + ))} + + + { + setPrefix(e.target.value); + }} + variant="standard" + /> + + + { + setRecursive(e.target.checked); + }} + disabled={false} + label="Recursive" + /> + { + setForceStart(e.target.checked); + }} + disabled={false} + label="Force Start" + /> + { + setForceStop(e.target.checked); + }} + disabled={false} + label="Force Stop" + /> + + + + - - { - setRecursive(e.target.checked); + + - { - setForceStart(e.target.checked); - }} - disabled={false} - label="Force Start" - /> - { - setForceStop(e.target.checked); - }} - disabled={false} - label="Force Stop" /> + +
+ Size scanned: {hStatus.sizeScanned} +
+
+ Objects healed: {hStatus.objectsHealed} /{" "} + {hStatus.objectsScanned} +
+
+ Healing time: {hStatus.healDuration}s +
+ - - - - - - - -
- Size scanned: {hStatus.sizeScanned} -
-
- Objects healed: {hStatus.objectsHealed} /{" "} - {hStatus.objectsScanned} -
-
- Healing time: {hStatus.healDuration}s -
- - - + + )} - + ); }; diff --git a/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx b/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx index 3445f0d50..27c3816dc 100644 --- a/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx +++ b/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx @@ -46,8 +46,8 @@ import ProgressBarWrapper from "../Common/ProgressBarWrapper/ProgressBarWrapper" import InputUnitMenu from "../Common/FormComponents/InputUnitMenu/InputUnitMenu"; import CheckboxWrapper from "../Common/FormComponents/CheckboxWrapper/CheckboxWrapper"; import PageLayout from "../Common/Layout/PageLayout"; -import HelpBox from "../../../common/HelpBox"; import SecureComponent from "../../../common/SecureComponent/SecureComponent"; +import DistributedOnly from "../Common/DistributedOnly/DistributedOnly"; interface ISpeedtest { classes: any; @@ -193,224 +193,192 @@ const Speedtest = ({ classes, distributedSetup }: ISpeedtest) => { setSpeedometerValue(percToDisplay); }, [start, currentValue, topDate, totalSeconds]); - if (!distributedSetup) { - return ( - - - - - - - } - help={ - - This feature is not available for a single-disk setup. -
- Please deploy a server in{" "} - - Distributed Mode - {" "} - to use this feature. - - } - /> - - - - - ); - } - return ( - } - > - - - - - - -
- {start ? ( - "Speedtest in progress..." - ) : ( - - {currStatus && !start ? "Done!" : "Start a new test"} - - )} -    {start && } -
-
- -
- - - - - - - - setAutotune(e.target.checked)} - id={"autotune"} - name={"autotune"} - label={"Enable Autotune"} - tooltip={ - "Autotune gets the maximum stats for the system by running with multiple configurations at once. \ - This configuration is enabled by default and disables the rest of available options" - } - value="true" - disabled={start} - /> - - - { - setDuration(e.target.value); - }} - value={duration} - disabled={start || autotune} - overlayObject={ - - } - /> - - - { - setSize(e.target.value); - }} - value={size} - disabled={start || autotune} - overlayObject={ - - } - /> - - - { - setConcurrent(e.target.value); - }} - value={concurrent} - disabled={start || autotune} - /> - - - - - - - {currStatus !== null && ( + {!start && ( - + {currStatus !== null ? "Retest" : "Start"} )} - - + {start ? "Start" : ""} + + + +
+ {start ? ( + "Speedtest in progress..." + ) : ( + + {currStatus && !start ? "Done!" : "Start a new test"} + + )} +    {start && } +
+
+ +
+ + + + + + + + setAutotune(e.target.checked)} + id={"autotune"} + name={"autotune"} + label={"Enable Autotune"} + tooltip={ + "Autotune gets the maximum stats for the system by running with multiple configurations at once. \ + This configuration is enabled by default and disables the rest of available options" + } + value="true" + disabled={start} + /> + + + { + setDuration(e.target.value); + }} + value={duration} + disabled={start || autotune} + overlayObject={ + + } + /> + + + { + setSize(e.target.value); + }} + value={size} + disabled={start || autotune} + overlayObject={ + + } + /> + + + { + setConcurrent(e.target.value); + }} + value={concurrent} + disabled={start || autotune} + /> + + + + + + + {currStatus !== null && ( + + + + )} + + + - - + + )} );