feat: web i18n (#1286)

packages/app-tests/e2e/templates/direct-templates.spec.ts

@@ -5,9 +5,8 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import {
   DIRECT_TEMPLATE_RECIPIENT_EMAIL,
   DIRECT_TEMPLATE_RECIPIENT_NAME,
-} from '@documenso/lib/constants/template';
+} from '@documenso/lib/constants/direct-templates';
 import { createDocumentAuthOptions } from '@documenso/lib/utils/document-auth';
-import { formatDocumentsPath, formatTemplatesPath } from '@documenso/lib/utils/teams';
 import { formatDirectTemplatePath } from '@documenso/lib/utils/templates';
 import { seedTeam } from '@documenso/prisma/seed/teams';
 import { seedDirectTemplate, seedTemplate } from '@documenso/prisma/seed/templates';
@@ -16,6 +15,12 @@ import { seedTestEmail, seedUser } from '@documenso/prisma/seed/users';
 import { apiSignin } from '../fixtures/authentication';
 import { checkDocumentTabCount } from '../fixtures/documents';
 
+// Duped from `packages/lib/utils/teams.ts` due to errors when importing that file.
+const formatDocumentsPath = (teamUrl?: string) =>
+  teamUrl ? `/t/${teamUrl}/documents` : '/documents';
+const formatTemplatesPath = (teamUrl?: string) =>
+  teamUrl ? `/t/${teamUrl}/templates` : '/templates';
+
 const nanoid = customAlphabet('1234567890abcdef', 10);
 
 test.describe.configure({ mode: 'parallel' });

packages/email/template-components/template-document-invite.tsx

@@ -1,4 +1,4 @@
-import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
+import { RECIPIENT_ROLES_DESCRIPTION_ENG } from '@documenso/lib/constants/recipient-roles';
 import type { RecipientRole } from '@documenso/prisma/client';
 
 import { Button, Section, Text } from '../components';
