feat(EE): LDAP integration (#1515)

* LDAP - WIP

* WIP

* add hasGeneratedPassword

* fix jotai atom

* - don't require password confirmation for MFA is user has auto generated password (LDAP)
- cleanups

* fix

* reorder

* update migration

* update default

* fix type error

apps/client/src/ee/security/components/allowed-domains.tsx

@@ -1,6 +1,7 @@
 import { useAtom } from "jotai";
 import * as z from "zod";
-import { useForm, zodResolver } from "@mantine/form";
+import { useForm } from "@mantine/form";
+import { zodResolver } from "mantine-form-zod-resolver";
 import { workspaceAtom } from "@/features/user/atoms/current-user-atom.ts";
 import React, { useState } from "react";
 import { Button, Text, TagsInput } from "@mantine/core";

apps/client/src/ee/security/components/create-sso-provider.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import { useDisclosure } from "@mantine/hooks";
 import { Button, Menu, Group } from "@mantine/core";
-import { IconChevronDown, IconLock } from "@tabler/icons-react";
+import { IconChevronDown, IconLock, IconServer } from "@tabler/icons-react";
 import { useCreateSsoProviderMutation } from "@/ee/security/queries/security-query.ts";
 import { SSO_PROVIDER } from "@/ee/security/contants.ts";
 import { IAuthProvider } from "@/ee/security/types/security.types.ts";
@@ -40,6 +40,19 @@ export default function CreateSsoProvider() {
     }
   };
 
