keycloak-scim/src/groups/GroupsCreateModal.tsx
2020-09-30 09:55:18 -04:00

68 lines
2 KiB
TypeScript

import React, {useState, useContext} from "react";
import {
AlertVariant,
Button,
Form,
FormGroup,
Modal,
ModalVariant,
TextInput
} from "@patternfly/react-core";
import { useTranslation } from "react-i18next";
import { HttpClientContext } from "../http-service/HttpClientContext";
import { RealmContext } from "../components/realm-context/RealmContext";
import { useAlerts } from "../components/alert/Alerts";
export const GroupsCreateModal = ({isCreateModalOpen, handleModalToggle, setIsCreateModalOpen, createGroupName, setCreateGroupName}) => {
const { t } = useTranslation("groups");
const httpClient = useContext(HttpClientContext)!;
const { realm } = useContext(RealmContext);
const [ nameValue, setNameValue ] = useState("");
const [add, Alerts] = useAlerts();
const valueChange = (createGroupName: string) => {
setCreateGroupName(createGroupName)
}
const submitForm = async () => {
try {
await httpClient.doPost(`/admin/realms/${realm}/groups`, {name: createGroupName});
setIsCreateModalOpen(false);
setCreateGroupName("");
add("Client created", AlertVariant.success);
// window.location.reload(false);
} catch (error) {
add(`Could not create client: '${error}'`, AlertVariant.danger);
}
}
return (
<React.Fragment>
<Alerts />
<Modal
variant={ModalVariant.small}
title="Create a group"
isOpen={isCreateModalOpen}
onClose={handleModalToggle}
actions={[
<Button key="confirm" variant="primary" onClick={() => submitForm()}>
Create
</Button>
]}
>
<Form isHorizontal>
<FormGroup label={t("name")} fieldId="kc-root-url">
<TextInput
type="text"
id="create-group-name"
name="Name"
value={createGroupName}
onChange={valueChange}
/>
</FormGroup>
</Form>
</Modal>
</React.Fragment>
);
};