replaced KeycloakTextInput with TextControl (#27711)

Signed-off-by: Agnieszka Gancarczyk <agancarc@redhat.com>
Co-authored-by: Agnieszka Gancarczyk <agancarc@redhat.com>
This commit is contained in:
agagancarczyk 2024-03-08 12:26:45 +00:00 committed by GitHub
parent 299118c45a
commit 7695532011
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 15 additions and 32 deletions

View file

@ -2,7 +2,7 @@ import ModalUtils from "../../../../util/ModalUtils";
export default class GroupModal extends ModalUtils { export default class GroupModal extends ModalUtils {
#createGroupModalTitle = "Create a group"; #createGroupModalTitle = "Create a group";
#groupNameInput = "groupNameInput"; #groupNameInput = "name";
#createGroupBnt = "createGroup"; #createGroupBnt = "createGroup";
#renameButton = "renameGroup"; #renameButton = "renameGroup";

View file

@ -20,7 +20,7 @@ export default class GroupDetailPage extends GroupPage {
#actionDrpDwnItemRenameGroup = "renameGroupAction"; #actionDrpDwnItemRenameGroup = "renameGroupAction";
#actionDrpDwnItemDeleteGroup = "deleteGroup"; #actionDrpDwnItemDeleteGroup = "deleteGroup";
#headerGroupName = ".pf-l-level.pf-m-gutter"; #headerGroupName = ".pf-l-level.pf-m-gutter";
#renameGroupModalGroupNameInput = "groupNameInput"; #renameGroupModalGroupNameInput = "name";
#renameGroupModalRenameBtn = "renameGroup"; #renameGroupModalRenameBtn = "renameGroup";
#permissionSwitch = "permissionSwitch"; #permissionSwitch = "permissionSwitch";

View file

@ -4,17 +4,14 @@ import {
Button, Button,
ButtonVariant, ButtonVariant,
Form, Form,
FormGroup,
Modal, Modal,
ModalVariant, ModalVariant,
ValidatedOptions,
} from "@patternfly/react-core"; } from "@patternfly/react-core";
import { useForm } from "react-hook-form"; import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { TextControl } from "ui-shared";
import { adminClient } from "../admin-client"; import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts"; import { useAlerts } from "../components/alert/Alerts";
import { KeycloakTextInput } from "../components/keycloak-text-input/KeycloakTextInput";
type GroupsModalProps = { type GroupsModalProps = {
id?: string; id?: string;
@ -31,13 +28,11 @@ export const GroupsModal = ({
}: GroupsModalProps) => { }: GroupsModalProps) => {
const { t } = useTranslation(); const { t } = useTranslation();
const { addAlert, addError } = useAlerts(); const { addAlert, addError } = useAlerts();
const {
register, const form = useForm({
handleSubmit,
formState: { errors },
} = useForm({
defaultValues: { name: rename?.name }, defaultValues: { name: rename?.name },
}); });
const { handleSubmit } = form;
const submitForm = async (group: GroupRepresentation) => { const submitForm = async (group: GroupRepresentation) => {
group.name = group.name?.trim(); group.name = group.name?.trim();
@ -96,28 +91,16 @@ export const GroupsModal = ({
</Button>, </Button>,
]} ]}
> >
<Form id="group-form" isHorizontal onSubmit={handleSubmit(submitForm)}> <FormProvider {...form}>
<FormGroup <Form id="group-form" isHorizontal onSubmit={handleSubmit(submitForm)}>
name="create-modal-group" <TextControl
label={t("name")} name="name"
fieldId="create-group-name" label={t("name")}
helperTextInvalid={t("required")} rules={{ required: t("required") }}
validated={
errors.name ? ValidatedOptions.error : ValidatedOptions.default
}
isRequired
>
<KeycloakTextInput
data-testid="groupNameInput"
autoFocus autoFocus
id="create-group-name"
validated={
errors.name ? ValidatedOptions.error : ValidatedOptions.default
}
{...register("name", { required: true })}
/> />
</FormGroup> </Form>
</Form> </FormProvider>
</Modal> </Modal>
); );
}; };