You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
103 lines
2.9 KiB
103 lines
2.9 KiB
import React, {useState} from "react";
|
|
import useAuth from "../../Hooks/auth";
|
|
import {
|
|
Button,
|
|
Col,
|
|
Form,
|
|
FormGroup,
|
|
Input,
|
|
InputGroup,
|
|
InputGroupAddon,
|
|
Label,
|
|
Modal,
|
|
ModalBody,
|
|
ModalFooter,
|
|
ModalHeader,
|
|
Row
|
|
} from "reactstrap";
|
|
import PermissionsModal from "./PermissionsModal";
|
|
import {saveGroupMetadata} from "../../Helpers/groups";
|
|
|
|
function GroupPropertiesModal({id, nValue, permissions, onClose}) {
|
|
const {users} = useAuth();
|
|
const [name, setName] = useState(nValue);
|
|
const [permUserId, setPermUserId] = useState(null);
|
|
const [permModal, setPermModal] = useState(false);
|
|
|
|
function permissionFor(userId) {
|
|
const perm = permissions.find(p => p.userId === userId);
|
|
|
|
return typeof perm !== "undefined"
|
|
? perm
|
|
: null;
|
|
}
|
|
|
|
return (
|
|
<Modal isOpen={true}>
|
|
<ModalHeader>Endre gruppe</ModalHeader>
|
|
<ModalBody style={{margin: "0 auto"}}>
|
|
<Form>
|
|
<FormGroup row>
|
|
<Label sm={3} for="text-name">
|
|
Navn:
|
|
</Label>
|
|
<Col sm={9}>
|
|
<Input type="text"
|
|
id="text-name"
|
|
name="power"
|
|
value={name}
|
|
onChange={e => setName(e.target.value)}/>
|
|
</Col>
|
|
</FormGroup>
|
|
<FormGroup row>
|
|
<Label sm={3}>
|
|
Tilgang:
|
|
</Label>
|
|
<Col sm={9}>
|
|
{users.map(user => {
|
|
const permission = permissionFor(user.id);
|
|
const btnColor = permission !== null ? "secondary" : "success";
|
|
const btnLabel = permission !== null ? "Endre" : "Opprett";
|
|
|
|
return (
|
|
<Row>
|
|
<InputGroup className="mb-2">
|
|
<Input className="permission" disabled value={user.name}/>
|
|
<InputGroupAddon addonType="prepend">
|
|
<Button color={btnColor} onClick={() => {
|
|
setPermUserId(user.id);
|
|
setPermModal(true);
|
|
}}>{btnLabel}</Button>
|
|
</InputGroupAddon>
|
|
</InputGroup>
|
|
</Row>
|
|
)
|
|
})}
|
|
</Col>
|
|
</FormGroup>
|
|
</Form>
|
|
</ModalBody>
|
|
<ModalFooter>
|
|
<Button color="primary"
|
|
onClick={() => {
|
|
saveGroupMetadata(id, name);
|
|
onClose();
|
|
}}
|
|
>
|
|
Lagre
|
|
</Button>
|
|
{" "}
|
|
<Button color="secondary" onClick={onClose}>Avbryt</Button>
|
|
</ModalFooter>
|
|
{permModal && (
|
|
<PermissionsModal permissions={permissionFor(permUserId)}
|
|
groupId={id}
|
|
userId={permUserId}
|
|
onClose={() => setPermModal(false)}
|
|
/>
|
|
)}
|
|
</Modal>
|
|
);
|
|
}
|
|
|
|
export default GroupPropertiesModal;
|