Skip to content

Commit 37195fe

Browse files
authored
Set Policy UI (#138)
1 parent 13ef83c commit 37195fe

File tree

5 files changed

+245
-2
lines changed

5 files changed

+245
-2
lines changed

portal-ui/src/screens/Console/Common/TableWrapper/TableActionButton.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import ViewIcon from "./TableActionIcons/ViewIcon";
2020
import PencilIcon from "./TableActionIcons/PencilIcon";
2121
import DeleteIcon from "./TableActionIcons/DeleteIcon";
2222
import { Link } from "react-router-dom";
23+
import DescriptionIcon from "@material-ui/icons/Description";
2324

2425
interface IActionButton {
2526
type: string;
@@ -39,6 +40,8 @@ const defineIcon = (type: string, selected: boolean) => {
3940
return <PencilIcon active={selected} />;
4041
case "delete":
4142
return <DeleteIcon active={selected} />;
43+
case "description":
44+
return <DescriptionIcon />;
4245
}
4346

4447
return null;
@@ -51,13 +54,14 @@ const TableActionButton = ({
5154
idField,
5255
selected,
5356
to,
54-
sendOnlyId = false
57+
sendOnlyId = false,
5558
}: IActionButton) => {
5659
const valueClick = sendOnlyId ? valueToSend[idField] : valueToSend;
5760

5861
const buttonElement = (
5962
<IconButton
6063
aria-label={type}
64+
size={"small"}
6165
onClick={
6266
onClick
6367
? () => {

portal-ui/src/screens/Console/Common/TableWrapper/TableWrapper.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ const styles = (theme: Theme) =>
130130
},
131131
},
132132
actionsContainer: {
133-
width: 120,
133+
width: 150,
134134
borderColor: borderColor,
135135
},
136136
paginatorComponent: {
Lines changed: 201 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,201 @@
1+
// This file is part of MinIO Console Server
2+
// Copyright (c) 2020 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, { useCallback, useEffect, useState } from "react";
18+
import { createStyles, Theme, withStyles } from "@material-ui/core/styles";
19+
import {
20+
Button,
21+
FormControlLabel,
22+
LinearProgress,
23+
Paper,
24+
Switch,
25+
Table,
26+
TableBody,
27+
TableCell,
28+
TableContainer,
29+
TableHead,
30+
TableRow,
31+
} from "@material-ui/core";
32+
import Grid from "@material-ui/core/Grid";
33+
import InputBoxWrapper from "../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
34+
import { RadioGroupSelector } from "../Common/FormComponents/RadioGroupSelector/RadioGroupSelector";
35+
import { modalBasic } from "../Common/FormComponents/common/styleLibrary";
36+
import { IElementValue } from "../Configurations/types";
37+
import { User } from "../Users/types";
38+
import ModalWrapper from "../Common/ModalWrapper/ModalWrapper";
39+
import { Policy, PolicyList } from "./types";
40+
import api from "../../../common/api";
41+
import { policySort } from "../../../utils/sortFunctions";
42+
43+
interface ISetPolicyProps {
44+
classes: any;
45+
closeModalAndRefresh: () => void;
46+
selectedUser: User | null;
47+
open: boolean;
48+
}
49+
50+
const styles = (theme: Theme) =>
51+
createStyles({
52+
...modalBasic,
53+
});
54+
55+
const SetPolicy = ({
56+
classes,
57+
closeModalAndRefresh,
58+
selectedUser,
59+
open,
60+
}: ISetPolicyProps) => {
61+
//Local States
62+
const [useConnectionString, setUseConnectionString] = useState<boolean>(
63+
false
64+
);
65+
const [connectionString, setConnectionString] = useState<string>("");
66+
const [host, setHostname] = useState<string>("");
67+
const [dbName, setDbName] = useState<string>("");
68+
const [port, setPort] = useState<string>("");
69+
const [user, setUser] = useState<string>("");
70+
const [password, setPassword] = useState<string>("");
71+
const [sslMode, setSslMode] = useState<string>("require");
72+
73+
const [table, setTable] = useState<string>("");
74+
const [format, setFormat] = useState<string>("namespace");
75+
const [queueDir, setQueueDir] = useState<string>("");
76+
const [queueLimit, setQueueLimit] = useState<string>("");
77+
const [comment, setComment] = useState<string>("");
78+
79+
const [records, setRecords] = useState<Policy[]>([]);
80+
const [loading, setLoading] = useState<boolean>(false);
81+
const [error, setError] = useState<string>("");
82+
83+
const fetchRecords = () => {
84+
setLoading(true);
85+
86+
api
87+
.invoke("GET", `/api/v1/policies?limit=1000`)
88+
.then((res: PolicyList) => {
89+
const policies = res.policies === null ? [] : res.policies;
90+
setLoading(false);
91+
setRecords(policies.sort(policySort));
92+
setError("");
93+
})
94+
.catch((err) => {
95+
setLoading(false);
96+
setError(err);
97+
});
98+
};
99+
100+
const setPolicyAction = (policyName: string) => {
101+
if (selectedUser === null) {
102+
return;
103+
}
104+
setLoading(true);
105+
106+
api
107+
.invoke("PUT", `/api/v1/set-policy/${policyName}`, {
108+
entityName: selectedUser!.accessKey,
109+
entityType: "user",
110+
})
111+
.then((res: any) => {
112+
setLoading(false);
113+
setError("");
114+
closeModalAndRefresh();
115+
})
116+
.catch((err) => {
117+
setLoading(false);
118+
setError(err);
119+
});
120+
};
121+
122+
useEffect(() => {
123+
if (open) {
124+
console.log("im open");
125+
console.log(selectedUser);
126+
fetchRecords();
127+
}
128+
}, []);
129+
130+
return (
131+
<ModalWrapper
132+
onClose={() => {
133+
closeModalAndRefresh();
134+
}}
135+
modalOpen={open}
136+
title={
137+
selectedUser !== null ? "Set Policy to User" : "Set Policy to Group"
138+
}
139+
>
140+
<Grid container className={classes.formScrollable}>
141+
<Grid item xs={12}>
142+
<TableContainer component={Paper}>
143+
<Table
144+
className={classes.table}
145+
size="small"
146+
aria-label="a dense table"
147+
>
148+
<TableHead>
149+
<TableRow>
150+
<TableCell>Policy</TableCell>
151+
<TableCell align="right"></TableCell>
152+
</TableRow>
153+
</TableHead>
154+
<TableBody>
155+
{records.map((row) => (
156+
<TableRow key={row.name}>
157+
<TableCell component="th" scope="row">
158+
{row.name}
159+
</TableCell>
160+
<TableCell align="right">
161+
<Button
162+
variant="contained"
163+
color="primary"
164+
size={"small"}
165+
onClick={() => {
166+
setPolicyAction(row.name);
167+
}}
168+
>
169+
Set
170+
</Button>
171+
</TableCell>
172+
</TableRow>
173+
))}
174+
</TableBody>
175+
</Table>
176+
</TableContainer>
177+
</Grid>
178+
<Grid item xs={12} className={classes.buttonContainer}>
179+
<Button
180+
type="submit"
181+
variant="contained"
182+
color="primary"
183+
size={"small"}
184+
onClick={() => {
185+
closeModalAndRefresh();
186+
}}
187+
>
188+
Cancel
189+
</Button>
190+
</Grid>
191+
{loading && (
192+
<Grid item xs={12}>
193+
<LinearProgress />
194+
</Grid>
195+
)}
196+
</Grid>
197+
</ModalWrapper>
198+
);
199+
};
200+
201+
export default withStyles(styles)(SetPolicy);

portal-ui/src/screens/Console/Users/Users.tsx

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,8 @@ import AddUser from "./AddUser";
3434
import DeleteUser from "./DeleteUser";
3535
import AddToGroup from "./AddToGroup";
3636
import TableWrapper from "../Common/TableWrapper/TableWrapper";
37+
import DescriptionIcon from "@material-ui/icons/Description";
38+
import SetPolicy from "../Policies/SetPolicy";
3739

3840
const styles = (theme: Theme) =>
3941
createStyles({
@@ -102,6 +104,7 @@ interface IUsersState {
102104
addGroupOpen: boolean;
103105
filter: string;
104106
checkedUsers: string[];
107+
setPolicyOpen: boolean;
105108
}
106109

107110
class Users extends React.Component<IUsersProps, IUsersState> {
@@ -119,6 +122,7 @@ class Users extends React.Component<IUsersProps, IUsersState> {
119122
addGroupOpen: false,
120123
filter: "",
121124
checkedUsers: [],
125+
setPolicyOpen: false,
122126
};
123127

124128
fetchRecords() {
@@ -192,6 +196,7 @@ class Users extends React.Component<IUsersProps, IUsersState> {
192196
filter,
193197
checkedUsers,
194198
addGroupOpen,
199+
setPolicyOpen,
195200
} = this.state;
196201

197202
const handleChangePage = (event: unknown, newPage: number) => {
@@ -243,6 +248,14 @@ class Users extends React.Component<IUsersProps, IUsersState> {
243248
});
244249
};
245250

251+
const setPolicyAction = (selectionElement: any): void => {
252+
console.log("click");
253+
this.setState({
254+
setPolicyOpen: true,
255+
selectedUser: selectionElement,
256+
});
257+
};
258+
246259
const deleteAction = (selectionElement: any): void => {
247260
this.setState({
248261
deleteOpen: true,
@@ -251,6 +264,7 @@ class Users extends React.Component<IUsersProps, IUsersState> {
251264
};
252265

253266
const tableActions = [
267+
{ type: "description", onClick: setPolicyAction },
254268
{ type: "view", onClick: viewAction },
255269
{ type: "delete", onClick: deleteAction },
256270
];
@@ -266,6 +280,15 @@ class Users extends React.Component<IUsersProps, IUsersState> {
266280
}}
267281
/>
268282
)}
283+
{setPolicyOpen && (
284+
<SetPolicy
285+
open={setPolicyOpen}
286+
selectedUser={selectedUser}
287+
closeModalAndRefresh={() => {
288+
this.setState({ setPolicyOpen: false });
289+
}}
290+
/>
291+
)}
269292
{deleteOpen && (
270293
<DeleteUser
271294
deleteOpen={deleteOpen}

portal-ui/src/utils/sortFunctions.ts

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,10 @@ interface userInterface {
1818
accessKey: string;
1919
}
2020

21+
interface policyInterface {
22+
name: string;
23+
}
24+
2125
export const usersSort = (a: userInterface, b: userInterface) => {
2226
if (a.accessKey > b.accessKey) {
2327
return 1;
@@ -29,6 +33,17 @@ export const usersSort = (a: userInterface, b: userInterface) => {
2933
return 0;
3034
};
3135

36+
export const policySort = (a: policyInterface, b: policyInterface) => {
37+
if (a.name > b.name) {
38+
return 1;
39+
}
40+
if (a.name < b.name) {
41+
return -1;
42+
}
43+
// a must be equal to b
44+
return 0;
45+
};
46+
3247
export const stringSort = (a: string, b: string) => {
3348
if (a > b) {
3449
return 1;

0 commit comments

Comments
 (0)