Fix all react warnings (#507)

This commit is contained in:
Daniel Valdivia
2020-12-14 11:47:54 -08:00
committed by GitHub
parent d582cc96b7
commit 77e74917ca
18 changed files with 262 additions and 214 deletions

File diff suppressed because one or more lines are too long

View File

@@ -63,7 +63,7 @@ const ProtectedRoute = ({
}
})
.catch(() => setSessionLoading(false));
}, [saveSessionResponse]);
}, [saveSessionResponse, consoleOperatorMode, userLoggedIn]);
// if we still trying to retrieve user session render nothing
if (sessionLoading) {

View File

@@ -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, { useState, useEffect } from "react";
import React, { useEffect, useState } from "react";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import Grid from "@material-ui/core/Grid";
import TextField from "@material-ui/core/TextField";
@@ -33,7 +33,6 @@ import {
searchField,
} from "../../../../Common/FormComponents/common/styleLibrary";
import PageHeader from "../../../../Common/PageHeader/PageHeader";
import storage from "local-storage-fallback";
import { isNullOrUndefined } from "util";
import { Button, Input } from "@material-ui/core";
import * as reactMoment from "react-moment";
@@ -166,6 +165,29 @@ const ListObjects = ({
const bucketName = match.params["bucket"];
const internalPaths = match.params[0];
const verifyIfIsFile = () => {
const bucketName = match.params["bucket"];
const internalPaths = match.params[0];
api
.invoke(
"GET",
`/api/v1/buckets/${bucketName}/objects?prefix=${internalPaths}`
)
.then((res: BucketObjectsList) => {
//It is a file since it has elements in the object, setting file flag and waiting for component mount
if (res.objects !== null) {
setLastAsFile();
} else {
// It is a folder, we remove loader
setLoading(false);
}
})
.catch((err: any) => {
setLoading(false);
});
};
let extraPath = "";
if (internalPaths) {
extraPath = `?prefix=${internalPaths}/`;
@@ -186,7 +208,7 @@ const ListObjects = ({
.catch((err: any) => {
setLoading(false);
});
}, [loading, match]);
}, [loading, match, setLastAsFile]);
useEffect(() => {
const url = get(match, "url", "/object-browser");
@@ -195,29 +217,6 @@ const ListObjects = ({
}
}, [match, routesList, setAllRoutes]);
const verifyIfIsFile = () => {
const bucketName = match.params["bucket"];
const internalPaths = match.params[0];
api
.invoke(
"GET",
`/api/v1/buckets/${bucketName}/objects?prefix=${internalPaths}`
)
.then((res: BucketObjectsList) => {
//It is a file since it has elements in the object, setting file flag and waiting for component mount
if (res.objects !== null) {
setLastAsFile();
} else {
// It is a folder, we remove loader
setLoading(false);
}
})
.catch((err: any) => {
setLoading(false);
});
};
const closeDeleteModalAndRefresh = (refresh: boolean) => {
setDeleteOpen(false);
@@ -245,7 +244,6 @@ const ListObjects = ({
if (isNullOrUndefined(e) || isNullOrUndefined(e.target)) {
return;
}
const token: string = storage.getItem("token")!;
e.preventDefault();
let file = e.target.files[0];
const fileName = file.name;

View File

@@ -194,7 +194,7 @@ const ObjectDetails = ({
setLoadObjectData(false);
});
}
}, [loadObjectData]);
}, [loadObjectData, bucketName, pathInBucket]);
let tagKeys: string[] = [];
@@ -341,6 +341,11 @@ const ObjectDetails = ({
)}
<Grid container>
<Grid item xs={12} className={classes.container}>
{error !== "" && (
<Grid item xs={12}>
{error}
</Grid>
)}
<Grid item xs={12} className={classes.obTitleSection}>
<div>
<BrowserBreadcrumbs />

View File

@@ -50,7 +50,7 @@ const SetLegalHoldModal = ({
useEffect(() => {
const status = get(actualInfo, "legal_hold_status", "OFF");
setLegalHoldEnabled(status === "ON");
}, []);
}, [actualInfo]);
const onSubmit = (e: React.FormEvent) => {
e.preventDefault();

View File

@@ -77,7 +77,7 @@ const SetRetention = ({
setType(objectInfo.retention_mode.toLowerCase());
setAlreadyConfigured(true);
}
}, []);
}, [objectInfo]);
const dateElement = useRef<IRefObject>(null);

