more translations

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

@@ -55,9 +55,11 @@ export default function AllowedDomains() {
   return (
     <>
       <div>
-        <Text size="md">Allowed email domains</Text>
+        <Text size="md">{t("Allowed email domains")}</Text>
         <Text size="sm" c="dimmed">
-          Only users with email addresses from these domains can signup via SSO.
+          {t(
+            "Only users with email addresses from these domains can signup via SSO.",
+          )}
         </Text>
       </div>
       <form onSubmit={form.onSubmit(handleSubmit)}>

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

@@ -1,6 +1,7 @@
 import React from "react";
 import { z } from "zod";
-import { useForm, zodResolver } from "@mantine/form";
+import { useForm } from "@mantine/form";
+import { zodResolver } from "mantine-form-zod-resolver";
 import { Box, Button, Group, Stack, Switch, TextInput } from "@mantine/core";
 import classes from "@/ee/security/components/sso.module.css";
 import { IAuthProvider } from "@/ee/security/types/security.types.ts";

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

@@ -110,7 +110,7 @@ export function SsoLDAPForm({ provider, onClose }: SsoFormProps) {
       <form onSubmit={form.onSubmit(handleSubmit)}>
         <Stack>
           <TextInput
-            label="Display name"
+            label={t("Display name")}
             placeholder="e.g Company LDAP"
             data-autofocus
             {...form.getInputProps("name")}
@@ -155,7 +155,7 @@ export function SsoLDAPForm({ provider, onClose }: SsoFormProps) {
           <Accordion variant="separated">
             <Accordion.Item value="advanced">
               <Accordion.Control icon={<IconInfoCircle size={20} />}>
-                Advanced Settings
+                {t("Advanced Settings")}
               </Accordion.Control>
               <Accordion.Panel>
                 <Stack>

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

@@ -83,7 +83,7 @@ export function SsoOIDCForm({ provider, onClose }: SsoFormProps) {
       <form onSubmit={form.onSubmit(handleSubmit)}>
         <Stack>
           <TextInput
-            label="Display name"
+            label={t("Display name")}
             placeholder="e.g Google SSO"
             data-autofocus
             {...form.getInputProps("name")}

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

@@ -6,6 +6,7 @@ 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";
+import { useTranslation } from "react-i18next";
 
 interface SsoModalProps {
   opened: boolean;
@@ -18,6 +19,8 @@ export default function SsoProviderModal({
   onClose,
   provider,
 }: SsoModalProps) {
+  const { t } = useTranslation();
+
   if (!provider) {
     return null;
   }
@@ -25,7 +28,9 @@ export default function SsoProviderModal({
   return (
     <Modal
       opened={opened}
-      title={`${provider.type.toUpperCase()} Configuration`}
+      title={t("{{ssoProviderType}} configuration", {
+        ssoProviderType: provider.type.toUpperCase(),
+      })}
       onClose={onClose}
     >
       {provider.type === SSO_PROVIDER.SAML && (

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

@@ -1,6 +1,7 @@
 import React from "react";
 import { z } from "zod";
-import { useForm, zodResolver } from "@mantine/form";
+import { useForm } from "@mantine/form";
+import { zodResolver } from "mantine-form-zod-resolver";
 import {
   Box,
   Button,
@@ -91,7 +92,7 @@ export function SsoSamlForm({ provider, onClose }: SsoFormProps) {
       <form onSubmit={form.onSubmit(handleSubmit)}>
         <Stack>
           <TextInput
-            label="Display name"
+            label={t("Display name")}
             placeholder="e.g Azure Entra"
             data-autofocus
             {...form.getInputProps("name")}