Removed warnings on console (#345)

For Operator modules this will be removed after upgrading component to use redux/formik

Co-authored-by: Benjamin Perez <benjamin@bexsoft.net>

portal-ui/src/Routes.tsx

@@ -15,17 +15,10 @@
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React from "react";
-import {
-  Redirect,
-  Route,
-  Router,
-  Switch,
-  BrowserRouter,
-} from "react-router-dom";
+import { Redirect, Route, Router, Switch } from "react-router-dom";
 import history from "./history";
 import Login from "./screens/LoginPage/LoginPage";
 import Console from "./screens/Console/Console";
-import NotFoundPage from "./screens/NotFoundPage";
 import storage from "local-storage-fallback";
 import { connect } from "react-redux";
 import { AppState } from "./store";

portal-ui/src/common/utils.ts

@@ -15,7 +15,7 @@
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import storage from "local-storage-fallback";
-import { ICapacity, IStorageType, IZoneModel } from "./types";
+import { ICapacity, IZoneModel } from "./types";
 
 const minStReq = 1073741824; // Minimal Space required for MinIO
 const minMemReq = 2147483648; // Minimal Memory required for MinIO in bytes

portal-ui/src/screens/Console/Buckets/ListBuckets/AddBucket.tsx

@@ -23,7 +23,6 @@ import { modalBasic } from "../../Common/FormComponents/common/styleLibrary";
 import api from "../../../../common/api";
 import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
 import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
-import CheckboxWrapper from "../../Common/FormComponents/CheckboxWrapper/CheckboxWrapper";
 import SelectWrapper from "../../Common/FormComponents/SelectWrapper/SelectWrapper";
 import { factorForDropdown, getBytes } from "../../../../common/utils";
 import { AppState } from "../../../../store";
@@ -143,7 +142,7 @@ const AddBucket = ({
 
   useEffect(() => {
     addBucketName(value);
-  }, [value]);
+  }, [value, addBucketName]);
 
   const resetForm = () => {
     setBName("");

portal-ui/src/screens/Console/Buckets/ListBuckets/ListBuckets.tsx

@@ -18,7 +18,6 @@ import React, { useEffect, useState } from "react";
 import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import Grid from "@material-ui/core/Grid";
 import { Button } from "@material-ui/core";
-import Typography from "@material-ui/core/Typography";
 import TextField from "@material-ui/core/TextField";
 import InputAdornment from "@material-ui/core/InputAdornment";
 import SearchIcon from "@material-ui/icons/Search";
@@ -93,7 +92,6 @@ const ListBuckets = ({
   const [totalRecords, setTotalRecords] = useState<number>(0);
   const [loading, setLoading] = useState<boolean>(false);
   const [error, setError] = useState<string>("");
-  const [deleteError, setDeleteError] = useState<string>("");
   const [page, setPage] = useState<number>(0);
   const [rowsPerPage, setRowsPerPage] = useState<number>(10);
   const [deleteOpen, setDeleteOpen] = useState<boolean>(false);
@@ -219,6 +217,7 @@ const ListBuckets = ({
       )}
       <PageHeader label={"Buckets"} />
       <Grid container>
+        {error !== "" && <span className={classes.error}>{error}</span>}
         <Grid item xs={12} className={classes.container}>
           <Grid item xs={12} className={classes.actionsTray}>
             <TextField

portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx

@@ -174,17 +174,17 @@ class ListObjects extends React.Component<
     xhr.withCredentials = false;
     xhr.onload = function (event) {
       // TODO: handle status
-      if (xhr.status == 401 || xhr.status == 403) {
+      if (xhr.status === 401 || xhr.status === 403) {
         listObjects.showSnackBarMessage(
           "An error occurred while uploading the file."
         );
       }
-      if (xhr.status == 500) {
+      if (xhr.status === 500) {
         listObjects.showSnackBarMessage(
           "An error occurred while uploading the file."
         );
       }
-      if (xhr.status == 200) {
+      if (xhr.status === 200) {
         listObjects.showSnackBarMessage("Object uploaded successfully.");
         listObjects.fetchRecords();
       }
@@ -228,7 +228,7 @@ class ListObjects extends React.Component<
     xhr.responseType = "blob";
 
     xhr.onload = function (e) {
-      if (this.status == 200) {
+      if (this.status === 200) {
         var blob = new Blob([this.response], {
           type: "octet/stream",
         });

portal-ui/src/screens/Console/Buckets/ViewBucket/AddReplicationModal.tsx

@@ -14,15 +14,14 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
-import React, { useState, useEffect } from "react";
+import React, { useState } from "react";
 import get from "lodash/get";
 import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
 import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import { modalBasic } from "../../Common/FormComponents/common/styleLibrary";
 import Grid from "@material-ui/core/Grid";
 import Typography from "@material-ui/core/Typography";
 import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
-import SelectWrapper from "../../Common/FormComponents/SelectWrapper/SelectWrapper";
 import { Button, LinearProgress } from "@material-ui/core";
 import api from "../../../../common/api";
 import { IRemoteBucket } from "../types";

portal-ui/src/screens/Console/Buckets/ViewBucket/SetAccessPolicy.tsx

@@ -94,7 +94,7 @@ class SetAccessPolicy extends React.Component<
   }
 
   render() {
-    const { classes, open, actualPolicy } = this.props;
+    const { classes, open } = this.props;
     const { addLoading, addError, accessPolicy } = this.state;
     return (
       <ModalWrapper

portal-ui/src/screens/Console/Buckets/ViewBucket/ViewBucket.tsx

@@ -34,8 +34,7 @@ import {
   BucketReplicationRuleDeleteMarker,
   BucketVersioning,
 } from "../types";
-import { Box, Button } from "@material-ui/core";
-import Typography from "@material-ui/core/Typography";
+import { Button } from "@material-ui/core";
 import SetAccessPolicy from "./SetAccessPolicy";
 import { MinTablePaginationActions } from "../../../../common/MinTablePaginationActions";
 import { CreateIcon } from "../../../../icons";
@@ -363,7 +362,6 @@ class ViewBucket extends React.Component<IViewBucketProps, IViewBucketState> {
       selectedEvent,
       bucketSize,
       loadingSize,
-      replicationSet,
       openSetReplication,
       isVersioned,
       replicationRules,

portal-ui/src/screens/Console/Common/FormComponents/CSVMultiSelector/CSVMultiSelector.tsx

@@ -105,8 +105,8 @@ const CSVMultiSelector = ({
       firstUpdate.current = false;
       return;
     }
-
     debouncedOnChange();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [currentElements]);
 
   // If the last input is not empty, we add a new one

portal-ui/src/screens/Console/Common/FormComponents/CommentBoxWrapper/CommentBoxWrapper.tsx

@@ -14,20 +14,8 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import React from "react";
-import {
-  Grid,
-  InputLabel,
-  TextField,
-  TextFieldProps,
-  Tooltip,
-} from "@material-ui/core";
-import { OutlinedInputProps } from "@material-ui/core/OutlinedInput";
-import {
-  createStyles,
-  makeStyles,
-  Theme,
-  withStyles,
-} from "@material-ui/core/styles";
+import { Grid, InputLabel, TextField, Tooltip } from "@material-ui/core";
+import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import { fieldBasic, tooltipHelper } from "../common/styleLibrary";
 import HelpIcon from "@material-ui/icons/Help";
 

portal-ui/src/screens/Console/Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper.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 <http://www.gnu.org/licenses/>.
 
-import React, { useEffect, useState } from "react";
+import React from "react";
 import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import { InputLabel, Switch, Tooltip } from "@material-ui/core";
 import Grid from "@material-ui/core/Grid";

portal-ui/src/screens/Console/Common/GenericWizard/WizardPage.tsx

@@ -51,6 +51,7 @@ const WizardPage = ({ classes, page, pageChange }: IWizardPage) => {
         break;
       case "to":
         pageChange(btn.toPage || 0);
+        break;
       default:
     }
 

portal-ui/src/screens/Console/Common/ModalWrapper/ModalWrapper.tsx

@@ -16,12 +16,7 @@
 import React from "react";
 import { Dialog, DialogContent, DialogTitle } from "@material-ui/core";
 import IconButton from "@material-ui/core/IconButton";
-import {
-  createStyles,
-  makeStyles,
-  Theme,
-  withStyles,
-} from "@material-ui/core/styles";
+import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 
 interface IModalProps {
   classes: any;

portal-ui/src/screens/Console/Configurations/ConfTargetGeneric.tsx

@@ -20,7 +20,6 @@ import Grid from "@material-ui/core/Grid";
 import { IElementValue, KVField } from "./types";
 import { modalBasic } from "../Common/FormComponents/common/styleLibrary";
 import InputBoxWrapper from "../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
-import RadioGroupSelector from "../Common/FormComponents/RadioGroupSelector/RadioGroupSelector";
 import CSVMultiSelector from "../Common/FormComponents/CSVMultiSelector/CSVMultiSelector";
 import CommentBoxWrapper from "../Common/FormComponents/CommentBoxWrapper/CommentBoxWrapper";
 import FormSwitchWrapper from "../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
@@ -79,6 +78,7 @@ const ConfTargetGeneric = ({
     });
 
     setValueHolder(values);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [fields, defaultVals]);
 
   useEffect(() => {

portal-ui/src/screens/Console/Configurations/ConfigurationPanels/ConfigurationsList.tsx

@@ -18,7 +18,6 @@ import React, { useState } from "react";
 import get from "lodash/get";
 import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import Grid from "@material-ui/core/Grid";
-import Typography from "@material-ui/core/Typography";
 import { TextField } from "@material-ui/core";
 import InputAdornment from "@material-ui/core/InputAdornment";
 import SearchIcon from "@material-ui/icons/Search";
@@ -63,7 +62,6 @@ const ConfigurationsList = ({ classes }: IListConfiguration) => {
     configuration_id: "",
     configuration_label: "",
   });
-  const [error, setError] = useState("");
   const [filter, setFilter] = useState("");
 
   const tableActions = [
@@ -103,7 +101,6 @@ const ConfigurationsList = ({ classes }: IListConfiguration) => {
       <PageHeader label="Configurations List" />
       <Grid container>
         <Grid item xs={12} className={classes.container}>
-          {error !== "" && <Grid container>{error}</Grid>}
           <Grid item xs={12} className={classes.actionsTray}>
             <TextField
               placeholder="Filter"

portal-ui/src/screens/Console/Configurations/ConfigurationPanels/WebhookPanel.tsx

@@ -94,10 +94,9 @@ const panels = {
 
 const WebhookPanel = ({ match, classes }: IWebhookPanel) => {
   const [addWebhookOpen, setAddWebhookOpen] = useState<boolean>(false);
-  const [error, setError] = useState<string>("");
   const [filter, setFilter] = useState<string>("");
   const [isLoading, setIsLoading] = useState<boolean>(false);
-  const [webhooks, setWebhooks] = useState<IWebhook[]>([]);
+  // const [webhooks, setWebhooks] = useState<IWebhook[]>([]);
 
   const pathIn = get(match, "path", "");
   const panelToDisplay = pathIn.split("/");
@@ -107,6 +106,8 @@ const WebhookPanel = ({ match, classes }: IWebhookPanel) => {
     return null;
   }
 
+  const webhooks: IWebhook[] = [];
+
   const filteredRecords: IWebhook[] = webhooks.filter((elementItem) =>
     elementItem.name.toLocaleLowerCase().includes(filter.toLocaleLowerCase())
   );
@@ -137,7 +138,6 @@ const WebhookPanel = ({ match, classes }: IWebhookPanel) => {
         <Grid item xs={12}>
           <br />
         </Grid>
-        {error !== "" && <Grid container>{error}</Grid>}
         <Grid item xs={12} className={classes.actionsTray}>
           <TextField
             placeholder="Filter"

portal-ui/src/screens/Console/Configurations/CustomForms/ConfMySql.tsx

@@ -16,7 +16,6 @@
 
 import React, { useCallback, useEffect, useState } from "react";
 import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
-import { FormControlLabel, Switch } from "@material-ui/core";
 import Grid from "@material-ui/core/Grid";
 import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
 import RadioGroupSelector from "../../Common/FormComponents/RadioGroupSelector/RadioGroupSelector";

portal-ui/src/screens/Console/Configurations/CustomForms/ConfPostgres.tsx

@@ -16,7 +16,6 @@
 
 import React, { useCallback, useEffect, useState } from "react";
 import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
-import { FormControlLabel, Switch } from "@material-ui/core";
 import Grid from "@material-ui/core/Grid";
 import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
 import RadioGroupSelector from "../../Common/FormComponents/RadioGroupSelector/RadioGroupSelector";
@@ -201,6 +200,8 @@ const ConfPostgres = ({ onChange, classes }: IConfPostgresProps) => {
     setUser(kv.get("user") ? kv.get("user") + "" : "");
     setPassword(kv.get("password") ? kv.get("password") + "" : "");
     setSslMode(kv.get("sslmode") ? kv.get("sslmode") + "" : " ");
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [useConnectionString]);
 
   return (

portal-ui/src/screens/Console/Console.tsx

@@ -16,35 +16,19 @@
 
 import React, { useEffect } from "react";
 import clsx from "clsx";
-import {
-  createStyles,
-  StyledProps,
-  Theme,
-  withStyles,
-} from "@material-ui/core/styles";
+import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import CssBaseline from "@material-ui/core/CssBaseline";
 import Drawer from "@material-ui/core/Drawer";
-import Box from "@material-ui/core/Box";
-import Typography from "@material-ui/core/Typography";
 import Container from "@material-ui/core/Container";
-import Link from "@material-ui/core/Link";
 import history from "../../history";
-import {
-  Redirect,
-  Route,
-  RouteComponentProps,
-  Router,
-  Switch,
-  withRouter,
-} from "react-router-dom";
+import { Redirect, Route, Router, Switch } from "react-router-dom";
 import { connect } from "react-redux";
 import { AppState } from "../../store";
 import {
   serverIsLoading,
   serverNeedsRestart,
   setMenuOpen,
 } from "../../actions";
-import { ThemedComponentProps } from "@material-ui/core/styles/withTheme";
 import Buckets from "./Buckets/Buckets";
 import Policies from "./Policies/Policies";
 import Permissions from "./Permissions/Permissions";
@@ -319,7 +303,7 @@ const Console = ({
 
   return (
     <React.Fragment>
-      {session.status == "ok" ? (
+      {session.status === "ok" ? (
         <div className={classes.root}>
           <CssBaseline />
           <Drawer

portal-ui/src/screens/Console/Dashboard/Dashboard.tsx

@@ -20,9 +20,6 @@ import clsx from "clsx";
 import Grid from "@material-ui/core/Grid";
 import Paper from "@material-ui/core/Paper";
 import Typography from "@material-ui/core/Typography";
-import NetworkCheckIcon from "@material-ui/icons/NetworkCheck";
-import PieChartIcon from "@material-ui/icons/PieChart";
-import ViewHeadlineIcon from "@material-ui/icons/ViewHeadline";
 import { Usage } from "./types";
 import api from "../../../common/api";
 import { niceBytes } from "../../../common/utils";

portal-ui/src/screens/Console/Groups/AddGroup.tsx

@@ -27,7 +27,6 @@ import api from "../../../common/api";
 import UsersSelectors from "./UsersSelectors";
 import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
 import InputBoxWrapper from "../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
-import RadioGroupSelector from "../Common/FormComponents/RadioGroupSelector/RadioGroupSelector";
 import FormSwitchWrapper from "../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
 
 interface IGroupProps {

portal-ui/src/screens/Console/Groups/Groups.tsx

@@ -17,7 +17,6 @@
 import React, { useEffect, useState } from "react";
 import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import Grid from "@material-ui/core/Grid";
-import Typography from "@material-ui/core/Typography";
 import TextField from "@material-ui/core/TextField";
 import InputAdornment from "@material-ui/core/InputAdornment";
 import SearchIcon from "@material-ui/icons/Search";

portal-ui/src/screens/Console/Groups/UsersSelectors.tsx

@@ -20,18 +20,14 @@ import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
 import { LinearProgress } from "@material-ui/core";
 import Paper from "@material-ui/core/Paper";
 import Grid from "@material-ui/core/Grid";
-import Title from "../../../common/Title";
 import { UsersList } from "../Users/types";
 import { usersSort } from "../../../utils/sortFunctions";
 import api from "../../../common/api";
 import TextField from "@material-ui/core/TextField";
 import InputAdornment from "@material-ui/core/InputAdornment";
 import SearchIcon from "@material-ui/icons/Search";
 import TableWrapper from "../Common/TableWrapper/TableWrapper";
-import {
-  actionsTray,
-  predefinedList,
-} from "../Common/FormComponents/common/styleLibrary";
+import { actionsTray } from "../Common/FormComponents/common/styleLibrary";
 
 interface IGroupsProps {
   classes: any;