View File

@@ -42,13 +42,13 @@ const ShareFile = ({
bucketName,
dataObject,
}: IShareFileProps) => {
const [shareURL, setShareURL] = useState("");
const [isLoadingFile, setIsLoadingFile] = useState(false);
const [error, setError] = useState("");
const [selectedDate, setSelectedDate] = useState("");
const [dateValid, setDateValid] = useState(true);
const [openSnack, setOpenSnack] = useState(false);
const [snackBarMessage, setSnackbarMessage] = useState("");
const [shareURL, setShareURL] = useState<string>("");
const [isLoadingFile, setIsLoadingFile] = useState<boolean>(false);
const [error, setError] = useState<string>("");
const [selectedDate, setSelectedDate] = useState<string>("");
const [dateValid, setDateValid] = useState<boolean>(true);
const [openSnack, setOpenSnack] = useState<boolean>(false);
const [snackBarMessage, setSnackbarMessage] = useState<string>("");
const showSnackBarMessage = (text: string) => {
setSnackbarMessage(text);
@@ -66,13 +66,13 @@ const ShareFile = ({
setSelectedDate(newDate);
return;
}
setShareURL("");
setSelectedDate("");
};
useEffect(() => {
if (dateValid) {
setIsLoadingFile(true);
setShareURL("");
const slDate = new Date(`${selectedDate}T23:59:59`);
const currDate = new Date();
@@ -116,9 +116,7 @@ const ShareFile = ({
});
return;
}
setShareURL("");
}, [dataObject, selectedDate]);
}, [dataObject, selectedDate, bucketName, dateValid, setShareURL]);
const snackBarAction = (
<Button

View File

@@ -72,7 +72,7 @@ const SetAccessPolicy = ({
useEffect(() => {
setAccessPolicy(actualPolicy);
}, []);
}, [setAccessPolicy, actualPolicy]);
return (
<ModalWrapper

View File

@@ -229,7 +229,7 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => {
const [isVersioned, setIsVersioned] = useState<boolean>(false);
const [encryptionEnabled, setEncryptionEnabled] = useState<boolean>(false);
const fetchEvents = () => {
const fetchEvents = useCallback(() => {
setLoadingBucket(true);
const bucketName = match.params["bucketName"];
api
@@ -263,7 +263,7 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => {
.catch((err: any) => {
setError(err);
});
};
}, [match]);
const fetchBucketsSize = useCallback(() => {
const bucketName = match.params["bucketName"];
@@ -287,7 +287,7 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => {
setLoadingSize(false);
setErrorSize(err);
});
}, []);
}, [match]);
const loadInfo = useCallback(() => {
const bucketName = match.params["bucketName"];
@@ -305,7 +305,7 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => {
});
}, [match]);
const fetchBucketEncryptionInfo = () => {
const fetchBucketEncryptionInfo = useCallback(() => {
const bucketName = match.params["bucketName"];
api
.invoke("GET", `/api/v1/buckets/${bucketName}/encryption/info`)
@@ -317,7 +317,7 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => {
.catch((err) => {
console.log(err);
});
};
}, [match]);
const closeAddModalAndRefresh = () => {
setAccessPolicyScreenOpen(false);
@@ -336,7 +336,7 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => {
fetchEvents();
fetchBucketsSize();
fetchBucketEncryptionInfo();
}, [loadInfo]);
}, [loadInfo, fetchEvents, fetchBucketsSize, fetchBucketEncryptionInfo]);
const bucketName = match.params["bucketName"];
@@ -439,6 +439,16 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => {
{error}
</Grid>
)}
{errBucket !== "" && (
<Grid item xs={12}>
{errBucket}
</Grid>
)}
{errorSize !== "" && (
<Grid item xs={12}>
{errorSize}
</Grid>
)}
<Grid item xs={12} className={classes.container}>
<Grid item xs={12}>
<div className={classes.headerContainer}>

