Update Box Button Style and move Icons to the Right (#1199)
* Update Box Button Style and move Icons to the Right Signed-off-by: Daniel Valdivia <18384552+dvaldivia@users.noreply.github.com> * Add AButton component to replace <a> tags Signed-off-by: Daniel Valdivia <18384552+dvaldivia@users.noreply.github.com>
This commit is contained in:
@@ -45,6 +45,9 @@ const GlobalCss = withStyles({
|
||||
".MuiButton-root": {
|
||||
height: 38,
|
||||
},
|
||||
".MuiButtonBase-root": {
|
||||
textTransform: "capitalize",
|
||||
},
|
||||
".MuiButton-contained": {
|
||||
fontSize: "14px",
|
||||
textTransform: "capitalize",
|
||||
|
||||
@@ -257,7 +257,7 @@ const Account = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={() => {
|
||||
setAddScreenOpen(true);
|
||||
setSelectedServiceAccount(null);
|
||||
|
||||
@@ -246,7 +246,7 @@ const AccessRule = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
component="label"
|
||||
onClick={() => {
|
||||
setAddAccessRuleOpen(true);
|
||||
|
||||
@@ -64,13 +64,11 @@ import {
|
||||
S3_GET_BUCKET_POLICY,
|
||||
S3_GET_LIFECYCLE_CONFIGURATION,
|
||||
S3_GET_REPLICATION_CONFIGURATION,
|
||||
S3_LISTEN_BUCKET_NOTIFICATIONS,
|
||||
S3_PUT_BUCKET_NOTIFICATIONS,
|
||||
S3_PUT_LIFECYCLE_CONFIGURATION,
|
||||
S3_PUT_REPLICATION_CONFIGURATION,
|
||||
} from "../../../../types";
|
||||
import { displayComponent } from "../../../../utils/permissions";
|
||||
import { ISessionResponse } from "../../types";
|
||||
|
||||
const styles = (theme: Theme) =>
|
||||
createStyles({
|
||||
@@ -383,6 +381,7 @@ const BucketDetails = ({
|
||||
setBucketDetailsLoad(true);
|
||||
}}
|
||||
size="large"
|
||||
variant={"contained"}
|
||||
>
|
||||
<RefreshIcon />
|
||||
</BoxIconButton>
|
||||
|
||||
@@ -163,7 +163,7 @@ const BucketEventsPanel = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
size="medium"
|
||||
onClick={() => {
|
||||
setAddEventScreenOpen(true);
|
||||
|
||||
@@ -211,7 +211,7 @@ const BucketLifecyclePanel = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
size="medium"
|
||||
onClick={() => {
|
||||
setAddLifecycleOpen(true);
|
||||
|
||||
@@ -181,7 +181,7 @@ const BucketReplicationPanel = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
size="medium"
|
||||
onClick={() => {
|
||||
setOpenReplicationOpen(true);
|
||||
|
||||
@@ -29,7 +29,6 @@ import { addBucketOpen, addBucketReset } from "../actions";
|
||||
import { setErrorSnackMessage } from "../../../../actions";
|
||||
import {
|
||||
containerForHeader,
|
||||
linkStyles,
|
||||
searchField,
|
||||
} from "../../Common/FormComponents/common/styleLibrary";
|
||||
import { ErrorResponseHandler } from "../../../../common/types";
|
||||
@@ -46,6 +45,7 @@ import InputAdornment from "@mui/material/InputAdornment";
|
||||
import SearchIcon from "../../../../icons/SearchIcon";
|
||||
import BoxIconButton from "../../Common/BoxIconButton";
|
||||
import RefreshIcon from "../../../../icons/RefreshIcon";
|
||||
import AButton from "../../Common/AButton";
|
||||
|
||||
const styles = (theme: Theme) =>
|
||||
createStyles({
|
||||
@@ -131,7 +131,6 @@ const styles = (theme: Theme) =>
|
||||
constrainedContainer: {
|
||||
maxWidth: 1180,
|
||||
},
|
||||
...linkStyles(theme.palette.info.main),
|
||||
});
|
||||
|
||||
interface IListBucketsProps {
|
||||
@@ -438,14 +437,14 @@ const ListBuckets = ({
|
||||
<br />
|
||||
<br />
|
||||
To get started,
|
||||
<button
|
||||
className={classes.link}
|
||||
<AButton
|
||||
onClick={() => {
|
||||
addBucketOpen(true);
|
||||
}}
|
||||
>
|
||||
Create a Bucket.
|
||||
</button>
|
||||
</AButton>
|
||||
refresh
|
||||
</Fragment>
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -45,17 +45,14 @@ import {
|
||||
objectBrowserCommon,
|
||||
searchField,
|
||||
} from "../../../../Common/FormComponents/common/styleLibrary";
|
||||
import { Badge, Button, IconButton, Tooltip, Typography } from "@mui/material";
|
||||
import { Badge, Button, Tooltip, Typography } from "@mui/material";
|
||||
import * as reactMoment from "react-moment";
|
||||
import BrowserBreadcrumbs from "../../../../ObjectBrowser/BrowserBreadcrumbs";
|
||||
import {
|
||||
resetRewind,
|
||||
setFileModeEnabled,
|
||||
} from "../../../../ObjectBrowser/actions";
|
||||
import {
|
||||
ObjectBrowserReducer,
|
||||
Route,
|
||||
} from "../../../../ObjectBrowser/reducers";
|
||||
import { Route } from "../../../../ObjectBrowser/reducers";
|
||||
import CreateFolderModal from "./CreateFolderModal";
|
||||
import { download, extensionPreview, sortListObjects } from "../utils";
|
||||
import {
|
||||
@@ -99,15 +96,14 @@ import {
|
||||
import ShareFile from "../ObjectDetails/ShareFile";
|
||||
import { displayComponent } from "../../../../../../utils/permissions";
|
||||
import {
|
||||
S3_DELETE_BUCKET,
|
||||
S3_DELETE_OBJECT,
|
||||
S3_FORCE_DELETE_BUCKET,
|
||||
S3_GET_OBJECT,
|
||||
S3_LIST_BUCKET,
|
||||
S3_PUT_OBJECT,
|
||||
} from "../../../../../../types";
|
||||
import { setBucketDetailsLoad, setBucketInfo } from "../../../actions";
|
||||
import { AppState } from "../../../../../../store";
|
||||
import BoxIconButton from "../../../../Common/BoxIconButton";
|
||||
|
||||
const commonIcon = {
|
||||
backgroundRepeat: "no-repeat",
|
||||
@@ -1088,10 +1084,9 @@ const ListObjects = ({
|
||||
{displayPutObject && (
|
||||
<Fragment>
|
||||
<Tooltip title={"Choose or create a new path"}>
|
||||
<IconButton
|
||||
<BoxIconButton
|
||||
color="primary"
|
||||
aria-label="Add a new folder"
|
||||
component="span"
|
||||
onClick={() => {
|
||||
setCreateFolderOpen(true);
|
||||
}}
|
||||
@@ -1099,14 +1094,13 @@ const ListObjects = ({
|
||||
size="large"
|
||||
>
|
||||
<AddFolderIcon />
|
||||
</IconButton>
|
||||
</BoxIconButton>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip title={"Upload file"}>
|
||||
<IconButton
|
||||
<BoxIconButton
|
||||
color="primary"
|
||||
aria-label="Refresh List"
|
||||
component="span"
|
||||
onClick={() => {
|
||||
if (fileUpload && fileUpload.current) {
|
||||
fileUpload.current.click();
|
||||
@@ -1116,7 +1110,7 @@ const ListObjects = ({
|
||||
size="large"
|
||||
>
|
||||
<UploadIcon />
|
||||
</IconButton>
|
||||
</BoxIconButton>
|
||||
</Tooltip>
|
||||
<input
|
||||
type="file"
|
||||
@@ -1137,10 +1131,9 @@ const ListObjects = ({
|
||||
invisible={!rewindEnabled}
|
||||
className={classes.badgeOverlap}
|
||||
>
|
||||
<IconButton
|
||||
<BoxIconButton
|
||||
color="primary"
|
||||
aria-label="Rewind"
|
||||
component="span"
|
||||
onClick={() => {
|
||||
setRewindSelect(true);
|
||||
}}
|
||||
@@ -1148,22 +1141,22 @@ const ListObjects = ({
|
||||
size="large"
|
||||
>
|
||||
<HistoryIcon />
|
||||
</IconButton>
|
||||
</BoxIconButton>
|
||||
</Badge>
|
||||
</Tooltip>
|
||||
<Tooltip title={"Refresh list"}>
|
||||
<IconButton
|
||||
<BoxIconButton
|
||||
color="primary"
|
||||
aria-label="Refresh List"
|
||||
component="span"
|
||||
onClick={() => {
|
||||
setLoading(true);
|
||||
}}
|
||||
disabled={rewindEnabled}
|
||||
size="large"
|
||||
variant={"contained"}
|
||||
>
|
||||
<RefreshIcon />
|
||||
</IconButton>
|
||||
</BoxIconButton>
|
||||
</Tooltip>
|
||||
</Fragment>
|
||||
}
|
||||
@@ -1195,7 +1188,7 @@ const ListObjects = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<DeleteIcon />}
|
||||
endIcon={<DeleteIcon />}
|
||||
onClick={() => {
|
||||
setDeleteMultipleOpen(true);
|
||||
}}
|
||||
|
||||
@@ -77,7 +77,6 @@ import {
|
||||
S3_GET_OBJECT_LEGAL_HOLD,
|
||||
S3_GET_OBJECT_RETENTION,
|
||||
S3_GET_OBJECT_TAGGING,
|
||||
S3_GET_REPLICATION_CONFIGURATION,
|
||||
S3_PUT_OBJECT_LEGAL_HOLD,
|
||||
S3_PUT_OBJECT_RETENTION,
|
||||
S3_PUT_OBJECT_TAGGING,
|
||||
@@ -94,6 +93,7 @@ import SearchIcon from "../../../../../../icons/SearchIcon";
|
||||
import ObjectBrowserIcon from "../../../../../../icons/ObjectBrowserIcon";
|
||||
import PreviewFileContent from "../Preview/PreviewFileContent";
|
||||
import RestoreFileVersion from "./RestoreFileVersion";
|
||||
import BoxIconButton from "../../../../Common/BoxIconButton";
|
||||
|
||||
const styles = (theme: Theme) =>
|
||||
createStyles({
|
||||
@@ -643,7 +643,7 @@ const ObjectDetails = ({
|
||||
actions={
|
||||
<Fragment>
|
||||
<Tooltip title="Share">
|
||||
<IconButton
|
||||
<BoxIconButton
|
||||
color="primary"
|
||||
aria-label="share"
|
||||
onClick={() => {
|
||||
@@ -653,7 +653,7 @@ const ObjectDetails = ({
|
||||
size="large"
|
||||
>
|
||||
<ShareIcon />
|
||||
</IconButton>
|
||||
</BoxIconButton>
|
||||
</Tooltip>
|
||||
|
||||
{downloadingFiles.includes(
|
||||
@@ -668,7 +668,7 @@ const ObjectDetails = ({
|
||||
</div>
|
||||
) : (
|
||||
<Tooltip title="Download">
|
||||
<IconButton
|
||||
<BoxIconButton
|
||||
color="primary"
|
||||
aria-label="download"
|
||||
onClick={() => {
|
||||
@@ -678,13 +678,13 @@ const ObjectDetails = ({
|
||||
size="large"
|
||||
>
|
||||
<DownloadIcon />
|
||||
</IconButton>
|
||||
</BoxIconButton>
|
||||
</Tooltip>
|
||||
)}
|
||||
|
||||
{displayDeleteObject && (
|
||||
<Tooltip title="Delete Object">
|
||||
<IconButton
|
||||
<BoxIconButton
|
||||
color="primary"
|
||||
aria-label="delete"
|
||||
onClick={() => {
|
||||
@@ -694,7 +694,7 @@ const ObjectDetails = ({
|
||||
size="large"
|
||||
>
|
||||
<DeleteIcon />
|
||||
</IconButton>
|
||||
</BoxIconButton>
|
||||
</Tooltip>
|
||||
)}
|
||||
</Fragment>
|
||||
|
||||
@@ -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, Fragment } from "react";
|
||||
import React, { Fragment, useEffect, useState } from "react";
|
||||
import get from "lodash/get";
|
||||
import { connect } from "react-redux";
|
||||
import { Theme } from "@mui/material/styles";
|
||||
@@ -217,7 +217,7 @@ const ShareFile = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<CopyIcon />}
|
||||
endIcon={<CopyIcon />}
|
||||
onClick={() => {
|
||||
setModalSnackMessage("Share URL Copied to clipboard");
|
||||
}}
|
||||
|
||||
50
portal-ui/src/screens/Console/Common/AButton.tsx
Normal file
50
portal-ui/src/screens/Console/Common/AButton.tsx
Normal file
@@ -0,0 +1,50 @@
|
||||
// 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 <http://www.gnu.org/licenses/>.
|
||||
|
||||
import React from "react";
|
||||
import { Theme } from "@mui/material/styles";
|
||||
import createStyles from "@mui/styles/createStyles";
|
||||
import withStyles from "@mui/styles/withStyles";
|
||||
import { IconButtonProps } from "@mui/material";
|
||||
|
||||
const styles = (theme: Theme) =>
|
||||
createStyles({
|
||||
root: {
|
||||
padding: 0,
|
||||
margin: 0,
|
||||
border: 0,
|
||||
backgroundColor: "transparent",
|
||||
textDecoration: "underline",
|
||||
cursor: "pointer",
|
||||
fontSize: "inherit",
|
||||
color: theme.palette.info.main,
|
||||
},
|
||||
});
|
||||
|
||||
interface IAButton extends IconButtonProps {
|
||||
classes: any;
|
||||
children: any;
|
||||
}
|
||||
|
||||
const AButton = ({ classes, children, ...rest }: IAButton) => {
|
||||
return (
|
||||
<button {...rest} className={classes.root}>
|
||||
{children}
|
||||
</button>
|
||||
);
|
||||
};
|
||||
|
||||
export default withStyles(styles)(AButton);
|
||||
@@ -19,6 +19,7 @@ import { Theme } from "@mui/material/styles";
|
||||
import createStyles from "@mui/styles/createStyles";
|
||||
import withStyles from "@mui/styles/withStyles";
|
||||
import { IconButton, IconButtonProps } from "@mui/material";
|
||||
import clsx from "clsx";
|
||||
|
||||
const styles = (theme: Theme) =>
|
||||
createStyles({
|
||||
@@ -26,7 +27,8 @@ const styles = (theme: Theme) =>
|
||||
padding: 8,
|
||||
marginLeft: 8,
|
||||
borderWidth: 1,
|
||||
borderColor: theme.palette.primary.main,
|
||||
borderColor: "#696969",
|
||||
color: "#696969",
|
||||
borderStyle: "solid",
|
||||
borderRadius: 3,
|
||||
"& .MuiSvgIcon-root": {
|
||||
@@ -37,17 +39,46 @@ const styles = (theme: Theme) =>
|
||||
borderRadius: 3,
|
||||
opacity: 0.3,
|
||||
},
|
||||
"&:disabled": {
|
||||
color: "#EBEBEB",
|
||||
borderColor: "#EBEBEB",
|
||||
},
|
||||
},
|
||||
contained: {
|
||||
borderColor: theme.palette.primary.main,
|
||||
background: theme.palette.primary.main,
|
||||
color: "white",
|
||||
"& .MuiTouchRipple-root span": {
|
||||
backgroundColor: theme.palette.primary.dark,
|
||||
borderRadius: 3,
|
||||
opacity: 0.3,
|
||||
},
|
||||
"&:hover": {
|
||||
backgroundColor: theme.palette.primary.light,
|
||||
color: "#FFF",
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
interface IBoxIconButton extends IconButtonProps {
|
||||
classes: any;
|
||||
children: any;
|
||||
variant?: "outlined" | "contained";
|
||||
}
|
||||
|
||||
const BoxIconButton = ({ classes, children, ...rest }: IBoxIconButton) => {
|
||||
const BoxIconButton = ({
|
||||
classes,
|
||||
children,
|
||||
variant = "outlined",
|
||||
...rest
|
||||
}: IBoxIconButton) => {
|
||||
return (
|
||||
<IconButton {...rest} className={classes.root}>
|
||||
<IconButton
|
||||
{...rest}
|
||||
className={clsx(classes.root, {
|
||||
[classes.contained]: variant == "contained",
|
||||
})}
|
||||
>
|
||||
{children}
|
||||
</IconButton>
|
||||
);
|
||||
|
||||
@@ -965,13 +965,3 @@ export const commonDashboardInfocard = {
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const linkStyles = (color: string) => ({
|
||||
link: {
|
||||
textDecoration: "underline",
|
||||
color,
|
||||
backgroundColor: "transparent",
|
||||
border: 0,
|
||||
cursor: "pointer",
|
||||
},
|
||||
});
|
||||
|
||||
@@ -27,7 +27,6 @@ import InputAdornment from "@mui/material/InputAdornment";
|
||||
import {
|
||||
actionsTray,
|
||||
containerForHeader,
|
||||
linkStyles,
|
||||
searchField,
|
||||
settingsCommon,
|
||||
typesSelection,
|
||||
@@ -45,6 +44,7 @@ import SearchIcon from "../../../../icons/SearchIcon";
|
||||
import PageHeader from "../../Common/PageHeader/PageHeader";
|
||||
import HelpBox from "../../../../common/HelpBox";
|
||||
import BoxIconButton from "../../Common/BoxIconButton";
|
||||
import AButton from "../../Common/AButton";
|
||||
|
||||
interface IListTiersConfig {
|
||||
classes: any;
|
||||
@@ -78,7 +78,6 @@ const styles = (theme: Theme) =>
|
||||
...settingsCommon.customTitle,
|
||||
marginTop: 0,
|
||||
},
|
||||
...linkStyles(theme.palette.info.main),
|
||||
});
|
||||
|
||||
const ListTiersConfiguration = ({
|
||||
@@ -224,10 +223,10 @@ const ListTiersConfiguration = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={addTier}
|
||||
>
|
||||
Add a Tier
|
||||
Add Tier
|
||||
</Button>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
@@ -342,10 +341,7 @@ const ListTiersConfiguration = ({
|
||||
<br />
|
||||
<br />
|
||||
To get started,{" "}
|
||||
<button onClick={addTier} className={classes.link}>
|
||||
Add Tier
|
||||
</button>
|
||||
.
|
||||
<AButton onClick={addTier}>Add A Tier</AButton>.
|
||||
</Fragment>
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -281,7 +281,7 @@ const DirectCSIMain = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<GroupIcon />}
|
||||
endIcon={<GroupIcon />}
|
||||
disabled={checkedDrives.length <= 0 || notAvailable}
|
||||
onClick={formatSelectedDrives}
|
||||
>
|
||||
@@ -290,7 +290,7 @@ const DirectCSIMain = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={formatAllDrives}
|
||||
disabled={notAvailable}
|
||||
>
|
||||
|
||||
@@ -30,7 +30,6 @@ import { stringSort } from "../../../utils/sortFunctions";
|
||||
import {
|
||||
actionsTray,
|
||||
containerForHeader,
|
||||
linkStyles,
|
||||
searchField,
|
||||
} from "../Common/FormComponents/common/styleLibrary";
|
||||
import { ErrorResponseHandler } from "../../../common/types";
|
||||
@@ -43,6 +42,7 @@ import PageHeader from "../Common/PageHeader/PageHeader";
|
||||
import SearchIcon from "../../../icons/SearchIcon";
|
||||
import HelpBox from "../../../common/HelpBox";
|
||||
import history from "../../../history";
|
||||
import AButton from "../Common/AButton";
|
||||
|
||||
interface IGroupsProps {
|
||||
classes: any;
|
||||
@@ -85,7 +85,6 @@ const styles = (theme: Theme) =>
|
||||
},
|
||||
},
|
||||
},
|
||||
...linkStyles(theme.palette.info.main),
|
||||
...actionsTray,
|
||||
...searchField,
|
||||
...containerForHeader(theme.spacing(4)),
|
||||
@@ -212,7 +211,7 @@ const Groups = ({ classes, setErrorSnackMessage }: IGroupsProps) => {
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={() => {
|
||||
setSelectedGroup(null);
|
||||
setGroupOpen(true);
|
||||
@@ -288,15 +287,14 @@ const Groups = ({ classes, setErrorSnackMessage }: IGroupsProps) => {
|
||||
<br />
|
||||
<br />
|
||||
To get started,{" "}
|
||||
<button
|
||||
<AButton
|
||||
onClick={() => {
|
||||
setSelectedGroup(null);
|
||||
setGroupOpen(true);
|
||||
}}
|
||||
className={classes.link}
|
||||
>
|
||||
Create a Group
|
||||
</button>
|
||||
</AButton>
|
||||
.
|
||||
</Fragment>
|
||||
}
|
||||
|
||||
@@ -224,7 +224,7 @@ const GroupsDetails = ({ classes }: IGroupDetailsProps) => {
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<UsersIcon />}
|
||||
endIcon={<UsersIcon />}
|
||||
size="medium"
|
||||
onClick={() => {
|
||||
setUsersOpen(true);
|
||||
@@ -252,7 +252,7 @@ const GroupsDetails = ({ classes }: IGroupDetailsProps) => {
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<IAMPoliciesIcon />}
|
||||
endIcon={<IAMPoliciesIcon />}
|
||||
size="medium"
|
||||
onClick={() => {
|
||||
setPolicyOpen(true);
|
||||
|
||||
@@ -37,7 +37,6 @@ import { setErrorSnackMessage } from "../../../actions";
|
||||
import {
|
||||
actionsTray,
|
||||
containerForHeader,
|
||||
linkStyles,
|
||||
searchField,
|
||||
settingsCommon,
|
||||
} from "../Common/FormComponents/common/styleLibrary";
|
||||
@@ -48,6 +47,7 @@ import SearchIcon from "../../../icons/SearchIcon";
|
||||
import history from "../../../history";
|
||||
import HelpBox from "../../../common/HelpBox";
|
||||
import BoxIconButton from "../Common/BoxIconButton";
|
||||
import AButton from "../Common/AButton";
|
||||
|
||||
interface IListNotificationEndpoints {
|
||||
classes: any;
|
||||
@@ -75,7 +75,6 @@ const styles = (theme: Theme) =>
|
||||
lambdaContainer: {
|
||||
padding: "15px 0",
|
||||
},
|
||||
...linkStyles(theme.palette.info.main),
|
||||
});
|
||||
|
||||
const ListNotificationEndpoints = ({
|
||||
@@ -173,7 +172,7 @@ const ListNotificationEndpoints = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={() => {
|
||||
history.push("/notification-endpoints/add");
|
||||
}}
|
||||
@@ -257,14 +256,13 @@ const ListNotificationEndpoints = ({
|
||||
<br />
|
||||
<br />
|
||||
To get started,{" "}
|
||||
<button
|
||||
<AButton
|
||||
onClick={() => {
|
||||
history.push("/notification-endpoints/add");
|
||||
}}
|
||||
className={classes.link}
|
||||
>
|
||||
Add a Notification Target
|
||||
</button>
|
||||
</AButton>
|
||||
.
|
||||
</Fragment>
|
||||
}
|
||||
|
||||
@@ -202,7 +202,7 @@ const ListPolicies = ({ classes, setErrorSnackMessage }: IPoliciesProps) => {
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={() => {
|
||||
setAddScreenOpen(true);
|
||||
setPolicyEdit(null);
|
||||
|
||||
@@ -29,7 +29,6 @@ import { NewServiceAccount } from "../../Common/CredentialsPrompt/types";
|
||||
import {
|
||||
actionsTray,
|
||||
containerForHeader,
|
||||
linkStyles,
|
||||
searchField,
|
||||
} from "../../Common/FormComponents/common/styleLibrary";
|
||||
import { setErrorSnackMessage } from "../../../../actions";
|
||||
@@ -44,6 +43,7 @@ import PageHeader from "../../Common/PageHeader/PageHeader";
|
||||
import TenantListItem from "./TenantListItem";
|
||||
import HelpBox from "../../../../common/HelpBox";
|
||||
import BoxIconButton from "../../Common/BoxIconButton";
|
||||
import AButton from "../../Common/AButton";
|
||||
|
||||
interface ITenantsList {
|
||||
classes: any;
|
||||
@@ -107,7 +107,6 @@ const styles = (theme: Theme) =>
|
||||
paddingTop: 30,
|
||||
paddingBottom: 30,
|
||||
},
|
||||
...linkStyles(theme.palette.info.main),
|
||||
});
|
||||
|
||||
const ListTenants = ({ classes, setErrorSnackMessage }: ITenantsList) => {
|
||||
@@ -300,14 +299,13 @@ const ListTenants = ({ classes, setErrorSnackMessage }: ITenantsList) => {
|
||||
<br />
|
||||
<br />
|
||||
To get started,
|
||||
<button
|
||||
className={classes.link}
|
||||
<AButton
|
||||
onClick={() => {
|
||||
history.push("/tenants/add");
|
||||
}}
|
||||
>
|
||||
Create a Tenant.
|
||||
</button>
|
||||
</AButton>
|
||||
</Fragment>
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -130,7 +130,7 @@ const PoolsSummary = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={() => {
|
||||
setAddPool(true);
|
||||
}}
|
||||
|
||||
@@ -34,7 +34,6 @@ import { AddIcon, UsersIcon } from "../../../icons";
|
||||
import {
|
||||
actionsTray,
|
||||
containerForHeader,
|
||||
linkStyles,
|
||||
searchField,
|
||||
} from "../Common/FormComponents/common/styleLibrary";
|
||||
import { setErrorSnackMessage } from "../../../actions";
|
||||
@@ -48,6 +47,7 @@ import PageHeader from "../Common/PageHeader/PageHeader";
|
||||
import SearchIcon from "../../../icons/SearchIcon";
|
||||
import { decodeFileName } from "../../../common/utils";
|
||||
import HelpBox from "../../../common/HelpBox";
|
||||
import AButton from "../Common/AButton";
|
||||
|
||||
const styles = (theme: Theme) =>
|
||||
createStyles({
|
||||
@@ -87,7 +87,6 @@ const styles = (theme: Theme) =>
|
||||
...actionsTray,
|
||||
...searchField,
|
||||
...containerForHeader(theme.spacing(4)),
|
||||
...linkStyles(theme.palette.info.main),
|
||||
});
|
||||
|
||||
interface IUsersProps {
|
||||
@@ -253,7 +252,7 @@ const ListUsers = ({ classes, setErrorSnackMessage, history }: IUsersProps) => {
|
||||
<Button
|
||||
variant="outlined"
|
||||
color="primary"
|
||||
startIcon={<GroupIcon />}
|
||||
endIcon={<GroupIcon />}
|
||||
disabled={checkedUsers.length <= 0}
|
||||
onClick={() => {
|
||||
if (checkedUsers.length > 0) {
|
||||
@@ -266,7 +265,7 @@ const ListUsers = ({ classes, setErrorSnackMessage, history }: IUsersProps) => {
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={() => {
|
||||
setAddScreenOpen(true);
|
||||
setSelectedUser(null);
|
||||
@@ -358,15 +357,14 @@ const ListUsers = ({ classes, setErrorSnackMessage, history }: IUsersProps) => {
|
||||
<br />
|
||||
<br />
|
||||
To get started,{" "}
|
||||
<button
|
||||
<AButton
|
||||
onClick={() => {
|
||||
setAddScreenOpen(true);
|
||||
setSelectedUser(null);
|
||||
}}
|
||||
className={classes.link}
|
||||
>
|
||||
Create a User
|
||||
</button>
|
||||
</AButton>
|
||||
.
|
||||
</Fragment>
|
||||
}
|
||||
|
||||
@@ -367,7 +367,7 @@ const UserDetails = ({ classes, match }: IUserDetailsProps) => {
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
size="medium"
|
||||
onClick={() => {
|
||||
setAddGroupOpen(true);
|
||||
@@ -398,7 +398,7 @@ const UserDetails = ({ classes, match }: IUserDetailsProps) => {
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<IAMPoliciesIcon />}
|
||||
endIcon={<IAMPoliciesIcon />}
|
||||
size="medium"
|
||||
onClick={() => {
|
||||
setPolicyOpen(true);
|
||||
|
||||
@@ -167,7 +167,7 @@ const UserServiceAccountsPanel = ({
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
startIcon={<AddIcon />}
|
||||
endIcon={<AddIcon />}
|
||||
onClick={() => {
|
||||
setAddScreenOpen(true);
|
||||
setAddScreenOpen(true);
|
||||
|
||||
@@ -423,7 +423,7 @@ const Login = ({
|
||||
onClick={() => {
|
||||
fetchConfiguration();
|
||||
}}
|
||||
startIcon={<RefreshIcon />}
|
||||
endIcon={<RefreshIcon />}
|
||||
color={"primary"}
|
||||
className={classes.retryButton}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user