Port regex client authorization policy to new form controls (#27569)

Signed-off-by: Jon Koops <jonkoops@gmail.com>

js/apps/admin-ui/cypress/e2e/client_authorization_test.spec.ts

@@ -117,7 +117,7 @@ describe("Client authentication subtab", () => {
         name: "Regex policy",
         description: "Policy for regex",
         targetClaim: "I don't know",
-        regexPattern: ".*?",
+        pattern: ".*?",
       })
       .formUtils()
       .save();

js/apps/admin-ui/src/clients/authorization/policy/Regex.tsx

@@ -1,83 +1,30 @@
 import { useTranslation } from "react-i18next";
-import { Controller, useFormContext } from "react-hook-form";
+import { SwitchControl, TextControl } from "ui-shared";
-import { Checkbox, FormGroup } from "@patternfly/react-core";
-
-import { HelpItem } from "ui-shared";
-import { KeycloakTextInput } from "../../../components/keycloak-text-input/KeycloakTextInput";
 
 export const Regex = () => {
   const { t } = useTranslation();
-  const {
-    control,
-    register,
-    formState: { errors },
-  } = useFormContext();
 
   return (
     <>
-      <FormGroup
+      <TextControl
+        name="targetClaim"
         label={t("targetClaim")}
-        fieldId="targetClaim"
+        labelIcon={t("targetClaimHelp")}
-        helperTextInvalid={t("required")}
+        rules={{ required: t("required") }}
-        validated={errors.targetClaim ? "error" : "default"}
-        isRequired
-        labelIcon={
-          <HelpItem
-            helpText={t("targetClaimHelp")}
-            fieldLabelId="targetClaim"
       />
-        }
+      <TextControl
-      >
+        name="pattern"
-        <KeycloakTextInput
-          id="targetClaim"
-          data-testid="targetClaim"
-          validated={errors.targetClaim ? "error" : "default"}
-          {...register("targetClaim", { required: true })}
-        />
-      </FormGroup>
-      <FormGroup
         label={t("regexPattern")}
-        fieldId="pattern"
+        labelIcon={t("regexPatternHelp")}
-        labelIcon={
+        rules={{ required: t("required") }}
-          <HelpItem
-            helpText={t("regexPatternHelp")}
-            fieldLabelId="regexPattern"
       />
-        }
+      <SwitchControl
-        isRequired
-        validated={errors.pattern ? "error" : "default"}
-        helperTextInvalid={t("required")}
-      >
-        <KeycloakTextInput
-          id="pattern"
-          data-testid="regexPattern"
-          validated={errors.pattern ? "error" : "default"}
-          {...register("pattern", { required: true })}
-        />
-      </FormGroup>
-      <FormGroup
-        label={t("targetContextAttributes")}
-        fieldId="targetContextAttributes"
-        labelIcon={
-          <HelpItem
-            helpText={t("targetContextAttributesHelp")}
-            fieldLabelId="targetContextAttributes"
-          />
-        }
-      >
-        <Controller
         name="targetContextAttributes"
-          defaultValue={false}
+        label={t("targetContextAttributes")}
-          control={control}
+        labelIcon={t("targetContextAttributesHelp")}
-          render={({ field }) => (
+        labelOn={t("yes")}
-            <Checkbox
+        labelOff={t("no")}
-              id="targetContextAttributes"
-              isChecked={field.value}
-              onChange={field.onChange}
       />
-          )}
-        />
-      </FormGroup>
     </>
   );
 };