View File

@@ -113,7 +113,7 @@ const DateSelector = forwardRef(
useEffect(() => {
const [isValid, dateString] = validDate(year, month, day);
onDateChange(dateString, isValid);
}, [month, day, year]);
}, [month, day, year, onDateChange]);
const resetDate = () => {
setMonth("");

View File

@@ -69,11 +69,9 @@ const initialConfiguration = {
};
const ConfigurationsList = ({ classes }: IListConfiguration) => {
const [editScreenOpen, setEditScreenOpen] = useState(false);
const [selectedConfiguration, setSelectedConfiguration] = useState(
initialConfiguration
);
const [filter, setFilter] = useState("");
const [currentConfiguration, setCurrentConfiguration] = useState<number>(0);
const tableActions = [
@@ -92,13 +90,6 @@ const ConfigurationsList = ({ classes }: IListConfiguration) => {
},
];
const filteredRecords: IConfigurationElement[] = configurationElements.filter(
(elementItem) =>
elementItem.configuration_id
.toLocaleLowerCase()
.includes(filter.toLocaleLowerCase())
);
const backToInitialConfig = () => {
setCurrentConfiguration(0);
setSelectedConfiguration(initialConfiguration);
@@ -125,7 +116,7 @@ const ConfigurationsList = ({ classes }: IListConfiguration) => {
},
]}
isLoading={false}
records={filteredRecords}
records={configurationElements}
entityName="Configurations"
idField="configuration_id"
customPaperHeight={classes.customConfigurationPage}

View File

@@ -39,7 +39,6 @@ import api from "../../common/api";
import Account from "./Account/Account";
import Users from "./Users/Users";
import Groups from "./Groups/Groups";
import ListNotificationEndpoints from "./Configurations/NotificationEndpoints/ListNotificationEndpoints";
import ConfigurationMain from "./Configurations/ConfigurationMain";
import WebhookPanel from "./Configurations/ConfigurationPanels/WebhookPanel";
import ListTenants from "./Tenants/ListTenants/ListTenants";

View File

@@ -40,12 +40,11 @@ import {
DashboardIcon,
GroupsIcon,
IAMPoliciesIcon,
LambdaNotificationsIcon,
MirroringIcon,
ServiceAccountsIcon,
TraceIcon,
UsersIcon,
WarpIcon,
TraceIcon,
} from "../../../icons";
import { clearSession } from "../../../common/utils";
import LicenseIcon from "../../../icons/LicenseIcon";

View File

@@ -122,7 +122,7 @@ const BrowseBuckets = ({
useEffect(() => {
resetRoutesList(true);
}, [match]);
}, [match, resetRoutesList]);
useEffect(() => {
if (loading) {

View File

@@ -100,7 +100,7 @@ const AddPolicy = ({
policyEdit ? JSON.stringify(JSON.parse(policyEdit.policy), null, 4) : ""
);
}
}, []);
}, [policyEdit]);
const resetForm = () => {
setPolicyName("");

View File

@@ -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, { useState, useEffect } from "react";
import React, { useEffect, useState } from "react";
import get from "lodash/get";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import {
@@ -22,7 +22,7 @@ import {
modalBasic,
} from "../../Common/FormComponents/common/styleLibrary";
import Grid from "@material-ui/core/Grid";
import { Button, IconButton } from "@material-ui/core";
import { Button } from "@material-ui/core";
import Tabs from "@material-ui/core/Tabs";
import Tab from "@material-ui/core/Tab";
import { CreateIcon } from "../../../../icons";
@@ -33,7 +33,7 @@ import AddPoolModal from "./AddPoolModal";
import AddBucket from "../../Buckets/ListBuckets/AddBucket";
import ReplicationSetup from "./ReplicationSetup";
import api from "../../../../common/api";
import { ITenant, IPool } from "../ListTenants/types";
import { IPool, ITenant } from "../ListTenants/types";
import PageHeader from "../../Common/PageHeader/PageHeader";
import UsageBarWrapper from "../../Common/UsageBarWrapper/UsageBarWrapper";
import UpdateTenantModal from "./UpdateTenantModal";

View File

@@ -1,4 +1,4 @@
import React, { useState, Fragment, useEffect } from "react";
import React, { useState, Fragment, useEffect, useCallback } from "react";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
import { Button, Grid } from "@material-ui/core";
@@ -33,7 +33,6 @@ const UpdateTenantModal = ({
idTenant,
classes,
}: IUpdateTenantModal) => {
const [isLoading, setIsLoading] = useState<boolean>(true);
const [isSending, setIsSending] = useState<boolean>(false);
const [error, setError] = useState<string>("");
const [minioImage, setMinioImage] = useState<string>("");
@@ -51,13 +50,29 @@ const UpdateTenantModal = ({
const [validMinioImage, setValidMinioImage] = useState<boolean>(true);
const [validConsoleImage, setValidConsoleImage] = useState<boolean>(true);
const validateImage = useCallback(
(fieldToCheck: string) => {
const pattern = new RegExp("^$|^((.*?)/(.*?):(.+))$");
switch (fieldToCheck) {
case "consoleImage":
setValidConsoleImage(pattern.test(consoleImage));
break;
case "minioImage":
setValidMinioImage(pattern.test(minioImage));
break;
}
},
[consoleImage, minioImage]
);
useEffect(() => {
validateImage("minioImage");
}, [minioImage]);
}, [minioImage, validateImage]);
useEffect(() => {
validateImage("consoleImage");
}, [consoleImage]);
}, [consoleImage, validateImage]);
const closeAction = () => {
closeModalAndRefresh(false);
@@ -111,19 +126,6 @@ const UpdateTenantModal = ({
});
};
const validateImage = (fieldToCheck: string) => {
const pattern = new RegExp("^$|^((.*?)/(.*?):(.+))$");
switch (fieldToCheck) {
case "consoleImage":
setValidConsoleImage(pattern.test(consoleImage));
break;
case "minioImage":
setValidMinioImage(pattern.test(minioImage));
break;
}
};
return (
<ModalWrapper
title={"Update MinIO Version"}

View File

@@ -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, { useCallback, useEffect, useState } from "react";
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import { Button, LinearProgress } from "@material-ui/core";
@@ -66,6 +66,27 @@ const AddUserContent = ({
const [selectedGroups, setSelectedGroups] = useState<string[]>([]);
const [currentGroups, setCurrentGroups] = useState<string[]>([]);
const getUserInformation = useCallback(() => {
if (!selectedUser) {
return null;
}
api
.invoke("GET", `/api/v1/users/${selectedUser.accessKey}`)
.then((res) => {
setAddLoading(false);
setAddError("");
setAccessKey(res.accessKey);
setSelectedGroups(res.memberOf || []);
setCurrentGroups(res.memberOf || []);
setEnabled(res.status === "enabled");
})
.catch((err) => {
setAddLoading(false);
setAddError(err);
});
}, [selectedUser]);
useEffect(() => {
if (selectedUser == null) {
setAccessKey("");
@@ -74,7 +95,7 @@ const AddUserContent = ({
} else {
getUserInformation();
}
}, []);
}, [selectedUser, getUserInformation]);
const saveRecord = (event: React.FormEvent) => {
event.preventDefault();
@@ -119,27 +140,6 @@ const AddUserContent = ({
}
};
const getUserInformation = () => {
if (!selectedUser) {
return null;
}
api
.invoke("GET", `/api/v1/users/${selectedUser.accessKey}`)
.then((res) => {
setAddLoading(false);
setAddError("");
setAccessKey(res.accessKey);
setSelectedGroups(res.memberOf || []);
setCurrentGroups(res.memberOf || []);
setEnabled(res.status === "enabled");
})
.catch((err) => {
setAddLoading(false);
setAddError(err);
});
};
const resetForm = () => {
if (selectedUser !== null) {
setSelectedGroups([]);