better unset check (#32062)

* better unset check

fixes: #32059
Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>

* better explanation

Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>

* fix min value

Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>

* Steal some code from `react-hook-form`

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

---------

Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>
Signed-off-by: Jon Koops <jonkoops@gmail.com>
Co-authored-by: Jon Koops <jonkoops@gmail.com>

js/apps/admin-ui/maven-resources/theme/keycloak.v2/admin/messages/messages_en.properties

@@ -2778,7 +2778,7 @@ javaKeystore=java-keystore
 updatedUserProfileSuccess=User Profile configuration has been saved
 deleteProviderMapper=Delete mapper?
 clientsPermissionsHint=Fine grained permissions for administrators that want to manage this client or apply roles defined by this client.
-lookAroundHelp=How far around should the server look just in case the token generator and server are out of time sync or counter sync?
+lookAroundHelp=How far around (extra token periods or counts) should the server look just in case the token generator and server are out of time sync or counter sync?
 usersLeft_one={{count}} user left the group
 sync-keycloak-groups-to-ldap=Sync Keycloak groups to LDAP
 saveError=User federation provider could not be saved\: {{error}}

js/apps/admin-ui/src/clients/initial-access/CreateInitialAccessToken.tsx

@@ -85,9 +85,11 @@ export default function CreateInitialAccessToken() {
             label={t("count")}
             labelIcon={t("countHelp")}
             controller={{
+              rules: {
+                min: 1,
+              },
               defaultValue: 1,
             }}
-            min={1}
           />
           <ActionGroup>
             <Button

js/libs/ui-shared/src/controls/NumberControl.tsx

@@ -11,6 +11,8 @@ import {
   UseControllerProps,
   useFormContext,
 } from "react-hook-form";
+
+import { getRuleValue } from "../utils/getRuleValue";
 import { FormLabel } from "./FormLabel";
 
 export type NumberControlOption = {
@@ -43,6 +45,7 @@ export const NumberControl = <
     control,
     formState: { errors },
   } = useFormContext();
+
   return (
     <FormLabel
       name={name}
@@ -57,11 +60,12 @@ export const NumberControl = <
         control={control}
         render={({ field }) => {
           const required = !!controller.rules?.required;
-          const min = controller.rules?.min;
-          const value =
-            field.value === 0 ? controller.defaultValue : field.value;
+          const min = getRuleValue(controller.rules?.min);
+          const value = field.value ?? controller.defaultValue;
           const setValue = (newValue: number) =>
-            field.onChange(min ? Math.max(newValue, Number(min)) : newValue);
+            field.onChange(
+              min !== undefined ? Math.max(newValue, Number(min)) : newValue,
+            );
 
           return (
             <NumberInput

js/libs/ui-shared/src/utils/getRuleValue.ts

@@ -0,0 +1,17 @@
+import type { ValidationRule, ValidationValue } from "react-hook-form";
+
+// Simplified version of https://github.com/react-hook-form/react-hook-form/blob/ea0f3ed86457691f79987a703ae8d50b9e16e2ad/src/logic/getRuleValue.ts#L10-L21
+// TODO: Can be removed if https://github.com/react-hook-form/react-hook-form/issues/12178 is resolved
+export function getRuleValue<T extends ValidationValue>(
+  rule?: ValidationRule<T>,
+): T | undefined {
+  if (typeof rule === "undefined" || rule instanceof RegExp) {
+    return;
+  }
+
+  if (typeof rule === "object") {
+    return rule.value;
+  }
+
+  return rule;
+}