@@ -26,7 +26,7 @@ export const TemplateDocumentInvite = ({
   isTeamInvite,
   teamName,
 }: TemplateDocumentInviteProps) => {
-  const { actionVerb, progressiveVerb } = RECIPIENT_ROLES_DESCRIPTION[role];
+  const { actionVerb, progressiveVerb } = RECIPIENT_ROLES_DESCRIPTION_ENG[role];
 
   return (
     <>

packages/email/templates/document-created-from-direct-template.tsx

@@ -1,4 +1,4 @@
-import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
+import { RECIPIENT_ROLES_DESCRIPTION_ENG } from '@documenso/lib/constants/recipient-roles';
 import config from '@documenso/tailwind-config';
 
 import {
@@ -32,7 +32,7 @@ export const DocumentCreatedFromDirectTemplateEmailTemplate = ({
   documentName = 'Open Source Pledge.pdf',
   assetBaseUrl = 'http://localhost:3002',
 }: DocumentCompletedEmailTemplateProps) => {
-  const action = RECIPIENT_ROLES_DESCRIPTION[recipientRole].actioned.toLowerCase();
+  const action = RECIPIENT_ROLES_DESCRIPTION_ENG[recipientRole].actioned.toLowerCase();
 
   const previewText = `Document created from direct template`;
 

packages/email/templates/document-invite.tsx

@@ -1,4 +1,4 @@
-import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
+import { RECIPIENT_ROLES_DESCRIPTION_ENG } from '@documenso/lib/constants/recipient-roles';
 import type { RecipientRole } from '@documenso/prisma/client';
 import config from '@documenso/tailwind-config';
 
@@ -40,7 +40,7 @@ export const DocumentInviteEmailTemplate = ({
   isTeamInvite = false,
   teamName,
 }: DocumentInviteEmailTemplateProps) => {
-  const action = RECIPIENT_ROLES_DESCRIPTION[role].actionVerb.toLowerCase();
+  const action = RECIPIENT_ROLES_DESCRIPTION_ENG[role].actionVerb.toLowerCase();
 
   const previewText = selfSigner
     ? `Please ${action} your document ${documentName}`

packages/lib/client-only/providers/i18n.server.tsx

@@ -6,7 +6,7 @@ import type { I18n, Messages } from '@lingui/core';
 import { setupI18n } from '@lingui/core';
 import { setI18n } from '@lingui/react/server';
 
-import { IS_APP_WEB } from '../../constants/app';
+import { IS_APP_WEB, IS_APP_WEB_I18N_ENABLED } from '../../constants/app';
 import { SUPPORTED_LANGUAGE_CODES } from '../../constants/i18n';
 import { extractSupportedLanguage } from '../../utils/i18n';
 
@@ -51,12 +51,17 @@ export const allI18nInstances = SUPPORTED_LANGUAGE_CODES.reduce((acc, locale) =>
  * https://lingui.dev/tutorials/react-rsc#pages-layouts-and-lingui
  */
 export const setupI18nSSR = (overrideLang?: SupportedLocales) => {
-  const lang =
+  let lang =
     overrideLang ||
     extractSupportedLanguage({
       cookies: cookies(),
     });
 
+  // Override web app to be English.
+  if (!IS_APP_WEB_I18N_ENABLED && IS_APP_WEB) {
+    lang = 'en';
+  }
+
   // Get and set a ready-made i18n instance for the given language.
   const i18n = allI18nInstances[lang];
   setI18n(i18n);

packages/lib/constants/app.ts

@@ -1,5 +1,6 @@
 import { env } from 'next-runtime-env';
 
+export const IS_APP_WEB_I18N_ENABLED = false;
 export const APP_DOCUMENT_UPLOAD_SIZE_LIMIT =
   Number(process.env.NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT) || 50;
 

packages/lib/constants/direct-templates.ts

@@ -0,0 +1,3 @@
+// Put into a separate file due to Playwright not compiling due to the macro in the templates.ts file.
+export const DIRECT_TEMPLATE_RECIPIENT_EMAIL = 'direct.link@documenso.com';
+export const DIRECT_TEMPLATE_RECIPIENT_NAME = 'Direct link recipient';

packages/lib/constants/recipient-roles.ts

@@ -1,29 +1,64 @@
+import type { MessageDescriptor } from '@lingui/core';
+import { msg } from '@lingui/macro';
+
 import { RecipientRole } from '@documenso/prisma/client';
 
 export const RECIPIENT_ROLES_DESCRIPTION = {
   [RecipientRole.APPROVER]: {
-    actionVerb: 'Approve',
-    actioned: 'Approved',
-    progressiveVerb: 'Approving',
-    roleName: 'Approver',
+    actionVerb: msg`Approve`,
+    actioned: msg`Approved`,
+    progressiveVerb: msg`Approving`,
+    roleName: msg`Approver`,
   },
   [RecipientRole.CC]: {
-    actionVerb: 'CC',
-    actioned: `CC'd`,
-    progressiveVerb: 'CC',
-    roleName: 'Cc',
+    actionVerb: msg`CC`,
+    actioned: msg`CC'd`,
+    progressiveVerb: msg`CC`,
+    roleName: msg`Cc`,
   },
   [RecipientRole.SIGNER]: {
-    actionVerb: 'Sign',
-    actioned: 'Signed',
-    progressiveVerb: 'Signing',
-    roleName: 'Signer',
+    actionVerb: msg`Sign`,
+    actioned: msg`Signed`,
+    progressiveVerb: msg`Signing`,
+    roleName: msg`Signer`,
   },
   [RecipientRole.VIEWER]: {
-    actionVerb: 'View',
-    actioned: 'Viewed',
-    progressiveVerb: 'Viewing',
-    roleName: 'Viewer',
+    actionVerb: msg`View`,
+    actioned: msg`Viewed`,
+    progressiveVerb: msg`Viewing`,
+    roleName: msg`Viewer`,
+  },
+} satisfies Record<keyof typeof RecipientRole, unknown>;
+
+/**
+ * Raw english descriptions for emails.
+ *
+ * Todo: Handle i18n for emails.
+ */
+export const RECIPIENT_ROLES_DESCRIPTION_ENG = {
+  [RecipientRole.APPROVER]: {
+    actionVerb: `Approve`,
+    actioned: `Approved`,
+    progressiveVerb: `Approving`,
+    roleName: `Approver`,
+  },
+  [RecipientRole.CC]: {
+    actionVerb: `CC`,
+    actioned: `CC'd`,
+    progressiveVerb: `CC`,
+    roleName: `Cc`,
+  },
+  [RecipientRole.SIGNER]: {
+    actionVerb: `Sign`,
+    actioned: `Signed`,
+    progressiveVerb: `Signing`,
+    roleName: `Signer`,
+  },
+  [RecipientRole.VIEWER]: {
+    actionVerb: `View`,
+    actioned: `Viewed`,
+    progressiveVerb: `Viewing`,
+    roleName: `Viewer`,
   },
 } satisfies Record<keyof typeof RecipientRole, unknown>;
 
@@ -34,8 +69,18 @@ export const RECIPIENT_ROLE_TO_EMAIL_TYPE = {
 } as const;
 
 export const RECIPIENT_ROLE_SIGNING_REASONS = {
-  [RecipientRole.SIGNER]: 'I am a signer of this document',
-  [RecipientRole.APPROVER]: 'I am an approver of this document',
-  [RecipientRole.CC]: 'I am required to recieve a copy of this document',
-  [RecipientRole.VIEWER]: 'I am a viewer of this document',
+  [RecipientRole.SIGNER]: msg`I am a signer of this document`,
+  [RecipientRole.APPROVER]: msg`I am an approver of this document`,
+  [RecipientRole.CC]: msg`I am required to recieve a copy of this document`,
+  [RecipientRole.VIEWER]: msg`I am a viewer of this document`,
+} satisfies Record<keyof typeof RecipientRole, MessageDescriptor>;
+
+/**
+ * Raw english descriptions for certificates.
+ */
+export const RECIPIENT_ROLE_SIGNING_REASONS_ENG = {
+  [RecipientRole.SIGNER]: `I am a signer of this document`,
+  [RecipientRole.APPROVER]: `I am an approver of this document`,
+  [RecipientRole.CC]: `I am required to recieve a copy of this document`,
+  [RecipientRole.VIEWER]: `I am a viewer of this document`,
 } satisfies Record<keyof typeof RecipientRole, string>;

packages/lib/constants/teams.ts

@@ -1,12 +1,15 @@
+import type { MessageDescriptor } from '@lingui/core';
+import { msg } from '@lingui/macro';
+
 import { TeamMemberRole } from '@documenso/prisma/client';
 
 export const TEAM_URL_ROOT_REGEX = new RegExp('^/t/[^/]+$');
 export const TEAM_URL_REGEX = new RegExp('^/t/[^/]+');
 
-export const TEAM_MEMBER_ROLE_MAP: Record<keyof typeof TeamMemberRole, string> = {
-  ADMIN: 'Admin',
-  MANAGER: 'Manager',
-  MEMBER: 'Member',
+export const TEAM_MEMBER_ROLE_MAP: Record<keyof typeof TeamMemberRole, MessageDescriptor> = {
+  ADMIN: msg`Admin`,
+  MANAGER: msg`Manager`,
+  MEMBER: msg`Member`,
 };
 
 export const TEAM_MEMBER_ROLE_PERMISSIONS_MAP = {

packages/lib/constants/template.ts

@@ -1,28 +1,23 @@
+import { msg } from '@lingui/macro';
+
 export const TEMPLATE_RECIPIENT_EMAIL_PLACEHOLDER_REGEX = /recipient\.\d+@documenso\.com/i;
 export const TEMPLATE_RECIPIENT_NAME_PLACEHOLDER_REGEX = /Recipient \d+/i;
 
 export const DIRECT_TEMPLATE_DOCUMENTATION = [
   {
-    title: 'Enable Direct Link Signing',
-    description:
-      'Once enabled, you can select any active recipient to be a direct link signing recipient, or create a new one. This recipient type cannot be edited or deleted.',
+    title: msg`Enable Direct Link Signing`,
+    description: msg`Once enabled, you can select any active recipient to be a direct link signing recipient, or create a new one. This recipient type cannot be edited or deleted.`,
   },
   {
-    title: 'Configure Direct Recipient',
-    description:
-      'Update the role and add fields as required for the direct recipient. The individual who uses the direct link will sign the document as the direct recipient.',
+    title: msg`Configure Direct Recipient`,
+    description: msg`Update the role and add fields as required for the direct recipient. The individual who uses the direct link will sign the document as the direct recipient.`,
   },
   {
-    title: 'Share the Link',
-    description:
-      'Once your template is set up, share the link anywhere you want. The person who opens the link will be able to enter their information in the direct link recipient field and complete any other fields assigned to them.',
+    title: msg`Share the Link`,
+    description: msg`Once your template is set up, share the link anywhere you want. The person who opens the link will be able to enter their information in the direct link recipient field and complete any other fields assigned to them.`,
   },
   {
-    title: 'Document Creation',
-    description:
-      'After submission, a document will be automatically generated and added to your documents page. You will also receive a notification via email.',
+    title: msg`Document Creation`,
+    description: msg`After submission, a document will be automatically generated and added to your documents page. You will also receive a notification via email.`,
   },
 ];
-
-export const DIRECT_TEMPLATE_RECIPIENT_EMAIL = 'direct.link@documenso.com';
-export const DIRECT_TEMPLATE_RECIPIENT_NAME = 'Direct link recipient';

packages/lib/constants/toast.ts

@@ -1,13 +0,0 @@
-import { Toast } from '@documenso/ui/primitives/use-toast';
-
-export const TOAST_DOCUMENT_SHARE_SUCCESS: Toast = {
-  title: 'Copied to clipboard',
-  description: 'The sharing link has been copied to your clipboard.',
-} as const;
-
-export const TOAST_DOCUMENT_SHARE_ERROR: Toast = {
-  variant: 'destructive',
-  title: 'Something went wrong',
-  description: 'The sharing link could not be created at this time. Please try again.',
-  duration: 5000,
-};

packages/lib/jobs/definitions/emails/send-signing-email.ts

@@ -16,7 +16,7 @@ import {
 import { NEXT_PUBLIC_WEBAPP_URL } from '../../../constants/app';
 import { FROM_ADDRESS, FROM_NAME } from '../../../constants/email';
 import {
-  RECIPIENT_ROLES_DESCRIPTION,
+  RECIPIENT_ROLES_DESCRIPTION_ENG,
   RECIPIENT_ROLE_TO_EMAIL_TYPE,
 } from '../../../constants/recipient-roles';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '../../../types/document-audit-logs';
@@ -87,8 +87,8 @@ export const SEND_SIGNING_EMAIL_JOB_DEFINITION = {
 
     const { email, name } = recipient;
     const selfSigner = email === user.email;
-    const { actionVerb } = RECIPIENT_ROLES_DESCRIPTION[recipient.role];
-    const recipientActionVerb = actionVerb.toLowerCase();
+    const recipientActionVerb =
+      RECIPIENT_ROLES_DESCRIPTION_ENG[recipient.role].actionVerb.toLowerCase();
 
     let emailMessage = customEmail?.message || '';
     let emailSubject = `Please ${recipientActionVerb} this document`;

packages/lib/server-only/document/resend-document.tsx

@@ -5,7 +5,7 @@ import { render } from '@documenso/email/render';
 import { DocumentInviteEmailTemplate } from '@documenso/email/templates/document-invite';
 import { FROM_ADDRESS, FROM_NAME } from '@documenso/lib/constants/email';
 import {
-  RECIPIENT_ROLES_DESCRIPTION,
+  RECIPIENT_ROLES_DESCRIPTION_ENG,
   RECIPIENT_ROLE_TO_EMAIL_TYPE,
 } from '@documenso/lib/constants/recipient-roles';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
@@ -97,8 +97,8 @@ export const resendDocument = async ({
       const { email, name } = recipient;
       const selfSigner = email === user.email;
 
-      const { actionVerb } = RECIPIENT_ROLES_DESCRIPTION[recipient.role];
-      const recipientActionVerb = actionVerb.toLowerCase();
+      const recipientActionVerb =
+        RECIPIENT_ROLES_DESCRIPTION_ENG[recipient.role].actionVerb.toLowerCase();
 
       let emailMessage = customEmail?.message || '';
       let emailSubject = `Reminder: Please ${recipientActionVerb} this document`;

packages/lib/server-only/recipient/set-recipients-for-template.ts

@@ -1,12 +1,12 @@
 import { isUserEnterprise } from '@documenso/ee/server-only/util/is-document-enterprise';
+import {
+  DIRECT_TEMPLATE_RECIPIENT_EMAIL,
+  DIRECT_TEMPLATE_RECIPIENT_NAME,
+} from '@documenso/lib/constants/direct-templates';
 import { prisma } from '@documenso/prisma';
 import type { Recipient } from '@documenso/prisma/client';
 import { RecipientRole } from '@documenso/prisma/client';
 
-import {
-  DIRECT_TEMPLATE_RECIPIENT_EMAIL,
-  DIRECT_TEMPLATE_RECIPIENT_NAME,
-} from '../../constants/template';
 import { AppError, AppErrorCode } from '../../errors/app-error';
 import {
   type TRecipientActionAuthTypes,

packages/lib/server-only/template/create-template-direct-link.ts

@@ -2,13 +2,13 @@
 
 import { nanoid } from 'nanoid';
 
-import { prisma } from '@documenso/prisma';
-import type { Recipient, TemplateDirectLink } from '@documenso/prisma/client';
-
 import {
   DIRECT_TEMPLATE_RECIPIENT_EMAIL,
   DIRECT_TEMPLATE_RECIPIENT_NAME,
-} from '../../constants/template';
+} from '@documenso/lib/constants/direct-templates';
+import { prisma } from '@documenso/prisma';
+import type { Recipient, TemplateDirectLink } from '@documenso/prisma/client';
+
 import { AppError, AppErrorCode } from '../../errors/app-error';
 
 export type CreateTemplateDirectLinkOptions = {

packages/lib/translations/de/common.po

@@ -18,3 +18,729 @@ msgstr ""
 "X-Crowdin-File: common.po\n"
 "X-Crowdin-File-ID: 4\n"
 
+#: packages/ui/primitives/data-table-pagination.tsx:30
+msgid "{0} of {1} row(s) selected."
+msgstr ""
+
+#: packages/ui/primitives/data-table-pagination.tsx:41
+msgid "{visibleRows, plural, one {Showing # result.} other {Showing # results.}}"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:53
+msgid "<0>Inherit authentication method</0> - Use the global action signing authentication method configured in the \"General Settings\" step"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:95
+msgid "<0>No restrictions</0> - No authentication required"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:77
+msgid "<0>No restrictions</0> - The document can be accessed directly by the URL sent to the recipient"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:75
+msgid "<0>None</0> - No authentication required"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:89
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:69
+msgid "<0>Require 2FA</0> - The recipient must have an account and 2FA enabled via their settings"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:72
+msgid "<0>Require account</0> - The recipient must be signed in to view the document"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:83
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:63
+msgid "<0>Require passkey</0> - The recipient must have an account and passkey configured via their settings"
+msgstr ""
+
+#: packages/ui/primitives/document-dropzone.tsx:69
+msgid "Add a document"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:305
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:339
+msgid "Add a URL to redirect the user to once the document is signed"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:217
+msgid "Add an external ID to the document. This can be used to identify the document in external systems."
+msgstr ""
+
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:256
+msgid "Add an external ID to the template. This can be used to identify in external systems."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:177
+msgid "Add another option"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:230
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx:167
+msgid "Add another value"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:359
+msgid "Add myself"
+msgstr ""
+
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:369
+msgid "Add Myself"
+msgstr ""
+
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:355
+msgid "Add Placeholder Recipient"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:348
+msgid "Add Signer"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:70
+msgid "Add text"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:75
+msgid "Add text to the field"
+msgstr ""
+
+#: packages/lib/constants/teams.ts:10
+msgid "Admin"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:199
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:238
+msgid "Advanced Options"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:510
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:369
+msgid "Advanced settings"
+msgstr ""
+
+#: packages/lib/constants/template.ts:21
+msgid "After submission, a document will be automatically generated and added to your documents page. You will also receive a notification via email."
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:8
+msgid "Approve"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:9
+msgid "Approved"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:11
+msgid "Approver"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:10
+msgid "Approving"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:297
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:58
+msgid "Cancel"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:164
+msgid "Cannot remove signer"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:17
+msgid "Cc"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:14
+#: packages/lib/constants/recipient-roles.ts:16
+msgid "CC"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:15
+msgid "CC'd"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:83
+msgid "Character Limit"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:932
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:755
+msgid "Checkbox"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:195
+msgid "Checkbox values"
+msgstr ""
+
+#: packages/ui/primitives/data-table.tsx:154
+msgid "Clear filters"
+msgstr ""
+
+#: packages/ui/primitives/signature-pad/signature-pad.tsx:256
+msgid "Clear Signature"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-signature.tsx:394
+msgid "Click to insert field"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/missing-signature-field-dialog.tsx:44
+msgid "Close"
+msgstr ""
+
+#: packages/lib/constants/template.ts:12
+msgid "Configure Direct Recipient"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:511
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:370
+msgid "Configure the {0} field"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/document-flow-root.tsx:141
+msgid "Continue"
+msgstr ""
+
+#: packages/ui/components/document/document-share-button.tsx:46
+msgid "Copied to clipboard"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-signature.tsx:360
+msgid "Custom Text"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:828
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:651
+msgid "Date"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:240
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:279
+msgid "Date Format"
+msgstr ""
+
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:312
+msgid "Direct link receiver"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:62
+#: packages/ui/primitives/document-flow/add-settings.tsx:166
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:151
+msgid "Document access"
+msgstr ""
+
+#: packages/lib/constants/template.ts:20
+msgid "Document Creation"
+msgstr ""
+
+#: packages/ui/components/document/document-download-button.tsx:68
+msgid "Download"
+msgstr ""
+
+#: packages/ui/primitives/document-dropzone.tsx:162
+msgid "Drag & drop your PDF here."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:958
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:781
+msgid "Dropdown"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:148
+msgid "Dropdown options"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:776
+#: packages/ui/primitives/document-flow/add-signature.tsx:272
+#: packages/ui/primitives/document-flow/add-signers.tsx:232
+#: packages/ui/primitives/document-flow/add-signers.tsx:239
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:599
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:210
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:217
+msgid "Email"
+msgstr ""
+
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:184
+msgid "Email Options"
+msgstr ""
+
+#: packages/lib/constants/template.ts:8
+msgid "Enable Direct Link Signing"
+msgstr ""
+
+#: packages/ui/primitives/document-password-dialog.tsx:84
+msgid "Enter password"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:226
+msgid "Error"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:210
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:249
+msgid "External ID"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:227
+msgid "Failed to save settings."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:90
+msgid "Field character limit"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:107
+msgid "Field format"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:50
+msgid "Field label"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:62
+msgid "Field placeholder"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:64
+msgid "Global recipient action authentication"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/document-flow-root.tsx:142
+msgid "Go Back"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:72
+msgid "I am a signer of this document"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:75
+msgid "I am a viewer of this document"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:73
+msgid "I am an approver of this document"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:74
+msgid "I am required to recieve a copy of this document"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:29
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:87
+msgid "Inherit authentication method"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:64
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:69
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:45
+msgid "Label"
+msgstr ""
+
+#: packages/lib/constants/teams.ts:11
+msgid "Manager"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:168
+msgid "Max"
+msgstr ""
+
+#: packages/lib/constants/teams.ts:12
+msgid "Member"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-subject.tsx:95
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:215
+msgid "Message <0>(Optional)</0>"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:156
+msgid "Min"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:802
+#: packages/ui/primitives/document-flow/add-signature.tsx:298
+#: packages/ui/primitives/document-flow/add-signers.tsx:265
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:625
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:245
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:251
+msgid "Name"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:52
+msgid "Needs to approve"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:31
+msgid "Needs to sign"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:73
+msgid "Needs to view"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:613
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:464
+msgid "No recipient matching this description was found."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:629
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:480
+msgid "No recipients with this role"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:30
+#: packages/ui/components/document/document-global-auth-access-select.tsx:43
+#: packages/ui/components/document/document-global-auth-action-select.tsx:31
+#: packages/ui/components/document/document-global-auth-action-select.tsx:46
+msgid "No restrictions"
+msgstr ""
+
+#: packages/ui/primitives/data-table.tsx:146
+msgid "No results found"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/missing-signature-field-dialog.tsx:30
+msgid "No signature field found"
+msgstr ""
+
+#: packages/ui/primitives/combobox.tsx:60
+#: packages/ui/primitives/multi-select-combobox.tsx:153
+msgid "No value found."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:880
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:703
+msgid "Number"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:100
+msgid "Number format"
+msgstr ""
+
+#: packages/lib/constants/template.ts:9
+msgid "Once enabled, you can select any active recipient to be a direct link signing recipient, or create a new one. This recipient type cannot be edited or deleted."
+msgstr ""
+
+#: packages/lib/constants/template.ts:17
+msgid "Once your template is set up, share the link anywhere you want. The person who opens the link will be able to enter their information in the direct link recipient field and complete any other fields assigned to them."
+msgstr ""
+
+#: packages/ui/primitives/data-table-pagination.tsx:77
+msgid "Page {0} of {1}"
+msgstr ""
+
+#: packages/ui/primitives/document-password-dialog.tsx:62
+msgid "Password Required"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:154
+msgid "Pick a number"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:76
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:81
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:57
+msgid "Placeholder"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:906
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:729
+msgid "Radio"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx:133
+msgid "Radio values"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:184
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:137
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:136
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx:122
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:114
+msgid "Read only"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:95
+msgid "Receives copy"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:39
+#: packages/ui/primitives/document-flow/add-settings.tsx:184
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:169
+msgid "Recipient action authentication"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:298
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:332
+msgid "Redirect URL"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:996
+msgid "Remove"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:174
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:127
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:126
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx:112
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:104
+msgid "Required field"
+msgstr ""
+
+#: packages/ui/primitives/data-table-pagination.tsx:55
+msgid "Rows per page"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:296
+msgid "Save"
+msgstr ""
+
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:797
+msgid "Save Template"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:105
+msgid "Select"
+msgstr ""
+
+#: packages/ui/primitives/combobox.tsx:38
+msgid "Select an option"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:137
+msgid "Select at least"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:95
+msgid "Select default option"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-subject.tsx:124
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:34
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:64
+msgid "Send"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:41
+msgid "Send Document"
+msgstr ""
+
+#: packages/ui/components/document/document-share-button.tsx:135
+msgid "Share Signature Card"
+msgstr ""
+
+#: packages/lib/constants/template.ts:16
+msgid "Share the Link"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:377
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:387
+msgid "Show advanced settings"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:20
+msgid "Sign"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:724
+#: packages/ui/primitives/document-flow/add-signature.tsx:323
+#: packages/ui/primitives/document-flow/field-icon.tsx:52
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:547
+msgid "Signature"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:21
+msgid "Signed"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:23
+msgid "Signer"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:22
+msgid "Signing"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/missing-signature-field-dialog.tsx:34
+msgid "Some signers have not been assigned a signature field. Please assign at least 1 signature field to each signer before proceeding."
+msgstr ""
+
+#: packages/ui/components/document/document-share-button.tsx:51
+msgid "Something went wrong"
+msgstr ""
+
+#: packages/ui/primitives/data-table.tsx:134
+msgid "Something went wrong."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/document-flow-root.tsx:107
+msgid "Step <0>{step} of {maxStep}</0>"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-subject.tsx:78
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:195
+msgid "Subject <0>(Optional)</0>"
+msgstr ""
+
+#: packages/ui/primitives/document-password-dialog.tsx:97
+msgid "Submit"
+msgstr ""
+
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:134
+msgid "Template title"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:854
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:677
+msgid "Text"
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:44
+msgid "The authentication required for recipients to sign fields"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:68
+msgid "The authentication required for recipients to sign the signature field."
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:67
+msgid "The authentication required for recipients to view the document."
+msgstr ""
+
+#: packages/ui/components/document/document-send-email-message-helper.tsx:31
+msgid "The document's name"
+msgstr ""
+
+#: packages/ui/primitives/document-password-dialog.tsx:52
+msgid "The password you have entered is incorrect. Please try again."
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:103
+msgid "The recipient is not required to take any action and receives a copy of the document after it is completed."
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:60
+msgid "The recipient is required to approve the document for it to be completed."
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:39
+msgid "The recipient is required to sign the document for it to be completed."
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:81
+msgid "The recipient is required to view the document for it to be completed."
+msgstr ""
+
+#: packages/ui/components/document/document-share-button.tsx:52
+msgid "The sharing link could not be created at this time. Please try again."
+msgstr ""
+
+#: packages/ui/components/document/document-share-button.tsx:47
+msgid "The sharing link has been copied to your clipboard."
+msgstr ""
+
+#: packages/ui/components/document/document-send-email-message-helper.tsx:25
+msgid "The signer's email"
+msgstr ""
+
+#: packages/ui/components/document/document-send-email-message-helper.tsx:19
+msgid "The signer's name"
+msgstr ""
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:72
+msgid "This can be overriden by setting the authentication requirements directly on each recipient in the next step."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:685
+msgid "This document has already been sent to this recipient. You can no longer edit this recipient."
+msgstr ""
+
+#: packages/ui/primitives/document-password-dialog.tsx:66
+msgid "This document is password protected. Please enter the password to view the document."
+msgstr ""
+
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:315
+msgid "This field cannot be modified or deleted. When you share this template's direct link or add it to your public profile, anyone who accesses it can input their name and email, and fill in the fields assigned to them."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:165
+msgid "This signer has already received the document."
+msgstr ""
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:48
+msgid "This will override any global settings."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:274
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:309
+msgid "Time Zone"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:145
+msgid "Title"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:971
+msgid "To proceed further, please set at least one value for the {0} field."
+msgstr ""
+
+#: packages/ui/primitives/document-flow/add-subject.tsx:124
+msgid "Update"
+msgstr ""
+
+#: packages/lib/constants/template.ts:13
+msgid "Update the role and add fields as required for the direct recipient. The individual who uses the direct link will sign the document as the direct recipient."
+msgstr ""
+
+#: packages/ui/primitives/document-dropzone.tsx:168
+msgid "Upgrade"
+msgstr ""
+
+#: packages/ui/primitives/document-dropzone.tsx:70
+msgid "Upload Template Document"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:130
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:147
+msgid "Validation"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:88
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:93
+msgid "Value"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:26
+msgid "View"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:27
+msgid "Viewed"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:29
+msgid "Viewer"
+msgstr ""
+
+#: packages/lib/constants/recipient-roles.ts:28
+msgid "Viewing"
+msgstr ""
+
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:44
+msgid "You are about to send this document to the recipients. Are you sure you want to continue?"
+msgstr ""
+
+#: packages/ui/components/document/document-send-email-message-helper.tsx:11
+msgid "You can use the following variables in your message:"
+msgstr ""
+
+#: packages/ui/primitives/document-dropzone.tsx:43
+msgid "You cannot upload documents at this time."
+msgstr ""
+
+#: packages/ui/primitives/document-dropzone.tsx:69
+msgid "You have reached your document limit."
+msgstr ""

packages/lib/translations/de/marketing.po

@@ -34,6 +34,10 @@ msgstr "5 Benutzer inbegriffen"
 msgid "A 10x better signing experience."
 msgstr "Eine 10x bessere Signaturerfahrung."
 
+#: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:51
+msgid "Add document"
+msgstr ""
+
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:201
 msgid "Add More Users for {0}"
 msgstr "Mehr Benutzer hinzufügen für {0}"
@@ -173,6 +177,10 @@ msgstr "E-Mail- und Discord-Support"
 msgid "Engagement"
 msgstr "Beteiligung"
 
+#: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:64
+msgid "Enter your details."
+msgstr ""
+
 #: apps/marketing/src/components/(marketing)/enterprise.tsx:16
 msgid "Enterprise Compliance, License or Technical Needs?"
 msgstr "Enterprise-Konformität, Lizenz- oder technische Bedürfnisse?"
@@ -441,6 +449,10 @@ msgstr "Dienstalter"
 msgid "Shop"
 msgstr "Shop"
 
+#: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:63
+msgid "Sign"
+msgstr ""
+
 #: apps/marketing/src/components/(marketing)/header.tsx:72
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:61
 msgid "Sign in"
@@ -554,6 +566,10 @@ msgstr "Unbegrenzte Dokumente pro Monat"
 msgid "Up to 10 recipients per document"
 msgstr "Bis zu 10 Empfänger pro Dokument"
 
+#: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:52
+msgid "Upload a document and add fields."
+msgstr ""
+
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:123
 msgid "Using our hosted version is the easiest way to get started, you can simply subscribe and start signing your documents. We take care of the infrastructure, so you can focus on your business. Additionally, when using our hosted version you benefit from our trusted signing certificates which helps you to build trust with your customers."
 msgstr "Die Nutzung unserer gehosteten Version ist der einfachste Weg, um zu starten. Sie können einfach abonnieren und mit der Unterzeichnung Ihrer Dokumente beginnen. Wir kümmern uns um die Infrastruktur, damit Sie sich auf Ihr Geschäft konzentrieren können. Zudem profitieren Sie bei der Nutzung unserer gehosteten Version von unseren vertrauenswürdigen Signaturzertifikaten, die Ihnen helfen, Vertrauen bei Ihren Kunden aufzubauen."
@@ -601,4 +617,3 @@ msgstr "Sie können Documenso kostenlos selbst hosten oder unsere sofort einsatz
 #: apps/marketing/src/components/(marketing)/carousel.tsx:265
 msgid "Your browser does not support the video tag."
 msgstr "Ihr Browser unterstützt das Video-Tag nicht."
-

packages/lib/translations/en/common.po

@@ -12,3 +12,730 @@ msgstr ""
 "Last-Translator: \n"
 "Language-Team: \n"
 "Plural-Forms: \n"
+
+#: packages/ui/primitives/data-table-pagination.tsx:30
+msgid "{0} of {1} row(s) selected."
+msgstr "{0} of {1} row(s) selected."
+
+#: packages/ui/primitives/data-table-pagination.tsx:41
+msgid "{visibleRows, plural, one {Showing # result.} other {Showing # results.}}"
+msgstr "{visibleRows, plural, one {Showing # result.} other {Showing # results.}}"
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:53
+msgid "<0>Inherit authentication method</0> - Use the global action signing authentication method configured in the \"General Settings\" step"
+msgstr "<0>Inherit authentication method</0> - Use the global action signing authentication method configured in the \"General Settings\" step"
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:95
+msgid "<0>No restrictions</0> - No authentication required"
+msgstr "<0>No restrictions</0> - No authentication required"
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:77
+msgid "<0>No restrictions</0> - The document can be accessed directly by the URL sent to the recipient"
+msgstr "<0>No restrictions</0> - The document can be accessed directly by the URL sent to the recipient"
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:75
+msgid "<0>None</0> - No authentication required"
+msgstr "<0>None</0> - No authentication required"
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:89
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:69
+msgid "<0>Require 2FA</0> - The recipient must have an account and 2FA enabled via their settings"
+msgstr "<0>Require 2FA</0> - The recipient must have an account and 2FA enabled via their settings"
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:72
+msgid "<0>Require account</0> - The recipient must be signed in to view the document"
+msgstr "<0>Require account</0> - The recipient must be signed in to view the document"
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:83
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:63
+msgid "<0>Require passkey</0> - The recipient must have an account and passkey configured via their settings"
+msgstr "<0>Require passkey</0> - The recipient must have an account and passkey configured via their settings"
+
+#: packages/ui/primitives/document-dropzone.tsx:69
+msgid "Add a document"
+msgstr "Add a document"
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:305
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:339
+msgid "Add a URL to redirect the user to once the document is signed"
+msgstr "Add a URL to redirect the user to once the document is signed"
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:217
+msgid "Add an external ID to the document. This can be used to identify the document in external systems."
+msgstr "Add an external ID to the document. This can be used to identify the document in external systems."
+
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:256
+msgid "Add an external ID to the template. This can be used to identify in external systems."
+msgstr "Add an external ID to the template. This can be used to identify in external systems."
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:177
+msgid "Add another option"
+msgstr "Add another option"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:230
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx:167
+msgid "Add another value"
+msgstr "Add another value"
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:359
+msgid "Add myself"
+msgstr "Add myself"
+
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:369
+msgid "Add Myself"
+msgstr "Add Myself"
+
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:355
+msgid "Add Placeholder Recipient"
+msgstr "Add Placeholder Recipient"
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:348
+msgid "Add Signer"
+msgstr "Add Signer"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:70
+msgid "Add text"
+msgstr "Add text"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:75
+msgid "Add text to the field"
+msgstr "Add text to the field"
+
+#: packages/lib/constants/teams.ts:10
+msgid "Admin"
+msgstr "Admin"
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:199
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:238
+msgid "Advanced Options"
+msgstr "Advanced Options"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:510
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:369
+msgid "Advanced settings"
+msgstr "Advanced settings"
+
+#: packages/lib/constants/template.ts:21
+msgid "After submission, a document will be automatically generated and added to your documents page. You will also receive a notification via email."
+msgstr "After submission, a document will be automatically generated and added to your documents page. You will also receive a notification via email."
+
+#: packages/lib/constants/recipient-roles.ts:8
+msgid "Approve"
+msgstr "Approve"
+
+#: packages/lib/constants/recipient-roles.ts:9
+msgid "Approved"
+msgstr "Approved"
+
+#: packages/lib/constants/recipient-roles.ts:11
+msgid "Approver"
+msgstr "Approver"
+
+#: packages/lib/constants/recipient-roles.ts:10
+msgid "Approving"
+msgstr "Approving"
+
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:297
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:58
+msgid "Cancel"
+msgstr "Cancel"
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:164
+msgid "Cannot remove signer"
+msgstr "Cannot remove signer"
+
+#: packages/lib/constants/recipient-roles.ts:17
+msgid "Cc"
+msgstr "Cc"
+
+#: packages/lib/constants/recipient-roles.ts:14
+#: packages/lib/constants/recipient-roles.ts:16
+msgid "CC"
+msgstr "CC"
+
+#: packages/lib/constants/recipient-roles.ts:15
+msgid "CC'd"
+msgstr "CC'd"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:83
+msgid "Character Limit"
+msgstr "Character Limit"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:932
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:755
+msgid "Checkbox"
+msgstr "Checkbox"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:195
+msgid "Checkbox values"
+msgstr "Checkbox values"
+
+#: packages/ui/primitives/data-table.tsx:154
+msgid "Clear filters"
+msgstr "Clear filters"
+
+#: packages/ui/primitives/signature-pad/signature-pad.tsx:256
+msgid "Clear Signature"
+msgstr "Clear Signature"
+
+#: packages/ui/primitives/document-flow/add-signature.tsx:394
+msgid "Click to insert field"
+msgstr "Click to insert field"
+
+#: packages/ui/primitives/document-flow/missing-signature-field-dialog.tsx:44
+msgid "Close"
+msgstr "Close"
+
+#: packages/lib/constants/template.ts:12
+msgid "Configure Direct Recipient"
+msgstr "Configure Direct Recipient"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:511
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:370
+msgid "Configure the {0} field"
+msgstr "Configure the {0} field"
+
+#: packages/ui/primitives/document-flow/document-flow-root.tsx:141
+msgid "Continue"
+msgstr "Continue"
+
+#: packages/ui/components/document/document-share-button.tsx:46
+msgid "Copied to clipboard"
+msgstr "Copied to clipboard"
+
+#: packages/ui/primitives/document-flow/add-signature.tsx:360
+msgid "Custom Text"
+msgstr "Custom Text"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:828
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:651
+msgid "Date"
+msgstr "Date"
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:240
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:279
+msgid "Date Format"
+msgstr "Date Format"
+
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:312
+msgid "Direct link receiver"
+msgstr "Direct link receiver"
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:62
+#: packages/ui/primitives/document-flow/add-settings.tsx:166
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:151
+msgid "Document access"
+msgstr "Document access"
+
+#: packages/lib/constants/template.ts:20
+msgid "Document Creation"
+msgstr "Document Creation"
+
+#: packages/ui/components/document/document-download-button.tsx:68
+msgid "Download"
+msgstr "Download"
+
+#: packages/ui/primitives/document-dropzone.tsx:162
+msgid "Drag & drop your PDF here."
+msgstr "Drag & drop your PDF here."
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:958
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:781
+msgid "Dropdown"
+msgstr "Dropdown"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:148
+msgid "Dropdown options"
+msgstr "Dropdown options"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:776
+#: packages/ui/primitives/document-flow/add-signature.tsx:272
+#: packages/ui/primitives/document-flow/add-signers.tsx:232
+#: packages/ui/primitives/document-flow/add-signers.tsx:239
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:599
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:210
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:217
+msgid "Email"
+msgstr "Email"
+
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:184
+msgid "Email Options"
+msgstr "Email Options"
+
+#: packages/lib/constants/template.ts:8
+msgid "Enable Direct Link Signing"
+msgstr "Enable Direct Link Signing"
+
+#: packages/ui/primitives/document-password-dialog.tsx:84
+msgid "Enter password"
+msgstr "Enter password"
+
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:226
+msgid "Error"
+msgstr "Error"
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:210
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:249
+msgid "External ID"
+msgstr "External ID"
+
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:227
+msgid "Failed to save settings."
+msgstr "Failed to save settings."
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:90
+msgid "Field character limit"
+msgstr "Field character limit"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:107
+msgid "Field format"
+msgstr "Field format"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:50
+msgid "Field label"
+msgstr "Field label"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:62
+msgid "Field placeholder"
+msgstr "Field placeholder"
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:64
+msgid "Global recipient action authentication"
+msgstr "Global recipient action authentication"
+
+#: packages/ui/primitives/document-flow/document-flow-root.tsx:142
+msgid "Go Back"
+msgstr "Go Back"
+
+#: packages/lib/constants/recipient-roles.ts:72
+msgid "I am a signer of this document"
+msgstr "I am a signer of this document"
+
+#: packages/lib/constants/recipient-roles.ts:75
+msgid "I am a viewer of this document"
+msgstr "I am a viewer of this document"
+
+#: packages/lib/constants/recipient-roles.ts:73
+msgid "I am an approver of this document"
+msgstr "I am an approver of this document"
+
+#: packages/lib/constants/recipient-roles.ts:74
+msgid "I am required to recieve a copy of this document"
+msgstr "I am required to recieve a copy of this document"
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:29
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:87
+msgid "Inherit authentication method"
+msgstr "Inherit authentication method"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:64
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:69
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:45
+msgid "Label"
+msgstr "Label"
+
+#: packages/lib/constants/teams.ts:11
+msgid "Manager"
+msgstr "Manager"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:168
+msgid "Max"
+msgstr "Max"
+
+#: packages/lib/constants/teams.ts:12
+msgid "Member"
+msgstr "Member"
+
+#: packages/ui/primitives/document-flow/add-subject.tsx:95
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:215
+msgid "Message <0>(Optional)</0>"
+msgstr "Message <0>(Optional)</0>"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:156
+msgid "Min"
+msgstr "Min"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:802
+#: packages/ui/primitives/document-flow/add-signature.tsx:298
+#: packages/ui/primitives/document-flow/add-signers.tsx:265
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:625
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:245
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:251
+msgid "Name"
+msgstr "Name"
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:52
+msgid "Needs to approve"
+msgstr "Needs to approve"
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:31
+msgid "Needs to sign"
+msgstr "Needs to sign"
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:73
+msgid "Needs to view"
+msgstr "Needs to view"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:613
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:464
+msgid "No recipient matching this description was found."
+msgstr "No recipient matching this description was found."
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:629
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:480
+msgid "No recipients with this role"
+msgstr "No recipients with this role"
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:30
+#: packages/ui/components/document/document-global-auth-access-select.tsx:43
+#: packages/ui/components/document/document-global-auth-action-select.tsx:31
+#: packages/ui/components/document/document-global-auth-action-select.tsx:46
+msgid "No restrictions"
+msgstr "No restrictions"
+
+#: packages/ui/primitives/data-table.tsx:146
+msgid "No results found"
+msgstr "No results found"
+
+#: packages/ui/primitives/document-flow/missing-signature-field-dialog.tsx:30
+msgid "No signature field found"
+msgstr "No signature field found"
+
+#: packages/ui/primitives/combobox.tsx:60
+#: packages/ui/primitives/multi-select-combobox.tsx:153
+msgid "No value found."
+msgstr "No value found."
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:880
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:703
+msgid "Number"
+msgstr "Number"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:100
+msgid "Number format"
+msgstr "Number format"
+
+#: packages/lib/constants/template.ts:9
+msgid "Once enabled, you can select any active recipient to be a direct link signing recipient, or create a new one. This recipient type cannot be edited or deleted."
+msgstr "Once enabled, you can select any active recipient to be a direct link signing recipient, or create a new one. This recipient type cannot be edited or deleted."
+
+#: packages/lib/constants/template.ts:17
+msgid "Once your template is set up, share the link anywhere you want. The person who opens the link will be able to enter their information in the direct link recipient field and complete any other fields assigned to them."
+msgstr "Once your template is set up, share the link anywhere you want. The person who opens the link will be able to enter their information in the direct link recipient field and complete any other fields assigned to them."
+
+#: packages/ui/primitives/data-table-pagination.tsx:77
+msgid "Page {0} of {1}"
+msgstr "Page {0} of {1}"
+
+#: packages/ui/primitives/document-password-dialog.tsx:62
+msgid "Password Required"
+msgstr "Password Required"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:154
+msgid "Pick a number"
+msgstr "Pick a number"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:76
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:81
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:57
+msgid "Placeholder"
+msgstr "Placeholder"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:906
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:729
+msgid "Radio"
+msgstr "Radio"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx:133
+msgid "Radio values"
+msgstr "Radio values"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:184
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:137
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:136
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx:122
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:114
+msgid "Read only"
+msgstr "Read only"
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:95
+msgid "Receives copy"
+msgstr "Receives copy"
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:39
+#: packages/ui/primitives/document-flow/add-settings.tsx:184
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:169
+msgid "Recipient action authentication"
+msgstr "Recipient action authentication"
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:298
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:332
+msgid "Redirect URL"
+msgstr "Redirect URL"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:996
+msgid "Remove"
+msgstr "Remove"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:174
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:127
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:126
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx:112
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx:104
+msgid "Required field"
+msgstr "Required field"
+
+#: packages/ui/primitives/data-table-pagination.tsx:55
+msgid "Rows per page"
+msgstr "Rows per page"
+
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:296
+msgid "Save"
+msgstr "Save"
+
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:797
+msgid "Save Template"
+msgstr "Save Template"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:105
+msgid "Select"
+msgstr "Select"
+
+#: packages/ui/primitives/combobox.tsx:38
+msgid "Select an option"
+msgstr "Select an option"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:137
+msgid "Select at least"
+msgstr "Select at least"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:95
+msgid "Select default option"
+msgstr "Select default option"
+
+#: packages/ui/primitives/document-flow/add-subject.tsx:124
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:34
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:64
+msgid "Send"
+msgstr "Send"
+
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:41
+msgid "Send Document"
+msgstr "Send Document"
+
+#: packages/ui/components/document/document-share-button.tsx:135
+msgid "Share Signature Card"
+msgstr "Share Signature Card"
+
+#: packages/lib/constants/template.ts:16
+msgid "Share the Link"
+msgstr "Share the Link"
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:377
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:387
+msgid "Show advanced settings"
+msgstr "Show advanced settings"
+
+#: packages/lib/constants/recipient-roles.ts:20
+msgid "Sign"
+msgstr "Sign"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:724
+#: packages/ui/primitives/document-flow/add-signature.tsx:323
+#: packages/ui/primitives/document-flow/field-icon.tsx:52
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:547
+msgid "Signature"
+msgstr "Signature"
+
+#: packages/lib/constants/recipient-roles.ts:21
+msgid "Signed"
+msgstr "Signed"
+
+#: packages/lib/constants/recipient-roles.ts:23
+msgid "Signer"
+msgstr "Signer"
+
+#: packages/lib/constants/recipient-roles.ts:22
+msgid "Signing"
+msgstr "Signing"
+
+#: packages/ui/primitives/document-flow/missing-signature-field-dialog.tsx:34
+msgid "Some signers have not been assigned a signature field. Please assign at least 1 signature field to each signer before proceeding."
+msgstr "Some signers have not been assigned a signature field. Please assign at least 1 signature field to each signer before proceeding."
+
+#: packages/ui/components/document/document-share-button.tsx:51
+msgid "Something went wrong"
+msgstr "Something went wrong"
+
+#: packages/ui/primitives/data-table.tsx:134
+msgid "Something went wrong."
+msgstr "Something went wrong."
+
+#: packages/ui/primitives/document-flow/document-flow-root.tsx:107
+msgid "Step <0>{step} of {maxStep}</0>"
+msgstr "Step <0>{step} of {maxStep}</0>"
+
+#: packages/ui/primitives/document-flow/add-subject.tsx:78
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:195
+msgid "Subject <0>(Optional)</0>"
+msgstr "Subject <0>(Optional)</0>"
+
+#: packages/ui/primitives/document-password-dialog.tsx:97
+msgid "Submit"
+msgstr "Submit"
+
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:134
+msgid "Template title"
+msgstr "Template title"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:854
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:677
+msgid "Text"
+msgstr "Text"
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:44
+msgid "The authentication required for recipients to sign fields"
+msgstr "The authentication required for recipients to sign fields"
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:68
+msgid "The authentication required for recipients to sign the signature field."
+msgstr "The authentication required for recipients to sign the signature field."
+
+#: packages/ui/components/document/document-global-auth-access-select.tsx:67
+msgid "The authentication required for recipients to view the document."
+msgstr "The authentication required for recipients to view the document."
+
+#: packages/ui/components/document/document-send-email-message-helper.tsx:31
+msgid "The document's name"
+msgstr "The document's name"
+
+#: packages/ui/primitives/document-password-dialog.tsx:52
+msgid "The password you have entered is incorrect. Please try again."
+msgstr "The password you have entered is incorrect. Please try again."
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:103
+msgid "The recipient is not required to take any action and receives a copy of the document after it is completed."
+msgstr "The recipient is not required to take any action and receives a copy of the document after it is completed."
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:60
+msgid "The recipient is required to approve the document for it to be completed."
+msgstr "The recipient is required to approve the document for it to be completed."
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:39
+msgid "The recipient is required to sign the document for it to be completed."
+msgstr "The recipient is required to sign the document for it to be completed."
+
+#: packages/ui/components/recipient/recipient-role-select.tsx:81
+msgid "The recipient is required to view the document for it to be completed."
+msgstr "The recipient is required to view the document for it to be completed."
+
+#: packages/ui/components/document/document-share-button.tsx:52
+msgid "The sharing link could not be created at this time. Please try again."
+msgstr "The sharing link could not be created at this time. Please try again."
+
+#: packages/ui/components/document/document-share-button.tsx:47
+msgid "The sharing link has been copied to your clipboard."
+msgstr "The sharing link has been copied to your clipboard."
+
+#: packages/ui/components/document/document-send-email-message-helper.tsx:25
+msgid "The signer's email"
+msgstr "The signer's email"
+
+#: packages/ui/components/document/document-send-email-message-helper.tsx:19
+msgid "The signer's name"
+msgstr "The signer's name"
+
+#: packages/ui/components/document/document-global-auth-action-select.tsx:72
+msgid "This can be overriden by setting the authentication requirements directly on each recipient in the next step."
+msgstr "This can be overriden by setting the authentication requirements directly on each recipient in the next step."
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:685
+msgid "This document has already been sent to this recipient. You can no longer edit this recipient."
+msgstr "This document has already been sent to this recipient. You can no longer edit this recipient."
+
+#: packages/ui/primitives/document-password-dialog.tsx:66
+msgid "This document is password protected. Please enter the password to view the document."
+msgstr "This document is password protected. Please enter the password to view the document."
+
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:315
+msgid "This field cannot be modified or deleted. When you share this template's direct link or add it to your public profile, anyone who accesses it can input their name and email, and fill in the fields assigned to them."
+msgstr "This field cannot be modified or deleted. When you share this template's direct link or add it to your public profile, anyone who accesses it can input their name and email, and fill in the fields assigned to them."
+
+#: packages/ui/primitives/document-flow/add-signers.tsx:165
+msgid "This signer has already received the document."
+msgstr "This signer has already received the document."
+
+#: packages/ui/components/recipient/recipient-action-auth-select.tsx:48
+msgid "This will override any global settings."
+msgstr "This will override any global settings."
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:274
+#: packages/ui/primitives/template-flow/add-template-settings.tsx:309
+msgid "Time Zone"
+msgstr "Time Zone"
+
+#: packages/ui/primitives/document-flow/add-settings.tsx:145
+msgid "Title"
+msgstr "Title"
+
+#: packages/ui/primitives/document-flow/add-fields.tsx:971
+msgid "To proceed further, please set at least one value for the {0} field."
+msgstr "To proceed further, please set at least one value for the {0} field."
+
+#: packages/ui/primitives/document-flow/add-subject.tsx:124
+msgid "Update"
+msgstr "Update"
+
+#: packages/lib/constants/template.ts:13
+msgid "Update the role and add fields as required for the direct recipient. The individual who uses the direct link will sign the document as the direct recipient."
+msgstr "Update the role and add fields as required for the direct recipient. The individual who uses the direct link will sign the document as the direct recipient."
+
+#: packages/ui/primitives/document-dropzone.tsx:168
+msgid "Upgrade"
+msgstr "Upgrade"
+
+#: packages/ui/primitives/document-dropzone.tsx:70
+msgid "Upload Template Document"
+msgstr "Upload Template Document"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx:130
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:147
+msgid "Validation"
+msgstr "Validation"
+
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:88
+#: packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx:93
+msgid "Value"
+msgstr "Value"
+
+#: packages/lib/constants/recipient-roles.ts:26
+msgid "View"
+msgstr "View"
+
+#: packages/lib/constants/recipient-roles.ts:27
+msgid "Viewed"
+msgstr "Viewed"
+
+#: packages/lib/constants/recipient-roles.ts:29
+msgid "Viewer"
+msgstr "Viewer"
+
+#: packages/lib/constants/recipient-roles.ts:28
+msgid "Viewing"
+msgstr "Viewing"
+
+#: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:44
+msgid "You are about to send this document to the recipients. Are you sure you want to continue?"
+msgstr "You are about to send this document to the recipients. Are you sure you want to continue?"
+
+#: packages/ui/components/document/document-send-email-message-helper.tsx:11
+msgid "You can use the following variables in your message:"
+msgstr "You can use the following variables in your message:"
+
+#: packages/ui/primitives/document-dropzone.tsx:43
+msgid "You cannot upload documents at this time."
+msgstr "You cannot upload documents at this time."
+
+#: packages/ui/primitives/document-dropzone.tsx:69
+msgid "You have reached your document limit."
+msgstr "You have reached your document limit."

packages/lib/translations/en/marketing.po

@@ -29,6 +29,10 @@ msgstr "5 Users Included"
 msgid "A 10x better signing experience."
 msgstr "A 10x better signing experience."
 
+#: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:51
+msgid "Add document"
+msgstr "Add document"
+
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:201
 msgid "Add More Users for {0}"
 msgstr "Add More Users for {0}"
@@ -168,6 +172,10 @@ msgstr "Email and Discord Support"
 msgid "Engagement"
 msgstr "Engagement"
 
+#: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:64
+msgid "Enter your details."
+msgstr "Enter your details."
+
 #: apps/marketing/src/components/(marketing)/enterprise.tsx:16
 msgid "Enterprise Compliance, License or Technical Needs?"
 msgstr "Enterprise Compliance, License or Technical Needs?"
@@ -436,6 +444,10 @@ msgstr "Seniority"
 msgid "Shop"
 msgstr "Shop"
 
+#: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:63
+msgid "Sign"
+msgstr "Sign"
+
 #: apps/marketing/src/components/(marketing)/header.tsx:72
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:61
 msgid "Sign in"
@@ -549,6 +561,10 @@ msgstr "Unlimited Documents per Month"
 msgid "Up to 10 recipients per document"
 msgstr "Up to 10 recipients per document"
 
+#: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:52
+msgid "Upload a document and add fields."
+msgstr "Upload a document and add fields."
+
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:123
 msgid "Using our hosted version is the easiest way to get started, you can simply subscribe and start signing your documents. We take care of the infrastructure, so you can focus on your business. Additionally, when using our hosted version you benefit from our trusted signing certificates which helps you to build trust with your customers."
 msgstr "Using our hosted version is the easiest way to get started, you can simply subscribe and start signing your documents. We take care of the infrastructure, so you can focus on your business. Additionally, when using our hosted version you benefit from our trusted signing certificates which helps you to build trust with your customers."

packages/lib/utils/document-audit-logs.ts

@@ -8,7 +8,7 @@ import type {
   RecipientRole,
 } from '@documenso/prisma/client';
 
-import { RECIPIENT_ROLES_DESCRIPTION } from '../constants/recipient-roles';
+import { RECIPIENT_ROLES_DESCRIPTION_ENG } from '../constants/recipient-roles';
 import type {
   TDocumentAuditLog,
   TDocumentAuditLogDocumentMetaDiffSchema,
@@ -268,6 +268,7 @@ export const formatDocumentAuditLogActionString = (
  *
  * Provide a userId to prefix the action with the user, example 'X did Y'.
  */
+// Todo: Translations.
 export const formatDocumentAuditLogAction = (auditLog: TDocumentAuditLog, userId?: number) => {
   let prefix = userId === auditLog.userId ? 'You' : auditLog.name || auditLog.email || '';
 
@@ -346,7 +347,7 @@ export const formatDocumentAuditLogAction = (auditLog: TDocumentAuditLog, userId
     }))
     .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_COMPLETED }, ({ data }) => {
       // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-      const action = RECIPIENT_ROLES_DESCRIPTION[data.recipientRole as RecipientRole]?.actioned;
+      const action = RECIPIENT_ROLES_DESCRIPTION_ENG[data.recipientRole as RecipientRole]?.actioned;
 
       const value = action ? `${action.toLowerCase()} the document` : 'completed their task';
 

packages/prisma/seed/templates.ts

@@ -4,7 +4,7 @@ import path from 'node:path';
 import {
   DIRECT_TEMPLATE_RECIPIENT_EMAIL,
   DIRECT_TEMPLATE_RECIPIENT_NAME,
-} from '@documenso/lib/constants/template';
+} from '@documenso/lib/constants/direct-templates';
 
 import { prisma } from '..';
 import type { Prisma, User } from '../client';

packages/ui/components/document/document-download-button.tsx

@@ -3,6 +3,8 @@
 import type { HTMLAttributes } from 'react';
 import { useState } from 'react';
 
+import { Trans } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { Download } from 'lucide-react';
 
 import { downloadPDF } from '@documenso/lib/client-only/download-pdf';
@@ -24,9 +26,11 @@ export const DocumentDownloadButton = ({
   disabled,
   ...props
 }: DownloadButtonProps) => {
-  const [isLoading, setIsLoading] = useState(false);
+  const { _ } = useLingui();
   const { toast } = useToast();
 
+  const [isLoading, setIsLoading] = useState(false);
+
   const onDownloadClick = async () => {
     try {
       setIsLoading(true);
@@ -43,8 +47,8 @@ export const DocumentDownloadButton = ({
       setIsLoading(false);
 
       toast({
-        title: 'Something went wrong',
-        description: 'An error occurred while downloading your document.',
+        title: _('Something went wrong'),
+        description: _('An error occurred while downloading your document.'),
         variant: 'destructive',
       });
     }
@@ -61,7 +65,7 @@ export const DocumentDownloadButton = ({
       {...props}
     >
       {!isLoading && <Download className="mr-2 h-5 w-5" />}
-      Download
+      <Trans>Download</Trans>
     </Button>
   );
 };

packages/ui/components/document/document-global-auth-access-select.tsx

@@ -2,6 +2,8 @@
 
 import React, { forwardRef } from 'react';
 
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import type { SelectProps } from '@radix-ui/react-select';
 import { InfoIcon } from 'lucide-react';
 
@@ -17,24 +19,33 @@ import {
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
 export const DocumentGlobalAuthAccessSelect = forwardRef<HTMLButtonElement, SelectProps>(
-  (props, ref) => (
-    <Select {...props}>
-      <SelectTrigger ref={ref} className="bg-background text-muted-foreground">
-        <SelectValue data-testid="documentAccessSelectValue" placeholder="No restrictions" />
-      </SelectTrigger>
+  (props, ref) => {
+    const { _ } = useLingui();
 
-      <SelectContent position="popper">
-        {Object.values(DocumentAccessAuth).map((authType) => (
-          <SelectItem key={authType} value={authType}>
-            {DOCUMENT_AUTH_TYPES[authType].value}
+    return (
+      <Select {...props}>
+        <SelectTrigger ref={ref} className="bg-background text-muted-foreground">
+          <SelectValue
+            data-testid="documentAccessSelectValue"
+            placeholder={_(msg`No restrictions`)}
+          />
+        </SelectTrigger>
+
+        <SelectContent position="popper">
+          {Object.values(DocumentAccessAuth).map((authType) => (
+            <SelectItem key={authType} value={authType}>
+              {DOCUMENT_AUTH_TYPES[authType].value}
+            </SelectItem>
+          ))}
+
+          {/* Note: -1 is remapped in the Zod schema to the required value. */}
+          <SelectItem value={'-1'}>
+            <Trans>No restrictions</Trans>
           </SelectItem>
-        ))}
-
-        {/* Note: -1 is remapped in the Zod schema to the required value. */}
-        <SelectItem value={'-1'}>No restrictions</SelectItem>
-      </SelectContent>
-    </Select>
-  ),
+        </SelectContent>
+      </Select>
+    );
+  },
 );
 
 DocumentGlobalAuthAccessSelect.displayName = 'DocumentGlobalAuthAccessSelect';
@@ -47,18 +58,26 @@ export const DocumentGlobalAuthAccessTooltip = () => (
 
     <TooltipContent className="text-foreground max-w-md space-y-2 p-4">
       <h2>
-        <strong>Document access</strong>
+        <strong>
+          <Trans>Document access</Trans>
+        </strong>
       </h2>
 
-      <p>The authentication required for recipients to view the document.</p>
+      <p>
+        <Trans>The authentication required for recipients to view the document.</Trans>
+      </p>
 
       <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
         <li>
-          <strong>Require account</strong> - The recipient must be signed in to view the document
+          <Trans>
+            <strong>Require account</strong> - The recipient must be signed in to view the document
+          </Trans>
         </li>
         <li>
-          <strong>No restrictions</strong> - The document can be accessed directly by the URL sent
-          to the recipient
+          <Trans>
+            <strong>No restrictions</strong> - The document can be accessed directly by the URL sent
+            to the recipient
+          </Trans>
         </li>
       </ul>
     </TooltipContent>

packages/ui/components/document/document-global-auth-action-select.tsx

@@ -2,6 +2,8 @@
 
 import React, { forwardRef } from 'react';
 
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import type { SelectProps } from '@radix-ui/react-select';
 import { InfoIcon } from 'lucide-react';
 
@@ -17,26 +19,36 @@ import {
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
 export const DocumentGlobalAuthActionSelect = forwardRef<HTMLButtonElement, SelectProps>(
-  (props, ref) => (
-    <Select {...props}>
-      <SelectTrigger className="bg-background text-muted-foreground">
-        <SelectValue ref={ref} data-testid="documentActionSelectValue" placeholder="No restrictions" />
-      </SelectTrigger>
+  (props, ref) => {
+    const { _ } = useLingui();
 
-      <SelectContent position="popper">
-        {Object.values(DocumentActionAuth)
-          .filter((auth) => auth !== DocumentAuth.ACCOUNT)
-          .map((authType) => (
-            <SelectItem key={authType} value={authType}>
-              {DOCUMENT_AUTH_TYPES[authType].value}
-            </SelectItem>
-          ))}
+    return (
+      <Select {...props}>
+        <SelectTrigger className="bg-background text-muted-foreground">
+          <SelectValue
+            ref={ref}
+            data-testid="documentActionSelectValue"
+            placeholder={_(msg`No restrictions`)}
+          />
+        </SelectTrigger>
 
-        {/* Note: -1 is remapped in the Zod schema to the required value. */}
-        <SelectItem value={'-1'}>No restrictions</SelectItem>
-      </SelectContent>
-    </Select>
-  ),
+        <SelectContent position="popper">
+          {Object.values(DocumentActionAuth)
+            .filter((auth) => auth !== DocumentAuth.ACCOUNT)
+            .map((authType) => (
+              <SelectItem key={authType} value={authType}>
+                {DOCUMENT_AUTH_TYPES[authType].value}
+              </SelectItem>
+            ))}
+
+          {/* Note: -1 is remapped in the Zod schema to the required value. */}
+          <SelectItem value={'-1'}>
+            <Trans>No restrictions</Trans>
+          </SelectItem>
+        </SelectContent>
+      </Select>
+    );
+  },
 );
 
 DocumentGlobalAuthActionSelect.displayName = 'DocumentGlobalAuthActionSelect';
@@ -48,13 +60,19 @@ export const DocumentGlobalAuthActionTooltip = () => (
     </TooltipTrigger>
 
     <TooltipContent className="text-foreground max-w-md space-y-2 p-4">
-      <h2>Global recipient action authentication</h2>
-
-      <p>The authentication required for recipients to sign the signature field.</p>
+      <h2>
+        <Trans>Global recipient action authentication</Trans>
+      </h2>
 
       <p>
-        This can be overriden by setting the authentication requirements directly on each recipient
-        in the next step.
+        <Trans>The authentication required for recipients to sign the signature field.</Trans>
+      </p>
+
+      <p>
+        <Trans>
+          This can be overriden by setting the authentication requirements directly on each
+          recipient in the next step.
+        </Trans>
       </p>
 
       <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
@@ -62,15 +80,21 @@ export const DocumentGlobalAuthActionTooltip = () => (
           <strong>Require account</strong> - The recipient must be signed in
         </li> */}
         <li>
-          <strong>Require passkey</strong> - The recipient must have an account and passkey
-          configured via their settings
+          <Trans>
+            <strong>Require passkey</strong> - The recipient must have an account and passkey
+            configured via their settings
+          </Trans>
         </li>
         <li>
-          <strong>Require 2FA</strong> - The recipient must have an account and 2FA enabled via
-          their settings
+          <Trans>
+            <strong>Require 2FA</strong> - The recipient must have an account and 2FA enabled via
+            their settings
+          </Trans>
         </li>
         <li>
-          <strong>No restrictions</strong> - No authentication required
+          <Trans>
+            <strong>No restrictions</strong> - No authentication required
+          </Trans>
         </li>
       </ul>
     </TooltipContent>

packages/ui/components/document/document-send-email-message-helper.tsx

@@ -2,11 +2,13 @@
 
 import React from 'react';
 
+import { Trans } from '@lingui/macro';
+
 export const DocumentSendEmailMessageHelper = () => {
   return (
     <div>
       <p className="text-muted-foreground text-sm">
-        You can use the following variables in your message:
+        <Trans>You can use the following variables in your message:</Trans>
       </p>
 
       <ul className="mt-2 flex list-inside list-disc flex-col gap-y-2 text-sm">
@@ -14,19 +16,19 @@ export const DocumentSendEmailMessageHelper = () => {
           <code className="text-muted-foreground bg-muted-foreground/20 rounded p-1 text-sm">
             {'{signer.name}'}
           </code>{' '}
-          - The signer's name
+          - <Trans>The signer's name</Trans>
         </li>
         <li className="text-muted-foreground">
           <code className="text-muted-foreground bg-muted-foreground/20 rounded p-1 text-sm">
             {'{signer.email}'}
           </code>{' '}
-          - The signer's email
+          - <Trans>The signer's email</Trans>
         </li>
         <li className="text-muted-foreground">
           <code className="text-muted-foreground bg-muted-foreground/20 rounded p-1 text-sm">
             {'{document.name}'}
           </code>{' '}
-          - The document's name
+          - <Trans>The document's name</Trans>
         </li>
       </ul>
     </div>

packages/ui/components/document/document-share-button.tsx

@@ -3,15 +3,13 @@
 import type { HTMLAttributes } from 'react';
 import React, { useState } from 'react';
 
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { Copy, Sparkles } from 'lucide-react';
 import { FaXTwitter } from 'react-icons/fa6';
 
 import { useCopyShareLink } from '@documenso/lib/client-only/hooks/use-copy-share-link';
 import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
-import {
-  TOAST_DOCUMENT_SHARE_ERROR,
-  TOAST_DOCUMENT_SHARE_SUCCESS,
-} from '@documenso/lib/constants/toast';
 import { generateTwitterIntent } from '@documenso/lib/universal/generate-twitter-intent';
 import { trpc } from '@documenso/trpc/react';
 
@@ -39,11 +37,22 @@ export const DocumentShareButton = ({
   className,
   trigger,
 }: DocumentShareButtonProps) => {
+  const { _ } = useLingui();
   const { toast } = useToast();
 
   const { copyShareLink, createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink({
-    onSuccess: () => toast(TOAST_DOCUMENT_SHARE_SUCCESS),
-    onError: () => toast(TOAST_DOCUMENT_SHARE_ERROR),
+    onSuccess: () =>
+      toast({
+        title: _(msg`Copied to clipboard`),
+        description: _(msg`The sharing link has been copied to your clipboard.`),
+      }),
+    onError: () =>
+      toast({
+        title: _(msg`Something went wrong`),
+        description: _(msg`The sharing link could not be created at this time. Please try again.`),
+        variant: 'destructive',
+        duration: 5000,
+      }),
   });
 
   const [isOpen, setIsOpen] = useState(false);
@@ -123,7 +132,7 @@ export const DocumentShareButton = ({
             loading={isLoading}
           >
             {!isLoading && <Sparkles className="mr-2 h-5 w-5" />}
-            Share Signature Card
+            <Trans>Share Signature Card</Trans>
           </Button>
         )}
       </DialogTrigger>

packages/ui/components/recipient/recipient-action-auth-select.tsx

@@ -2,6 +2,8 @@
 
 import React from 'react';
 
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import type { SelectProps } from '@radix-ui/react-select';
 import { InfoIcon } from 'lucide-react';
 
@@ -19,10 +21,12 @@ import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitive
 export type RecipientActionAuthSelectProps = SelectProps;
 
 export const RecipientActionAuthSelect = (props: RecipientActionAuthSelectProps) => {
+  const { _ } = useLingui();
+
   return (
     <Select {...props}>
       <SelectTrigger className="bg-background text-muted-foreground">
-        <SelectValue placeholder="Inherit authentication method" />
+        <SelectValue placeholder={_(msg`Inherit authentication method`)} />
 
         <Tooltip>
           <TooltipTrigger className="-mr-1 ml-auto">
@@ -31,32 +35,46 @@ export const RecipientActionAuthSelect = (props: RecipientActionAuthSelectProps)
 
           <TooltipContent className="text-foreground max-w-md p-4">
             <h2>
-              <strong>Recipient action authentication</strong>
+              <strong>
+                <Trans>Recipient action authentication</Trans>
+              </strong>
             </h2>
 
-            <p>The authentication required for recipients to sign fields</p>
+            <p>
+              <Trans>The authentication required for recipients to sign fields</Trans>
+            </p>
 
-            <p className="mt-2">This will override any global settings.</p>
+            <p className="mt-2">
+              <Trans>This will override any global settings.</Trans>
+            </p>
 
             <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
               <li>
-                <strong>Inherit authentication method</strong> - Use the global action signing
-                authentication method configured in the "General Settings" step
+                <Trans>
+                  <strong>Inherit authentication method</strong> - Use the global action signing
+                  authentication method configured in the "General Settings" step
+                </Trans>
               </li>
               {/* <li>
                 <strong>Require account</strong> - The recipient must be
                 signed in
               </li> */}
               <li>
-                <strong>Require passkey</strong> - The recipient must have an account and passkey
-                configured via their settings
+                <Trans>
+                  <strong>Require passkey</strong> - The recipient must have an account and passkey
+                  configured via their settings
+                </Trans>
               </li>
               <li>
-                <strong>Require 2FA</strong> - The recipient must have an account and 2FA enabled
-                via their settings
+                <Trans>
+                  <strong>Require 2FA</strong> - The recipient must have an account and 2FA enabled
+                  via their settings
+                </Trans>
               </li>
               <li>
-                <strong>None</strong> - No authentication required
+                <Trans>
+                  <strong>None</strong> - No authentication required
+                </Trans>
               </li>
             </ul>
           </TooltipContent>
@@ -65,7 +83,9 @@ export const RecipientActionAuthSelect = (props: RecipientActionAuthSelectProps)
 
       <SelectContent position="popper">
         {/* Note: -1 is remapped in the Zod schema to the required value. */}
-        <SelectItem value="-1">Inherit authentication method</SelectItem>
+        <SelectItem value="-1">
+          <Trans>Inherit authentication method</Trans>
+        </SelectItem>
 
         {Object.values(RecipientActionAuth)
           .filter((auth) => auth !== RecipientActionAuth.ACCOUNT)

packages/ui/components/recipient/recipient-role-select.tsx

@@ -2,6 +2,7 @@
 
 import React, { forwardRef } from 'react';
 
+import { Trans } from '@lingui/macro';
 import type { SelectProps } from '@radix-ui/react-select';
 import { InfoIcon } from 'lucide-react';
 
@@ -27,14 +28,18 @@ export const RecipientRoleSelect = forwardRef<HTMLButtonElement, RecipientRoleSe
           <div className="flex items-center">
             <div className="flex w-[150px] items-center">
               <span className="mr-2">{ROLE_ICONS[RecipientRole.SIGNER]}</span>
-              Needs to sign
+              <Trans>Needs to sign</Trans>
             </div>
             <Tooltip>
               <TooltipTrigger>
                 <InfoIcon className="h-4 w-4" />
               </TooltipTrigger>
               <TooltipContent className="text-foreground z-9999 max-w-md p-4">
-                <p>The recipient is required to sign the document for it to be completed.</p>
+                <p>
+                  <Trans>
+                    The recipient is required to sign the document for it to be completed.
+                  </Trans>
+                </p>
               </TooltipContent>
             </Tooltip>
           </div>
@@ -44,14 +49,18 @@ export const RecipientRoleSelect = forwardRef<HTMLButtonElement, RecipientRoleSe
           <div className="flex items-center">
             <div className="flex w-[150px] items-center">
               <span className="mr-2">{ROLE_ICONS[RecipientRole.APPROVER]}</span>
-              Needs to approve
+              <Trans>Needs to approve</Trans>
             </div>
             <Tooltip>
               <TooltipTrigger>
                 <InfoIcon className="h-4 w-4" />
               </TooltipTrigger>
               <TooltipContent className="text-foreground z-9999 max-w-md p-4">
-                <p>The recipient is required to approve the document for it to be completed.</p>
+                <p>
+                  <Trans>
+                    The recipient is required to approve the document for it to be completed.
+                  </Trans>
+                </p>
               </TooltipContent>
             </Tooltip>
           </div>
@@ -61,14 +70,18 @@ export const RecipientRoleSelect = forwardRef<HTMLButtonElement, RecipientRoleSe
           <div className="flex items-center">
             <div className="flex w-[150px] items-center">
               <span className="mr-2">{ROLE_ICONS[RecipientRole.VIEWER]}</span>
-              Needs to view
+              <Trans>Needs to view</Trans>
             </div>
             <Tooltip>
               <TooltipTrigger>
                 <InfoIcon className="h-4 w-4" />
               </TooltipTrigger>
               <TooltipContent className="text-foreground z-9999 max-w-md p-4">
-                <p>The recipient is required to view the document for it to be completed.</p>
+                <p>
+                  <Trans>
+                    The recipient is required to view the document for it to be completed.
+                  </Trans>
+                </p>
               </TooltipContent>
             </Tooltip>
           </div>
@@ -79,7 +92,7 @@ export const RecipientRoleSelect = forwardRef<HTMLButtonElement, RecipientRoleSe
             <div className="flex items-center">
               <div className="flex w-[150px] items-center">
                 <span className="mr-2">{ROLE_ICONS[RecipientRole.CC]}</span>
-                Receives copy
+                <Trans>Receives copy</Trans>
               </div>
               <Tooltip>
                 <TooltipTrigger>
@@ -87,8 +100,10 @@ export const RecipientRoleSelect = forwardRef<HTMLButtonElement, RecipientRoleSe
                 </TooltipTrigger>
                 <TooltipContent className="text-foreground z-9999 max-w-md p-4">
                   <p>
-                    The recipient is not required to take any action and receives a copy of the
-                    document after it is completed.
+                    <Trans>
+                      The recipient is not required to take any action and receives a copy of the
+                      document after it is completed.
+                    </Trans>
                   </p>
                 </TooltipContent>
               </Tooltip>

packages/ui/package.json

@@ -28,7 +28,6 @@
   "dependencies": {
     "@documenso/lib": "*",
     "@hookform/resolvers": "^3.3.0",
-    "@lingui/macro": "^4.11.1",
     "@lingui/react": "^4.11.1",
     "@radix-ui/react-accordion": "^1.1.1",
     "@radix-ui/react-alert-dialog": "^1.0.3",
@@ -78,4 +77,4 @@
     "ts-pattern": "^5.0.5",
     "zod": "^3.22.4"
   }
-}
+}

packages/ui/primitives/combobox.tsx

@@ -1,5 +1,7 @@
 import * as React from 'react';
 
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { Check, ChevronDown } from 'lucide-react';
 
 import { cn } from '../lib/utils';
@@ -24,6 +26,8 @@ const Combobox = ({
   disabled = false,
   placeholder,
 }: ComboboxProps) => {
+  const { _ } = useLingui();
+
   const [open, setOpen] = React.useState(false);
 
   const onOptionSelected = (newValue: string) => {
@@ -31,7 +35,7 @@ const Combobox = ({
     setOpen(false);
   };
 
-  const placeholderValue = placeholder ?? 'Select an option';
+  const placeholderValue = placeholder ?? _(msg`Select an option`);
 
   return (
     <Popover open={open} onOpenChange={setOpen}>
@@ -52,7 +56,9 @@ const Combobox = ({
         <Command>
           <CommandInput placeholder={value || placeholderValue} />
 
-          <CommandEmpty>No value found.</CommandEmpty>
+          <CommandEmpty>
+            <Trans>No value found.</Trans>
+          </CommandEmpty>
 
           <CommandGroup className="max-h-[250px] overflow-y-auto">
             {options.map((option, index) => (

packages/ui/primitives/data-table-pagination.tsx

@@ -1,3 +1,4 @@
+import { Plural, Trans } from '@lingui/macro';
 import type { Table } from '@tanstack/react-table';
 import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from 'lucide-react';
 import { match } from 'ts-pattern';
@@ -26,8 +27,10 @@ export function DataTablePagination<TData>({
         {match(additionalInformation)
           .with('SelectedCount', () => (
             <span>
-              {table.getFilteredSelectedRowModel().rows.length} of{' '}
-              {table.getFilteredRowModel().rows.length} row(s) selected.
+              <Trans>
+                {table.getFilteredSelectedRowModel().rows.length} of{' '}
+                {table.getFilteredRowModel().rows.length} row(s) selected.
+              </Trans>
             </span>
           ))
           .with('VisibleCount', () => {
@@ -35,7 +38,11 @@ export function DataTablePagination<TData>({
 
             return (
               <span data-testid="data-table-count">
-                Showing {visibleRows} result{visibleRows > 1 && 's'}.
+                <Plural
+                  value={visibleRows}
+                  one={`Showing # result.`}
+                  other={`Showing # results.`}
+                />
               </span>
             );
           })
@@ -44,7 +51,9 @@ export function DataTablePagination<TData>({
       </div>
 
       <div className="flex items-center gap-x-2">
-        <p className="whitespace-nowrap text-sm font-medium">Rows per page</p>
+        <p className="whitespace-nowrap text-sm font-medium">
+          <Trans>Rows per page</Trans>
+        </p>
         <Select
           value={`${table.getState().pagination.pageSize}`}
           onValueChange={(value) => {
@@ -65,7 +74,9 @@ export function DataTablePagination<TData>({
       </div>
       <div className="flex flex-wrap items-center gap-x-6 gap-y-4 lg:gap-x-8">
         <div className="flex items-center text-sm font-medium md:justify-center">
-          Page {table.getState().pagination.pageIndex + 1} of {table.getPageCount() || 1}
+          <Trans>
+            Page {table.getState().pagination.pageIndex + 1} of {table.getPageCount() || 1}
+          </Trans>
         </div>
 
         <div className="flex items-center gap-x-2">

packages/ui/primitives/data-table.tsx

@@ -2,6 +2,7 @@
 
 import React, { useMemo } from 'react';
 
+import { Trans } from '@lingui/macro';
 import type {
   ColumnDef,
   PaginationState,
@@ -130,7 +131,7 @@ export function DataTable<TData, TValue>({
               <TableRow>
                 {error.component ?? (
                   <TableCell colSpan={columns.length} className="h-32 text-center">
-                    Something went wrong.
+                    <Trans>Something went wrong.</Trans>
                   </TableCell>
                 )}
               </TableRow>
@@ -141,14 +142,16 @@ export function DataTable<TData, TValue>({
             ) : (
               <TableRow>
                 <TableCell colSpan={columns.length} className="h-32 text-center">
-                  <p>No results found</p>
+                  <p>
+                    <Trans>No results found</Trans>
+                  </p>
 
                   {hasFilters && onClearFilters !== undefined && (
                     <button
                       onClick={() => onClearFilters()}
                       className="text-foreground mt-1 text-sm"
                     >
-                      Clear filters
+                      <Trans>Clear filters</Trans>
                     </button>
                   )}
                 </TableCell>

packages/ui/primitives/document-dropzone.tsx

@@ -2,6 +2,9 @@
 
 import Link from 'next/link';
 
+import type { MessageDescriptor } from '@lingui/core';
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { motion } from 'framer-motion';
 import { AlertTriangle, Plus } from 'lucide-react';
 import { useDropzone } from 'react-dropzone';
@@ -25,7 +28,7 @@ import { Card, CardContent } from './card';
 export type DocumentDropzoneProps = {
   className?: string;
   disabled?: boolean;
-  disabledMessage?: string;
+  disabledMessage?: MessageDescriptor;
   onDrop?: (_file: File) => void | Promise<void>;
   onDropRejected?: () => void | Promise<void>;
   type?: 'document' | 'template';
@@ -37,10 +40,12 @@ export const DocumentDropzone = ({
   onDrop,
   onDropRejected,
   disabled,
-  disabledMessage = 'You cannot upload documents at this time.',
+  disabledMessage = msg`You cannot upload documents at this time.`,
   type = 'document',
   ...props
 }: DocumentDropzoneProps) => {
+  const { _ } = useLingui();
+
   const { getRootProps, getInputProps } = useDropzone({
     accept: {
       'application/pdf': ['.pdf'],
@@ -61,8 +66,8 @@ export const DocumentDropzone = ({
   });
 
   const heading = {
-    document: disabled ? 'You have reached your document limit.' : 'Add a document',
-    template: 'Upload Template Document',
+    document: disabled ? msg`You have reached your document limit.` : msg`Add a document`,
+    template: msg`Upload Template Document`,
   };
 
   return (
@@ -151,15 +156,17 @@ export const DocumentDropzone = ({
 
           <input {...getInputProps()} />
 
-          <p className="text-foreground mt-8 font-medium">{heading[type]}</p>
+          <p className="text-foreground mt-8 font-medium">{_(heading[type])}</p>
 
           <p className="text-muted-foreground/80 mt-1 text-center text-sm">
-            {disabled ? disabledMessage : 'Drag & drop your PDF here.'}
+            {_(disabled ? disabledMessage : msg`Drag & drop your PDF here.`)}
           </p>
 
           {disabled && IS_BILLING_ENABLED() && (
             <Button className="hover:bg-warning/80 bg-warning mt-4 w-32" asChild>
-              <Link href="/settings/billing">Upgrade</Link>
+              <Link href="/settings/billing">
+                <Trans>Upgrade</Trans>
+              </Link>
             </Button>
           )}
         </CardContent>

packages/ui/primitives/document-flow/add-fields.tsx

@@ -4,6 +4,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
 import { Caveat } from 'next/font/google';
 
+import { Trans, msg } from '@lingui/macro';
 import {
   CalendarDays,
   Check,
@@ -24,7 +25,7 @@ import { useHotkeys } from 'react-hotkeys-hook';
 import { getBoundingClientRect } from '@documenso/lib/client-only/get-bounding-client-rect';
 import { useDocumentElement } from '@documenso/lib/client-only/hooks/use-document-element';
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
-import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
+import { RECIPIENT_ROLES_DESCRIPTION_ENG } from '@documenso/lib/constants/recipient-roles';
 import {
   type TFieldMetaSchema as FieldMeta,
   ZFieldMetaSchema,
@@ -506,8 +507,8 @@ export const AddFieldsFormPartial = ({
     <>
       {showAdvancedSettings && currentField ? (
         <FieldAdvancedSettings
-          title="Advanced settings"
-          description={`Configure the ${FRIENDLY_FIELD_TYPE[currentField.type]} field`}
+          title={msg`Advanced settings`}
+          description={msg`Configure the ${FRIENDLY_FIELD_TYPE[currentField.type]} field`}
           field={currentField}
           fields={localFields}
           onAdvancedSettings={handleAdvancedSettings}
@@ -609,14 +610,15 @@ export const AddFieldsFormPartial = ({
 
                       <CommandEmpty>
                         <span className="text-muted-foreground inline-block px-4">
-                          No recipient matching this description was found.
+                          <Trans>No recipient matching this description was found.</Trans>
                         </span>
                       </CommandEmpty>
 
                       {recipientsByRoleToDisplay.map(([role, roleRecipients], roleIndex) => (
                         <CommandGroup key={roleIndex}>
                           <div className="text-muted-foreground mb-1 ml-2 mt-2 text-xs font-medium">
-                            {`${RECIPIENT_ROLES_DESCRIPTION[role].roleName}s`}
+                            {/* Todo: Translations - Add plural translations. */}
+                            {`${RECIPIENT_ROLES_DESCRIPTION_ENG[role].roleName}s`}
                           </div>
 
                           {roleRecipients.length === 0 && (
@@ -624,7 +626,7 @@ export const AddFieldsFormPartial = ({
                               key={`${role}-empty`}
                               className="text-muted-foreground/80 px-4 pb-4 pt-2.5 text-center text-xs"
                             >
-                              No recipients with this role
+                              <Trans>No recipients with this role</Trans>
                             </div>
                           )}
 
@@ -680,8 +682,10 @@ export const AddFieldsFormPartial = ({
                                     </TooltipTrigger>
 
                                     <TooltipContent className="text-muted-foreground max-w-xs">
-                                      This document has already been sent to this recipient. You can
-                                      no longer edit this recipient.
+                                      <Trans>
+                                        This document has already been sent to this recipient. You
+                                        can no longer edit this recipient.
+                                      </Trans>
                                     </TooltipContent>
                                   </Tooltip>
                                 )}
@@ -717,7 +721,7 @@ export const AddFieldsFormPartial = ({
                             fontCaveat.className,
                           )}
                         >
-                          Signature
+                          <Trans>Signature</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -769,7 +773,7 @@ export const AddFieldsFormPartial = ({
                           )}
                         >
                           <Mail className="h-4 w-4" />
-                          Email
+                          <Trans>Email</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -795,7 +799,7 @@ export const AddFieldsFormPartial = ({
                           )}
                         >
                           <User className="h-4 w-4" />
-                          Name
+                          <Trans>Name</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -821,7 +825,7 @@ export const AddFieldsFormPartial = ({
                           )}
                         >
                           <CalendarDays className="h-4 w-4" />
-                          Date
+                          <Trans>Date</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -847,7 +851,7 @@ export const AddFieldsFormPartial = ({
                           )}
                         >
                           <Type className="h-4 w-4" />
-                          Text
+                          <Trans>Text</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -873,7 +877,7 @@ export const AddFieldsFormPartial = ({
                           )}
                         >
                           <Hash className="h-4 w-4" />
-                          Number
+                          <Trans>Number</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -899,7 +903,7 @@ export const AddFieldsFormPartial = ({
                           )}
                         >
                           <Disc className="h-4 w-4" />
-                          Radio
+                          <Trans>Radio</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -925,7 +929,7 @@ export const AddFieldsFormPartial = ({
                           )}
                         >
                           <CheckSquare className="h-4 w-4" />
-                          Checkbox
+                          <Trans>Checkbox</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -951,7 +955,7 @@ export const AddFieldsFormPartial = ({
                           )}
                         >
                           <ChevronDown className="h-4 w-4" />
-                          Dropdown
+                          <Trans>Dropdown</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -964,23 +968,21 @@ export const AddFieldsFormPartial = ({
             <div className="mt-4">
               <ul>
                 <li className="text-sm text-red-500">
-                  To proceed further, please set at least one value for the{' '}
-                  {emptyCheckboxFields.length > 0
-                    ? 'Checkbox'
-                    : emptyRadioFields.length > 0
-                    ? 'Radio'
-                    : 'Select'}{' '}
-                  field.
+                  <Trans>
+                    To proceed further, please set at least one value for the{' '}
+                    {emptyCheckboxFields.length > 0
+                      ? 'Checkbox'
+                      : emptyRadioFields.length > 0
+                      ? 'Radio'
+                      : 'Select'}{' '}
+                    field.
+                  </Trans>
                 </li>
               </ul>
             </div>
           )}
           <DocumentFlowFormContainerFooter>
-            <DocumentFlowFormContainerStep
-              title={documentFlow.title}
-              step={currentStep}
-              maxStep={totalSteps}
-            />
+            <DocumentFlowFormContainerStep step={currentStep} maxStep={totalSteps} />
 
             <DocumentFlowFormContainerActions
               loading={isSubmitting}
@@ -991,7 +993,7 @@ export const AddFieldsFormPartial = ({
                 remove();
                 documentFlow.onBackStep?.();
               }}
-              goBackLabel={canRenderBackButtonAsRemove ? 'Remove' : undefined}
+              goBackLabel={canRenderBackButtonAsRemove ? msg`Remove` : undefined}
               onGoNextClick={handleGoNextClick}
             />
           </DocumentFlowFormContainerFooter>

packages/ui/primitives/document-flow/add-settings.tsx

@@ -3,6 +3,7 @@
 import { useEffect } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans } from '@lingui/macro';
 import { InfoIcon } from 'lucide-react';
 import { useForm } from 'react-hook-form';
 
@@ -140,7 +141,9 @@ export const AddSettingsFormPartial = ({
               name="title"
               render={({ field }) => (
                 <FormItem>
-                  <FormLabel required>Title</FormLabel>
+                  <FormLabel required>
+                    <Trans>Title</Trans>
+                  </FormLabel>
 
                   <FormControl>
                     <Input
@@ -160,7 +163,7 @@ export const AddSettingsFormPartial = ({
               render={({ field }) => (
                 <FormItem>
                   <FormLabel className="flex flex-row items-center">
-                    Document access
+                    <Trans>Document access</Trans>
                     <DocumentGlobalAuthAccessTooltip />
                   </FormLabel>
 
@@ -178,7 +181,7 @@ export const AddSettingsFormPartial = ({
                 render={({ field }) => (
                   <FormItem>
                     <FormLabel className="flex flex-row items-center">
-                      Recipient action authentication
+                      <Trans>Recipient action authentication</Trans>
                       <DocumentGlobalAuthActionTooltip />
                     </FormLabel>
 
@@ -193,7 +196,7 @@ export const AddSettingsFormPartial = ({
             <Accordion type="multiple" className="mt-6">
               <AccordionItem value="advanced-options" className="border-none">
                 <AccordionTrigger className="text-foreground mb-2 rounded border px-3 py-2 text-left hover:bg-neutral-200/30 hover:no-underline">
-                  Advanced Options
+                  <Trans>Advanced Options</Trans>
                 </AccordionTrigger>
 
                 <AccordionContent className="text-muted-foreground -mx-1 px-1 pt-2 text-sm leading-relaxed">
@@ -204,15 +207,17 @@ export const AddSettingsFormPartial = ({
                       render={({ field }) => (
                         <FormItem>
                           <FormLabel className="flex flex-row items-center">
-                            External ID{' '}
+                            <Trans>External ID</Trans>{' '}
                             <Tooltip>
                               <TooltipTrigger>
                                 <InfoIcon className="mx-2 h-4 w-4" />
                               </TooltipTrigger>
 
                               <TooltipContent className="text-muted-foreground max-w-xs">
-                                Add an external ID to the document. This can be used to identify the
-                                document in external systems.
+                                <Trans>
+                                  Add an external ID to the document. This can be used to identify
+                                  the document in external systems.
+                                </Trans>
                               </TooltipContent>
                             </Tooltip>
                           </FormLabel>
@@ -231,7 +236,9 @@ export const AddSettingsFormPartial = ({
                       name="meta.dateFormat"
                       render={({ field }) => (
                         <FormItem>
-                          <FormLabel>Date Format</FormLabel>
+                          <FormLabel>
+                            <Trans>Date Format</Trans>
+                          </FormLabel>
 
                           <FormControl>
                             <Select
@@ -263,7 +270,9 @@ export const AddSettingsFormPartial = ({
                       name="meta.timezone"
                       render={({ field }) => (
                         <FormItem>
-                          <FormLabel>Time Zone</FormLabel>
+                          <FormLabel>
+                            <Trans>Time Zone</Trans>
+                          </FormLabel>
 
                           <FormControl>
                             <Combobox
@@ -286,14 +295,16 @@ export const AddSettingsFormPartial = ({
                       render={({ field }) => (
                         <FormItem>
                           <FormLabel className="flex flex-row items-center">
-                            Redirect URL{' '}
+                            <Trans>Redirect URL</Trans>{' '}
                             <Tooltip>
                               <TooltipTrigger>
                                 <InfoIcon className="mx-2 h-4 w-4" />
                               </TooltipTrigger>
 
                               <TooltipContent className="text-muted-foreground max-w-xs">
-                                Add a URL to redirect the user to once the document is signed
+                                <Trans>
+                                  Add a URL to redirect the user to once the document is signed
+                                </Trans>
                               </TooltipContent>
                             </Tooltip>
                           </FormLabel>
@@ -315,11 +326,7 @@ export const AddSettingsFormPartial = ({
       </DocumentFlowFormContainerContent>
 
       <DocumentFlowFormContainerFooter>
-        <DocumentFlowFormContainerStep
-          title={documentFlow.title}
-          step={currentStep}
-          maxStep={totalSteps}
-        />
+        <DocumentFlowFormContainerStep step={currentStep} maxStep={totalSteps} />
 
         <DocumentFlowFormContainerActions
           loading={form.formState.isSubmitting}

packages/ui/primitives/document-flow/add-signature.tsx

@@ -3,6 +3,7 @@
 import { useMemo, useState } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans } from '@lingui/macro';
 import { DateTime } from 'luxon';
 import { useForm } from 'react-hook-form';
 import { match } from 'ts-pattern';
@@ -267,7 +268,9 @@ export const AddSignatureFormPartial = ({
                 name="email"
                 render={({ field }) => (
                   <FormItem>
-                    <FormLabel required>Email</FormLabel>
+                    <FormLabel required>
+                      <Trans>Email</Trans>
+                    </FormLabel>
                     <FormControl>
                       <Input
                         className="bg-background"
@@ -291,7 +294,9 @@ export const AddSignatureFormPartial = ({
                   name="name"
                   render={({ field }) => (
                     <FormItem>
-                      <FormLabel required={requireName}>Name</FormLabel>
+                      <FormLabel required={requireName}>
+                        <Trans>Name</Trans>
+                      </FormLabel>
                       <FormControl>
                         <Input
                           className="bg-background"
@@ -314,7 +319,9 @@ export const AddSignatureFormPartial = ({
                   name="signature"
                   render={({ field }) => (
                     <FormItem>
-                      <FormLabel required={requireSignature}>Signature</FormLabel>
+                      <FormLabel required={requireSignature}>
+                        <Trans>Signature</Trans>
+                      </FormLabel>
                       <FormControl>
                         <Card
                           className={cn('mt-2', {
@@ -349,7 +356,9 @@ export const AddSignatureFormPartial = ({
                   name="customText"
                   render={({ field }) => (
                     <FormItem>
-                      <FormLabel required={requireCustomText}>Custom Text</FormLabel>
+                      <FormLabel required={requireCustomText}>
+                        <Trans>Custom Text</Trans>
+                      </FormLabel>
                       <FormControl>
                         <Input
                           className="bg-background"
@@ -369,11 +378,7 @@ export const AddSignatureFormPartial = ({
           </DocumentFlowFormContainerContent>
 
           <DocumentFlowFormContainerFooter>
-            <DocumentFlowFormContainerStep
-              title={documentFlow.title}
-              step={currentStep}
-              maxStep={totalSteps}
-            />
+            <DocumentFlowFormContainerStep step={currentStep} maxStep={totalSteps} />
 
             <DocumentFlowFormContainerActions
               loading={form.formState.isSubmitting}
@@ -386,7 +391,7 @@ export const AddSignatureFormPartial = ({
 
         {validateUninsertedFields && uninsertedFields[0] && (
           <FieldToolTip key={uninsertedFields[0].id} field={uninsertedFields[0]} color="warning">
-            Click to insert field
+            <Trans>Click to insert field</Trans>
           </FieldToolTip>
         )}
 

packages/ui/primitives/document-flow/add-signers.tsx

@@ -3,6 +3,8 @@
 import React, { useId, useMemo, useState } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { motion } from 'framer-motion';
 import { Plus, Trash } from 'lucide-react';
 import { useSession } from 'next-auth/react';
@@ -54,9 +56,11 @@ export const AddSignersFormPartial = ({
   onSubmit,
   isDocumentPdfLoaded,
 }: AddSignersFormProps) => {
+  const { _ } = useLingui();
   const { toast } = useToast();
   const { remaining } = useLimits();
   const { data: session } = useSession();
+
   const user = session?.user;
 
   const initialId = useId();
@@ -157,8 +161,8 @@ export const AddSignersFormPartial = ({
 
     if (hasBeenSentToRecipientId(signer.nativeId)) {
       toast({
-        title: 'Cannot remove signer',
-        description: 'This signer has already received the document.',
+        title: _(msg`Cannot remove signer`),
+        description: _(msg`This signer has already received the document.`),
         variant: 'destructive',
       });
 
@@ -224,13 +228,15 @@ export const AddSignersFormPartial = ({
                         })}
                       >
                         {!showAdvancedSettings && index === 0 && (
-                          <FormLabel required>Email</FormLabel>
+                          <FormLabel required>
+                            <Trans>Email</Trans>
+                          </FormLabel>
                         )}
 
                         <FormControl>
                           <Input
                             type="email"
-                            placeholder="Email"
+                            placeholder={_(msg`Email`)}
                             {...field}
                             disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
                             onKeyDown={onKeyDown}
@@ -256,7 +262,7 @@ export const AddSignersFormPartial = ({
 
                         <FormControl>
                           <Input
-                            placeholder="Name"
+                            placeholder={_(msg`Name`)}
                             {...field}
                             disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
                             onKeyDown={onKeyDown}
@@ -339,7 +345,7 @@ export const AddSignersFormPartial = ({
                 onClick={() => onAddSigner()}
               >
                 <Plus className="-ml-1 mr-2 h-5 w-5" />
-                Add Signer
+                <Trans>Add Signer</Trans>
               </Button>
 
               <Button
@@ -350,7 +356,7 @@ export const AddSignersFormPartial = ({
                 onClick={() => onAddSelfSigner()}
               >
                 <Plus className="-ml-1 mr-2 h-5 w-5" />
-                Add myself
+                <Trans>Add myself</Trans>
               </Button>
             </div>
 
@@ -368,7 +374,7 @@ export const AddSignersFormPartial = ({
                   className="text-muted-foreground ml-2 text-sm"
                   htmlFor="showAdvancedRecipientSettings"
                 >
-                  Show advanced settings
+                  <Trans>Show advanced settings</Trans>
                 </label>
               </div>
             )}
@@ -377,11 +383,7 @@ export const AddSignersFormPartial = ({
       </DocumentFlowFormContainerContent>
 
       <DocumentFlowFormContainerFooter>
-        <DocumentFlowFormContainerStep
-          title={documentFlow.title}
-          step={currentStep}
-          maxStep={totalSteps}
-        />
+        <DocumentFlowFormContainerStep step={currentStep} maxStep={totalSteps} />
 
         <DocumentFlowFormContainerActions
           loading={isSubmitting}

packages/ui/primitives/document-flow/add-subject.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans, msg } from '@lingui/macro';
 import { useForm } from 'react-hook-form';
 
 import type { Field, Recipient } from '@documenso/prisma/client';
@@ -74,7 +75,9 @@ export const AddSubjectFormPartial = ({
           <div className="flex flex-col gap-y-4">
             <div>
               <Label htmlFor="subject">
-                Subject <span className="text-muted-foreground">(Optional)</span>
+                <Trans>
+                  Subject <span className="text-muted-foreground">(Optional)</span>
+                </Trans>
               </Label>
 
               <Input
@@ -89,7 +92,9 @@ export const AddSubjectFormPartial = ({
 
             <div>
               <Label htmlFor="message">
-                Message <span className="text-muted-foreground">(Optional)</span>
+                <Trans>
+                  Message <span className="text-muted-foreground">(Optional)</span>
+                </Trans>
               </Label>
 
               <Textarea
@@ -111,16 +116,12 @@ export const AddSubjectFormPartial = ({
       </DocumentFlowFormContainerContent>
 
       <DocumentFlowFormContainerFooter>
-        <DocumentFlowFormContainerStep
-          title={documentFlow.title}
-          step={currentStep}
-          maxStep={totalSteps}
-        />
+        <DocumentFlowFormContainerStep step={currentStep} maxStep={totalSteps} />
 
         <DocumentFlowFormContainerActions
           loading={isSubmitting}
           disabled={isSubmitting}
-          goNextLabel={document.status === DocumentStatus.DRAFT ? 'Send' : 'Update'}
+          goNextLabel={document.status === DocumentStatus.DRAFT ? msg`Send` : msg`Update`}
           onGoBackClick={previousStep}
           onGoNextClick={() => void onFormSubmit()}
         />

packages/ui/primitives/document-flow/document-flow-root.tsx

@@ -3,6 +3,9 @@
 import type { HTMLAttributes } from 'react';
 import React from 'react';
 
+import type { MessageDescriptor } from '@lingui/core';
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { motion } from 'framer-motion';
 
 import { cn } from '../../lib/utils';
@@ -33,19 +36,21 @@ export const DocumentFlowFormContainer = ({
 };
 
 export type DocumentFlowFormContainerHeaderProps = {
-  title: string;
-  description: string;
+  title: MessageDescriptor;
+  description: MessageDescriptor;
 };
 
 export const DocumentFlowFormContainerHeader = ({
   title,
   description,
 }: DocumentFlowFormContainerHeaderProps) => {
+  const { _ } = useLingui();
+
   return (
     <>
-      <h3 className="text-foreground text-2xl font-semibold">{title}</h3>
+      <h3 className="text-foreground text-2xl font-semibold">{_(title)}</h3>
 
-      <p className="text-muted-foreground mt-2 text-sm">{description}</p>
+      <p className="text-muted-foreground mt-2 text-sm">{_(description)}</p>
 
       <hr className="border-border mb-8 mt-4" />
     </>
@@ -88,7 +93,6 @@ export const DocumentFlowFormContainerFooter = ({
 };
 
 export type DocumentFlowFormContainerStepProps = {
-  title: string;
   step: number;
   maxStep: number;
 };
@@ -100,7 +104,9 @@ export const DocumentFlowFormContainerStep = ({
   return (
     <div>
       <p className="text-muted-foreground text-sm">
-        Step <span>{`${step} of ${maxStep}`}</span>
+        <Trans>
+          Step <span>{`${step} of ${maxStep}`}</span>
+        </Trans>
       </p>
 
       <div className="bg-muted relative mt-4 h-[2px] rounded-md">
@@ -120,8 +126,8 @@ export const DocumentFlowFormContainerStep = ({
 export type DocumentFlowFormContainerActionsProps = {
   canGoBack?: boolean;
   canGoNext?: boolean;
-  goNextLabel?: string;
-  goBackLabel?: string;
+  goNextLabel?: MessageDescriptor;
+  goBackLabel?: MessageDescriptor;
   onGoBackClick?: () => void;
   onGoNextClick?: () => void;
   loading?: boolean;
@@ -132,14 +138,15 @@ export type DocumentFlowFormContainerActionsProps = {
 export const DocumentFlowFormContainerActions = ({
   canGoBack = true,
   canGoNext = true,
-  goNextLabel = 'Continue',
-  goBackLabel = 'Go Back',
+  goNextLabel = msg`Continue`,
+  goBackLabel = msg`Go Back`,
   onGoBackClick,
   onGoNextClick,
   loading,
   disabled,
   disableNextStep = false,
 }: DocumentFlowFormContainerActionsProps) => {
+  const { _ } = useLingui();
   return (
     <div className="mt-4 flex gap-x-4">
       <Button
@@ -150,7 +157,7 @@ export const DocumentFlowFormContainerActions = ({
         disabled={disabled || loading || !canGoBack || !onGoBackClick}
         onClick={onGoBackClick}
       >
-        {goBackLabel}
+        {_(goBackLabel)}
       </Button>
 
       <Button
@@ -161,7 +168,7 @@ export const DocumentFlowFormContainerActions = ({
         loading={loading}
         onClick={onGoNextClick}
       >
-        {goNextLabel}
+        {_(goNextLabel)}
       </Button>
     </div>
   );

packages/ui/primitives/document-flow/field-icon.tsx

@@ -1,3 +1,4 @@
+import { Trans } from '@lingui/macro';
 import {
   CalendarDays,
   CheckSquare,
@@ -48,7 +49,7 @@ export const FieldIcon = ({
           fontCaveatClassName,
         )}
       >
-        Signature
+        <Trans>Signature</Trans>
       </div>
     );
   } else {

packages/ui/primitives/document-flow/field-item-advanced-settings.tsx

@@ -5,6 +5,9 @@ import { forwardRef, useEffect, useState } from 'react';
 import { useParams } from 'next/navigation';
 import { usePathname } from 'next/navigation';
 
+import type { MessageDescriptor } from '@lingui/core';
+import { msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { match } from 'ts-pattern';
 
 import {
@@ -37,8 +40,8 @@ import { TextFieldAdvancedSettings } from './field-items-advanced-settings/text-
 
 export type FieldAdvancedSettingsProps = {
   teamId?: number;
-  title: string;
-  description: string;
+  title: MessageDescriptor;
+  description: MessageDescriptor;
   field: FieldFormType;
   fields: FieldFormType[];
   onAdvancedSettings?: () => void;
@@ -121,7 +124,9 @@ export const FieldAdvancedSettings = forwardRef<HTMLDivElement, FieldAdvancedSet
     },
     ref,
   ) => {
+    const { _ } = useLingui();
     const { toast } = useToast();
+
     const params = useParams();
     const pathname = usePathname();
     const id = params?.id;
@@ -218,8 +223,8 @@ export const FieldAdvancedSettings = forwardRef<HTMLDivElement, FieldAdvancedSet
         console.error('Failed to save to localStorage:', error);
 
         toast({
-          title: 'Error',
-          description: 'Failed to save settings.',
+          title: _(msg`Error`),
+          description: _(msg`Failed to save settings.`),
           variant: 'destructive',
         });
       }
@@ -288,8 +293,8 @@ export const FieldAdvancedSettings = forwardRef<HTMLDivElement, FieldAdvancedSet
         </DocumentFlowFormContainerContent>
         <DocumentFlowFormContainerFooter className="mt-auto">
           <DocumentFlowFormContainerActions
-            goNextLabel="Save"
-            goBackLabel="Cancel"
+            goNextLabel={msg`Save`}
+            goBackLabel={msg`Cancel`}
             onGoBackClick={onAdvancedSettings}
             onGoNextClick={handleOnGoNextClick}
             disableNextStep={errors.length > 0}

packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx

@@ -2,6 +2,8 @@
 
 import { useEffect, useState } from 'react';
 
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { ChevronDown, ChevronUp, Trash } from 'lucide-react';
 
 import { validateCheckboxField } from '@documenso/lib/advanced-fields-validation/validate-checkbox';
@@ -35,6 +37,8 @@ export const CheckboxFieldAdvancedSettings = ({
   handleFieldChange,
   handleErrors,
 }: CheckboxFieldAdvancedSettingsProps) => {
+  const { _ } = useLingui();
+
   const [showValidation, setShowValidation] = useState(false);
   const [values, setValues] = useState(fieldState.values ?? [{ id: 1, checked: false, value: '' }]);
   const [readOnly, setReadOnly] = useState(fieldState.readOnly ?? false);
@@ -122,13 +126,15 @@ export const CheckboxFieldAdvancedSettings = ({
     <div className="flex flex-col gap-4">
       <div className="flex flex-row items-center gap-x-4">
         <div className="flex w-2/3 flex-col">
-          <Label>Validation</Label>
+          <Label>
+            <Trans>Validation</Trans>
+          </Label>
           <Select
             value={fieldState.validationRule}
             onValueChange={(val) => handleToggleChange('validationRule', val)}
           >
             <SelectTrigger className="text-muted-foreground bg-background mt-2 w-full">
-              <SelectValue placeholder="Select at least" />
+              <SelectValue placeholder={_(msg`Select at least`)} />
             </SelectTrigger>
             <SelectContent position="popper">
               {checkboxValidationRules.map((item, index) => (
@@ -145,7 +151,7 @@ export const CheckboxFieldAdvancedSettings = ({
             onValueChange={(val) => handleToggleChange('validationLength', val)}
           >
             <SelectTrigger className="text-muted-foreground bg-background mt-2 w-full">
-              <SelectValue placeholder="Pick a number" />
+              <SelectValue placeholder={_(msg`Pick a number`)} />
             </SelectTrigger>
             <SelectContent position="popper">
               {checkboxValidationLength.map((item, index) => (
@@ -164,7 +170,9 @@ export const CheckboxFieldAdvancedSettings = ({
             checked={fieldState.required}
             onCheckedChange={(checked) => handleToggleChange('required', checked)}
           />
-          <Label>Required field</Label>
+          <Label>
+            <Trans>Required field</Trans>
+          </Label>
         </div>
         <div className="flex flex-row items-center gap-2">
           <Switch
@@ -172,7 +180,9 @@ export const CheckboxFieldAdvancedSettings = ({
             checked={fieldState.readOnly}
             onCheckedChange={(checked) => handleToggleChange('readOnly', checked)}
           />
-          <Label>Read only</Label>
+          <Label>
+            <Trans>Read only</Trans>
+          </Label>
         </div>
       </div>
       <Button
@@ -181,7 +191,9 @@ export const CheckboxFieldAdvancedSettings = ({
         onClick={() => setShowValidation((prev) => !prev)}
       >
         <span className="flex w-full flex-row justify-between">
-          <span className="flex items-center">Checkbox values</span>
+          <span className="flex items-center">
+            <Trans>Checkbox values</Trans>
+          </span>
           {showValidation ? <ChevronUp /> : <ChevronDown />}
         </span>
       </Button>
@@ -215,7 +227,7 @@ export const CheckboxFieldAdvancedSettings = ({
             variant="outline"
             onClick={addValue}
           >
-            Add another value
+            <Trans>Add another value</Trans>
           </Button>
         </div>
       )}

packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx

@@ -2,6 +2,8 @@
 
 import { useEffect, useState } from 'react';
 
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { ChevronDown, ChevronUp, Trash } from 'lucide-react';
 
 import { validateDropdownField } from '@documenso/lib/advanced-fields-validation/validate-dropdown';
@@ -32,6 +34,8 @@ export const DropdownFieldAdvancedSettings = ({
   handleFieldChange,
   handleErrors,
 }: DropdownFieldAdvancedSettingsProps) => {
+  const { _ } = useLingui();
+
   const [showValidation, setShowValidation] = useState(false);
   const [values, setValues] = useState(fieldState.values ?? [{ value: 'Option 1' }]);
   const [readOnly, setReadOnly] = useState(fieldState.readOnly ?? false);
@@ -87,7 +91,9 @@ export const DropdownFieldAdvancedSettings = ({
   return (
     <div className="text-dark flex flex-col gap-4">
       <div>
-        <Label>Select default option</Label>
+        <Label>
+          <Trans>Select default option</Trans>
+        </Label>
         <Select
           defaultValue={defaultValue}
           onValueChange={(val) => {
@@ -96,7 +102,7 @@ export const DropdownFieldAdvancedSettings = ({
           }}
         >
           <SelectTrigger className="text-muted-foreground bg-background mt-2 w-full">
-            <SelectValue defaultValue={defaultValue} placeholder="-- Select --" />
+            <SelectValue defaultValue={defaultValue} placeholder={`-- ${_(msg`Select`)} --`} />
           </SelectTrigger>
           <SelectContent position="popper">
             {values.map((item, index) => (
@@ -117,7 +123,9 @@ export const DropdownFieldAdvancedSettings = ({
             checked={fieldState.required}
             onCheckedChange={(checked) => handleToggleChange('required', checked)}
           />
-          <Label>Required field</Label>
+          <Label>
+            <Trans>Required field</Trans>
+          </Label>
         </div>
         <div className="flex flex-row items-center gap-2">
           <Switch
@@ -125,7 +133,9 @@ export const DropdownFieldAdvancedSettings = ({
             checked={fieldState.readOnly}
             onCheckedChange={(checked) => handleToggleChange('readOnly', checked)}
           />
-          <Label>Read only</Label>
+          <Label>
+            <Trans>Read only</Trans>
+          </Label>
         </div>
       </div>
       <Button
@@ -134,7 +144,9 @@ export const DropdownFieldAdvancedSettings = ({
         onClick={() => setShowValidation((prev) => !prev)}
       >
         <span className="flex w-full flex-row justify-between">
-          <span className="flex items-center">Dropdown options</span>
+          <span className="flex items-center">
+            <Trans>Dropdown options</Trans>
+          </span>
           {showValidation ? <ChevronUp /> : <ChevronDown />}
         </span>
       </Button>
@@ -162,7 +174,7 @@ export const DropdownFieldAdvancedSettings = ({
             variant="outline"
             onClick={addValue}
           >
-            Add another option
+            <Trans>Add another option</Trans>
           </Button>
         </div>
       )}

packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx

@@ -2,6 +2,8 @@
 
 import { useState } from 'react';
 
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { ChevronDown, ChevronUp } from 'lucide-react';
 
 import { validateNumberField } from '@documenso/lib/advanced-fields-validation/validate-number';
@@ -31,6 +33,8 @@ export const NumberFieldAdvancedSettings = ({
   handleFieldChange,
   handleErrors,
 }: NumberFieldAdvancedSettingsProps) => {
+  const { _ } = useLingui();
+
   const [showValidation, setShowValidation] = useState(false);
 
   const handleInput = (field: keyof NumberFieldMeta, value: string | boolean) => {
@@ -56,43 +60,51 @@ export const NumberFieldAdvancedSettings = ({
   return (
     <div className="flex flex-col gap-4">
       <div>
-        <Label>Label</Label>
+        <Label>
+          <Trans>Label</Trans>
+        </Label>
         <Input
           id="label"
           className="bg-background mt-2"
-          placeholder="Label"
+          placeholder={_(msg`Label`)}
           value={fieldState.label}
           onChange={(e) => handleFieldChange('label', e.target.value)}
         />
       </div>
       <div>
-        <Label className="mt-4">Placeholder</Label>
+        <Label className="mt-4">
+          <Trans>Placeholder</Trans>
+        </Label>
         <Input
           id="placeholder"
           className="bg-background mt-2"
-          placeholder="Placeholder"
+          placeholder={_(msg`Placeholder`)}
           value={fieldState.placeholder}
           onChange={(e) => handleFieldChange('placeholder', e.target.value)}
         />
       </div>
       <div>
-        <Label className="mt-4">Value</Label>
+        <Label className="mt-4">
+          <Trans>Value</Trans>
+        </Label>
         <Input
           id="value"
           className="bg-background mt-2"
-          placeholder="Value"
+          placeholder={_(msg`Value`)}
           value={fieldState.value}
           onChange={(e) => handleInput('value', e.target.value)}
         />
       </div>
       <div>
-        <Label>Number format</Label>
+        <Label>
+          <Trans>Number format</Trans>
+        </Label>
         <Select
           value={fieldState.numberFormat}
           onValueChange={(val) => handleInput('numberFormat', val)}
         >
           <SelectTrigger className="text-muted-foreground bg-background mt-2 w-full">
-            <SelectValue placeholder="Field format" />
+            <SelectValue placeholder={_(msg`Field format`)} />
           </SelectTrigger>
           <SelectContent position="popper">
             {numberFormatValues.map((item, index) => (
@@ -110,7 +122,9 @@ export const NumberFieldAdvancedSettings = ({
             checked={fieldState.required}
             onCheckedChange={(checked) => handleInput('required', checked)}
           />
-          <Label>Required field</Label>
+          <Label>
+            <Trans>Required field</Trans>
+          </Label>
         </div>
         <div className="flex flex-row items-center gap-2">
           <Switch
@@ -118,7 +132,9 @@ export const NumberFieldAdvancedSettings = ({
             checked={fieldState.readOnly}
             onCheckedChange={(checked) => handleInput('readOnly', checked)}
           />
-          <Label>Read only</Label>
+          <Label>
+            <Trans>Read only</Trans>
+          </Label>
         </div>
       </div>
       <Button
@@ -127,14 +143,18 @@ export const NumberFieldAdvancedSettings = ({
         onClick={() => setShowValidation((prev) => !prev)}
       >
         <span className="flex w-full flex-row justify-between">
-          <span className="flex items-center">Validation</span>
+          <span className="flex items-center">
+            <Trans>Validation</Trans>
+          </span>
           {showValidation ? <ChevronUp /> : <ChevronDown />}
         </span>
       </Button>
       {showValidation && (
         <div className="mb-4 flex flex-row gap-x-4">
           <div className="flex flex-col">
-            <Label className="mt-4">Min</Label>
+            <Label className="mt-4">
+              <Trans>Min</Trans>
+            </Label>
             <Input
               id="minValue"
               className="bg-background mt-2"
@@ -144,7 +164,9 @@ export const NumberFieldAdvancedSettings = ({
             />
           </div>
           <div className="flex flex-col">
-            <Label className="mt-4">Max</Label>
+            <Label className="mt-4">
+              <Trans>Max</Trans>
+            </Label>
             <Input
               id="maxValue"
               className="bg-background mt-2"

packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx

@@ -2,6 +2,7 @@
 
 import { useEffect, useState } from 'react';
 
+import { Trans } from '@lingui/macro';
 import { ChevronDown, ChevronUp, Trash } from 'lucide-react';
 
 import { validateRadioField } from '@documenso/lib/advanced-fields-validation/validate-radio';
@@ -107,7 +108,9 @@ export const RadioFieldAdvancedSettings = ({
             checked={fieldState.required}
             onCheckedChange={(checked) => handleToggleChange('required', checked)}
           />
-          <Label>Required field</Label>
+          <Label>
+            <Trans>Required field</Trans>
+          </Label>
         </div>
         <div className="flex flex-row items-center gap-2">
           <Switch
@@ -115,7 +118,9 @@ export const RadioFieldAdvancedSettings = ({
             checked={fieldState.readOnly}
             onCheckedChange={(checked) => handleToggleChange('readOnly', checked)}
           />
-          <Label>Read only</Label>
+          <Label>
+            <Trans>Read only</Trans>
+          </Label>
         </div>
       </div>
       <Button
@@ -124,7 +129,9 @@ export const RadioFieldAdvancedSettings = ({
         onClick={() => setShowValidation((prev) => !prev)}
       >
         <span className="flex w-full flex-row justify-between">
-          <span className="flex items-center">Radio values</span>
+          <span className="flex items-center">
+            <Trans>Radio values</Trans>
+          </span>
           {showValidation ? <ChevronUp /> : <ChevronDown />}
         </span>
       </Button>
@@ -157,7 +164,7 @@ export const RadioFieldAdvancedSettings = ({
             variant="outline"
             onClick={addValue}
           >
-            Add another value
+            <Trans>Add another value</Trans>
           </Button>
         </div>
       )}

packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx

@@ -1,3 +1,6 @@
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
+
 import { validateTextField } from '@documenso/lib/advanced-fields-validation/validate-text';
 import { type TTextFieldMeta as TextFieldMeta } from '@documenso/lib/types/field-meta';
 import { Input } from '@documenso/ui/primitives/input';
@@ -16,6 +19,8 @@ export const TextFieldAdvancedSettings = ({
   handleFieldChange,
   handleErrors,
 }: TextFieldAdvancedSettingsProps) => {
+  const { _ } = useLingui();
+
   const handleInput = (field: keyof TextFieldMeta, value: string | boolean) => {
     const text = field === 'text' ? String(value) : fieldState.text || '';
     const limit =
@@ -36,45 +41,53 @@ export const TextFieldAdvancedSettings = ({
   return (
     <div className="flex flex-col gap-4">
       <div>
-        <Label>Label</Label>
+        <Label>
+          <Trans>Label</Trans>
+        </Label>
         <Input
           id="label"
           className="bg-background mt-2"
-          placeholder="Field label"
+          placeholder={_(msg`Field label`)}
           value={fieldState.label}
           onChange={(e) => handleFieldChange('label', e.target.value)}
         />
       </div>
       <div>
-        <Label className="mt-4">Placeholder</Label>
+        <Label className="mt-4">
+          <Trans>Placeholder</Trans>
+        </Label>
         <Input
           id="placeholder"
           className="bg-background mt-2"
-          placeholder="Field placeholder"
+          placeholder={_(msg`Field placeholder`)}
           value={fieldState.placeholder}
           onChange={(e) => handleFieldChange('placeholder', e.target.value)}
         />
       </div>
 
       <div>
-        <Label className="mt-4">Add text</Label>
+        <Label className="mt-4">
+          <Trans>Add text</Trans>
+        </Label>
         <Textarea
           id="text"
           className="bg-background mt-2"
-          placeholder="Add text to the field"
+          placeholder={_(msg`Add text to the field`)}
           value={fieldState.text}
           onChange={(e) => handleInput('text', e.target.value)}
         />
       </div>
 
       <div>
-        <Label>Character Limit</Label>
+        <Label>
+          <Trans>Character Limit</Trans>
+        </Label>
         <Input
           id="characterLimit"
           type="number"
           min={0}
           className="bg-background mt-2"
-          placeholder="Field character limit"
+          placeholder={_(msg`Field character limit`)}
           value={fieldState.characterLimit}
           onChange={(e) => handleInput('characterLimit', e.target.value)}
         />
@@ -87,7 +100,9 @@ export const TextFieldAdvancedSettings = ({
             checked={fieldState.required}
             onCheckedChange={(checked) => handleInput('required', checked)}
           />
-          <Label>Required field</Label>
+          <Label>
+            <Trans>Required field</Trans>
+          </Label>
         </div>
         <div className="flex flex-row items-center gap-2">
           <Switch
@@ -95,7 +110,9 @@ export const TextFieldAdvancedSettings = ({
             checked={fieldState.readOnly}
             onCheckedChange={(checked) => handleInput('readOnly', checked)}
           />
-          <Label>Read only</Label>
+          <Label>
+            <Trans>Read only</Trans>
+          </Label>
         </div>
       </div>
     </div>

packages/ui/primitives/document-flow/missing-signature-field-dialog.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import { Trans } from '@lingui/macro';
 import { DialogClose } from '@radix-ui/react-dialog';
 
 import { Button } from '@documenso/ui/primitives/button';
@@ -25,18 +26,22 @@ export const MissingSignatureFieldDialog = ({
     <Dialog open={isOpen} onOpenChange={onOpenChange}>
       <DialogContent className="max-w-lg" position="center">
         <DialogHeader>
-          <DialogTitle>No signature field found</DialogTitle>
+          <DialogTitle>
+            <Trans>No signature field found</Trans>
+          </DialogTitle>
           <DialogDescription>
             <p className="mt-2">
-              Some signers have not been assigned a signature field. Please assign at least 1
-              signature field to each signer before proceeding.
+              <Trans>
+                Some signers have not been assigned a signature field. Please assign at least 1
+                signature field to each signer before proceeding.
+              </Trans>
             </p>
           </DialogDescription>
         </DialogHeader>
         <DialogFooter>
           <DialogClose asChild>
             <Button type="button" variant="secondary">
-              Close
+              <Trans>Close</Trans>
             </Button>
           </DialogClose>
         </DialogFooter>

packages/ui/primitives/document-flow/send-document-action-dialog.tsx

@@ -1,5 +1,6 @@
 import { useState } from 'react';
 
+import { Trans } from '@lingui/macro';
 import { Loader } from 'lucide-react';
 
 import type { ButtonProps } from '../button';
@@ -30,16 +31,20 @@ export const SendDocumentActionDialog = ({
       <DialogTrigger asChild>
         <Button type="button" className={className}>
           {loading && <Loader className="text-documenso mr-2 h-5 w-5 animate-spin" />}
-          Send
+          <Trans>Send</Trans>
         </Button>
       </DialogTrigger>
 
       <DialogContent className="max-w-md">
         <DialogHeader>
-          <DialogTitle className="text-center text-lg font-semibold">Send Document</DialogTitle>
+          <DialogTitle className="text-center text-lg font-semibold">
+            <Trans>Send Document</Trans>
+          </DialogTitle>
           <DialogDescription className="text-center text-base">
-            You are about to send this document to the recipients. Are you sure you want to
-            continue?
+            <Trans>
+              You are about to send this document to the recipients. Are you sure you want to
+              continue?
+            </Trans>
           </DialogDescription>
         </DialogHeader>
 
@@ -50,13 +55,13 @@ export const SendDocumentActionDialog = ({
             variant="secondary"
             onClick={() => setOpen(false)}
           >
-            Cancel
+            <Trans>Cancel</Trans>
           </Button>
 
           {/* We would use DialogAction here but it interrupts the submit action */}
           <Button className={className} {...props}>
             {loading && <Loader className="mr-2 h-5 w-5 animate-spin" />}
-            Send
+            <Trans>Send</Trans>
           </Button>
         </DialogFooter>
       </DialogContent>

packages/ui/primitives/document-flow/types.ts

@@ -1,3 +1,4 @@
+import type { MessageDescriptor } from '@lingui/core';
 import { z } from 'zod';
 
 import { ZFieldMetaSchema } from '@documenso/lib/types/field-meta';
@@ -58,8 +59,8 @@ export const FRIENDLY_FIELD_TYPE: Record<FieldType, string> = {
 };
 
 export interface DocumentFlowStep {
-  title: string;
-  description: string;
+  title: MessageDescriptor;
+  description: MessageDescriptor;
   stepIndex?: number;
   onBackStep?: () => unknown;
   onNextStep?: () => unknown;

packages/ui/primitives/document-password-dialog.tsx

@@ -1,6 +1,8 @@
 import { useEffect } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 
@@ -30,6 +32,8 @@ export const PasswordDialog = ({
   onPasswordSubmit,
   isError,
 }: PasswordDialogProps) => {
+  const { _ } = useLingui();
+
   const form = useForm<TPasswordDialogFormSchema>({
     defaultValues: {
       password: defaultPassword ?? '',
@@ -45,7 +49,7 @@ export const PasswordDialog = ({
     if (isError) {
       form.setError('password', {
         type: 'manual',
-        message: 'The password you have entered is incorrect. Please try again.',
+        message: _(msg`The password you have entered is incorrect. Please try again.`),
       });
     }
   }, [form, isError]);
@@ -54,10 +58,14 @@ export const PasswordDialog = ({
     <Dialog open={open}>
       <DialogContent className="w-full max-w-md">
         <DialogHeader>
-          <DialogTitle>Password Required</DialogTitle>
+          <DialogTitle>
+            <Trans>Password Required</Trans>
+          </DialogTitle>
 
           <DialogDescription className="text-muted-foreground">
-            This document is password protected. Please enter the password to view the document.
+            <Trans>
+              This document is password protected. Please enter the password to view the document.
+            </Trans>
           </DialogDescription>
         </DialogHeader>
 
@@ -73,7 +81,7 @@ export const PasswordDialog = ({
                       <Input
                         type="password"
                         className="bg-background"
-                        placeholder="Enter password"
+                        placeholder={_(msg`Enter password`)}
                         autoComplete="off"
                         {...field}
                       />
@@ -85,7 +93,9 @@ export const PasswordDialog = ({
               />
 
               <div>
-                <Button>Submit</Button>
+                <Button>
+                  <Trans>Submit</Trans>
+                </Button>
               </div>
             </fieldset>
           </form>

packages/ui/primitives/multi-select-combobox.tsx

@@ -2,6 +2,9 @@
 
 import * as React from 'react';
 
+import type { MessageDescriptor } from '@lingui/core';
+import { Trans } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { AnimatePresence } from 'framer-motion';
 import { Check, ChevronsUpDown, Loader, XIcon } from 'lucide-react';
 
@@ -24,7 +27,7 @@ type MultiSelectComboboxProps<T = OptionValue> = {
   emptySelectionPlaceholder?: React.ReactNode | string;
   enableClearAllButton?: boolean;
   loading?: boolean;
-  inputPlaceholder?: string;
+  inputPlaceholder?: MessageDescriptor;
   onChange: (_values: T[]) => void;
   options: ComboBoxOption<T>[];
   selectedValues: T[];
@@ -46,6 +49,8 @@ export function MultiSelectCombobox<T = OptionValue>({
   options,
   selectedValues,
 }: MultiSelectComboboxProps<T>) {
+  const { _ } = useLingui();
+
   const [open, setOpen] = React.useState(false);
 
   const handleSelect = (selectedOption: T) => {
@@ -143,8 +148,10 @@ export function MultiSelectCombobox<T = OptionValue>({
 
       <PopoverContent className="w-[200px] p-0">
         <Command>
-          <CommandInput placeholder={inputPlaceholder} />
-          <CommandEmpty>No value found.</CommandEmpty>
+          <CommandInput placeholder={inputPlaceholder && _(inputPlaceholder)} />
+          <CommandEmpty>
+            <Trans>No value found.</Trans>
+          </CommandEmpty>
           <CommandGroup>
             {options.map((option, i) => (
               <CommandItem key={i} onSelect={() => handleSelect(option.value)}>

packages/ui/primitives/signature-pad/signature-pad.tsx

@@ -3,6 +3,7 @@
 import type { HTMLAttributes, MouseEvent, PointerEvent, TouchEvent } from 'react';
 import { useEffect, useMemo, useRef, useState } from 'react';
 
+import { Trans } from '@lingui/macro';
 import { Undo2 } from 'lucide-react';
 import type { StrokeOptions } from 'perfect-freehand';
 import { getStroke } from 'perfect-freehand';
@@ -252,7 +253,7 @@ export const SignaturePad = ({
           className="focus-visible:ring-ring ring-offset-background text-muted-foreground/60 hover:text-muted-foreground rounded-full p-0 text-xs focus-visible:outline-none focus-visible:ring-2"
           onClick={() => onClearClick()}
         >
-          Clear Signature
+          <Trans>Clear Signature</Trans>
         </button>
       </div>
 

packages/ui/primitives/template-flow/add-template-fields.tsx

@@ -4,6 +4,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
 import { Caveat } from 'next/font/google';
 
+import { Trans, msg } from '@lingui/macro';
 import {
   CalendarDays,
   CheckSquare,
@@ -21,7 +22,7 @@ import { useFieldArray, useForm } from 'react-hook-form';
 import { getBoundingClientRect } from '@documenso/lib/client-only/get-bounding-client-rect';
 import { useDocumentElement } from '@documenso/lib/client-only/hooks/use-document-element';
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
-import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
+import { RECIPIENT_ROLES_DESCRIPTION_ENG } from '@documenso/lib/constants/recipient-roles';
 import {
   type TFieldMetaSchema as FieldMeta,
   ZFieldMetaSchema,
@@ -365,8 +366,8 @@ export const AddTemplateFieldsFormPartial = ({
     <>
       {showAdvancedSettings && currentField ? (
         <FieldAdvancedSettings
-          title="Advanced settings"
-          description={`Configure the ${FRIENDLY_FIELD_TYPE[currentField.type]} field`}
+          title={msg`Advanced settings`}
+          description={msg`Configure the ${FRIENDLY_FIELD_TYPE[currentField.type]} field`}
           field={currentField}
           fields={localFields}
           onAdvancedSettings={handleAdvancedSettings}
@@ -460,14 +461,15 @@ export const AddTemplateFieldsFormPartial = ({
 
                       <CommandEmpty>
                         <span className="text-muted-foreground inline-block px-4">
-                          No recipient matching this description was found.
+                          <Trans>No recipient matching this description was found.</Trans>
                         </span>
                       </CommandEmpty>
 
                       {recipientsByRoleToDisplay.map(([role, roleRecipients], roleIndex) => (
                         <CommandGroup key={roleIndex}>
                           <div className="text-muted-foreground mb-1 ml-2 mt-2 text-xs font-medium">
-                            {`${RECIPIENT_ROLES_DESCRIPTION[role].roleName}s`}
+                            {/* Todo: Translations - Add plural translations. */}
+                            {`${RECIPIENT_ROLES_DESCRIPTION_ENG[role].roleName}s`}
                           </div>
 
                           {roleRecipients.length === 0 && (
@@ -475,7 +477,7 @@ export const AddTemplateFieldsFormPartial = ({
                               key={`${role}-empty`}
                               className="text-muted-foreground/80 px-4 pb-4 pt-2.5 text-center text-xs"
                             >
-                              No recipients with this role
+                              <Trans>No recipients with this role</Trans>
                             </div>
                           )}
 
@@ -542,7 +544,7 @@ export const AddTemplateFieldsFormPartial = ({
                             fontCaveat.className,
                           )}
                         >
-                          Signature
+                          <Trans>Signature</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -594,7 +596,7 @@ export const AddTemplateFieldsFormPartial = ({
                           )}
                         >
                           <Mail className="h-4 w-4" />
-                          Email
+                          <Trans>Email</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -620,7 +622,7 @@ export const AddTemplateFieldsFormPartial = ({
                           )}
                         >
                           <User className="h-4 w-4" />
-                          Name
+                          <Trans>Name</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -646,7 +648,7 @@ export const AddTemplateFieldsFormPartial = ({
                           )}
                         >
                           <CalendarDays className="h-4 w-4" />
-                          Date
+                          <Trans>Date</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -672,7 +674,7 @@ export const AddTemplateFieldsFormPartial = ({
                           )}
                         >
                           <Type className="h-4 w-4" />
-                          Text
+                          <Trans>Text</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -698,7 +700,7 @@ export const AddTemplateFieldsFormPartial = ({
                           )}
                         >
                           <Hash className="h-4 w-4" />
-                          Number
+                          <Trans>Number</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -724,7 +726,7 @@ export const AddTemplateFieldsFormPartial = ({
                           )}
                         >
                           <Disc className="h-4 w-4" />
-                          Radio
+                          <Trans>Radio</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -750,7 +752,7 @@ export const AddTemplateFieldsFormPartial = ({
                           )}
                         >
                           <CheckSquare className="h-4 w-4" />
-                          Checkbox
+                          <Trans>Checkbox</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -776,7 +778,7 @@ export const AddTemplateFieldsFormPartial = ({
                           )}
                         >
                           <ChevronDown className="h-4 w-4" />
-                          Dropdown
+                          <Trans>Dropdown</Trans>
                         </p>
                       </CardContent>
                     </Card>
@@ -787,16 +789,12 @@ export const AddTemplateFieldsFormPartial = ({
           </DocumentFlowFormContainerContent>
 
           <DocumentFlowFormContainerFooter>
-            <DocumentFlowFormContainerStep
-              title={documentFlow.title}
-              step={currentStep}
-              maxStep={totalSteps}
-            />
+            <DocumentFlowFormContainerStep step={currentStep} maxStep={totalSteps} />
 
             <DocumentFlowFormContainerActions
               loading={isSubmitting}
               disabled={isSubmitting}
-              goNextLabel="Save Template"
+              goNextLabel={msg`Save Template`}
               onGoBackClick={() => {
                 previousStep();
                 remove();

packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx

@@ -3,6 +3,8 @@
 import React, { useEffect, useId, useMemo, useState } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { motion } from 'framer-motion';
 import { Link2Icon, Plus, Trash } from 'lucide-react';
 import { useSession } from 'next-auth/react';
@@ -57,6 +59,8 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
   onSubmit,
 }: AddTemplatePlaceholderRecipientsFormProps) => {
   const initialId = useId();
+
+  const { _ } = useLingui();
   const { data: session } = useSession();
 
   const user = session?.user;
@@ -202,13 +206,15 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                         })}
                       >
                         {!showAdvancedSettings && index === 0 && (
-                          <FormLabel required>Email</FormLabel>
+                          <FormLabel required>
+                            <Trans>Email</Trans>
+                          </FormLabel>
                         )}
 
                         <FormControl>
                           <Input
                             type="email"
-                            placeholder="Email"
+                            placeholder={_(msg`Email`)}
                             {...field}
                             disabled={
                               field.disabled ||
@@ -234,11 +240,15 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                           'col-span-4': showAdvancedSettings,
                         })}
                       >
-                        {!showAdvancedSettings && index === 0 && <FormLabel>Name</FormLabel>}
+                        {!showAdvancedSettings && index === 0 && (
+                          <FormLabel>
+                            <Trans>Name</Trans>
+                          </FormLabel>
+                        )}
 
                         <FormControl>
                           <Input
-                            placeholder="Name"
+                            placeholder={_(msg`Name`)}
                             {...field}
                             disabled={
                               field.disabled ||
@@ -299,12 +309,14 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                       </TooltipTrigger>
                       <TooltipContent className="text-foreground z-9999 max-w-md p-4">
                         <h3 className="text-foreground text-lg font-semibold">
-                          Direct link receiver
+                          <Trans>Direct link receiver</Trans>
                         </h3>
                         <p className="text-muted-foreground mt-1">
-                          This field cannot be modified or deleted. When you share this template's
-                          direct link or add it to your public profile, anyone who accesses it can
-                          input their name and email, and fill in the fields assigned to them.
+                          <Trans>
+                            This field cannot be modified or deleted. When you share this template's
+                            direct link or add it to your public profile, anyone who accesses it can
+                            input their name and email, and fill in the fields assigned to them.
+                          </Trans>
                         </p>
                       </TooltipContent>
                     </Tooltip>
@@ -340,7 +352,7 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                 onClick={() => onAddPlaceholderRecipient()}
               >
                 <Plus className="-ml-1 mr-2 h-5 w-5" />
-                Add Placeholder Recipient
+                <Trans>Add Placeholder Recipient</Trans>
               </Button>
 
               <Button
@@ -354,7 +366,7 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                 onClick={() => onAddPlaceholderSelfRecipient()}
               >
                 <Plus className="-ml-1 mr-2 h-5 w-5" />
-                Add Myself
+                <Trans>Add Myself</Trans>
               </Button>
             </div>
 
@@ -372,7 +384,7 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                   className="text-muted-foreground ml-2 text-sm"
                   htmlFor="showAdvancedRecipientSettings"
                 >
-                  Show advanced settings
+                  <Trans>Show advanced settings</Trans>
                 </label>
               </div>
             )}
@@ -381,11 +393,7 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
       </DocumentFlowFormContainerContent>
 
       <DocumentFlowFormContainerFooter>
-        <DocumentFlowFormContainerStep
-          title={documentFlow.title}
-          step={currentStep}
-          maxStep={totalSteps}
-        />
+        <DocumentFlowFormContainerStep step={currentStep} maxStep={totalSteps} />
 
         <DocumentFlowFormContainerActions
           loading={isSubmitting}

packages/ui/primitives/template-flow/add-template-settings.tsx

@@ -3,6 +3,8 @@
 import { useEffect } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { InfoIcon } from 'lucide-react';
 import { useForm } from 'react-hook-form';
 
@@ -72,6 +74,8 @@ export const AddTemplateSettingsFormPartial = ({
   template,
   onSubmit,
 }: AddTemplateSettingsFormProps) => {
+  const { _ } = useLingui();
+
   const { documentAuthOption } = extractDocumentAuthMethods({
     documentAuth: template.authOptions,
   });
@@ -126,7 +130,9 @@ export const AddTemplateSettingsFormPartial = ({
               name="title"
               render={({ field }) => (
                 <FormItem>
-                  <FormLabel required>Template title</FormLabel>
+                  <FormLabel required>
+                    <Trans>Template title</Trans>
+                  </FormLabel>
 
                   <FormControl>
                     <Input className="bg-background" {...field} />
@@ -142,7 +148,7 @@ export const AddTemplateSettingsFormPartial = ({
               render={({ field }) => (
                 <FormItem>
                   <FormLabel className="flex flex-row items-center">
-                    Document access
+                    <Trans>Document access</Trans>
                     <DocumentGlobalAuthAccessTooltip />
                   </FormLabel>
 
@@ -160,7 +166,7 @@ export const AddTemplateSettingsFormPartial = ({
                 render={({ field }) => (
                   <FormItem>
                     <FormLabel className="flex flex-row items-center">
-                      Recipient action authentication
+                      <Trans>Recipient action authentication</Trans>
                       <DocumentGlobalAuthActionTooltip />
                     </FormLabel>
 
@@ -175,7 +181,7 @@ export const AddTemplateSettingsFormPartial = ({
             <Accordion type="multiple">
               <AccordionItem value="email-options" className="border-none">
                 <AccordionTrigger className="text-foreground rounded border px-3 py-2 text-left hover:bg-neutral-200/30 hover:no-underline">
-                  Email Options
+                  <Trans>Email Options</Trans>
                 </AccordionTrigger>
 
                 <AccordionContent className="text-muted-foreground -mx-1 px-1 pt-4 text-sm leading-relaxed [&>div]:pb-0">
@@ -186,7 +192,9 @@ export const AddTemplateSettingsFormPartial = ({
                       render={({ field }) => (
                         <FormItem>
                           <FormLabel>
-                            Subject <span className="text-muted-foreground">(Optional)</span>
+                            <Trans>
+                              Subject <span className="text-muted-foreground">(Optional)</span>
+                            </Trans>
                           </FormLabel>
 
                           <FormControl>
@@ -204,7 +212,9 @@ export const AddTemplateSettingsFormPartial = ({
                       render={({ field }) => (
                         <FormItem>
                           <FormLabel>
-                            Message <span className="text-muted-foreground">(Optional)</span>
+                            <Trans>
+                              Message <span className="text-muted-foreground">(Optional)</span>
+                            </Trans>
                           </FormLabel>
 
                           <FormControl>
@@ -225,7 +235,7 @@ export const AddTemplateSettingsFormPartial = ({
             <Accordion type="multiple">
               <AccordionItem value="advanced-options" className="border-none">
                 <AccordionTrigger className="text-foreground rounded border px-3 py-2 text-left hover:bg-neutral-200/30 hover:no-underline">
-                  Advanced Options
+                  <Trans>Advanced Options</Trans>
                 </AccordionTrigger>
 
                 <AccordionContent className="text-muted-foreground -mx-1 px-1 pt-4 text-sm leading-relaxed">
@@ -236,15 +246,17 @@ export const AddTemplateSettingsFormPartial = ({
                       render={({ field }) => (
                         <FormItem>
                           <FormLabel className="flex flex-row items-center">
-                            External ID{' '}
+                            <Trans>External ID</Trans>{' '}
                             <Tooltip>
                               <TooltipTrigger>
                                 <InfoIcon className="mx-2 h-4 w-4" />
                               </TooltipTrigger>
 
                               <TooltipContent className="text-muted-foreground max-w-xs">
-                                Add an external ID to the template. This can be used to identify in
-                                external systems.
+                                <Trans>
+                                  Add an external ID to the template. This can be used to identify
+                                  in external systems.
+                                </Trans>
                               </TooltipContent>
                             </Tooltip>
                           </FormLabel>
@@ -263,7 +275,9 @@ export const AddTemplateSettingsFormPartial = ({
                       name="meta.dateFormat"
                       render={({ field }) => (
                         <FormItem>
-                          <FormLabel>Date Format</FormLabel>
+                          <FormLabel>
+                            <Trans>Date Format</Trans>
+                          </FormLabel>
 
                           <FormControl>
                             <Select {...field} onValueChange={field.onChange}>
@@ -291,7 +305,9 @@ export const AddTemplateSettingsFormPartial = ({
                       name="meta.timezone"
                       render={({ field }) => (
                         <FormItem>
-                          <FormLabel>Time Zone</FormLabel>
+                          <FormLabel>
+                            <Trans>Time Zone</Trans>
+                          </FormLabel>
 
                           <FormControl>
                             <Combobox
@@ -313,14 +329,16 @@ export const AddTemplateSettingsFormPartial = ({
                       render={({ field }) => (
                         <FormItem>
                           <FormLabel className="flex flex-row items-center">
-                            Redirect URL{' '}
+                            <Trans>Redirect URL</Trans>{' '}
                             <Tooltip>
                               <TooltipTrigger>
                                 <InfoIcon className="mx-2 h-4 w-4" />
                               </TooltipTrigger>
 
                               <TooltipContent className="text-muted-foreground max-w-xs">
-                                Add a URL to redirect the user to once the document is signed
+                                <Trans>
+                                  Add a URL to redirect the user to once the document is signed
+                                </Trans>
                               </TooltipContent>
                             </Tooltip>
                           </FormLabel>
@@ -342,11 +360,7 @@ export const AddTemplateSettingsFormPartial = ({
       </DocumentFlowFormContainerContent>
 
       <DocumentFlowFormContainerFooter>
-        <DocumentFlowFormContainerStep
-          title={documentFlow.title}
-          step={currentStep}
-          maxStep={totalSteps}
-        />
+        <DocumentFlowFormContainerStep step={currentStep} maxStep={totalSteps} />
 
         <DocumentFlowFormContainerActions
           loading={form.formState.isSubmitting}