diff --git a/portal-ui/src/screens/Console/Policies/PolicyBuilder.tsx b/portal-ui/src/screens/Console/Policies/PolicyBuilder.tsx new file mode 100644 index 000000000..a9b30af09 --- /dev/null +++ b/portal-ui/src/screens/Console/Policies/PolicyBuilder.tsx @@ -0,0 +1,157 @@ +// This file is part of MinIO Kubernetes Cloud +// Copyright (c) 2020 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 . + +import React from "react"; +import {createStyles, Theme, withStyles} from "@material-ui/core/styles"; +import Grid from "@material-ui/core/Grid"; +import remove from "lodash/remove"; +import {Checkbox, FormControlLabel, FormGroup, FormLabel, Paper, Radio, RadioGroup} from "@material-ui/core"; +import {Statement} from "./types"; + +const styles = (theme: Theme) => + createStyles({ + root: { + flexGrow: 1, + }, + errorBlock: { + color: "red" + }, + jsonPolicyEditor: { + minHeight: 400, + width: "100%" + }, + codeMirror: { + fontSize: 14 + }, + paper: { + padding: theme.spacing(1), + textAlign: 'center', + color: theme.palette.text.secondary, + }, + }); + +interface IPolicyBuilderProps { + classes: any; + policyDefinition: string; +} + +interface IPolicyBuilderState { + policyString: string; + currentStatement: Statement; + statements: Statement[]; + currentStatementWrite: boolean; + currentStatementRead: boolean; +} + +class PolicyBuilder extends React.Component { + state: IPolicyBuilderState = { + policyString: "", + statements: [], + currentStatement: { + effect: "", + actions: [], + resources: [], + }, + currentStatementWrite: false, + currentStatementRead: false, + }; + + render() { + const { classes, policyDefinition } = this.props; + const { currentStatement,currentStatementWrite, currentStatementRead } = this.state; + console.log(currentStatement); + return ( +
+ + + + + + Effect + , value: string) => { + this.setState( { currentStatement: { ...currentStatement, effect: value }}); + }} + > + } label="Deny" /> + } label="Allow" /> + + + + + + Actions + + , checked: boolean) => { + const readActions = ["s3:ListBucket", "s3:GetObject", "s3:GetBucketLocation"]; + let actions = currentStatement.actions; + if (checked) { + actions.push(...readActions) + } else { + actions = remove(actions, (action) => readActions.includes(action)) + } + this.setState( { currentStatement: { ...currentStatement, actions: actions }}); + this.setState( { currentStatementRead: checked }); + }} + name="read" + /> + } + label="Read Only" + /> + , checked: boolean) => { + const writeActions = ["s3:PutObject"]; + let actions = currentStatement.actions; + if (checked) { + actions.push(...writeActions) + } else { + actions = remove(actions, (action) => writeActions.includes(action)) + } + this.setState( { currentStatement: { ...currentStatement, actions: actions }}); + this.setState( { currentStatementWrite: checked }); + }} + name="write" + /> + } + label="Write Only" + /> + + + + + + Resources + + + + + +
+ ) + } +} + +export default withStyles(styles)(PolicyBuilder);