regex and number fields to provide simple client side validation

src/user-federation/ldap/LdapSettingsConnection.tsx

@@ -193,7 +193,7 @@ export const LdapSettingsConnection = ({
           fieldId="kc-console-connection-timeout"
         >
           <TextInput
-            type="text"
+            type="number"
             id="kc-console-connection-timeout"
             name="config.connectionTimeout[0]"
             ref={form.register}

src/user-federation/ldap/LdapSettingsSearching.tsx

@@ -256,8 +256,20 @@ export const LdapSettingsSearching = ({
             type="text"
             id="kc-user-ldap-filter"
             name="config.customUserSearchFilter[0]"
-            ref={form.register}
+            ref={form.register({ 
+              pattern: {
+                value: /(\(.*\))$/,
+                message: `${t("validateCustomUserSearchFilter")}`
+              }  
+            })}
           />
+          {form.errors.config &&
+            form.errors.config.customUserSearchFilter &&
+            form.errors.config.customUserSearchFilter[0] && (
+              <div className="error">
+                {form.errors.config.customUserSearchFilter[0].message}
+              </div>
+            )}
         </FormGroup>
 
         <FormGroup
@@ -312,7 +324,7 @@ export const LdapSettingsSearching = ({
           fieldId="kc-read-timeout"
         >
           <TextInput
-            type="text"
+            type="number"
             id="kc-read-timeout"
             name="config.readTimeout[0]"
             ref={form.register}

src/user-federation/ldap/LdapSettingsSynchronization.tsx

@@ -71,7 +71,7 @@ export const LdapSettingsSynchronization = ({
           fieldId="kc-batch-size"
         >
           <TextInput
-            type="text"
+            type="number"
             id="kc-batch-size"
             name="config.batchSizeForSync[0]"
             ref={form.register}
@@ -92,7 +92,7 @@ export const LdapSettingsSynchronization = ({
           fieldId="kc-full-sync-period"
         >
           <TextInput
-            type="text"
+            type="number"
             id="kc-full-sync-period"
             name="config.fullSyncPeriod[0]"
             ref={form.register}
@@ -113,7 +113,7 @@ export const LdapSettingsSynchronization = ({
           hasNoPaddingTop
         >
           <TextInput
-            type="text"
+            type="number"
             id="kc-changed-users-sync-period"
             name="config.changedSyncPeriod[0]"
             ref={form.register}

src/user-federation/messages.json

@@ -110,6 +110,7 @@
     "validateUsersDn": "You must enter users DN",
     "validateUsernameLDAPAttribute": "You must enter a username LDAP attribute",
     "validateRdnLdapAttribute": "You must enter an RDN LDAP attribute",
+    "validateCustomUserSearchFilter": "Filter must be enclosed in parentheses, for example: (filter)", 
 
     "id": "ID",
     "mapperType": "Mapper type",