ldap saves working

src/user-federation/UserFederationLdapSettings.tsx

@@ -47,6 +47,7 @@ const LdapSettingsHeader = ({
   toggleRemoveUsersDialog,
 }: LdapSettingsHeaderProps) => {
   const { t } = useTranslation("user-federation");
+  const { id } = useParams<{ id: string }>();
   const [toggleDisableDialog, DisableConfirm] = useConfirmDialog({
     titleKey: "user-federation:userFedDisableConfirmTitle",
     messageKey: "user-federation:userFedDisableConfirm",
@@ -59,46 +60,53 @@ const LdapSettingsHeader = ({
   return (
     <>
       <DisableConfirm />
-      <ViewHeader
-        titleKey="LDAP"
-        subKey=""
-        dropdownItems={[
-          <DropdownItem
-            key="sync"
-            onClick={() => console.log("Sync users TBD")}
-          >
-            {t("syncChangedUsers")}
-          </DropdownItem>,
-          <DropdownItem
-            key="syncall"
-            onClick={() => console.log("Sync all users TBD")}
-          >
-            {t("syncAllUsers")}
-          </DropdownItem>,
-          <DropdownItem
-            key="unlink"
-            onClick={() => console.log("Unlink users TBD")}
-          >
-            {t("unlinkUsers")}
-          </DropdownItem>,
-          <DropdownItem key="remove" onClick={() => toggleRemoveUsersDialog()}>
-            {t("removeImported")}
-          </DropdownItem>,
-          <DropdownSeparator key="separator" />,
-          <DropdownItem key="delete" onClick={() => toggleDeleteDialog()}>
-            {t("deleteProvider")}
-          </DropdownItem>,
-        ]}
-        isEnabled={value === "true"}
-        onToggle={(value) => {
-          if (!value) {
-            toggleDisableDialog();
-          } else {
-            onChange("" + value);
-            save();
-          }
-        }}
-      />
+      {id === "new" ? (
+        <ViewHeader titleKey="LDAP" subKey="" />
+      ) : (
+        <ViewHeader
+          titleKey="LDAP"
+          subKey=""
+          dropdownItems={[
+            <DropdownItem
+              key="sync"
+              onClick={() => console.log("Sync users TBD")}
+            >
+              {t("syncChangedUsers")}
+            </DropdownItem>,
+            <DropdownItem
+              key="syncall"
+              onClick={() => console.log("Sync all users TBD")}
+            >
+              {t("syncAllUsers")}
+            </DropdownItem>,
+            <DropdownItem
+              key="unlink"
+              onClick={() => console.log("Unlink users TBD")}
+            >
+              {t("unlinkUsers")}
+            </DropdownItem>,
+            <DropdownItem
+              key="remove"
+              onClick={() => toggleRemoveUsersDialog()}
+            >
+              {t("removeImported")}
+            </DropdownItem>,
+            <DropdownSeparator key="separator" />,
+            <DropdownItem key="delete" onClick={() => toggleDeleteDialog()}>
+              {t("deleteProvider")}
+            </DropdownItem>,
+          ]}
+          isEnabled={value === "true"}
+          onToggle={(value) => {
+            if (!value) {
+              toggleDisableDialog();
+            } else {
+              onChange("" + value);
+              save();
+            }
+          }}
+        />
+      )}
     </>
   );
 };
@@ -134,11 +142,23 @@ export const UserFederationLdapSettings = () => {
 
   const save = async (component: ComponentRepresentation) => {
     try {
-      await adminClient.components.update({ id }, component);
+      if (id) {
+        if (id === "new") {
+          await adminClient.components.create(component);
+        } else {
+          await adminClient.components.update({ id }, component);
+        }
+      }
       setupForm(component as ComponentRepresentation);
-      addAlert(t("saveSuccess"), AlertVariant.success);
+      addAlert(
+        t(id === "new" ? "createSuccess" : "saveSuccess"),
+        AlertVariant.success
+      );
     } catch (error) {
-      addAlert(`${t("saveError")} '${error}'`, AlertVariant.danger);
+      addAlert(
+        `${t(id === "new" ? "createError" : "saveError")} '${error}'`,
+        AlertVariant.danger
+      );
     }
   };
 
@@ -179,7 +199,7 @@ export const UserFederationLdapSettings = () => {
       <RemoveUsersConfirm />
       <Controller
         name="config.enabled[0]"
-        defaultValue={["true"]}
+        defaultValue={["true"][0]}
         control={form.control}
         render={({ onChange, value }) => (
           <LdapSettingsHeader

src/user-federation/UserFederationSection.tsx

@@ -190,7 +190,11 @@ export const UserFederationSection = () => {
                   </Split>
                 </CardTitle>
               </Card>
-              <Card isHoverable>
+              <Card
+                isHoverable
+                onClick={() => history.push(`${url}/ldap/new`)}
+                data-testid="ldap-card"
+              >
                 <CardTitle>
                   <Split hasGutter>
                     <SplitItem>

src/user-federation/ldap/LdapSettingsAdvanced.tsx

@@ -74,7 +74,7 @@ export const LdapSettingsAdvanced = ({
         >
           <Controller
             name="config.validatePasswordPolicy"
-            defaultValue={"false"}
+            defaultValue={["false"]}
             control={form.control}
             render={({ onChange, value }) => (
               <Switch
@@ -103,7 +103,7 @@ export const LdapSettingsAdvanced = ({
         >
           <Controller
             name="config.trustEmail"
-            defaultValue={"false"}
+            defaultValue={["false"]}
             control={form.control}
             render={({ onChange, value }) => (
               <Switch

src/user-federation/ldap/LdapSettingsConnection.tsx

@@ -167,7 +167,7 @@ export const LdapSettingsConnection = ({
         >
           <Controller
             name="config.connectionPooling"
-            defaultValue={false}
+            defaultValue={["false"]}
             control={form.control}
             render={({ onChange, value }) => (
               <Switch

src/user-federation/ldap/LdapSettingsGeneral.tsx

@@ -10,6 +10,8 @@ import React, { useState } from "react";
 import { HelpItem } from "../../components/help-enabler/HelpItem";
 import { UseFormMethods, Controller } from "react-hook-form";
 import { FormAccess } from "../../components/form-access/FormAccess";
+import { useRealm } from "../../context/realm-context/RealmContext";
+
 import { WizardSectionHeader } from "../../components/wizard-section-header/WizardSectionHeader";
 
 export type LdapSettingsGeneralProps = {
@@ -25,6 +27,7 @@ export const LdapSettingsGeneral = ({
 }: LdapSettingsGeneralProps) => {
   const { t } = useTranslation("user-federation");
   const helpText = useTranslation("user-federation-help").t;
+  const { realm } = useRealm();
 
   const [isVendorDropdownOpen, setIsVendorDropdownOpen] = useState(false);
 
@@ -51,12 +54,36 @@ export const LdapSettingsGeneral = ({
           isRequired
         >
           {/* These hidden fields are required so data object written back matches data retrieved */}
-          <TextInput
+          {/* <TextInput
             hidden
             type="text"
             id="kc-console-id"
             name="id"
             ref={form.register}
+          /> */}
+          <TextInput
+            hidden
+            type="text"
+            id="kc-console-provider-id"
+            name="providerId"
+            defaultValue="ldap"
+            ref={form.register}
+          />
+          <TextInput
+            hidden
+            type="text"
+            id="kc-console-provider-type"
+            name="providerType"
+            defaultValue="org.keycloak.storage.UserStorageProvider"
+            ref={form.register}
+          />
+          <TextInput
+            hidden
+            type="text"
+            id="kc-console-parentId"
+            name="parentId"
+            defaultValue={realm}
+            ref={form.register}
           />
           <TextInput
             isRequired
@@ -70,27 +97,6 @@ export const LdapSettingsGeneral = ({
               },
             })}
           />
-          <TextInput
-            hidden
-            type="text"
-            id="kc-console-provider-id"
-            name="providerId"
-            ref={form.register}
-          />
-          <TextInput
-            hidden
-            type="text"
-            id="kc-console-provider-type"
-            name="providerType"
-            ref={form.register}
-          />
-          <TextInput
-            hidden
-            type="text"
-            id="kc-console-parentId"
-            name="parentId"
-            ref={form.register}
-          />
           {form.errors.name && (
             <div className="error">{form.errors.name.message}</div>
           )}

src/user-federation/ldap/LdapSettingsKerberosIntegration.tsx

@@ -45,7 +45,7 @@ export const LdapSettingsKerberosIntegration = ({
         >
           <Controller
             name="config.allowKerberosAuthentication"
-            defaultValue={false}
+            defaultValue={["false"]}
             control={form.control}
             render={({ onChange, value }) => (
               <Switch
@@ -73,7 +73,7 @@ export const LdapSettingsKerberosIntegration = ({
         >
           <Controller
             name="config.useKerberosForPasswordAuthentication"
-            defaultValue={false}
+            defaultValue={["false"]}
             control={form.control}
             render={({ onChange, value }) => (
               <Switch

src/user-federation/ldap/LdapSettingsSearching.tsx

@@ -332,7 +332,7 @@ export const LdapSettingsSearching = ({
         >
           <Controller
             name="config.pagination"
-            defaultValue={false}
+            defaultValue={["false"]}
             control={form.control}
             render={({ onChange, value }) => (
               <Switch

src/user-federation/ldap/LdapSettingsSynchronization.tsx

@@ -44,7 +44,7 @@ export const LdapSettingsSynchronization = ({
         >
           <Controller
             name="config.importEnabled"
-            defaultValue={false}
+            defaultValue={["false"]}
             control={form.control}
             render={({ onChange, value }) => (
               <Switch