Introduce ErrorBlock component to display error text (#514)

This commit is contained in:
Daniel Valdivia
2020-12-14 12:56:56 -08:00
committed by GitHub
parent aa2714d118
commit d97d18ebab
53 changed files with 176 additions and 478 deletions

View File

@@ -39,6 +39,7 @@ import {
import Divider from "@material-ui/core/Divider";
import LockIcon from "@material-ui/icons/Lock";
import ChangePasswordModal from "./ChangePasswordModal";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -55,9 +56,6 @@ const styles = (theme: Theme) =>
minWidth: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -274,13 +272,7 @@ const Account = ({ classes }: IServiceAccountsProps) => {
</Grid>
{error !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{error}
</Typography>
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -16,7 +16,6 @@
import React, { 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";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { modalBasic } from "../Common/FormComponents/common/styleLibrary";
@@ -24,12 +23,10 @@ import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
import api from "../../../common/api";
import { NewServiceAccount } from "../Common/CredentialsPrompt/types";
import CodeMirrorWrapper from "../Common/FormComponents/CodeMirrorWrapper/CodeMirrorWrapper";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
jsonPolicyEditor: {
minHeight: 400,
width: "100%",
@@ -107,13 +104,7 @@ const AddServiceAccount = ({
<Grid item xs={12} className={classes.formScrollable}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}
<CodeMirrorWrapper

View File

@@ -18,7 +18,6 @@ import React, { useState } from "react";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import InputBoxWrapper from "../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
import { Button, LinearProgress } from "@material-ui/core";
import {
@@ -28,12 +27,10 @@ import {
} from "../Common/FormComponents/common/styleLibrary";
import { ChangePasswordRequest } from "../Buckets/types";
import api from "../../../common/api";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
buttonContainer: {
textAlign: "right",
},
@@ -120,13 +117,7 @@ const ChangePassword = ({
<Grid item xs={12} className={classes.formScrollable}>
{error !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{error}
</Typography>
<ErrorBlock errorMessage={error} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -14,9 +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, { useState, useEffect } from "react";
import React, { useEffect, useState } from "react";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import Typography from "@material-ui/core/Typography";
import {
Button,
Dialog,
@@ -27,12 +26,10 @@ import {
LinearProgress,
} from "@material-ui/core";
import api from "../../../common/api";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
wrapText: {
maxWidth: "200px",
whiteSpace: "normal",
@@ -95,18 +92,7 @@ const DeleteServiceAccount = ({
<DialogContentText id="alert-dialog-description">
Are you sure you want to delete service account{" "}
<b className={classes.wrapText}>{selectedServiceAccount}</b>?
{deleteError !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{deleteError}
</Typography>
</React.Fragment>
)}
{deleteError !== "" && <ErrorBlock errorMessage={deleteError} />}
</DialogContentText>
</DialogContent>
<DialogActions>

View File

@@ -16,7 +16,6 @@
import React, { 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";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { modalBasic } from "../../Common/FormComponents/common/styleLibrary";
@@ -38,12 +37,10 @@ import {
import { useDebounce } from "use-debounce";
import { MakeBucketRequest } from "../types";
import FormSwitchWrapper from "../../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
buttonContainer: {
textAlign: "right",
},
@@ -191,13 +188,7 @@ const AddBucket = ({
<Grid item xs={12} className={classes.formScrollable}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -14,7 +14,6 @@
// 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 { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import React, { useState } from "react";
import {
Button,
@@ -27,29 +26,15 @@ import {
} from "@material-ui/core";
import api from "../../../../common/api";
import { BucketList } from "../types";
import Typography from "@material-ui/core/Typography";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
});
import ErrorBlock from "../../../shared/ErrorBlock";
interface IDeleteBucketProps {
classes: any;
closeDeleteModalAndRefresh: (refresh: boolean) => void;
deleteOpen: boolean;
selectedBucket: string;
}
interface IDeleteBucketState {
deleteLoading: boolean;
deleteError: string;
}
const DeleteBucket = ({
classes,
closeDeleteModalAndRefresh,
deleteOpen,
selectedBucket,
@@ -94,18 +79,7 @@ const DeleteBucket = ({
<DialogContentText id="alert-dialog-description">
Are you sure you want to delete bucket <b>{selectedBucket}</b>? <br />
A bucket can only be deleted if it's empty.
{deleteError !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{deleteError}
</Typography>
</React.Fragment>
)}
{deleteError !== "" && <ErrorBlock errorMessage={deleteError} />}
</DialogContentText>
</DialogContent>
<DialogActions>
@@ -133,4 +107,4 @@ const DeleteBucket = ({
);
};
export default withStyles(styles)(DeleteBucket);
export default DeleteBucket;

View File

@@ -38,6 +38,7 @@ import {
searchField,
} from "../../Common/FormComponents/common/styleLibrary";
import PageHeader from "../../Common/PageHeader/PageHeader";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -54,9 +55,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -183,7 +181,11 @@ const ListBuckets = ({
)}
<PageHeader label={"Buckets"} />
<Grid container>
{error !== "" && <span className={classes.error}>{error}</span>}
{error !== "" && (
<Grid item xs={12}>
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12} className={classes.container}>
<Grid item xs={12} className={classes.actionsTray}>
<TextField

View File

@@ -14,7 +14,6 @@
// 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 { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import React, { useState } from "react";
import {
Button,
@@ -26,17 +25,9 @@ import {
LinearProgress,
} from "@material-ui/core";
import api from "../../../../../../common/api";
import Typography from "@material-ui/core/Typography";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
});
import ErrorBlock from "../../../../../shared/ErrorBlock";
interface IDeleteObjectProps {
classes: any;
closeDeleteModalAndRefresh: (refresh: boolean) => void;
deleteOpen: boolean;
selectedObject: string;
@@ -49,7 +40,6 @@ interface IDeleteObjectState {
}
const DeleteObject = ({
classes,
closeDeleteModalAndRefresh,
deleteOpen,
selectedBucket,
@@ -101,14 +91,7 @@ const DeleteObject = ({
Are you sure you want to delete: <b>{selectedObject}</b>?{" "}
{deleteError !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{deleteError}
</Typography>
<ErrorBlock errorMessage={deleteError} />
</React.Fragment>
)}
</DialogContentText>
@@ -139,4 +122,4 @@ const DeleteObject = ({
);
};
export default withStyles(styles)(DeleteObject);
export default DeleteObject;

View File

@@ -76,9 +76,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),

View File

@@ -5,6 +5,7 @@ import ModalWrapper from "../../../../Common/ModalWrapper/ModalWrapper";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { modalBasic } from "../../../../Common/FormComponents/common/styleLibrary";
import api from "../../../../../../common/api";
import ErrorBlock from "../../../../../shared/ErrorBlock";
interface ITagModal {
modalOpen: boolean;
@@ -83,7 +84,9 @@ const AddTagModal = ({
<h3 className={classes.pathLabel}>
Selected Object: {selectedObject}
</h3>
{error !== "" && <span>{error}</span>}
{error !== "" && (
<ErrorBlock errorMessage={error} withBreak={false} />
)}
<Grid item xs={12}>
<InputBoxWrapper
value={newKey}

View File

@@ -52,6 +52,7 @@ import DeleteObject from "../ListObjects/DeleteObject";
import AddTagModal from "./AddTagModal";
import DeleteTagModal from "./DeleteTagModal";
import SetLegalHoldModal from "./SetLegalHoldModal";
import ErrorBlock from "../../../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -343,7 +344,7 @@ const ObjectDetails = ({
<Grid item xs={12} className={classes.container}>
{error !== "" && (
<Grid item xs={12}>
{error}
<ErrorBlock errorMessage={error} />
</Grid>
)}
<Grid item xs={12} className={classes.obTitleSection}>

View File

@@ -8,6 +8,7 @@ import { IFileInfo } from "./types";
import ModalWrapper from "../../../../Common/ModalWrapper/ModalWrapper";
import FormSwitchWrapper from "../../../../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
import api from "../../../../../../common/api";
import ErrorBlock from "../../../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -19,9 +20,6 @@ const styles = (theme: Theme) =>
buttonContainer: {
textAlign: "right",
},
errorBlock: {
color: "red",
},
...modalBasic,
});
@@ -85,7 +83,7 @@ const SetLegalHoldModal = ({
closeModalAndRefresh(false);
}}
>
{error !== "" && <span className={classes.errorBlock}>{error}</span>}
{error !== "" && <ErrorBlock errorMessage={error} withBreak={false} />}
<Grid item xs={12} className={classes.objectName}>
{objectName}
</Grid>

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, useRef, useEffect } from "react";
import React, { useEffect, useRef, 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/Button";
@@ -25,7 +25,7 @@ import FormSwitchWrapper from "../../../../Common/FormComponents/FormSwitchWrapp
import RadioGroupSelector from "../../../../Common/FormComponents/RadioGroupSelector/RadioGroupSelector";
import DateSelector from "../../../../Common/FormComponents/DateSelector/DateSelector";
import api from "../../../../../../common/api";
import Typography from "@material-ui/core/Typography";
import ErrorBlock from "../../../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -37,9 +37,6 @@ const styles = (theme: Theme) =>
buttonContainer: {
textAlign: "right",
},
errorBlock: {
color: "red",
},
...modalBasic,
});
@@ -170,16 +167,9 @@ const SetRetention = ({
}}
>
{error !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{error}
</Typography>
</React.Fragment>
<Grid item xs={12}>
<ErrorBlock errorMessage={error} />
</Grid>
)}
<Grid item xs={12} className={classes.objectName}>
{objectName}

View File

@@ -1,7 +1,6 @@
import React, { useState, useEffect } from "react";
import React, { useEffect, useState } from "react";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import CopyToClipboard from "react-copy-to-clipboard";
import Typography from "@material-ui/core/Typography";
import Snackbar from "@material-ui/core/Snackbar";
import Grid from "@material-ui/core/Grid";
import Button from "@material-ui/core/Button";
@@ -12,6 +11,7 @@ import { CopyIcon } from "../../../../../../icons";
import api from "../../../../../../common/api";
import { IFileInfo } from "./types";
import PredefinedList from "../../../../Common/FormComponents/PredefinedList/PredefinedList";
import ErrorBlock from "../../../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -21,9 +21,6 @@ const styles = (theme: Theme) =>
modalContent: {
paddingBottom: 53,
},
errorBlock: {
color: "red",
},
...modalBasic,
});
@@ -149,13 +146,7 @@ const ShareFile = ({
<Grid container className={classes.modalContent}>
{error !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{error}
</Typography>
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12} className={classes.dateContainer}>

View File

@@ -16,7 +16,6 @@
import React, { ChangeEvent, 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";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import api from "../../../../common/api";
@@ -31,12 +30,10 @@ import { modalBasic } from "../../Common/FormComponents/common/styleLibrary";
import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
import SelectWrapper from "../../Common/FormComponents/SelectWrapper/SelectWrapper";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
minTableHeader: {
color: "#393939",
"& tr": {
@@ -185,13 +182,7 @@ const AddEvent = ({
<Grid item xs={12} className={classes.formScrollable}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -20,11 +20,11 @@ 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 { Button, LinearProgress } from "@material-ui/core";
import api from "../../../../common/api";
import { IRemoteBucket } from "../types";
import ErrorBlock from "../../../shared/ErrorBlock";
interface IReplicationModal {
open: boolean;
@@ -35,9 +35,6 @@ interface IReplicationModal {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
minTableHeader: {
color: "#393939",
"& tr": {
@@ -143,13 +140,7 @@ const AddReplicationModal = ({
<Grid item xs={12} className={classes.formScrollable}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}

View File

@@ -28,14 +28,9 @@ import {
} from "@material-ui/core";
import api from "../../../../common/api";
import { BucketEvent, BucketList } from "../types";
import Typography from "@material-ui/core/Typography";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
});
const styles = (theme: Theme) => createStyles({});
interface IDeleteEventProps {
classes: any;
@@ -104,18 +99,7 @@ const DeleteEvent = ({
{deleteLoading && <LinearProgress />}
<DialogContentText id="alert-dialog-description">
Are you sure you want to delete this event?
{deleteError !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{deleteError}
</Typography>
</React.Fragment>
)}
{deleteError !== "" && <ErrorBlock errorMessage={deleteError} />}
</DialogContentText>
</DialogContent>
<DialogActions>

View File

@@ -16,7 +16,6 @@
import React, { useState } from "react";
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import { Button, LinearProgress } from "@material-ui/core";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import api from "../../../../common/api";
@@ -24,12 +23,10 @@ import { modalBasic } from "../../Common/FormComponents/common/styleLibrary";
import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
import SelectWrapper from "../../Common/FormComponents/SelectWrapper/SelectWrapper";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
minTableHeader: {
color: "#393939",
"& tr": {
@@ -104,13 +101,7 @@ const EnableBucketEncryption = ({
<Grid item xs={12} className={classes.formScrollable}>
{encryptionError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{encryptionError}
</Typography>
<ErrorBlock errorMessage={encryptionError} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -15,19 +15,16 @@
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { 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";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { modalBasic } from "../../Common/FormComponents/common/styleLibrary";
import api from "../../../../common/api";
import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
import SelectWrapper from "../../Common/FormComponents/SelectWrapper/SelectWrapper";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
...modalBasic,
});
@@ -94,13 +91,7 @@ const SetAccessPolicy = ({
<Grid item xs={12} className={classes.formScrollable}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -47,6 +47,7 @@ import { containerForHeader } from "../../Common/FormComponents/common/styleLibr
import PageHeader from "../../Common/PageHeader/PageHeader";
import Checkbox from "@material-ui/core/Checkbox";
import EnableBucketEncryption from "./EnableBucketEncryption";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -63,9 +64,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -436,7 +434,7 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => {
<Grid container>
{error !== "" && (
<Grid item xs={12}>
{error}
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
{errBucket !== "" && (

View File

@@ -25,7 +25,7 @@ import Grid from "@material-ui/core/Grid";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
warningBlock: {
color: "red",
},
buttonContainer: {
@@ -100,7 +100,7 @@ const CredentialsPrompt = ({
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
className={classes.warningBlock}
>
Write these down, as this is the only time the secret will be
displayed.

View File

@@ -24,6 +24,7 @@ import HelpIcon from "@material-ui/icons/Help";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { fieldBasic, tooltipHelper } from "../common/styleLibrary";
import { fileProcess } from "./utils";
import ErrorBlock from "../../../../shared/ErrorBlock";
interface InputBoxProps {
label: string;
@@ -161,12 +162,7 @@ const FileSelector = ({
</IconButton>
)}
{error !== "" && (
<React.Fragment>
<br />
<span className={classes.errorText}>{error}</span>
</React.Fragment>
)}
{error !== "" && <ErrorBlock errorMessage={error} />}
</div>
) : (
<div className={classes.fileReselect}>

View File

@@ -52,9 +52,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),

View File

@@ -4,6 +4,7 @@ import { LinearProgress } from "@material-ui/core";
import Paper from "@material-ui/core/Paper";
import Grid from "@material-ui/core/Grid";
import CircularProgress from "@material-ui/core/CircularProgress";
import ErrorBlock from "../../../shared/ErrorBlock";
interface IProgressBar {
maxValue: number;
@@ -32,9 +33,6 @@ const styles = (theme: Theme) =>
centerItem: {
textAlign: "center",
},
error: {
color: "#9c9c9c",
},
});
const BorderLinearProgress = withStyles((theme) => ({
@@ -65,9 +63,7 @@ const UsageBarWrapper = ({
const renderComponent = () => {
if (!loading) {
return error !== "" ? (
<React.Fragment>
<span className={classes.error}>{error}</span>
</React.Fragment>
<ErrorBlock errorMessage={error} withBreak={false} />
) : (
<React.Fragment>
<Grid item xs={12} className={classes.allValue}>

View File

@@ -38,9 +38,6 @@ interface IListConfiguration {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
strongText: {
fontWeight: 700,
},

View File

@@ -43,9 +43,6 @@ interface IWebhook {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
strongText: {
fontWeight: 700,
},

View File

@@ -20,7 +20,6 @@ import { connect } from "react-redux";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { Button, LinearProgress } from "@material-ui/core";
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import api from "../../../../common/api";
import ConfTargetGeneric from "../ConfTargetGeneric";
import { serverNeedsRestart } from "../../../../actions";
@@ -30,14 +29,12 @@ import {
} from "../../Common/FormComponents/common/styleLibrary";
import { fieldsConfigurations, removeEmptyFields } from "../utils";
import { IConfigurationElement, IElementValue } from "../types";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
...fieldBasic,
...settingsCommon,
errorBlock: {
color: "red",
},
strongText: {
fontWeight: 700,
},
@@ -154,13 +151,7 @@ const EditConfiguration = ({
)}
{errorConfig !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{errorConfig}
</Typography>
<ErrorBlock errorMessage={errorConfig} withBreak={false} />
</Grid>
)}
<ConfTargetGeneric

View File

@@ -19,7 +19,6 @@ import get from "lodash/get";
import Grid from "@material-ui/core/Grid";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { Button } from "@material-ui/core";
import Typography from "@material-ui/core/Typography";
import ConfPostgres from "../CustomForms/ConfPostgres";
import api from "../../../../common/api";
import { serverNeedsRestart } from "../../../../actions";
@@ -28,8 +27,8 @@ import ConfMySql from "../CustomForms/ConfMySql";
import ConfTargetGeneric from "../ConfTargetGeneric";
import {
notificationEndpointsFields,
notifyPostgres,
notifyMysql,
notifyPostgres,
removeEmptyFields,
} from "../utils";
import { IElementValue } from "../types";
@@ -38,14 +37,12 @@ import {
settingsCommon,
} from "../../Common/FormComponents/common/styleLibrary";
import { servicesList } from "./utils";
import ErrorBlock from "../../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
...modalBasic,
...settingsCommon,
errorBlock: {
color: "red",
},
strongText: {
fontWeight: 700,
},
@@ -157,13 +154,7 @@ const AddNotificationEndpoint = ({
<Grid item xs={12} className={classes.settingsFormContainer}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}
{srvComponent}

View File

@@ -43,6 +43,7 @@ import {
import SlideOptions from "../../Common/SlideOptions/SlideOptions";
import BackSettingsIcon from "../../../../icons/BackSettingsIcon";
import NotificationTypeSelector from "./NotificationTypeSelector";
import ErrorBlock from "../../../shared/ErrorBlock";
interface IListNotificationEndpoints {
classes: any;
@@ -54,9 +55,6 @@ const styles = (theme: Theme) =>
...searchField,
...settingsCommon,
...containerForHeader(theme.spacing(4)),
errorBlock: {
color: "red",
},
strongText: {
fontWeight: 700,
},
@@ -186,7 +184,11 @@ const ListNotificationEndpoints = ({ classes }: IListNotificationEndpoints) => {
</Grid>
<Grid item xs={12} className={classes.lambdaContainer}>
{error !== "" && <Grid container>{error}</Grid>}
{error !== "" && (
<Grid container>
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12} className={classes.actionsTray}>
<TextField
placeholder="Filter"

View File

@@ -29,6 +29,7 @@ import { containerForHeader } from "../Common/FormComponents/common/styleLibrary
import AllBucketsIcon from "../../../icons/AllBucketsIcon";
import UsageIcon from "../../../icons/UsageIcon";
import EgressIcon from "../../../icons/EgressIcon";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -200,7 +201,11 @@ const Dashboard = ({ classes }: IDashboardProps) => {
<div className={classes.dashboardBG} />
<Grid container className={classes.dashboardContainer}>
<Grid container spacing={3} className={classes.container}>
{error !== "" && <Grid container>{error}</Grid>}
{error !== "" && (
<Grid container>
<ErrorBlock errorMessage={error} />
</Grid>
)}
{loading ? (
<Grid item xs={12} md={12} lg={12}>
<LinearProgress />

View File

@@ -18,7 +18,6 @@ import React, { useEffect, useState } from "react";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { Button, LinearProgress } from "@material-ui/core";
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import { modalBasic } from "../Common/FormComponents/common/styleLibrary";
import api from "../../../common/api";
import UsersSelectors from "./UsersSelectors";
@@ -26,6 +25,7 @@ import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
import InputBoxWrapper from "../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
import FormSwitchWrapper from "../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
import PredefinedList from "../Common/FormComponents/PredefinedList/PredefinedList";
import ErrorBlock from "../../shared/ErrorBlock";
interface IGroupProps {
open: boolean;
@@ -42,9 +42,6 @@ interface MainGroupProps {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
strongText: {
fontWeight: 700,
},
@@ -193,13 +190,7 @@ const AddGroup = ({
<Grid item xs={12} className={classes.formScrollable}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}

View File

@@ -14,8 +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 { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import React, { useEffect, useState } from "react";
import {
Button,
Dialog,
@@ -26,28 +25,19 @@ import {
LinearProgress,
} from "@material-ui/core";
import api from "../../../common/api";
import Typography from "@material-ui/core/Typography";
import { UsersList } from "../Users/types";
import ErrorBlock from "../../shared/ErrorBlock";
interface IDeleteGroup {
selectedGroup: string;
deleteOpen: boolean;
closeDeleteModalAndRefresh: any;
classes: any;
}
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
});
const DeleteGroup = ({
selectedGroup,
deleteOpen,
closeDeleteModalAndRefresh,
classes,
}: IDeleteGroup) => {
const [isDeleting, setDeleteLoading] = useState<boolean>(false);
const [deleteError, setError] = useState<string>("");
@@ -94,18 +84,7 @@ const DeleteGroup = ({
{isDeleting && <LinearProgress />}
<DialogContentText id="alert-dialog-description">
Are you sure you want to delete group <b>{selectedGroup}</b>?
{deleteError !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{deleteError}
</Typography>
</React.Fragment>
)}
{deleteError !== "" && <ErrorBlock errorMessage={deleteError} />}
</DialogContentText>
</DialogContent>
<DialogActions>
@@ -127,4 +106,4 @@ const DeleteGroup = ({
);
};
export default withStyles(styles)(DeleteGroup);
export default DeleteGroup;

View File

@@ -35,6 +35,7 @@ import {
searchField,
} from "../Common/FormComponents/common/styleLibrary";
import PageHeader from "../Common/PageHeader/PageHeader";
import ErrorBlock from "../../shared/ErrorBlock";
interface IGroupsProps {
classes: any;
@@ -56,9 +57,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -189,7 +187,11 @@ const Groups = ({ classes }: IGroupsProps) => {
<PageHeader label={"Groups"} />
<Grid container>
<Grid item xs={12} className={classes.container}>
{error !== "" ? <Grid container>{error}</Grid> : <React.Fragment />}
{error !== "" && (
<Grid container>
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12} className={classes.actionsTray}>
<TextField
placeholder="Search Groups"

View File

@@ -31,6 +31,7 @@ import {
actionsTray,
selectorsCommon,
} from "../Common/FormComponents/common/styleLibrary";
import ErrorBlock from "../../shared/ErrorBlock";
interface IGroupsProps {
classes: any;
@@ -55,9 +56,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -182,7 +180,9 @@ const UsersSelectors = ({
<Grid item xs={12}>
<Paper className={classes.paper}>
{loading && <LinearProgress />}
{error !== "" ? <div>{error}</div> : <React.Fragment />}
{error !== "" && (
<ErrorBlock errorMessage={error} withBreak={false} />
)}
{records != null && records.length > 0 ? (
<React.Fragment>
<Grid item xs={12} className={classes.actionsTray}>

View File

@@ -37,6 +37,7 @@ import BrowserBreadcrumbs from "./BrowserBreadcrumbs";
import TableWrapper from "../Common/TableWrapper/TableWrapper";
import AddBucket from "../Buckets/ListBuckets/AddBucket";
import api from "../../../common/api";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -53,9 +54,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -220,7 +218,9 @@ const BrowseBuckets = ({
<br />
</Grid>
<Grid item xs={12}>
{error !== "" && <span className={classes.errorBlock}>{error}</span>}
{error !== "" && (
<ErrorBlock errorMessage={error} withBreak={false} />
)}
<TableWrapper
itemActions={[
{

View File

@@ -16,7 +16,6 @@
import React, { 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";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import api from "../../../common/api";
@@ -28,12 +27,10 @@ import {
import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
import InputBoxWrapper from "../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
import CodeMirrorWrapper from "../Common/FormComponents/CodeMirrorWrapper/CodeMirrorWrapper";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
jsonPolicyEditor: {
minHeight: 400,
width: "100%",
@@ -129,13 +126,7 @@ const AddPolicy = ({
<Grid item xs={12} className={classes.formScrollable}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -14,7 +14,6 @@
// 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 { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import React, { useState } from "react";
import {
Button,
@@ -27,29 +26,15 @@ import {
} from "@material-ui/core";
import api from "../../../common/api";
import { PolicyList } from "./types";
import Typography from "@material-ui/core/Typography";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
});
import ErrorBlock from "../../shared/ErrorBlock";
interface IDeletePolicyProps {
classes: any;
closeDeleteModalAndRefresh: (refresh: boolean) => void;
deleteOpen: boolean;
selectedPolicy: string;
}
interface IDeletePolicyState {
deleteLoading: boolean;
deleteError: string;
}
const DeletePolicy = ({
classes,
closeDeleteModalAndRefresh,
deleteOpen,
selectedPolicy,
@@ -89,18 +74,7 @@ const DeletePolicy = ({
{deleteLoading && <LinearProgress />}
<DialogContentText id="alert-dialog-description">
Are you sure you want to delete policy <b>{selectedPolicy}</b>?.
{deleteError !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{deleteError}
</Typography>
</React.Fragment>
)}
{deleteError !== "" && <ErrorBlock errorMessage={deleteError} />}
</DialogContentText>
</DialogContent>
<DialogActions>
@@ -128,4 +102,4 @@ const DeletePolicy = ({
);
};
export default withStyles(styles)(DeletePolicy);
export default DeletePolicy;

View File

@@ -34,6 +34,7 @@ import {
searchField,
} from "../Common/FormComponents/common/styleLibrary";
import PageHeader from "../Common/PageHeader/PageHeader";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -50,9 +51,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -211,7 +209,7 @@ const Policies = ({ classes }: IPoliciesProps) => {
</Grid>
{error && (
<Grid item xs={12}>
{error}
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -30,6 +30,7 @@ import {
selectorsCommon,
} from "../Common/FormComponents/common/styleLibrary";
import { PolicyList } from "./types";
import ErrorBlock from "../../shared/ErrorBlock";
interface ISelectPolicyProps {
classes: any;
@@ -53,9 +54,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -161,7 +159,9 @@ const PolicySelectors = ({
<Grid item xs={12}>
<Paper className={classes.paper}>
{loading && <LinearProgress />}
{error !== "" && <div>{error}</div>}
{error !== "" && (
<ErrorBlock errorMessage={error} withBreak={false} />
)}
{records != null && records.length > 0 ? (
<React.Fragment>
<Grid item xs={12} className={classes.actionsTray}>

View File

@@ -25,6 +25,7 @@ import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
import api from "../../../common/api";
import PolicySelectors from "./PolicySelectors";
import PredefinedList from "../Common/FormComponents/PredefinedList/PredefinedList";
import ErrorBlock from "../../shared/ErrorBlock";
interface ISetPolicyProps {
classes: any;
@@ -129,7 +130,11 @@ const SetPolicy = ({
modalOpen={open}
title="Set Policies"
>
{error !== "" && <span className={classes.error}>{error}</span>}
{error !== "" && (
<Grid item xs={12}>
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>
<PredefinedList
label={`Selected ${selectedGroup !== null ? "Group" : "User"}`}

View File

@@ -19,7 +19,6 @@ import debounce from "lodash/debounce";
import get from "lodash/get";
import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
import { LinearProgress } from "@material-ui/core";
import Table from "@material-ui/core/Table";
@@ -52,6 +51,7 @@ import {
ICapacity,
ITenantCreator,
} from "../../../../common/types";
import ErrorBlock from "../../../shared/ErrorBlock";
interface IAddTenantProps {
open: boolean;
@@ -64,9 +64,6 @@ interface IAddTenantProps {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
buttonContainer: {
textAlign: "right",
},
@@ -2129,13 +2126,7 @@ const AddTenant = ({
</div>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}

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 {
Button,
Dialog,
@@ -24,28 +24,19 @@ import {
DialogTitle,
LinearProgress,
} from "@material-ui/core";
import Typography from "@material-ui/core/Typography";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import api from "../../../../common/api";
import { ITenant } from "./types";
import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
import Grid from "@material-ui/core/Grid";
import ErrorBlock from "../../../shared/ErrorBlock";
interface IDeleteTenant {
classes: any;
deleteOpen: boolean;
selectedTenant: ITenant;
closeDeleteModalAndRefresh: (refreshList: boolean) => any;
}
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
});
const DeleteTenant = ({
classes,
deleteOpen,
selectedTenant,
closeDeleteModalAndRefresh,
@@ -108,18 +99,7 @@ const DeleteTenant = ({
value={retypeTenant}
/>
</Grid>
{deleteError !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{deleteError}
</Typography>
</React.Fragment>
)}
{deleteError !== "" && <ErrorBlock errorMessage={deleteError} />}
</DialogContentText>
</DialogContent>
<DialogActions>
@@ -146,4 +126,4 @@ const DeleteTenant = ({
);
};
export default withStyles(styles)(DeleteTenant);
export default DeleteTenant;

View File

@@ -38,6 +38,7 @@ import {
searchField,
} from "../../Common/FormComponents/common/styleLibrary";
import PageHeader from "../../Common/PageHeader/PageHeader";
import ErrorBlock from "../../../shared/ErrorBlock";
interface ITenantsList {
classes: any;
@@ -58,9 +59,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -253,7 +251,7 @@ const ListTenants = ({ classes }: ITenantsList) => {
</Grid>
{error !== "" && (
<Grid item xs={12}>
{error}
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -18,9 +18,6 @@ interface IAddPoolProps {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
buttonContainer: {
textAlign: "right",
},

View File

@@ -37,9 +37,6 @@ interface IDropDownElements {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
buttonContainer: {
textAlign: "right",
},

View File

@@ -38,6 +38,7 @@ import PageHeader from "../../Common/PageHeader/PageHeader";
import UsageBarWrapper from "../../Common/UsageBarWrapper/UsageBarWrapper";
import UpdateTenantModal from "./UpdateTenantModal";
import PencilIcon from "../../Common/TableWrapper/TableActionIcons/PencilIcon";
import ErrorBlock from "../../../shared/ErrorBlock";
interface ITenantDetailsProps {
classes: any;
@@ -51,9 +52,6 @@ interface ITenantUsage {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
buttonContainer: {
textAlign: "right",
},
@@ -254,7 +252,7 @@ const TenantDetails = ({ classes, match }: ITenantDetailsProps) => {
<Grid container>
{error !== "" && (
<Grid item xs={12}>
{error}
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12}>

View File

@@ -6,6 +6,7 @@ import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBo
import FormSwitchWrapper from "../../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
import api from "../../../../common/api";
import { modalBasic } from "../../Common/FormComponents/common/styleLibrary";
import ErrorBlock from "../../../shared/ErrorBlock";
interface IUpdateTenantModal {
open: boolean;
@@ -17,9 +18,6 @@ interface IUpdateTenantModal {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
buttonContainer: {
textAlign: "right",
},
@@ -133,8 +131,12 @@ const UpdateTenantModal = ({
onClose={closeAction}
>
<Grid container>
{error !== "" && (
<Grid item xs={12}>
<ErrorBlock errorMessage={error} withBreak={false} />
</Grid>
)}
<Grid item xs={12} className={classes.formScrollable}>
{error !== "" && <span className={classes.errorBlock}>{error}</span>}
<span>
Please enter the MinIO image from dockerhub to use. If blank, then
latest build will be used.

View File

@@ -13,16 +13,16 @@
//
// 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 { Button, LinearProgress } from "@material-ui/core";
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import { modalBasic } from "../Common/FormComponents/common/styleLibrary";
import api from "../../../common/api";
import GroupsSelectors from "./GroupsSelectors";
import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
import PredefinedList from "../Common/FormComponents/PredefinedList/PredefinedList";
import ErrorBlock from "../../shared/ErrorBlock";
interface IAddToGroup {
open: boolean;
@@ -33,9 +33,6 @@ interface IAddToGroup {
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
strongText: {
fontWeight: 700,
},
@@ -134,13 +131,7 @@ const AddToGroup = ({
<Grid item xs={12} className={classes.formScrollable}>
{updatingError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{updatingError}
</Typography>
<ErrorBlock errorMessage={updatingError} withBreak={false} />
</Grid>
)}
<PredefinedList

View File

@@ -16,7 +16,6 @@
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";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import { modalBasic } from "../Common/FormComponents/common/styleLibrary";
@@ -27,12 +26,10 @@ import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
import InputBoxWrapper from "../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
import FormSwitchWrapper from "../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
import PredefinedList from "../Common/FormComponents/PredefinedList/PredefinedList";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
strongText: {
fontWeight: 700,
},
@@ -190,13 +187,7 @@ const AddUserContent = ({
<Grid item xs={12} className={classes.formScrollable}>
{addError !== "" && (
<Grid item xs={12}>
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{addError}
</Typography>
<ErrorBlock errorMessage={addError} withBreak={false} />
</Grid>
)}

View File

@@ -14,7 +14,6 @@
// 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 { createStyles, Theme, withStyles } from "@material-ui/core/styles";
import React, { useState } from "react";
import {
Button,
@@ -27,29 +26,15 @@ import {
} from "@material-ui/core";
import api from "../../../common/api";
import { User, UsersList } from "./types";
import Typography from "@material-ui/core/Typography";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: "red",
},
});
import ErrorBlock from "../../shared/ErrorBlock";
interface IDeleteUserProps {
classes: any;
closeDeleteModalAndRefresh: (refresh: boolean) => void;
deleteOpen: boolean;
selectedUser: User | null;
}
interface IDeleteUserState {
deleteLoading: boolean;
deleteError: string;
}
const DeleteUser = ({
classes,
closeDeleteModalAndRefresh,
deleteOpen,
selectedUser,
@@ -99,18 +84,7 @@ const DeleteUser = ({
{deleteLoading && <LinearProgress />}
<DialogContentText id="alert-dialog-description">
Are you sure you want to delete user <b>{selectedUser.accessKey}</b>?
{deleteError !== "" && (
<React.Fragment>
<br />
<Typography
component="p"
variant="body1"
className={classes.errorBlock}
>
{deleteError}
</Typography>
</React.Fragment>
)}
{deleteError !== "" && <ErrorBlock errorMessage={deleteError} />}
</DialogContentText>
</DialogContent>
<DialogActions>
@@ -138,4 +112,4 @@ const DeleteUser = ({
);
};
export default withStyles(styles)(DeleteUser);
export default DeleteUser;

View File

@@ -31,6 +31,7 @@ import {
actionsTray,
selectorsCommon,
} from "../Common/FormComponents/common/styleLibrary";
import ErrorBlock from "../../shared/ErrorBlock";
interface IGroupsProps {
classes: any;
@@ -54,9 +55,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -178,7 +176,9 @@ const GroupsSelectors = ({
<Grid item xs={12}>
<Paper className={classes.paper}>
{loading && <LinearProgress />}
{error !== "" && <div>{error}</div>}
{error !== "" && (
<ErrorBlock errorMessage={error} withBreak={false} />
)}
{records != null && records.length > 0 ? (
<React.Fragment>
<Grid item xs={12} className={classes.actionsTray}>

View File

@@ -34,6 +34,7 @@ import {
searchField,
} from "../Common/FormComponents/common/styleLibrary";
import PageHeader from "../Common/PageHeader/PageHeader";
import ErrorBlock from "../../shared/ErrorBlock";
const styles = (theme: Theme) =>
createStyles({
@@ -50,9 +51,6 @@ const styles = (theme: Theme) =>
width: "320px",
padding: "20px",
},
errorBlock: {
color: "red",
},
tableToolbar: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(0),
@@ -234,7 +232,7 @@ const Users = ({ classes }: IUsersProps) => {
<Grid container>
{error !== "" && (
<Grid item xs={12}>
{error}
<ErrorBlock errorMessage={error} />
</Grid>
)}
<Grid item xs={12} className={classes.container}>

View File

@@ -0,0 +1,33 @@
import React from "react";
import Typography from "@material-ui/core/Typography";
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
const styles = (theme: Theme) =>
createStyles({
errorBlock: {
color: theme.palette.error.main,
},
});
interface IErrorBlockProps {
classes: any;
errorMessage: string;
withBreak?: boolean;
}
const ErrorBlock = ({
classes,
errorMessage,
withBreak = true,
}: IErrorBlockProps) => {
return (
<React.Fragment>
{withBreak && <br />}
<Typography component="p" variant="body1" className={classes.errorBlock}>
{errorMessage}
</Typography>
</React.Fragment>
);
};
export default withStyles(styles)(ErrorBlock);