+  const handleCreateLDAP = async () => {
+    try {
+      const newProvider = await createSsoProviderMutation.mutateAsync({
+        type: SSO_PROVIDER.LDAP,
+        name: "LDAP",
+      });
+      setProvider(newProvider);
+      open();
+    } catch (error) {
+      console.error("Failed to create LDAP provider", error);
+    }
+  };
+
   return (
     <>
       <SsoProviderModal opened={opened} onClose={close} provider={provider} />
@@ -71,6 +84,13 @@ export default function CreateSsoProvider() {
             >
               OpenID (OIDC)
             </Menu.Item>
+
+            <Menu.Item
+              onClick={handleCreateLDAP}
+              leftSection={<IconServer size={16} />}
+            >
+              LDAP / Active Directory
+            </Menu.Item>
           </Menu.Dropdown>
         </Menu>
       </Group>

apps/client/src/ee/security/components/sso-ldap-form.tsx

@@ -0,0 +1,228 @@
+import React from "react";
+import { z } from "zod";
+import { useForm } from "@mantine/form";
+import { zodResolver } from "mantine-form-zod-resolver";
+import {
+  Box,
+  Button,
+  Group,
+  Stack,
+  Switch,
+  TextInput,
+  Textarea,
+  Text,
+  Accordion,
+} from "@mantine/core";
+import classes from "@/ee/security/components/sso.module.css";
+import { IAuthProvider } from "@/ee/security/types/security.types.ts";
+import { useTranslation } from "react-i18next";
+import { useUpdateSsoProviderMutation } from "@/ee/security/queries/security-query.ts";
+import { IconInfoCircle } from "@tabler/icons-react";
+
+const ssoSchema = z.object({
+  name: z.string().min(1, "Display name is required"),
+  ldapUrl: z.string().url().startsWith("ldap", "Must be an LDAP URL"),
+  ldapBindDn: z.string().min(1, "Bind DN is required"),
+  ldapBindPassword: z.string().min(1, "Bind password is required"),
+  ldapBaseDn: z.string().min(1, "Base DN is required"),
+  ldapUserSearchFilter: z.string().optional(),
+  ldapTlsEnabled: z.boolean(),
+  ldapTlsCaCert: z.string().optional(),
+  isEnabled: z.boolean(),
+  allowSignup: z.boolean(),
+  groupSync: z.boolean(),
+});
+
+type SSOFormValues = z.infer<typeof ssoSchema>;
+
+interface SsoFormProps {
+  provider: IAuthProvider;
+  onClose?: () => void;
+}
+
+export function SsoLDAPForm({ provider, onClose }: SsoFormProps) {
+  const { t } = useTranslation();
+  const updateSsoProviderMutation = useUpdateSsoProviderMutation();
+
+  const form = useForm<SSOFormValues>({
+    initialValues: {
+      name: provider.name || "",
+      ldapUrl: provider.ldapUrl || "",
+      ldapBindDn: provider.ldapBindDn || "",
+      ldapBindPassword: provider.ldapBindPassword || "",
+      ldapBaseDn: provider.ldapBaseDn || "",
+      ldapUserSearchFilter:
+        provider.ldapUserSearchFilter || "(mail={{username}})",
+      ldapTlsEnabled: provider.ldapTlsEnabled || false,
+      ldapTlsCaCert: provider.ldapTlsCaCert || "",
+      isEnabled: provider.isEnabled,
+      allowSignup: provider.allowSignup,
+      groupSync: provider.groupSync || false,
+    },
+    validate: zodResolver(ssoSchema),
+  });
+
+  const handleSubmit = async (values: SSOFormValues) => {
+    const ssoData: Partial<IAuthProvider> = {
+      providerId: provider.id,
+    };
+    if (form.isDirty("name")) {
+      ssoData.name = values.name;
+    }
+    if (form.isDirty("ldapUrl")) {
+      ssoData.ldapUrl = values.ldapUrl;
+    }
+    if (form.isDirty("ldapBindDn")) {
+      ssoData.ldapBindDn = values.ldapBindDn;
+    }
+    if (form.isDirty("ldapBindPassword")) {
+      ssoData.ldapBindPassword = values.ldapBindPassword;
+    }
+    if (form.isDirty("ldapBaseDn")) {
+      ssoData.ldapBaseDn = values.ldapBaseDn;
+    }
+    if (form.isDirty("ldapUserSearchFilter")) {
+      ssoData.ldapUserSearchFilter = values.ldapUserSearchFilter;
+    }
+    if (form.isDirty("ldapTlsEnabled")) {
+      ssoData.ldapTlsEnabled = values.ldapTlsEnabled;
+    }
+    if (form.isDirty("ldapTlsCaCert")) {
+      ssoData.ldapTlsCaCert = values.ldapTlsCaCert;
+    }
+    if (form.isDirty("isEnabled")) {
+      ssoData.isEnabled = values.isEnabled;
+    }
+    if (form.isDirty("allowSignup")) {
+      ssoData.allowSignup = values.allowSignup;
+    }
+    if (form.isDirty("groupSync")) {
+      ssoData.groupSync = values.groupSync;
+    }
+
+    await updateSsoProviderMutation.mutateAsync(ssoData);
+    form.resetDirty();
+    onClose();
+  };
+
+  return (
+    <Box maw={600} mx="auto">
+      <form onSubmit={form.onSubmit(handleSubmit)}>
+        <Stack>
+          <TextInput
+            label="Display name"
+            placeholder="e.g Company LDAP"
+            data-autofocus
+            {...form.getInputProps("name")}
+          />
+
+          <TextInput
+            label="LDAP Server URL"
+            description="URL of your LDAP server"
+            placeholder="ldap://ldap.example.com:389 or ldaps://ldap.example.com:636"
+            {...form.getInputProps("ldapUrl")}
+          />
+
+          <TextInput
+            label="Bind DN"
+            description="Distinguished Name of the service account for searching"
+            placeholder="cn=admin,dc=example,dc=com"
+            {...form.getInputProps("ldapBindDn")}
+          />
+
+          <TextInput
+            label="Bind Password"
+            description="Password for the service account"
+            type="password"
+            placeholder="••••••••"
+            {...form.getInputProps("ldapBindPassword")}
+          />
+
+          <TextInput
+            label="Base DN"
+            description="Base DN where user searches will start"
+            placeholder="ou=users,dc=example,dc=com"
+            {...form.getInputProps("ldapBaseDn")}
+          />
+
+          <TextInput
+            label="User Search Filter"
+            description="LDAP filter to find users. Use {{username}} as placeholder"
+            placeholder="(mail={{username}})"
+            {...form.getInputProps("ldapUserSearchFilter")}
+          />
+
+          <Accordion variant="separated">
+            <Accordion.Item value="advanced">
+              <Accordion.Control icon={<IconInfoCircle size={20} />}>
+                Advanced Settings
+              </Accordion.Control>
+              <Accordion.Panel>
+                <Stack>
+                  <Group justify="space-between">
+                    <div>
+                      <Text size="sm">{t("Enable TLS/SSL")}</Text>
+                      <Text size="xs" c="dimmed">
+                        Use secure connection to LDAP server
+                      </Text>
+                    </div>
+                    <Switch
+                      className={classes.switch}
+                      checked={form.values.ldapTlsEnabled}
+                      {...form.getInputProps("ldapTlsEnabled")}
+                    />
+                  </Group>
+
+                  {form.values.ldapTlsEnabled && (
+                    <Textarea
+                      label="CA Certificate"
+                      description="PEM-encoded CA certificate for TLS verification (optional)"
+                      placeholder="-----BEGIN CERTIFICATE-----
+...
+-----END CERTIFICATE-----"
+                      minRows={4}
+                      {...form.getInputProps("ldapTlsCaCert")}
+                    />
+                  )}
+                </Stack>
+              </Accordion.Panel>
+            </Accordion.Item>
+          </Accordion>
+
+          <Group justify="space-between">
+            <div>{t("Group sync")}</div>
+            <Switch
+              className={classes.switch}
+              checked={form.values.groupSync}
+              {...form.getInputProps("groupSync")}
+            />
+          </Group>
+
+          <Group justify="space-between">
+            <div>{t("Allow signup")}</div>
+            <Switch
+              className={classes.switch}
+              checked={form.values.allowSignup}
+              {...form.getInputProps("allowSignup")}
+            />
+          </Group>
+
+          <Group justify="space-between">
+            <div>{t("Enabled")}</div>
+            <Switch
+              className={classes.switch}
+              checked={form.values.isEnabled}
+              {...form.getInputProps("isEnabled")}
+            />
+          </Group>
+
+          <Group mt="md" justify="flex-end">
+            <Button type="submit" disabled={!form.isDirty()}>
+              {t("Save")}
+            </Button>
+          </Group>
+        </Stack>
+      </form>
+    </Box>
+  );
+}

apps/client/src/ee/security/components/sso-oidc-form.tsx

@@ -115,15 +115,6 @@ export function SsoOIDCForm({ provider, onClose }: SsoFormProps) {
             {...form.getInputProps("oidcClientSecret")}
           />
 
-          <Group justify="space-between">
-            <div>{t("Allow signup")}</div>
-            <Switch
-              className={classes.switch}
-              checked={form.values.allowSignup}
-              {...form.getInputProps("allowSignup")}
-            />
-          </Group>
-
           <Group justify="space-between">
             <div>{t("Group sync")}</div>
             <Switch
@@ -133,6 +124,15 @@ export function SsoOIDCForm({ provider, onClose }: SsoFormProps) {
             />
           </Group>
 
+          <Group justify="space-between">
+            <div>{t("Allow signup")}</div>
+            <Switch
+              className={classes.switch}
+              checked={form.values.allowSignup}
+              {...form.getInputProps("allowSignup")}
+            />
+          </Group>
+
           <Group justify="space-between">
             <div>{t("Enabled")}</div>
             <Switch

apps/client/src/ee/security/components/sso-provider-modal.tsx

@@ -5,6 +5,7 @@ import { SsoSamlForm } from "@/ee/security/components/sso-saml-form.tsx";
 import { SSO_PROVIDER } from "@/ee/security/contants.ts";
 import { SsoOIDCForm } from "@/ee/security/components/sso-oidc-form.tsx";
 import { SsoGoogleForm } from "@/ee/security/components/sso-google-form.tsx";
+import { SsoLDAPForm } from "@/ee/security/components/sso-ldap-form.tsx";
 
 interface SsoModalProps {
   opened: boolean;
@@ -38,6 +39,10 @@ export default function SsoProviderModal({
       {provider.type === SSO_PROVIDER.GOOGLE && (
         <SsoGoogleForm provider={provider} onClose={onClose} />
       )}
+
+      {provider.type === SSO_PROVIDER.LDAP && (
+        <SsoLDAPForm provider={provider} onClose={onClose} />
+      )}
     </Modal>
   );
 }

apps/client/src/ee/security/components/sso-saml-form.tsx

@@ -128,15 +128,6 @@ export function SsoSamlForm({ provider, onClose }: SsoFormProps) {
             {...form.getInputProps("samlCertificate")}
           />
 
-          <Group justify="space-between">
-            <div>{t("Allow signup")}</div>
-            <Switch
-              className={classes.switch}
-              checked={form.values.allowSignup}
-              {...form.getInputProps("allowSignup")}
-            />
-          </Group>
-
           <Group justify="space-between">
             <div>{t("Group sync")}</div>
             <Switch
@@ -146,6 +137,15 @@ export function SsoSamlForm({ provider, onClose }: SsoFormProps) {
             />
           </Group>
 
+          <Group justify="space-between">
+            <div>{t("Allow signup")}</div>
+            <Switch
+              className={classes.switch}
+              checked={form.values.allowSignup}
+              {...form.getInputProps("allowSignup")}
+            />
+          </Group>
+
           <Group justify="space-between">
             <div>{t("Enabled")}</div>
             <Switch