|
| 1 | +// This file is part of MinIO Console Server |
| 2 | +// Copyright (c) 2021 MinIO, Inc. |
| 3 | +// |
| 4 | +// This program is free software: you can redistribute it and/or modify |
| 5 | +// it under the terms of the GNU Affero General Public License as published by |
| 6 | +// the Free Software Foundation, either version 3 of the License, or |
| 7 | +// (at your option) any later version. |
| 8 | +// |
| 9 | +// This program is distributed in the hope that it will be useful, |
| 10 | +// but WITHOUT ANY WARRANTY; without even the implied warranty of |
| 11 | +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
| 12 | +// GNU Affero General Public License for more details. |
| 13 | +// |
| 14 | +// You should have received a copy of the GNU Affero General Public License |
| 15 | +// along with this program. If not, see <http://www.gnu.org/licenses/>. |
| 16 | + |
| 17 | +import React, { useEffect, useState } from "react"; |
| 18 | +import { connect } from "react-redux"; |
| 19 | +import Grid from "@material-ui/core/Grid"; |
| 20 | +import { Button, LinearProgress } from "@material-ui/core"; |
| 21 | +import { createStyles, Theme, withStyles } from "@material-ui/core/styles"; |
| 22 | +import { modalBasic } from "../Common/FormComponents/common/styleLibrary"; |
| 23 | +import { NewServiceAccount } from "../Common/CredentialsPrompt/types"; |
| 24 | +import { setModalErrorSnackMessage } from "../../../actions"; |
| 25 | +import { ErrorResponseHandler } from "../../../common/types"; |
| 26 | +import ModalWrapper from "../Common/ModalWrapper/ModalWrapper"; |
| 27 | +import api from "../../../common/api"; |
| 28 | +import CodeMirrorWrapper from "../Common/FormComponents/CodeMirrorWrapper/CodeMirrorWrapper"; |
| 29 | +import FormSwitchWrapper from "../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper"; |
| 30 | + |
| 31 | +const styles = (theme: Theme) => |
| 32 | + createStyles({ |
| 33 | + jsonPolicyEditor: { |
| 34 | + minHeight: 400, |
| 35 | + width: "100%", |
| 36 | + }, |
| 37 | + buttonContainer: { |
| 38 | + textAlign: "right", |
| 39 | + }, |
| 40 | + infoDetails: { |
| 41 | + color: "#393939", |
| 42 | + fontSize: 12, |
| 43 | + fontStyle: "italic", |
| 44 | + marginBottom: "8px", |
| 45 | + }, |
| 46 | + containerScrollable: { |
| 47 | + maxHeight: "calc(100vh - 300px)" as const, |
| 48 | + overflowY: "auto" as const, |
| 49 | + }, |
| 50 | + ...modalBasic, |
| 51 | + }); |
| 52 | + |
| 53 | +interface IAddUserServiceAccountProps { |
| 54 | + classes: any; |
| 55 | + open: boolean; |
| 56 | + user: string; |
| 57 | + closeModalAndRefresh: (res: NewServiceAccount | null) => void; |
| 58 | + setModalErrorSnackMessage: typeof setModalErrorSnackMessage; |
| 59 | +} |
| 60 | + |
| 61 | +const AddUserServiceAccount = ({ |
| 62 | + classes, |
| 63 | + open, |
| 64 | + closeModalAndRefresh, |
| 65 | + setModalErrorSnackMessage, |
| 66 | + user, |
| 67 | +}: IAddUserServiceAccountProps) => { |
| 68 | + const [addSending, setAddSending] = useState<boolean>(false); |
| 69 | + const [policyDefinition, setPolicyDefinition] = useState<string>(""); |
| 70 | + const [isRestrictedByPolicy, setIsRestrictedByPolicy] = |
| 71 | + useState<boolean>(false); |
| 72 | + |
| 73 | + useEffect(() => { |
| 74 | + if (addSending) { |
| 75 | + api |
| 76 | + .invoke("POST", `/api/v1/user/${user}/service-accounts`, { |
| 77 | + policy: policyDefinition, |
| 78 | + }) |
| 79 | + .then((res) => { |
| 80 | + setAddSending(false); |
| 81 | + closeModalAndRefresh(res); |
| 82 | + }) |
| 83 | + .catch((err: ErrorResponseHandler) => { |
| 84 | + setAddSending(false); |
| 85 | + setModalErrorSnackMessage(err); |
| 86 | + }); |
| 87 | + } |
| 88 | + }, [ |
| 89 | + addSending, |
| 90 | + setAddSending, |
| 91 | + setModalErrorSnackMessage, |
| 92 | + policyDefinition, |
| 93 | + closeModalAndRefresh, |
| 94 | + user, |
| 95 | + ]); |
| 96 | + |
| 97 | + const addUserServiceAccount = (e: React.FormEvent) => { |
| 98 | + e.preventDefault(); |
| 99 | + setAddSending(true); |
| 100 | + }; |
| 101 | + |
| 102 | + const resetForm = () => { |
| 103 | + setPolicyDefinition(""); |
| 104 | + }; |
| 105 | + |
| 106 | + return ( |
| 107 | + <ModalWrapper |
| 108 | + modalOpen={open} |
| 109 | + onClose={() => { |
| 110 | + closeModalAndRefresh(null); |
| 111 | + }} |
| 112 | + title={`Create Service Account`} |
| 113 | + > |
| 114 | + <form |
| 115 | + noValidate |
| 116 | + autoComplete="off" |
| 117 | + onSubmit={(e: React.FormEvent<HTMLFormElement>) => { |
| 118 | + addUserServiceAccount(e); |
| 119 | + }} |
| 120 | + > |
| 121 | + <Grid container className={classes.containerScrollable}> |
| 122 | + <Grid item xs={12}> |
| 123 | + <div className={classes.infoDetails}> |
| 124 | + Service Accounts inherit the policy explicitly attached to the |
| 125 | + parent user and the policy attached to each group in which the |
| 126 | + parent user has membership. You can specify an optional |
| 127 | + JSON-formatted policy below to restrict the Service Account access |
| 128 | + to a subset of actions and resources explicitly allowed for the |
| 129 | + parent user. You cannot modify the Service Account optional policy |
| 130 | + after saving. |
| 131 | + </div> |
| 132 | + </Grid> |
| 133 | + <Grid item xs={12}> |
| 134 | + <FormSwitchWrapper |
| 135 | + value="locking" |
| 136 | + id="locking" |
| 137 | + name="locking" |
| 138 | + checked={isRestrictedByPolicy} |
| 139 | + onChange={(event: React.ChangeEvent<HTMLInputElement>) => { |
| 140 | + setIsRestrictedByPolicy(event.target.checked); |
| 141 | + }} |
| 142 | + label={"Restrict with policy"} |
| 143 | + indicatorLabels={["On", "Off"]} |
| 144 | + /> |
| 145 | + </Grid> |
| 146 | + {isRestrictedByPolicy && ( |
| 147 | + <Grid item xs={12}> |
| 148 | + <CodeMirrorWrapper |
| 149 | + value={policyDefinition} |
| 150 | + onBeforeChange={(editor, data, value) => { |
| 151 | + setPolicyDefinition(value); |
| 152 | + }} |
| 153 | + /> |
| 154 | + </Grid> |
| 155 | + )} |
| 156 | + </Grid> |
| 157 | + <Grid container> |
| 158 | + <Grid item xs={12} className={classes.buttonContainer}> |
| 159 | + <button |
| 160 | + type="button" |
| 161 | + color="primary" |
| 162 | + className={classes.clearButton} |
| 163 | + onClick={resetForm} |
| 164 | + > |
| 165 | + Clear |
| 166 | + </button> |
| 167 | + <Button |
| 168 | + type="submit" |
| 169 | + variant="contained" |
| 170 | + color="primary" |
| 171 | + disabled={addSending} |
| 172 | + > |
| 173 | + Create |
| 174 | + </Button> |
| 175 | + </Grid> |
| 176 | + {addSending && ( |
| 177 | + <Grid item xs={12}> |
| 178 | + <LinearProgress /> |
| 179 | + </Grid> |
| 180 | + )} |
| 181 | + </Grid> |
| 182 | + </form> |
| 183 | + </ModalWrapper> |
| 184 | + ); |
| 185 | +}; |
| 186 | + |
| 187 | +const mapDispatchToProps = { |
| 188 | + setModalErrorSnackMessage, |
| 189 | +}; |
| 190 | + |
| 191 | +const connector = connect(null, mapDispatchToProps); |
| 192 | + |
| 193 | +export default withStyles(styles)(connector(AddUserServiceAccount)); |
0 commit comments