github.com/minio/console@v1.4.1/web-app/src/screens/Console/Groups/AddGroupMember.tsx (about) 1 // This file is part of MinIO Console Server 2 // Copyright (c) 2023 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, { useState } from "react"; 18 import { AddMembersToGroupIcon, Button, FormLayout, Grid, ReadBox } from "mds"; 19 import { modalStyleUtils } from "../Common/FormComponents/common/styleLibrary"; 20 import { encodeURLString } from "../../../common/utils"; 21 import { setModalErrorSnackMessage } from "../../../systemSlice"; 22 import { useAppDispatch } from "../../../store"; 23 import { api } from "api"; 24 import { errorToHandler } from "api/errors"; 25 import UsersSelectors from "./UsersSelectors"; 26 import ModalWrapper from "../Common/ModalWrapper/ModalWrapper"; 27 28 type UserPickerModalProps = { 29 title?: string; 30 preSelectedUsers?: string[]; 31 selectedGroup?: string; 32 open: boolean; 33 onClose: () => void; 34 onSaveClick: () => void; 35 groupStatus?: string; 36 }; 37 38 const AddGroupMember = ({ 39 title = "", 40 groupStatus = "enabled", 41 preSelectedUsers = [], 42 selectedGroup = "", 43 open, 44 onClose, 45 }: UserPickerModalProps) => { 46 const dispatch = useAppDispatch(); 47 const [selectedUsers, setSelectedUsers] = useState(preSelectedUsers); 48 49 function addMembersToGroup() { 50 return api.group 51 .updateGroup(encodeURLString(selectedGroup), { 52 members: selectedUsers, 53 status: groupStatus, 54 }) 55 .then(() => { 56 onClose(); 57 }) 58 .catch((err) => { 59 onClose(); 60 dispatch(setModalErrorSnackMessage(errorToHandler(err.error))); 61 }); 62 } 63 64 return ( 65 <ModalWrapper 66 modalOpen={open} 67 onClose={onClose} 68 title={title} 69 titleIcon={<AddMembersToGroupIcon />} 70 > 71 <FormLayout withBorders={false} containerPadding={false}> 72 <ReadBox label={`Selected Group`} sx={{ width: "100%" }}> 73 {selectedGroup} 74 </ReadBox> 75 <UsersSelectors 76 selectedUsers={selectedUsers} 77 setSelectedUsers={setSelectedUsers} 78 editMode={!selectedGroup} 79 /> 80 </FormLayout> 81 <Grid item xs={12} sx={modalStyleUtils.modalButtonBar}> 82 <Button 83 id={"reset-add-group-member"} 84 type="button" 85 variant="regular" 86 onClick={() => { 87 setSelectedUsers(preSelectedUsers); 88 }} 89 label={"Reset"} 90 /> 91 92 <Button 93 id={"save-add-group-member"} 94 type="button" 95 variant="callAction" 96 onClick={() => { 97 addMembersToGroup(); 98 }} 99 label={"Save"} 100 /> 101 </Grid> 102 </ModalWrapper> 103 ); 104 }; 105 106 export default AddGroupMember;