chore: remove more onsole.logs

## Description

Web changes:

- Enabled i18n for web
- Add option to change language in command menu
- Add option to change language in menu-switcher

Web and marketing changes:

- Stop setting 'en' preference into cookie if the user's language is not
supported
- Dropped middleware changes
- Rotated cookie from 'i18n' to 'language'

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **New Features**
- Introduced a language switcher in the footer for improved language
selection.
	- Added dynamic language change functionality in the command menu.
- Implemented a dropdown menu item for quick access to the language
switcher.

- **Bug Fixes**
- Resolved issues related to language change notifications and state
management.

- **Translations**
- Added new translation entries for improved language support, including
"Search languages..." in English and German.
	- Updated existing translations to enhance clarity and accuracy.

- **Chores**
	- Simplified internationalization handling in middleware.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: github-actions <github-actions@documenso.com>

apps/documentation/pages/developers/self-hosting/how-to.mdx

@@ -5,6 +5,8 @@ description: Learn how to self-host Documenso on your server or cloud infrastruc
 
 import { Callout, Steps } from 'nextra/components';
 
+import { CallToAction } from '@documenso/ui/components/call-to-action';
+
 # Self Hosting
 
 We support various deployment methods and are actively working on adding more. Please let us know if you have a specific deployment method in mind!
@@ -273,3 +275,5 @@ We offer several alternative deployment methods for Documenso if you need more o
 ## Koyeb
 
 [![Deploy to Koyeb](https://www.koyeb.com/static/images/deploy/button.svg)](https://app.koyeb.com/deploy?type=git&repository=github.com/documenso/documenso&branch=main&name=documenso-app&builder=dockerfile&dockerfile=/docker/Dockerfile)
+
+<CallToAction className="mt-12" utmSource="self-hosting" />

apps/documentation/pages/developers/self-hosting/index.mdx

@@ -3,6 +3,10 @@ title: Getting Started with Self-Hosting
 description: A step-by-step guide to setting up and hosting your own Documenso instance.
 ---
 
+import { CallToAction } from '@documenso/ui/components/call-to-action';
+
 # Getting Started with Self-Hosting
 
 This is a step-by-step guide to setting up and hosting your own Documenso instance. Before getting started, [select the right license for you](/users/licenses).
+
+<CallToAction className="mt-12" utmSource="self-hosting" />

apps/marketing/content/changelog.mdx

@@ -8,6 +8,80 @@ Check out what's new in the latest version and read our thoughts on it. For more
 
 ---
 
+# Documenso v1.7.0: Embedded Signing, Copy and Paste, and More
+
+We're thrilled to announce the release of Documenso v1.7.0, packed with exciting new features and improvements that enhance document signing flexibility, user experience, and global accessibility.
+
+We're excited to see what you'll create with this release and we'd love to hear your feedback. Let's dive into the highlights:
+
+## 🌟 Key Features
+
+### Embedded Signing Experience
+
+Take your document signing to the next level with our new embedded signing feature. Now you can seamlessly integrate Documenso's signing process directly into your own website or application, providing a smooth, branded experience for your users.
+
+<video
+  src="/blog/introducing-embedding/embedding-demo.mp4"
+  className="aspect-video w-full"
+  controls
+/>
+
+Check out our [Embedding documentation](https://docs.documenso.com/developers/embedding) to learn more about how to get started.
+
+### Copy and Paste Fields
+
+Streamline your document preparation with our new copy and paste functionality for fields. This feature allows you to quickly duplicate fields across your document, saving time and ensuring consistency in your templates.
+
+### Customizable Signature Colors
+
+Recipients can now select a signature color from our list of available colors, supporting workflows where specific colors are required for each recipient, location, or document.
+
+### Enhanced Internationalization (i18n)
+
+Following on from our last release we've now expanded our i18n support to the main web application. We haven't yet added support for any additional languages but that will be coming quickly now that we have completed the hard work of wrapping all of our content in our new i18n system.
+
+These enhancements make Documenso more accessible to users worldwide.
+
+## 🔧 Other Improvements
+
+- **API Enhancements**:
+
+  - New endpoint to prefill fields via API
+  - Updated createFields API endpoint for more flexibility
+  - Automatically set public profile URL for OIDC users
+
+- **Security and Performance**:
+
+  - Document sealing moved to a background job for improved performance
+  - Disable 2FA with backup codes for enhanced account recovery options
+  - Extended lifespan for invites and confirmations
+
+- **User Experience**:
+
+  - Updated email templates to reflect team-specific information
+  - Fixed issues with dialog closing on page refresh
+  - Improved field editing in document templates
+
+- **Other Items**:
+  - Added Elestio as a one-click deploy option
+  - Updated README for manual self-hosting
+  - New environment variable for internal webapp URL configuration
+
+## 📚 New Content
+
+- [Advanced fields article to help you make the most of Documenso's capabilities](/blog/introducing-advanced-signing-fields)
+- [Embedding blog post to guide you through how we implemented embedding](/blog/introducing-embedding)
+
+## 👏 Community Contributions
+
+A big thank you to our vibrant community! This release includes contributions from several new contributors, further enriching Documenso's capabilities.
+
+We're excited to see how you'll use these new features to streamline your document workflows. As always, we appreciate your feedback and support in making Documenso the best open-source document signing solution available.
+
+Enjoy exploring v1.7.0!
+
+---
+
 # Documenso v1.6.1: Internationalization, Enhanced OIDC, and More
 
 We're excited to announce the release of Documenso v1.6.1, which brings several improvements to enhance your document signing experience. Here are the key updates:

apps/marketing/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@documenso/marketing",
-  "version": "1.7.0-rc.5",
+  "version": "1.7.1-rc.0",
   "private": true,
   "license": "AGPL-3.0",
   "scripts": {

apps/marketing/process-env.d.ts

@@ -2,8 +2,8 @@ declare namespace NodeJS {
   export interface ProcessEnv {
     NEXT_PUBLIC_WEBAPP_URL?: string;
     NEXT_PUBLIC_MARKETING_URL?: string;
-    NEXT_PRIVATE_INTERNAL_WEBAPP_URL?:string;
-    
+    NEXT_PRIVATE_INTERNAL_WEBAPP_URL?: string;
+
     NEXT_PRIVATE_DATABASE_URL: string;
 
     NEXT_PUBLIC_STRIPE_COMMUNITY_PLAN_MONTHLY_PRICE_ID: string;

apps/marketing/src/app/layout.tsx

@@ -1,7 +1,6 @@
 import { Suspense } from 'react';
 
 import { Caveat, Inter } from 'next/font/google';
-import { cookies, headers } from 'next/headers';
 
 import { AxiomWebVitals } from 'next-axiom';
 import { PublicEnvScript } from 'next-runtime-env';
@@ -10,8 +9,6 @@ import { FeatureFlagProvider } from '@documenso/lib/client-only/providers/featur
 import { I18nClientProvider } from '@documenso/lib/client-only/providers/i18n.client';
 import { setupI18nSSR } from '@documenso/lib/client-only/providers/i18n.server';
 import { NEXT_PUBLIC_MARKETING_URL } from '@documenso/lib/constants/app';
-import type { SUPPORTED_LANGUAGE_CODES } from '@documenso/lib/constants/i18n';
-import { ZSupportedLanguageCodeSchema } from '@documenso/lib/constants/i18n';
 import { getAllAnonymousFlags } from '@documenso/lib/universal/get-feature-flag';
 import { TrpcProvider } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
@@ -59,25 +56,7 @@ export function generateMetadata() {
 export default async function RootLayout({ children }: { children: React.ReactNode }) {
   const flags = await getAllAnonymousFlags();
 
-  let overrideLang: (typeof SUPPORTED_LANGUAGE_CODES)[number] | undefined;
-
-  // Should be safe to remove when we upgrade NextJS.
-  // https://github.com/vercel/next.js/pull/65008
-  // Currently if the middleware sets the cookie, it's not accessible in the cookies
-  // during the same render.
-  // So we go the roundabout way of checking the header for the set-cookie value.
-  if (!cookies().get('i18n')) {
-    const setCookieValue = headers().get('set-cookie');
-    const i18nCookie = setCookieValue?.split(';').find((cookie) => cookie.startsWith('i18n='));
-
-    if (i18nCookie) {
-      const i18n = i18nCookie.split('=')[1];
-
-      overrideLang = ZSupportedLanguageCodeSchema.parse(i18n);
-    }
-  }
-
-  const { lang, i18n } = setupI18nSSR(overrideLang);
+  const { lang, locales, i18n } = setupI18nSSR();
 
   return (
     <html
@@ -105,7 +84,10 @@ export default async function RootLayout({ children }: { children: React.ReactNo
           <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
             <PlausibleProvider>
               <TrpcProvider>
-                <I18nClientProvider initialLocale={lang} initialMessages={i18n.messages}>
+                <I18nClientProvider
+                  initialLocaleData={{ lang, locales }}
+                  initialMessages={i18n.messages}
+                >
                   {children}
                 </I18nClientProvider>
               </TrpcProvider>

apps/marketing/src/components/(marketing)/footer.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import type { HTMLAttributes } from 'react';
+import { type HTMLAttributes, useState } from 'react';
 
 import Image from 'next/image';
 import Link from 'next/link';
@@ -9,15 +9,15 @@ import { msg } from '@lingui/macro';
 import { useLingui } from '@lingui/react';
 import { FaXTwitter } from 'react-icons/fa6';
 import { LiaDiscord } from 'react-icons/lia';
-import { LuGithub } from 'react-icons/lu';
+import { LuGithub, LuLanguages } from 'react-icons/lu';
 
 import LogoImage from '@documenso/assets/logo.png';
-import { cn } from '@documenso/ui/lib/utils';
-import { ThemeSwitcher } from '@documenso/ui/primitives/theme-switcher';
-
-import { I18nSwitcher } from '~/components/(marketing)/i18n-switcher';
-
+import { SUPPORTED_LANGUAGES } from '@documenso/lib/constants/i18n';
 // import { StatusWidgetContainer } from './status-widget-container';
+import { LanguageSwitcherDialog } from '@documenso/ui/components/common/language-switcher-dialog';
+import { cn } from '@documenso/ui/lib/utils';
+import { Button } from '@documenso/ui/primitives/button';
+import { ThemeSwitcher } from '@documenso/ui/primitives/theme-switcher';
 
 export type FooterProps = HTMLAttributes<HTMLDivElement>;
 
@@ -44,7 +44,9 @@ const FOOTER_LINKS = [
 ];
 
 export const Footer = ({ className, ...props }: FooterProps) => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
+
+  const [languageSwitcherOpen, setLanguageSwitcherOpen] = useState(false);
 
   return (
     <div className={cn('border-t py-12', className)} {...props}>
@@ -97,13 +99,22 @@ export const Footer = ({ className, ...props }: FooterProps) => {
         </p>
 
         <div className="flex flex-row-reverse items-center sm:flex-row">
-          <I18nSwitcher className="text-muted-foreground ml-2 rounded-full font-normal sm:mr-2" />
+          <Button
+            className="text-muted-foreground ml-2 rounded-full font-normal sm:mr-2"
+            variant="ghost"
+            onClick={() => setLanguageSwitcherOpen(true)}
+          >
+            <LuLanguages className="mr-1.5 h-4 w-4" />
+            {SUPPORTED_LANGUAGES[i18n.locale]?.full || i18n.locale}
+          </Button>
 
           <div className="flex flex-wrap">
             <ThemeSwitcher />
           </div>
         </div>
       </div>
+
+      <LanguageSwitcherDialog open={languageSwitcherOpen} setOpen={setLanguageSwitcherOpen} />
     </div>
   );
 };

apps/marketing/src/components/(marketing)/i18n-switcher.tsx

@@ -1,71 +0,0 @@
-import { useState } from 'react';
-
-import { msg } from '@lingui/macro';
-import { useLingui } from '@lingui/react';
-import { CheckIcon } from 'lucide-react';
-import { LuLanguages } from 'react-icons/lu';
-
-import { SUPPORTED_LANGUAGES } from '@documenso/lib/constants/i18n';
-import { switchI18NLanguage } from '@documenso/lib/server-only/i18n/switch-i18n-language';
-import { dynamicActivate } from '@documenso/lib/utils/i18n';
-import { cn } from '@documenso/ui/lib/utils';
-import { Button } from '@documenso/ui/primitives/button';
-import {
-  CommandDialog,
-  CommandGroup,
-  CommandInput,
-  CommandItem,
-  CommandList,
-} from '@documenso/ui/primitives/command';
-
-type I18nSwitcherProps = {
-  className?: string;
-};
-
-export const I18nSwitcher = ({ className }: I18nSwitcherProps) => {
-  const { i18n, _ } = useLingui();
-
-  const [open, setOpen] = useState(false);
-  const [value, setValue] = useState(i18n.locale);
-
-  const setLanguage = async (lang: string) => {
-    setValue(lang);
-    setOpen(false);
-
-    await dynamicActivate(i18n, lang);
-    await switchI18NLanguage(lang);
-  };
-
-  return (
-    <>
-      <Button className={className} variant="ghost" onClick={() => setOpen(true)}>
-        <LuLanguages className="mr-1.5 h-4 w-4" />
-        {SUPPORTED_LANGUAGES[value]?.full || i18n.locale}
-      </Button>
-
-      <CommandDialog open={open} onOpenChange={setOpen}>
-        <CommandInput placeholder={_(msg`Search languages...`)} />
-
-        <CommandList>
-          <CommandGroup>
-            {Object.values(SUPPORTED_LANGUAGES).map((language) => (
-              <CommandItem
-                key={language.short}
-                value={language.full}
-                onSelect={async () => setLanguage(language.short)}
-              >
-                <CheckIcon
-                  className={cn(
-                    'mr-2 h-4 w-4',
-                    value === language.short ? 'opacity-100' : 'opacity-0',
-                  )}
-                />
-                {SUPPORTED_LANGUAGES[language.short].full}
-              </CommandItem>
-            ))}
-          </CommandGroup>
-        </CommandList>
-      </CommandDialog>
-    </>
-  );
-};

apps/marketing/src/middleware.ts

@@ -1,39 +0,0 @@
-import { cookies } from 'next/headers';
-import type { NextRequest } from 'next/server';
-import { NextResponse } from 'next/server';
-
-import { extractSupportedLanguage } from '@documenso/lib/utils/i18n';
-
-export default function middleware(req: NextRequest) {
-  const lang = extractSupportedLanguage({
-    headers: req.headers,
-    cookies: cookies(),
-  });
-
-  const response = NextResponse.next();
-
-  response.cookies.set('i18n', lang);
-
-  return response;
-}
-
-export const config = {
-  matcher: [
-    /*
-     * Match all request paths except for the ones starting with:
-     * - api (API routes)
-     * - _next/static (static files)
-     * - _next/image (image optimization files)
-     * - favicon.ico (favicon file)
-     * - ingest (analytics)
-     * - site.webmanifest
-     */
-    {
-      source: '/((?!api|_next/static|_next/image|ingest|favicon|site.webmanifest).*)',
-      missing: [
-        { type: 'header', key: 'next-router-prefetch' },
-        { type: 'header', key: 'purpose', value: 'prefetch' },
-      ],
-    },
-  ],
-};

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@documenso/web",
-  "version": "1.7.0-rc.5",
+  "version": "1.7.1-rc.0",
   "private": true,
   "license": "AGPL-3.0",
   "scripts": {

apps/web/process-env.d.ts

@@ -2,7 +2,7 @@ declare namespace NodeJS {
   export interface ProcessEnv {
     NEXT_PUBLIC_WEBAPP_URL?: string;
     NEXT_PUBLIC_MARKETING_URL?: string;
-    NEXT_PRIVATE_INTERNAL_WEBAPP_URL?:string;
+    NEXT_PRIVATE_INTERNAL_WEBAPP_URL?: string;
 
     NEXT_PRIVATE_DATABASE_URL: string;
 

apps/web/src/app/(dashboard)/admin/documents/[id]/page.tsx

@@ -12,7 +12,6 @@ import {
 import { Badge } from '@documenso/ui/primitives/badge';
 
 import { DocumentStatus } from '~/components/formatter/document-status';
-import { LocaleDate } from '~/components/formatter/locale-date';
 
 import { AdminActions } from './admin-actions';
 import { RecipientItem } from './recipient-item';
@@ -25,7 +24,7 @@ type AdminDocumentDetailsPageProps = {
 };
 
 export default async function AdminDocumentDetailsPage({ params }: AdminDocumentDetailsPageProps) {
-  setupI18nSSR();
+  const { i18n } = setupI18nSSR();
 
   const document = await getEntireDocument({ id: Number(params.id) });
 
@@ -46,12 +45,11 @@ export default async function AdminDocumentDetailsPage({ params }: AdminDocument
 
       <div className="text-muted-foreground mt-4 text-sm">
         <div>
-          <Trans>Created on</Trans>:{' '}
-          <LocaleDate date={document.createdAt} format={DateTime.DATETIME_MED} />
+          <Trans>Created on</Trans>: {i18n.date(document.createdAt, DateTime.DATETIME_MED)}
         </div>
+
         <div>
-          <Trans>Last updated at</Trans>:{' '}
-          <LocaleDate date={document.updatedAt} format={DateTime.DATETIME_MED} />
+          <Trans>Last updated at</Trans>: {i18n.date(document.updatedAt, DateTime.DATETIME_MED)}
         </div>
       </div>
 

apps/web/src/app/(dashboard)/admin/documents/document-results.tsx

@@ -21,12 +21,11 @@ import { Input } from '@documenso/ui/primitives/input';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
 import { DocumentStatus } from '~/components/formatter/document-status';
-import { LocaleDate } from '~/components/formatter/locale-date';
 
 // export type AdminDocumentResultsProps = {};
 
 export const AdminDocumentResults = () => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const searchParams = useSearchParams();
 
@@ -62,7 +61,7 @@ export const AdminDocumentResults = () => {
       {
         header: _(msg`Created`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => <LocaleDate date={row.original.createdAt} />,
+        cell: ({ row }) => i18n.date(row.original.createdAt),
       },
       {
         header: _(msg`Title`),
@@ -122,7 +121,7 @@ export const AdminDocumentResults = () => {
       {
         header: 'Last updated',
         accessorKey: 'updatedAt',
-        cell: ({ row }) => <LocaleDate date={row.original.updatedAt} />,
+        cell: ({ row }) => i18n.date(row.original.updatedAt),
       },
     ] satisfies DataTableColumnDef<(typeof results)['data'][number]>[];
   }, []);

apps/web/src/app/(dashboard)/documents/[id]/document-page-view-information.tsx

@@ -7,7 +7,6 @@ import { useLingui } from '@lingui/react';
 import { DateTime } from 'luxon';
 
 import { useIsMounted } from '@documenso/lib/client-only/hooks/use-is-mounted';
-import { useLocale } from '@documenso/lib/client-only/providers/locale';
 import type { Document, Recipient, User } from '@documenso/prisma/client';
 
 export type DocumentPageViewInformationProps = {
@@ -24,21 +23,9 @@ export const DocumentPageViewInformation = ({
 }: DocumentPageViewInformationProps) => {
   const isMounted = useIsMounted();
 
-  const { locale } = useLocale();
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const documentInformation = useMemo(() => {
-    let createdValue = DateTime.fromJSDate(document.createdAt).toFormat('MMMM d, yyyy');
-    let lastModifiedValue = DateTime.fromJSDate(document.updatedAt).toRelative();
-
-    if (!isMounted) {
-      createdValue = DateTime.fromJSDate(document.createdAt)
-        .setLocale(locale)
-        .toFormat('MMMM d, yyyy');
-
-      lastModifiedValue = DateTime.fromJSDate(document.updatedAt).setLocale(locale).toRelative();
-    }
-
     return [
       {
         description: msg`Uploaded by`,
@@ -46,15 +33,19 @@ export const DocumentPageViewInformation = ({
       },
       {
         description: msg`Created`,
-        value: createdValue,
+        value: DateTime.fromJSDate(document.createdAt)
+          .setLocale(i18n.locales?.[0] || i18n.locale)
+          .toFormat('MMMM d, yyyy'),
       },
       {
         description: msg`Last modified`,
-        value: lastModifiedValue,
+        value: DateTime.fromJSDate(document.updatedAt)
+          .setLocale(i18n.locales?.[0] || i18n.locale)
+          .toRelative(),
       },
     ];
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isMounted, document, locale, userId]);
+  }, [isMounted, document, userId]);
 
   return (
     <section className="dark:bg-background text-foreground border-border bg-widget flex flex-col rounded-xl border">

apps/web/src/app/(dashboard)/documents/[id]/edit-document.tsx

@@ -349,11 +349,13 @@ export const EditDocumentForm = ({
             <AddSignersFormPartial
               key={recipients.length}
               documentFlow={documentFlow.signers}
+              document={document}
               recipients={recipients}
               fields={fields}
               isDocumentEnterprise={isDocumentEnterprise}
               onSubmit={onAddSignersFormSubmit}
               isDocumentPdfLoaded={isDocumentPdfLoaded}
+              teamId={team?.id}
             />
 
             <AddFieldsFormPartial

apps/web/src/app/(dashboard)/documents/[id]/logs/document-logs-data-table.tsx

@@ -20,8 +20,6 @@ import { DataTablePagination } from '@documenso/ui/primitives/data-table-paginat
 import { Skeleton } from '@documenso/ui/primitives/skeleton';
 import { TableCell } from '@documenso/ui/primitives/table';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 export type DocumentLogsDataTableProps = {
   documentId: number;
 };
@@ -32,7 +30,7 @@ const dateFormat: DateTimeFormatOptions = {
 };
 
 export const DocumentLogsDataTable = ({ documentId }: DocumentLogsDataTableProps) => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const searchParams = useSearchParams();
   const updateSearchParams = useUpdateSearchParams();
@@ -78,7 +76,7 @@ export const DocumentLogsDataTable = ({ documentId }: DocumentLogsDataTableProps
       {
         header: _(msg`Time`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => <LocaleDate format={dateFormat} date={row.original.createdAt} />,
+        cell: ({ row }) => i18n.date(row.original.createdAt, dateFormat),
       },
       {
         header: _(msg`User`),
@@ -106,9 +104,7 @@ export const DocumentLogsDataTable = ({ documentId }: DocumentLogsDataTableProps
         header: _(msg`Action`),
         accessorKey: 'type',
         cell: ({ row }) => (
-          <span>
-            {uppercaseFistLetter(formatDocumentAuditLogAction(row.original).description)}
-          </span>
+          <span>{uppercaseFistLetter(formatDocumentAuditLogAction(row.original).description)}</span>
         ),
       },
       {

apps/web/src/app/(dashboard)/documents/[id]/logs/document-logs-page-view.tsx

@@ -9,7 +9,6 @@ import { DateTime } from 'luxon';
 
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getDocumentById } from '@documenso/lib/server-only/document/get-document-by-id';
-import { getLocale } from '@documenso/lib/server-only/headers/get-locale';
 import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/get-recipients-for-document';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import type { Recipient, Team } from '@documenso/prisma/client';
@@ -32,9 +31,7 @@ export type DocumentLogsPageViewProps = {
 };
 
 export const DocumentLogsPageView = async ({ params, team }: DocumentLogsPageViewProps) => {
-  const { _ } = useLingui();
-
-  const locale = getLocale();
+  const { _, i18n } = useLingui();
 
   const { id } = params;
 
@@ -87,13 +84,13 @@ export const DocumentLogsPageView = async ({ params, team }: DocumentLogsPageVie
     {
       description: msg`Date created`,
       value: DateTime.fromJSDate(document.createdAt)
-        .setLocale(locale)
+        .setLocale(i18n.locales?.[0] || i18n.locale)
         .toLocaleString(DateTime.DATETIME_MED_WITH_SECONDS),
     },
     {
       description: msg`Last updated`,
       value: DateTime.fromJSDate(document.updatedAt)
-        .setLocale(locale)
+        .setLocale(i18n.locales?.[0] || i18n.locale)
         .toLocaleString(DateTime.DATETIME_MED_WITH_SECONDS),
     },
     {

apps/web/src/app/(dashboard)/documents/data-table.tsx

@@ -18,7 +18,6 @@ import { DataTablePagination } from '@documenso/ui/primitives/data-table-paginat
 
 import { StackAvatarsWithTooltip } from '~/components/(dashboard)/avatar/stack-avatars-with-tooltip';
 import { DocumentStatus } from '~/components/formatter/document-status';
-import { LocaleDate } from '~/components/formatter/locale-date';
 
 import { DataTableActionButton } from './data-table-action-button';
 import { DataTableActionDropdown } from './data-table-action-dropdown';
@@ -41,8 +40,9 @@ export const DocumentsDataTable = ({
   showSenderColumn,
   team,
 }: DocumentsDataTableProps) => {
+  const { _, i18n } = useLingui();
+
   const { data: session } = useSession();
-  const { _ } = useLingui();
 
   const [isPending, startTransition] = useTransition();
 
@@ -53,12 +53,8 @@ export const DocumentsDataTable = ({
       {
         header: _(msg`Created`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => (
-          <LocaleDate
-            date={row.original.createdAt}
-            format={{ ...DateTime.DATETIME_SHORT, hourCycle: 'h12' }}
-          />
-        ),
+        cell: ({ row }) =>
+          i18n.date(row.original.createdAt, { ...DateTime.DATETIME_SHORT, hourCycle: 'h12' }),
       },
       {
         header: _(msg`Title`),
@@ -88,8 +84,7 @@ export const DocumentsDataTable = ({
       {
         header: _(msg`Actions`),
         cell: ({ row }) =>
-          (!row.original.deletedAt ||
-            row.original.status === ExtendedDocumentStatus.COMPLETED) && (
+          (!row.original.deletedAt || row.original.status === ExtendedDocumentStatus.COMPLETED) && (
             <div className="flex items-center gap-x-4">
               <DataTableActionButton team={team} row={row.original} />
               <DataTableActionDropdown team={team} row={row.original} />

apps/web/src/app/(dashboard)/settings/billing/page.tsx

@@ -16,8 +16,6 @@ import { type Stripe } from '@documenso/lib/server-only/stripe';
 import { getSubscriptionsByUserId } from '@documenso/lib/server-only/subscription/get-subscriptions-by-user-id';
 import { SubscriptionStatus } from '@documenso/prisma/client';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 import { BillingPlans } from './billing-plans';
 import { BillingPortalButton } from './billing-portal-button';
 
@@ -26,7 +24,7 @@ export const metadata: Metadata = {
 };
 
 export default async function BillingSettingsPage() {
-  setupI18nSSR();
+  const { i18n } = setupI18nSSR();
 
   let { user } = await getRequiredServerComponentSession();
 
@@ -104,12 +102,12 @@ export default async function BillingSettingsPage() {
                     {subscription.cancelAtPeriodEnd ? (
                       <span>
                         end on{' '}
-                        <LocaleDate className="font-semibold" date={subscription.periodEnd} />.
+                        <span className="font-semibold">{i18n.date(subscription.periodEnd)}.</span>
                       </span>
                     ) : (
                       <span>
                         automatically renew on{' '}
-                        <LocaleDate className="font-semibold" date={subscription.periodEnd} />.
+                        <span className="font-semibold">{i18n.date(subscription.periodEnd)}.</span>
                       </span>
                     )}
                   </span>

apps/web/src/app/(dashboard)/settings/security/activity/user-security-activity-data-table.tsx

@@ -20,15 +20,13 @@ import { DataTablePagination } from '@documenso/ui/primitives/data-table-paginat
 import { Skeleton } from '@documenso/ui/primitives/skeleton';
 import { TableCell } from '@documenso/ui/primitives/table';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 const dateFormat: DateTimeFormatOptions = {
   ...DateTime.DATETIME_SHORT,
   hourCycle: 'h12',
 };
 
 export const UserSecurityActivityDataTable = () => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const pathname = usePathname();
   const router = useRouter();
@@ -71,7 +69,7 @@ export const UserSecurityActivityDataTable = () => {
       {
         header: _(msg`Date`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => <LocaleDate format={dateFormat} date={row.original.createdAt} />,
+        cell: ({ row }) => i18n.date(row.original.createdAt, dateFormat),
       },
       {
         header: _(msg`Device`),

apps/web/src/app/(dashboard)/settings/tokens/page.tsx

@@ -7,11 +7,10 @@ import { getUserTokens } from '@documenso/lib/server-only/public-api/get-all-use
 import { Button } from '@documenso/ui/primitives/button';
 
 import DeleteTokenDialog from '~/components/(dashboard)/settings/token/delete-token-dialog';
-import { LocaleDate } from '~/components/formatter/locale-date';
 import { ApiTokenForm } from '~/components/forms/token';
 
 export default async function ApiTokensPage() {
-  setupI18nSSR();
+  const { i18n } = setupI18nSSR();
 
   const { user } = await getRequiredServerComponentSession();
 
@@ -65,13 +64,11 @@ export default async function ApiTokensPage() {
                   <h5 className="text-base">{token.name}</h5>
 
                   <p className="text-muted-foreground mt-2 text-xs">
-                    <Trans>Created on</Trans>{' '}
-                    <LocaleDate date={token.createdAt} format={DateTime.DATETIME_FULL} />
+                    <Trans>Created on {i18n.date(token.createdAt, DateTime.DATETIME_FULL)}</Trans>
                   </p>
                   {token.expires ? (
                     <p className="text-muted-foreground mt-1 text-xs">
-                      <Trans>Expires on</Trans>{' '}
-                      <LocaleDate date={token.expires} format={DateTime.DATETIME_FULL} />
+                      <Trans>Expires on {i18n.date(token.expires, DateTime.DATETIME_FULL)}</Trans>
                     </p>
                   ) : (
                     <p className="text-muted-foreground mt-1 text-xs">

apps/web/src/app/(dashboard)/settings/webhooks/page.tsx

@@ -16,10 +16,9 @@ import { Button } from '@documenso/ui/primitives/button';
 import { SettingsHeader } from '~/components/(dashboard)/settings/layout/header';
 import { CreateWebhookDialog } from '~/components/(dashboard)/settings/webhooks/create-webhook-dialog';
 import { DeleteWebhookDialog } from '~/components/(dashboard)/settings/webhooks/delete-webhook-dialog';
-import { LocaleDate } from '~/components/formatter/locale-date';
 
 export default function WebhookPage() {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const { data: webhooks, isLoading } = trpc.webhook.getWebhooks.useQuery();
 
@@ -86,10 +85,7 @@ export default function WebhookPage() {
                   </p>
 
                   <p className="text-muted-foreground mt-2 text-xs">
-                    <Trans>
-                      Created on{' '}
-                      <LocaleDate date={webhook.createdAt} format={DateTime.DATETIME_FULL} />
-                    </Trans>
+                    <Trans>Created on {i18n.date(webhook.createdAt, DateTime.DATETIME_FULL)}</Trans>
                   </p>
                 </div>
 

apps/web/src/app/(dashboard)/templates/[id]/edit-template.tsx

@@ -266,6 +266,7 @@ export const EditTemplateForm = ({
               onSubmit={onAddTemplatePlaceholderFormSubmit}
               isEnterprise={isEnterprise}
               isDocumentPdfLoaded={isDocumentPdfLoaded}
+              template={template}
             />
 
             <AddTemplateFieldsFormPartial

apps/web/src/app/(dashboard)/templates/data-table-templates.tsx

@@ -17,7 +17,6 @@ import { DataTable } from '@documenso/ui/primitives/data-table';
 import { DataTablePagination } from '@documenso/ui/primitives/data-table-pagination';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
 import { TemplateType } from '~/components/formatter/template-type';
 
 import { DataTableActionDropdown } from './data-table-action-dropdown';
@@ -48,7 +47,7 @@ export const TemplatesDataTable = ({
 
   const updateSearchParams = useUpdateSearchParams();
 
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
   const { remaining } = useLimits();
 
   const columns = useMemo(() => {
@@ -56,7 +55,7 @@ export const TemplatesDataTable = ({
       {
         header: _(msg`Created`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => <LocaleDate date={row.original.createdAt} />,
+        cell: ({ row }) => i18n.date(row.original.createdAt),
       },
       {
         header: _(msg`Title`),
@@ -81,8 +80,8 @@ export const TemplatesDataTable = ({
 
                     <p>
                       <Trans>
-                        Public templates are connected to your public profile. Any modifications
-                        to public templates will also appear in your public profile.
+                        Public templates are connected to your public profile. Any modifications to
+                        public templates will also appear in your public profile.
                       </Trans>
                     </p>
                   </li>
@@ -94,9 +93,9 @@ export const TemplatesDataTable = ({
 
                     <p>
                       <Trans>
-                        Direct link templates contain one dynamic recipient placeholder. Anyone
-                        with access to this link can sign the document, and it will then appear
-                        on your documents page.
+                        Direct link templates contain one dynamic recipient placeholder. Anyone with
+                        access to this link can sign the document, and it will then appear on your
+                        documents page.
                       </Trans>
                     </p>
                   </li>
@@ -109,8 +108,8 @@ export const TemplatesDataTable = ({
                     <p>
                       {teamId ? (
                         <Trans>
-                          Team only templates are not linked anywhere and are visible only to
-                          your team.
+                          Team only templates are not linked anywhere and are visible only to your
+                          team.
                         </Trans>
                       ) : (
                         <Trans>Private templates can only be modified and viewed by you.</Trans>

apps/web/src/app/(internal)/%5F%5Fhtmltopdf/audit-log/data-table.tsx

@@ -4,6 +4,7 @@ import { DateTime } from 'luxon';
 import type { DateTimeFormatOptions } from 'luxon';
 import { UAParser } from 'ua-parser-js';
 
+import { APP_I18N_OPTIONS } from '@documenso/lib/constants/i18n';
 import type { TDocumentAuditLog } from '@documenso/lib/types/document-audit-logs';
 import { formatDocumentAuditLogAction } from '@documenso/lib/utils/document-audit-logs';
 import {
@@ -15,8 +16,6 @@ import {
   TableRow,
 } from '@documenso/ui/primitives/table';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 export type AuditLogDataTableProps = {
   logs: TDocumentAuditLog[];
 };
@@ -49,7 +48,9 @@ export const AuditLogDataTable = ({ logs }: AuditLogDataTableProps) => {
         {logs.map((log, i) => (
           <TableRow className="break-inside-avoid" key={i}>
             <TableCell>
-              <LocaleDate format={dateFormat} date={log.createdAt} />
+              {DateTime.fromJSDate(log.createdAt)
+                .setLocale(APP_I18N_OPTIONS.defaultLocale)
+                .toLocaleString(dateFormat)}
             </TableCell>
 
             <TableCell>

apps/web/src/app/(internal)/%5F%5Fhtmltopdf/audit-log/page.tsx

@@ -2,7 +2,9 @@ import React from 'react';
 
 import { redirect } from 'next/navigation';
 
-import { setupI18nSSR } from '@documenso/lib/client-only/providers/i18n.server';
+import { DateTime } from 'luxon';
+
+import { APP_I18N_OPTIONS } from '@documenso/lib/constants/i18n';
 import { RECIPIENT_ROLES_DESCRIPTION_ENG } from '@documenso/lib/constants/recipient-roles';
 import { getEntireDocument } from '@documenso/lib/server-only/admin/get-entire-document';
 import { decryptSecondaryData } from '@documenso/lib/server-only/crypto/decrypt';
@@ -10,7 +12,6 @@ import { findDocumentAuditLogs } from '@documenso/lib/server-only/document/find-
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 
 import { Logo } from '~/components/branding/logo';
-import { LocaleDate } from '~/components/formatter/locale-date';
 
 import { AuditLogDataTable } from './data-table';
 
@@ -21,8 +22,6 @@ type AuditLogProps = {
 };
 
 export default async function AuditLog({ searchParams }: AuditLogProps) {
-  setupI18nSSR();
-
   const { d } = searchParams;
 
   if (typeof d !== 'string' || !d) {
@@ -89,7 +88,9 @@ export default async function AuditLog({ searchParams }: AuditLogProps) {
             <span className="font-medium">Created At</span>
 
             <span className="mt-1 block">
-              <LocaleDate date={document.createdAt} format="yyyy-mm-dd hh:mm:ss a (ZZZZ)" />
+              {DateTime.fromJSDate(document.createdAt)
+                .setLocale(APP_I18N_OPTIONS.defaultLocale)
+                .toFormat('yyyy-mm-dd hh:mm:ss a (ZZZZ)')}
             </span>
           </p>
 
@@ -97,7 +98,9 @@ export default async function AuditLog({ searchParams }: AuditLogProps) {
             <span className="font-medium">Last Updated</span>
 
             <span className="mt-1 block">
-              <LocaleDate date={document.updatedAt} format="yyyy-mm-dd hh:mm:ss a (ZZZZ)" />
+              {DateTime.fromJSDate(document.updatedAt)
+                .setLocale(APP_I18N_OPTIONS.defaultLocale)
+                .toFormat('yyyy-mm-dd hh:mm:ss a (ZZZZ)')}
             </span>
           </p>
 

apps/web/src/app/(internal)/%5F%5Fhtmltopdf/certificate/page.tsx

@@ -2,10 +2,11 @@ import React from 'react';
 
 import { redirect } from 'next/navigation';
 
+import { DateTime } from 'luxon';
 import { match } from 'ts-pattern';
 import { UAParser } from 'ua-parser-js';
 
-import { setupI18nSSR } from '@documenso/lib/client-only/providers/i18n.server';
+import { APP_I18N_OPTIONS } from '@documenso/lib/constants/i18n';
 import {
   RECIPIENT_ROLES_DESCRIPTION_ENG,
   RECIPIENT_ROLE_SIGNING_REASONS_ENG,
@@ -27,7 +28,6 @@ import {
 } from '@documenso/ui/primitives/table';
 
 import { Logo } from '~/components/branding/logo';
-import { LocaleDate } from '~/components/formatter/locale-date';
 
 type SigningCertificateProps = {
   searchParams: {
@@ -41,8 +41,6 @@ const FRIENDLY_SIGNING_REASONS = {
 };
 
 export default async function SigningCertificate({ searchParams }: SigningCertificateProps) {
-  setupI18nSSR();
-
   const { d } = searchParams;
 
   if (typeof d !== 'string' || !d) {
@@ -231,42 +229,33 @@ export default async function SigningCertificate({ searchParams }: SigningCertif
                         <p className="text-muted-foreground text-sm print:text-xs">
                           <span className="font-medium">Sent:</span>{' '}
                           <span className="inline-block">
-                            {logs.EMAIL_SENT[0] ? (
-                              <LocaleDate
-                                date={logs.EMAIL_SENT[0].createdAt}
-                                format="yyyy-MM-dd hh:mm:ss a (ZZZZ)"
-                              />
-                            ) : (
-                              'Unknown'
-                            )}
+                            {logs.EMAIL_SENT[0]
+                              ? DateTime.fromJSDate(logs.EMAIL_SENT[0].createdAt)
+                                  .setLocale(APP_I18N_OPTIONS.defaultLocale)
+                                  .toFormat('yyyy-MM-dd hh:mm:ss a (ZZZZ)')
+                              : 'Unknown'}
                           </span>
                         </p>
 
                         <p className="text-muted-foreground text-sm print:text-xs">
                           <span className="font-medium">Viewed:</span>{' '}
                           <span className="inline-block">
-                            {logs.DOCUMENT_OPENED[0] ? (
-                              <LocaleDate
-                                date={logs.DOCUMENT_OPENED[0].createdAt}
-                                format="yyyy-MM-dd hh:mm:ss a (ZZZZ)"
-                              />
-                            ) : (
-                              'Unknown'
-                            )}
+                            {logs.DOCUMENT_OPENED[0]
+                              ? DateTime.fromJSDate(logs.DOCUMENT_OPENED[0].createdAt)
+                                  .setLocale(APP_I18N_OPTIONS.defaultLocale)
+                                  .toFormat('yyyy-MM-dd hh:mm:ss a (ZZZZ)')
+                              : 'Unknown'}
                           </span>
                         </p>
 
                         <p className="text-muted-foreground text-sm print:text-xs">
                           <span className="font-medium">Signed:</span>{' '}
                           <span className="inline-block">
-                            {logs.DOCUMENT_RECIPIENT_COMPLETED[0] ? (
-                              <LocaleDate
-                                date={logs.DOCUMENT_RECIPIENT_COMPLETED[0].createdAt}
-                                format="yyyy-MM-dd hh:mm:ss a (ZZZZ)"
-                              />
-                            ) : (
-                              'Unknown'
-                            )}
+                            {logs.DOCUMENT_RECIPIENT_COMPLETED[0]
+                              ? DateTime.fromJSDate(logs.DOCUMENT_RECIPIENT_COMPLETED[0].createdAt)
+                                  .setLocale(APP_I18N_OPTIONS.defaultLocale)
+                                  .toFormat('yyyy-MM-dd hh:mm:ss a (ZZZZ)')
+                              : 'Unknown'}
                           </span>
                         </p>
 

apps/web/src/app/(signing)/sign/[token]/dropdown-field.tsx

@@ -127,7 +127,7 @@ export const DropdownField = ({
         await removeSignedFieldWithToken(payload);
       }
 
-      setLocalChoice(parsedFieldMeta.defaultValue ?? '');
+      setLocalChoice('');
       startTransition(() => router.refresh());
     } catch (err) {
       console.error(err);
@@ -179,7 +179,7 @@ export const DropdownField = ({
 
         {!field.inserted && (
           <p className="group-hover:text-primary text-muted-foreground flex flex-col items-center justify-center duration-200">
-            <Select value={parsedFieldMeta.defaultValue} onValueChange={handleSelectItem}>
+            <Select value={localChoice} onValueChange={handleSelectItem}>
               <SelectTrigger
                 className={cn(
                   'text-muted-foreground z-10 h-full w-full border-none ring-0 focus:ring-0',
@@ -189,7 +189,7 @@ export const DropdownField = ({
                   },
                 )}
               >
-                <SelectValue placeholder={`-- ${_(msg`Select`)} --`} />
+                <SelectValue placeholder={`${_(msg`Select`)}`} />
               </SelectTrigger>
               <SelectContent className="w-full ring-0 focus:ring-0" position="popper">
                 {parsedFieldMeta?.values?.map((item, index) => (

apps/web/src/app/(teams)/t/[teamUrl]/settings/tokens/page.tsx

@@ -12,7 +12,6 @@ import { getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
 import { Button } from '@documenso/ui/primitives/button';
 
 import DeleteTokenDialog from '~/components/(dashboard)/settings/token/delete-token-dialog';
-import { LocaleDate } from '~/components/formatter/locale-date';
 import { ApiTokenForm } from '~/components/forms/token';
 
 type ApiTokensPageProps = {
@@ -22,7 +21,7 @@ type ApiTokensPageProps = {
 };
 
 export default async function ApiTokensPage({ params }: ApiTokensPageProps) {
-  setupI18nSSR();
+  const { i18n } = setupI18nSSR();
 
   const { teamUrl } = params;
 
@@ -98,13 +97,17 @@ export default async function ApiTokensPage({ params }: ApiTokensPageProps) {
                   <h5 className="text-base">{token.name}</h5>
 
                   <p className="text-muted-foreground mt-2 text-xs">
-                    <Trans>Created on</Trans>{' '}
-                    <LocaleDate date={token.createdAt} format={DateTime.DATETIME_FULL} />
+                    <Trans>
+                      Created on
+                      {i18n.date(token.createdAt, DateTime.DATETIME_FULL)}
+                    </Trans>
                   </p>
                   {token.expires ? (
                     <p className="text-muted-foreground mt-1 text-xs">
-                      <Trans>Expires on</Trans>{' '}
-                      <LocaleDate date={token.expires} format={DateTime.DATETIME_FULL} />
+                      <Trans>
+                        Expires on
+                        {i18n.date(token.expires, DateTime.DATETIME_FULL)}
+                      </Trans>
                     </p>
                   ) : (
                     <p className="text-muted-foreground mt-1 text-xs">

apps/web/src/app/(teams)/t/[teamUrl]/settings/webhooks/page.tsx

@@ -16,11 +16,10 @@ import { Button } from '@documenso/ui/primitives/button';
 import { SettingsHeader } from '~/components/(dashboard)/settings/layout/header';
 import { CreateWebhookDialog } from '~/components/(dashboard)/settings/webhooks/create-webhook-dialog';
 import { DeleteWebhookDialog } from '~/components/(dashboard)/settings/webhooks/delete-webhook-dialog';
-import { LocaleDate } from '~/components/formatter/locale-date';
 import { useCurrentTeam } from '~/providers/team';
 
 export default function WebhookPage() {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const team = useCurrentTeam();
 
@@ -91,10 +90,7 @@ export default function WebhookPage() {
                   </p>
 
                   <p className="text-muted-foreground mt-2 text-xs">
-                    <Trans>
-                      Created on{' '}
-                      <LocaleDate date={webhook.createdAt} format={DateTime.DATETIME_FULL} />
-                    </Trans>
+                    <Trans>Created on {i18n.date(webhook.createdAt, DateTime.DATETIME_FULL)}</Trans>
                   </p>
                 </div>
 

apps/web/src/app/embed/base-schema.ts

@@ -1,5 +1,8 @@
 import { z } from 'zod';
 
 export const ZBaseEmbedDataSchema = z.object({
-  css: z.string().optional().transform(value => value || undefined),
+  css: z
+    .string()
+    .optional()
+    .transform((value) => value || undefined),
 });

apps/web/src/app/embed/completed.tsx

@@ -18,15 +18,18 @@ export const EmbedDocumentCompleted = ({ name, signature }: EmbedDocumentComplet
 
       <div className="mt-8 w-full max-w-md">
         <SigningCard3D
-          className='w-full mx-auto'
+          className="mx-auto w-full"
           name={name || 'Documenso'}
           signature={signature}
           signingCelebrationImage={signingCelebration}
         />
       </div>
 
-      <p className="mt-8 max-w-[50ch] text-center text-muted-foreground text-sm">
-        <Trans>The document is now completed, please follow any instructions provided within the parent application.</Trans>
+      <p className="text-muted-foreground mt-8 max-w-[50ch] text-center text-sm">
+        <Trans>
+          The document is now completed, please follow any instructions provided within the parent
+          application.
+        </Trans>
       </p>
     </div>
   );

apps/web/src/app/embed/direct/[[...url]]/client.tsx

@@ -6,6 +6,7 @@ import { useSearchParams } from 'next/navigation';
 
 import { Trans, msg } from '@lingui/macro';
 import { useLingui } from '@lingui/react';
+import { LucideChevronDown, LucideChevronUp } from 'lucide-react';
 import { DateTime } from 'luxon';
 
 import { useThrottleFn } from '@documenso/lib/client-only/hooks/use-throttle-fn';
@@ -14,7 +15,7 @@ import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
 import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
 import { validateFieldsInserted } from '@documenso/lib/utils/fields';
 import type { DocumentMeta, Recipient, TemplateMeta } from '@documenso/prisma/client';
-import { FieldType, type DocumentData, type Field } from '@documenso/prisma/client';
+import { type DocumentData, type Field, FieldType } from '@documenso/prisma/client';
 import { trpc } from '@documenso/trpc/react';
 import type {
   TRemovedSignedFieldWithTokenMutationSchema,
@@ -34,7 +35,6 @@ import type { DirectTemplateLocalField } from '~/app/(recipient)/d/[token]/sign-
 import { useRequiredSigningContext } from '~/app/(signing)/sign/[token]/provider';
 import { Logo } from '~/components/branding/logo';
 
-import { LucideChevronDown, LucideChevronUp } from 'lucide-react';
 import { EmbedClientLoading } from '../../client-loading';
 import { EmbedDocumentCompleted } from '../../completed';
 import { EmbedDocumentFields } from '../../document-fields';
@@ -307,7 +307,7 @@ export const EmbedDirectTemplateClientPage = ({
     <div className="relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
       {(!hasFinishedInit || !hasDocumentLoaded) && <EmbedClientLoading />}
 
-      <div className="relative flex flex-col md:flex-row w-full gap-x-6 gap-y-12">
+      <div className="relative flex w-full flex-col gap-x-6 gap-y-12 md:flex-row">
         {/* Viewer */}
         <div className="flex-1">
           <LazyPDFViewer
@@ -318,26 +318,26 @@ export const EmbedDirectTemplateClientPage = ({
 
         {/* Widget */}
         <div
-          className="group/document-widget fixed md:sticky md:top-4 left-0 w-full bottom-8 px-6 md:px-0 z-50 md:z-auto md:w-[350px] flex-shrink-0 h-fit"
+          className="group/document-widget fixed bottom-8 left-0 z-50 h-fit w-full flex-shrink-0 px-6 md:sticky md:top-4 md:z-auto md:w-[350px] md:px-0"
           data-expanded={isExpanded || undefined}
         >
-          <div className="w-full border-border bg-widget flex md:min-h-[min(calc(100dvh-2rem),48rem)] h-fit flex-col rounded-xl border px-4 py-4 md:py-6">
+          <div className="border-border bg-widget flex h-fit w-full flex-col rounded-xl border px-4 py-4 md:min-h-[min(calc(100dvh-2rem),48rem)] md:py-6">
             {/* Header */}
             <div>
               <div className="flex items-center justify-between gap-x-2">
-                <h3 className="text-foreground text-xl md:text-2xl font-semibold">
+                <h3 className="text-foreground text-xl font-semibold md:text-2xl">
                   <Trans>Sign document</Trans>
                 </h3>
 
                 <Button variant="outline" className="h-8 w-8 p-0 md:hidden">
                   {isExpanded ? (
                     <LucideChevronDown
-                      className="h-5 w-5 text-muted-foreground"
+                      className="text-muted-foreground h-5 w-5"
                       onClick={() => setIsExpanded(false)}
                     />
                   ) : (
                     <LucideChevronUp
-                      className="h-5 w-5 text-muted-foreground"
+                      className="text-muted-foreground h-5 w-5"
                       onClick={() => setIsExpanded(true)}
                     />
                   )}
@@ -354,7 +354,7 @@ export const EmbedDirectTemplateClientPage = ({
             </div>
 
             {/* Form */}
-            <div className="-mx-2 px-2 hidden group-data-[expanded]/document-widget:block md:block">
+            <div className="-mx-2 hidden px-2 group-data-[expanded]/document-widget:block md:block">
               <div className="flex flex-1 flex-col gap-y-4">
                 <div>
                   <Label htmlFor="full-name">
@@ -408,9 +408,9 @@ export const EmbedDirectTemplateClientPage = ({
               </div>
             </div>
 
-            <div className="flex-1 hidden group-data-[expanded]/document-widget:block md:block" />
+            <div className="hidden flex-1 group-data-[expanded]/document-widget:block md:block" />
 
-            <div className="w-full grid-cols-2 items-center mt-4 hidden group-data-[expanded]/document-widget:grid md:grid">
+            <div className="mt-4 hidden w-full grid-cols-2 items-center group-data-[expanded]/document-widget:grid md:grid">
               {pendingFields.length > 0 ? (
                 <Button className="col-start-2" onClick={() => onNextFieldClick()}>
                   <Trans>Next</Trans>

apps/web/src/app/embed/direct/[[...url]]/not-found.tsx

@@ -1,3 +1,3 @@
 export default function EmbedDirectTemplateNotFound() {
-  return <div>Not Found</div>
+  return <div>Not Found</div>;
 }

apps/web/src/app/embed/direct/[[...url]]/page.tsx

@@ -73,11 +73,7 @@ export default async function EmbedDirectTemplatePage({ params }: EmbedDirectTem
   const fields = template.Field.filter((field) => field.recipientId === directTemplateRecipientId);
 
   return (
-    <SigningProvider
-      email={user?.email}
-      fullName={user?.name}
-      signature={user?.signature}
-    >
+    <SigningProvider email={user?.email} fullName={user?.name} signature={user?.signature}>
       <DocumentAuthProvider
         documentAuthOptions={template.authOptions}
         recipient={recipient}

apps/web/src/app/embed/document-fields.tsx

@@ -13,7 +13,7 @@ import {
   ZTextFieldMeta,
 } from '@documenso/lib/types/field-meta';
 import type { DocumentMeta, Recipient, TemplateMeta } from '@documenso/prisma/client';
-import { FieldType, type Field } from '@documenso/prisma/client';
+import { type Field, FieldType } from '@documenso/prisma/client';
 import type { FieldWithSignatureAndFieldMeta } from '@documenso/prisma/types/field-with-signature-and-fieldmeta';
 import type {
   TRemovedSignedFieldWithTokenMutationSchema,

apps/web/src/app/embed/paywall.tsx

@@ -1,5 +1,7 @@
 export const EmbedPaywall = () => {
-  return <div>
-    <h1>Paywall</h1>
-  </div>
-}
+  return (
+    <div>
+      <h1>Paywall</h1>
+    </div>
+  );
+};

apps/web/src/app/embed/sign/[[...url]]/client.tsx

@@ -1,15 +1,17 @@
 'use client';
 
+import { useEffect, useState } from 'react';
+
+import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
+import { LucideChevronDown, LucideChevronUp } from 'lucide-react';
+
 import { useThrottleFn } from '@documenso/lib/client-only/hooks/use-throttle-fn';
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
 import { validateFieldsInserted } from '@documenso/lib/utils/fields';
 import type { DocumentMeta, Recipient, TemplateMeta } from '@documenso/prisma/client';
 import { type DocumentData, type Field } from '@documenso/prisma/client';
 import { trpc } from '@documenso/trpc/react';
-import { Trans, msg } from '@lingui/macro';
-import { useLingui } from '@lingui/react';
-import { useEffect, useState } from 'react';
-
 import { FieldToolTip } from '@documenso/ui/components/field/field-tooltip';
 import { Button } from '@documenso/ui/primitives/button';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
@@ -20,9 +22,9 @@ import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
 import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-import { LucideChevronDown, LucideChevronUp } from 'lucide-react';
 import { useRequiredSigningContext } from '~/app/(signing)/sign/[token]/provider';
 import { Logo } from '~/components/branding/logo';
+
 import { EmbedClientLoading } from '../../client-loading';
 import { EmbedDocumentCompleted } from '../../completed';
 import { EmbedDocumentFields } from '../../document-fields';
@@ -185,7 +187,7 @@ export const EmbedSignDocumentClientPage = ({
     <div className="relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
       {(!hasFinishedInit || !hasDocumentLoaded) && <EmbedClientLoading />}
 
-      <div className="relative flex flex-col md:flex-row w-full gap-x-6 gap-y-12">
+      <div className="relative flex w-full flex-col gap-x-6 gap-y-12 md:flex-row">
         {/* Viewer */}
         <div className="flex-1">
           <LazyPDFViewer
@@ -196,26 +198,26 @@ export const EmbedSignDocumentClientPage = ({
 
         {/* Widget */}
         <div
-          className="group/document-widget fixed md:sticky md:top-4 left-0 w-full bottom-8 px-6 md:px-0 z-50 md:z-auto md:w-[350px] flex-shrink-0 h-fit"
+          className="group/document-widget fixed bottom-8 left-0 z-50 h-fit w-full flex-shrink-0 px-6 md:sticky md:top-4 md:z-auto md:w-[350px] md:px-0"
           data-expanded={isExpanded || undefined}
         >
-          <div className="w-full border-border bg-widget flex  flex-col rounded-xl border px-4 py-4 md:py-6">
+          <div className="border-border bg-widget flex w-full  flex-col rounded-xl border px-4 py-4 md:py-6">
             {/* Header */}
             <div>
               <div className="flex items-center justify-between gap-x-2">
-                <h3 className="text-foreground text-xl md:text-2xl font-semibold">
+                <h3 className="text-foreground text-xl font-semibold md:text-2xl">
                   <Trans>Sign document</Trans>
                 </h3>
 
                 <Button variant="outline" className="h-8 w-8 p-0 md:hidden">
                   {isExpanded ? (
                     <LucideChevronDown
-                      className="h-5 w-5 text-muted-foreground"
+                      className="text-muted-foreground h-5 w-5"
                       onClick={() => setIsExpanded(false)}
                     />
                   ) : (
                     <LucideChevronUp
-                      className="h-5 w-5 text-muted-foreground"
+                      className="text-muted-foreground h-5 w-5"
                       onClick={() => setIsExpanded(true)}
                     />
                   )}
@@ -232,7 +234,7 @@ export const EmbedSignDocumentClientPage = ({
             </div>
 
             {/* Form */}
-            <div className="-mx-2 px-2 hidden group-data-[expanded]/document-widget:block md:block">
+            <div className="-mx-2 hidden px-2 group-data-[expanded]/document-widget:block md:block">
               <div className="flex flex-1 flex-col gap-y-4">
                 <div>
                   <Label htmlFor="full-name">
@@ -285,9 +287,9 @@ export const EmbedSignDocumentClientPage = ({
               </div>
             </div>
 
-            <div className="flex-1 hidden group-data-[expanded]/document-widget:block md:block" />
+            <div className="hidden flex-1 group-data-[expanded]/document-widget:block md:block" />
 
-            <div className="w-full grid-cols-2 items-center mt-4 hidden group-data-[expanded]/document-widget:grid md:grid">
+            <div className="mt-4 hidden w-full grid-cols-2 items-center group-data-[expanded]/document-widget:grid md:grid">
               {pendingFields.length > 0 ? (
                 <Button className="col-start-2" onClick={() => onNextFieldClick()}>
                   <Trans>Next</Trans>

apps/web/src/app/embed/sign/[[...url]]/not-found.tsx

@@ -1,3 +1,3 @@
 export default function EmbedDirectTemplateNotFound() {
-  return <div>Not Found</div>
+  return <div>Not Found</div>;
 }

apps/web/src/app/embed/sign/[[...url]]/page.tsx

@@ -4,8 +4,12 @@ import { match } from 'ts-pattern';
 
 import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
 import { getServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
+import { getDocumentAndSenderByToken } from '@documenso/lib/server-only/document/get-document-by-token';
+import { getFieldsForToken } from '@documenso/lib/server-only/field/get-fields-for-token';
+import { getRecipientByToken } from '@documenso/lib/server-only/recipient/get-recipient-by-token';
 import { DocumentAccessAuth } from '@documenso/lib/types/document-auth';
 import { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
+import { DocumentStatus } from '@documenso/prisma/client';
 
 import { DocumentAuthProvider } from '~/app/(signing)/sign/[token]/document-auth-provider';
 import { SigningProvider } from '~/app/(signing)/sign/[token]/provider';
@@ -13,10 +17,6 @@ import { SigningProvider } from '~/app/(signing)/sign/[token]/provider';
 import { EmbedAuthenticateView } from '../../authenticate';
 import { EmbedPaywall } from '../../paywall';
 import { EmbedSignDocumentClientPage } from './client';
-import { getFieldsForToken } from '@documenso/lib/server-only/field/get-fields-for-token';
-import { getRecipientByToken } from '@documenso/lib/server-only/recipient/get-recipient-by-token';
-import { getDocumentAndSenderByToken } from '@documenso/lib/server-only/document/get-document-by-token';
-import { DocumentStatus } from '@documenso/prisma/client';
 
 export type EmbedSignDocumentPageProps = {
   params: {
@@ -66,7 +66,12 @@ export default async function EmbedSignDocumentPage({ params }: EmbedSignDocumen
     .exhaustive();
 
   if (!isAccessAuthValid) {
-    return <EmbedAuthenticateView email={user?.email || recipient.email} returnTo={`/embed/direct/${token}`} />;
+    return (
+      <EmbedAuthenticateView
+        email={user?.email || recipient.email}
+        returnTo={`/embed/direct/${token}`}
+      />
+    );
   }
 
   return (

apps/web/src/app/layout.tsx

@@ -1,7 +1,6 @@
 import { Suspense } from 'react';
 
 import { Caveat, Inter } from 'next/font/google';
-import { cookies, headers } from 'next/headers';
 
 import { AxiomWebVitals } from 'next-axiom';
 import { PublicEnvScript } from 'next-runtime-env';
@@ -9,12 +8,8 @@ import { PublicEnvScript } from 'next-runtime-env';
 import { FeatureFlagProvider } from '@documenso/lib/client-only/providers/feature-flag';
 import { I18nClientProvider } from '@documenso/lib/client-only/providers/i18n.client';
 import { setupI18nSSR } from '@documenso/lib/client-only/providers/i18n.server';
-import { LocaleProvider } from '@documenso/lib/client-only/providers/locale';
 import { IS_APP_WEB_I18N_ENABLED, NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
-import type { SUPPORTED_LANGUAGE_CODES } from '@documenso/lib/constants/i18n';
-import { ZSupportedLanguageCodeSchema } from '@documenso/lib/constants/i18n';
 import { getServerComponentAllFlags } from '@documenso/lib/server-only/feature-flags/get-server-component-feature-flag';
-import { getLocale } from '@documenso/lib/server-only/headers/get-locale';
 import { TrpcProvider } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
 import { Toaster } from '@documenso/ui/primitives/toaster';
@@ -61,32 +56,7 @@ export function generateMetadata() {
 export default async function RootLayout({ children }: { children: React.ReactNode }) {
   const flags = await getServerComponentAllFlags();
 
-  const locale = getLocale();
-
-  let overrideLang: (typeof SUPPORTED_LANGUAGE_CODES)[number] | undefined;
-
-  // Should be safe to remove when we upgrade NextJS.
-  // https://github.com/vercel/next.js/pull/65008
-  // Currently if the middleware sets the cookie, it's not accessible in the cookies
-  // during the same render.
-  // So we go the roundabout way of checking the header for the set-cookie value.
-  if (!cookies().get('i18n')) {
-    const setCookieValue = headers().get('set-cookie');
-    const i18nCookie = setCookieValue?.split(';').find((cookie) => cookie.startsWith('i18n='));
-
-    if (i18nCookie) {
-      const i18n = i18nCookie.split('=')[1];
-
-      overrideLang = ZSupportedLanguageCodeSchema.parse(i18n);
-    }
-  }
-
-  // Disable i18n for now until we get translations.
-  if (!IS_APP_WEB_I18N_ENABLED) {
-    overrideLang = 'en';
-  }
-
-  const { lang, i18n } = setupI18nSSR(overrideLang);
+  const { i18n, lang, locales } = setupI18nSSR();
 
   return (
     <html
@@ -110,21 +80,22 @@ export default async function RootLayout({ children }: { children: React.ReactNo
       </Suspense>
 
       <body>
-        <LocaleProvider locale={locale}>
-          <FeatureFlagProvider initialFlags={flags}>
-            <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
-              <TooltipProvider>
-                <TrpcProvider>
-                  <I18nClientProvider initialLocale={lang} initialMessages={i18n.messages}>
-                    {children}
-                  </I18nClientProvider>
-                </TrpcProvider>
-              </TooltipProvider>
-            </ThemeProvider>
+        <FeatureFlagProvider initialFlags={flags}>
+          <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
+            <TooltipProvider>
+              <TrpcProvider>
+                <I18nClientProvider
+                  initialLocaleData={{ lang, locales }}
+                  initialMessages={i18n.messages}
+                >
+                  {children}
+                </I18nClientProvider>
+              </TrpcProvider>
+            </TooltipProvider>
+          </ThemeProvider>
 
-            <Toaster />
-          </FeatureFlagProvider>
-        </LocaleProvider>
+          <Toaster />
+        </FeatureFlagProvider>
       </body>
     </html>
   );

apps/web/src/components/(dashboard)/common/command-menu.tsx

@@ -7,10 +7,11 @@ import { useRouter } from 'next/navigation';
 import type { MessageDescriptor } from '@lingui/core';
 import { Trans, msg } from '@lingui/macro';
 import { useLingui } from '@lingui/react';
-import { Loader, Monitor, Moon, Sun } from 'lucide-react';
+import { CheckIcon, Loader, Monitor, Moon, Sun } from 'lucide-react';
 import { useTheme } from 'next-themes';
 import { useHotkeys } from 'react-hotkeys-hook';
 
+import { SUPPORTED_LANGUAGES } from '@documenso/lib/constants/i18n';
 import {
   DOCUMENTS_PAGE_SHORTCUT,
   SETTINGS_PAGE_SHORTCUT,
@@ -20,7 +21,10 @@ import {
   DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
   SKIP_QUERY_BATCH_META,
 } from '@documenso/lib/constants/trpc';
+import { switchI18NLanguage } from '@documenso/lib/server-only/i18n/switch-i18n-language';
+import { dynamicActivate } from '@documenso/lib/utils/i18n';
 import { trpc as trpcReact } from '@documenso/trpc/react';
+import { cn } from '@documenso/ui/lib/utils';
 import {
   CommandDialog,
   CommandEmpty,
@@ -31,6 +35,7 @@ import {
   CommandShortcut,
 } from '@documenso/ui/primitives/command';
 import { THEMES_TYPE } from '@documenso/ui/primitives/constants';
+import { useToast } from '@documenso/ui/primitives/use-toast';
 
 const DOCUMENTS_PAGES = [
   {
@@ -207,6 +212,9 @@ export function CommandMenu({ open, onOpenChange }: CommandMenuProps) {
               <Commands push={push} pages={SETTINGS_PAGES} />
             </CommandGroup>
             <CommandGroup className="mx-2 p-0 pb-2" heading={_(msg`Preferences`)}>
+              <CommandItem className="-mx-2 -my-1 rounded-lg" onSelect={() => addPage('language')}>
+                Change language
+              </CommandItem>
               <CommandItem className="-mx-2 -my-1 rounded-lg" onSelect={() => addPage('theme')}>
                 Change theme
               </CommandItem>
@@ -218,7 +226,9 @@ export function CommandMenu({ open, onOpenChange }: CommandMenuProps) {
             )}
           </>
         )}
+
         {currentPage === 'theme' && <ThemeCommands setTheme={setTheme} />}
+        {currentPage === 'language' && <LanguageCommands />}
       </CommandList>
     </CommandDialog>
   );
@@ -269,3 +279,46 @@ const ThemeCommands = ({ setTheme }: { setTheme: (_theme: string) => void }) =>
     </CommandItem>
   ));
 };
+
+const LanguageCommands = () => {
+  const { i18n, _ } = useLingui();
+  const { toast } = useToast();
+
+  const [isLoading, setIsLoading] = useState(false);
+
+  const setLanguage = async (lang: string) => {
+    if (isLoading || lang === i18n.locale) {
+      return;
+    }
+
+    setIsLoading(true);
+
+    try {
+      await dynamicActivate(i18n, lang);
+      await switchI18NLanguage(lang);
+    } catch (err) {
+      toast({
+        title: _(msg`An unknown error occurred`),
+        variant: 'destructive',
+        description: _(msg`Unable to change the language at this time. Please try again later.`),
+      });
+    }
+
+    setIsLoading(false);
+  };
+
+  return Object.values(SUPPORTED_LANGUAGES).map((language) => (
+    <CommandItem
+      disabled={isLoading}
+      key={language.full}
+      onSelect={async () => setLanguage(language.short)}
+      className="-my-1 mx-2 rounded-lg first:mt-2 last:mb-2"
+    >
+      <CheckIcon
+        className={cn('mr-2 h-4 w-4', i18n.locale === language.short ? 'opacity-100' : 'opacity-0')}
+      />
+
+      {language.full}
+    </CommandItem>
+  ));
+};

apps/web/src/components/(dashboard)/layout/menu-switcher.tsx

@@ -1,5 +1,7 @@
 'use client';
 
+import { useState } from 'react';
+
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 
@@ -17,6 +19,7 @@ import { extractInitials } from '@documenso/lib/utils/recipient-formatter';
 import { canExecuteTeamAction } from '@documenso/lib/utils/teams';
 import type { User } from '@documenso/prisma/client';
 import { trpc } from '@documenso/trpc/react';
+import { LanguageSwitcherDialog } from '@documenso/ui/components/common/language-switcher-dialog';
 import { cn } from '@documenso/ui/lib/utils';
 import { AvatarWithText } from '@documenso/ui/primitives/avatar';
 import { Button } from '@documenso/ui/primitives/button';
@@ -41,6 +44,8 @@ export const MenuSwitcher = ({ user, teams: initialTeamsData }: MenuSwitcherProp
 
   const pathname = usePathname();
 
+  const [languageSwitcherOpen, setLanguageSwitcherOpen] = useState(false);
+
   const isUserAdmin = isAdmin(user);
 
   const { data: teamsQueryResult } = trpc.team.getTeams.useQuery(undefined, {
@@ -274,6 +279,13 @@ export const MenuSwitcher = ({ user, teams: initialTeamsData }: MenuSwitcherProp
             </DropdownMenuItem>
           )}
 
+        <DropdownMenuItem
+          className="text-muted-foreground px-4 py-2"
+          onClick={() => setLanguageSwitcherOpen(true)}
+        >
+          <Trans>Language</Trans>
+        </DropdownMenuItem>
+
         <DropdownMenuItem
           className="text-destructive/90 hover:!text-destructive px-4 py-2"
           onSelect={async () =>
@@ -285,6 +297,8 @@ export const MenuSwitcher = ({ user, teams: initialTeamsData }: MenuSwitcherProp
           <Trans>Sign Out</Trans>
         </DropdownMenuItem>
       </DropdownMenuContent>
+
+      <LanguageSwitcherDialog open={languageSwitcherOpen} setOpen={setLanguageSwitcherOpen} />
     </DropdownMenu>
   );
 };

apps/web/src/components/(teams)/tables/current-user-teams-data-table.tsx

@@ -22,12 +22,10 @@ import { DataTablePagination } from '@documenso/ui/primitives/data-table-paginat
 import { Skeleton } from '@documenso/ui/primitives/skeleton';
 import { TableCell } from '@documenso/ui/primitives/table';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 import { LeaveTeamDialog } from '../dialogs/leave-team-dialog';
 
 export const CurrentUserTeamsDataTable = () => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const searchParams = useSearchParams();
   const updateSearchParams = useUpdateSearchParams();
@@ -91,7 +89,7 @@ export const CurrentUserTeamsDataTable = () => {
       {
         header: _(msg`Member Since`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => <LocaleDate date={row.original.createdAt} />,
+        cell: ({ row }) => i18n.date(row.original.createdAt),
       },
       {
         id: 'actions',

apps/web/src/components/(teams)/tables/pending-user-teams-data-table.tsx

@@ -18,13 +18,11 @@ import { DataTablePagination } from '@documenso/ui/primitives/data-table-paginat
 import { Skeleton } from '@documenso/ui/primitives/skeleton';
 import { TableCell } from '@documenso/ui/primitives/table';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 import { CreateTeamCheckoutDialog } from '../dialogs/create-team-checkout-dialog';
 import { PendingUserTeamsDataTableActions } from './pending-user-teams-data-table-actions';
 
 export const PendingUserTeamsDataTable = () => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const searchParams = useSearchParams();
   const updateSearchParams = useUpdateSearchParams();
@@ -79,7 +77,7 @@ export const PendingUserTeamsDataTable = () => {
       {
         header: _(msg`Created on`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => <LocaleDate date={row.original.createdAt} />,
+        cell: ({ row }) => i18n.date(row.original.createdAt),
       },
       {
         id: 'actions',

apps/web/src/components/(teams)/tables/team-member-invites-data-table.tsx

@@ -27,8 +27,6 @@ import { Skeleton } from '@documenso/ui/primitives/skeleton';
 import { TableCell } from '@documenso/ui/primitives/table';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 export type TeamMemberInvitesDataTableProps = {
   teamId: number;
 };
@@ -37,7 +35,7 @@ export const TeamMemberInvitesDataTable = ({ teamId }: TeamMemberInvitesDataTabl
   const searchParams = useSearchParams();
   const updateSearchParams = useUpdateSearchParams();
 
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
   const { toast } = useToast();
 
   const parsedSearchParams = ZBaseTableSearchParamsSchema.parse(
@@ -129,7 +127,7 @@ export const TeamMemberInvitesDataTable = ({ teamId }: TeamMemberInvitesDataTabl
       {
         header: _(msg`Invited At`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => <LocaleDate date={row.original.createdAt} />,
+        cell: ({ row }) => i18n.date(row.original.createdAt),
       },
       {
         header: _(msg`Actions`),

apps/web/src/components/(teams)/tables/team-members-data-table.tsx

@@ -29,8 +29,6 @@ import {
 import { Skeleton } from '@documenso/ui/primitives/skeleton';
 import { TableCell } from '@documenso/ui/primitives/table';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 import { DeleteTeamMemberDialog } from '../dialogs/delete-team-member-dialog';
 import { UpdateTeamMemberDialog } from '../dialogs/update-team-member-dialog';
 
@@ -47,7 +45,7 @@ export const TeamMembersDataTable = ({
   teamId,
   teamName,
 }: TeamMembersDataTableProps) => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const searchParams = useSearchParams();
   const updateSearchParams = useUpdateSearchParams();
@@ -114,7 +112,7 @@ export const TeamMembersDataTable = ({
       {
         header: _(msg`Member Since`),
         accessorKey: 'createdAt',
-        cell: ({ row }) => <LocaleDate date={row.original.createdAt} />,
+        cell: ({ row }) => i18n.date(row.original.createdAt),
       },
       {
         header: _(msg`Actions`),

apps/web/src/components/document/document-history-sheet.tsx

@@ -3,7 +3,9 @@
 import { useMemo, useState } from 'react';
 
 import { Trans } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { ArrowRightIcon, Loader } from 'lucide-react';
+import { DateTime } from 'luxon';
 import { match } from 'ts-pattern';
 import { UAParser } from 'ua-parser-js';
 
@@ -18,8 +20,6 @@ import { Badge } from '@documenso/ui/primitives/badge';
 import { Button } from '@documenso/ui/primitives/button';
 import { Sheet, SheetContent, SheetTrigger } from '@documenso/ui/primitives/sheet';
 
-import { LocaleDate } from '~/components/formatter/locale-date';
-
 import { DocumentHistorySheetChanges } from './document-history-sheet-changes';
 
 export type DocumentHistorySheetProps = {
@@ -37,6 +37,8 @@ export const DocumentHistorySheet = ({
   onMenuOpenChange,
   children,
 }: DocumentHistorySheetProps) => {
+  const { i18n } = useLingui();
+
   const [isUserDetailsVisible, setIsUserDetailsVisible] = useState(false);
 
   const {
@@ -153,7 +155,9 @@ export const DocumentHistorySheet = ({
                       {formatDocumentAuditLogActionString(auditLog, userId)}
                     </p>
                     <p className="text-foreground/50 text-xs">
-                      <LocaleDate date={auditLog.createdAt} format="d MMM, yyyy HH:MM a" />
+                      {DateTime.fromJSDate(auditLog.createdAt)
+                        .setLocale(i18n.locales?.[0] || i18n.locale)
+                        .toFormat('d MMM, yyyy HH:MM a')}
                     </p>
                   </div>
                 </div>

apps/web/src/components/formatter/locale-date.tsx

@@ -1,49 +0,0 @@
-'use client';
-
-import type { HTMLAttributes } from 'react';
-import { useCallback, useEffect, useState } from 'react';
-
-import type { DateTimeFormatOptions } from 'luxon';
-import { DateTime } from 'luxon';
-
-import { useLocale } from '@documenso/lib/client-only/providers/locale';
-
-export type LocaleDateProps = HTMLAttributes<HTMLSpanElement> & {
-  date: string | number | Date;
-  format?: DateTimeFormatOptions | string;
-};
-
-/**
- * Formats the date based on the user locale.
- *
- * Will use the estimated locale from the user headers on SSR, then will use
- * the client browser locale once mounted.
- */
-export const LocaleDate = ({ className, date, format, ...props }: LocaleDateProps) => {
-  const { locale } = useLocale();
-
-  const formatDateTime = useCallback(
-    (date: DateTime) => {
-      if (typeof format === 'string') {
-        return date.toFormat(format);
-      }
-
-      return date.toLocaleString(format);
-    },
-    [format],
-  );
-
-  const [localeDate, setLocaleDate] = useState(() =>
-    formatDateTime(DateTime.fromJSDate(new Date(date)).setLocale(locale)),
-  );
-
-  useEffect(() => {
-    setLocaleDate(formatDateTime(DateTime.fromJSDate(new Date(date))));
-  }, [date, format, formatDateTime]);
-
-  return (
-    <span className={className} {...props}>
-      {localeDate}
-    </span>
-  );
-};

apps/web/src/components/templates/manage-public-template-dialog.tsx

@@ -52,8 +52,6 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { useOptionalCurrentTeam } from '~/providers/team';
 
-import { LocaleDate } from '../formatter/locale-date';
-
 export type ManagePublicTemplateDialogProps = {
   directTemplates: (Template & {
     directLink: Pick<TemplateDirectLink, 'token' | 'enabled'>;
@@ -93,7 +91,7 @@ export const ManagePublicTemplateDialog = ({
   onIsOpenChange,
   ...props
 }: ManagePublicTemplateDialogProps) => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
   const { toast } = useToast();
 
   const [open, onOpenChange] = useState(isOpen);
@@ -300,7 +298,7 @@ export const ManagePublicTemplateDialog = ({
                           </TableCell>
 
                           <TableCell className="text-muted-foreground text-sm">
-                            <LocaleDate date={row.createdAt} />
+                            {i18n.date(row.createdAt)}
                           </TableCell>
 
                           <TableCell>

apps/web/src/middleware.ts

@@ -5,7 +5,6 @@ import { NextResponse } from 'next/server';
 import { getToken } from 'next-auth/jwt';
 
 import { TEAM_URL_ROOT_REGEX } from '@documenso/lib/constants/teams';
-import { extractSupportedLanguage } from '@documenso/lib/utils/i18n';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 
 async function middleware(req: NextRequest): Promise<NextResponse> {
@@ -82,7 +81,7 @@ async function middleware(req: NextRequest): Promise<NextResponse> {
     // Allow third parties to iframe the document.
     res.headers.set('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
     res.headers.set('Access-Control-Allow-Origin', '*');
-    res.headers.set('Content-Security-Policy', "frame-ancestors *");
+    res.headers.set('Content-Security-Policy', 'frame-ancestors *');
     res.headers.set('Referrer-Policy', 'strict-origin-when-cross-origin');
     res.headers.set('X-Content-Type-Options', 'nosniff');
     res.headers.set('X-Frame-Options', 'ALLOW-ALL');
@@ -96,12 +95,7 @@ async function middleware(req: NextRequest): Promise<NextResponse> {
 export default async function middlewareWrapper(req: NextRequest) {
   const response = await middleware(req);
 
-  const lang = extractSupportedLanguage({
-    headers: req.headers,
-    cookies: cookies(),
-  });
-
-  response.cookies.set('i18n', lang);
+  // Can place anything that needs to be set on the response here.
 
   return response;
 }

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@documenso/root",
-  "version": "1.7.0-rc.5",
+  "version": "1.7.1-rc.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@documenso/root",
-      "version": "1.7.0-rc.5",
+      "version": "1.7.1-rc.0",
       "workspaces": [
         "apps/*",
         "packages/*"
@@ -80,7 +80,7 @@
     },
     "apps/marketing": {
       "name": "@documenso/marketing",
-      "version": "1.7.0-rc.5",
+      "version": "1.7.1-rc.0",
       "license": "AGPL-3.0",
       "dependencies": {
         "@documenso/assets": "*",
@@ -424,7 +424,7 @@
     },
     "apps/web": {
       "name": "@documenso/web",
-      "version": "1.7.0-rc.5",
+      "version": "1.7.1-rc.0",
       "license": "AGPL-3.0",
       "dependencies": {
         "@documenso/api": "*",

package.json

@@ -1,6 +1,6 @@
 {
   "private": true,
-  "version": "1.7.0-rc.5",
+  "version": "1.7.1-rc.0",
   "scripts": {
     "build": "turbo run build",
     "build:web": "turbo run build --filter=@documenso/web",

packages/api/v1/implementation.ts

@@ -16,6 +16,7 @@ import { getDocumentById } from '@documenso/lib/server-only/document/get-documen
 import { resendDocument } from '@documenso/lib/server-only/document/resend-document';
 import { sendDocument } from '@documenso/lib/server-only/document/send-document';
 import { updateDocument } from '@documenso/lib/server-only/document/update-document';
+import { updateDocumentSettings } from '@documenso/lib/server-only/document/update-document-settings';
 import { deleteField } from '@documenso/lib/server-only/field/delete-field';
 import { getFieldById } from '@documenso/lib/server-only/field/get-field-by-id';
 import { updateField } from '@documenso/lib/server-only/field/update-field';
@@ -295,6 +296,16 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
         requestMetadata: extractNextApiRequestMetadata(args.req),
       });
 
+      if (body.authOptions) {
+        await updateDocumentSettings({
+          documentId: document.id,
+          userId: user.id,
+          teamId: team?.id,
+          data: body.authOptions,
+          requestMetadata: extractNextApiRequestMetadata(args.req),
+        });
+      }
+
       const recipients = await setRecipientsForDocument({
         userId: user.id,
         teamId: team?.id,
@@ -465,6 +476,16 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       });
     }
 
+    if (body.authOptions) {
+      await updateDocumentSettings({
+        documentId: document.id,
+        userId: user.id,
+        teamId: team?.id,
+        data: body.authOptions,
+        requestMetadata: extractNextApiRequestMetadata(args.req),
+      });
+    }
+
     return {
       status: 200,
       body: {
@@ -547,6 +568,16 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       });
     }
 
+    if (body.authOptions) {
+      await updateDocumentSettings({
+        documentId: document.id,
+        userId: user.id,
+        teamId: team?.id,
+        data: body.authOptions,
+        requestMetadata: extractNextApiRequestMetadata(args.req),
+      });
+    }
+
     return {
       status: 200,
       body: {
@@ -682,7 +713,7 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
 
   createRecipient: authenticatedMiddleware(async (args, user, team) => {
     const { id: documentId } = args.params;
-    const { name, email, role } = args.body;
+    const { name, email, role, authOptions } = args.body;
 
     const document = await getDocumentById({
       id: Number(documentId),
@@ -736,6 +767,7 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
             email,
             name,
             role,
+            actionAuth: authOptions?.actionAuth ?? null,
           },
         ],
         requestMetadata: extractNextApiRequestMetadata(args.req),
@@ -767,7 +799,7 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
 
   updateRecipient: authenticatedMiddleware(async (args, user, team) => {
     const { id: documentId, recipientId } = args.params;
-    const { name, email, role } = args.body;
+    const { name, email, role, authOptions } = args.body;
 
     const document = await getDocumentById({
       id: Number(documentId),
@@ -801,6 +833,7 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       email,
       name,
       role,
+      actionAuth: authOptions?.actionAuth,
       requestMetadata: extractNextApiRequestMetadata(args.req),
     }).catch(() => null);
 

packages/api/v1/schema.ts

@@ -5,6 +5,11 @@ import { DATE_FORMATS, DEFAULT_DOCUMENT_DATE_FORMAT } from '@documenso/lib/const
 import '@documenso/lib/constants/time-zones';
 import { DEFAULT_DOCUMENT_TIME_ZONE, TIME_ZONES } from '@documenso/lib/constants/time-zones';
 import { ZUrlSchema } from '@documenso/lib/schemas/common';
+import {
+  ZDocumentAccessAuthTypesSchema,
+  ZDocumentActionAuthTypesSchema,
+  ZRecipientActionAuthTypesSchema,
+} from '@documenso/lib/types/document-auth';
 import { ZFieldMetaSchema } from '@documenso/lib/types/field-meta';
 import {
   DocumentDataType,
@@ -120,6 +125,12 @@ export const ZCreateDocumentMutationSchema = z.object({
       redirectUrl: z.string(),
     })
     .partial(),
+  authOptions: z
+    .object({
+      globalAccessAuth: ZDocumentAccessAuthTypesSchema.optional(),
+      globalActionAuth: ZDocumentActionAuthTypesSchema.optional(),
+    })
+    .optional(),
   formValues: z.record(z.string(), z.union([z.string(), z.boolean(), z.number()])).optional(),
 });
 
@@ -166,6 +177,12 @@ export const ZCreateDocumentFromTemplateMutationSchema = z.object({
     })
     .partial()
     .optional(),
+  authOptions: z
+    .object({
+      globalAccessAuth: ZDocumentAccessAuthTypesSchema.optional(),
+      globalActionAuth: ZDocumentActionAuthTypesSchema.optional(),
+    })
+    .optional(),
   formValues: z.record(z.string(), z.union([z.string(), z.boolean(), z.number()])).optional(),
 });
 
@@ -223,6 +240,12 @@ export const ZGenerateDocumentFromTemplateMutationSchema = z.object({
     })
     .partial()
     .optional(),
+  authOptions: z
+    .object({
+      globalAccessAuth: ZDocumentAccessAuthTypesSchema.optional(),
+      globalActionAuth: ZDocumentActionAuthTypesSchema.optional(),
+    })
+    .optional(),
   formValues: z.record(z.string(), z.union([z.string(), z.boolean(), z.number()])).optional(),
 });
 
@@ -254,6 +277,11 @@ export const ZCreateRecipientMutationSchema = z.object({
   name: z.string().min(1),
   email: z.string().email().min(1),
   role: z.nativeEnum(RecipientRole).optional().default(RecipientRole.SIGNER),
+  authOptions: z
+    .object({
+      actionAuth: ZRecipientActionAuthTypesSchema.optional(),
+    })
+    .optional(),
 });
 
 /**

packages/lib/client-only/hooks/use-throttle-fn.ts

@@ -3,19 +3,19 @@ import { useCallback, useRef, useState } from 'react';
 type ThrottleOptions = {
   leading?: boolean;
   trailing?: boolean;
-}
+};
 
 export function useThrottleFn<T extends (...args: unknown[]) => unknown>(
   fn: T,
   ms = 500,
-  options: ThrottleOptions = {}
+  options: ThrottleOptions = {},
 ): [(...args: Parameters<T>) => void, boolean, () => void] {
   const [isThrottling, setIsThrottling] = useState(false);
   const $isThrottling = useRef(false);
 
   const $timeout = useRef<NodeJS.Timeout | null>(null);
   const $lastArgs = useRef<Parameters<T> | null>(null);
-  
+
   const { leading = true, trailing = true } = options;
 
   const $setIsThrottling = useCallback((value: boolean) => {
@@ -44,7 +44,7 @@ export function useThrottleFn<T extends (...args: unknown[]) => unknown>(
         $lastArgs.current = args;
       }
     },
-    [fn, ms, leading, trailing, $setIsThrottling]
+    [fn, ms, leading, trailing, $setIsThrottling],
   );
 
   const cancel = useCallback(() => {

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

@@ -5,19 +5,24 @@ import { useState } from 'react';
 import { type Messages, setupI18n } from '@lingui/core';
 import { I18nProvider } from '@lingui/react';
 
+import type { I18nLocaleData } from '../../constants/i18n';
+
 export function I18nClientProvider({
   children,
-  initialLocale,
+  initialLocaleData,
   initialMessages,
 }: {
   children: React.ReactNode;
-  initialLocale: string;
+  initialLocaleData: I18nLocaleData;
   initialMessages: Messages;
 }) {
+  const { lang, locales } = initialLocaleData;
+
   const [i18n] = useState(() => {
     return setupI18n({
-      locale: initialLocale,
-      messages: { [initialLocale]: initialMessages },
+      locale: lang,
+      locales: locales,
+      messages: { [lang]: initialMessages },
     });
   });
 

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

@@ -1,26 +1,26 @@
 import 'server-only';
 
-import { cookies } from 'next/headers';
+import { cookies, headers } from 'next/headers';
 
 import type { I18n, Messages } from '@lingui/core';
 import { setupI18n } from '@lingui/core';
 import { setI18n } from '@lingui/react/server';
 
-import { IS_APP_WEB, IS_APP_WEB_I18N_ENABLED } from '../../constants/app';
+import { IS_APP_WEB } from '../../constants/app';
 import { SUPPORTED_LANGUAGE_CODES } from '../../constants/i18n';
-import { extractSupportedLanguage } from '../../utils/i18n';
+import { extractLocaleData } from '../../utils/i18n';
 
-type SupportedLocales = (typeof SUPPORTED_LANGUAGE_CODES)[number];
+type SupportedLanguages = (typeof SUPPORTED_LANGUAGE_CODES)[number];
 
-async function loadCatalog(locale: SupportedLocales): Promise<{
+async function loadCatalog(lang: SupportedLanguages): Promise<{
   [k: string]: Messages;
 }> {
   const { messages } = await import(
-    `../../translations/${locale}/${IS_APP_WEB ? 'web' : 'marketing'}.js`
+    `../../translations/${lang}/${IS_APP_WEB ? 'web' : 'marketing'}.js`
   );
 
   return {
-    [locale]: messages,
+    [lang]: messages,
   };
 }
 
@@ -31,18 +31,18 @@ export const allMessages = catalogs.reduce((acc, oneCatalog) => {
   return { ...acc, ...oneCatalog };
 }, {});
 
-type AllI18nInstances = { [K in SupportedLocales]: I18n };
+type AllI18nInstances = { [K in SupportedLanguages]: I18n };
 
 // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-export const allI18nInstances = SUPPORTED_LANGUAGE_CODES.reduce((acc, locale) => {
-  const messages = allMessages[locale] ?? {};
+export const allI18nInstances = SUPPORTED_LANGUAGE_CODES.reduce((acc, lang) => {
+  const messages = allMessages[lang] ?? {};
 
   const i18n = setupI18n({
-    locale,
-    messages: { [locale]: messages },
+    locale: lang,
+    messages: { [lang]: messages },
   });
 
-  return { ...acc, [locale]: i18n };
+  return { ...acc, [lang]: i18n };
 }, {}) as AllI18nInstances;
 
 /**
@@ -50,24 +50,23 @@ export const allI18nInstances = SUPPORTED_LANGUAGE_CODES.reduce((acc, locale) =>
  *
  * https://lingui.dev/tutorials/react-rsc#pages-layouts-and-lingui
  */
-export const setupI18nSSR = (overrideLang?: SupportedLocales) => {
-  let lang =
-    overrideLang ||
-    extractSupportedLanguage({
-      cookies: cookies(),
-    });
-
-  // Override web app to be English.
-  if (!IS_APP_WEB_I18N_ENABLED && IS_APP_WEB) {
-    lang = 'en';
-  }
+export const setupI18nSSR = () => {
+  const { lang, locales } = extractLocaleData({
+    cookies: cookies(),
+    headers: headers(),
+  });
 
   // Get and set a ready-made i18n instance for the given language.
   const i18n = allI18nInstances[lang];
+
+  // Reactivate the i18n instance with the locale for date and number formatting.
+  i18n.activate(lang, locales);
+
   setI18n(i18n);
 
   return {
     lang,
+    locales,
     i18n,
   };
 };

packages/lib/client-only/providers/locale.tsx

@@ -1,37 +0,0 @@
-'use client';
-
-import { createContext, useContext } from 'react';
-
-export type LocaleContextValue = {
-  locale: string;
-};
-
-export const LocaleContext = createContext<LocaleContextValue | null>(null);
-
-export const useLocale = () => {
-  const context = useContext(LocaleContext);
-
-  if (!context) {
-    throw new Error('useLocale must be used within a LocaleProvider');
-  }
-
-  return context;
-};
-
-export function LocaleProvider({
-  children,
-  locale,
-}: {
-  children: React.ReactNode;
-  locale: string;
-}) {
-  return (
-    <LocaleContext.Provider
-      value={{
-        locale: locale,
-      }}
-    >
-      {children}
-    </LocaleContext.Provider>
-  );
-}

packages/lib/constants/app.ts

@@ -1,16 +1,17 @@
 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;
 
 export const NEXT_PUBLIC_WEBAPP_URL = () => env('NEXT_PUBLIC_WEBAPP_URL');
 export const NEXT_PUBLIC_MARKETING_URL = () => env('NEXT_PUBLIC_MARKETING_URL');
-export const NEXT_PRIVATE_INTERNAL_WEBAPP_URL = process.env.NEXT_PRIVATE_INTERNAL_WEBAPP_URL ?? NEXT_PUBLIC_WEBAPP_URL();
+export const NEXT_PRIVATE_INTERNAL_WEBAPP_URL =
+  process.env.NEXT_PRIVATE_INTERNAL_WEBAPP_URL ?? NEXT_PUBLIC_WEBAPP_URL();
 
 export const IS_APP_MARKETING = process.env.NEXT_PUBLIC_PROJECT === 'marketing';
 export const IS_APP_WEB = process.env.NEXT_PUBLIC_PROJECT === 'web';
 export const IS_BILLING_ENABLED = () => env('NEXT_PUBLIC_FEATURE_BILLING_ENABLED') === 'true';
+export const IS_APP_WEB_I18N_ENABLED = true;
 
 export const APP_FOLDER = () => (IS_APP_MARKETING ? 'marketing' : 'web');
 

packages/lib/constants/i18n.ts

@@ -6,9 +6,22 @@ export const ZSupportedLanguageCodeSchema = z.enum(SUPPORTED_LANGUAGE_CODES).cat
 
 export type SupportedLanguageCodes = (typeof SUPPORTED_LANGUAGE_CODES)[number];
 
+export type I18nLocaleData = {
+  /**
+   * The supported language extracted from the locale.
+   */
+  lang: SupportedLanguageCodes;
+
+  /**
+   * The preferred locales.
+   */
+  locales: string[];
+};
+
 export const APP_I18N_OPTIONS = {
   supportedLangs: SUPPORTED_LANGUAGE_CODES,
   sourceLang: 'en',
+  defaultLocale: 'en-US',
 } as const;
 
 type SupportedLanguage = {

packages/lib/server-only/feature-flags/all.ts

@@ -5,7 +5,11 @@ import { getToken } from 'next-auth/jwt';
 import { LOCAL_FEATURE_FLAGS } from '@documenso/lib/constants/feature-flags';
 import PostHogServerClient from '@documenso/lib/server-only/feature-flags/get-post-hog-server-client';
 
-import { NEXT_PUBLIC_MARKETING_URL, NEXT_PUBLIC_WEBAPP_URL, NEXT_PRIVATE_INTERNAL_WEBAPP_URL } from '../../constants/app';
+import {
+  NEXT_PRIVATE_INTERNAL_WEBAPP_URL,
+  NEXT_PUBLIC_MARKETING_URL,
+  NEXT_PUBLIC_WEBAPP_URL,
+} from '../../constants/app';
 import { extractDistinctUserId, mapJwtToFlagProperties } from './get';
 
 /**

packages/lib/server-only/feature-flags/get.ts

@@ -7,7 +7,11 @@ import { getToken } from 'next-auth/jwt';
 import { LOCAL_FEATURE_FLAGS, extractPostHogConfig } from '@documenso/lib/constants/feature-flags';
 import PostHogServerClient from '@documenso/lib/server-only/feature-flags/get-post-hog-server-client';
 
-import { NEXT_PUBLIC_MARKETING_URL, NEXT_PUBLIC_WEBAPP_URL, NEXT_PRIVATE_INTERNAL_WEBAPP_URL } from '../../constants/app';
+import {
+  NEXT_PRIVATE_INTERNAL_WEBAPP_URL,
+  NEXT_PUBLIC_MARKETING_URL,
+  NEXT_PUBLIC_WEBAPP_URL,
+} from '../../constants/app';
 
 /**
  * Evaluate a single feature flag based on the current user if possible.
@@ -67,7 +71,7 @@ export default async function handleFeatureFlagGet(req: Request) {
     if (origin.startsWith(NEXT_PUBLIC_MARKETING_URL() ?? 'http://localhost:3001')) {
       res.headers.set('Access-Control-Allow-Origin', origin);
     }
-    
+
     if (origin.startsWith(NEXT_PRIVATE_INTERNAL_WEBAPP_URL ?? 'http://localhost:3000')) {
       res.headers.set('Access-Control-Allow-Origin', origin);
     }

packages/lib/server-only/field/set-fields-for-template.ts

@@ -107,7 +107,10 @@ export const setFieldsForTemplate = async ({
         }
       }
 
-      if (field.type === FieldType.CHECKBOX && field.fieldMeta) {
+      if (field.type === FieldType.CHECKBOX) {
+        if (!field.fieldMeta) {
+          throw new Error('Checkbox field is missing required metadata');
+        }
         const checkboxFieldParsedMeta = ZCheckboxFieldMeta.parse(field.fieldMeta);
         const errors = validateCheckboxField(
           checkboxFieldParsedMeta?.values?.map((item) => item.value) ?? [],
@@ -118,7 +121,10 @@ export const setFieldsForTemplate = async ({
         }
       }
 
-      if (field.type === FieldType.RADIO && field.fieldMeta) {
+      if (field.type === FieldType.RADIO) {
+        if (!field.fieldMeta) {
+          throw new Error('Radio field is missing required metadata');
+        }
         const radioFieldParsedMeta = ZRadioFieldMeta.parse(field.fieldMeta);
         const checkedRadioFieldValue = radioFieldParsedMeta.values?.find(
           (option) => option.checked,
@@ -129,7 +135,10 @@ export const setFieldsForTemplate = async ({
         }
       }
 
-      if (field.type === FieldType.DROPDOWN && field.fieldMeta) {
+      if (field.type === FieldType.DROPDOWN) {
+        if (!field.fieldMeta) {
+          throw new Error('Dropdown field is missing required metadata');
+        }
         const dropdownFieldParsedMeta = ZDropdownFieldMeta.parse(field.fieldMeta);
         const errors = validateDropdownField(undefined, dropdownFieldParsedMeta);
         if (errors.length > 0) {

packages/lib/server-only/headers/get-locale.tsx

@@ -1,11 +0,0 @@
-import { headers } from 'next/headers';
-
-export const getLocale = () => {
-  const headerItems = headers();
-
-  const locales = headerItems.get('accept-language') ?? 'en-US';
-
-  const [locale] = locales.split(',');
-
-  return locale;
-};

packages/lib/server-only/i18n/switch-i18n-language.ts

@@ -4,5 +4,5 @@ import { cookies } from 'next/headers';
 
 // eslint-disable-next-line @typescript-eslint/require-await
 export const switchI18NLanguage = async (lang: string) => {
-  cookies().set('i18n', lang);
+  cookies().set('language', lang);
 };

packages/lib/server-only/recipient/delete-recipient-from-template.ts

@@ -0,0 +1,54 @@
+import { prisma } from '@documenso/prisma';
+import { SendStatus } from '@documenso/prisma/client';
+
+export type DeleteRecipientForTemplateOptions = {
+  templateId: number;
+  recipientId: number;
+  userId: number;
+  teamId?: number;
+};
+
+export const deleteRecipientFromTemplate = async ({
+  templateId,
+  recipientId,
+  userId,
+  teamId,
+}: DeleteRecipientForTemplateOptions) => {
+  const recipient = await prisma.recipient.findFirst({
+    where: {
+      id: recipientId,
+      Template: {
+        id: templateId,
+        ...(teamId
+          ? {
+              team: {
+                id: teamId,
+                members: {
+                  some: {
+                    userId,
+                  },
+                },
+              },
+            }
+          : {
+              userId,
+              teamId: null,
+            }),
+      },
+    },
+  });
+
+  if (!recipient) {
+    throw new Error('Recipient not found');
+  }
+
+  if (recipient.sendStatus !== SendStatus.NOT_SENT) {
+    throw new Error('Can not delete a recipient that has already been sent a document');
+  }
+
+  return await prisma.recipient.delete({
+    where: {
+      id: recipient.id,
+    },
+  });
+};

packages/lib/server-only/recipient/update-recipient.ts

@@ -1,9 +1,16 @@
+import { isUserEnterprise } from '@documenso/ee/server-only/util/is-document-enterprise';
 import { prisma } from '@documenso/prisma';
 import type { RecipientRole, Team } from '@documenso/prisma/client';
 
+import { AppError, AppErrorCode } from '../../errors/app-error';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '../../types/document-audit-logs';
+import {
+  type TRecipientActionAuthTypes,
+  ZRecipientAuthOptionsSchema,
+} from '../../types/document-auth';
 import type { RequestMetadata } from '../../universal/extract-request-metadata';
 import { createDocumentAuditLogData, diffRecipientChanges } from '../../utils/document-audit-logs';
+import { createRecipientAuthOptions } from '../../utils/document-auth';
 
 export type UpdateRecipientOptions = {
   documentId: number;
@@ -11,6 +18,7 @@ export type UpdateRecipientOptions = {
   email?: string;
   name?: string;
   role?: RecipientRole;
+  actionAuth?: TRecipientActionAuthTypes | null;
   userId: number;
   teamId?: number;
   requestMetadata?: RequestMetadata;
@@ -22,6 +30,7 @@ export const updateRecipient = async ({
   email,
   name,
   role,
+  actionAuth,
   userId,
   teamId,
   requestMetadata,
@@ -48,6 +57,9 @@ export const updateRecipient = async ({
             }),
       },
     },
+    include: {
+      Document: true,
+    },
   });
 
   let team: Team | null = null;
@@ -75,6 +87,22 @@ export const updateRecipient = async ({
     throw new Error('Recipient not found');
   }
 
+  if (actionAuth) {
+    const isDocumentEnterprise = await isUserEnterprise({
+      userId,
+      teamId,
+    });
+
+    if (!isDocumentEnterprise) {
+      throw new AppError(
+        AppErrorCode.UNAUTHORIZED,
+        'You do not have permission to set the action auth',
+      );
+    }
+  }
+
+  const recipientAuthOptions = ZRecipientAuthOptionsSchema.parse(recipient.authOptions);
+
   const updatedRecipient = await prisma.$transaction(async (tx) => {
     const persisted = await prisma.recipient.update({
       where: {
@@ -84,6 +112,10 @@ export const updateRecipient = async ({
         email: email?.toLowerCase() ?? recipient.email,
         name: name ?? recipient.name,
         role: role ?? recipient.role,
+        authOptions: createRecipientAuthOptions({
+          accessAuth: recipientAuthOptions.accessAuth,
+          actionAuth: actionAuth ?? null,
+        }),
       },
     });
 

packages/lib/translations/de/common.po

@@ -1,12 +1,12 @@
 msgid ""
 msgstr ""
-"POT-Creation-Date: 2024-07-24 13:01+1000\n"
+"POT-Creation-Date: 2024-08-22 05:16+0000\n"
 "MIME-Version: 1.0\n"
-"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "X-Generator: @lingui/cli\n"
 "Language: de\n"
-"Project-Id-Version: documenso-app\n"
+"Project-Id-Version: \n"
 "Report-Msgid-Bugs-To: \n"
 "PO-Revision-Date: 2024-09-05 06:04\n"
 "Last-Translator: \n"
@@ -82,19 +82,19 @@ msgstr "Weitere Option hinzufügen"
 msgid "Add another value"
 msgstr "Weiteren Wert hinzufügen"
 
-#: packages/ui/primitives/document-flow/add-signers.tsx:359
+#: packages/ui/primitives/document-flow/add-signers.tsx:459
 msgid "Add myself"
 msgstr "Mich selbst hinzufügen"
 
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:369
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:450
 msgid "Add Myself"
 msgstr "Mich hinzufügen"
 
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:355
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:436
 msgid "Add Placeholder Recipient"
 msgstr "Platzhalterempfänger hinzufügen"
 
-#: packages/ui/primitives/document-flow/add-signers.tsx:348
+#: packages/ui/primitives/document-flow/add-signers.tsx:448
 msgid "Add Signer"
 msgstr "Unterzeichner hinzufügen"
 
@@ -116,7 +116,7 @@ msgid "Advanced Options"
 msgstr "Erweiterte Optionen"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:510
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:370
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:402
 msgid "Advanced settings"
 msgstr "Erweiterte Einstellungen"
 
@@ -148,14 +148,14 @@ msgstr ""
 msgid "Blue"
 msgstr ""
 
-#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:297
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:287
 #: packages/ui/primitives/document-flow/send-document-action-dialog.tsx:58
 msgid "Cancel"
 msgstr "Abbrechen"
 
 #: packages/ui/primitives/document-flow/add-signers.tsx:164
-msgid "Cannot remove signer"
-msgstr "Unterzeichner kann nicht entfernt werden"
+#~ msgid "Cannot remove signer"
+#~ msgstr "Unterzeichner kann nicht entfernt werden"
 
 #: packages/lib/constants/recipient-roles.ts:17
 msgid "Cc"
@@ -175,7 +175,7 @@ msgid "Character Limit"
 msgstr "Zeichenbeschränkung"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:932
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:756
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:788
 msgid "Checkbox"
 msgstr "Checkbox"
 
@@ -204,7 +204,7 @@ msgid "Configure Direct Recipient"
 msgstr "Direkten Empfänger konfigurieren"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:511
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:371
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:403
 msgid "Configure the {0} field"
 msgstr "Konfigurieren Sie das Feld {0}"
 
@@ -221,7 +221,7 @@ msgid "Custom Text"
 msgstr "Benutzerdefinierter Text"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:828
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:652
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:684
 msgid "Date"
 msgstr "Datum"
 
@@ -230,7 +230,7 @@ msgstr "Datum"
 msgid "Date Format"
 msgstr "Datumsformat"
 
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:312
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:393
 msgid "Direct link receiver"
 msgstr "Empfänger des direkten Links"
 
@@ -253,7 +253,7 @@ msgid "Drag & drop your PDF here."
 msgstr "Ziehen Sie Ihr PDF hierher."
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:958
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:782
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:814
 msgid "Dropdown"
 msgstr "Dropdown"
 
@@ -263,11 +263,11 @@ msgstr "Dropdown-Optionen"
 
 #: 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:600
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:210
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:217
+#: packages/ui/primitives/document-flow/add-signers.tsx:330
+#: packages/ui/primitives/document-flow/add-signers.tsx:337
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:632
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:296
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:303
 msgid "Email"
 msgstr "E-Mail"
 
@@ -283,7 +283,7 @@ msgstr "Direktlink-Signierung aktivieren"
 msgid "Enter password"
 msgstr "Passwort eingeben"
 
-#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:226
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:216
 msgid "Error"
 msgstr "Fehler"
 
@@ -292,7 +292,7 @@ msgstr "Fehler"
 msgid "External ID"
 msgstr "Externe ID"
 
-#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:227
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:217
 msgid "Failed to save settings."
 msgstr "Einstellungen konnten nicht gespeichert werden."
 
@@ -378,10 +378,10 @@ 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:626
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:245
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:251
+#: packages/ui/primitives/document-flow/add-signers.tsx:364
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:658
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:327
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:333
 msgid "Name"
 msgstr "Name"
 
@@ -398,12 +398,12 @@ msgid "Needs to view"
 msgstr "Muss sehen"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:613
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:465
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:497
 msgid "No recipient matching this description was found."
 msgstr "Kein passender Empfänger mit dieser Beschreibung gefunden."
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:629
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:481
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:513
 msgid "No recipients with this role"
 msgstr "Keine Empfänger mit dieser Rolle"
 
@@ -428,7 +428,7 @@ msgid "No value found."
 msgstr "Kein Wert gefunden."
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:880
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:704
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:736
 msgid "Number"
 msgstr "Nummer"
 
@@ -463,7 +463,7 @@ msgid "Placeholder"
 msgstr "Platzhalter"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:906
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:730
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:762
 msgid "Radio"
 msgstr "Radio"
 
@@ -514,14 +514,18 @@ msgstr "Pflichtfeld"
 msgid "Rows per page"
 msgstr "Zeilen pro Seite"
 
-#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:296
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:286
 msgid "Save"
 msgstr "Speichern"
 
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:798
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:848
 msgid "Save Template"
 msgstr "Vorlage speichern"
 
+#: packages/ui/components/common/language-switcher-dialog.tsx:34
+msgid "Search languages..."
+msgstr "Sprachen suchen..."
+
 #: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:105
 msgid "Select"
 msgstr "Auswählen"
@@ -556,8 +560,8 @@ msgstr "Unterschriftenkarte teilen"
 msgid "Share the Link"
 msgstr "Link teilen"
 
-#: packages/ui/primitives/document-flow/add-signers.tsx:377
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:387
+#: packages/ui/primitives/document-flow/add-signers.tsx:477
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:468
 msgid "Show advanced settings"
 msgstr "Erweiterte Einstellungen anzeigen"
 
@@ -568,7 +572,7 @@ msgstr "Unterschreiben"
 #: 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:548
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:580
 msgid "Signature"
 msgstr "Unterschrift"
 
@@ -614,7 +618,7 @@ msgid "Template title"
 msgstr "Vorlagentitel"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:854
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:678
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:710
 msgid "Text"
 msgstr "Text"
 
@@ -682,13 +686,13 @@ msgstr "Dieses Dokument wurde bereits an diesen Empfänger gesendet. Sie können
 msgid "This document is password protected. Please enter the password to view the document."
 msgstr "Dieses Dokument ist durch ein Passwort geschützt. Bitte geben Sie das Passwort ein, um das Dokument anzusehen."
 
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:315
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:396
 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 "Dieses Feld kann nicht geändert oder gelöscht werden. Wenn Sie den direkten Link dieser Vorlage teilen oder zu Ihrem öffentlichen Profil hinzufügen, kann jeder, der darauf zugreift, seinen Namen und seine E-Mail-Adresse eingeben und die ihm zugewiesenen Felder ausfüllen."
 
 #: packages/ui/primitives/document-flow/add-signers.tsx:165
-msgid "This signer has already received the document."
-msgstr "Dieser Unterzeichner hat das Dokument bereits erhalten."
+#~ msgid "This signer has already received the document."
+#~ msgstr "Dieser Unterzeichner hat das Dokument bereits erhalten."
 
 #: packages/ui/components/recipient/recipient-action-auth-select.tsx:48
 msgid "This will override any global settings."
@@ -704,6 +708,7 @@ msgid "Title"
 msgstr "Titel"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:971
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:828
 msgid "To proceed further, please set at least one value for the {0} field."
 msgstr "Um fortzufahren, legen Sie bitte mindestens einen Wert für das Feld {0} fest."
 

packages/lib/translations/de/marketing.po

@@ -1,38 +1,33 @@
 msgid ""
 msgstr ""
-"POT-Creation-Date: 2024-07-24 13:01+1000\n"
+"POT-Creation-Date: 2024-08-22 05:16+0000\n"
 "MIME-Version: 1.0\n"
-"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "X-Generator: @lingui/cli\n"
 "Language: de\n"
-"Project-Id-Version: documenso-app\n"
+"Project-Id-Version: \n"
 "Report-Msgid-Bugs-To: \n"
 "PO-Revision-Date: 2024-09-05 06:04\n"
 "Last-Translator: \n"
-"Language-Team: German\n"
-"Plural-Forms: nplurals=2; plural=(n != 1);\n"
-"X-Crowdin-Project: documenso-app\n"
-"X-Crowdin-Project-ID: 694691\n"
-"X-Crowdin-Language: de\n"
-"X-Crowdin-File: marketing.po\n"
-"X-Crowdin-File-ID: 6\n"
+"Language-Team: \n"
+"Plural-Forms: \n"
 
 #: apps/marketing/src/app/(marketing)/blog/page.tsx:45
 msgid "{0}"
-msgstr "{0}"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:100
 msgid "5 standard documents per month"
-msgstr "5 Standarddokumente pro Monat"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:198
 msgid "5 Users Included"
-msgstr "5 Benutzer inbegriffen"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/faster-smarter-beautiful-bento.tsx:34
 msgid "A 10x better signing experience."
-msgstr "Eine 10x bessere Signaturerfahrung."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:51
 msgid "Add document"
@@ -40,142 +35,138 @@ msgstr "Dokument hinzufügen"
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:201
 msgid "Add More Users for {0}"
-msgstr "Mehr Benutzer hinzufügen für {0}"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:165
 msgid "All our metrics, finances, and learnings are public. We believe in transparency and want to share our journey with you. You can read more about why here: <0>Announcing Open Metrics</0>"
-msgstr "Alle unsere Kennzahlen, Finanzen und Erkenntnisse sind öffentlich. Wir glauben an Transparenz und möchten unsere Reise mit Ihnen teilen. Mehr erfahren Sie hier: <0>Ankündigung Offene Kennzahlen</0>"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/funding-raised.tsx:58
 #: apps/marketing/src/app/(marketing)/open/funding-raised.tsx:65
 msgid "Amount Raised"
-msgstr "Erhobener Betrag"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:145
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:189
 msgid "API Access"
-msgstr "API-Zugriff"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/faster-smarter-beautiful-bento.tsx:67
 msgid "Beautiful."
-msgstr "Schön."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/faster-smarter-beautiful-bento.tsx:69
 msgid "Because signing should be celebrated. That’s why we care about the smallest detail in our product."
-msgstr "Weil Unterschriften gefeiert werden sollten. Deshalb kümmern wir uns um jedes kleinste Detail in unserem Produkt."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:35
 #: apps/marketing/src/components/(marketing)/header.tsx:57
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:36
 msgid "Blog"
-msgstr "Blog"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/open-build-template-bento.tsx:64
 msgid "Build on top."
-msgstr "Aufbauen oben drauf."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:163
 msgid "Can I use Documenso commercially?"
-msgstr "Kann ich Documenso kommerziell nutzen?"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:42
 msgid "Careers"
-msgstr "Karrieren"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:36
 msgid "Changelog"
-msgstr "Änderungsprotokoll"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/open-build-template-bento.tsx:85
 msgid "Choose a template from the community app store. Or submit your own template for others to use."
-msgstr "Wählen Sie eine Vorlage aus dem Community-App-Store. Oder reichen Sie Ihre eigene Vorlage ein, damit andere sie benutzen können."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:219
 msgid "Community"
-msgstr "Gemeinschaft"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/monthly-completed-documents-chart.tsx:55
 msgid "Completed Documents"
-msgstr "Fertige Dokumente"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/monthly-completed-documents-chart.tsx:33
 msgid "Completed Documents per Month"
-msgstr "Fertige Dokumente pro Monat"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:65
 msgid "Connections"
-msgstr "Verbindungen"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/enterprise.tsx:35
 msgid "Contact Us"
-msgstr "Kontaktiere uns"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:67
 msgid "Create connections and automations with Zapier and more to integrate with your favorite tools."
-msgstr "Erstellen Sie Verbindungen und Automatisierungen mit Zapier und mehr, um sich mit Ihren Lieblingstools zu integrieren."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/call-to-action.tsx:23
 msgid "Create your account and start using state-of-the-art document signing. Open and beautiful signing is within your grasp."
-msgstr "Erstellen Sie Ihr Konto und beginnen Sie mit der Nutzung modernster Dokumentensignaturen. Offene und schöne Signaturen sind zum Greifen nah."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/tooltip.tsx:35
 msgid "Customers with an Active Subscriptions."
-msgstr "Kunden mit einer aktiven Abonnements."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/open-build-template-bento.tsx:33
 msgid "Customise and expand."
-msgstr "Anpassen und erweitern."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:38
 msgid "Design"
-msgstr "Design"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:44
 msgid "Designed for every stage of your journey."
-msgstr "Entwickelt für jede Phase Ihrer Reise."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/carousel.tsx:40
 msgid "Direct Link"
-msgstr "Direktlink"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:181
 msgid "Documenso is a community effort to create an open and vibrant ecosystem around a tool, everybody is free to use and adapt. By being truly open we want to create trusted infrastructure for the future of the internet."
-msgstr "Documenso ist eine Gemeinschaftsanstrengung, um ein offenes und lebendiges Ökosystem um ein Werkzeug zu schaffen, das jeder frei nutzen und anpassen kann. Indem wir wirklich offen sind, wollen wir vertrauenswürdige Infrastruktur für die Zukunft des Internets schaffen."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/typefully.tsx:28
 msgid "Documenso on X"
-msgstr "Documenso auf X"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/hero.tsx:104
 msgid "Document signing,<0/>finally open source."
-msgstr "Unterschriften,<0/>endlich Open Source."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:33
 #: apps/marketing/src/components/(marketing)/header.tsx:50
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:28
 msgid "Documentation"
-msgstr "Dokumentation"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:110
 msgid "Easily embed Documenso into your product. Simply copy and paste our react widget into your application."
-msgstr "Betten Sie Documenso ganz einfach in Ihr Produkt ein. Kopieren und fügen Sie einfach unser React-Widget in Ihre Anwendung ein."
-
-#: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:42
-#~ msgid "Easy Sharing (Soon)."
-#~ msgstr "Easy Sharing (Soon)."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:46
 msgid "Easy Sharing."
-msgstr "Einfaches Teilen."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:148
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:192
 msgid "Email and Discord Support"
-msgstr "E-Mail- und Discord-Support"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/team-members.tsx:43
 msgid "Engagement"
-msgstr "Beteiligung"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:64
 msgid "Enter your details."
@@ -183,43 +174,43 @@ msgstr "Geben Sie Ihre Details ein."
 
 #: apps/marketing/src/components/(marketing)/enterprise.tsx:16
 msgid "Enterprise Compliance, License or Technical Needs?"
-msgstr "Enterprise-Konformität, Lizenz- oder technische Bedürfnisse?"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:128
 msgid "Everything you need for a great signing experience."
-msgstr "Alles, was Sie für ein großartiges Signaturerlebnis benötigen."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/faster-smarter-beautiful-bento.tsx:45
 msgid "Fast."
-msgstr "Schnell."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/faster-smarter-beautiful-bento.tsx:36
 msgid "Faster, smarter and more beautiful."
-msgstr "Schneller, intelligenter und schöner."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:210
 msgid "Finances"
-msgstr "Finanzen"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/typefully.tsx:38
 msgid "Follow us on X"
-msgstr "Folgen Sie uns auf X"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:172
 msgid "For companies looking to scale across multiple teams."
-msgstr "Für Unternehmen, die über mehrere Teams skalieren möchten."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:85
 msgid "For small teams and individuals with basic needs."
-msgstr "Für kleine Teams und Einzelpersonen mit grundlegenden Bedürfnissen."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:80
 msgid "Free"
-msgstr "Kostenlos"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/blog/page.tsx:26
 msgid "From the blog"
-msgstr "Aus dem Blog"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/data.ts:9
 #: apps/marketing/src/app/(marketing)/open/data.ts:17
@@ -227,227 +218,222 @@ msgstr "Aus dem Blog"
 #: apps/marketing/src/app/(marketing)/open/data.ts:41
 #: apps/marketing/src/app/(marketing)/open/data.ts:49
 msgid "Full-Time"
-msgstr "Vollzeit"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:87
 msgid "Get paid (Soon)."
-msgstr "Lassen Sie sich bezahlen (Bald)."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/call-to-action.tsx:31
 msgid "Get started"
-msgstr "Loslegen"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:75
 msgid "Get Started"
-msgstr "Loslegen"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:47
 msgid "Get started today."
-msgstr "Fangen Sie heute an."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/blog/page.tsx:30
 msgid "Get the latest news from Documenso, including product updates, team announcements and more!"
-msgstr "Erhalten Sie die neuesten Nachrichten von Documenso, einschließlich Produkt-Updates, Team-Ankündigungen und mehr!"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:233
 msgid "GitHub: Total Merged PRs"
-msgstr "GitHub: Gesamte PRs zusammengeführt"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:251
 msgid "GitHub: Total Open Issues"
-msgstr "GitHub: Gesamte offene Issues"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:225
 msgid "GitHub: Total Stars"
-msgstr "GitHub: Gesamtanzahl Sterne"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/salary-bands.tsx:23
 msgid "Global Salary Bands"
-msgstr "Globale Gehaltsbänder"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:261
 msgid "Growth"
-msgstr "Wachstum"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:134
 msgid "How can I contribute?"
-msgstr "Wie kann ich beitragen?"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:105
 msgid "How do you handle my data?"
-msgstr "Wie gehen Sie mit meinen Daten um?"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:118
 msgid "Individual"
-msgstr "Einzelperson"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:89
 msgid "Integrated payments with Stripe so you don’t have to worry about getting paid."
-msgstr "Integrierte Zahlungen mit Stripe, sodass Sie sich keine Sorgen ums Bezahlen machen müssen."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:35
 msgid "Integrates with all your favourite tools."
-msgstr "Integriert sich mit all Ihren Lieblingstools."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:289
 msgid "Is there more?"
-msgstr "Gibt es mehr?"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/open-build-template-bento.tsx:44
 msgid "It’s up to you. Either clone our repository or rely on our easy to use hosting solution."
-msgstr "Es liegt an Ihnen. Entweder klonen Sie unser Repository oder nutzen unsere einfach zu bedienende Hosting-Lösung."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/team-members.tsx:49
 msgid "Join Date"
-msgstr "Eintrittsdatum"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/call-to-action.tsx:19
 msgid "Join the Open Signing Movement"
-msgstr "Treten Sie der Open Signing-Bewegung bei"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/team-members.tsx:46
 msgid "Location"
-msgstr "Standort"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/open-build-template-bento.tsx:66
 msgid "Make it your own through advanced customization and adjustability."
-msgstr "Machen Sie es zu Ihrem eigenen durch erweiterte Anpassung und Einstellbarkeit."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:199
 msgid "Merged PR's"
-msgstr "Zusammengeführte PRs"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:234
 msgid "Merged PRs"
-msgstr "Zusammengeführte PRs"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:40
 msgid "Monthly"
-msgstr "Monatlich"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/team-members.tsx:34
 msgid "Name"
-msgstr "Name"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/monthly-new-users-chart.tsx:30
 #: apps/marketing/src/app/(marketing)/open/monthly-new-users-chart.tsx:43
 #: apps/marketing/src/app/(marketing)/open/monthly-new-users-chart.tsx:52
 msgid "New Users"
-msgstr "Neue Benutzer"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:106
 msgid "No credit card required"
-msgstr "Keine Kreditkarte erforderlich"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/callout.tsx:29
 #: apps/marketing/src/components/(marketing)/hero.tsx:125
 msgid "No Credit Card required"
-msgstr "Keine Kreditkarte erforderlich"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:61
 msgid "None of these work for you? Try self-hosting!"
-msgstr "Keines dieser Angebote passt zu Ihnen? Versuchen Sie das Selbst-Hosting!"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:194
 #: apps/marketing/src/app/(marketing)/open/page.tsx:252
 msgid "Open Issues"
-msgstr "Offene Issues"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/open-build-template-bento.tsx:42
 msgid "Open Source or Hosted."
-msgstr "Open Source oder Hosted."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:161
 #: apps/marketing/src/components/(marketing)/footer.tsx:37
 #: apps/marketing/src/components/(marketing)/header.tsx:64
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:40
 msgid "Open Startup"
-msgstr "Offenes Startup"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:41
 msgid "OSS Friends"
-msgstr "OSS-Freunde"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/faster-smarter-beautiful-bento.tsx:91
 msgid "Our custom templates come with smart rules that can help you save time and energy."
-msgstr "Unsere benutzerdefinierten Vorlagen verfügen über intelligente Regeln, die Ihnen Zeit und Energie sparen können."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/enterprise.tsx:20
 msgid "Our Enterprise License is great for large organizations looking to switch to Documenso for all their signing needs. It's available for our cloud offering as well as self-hosted setups and offers a wide range of compliance and Adminstration Features."
-msgstr "Unsere Enterprise-Lizenz ist ideal für große Organisationen, die auf Documenso für all ihre Signaturanforderungen umsteigen möchten. Sie ist sowohl für unser Cloud-Angebot als auch für selbstgehostete Setups verfügbar und bietet eine breite Palette an Compliance- und Verwaltungsfunktionen."
-
-#: apps/marketing/src/components/(marketing)/enterprise.tsx:20
-#~ msgid "Our Enterprise License is great large organizations looking to switch to Documenso for all their signing needs. It's availible for our cloud offering as well as self-hosted setups and offer a wide range of compliance and Adminstration Features."
-#~ msgstr "Our Enterprise License is great large organizations looking to switch to Documenso for all their signing needs. It's availible for our cloud offering as well as self-hosted setups and offer a wide range of compliance and Adminstration Features."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:65
 msgid "Our self-hosted option is great for small teams and individuals who need a simple solution. You can use our docker based setup to get started in minutes. Take control with full customizability and data ownership."
-msgstr "Unsere selbstgehostete Option ist ideal für kleine Teams und Einzelpersonen, die eine einfache Lösung benötigen. Sie können unser docker-basiertes Setup verwenden, um in wenigen Minuten loszulegen. Übernehmen Sie die Kontrolle mit vollständiger Anpassbarkeit und Datenhoheit."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/data.ts:25
 msgid "Part-Time"
-msgstr "Teilzeit"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:151
 msgid "Premium Profile Name"
-msgstr "Premium Profilname"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:40
 #: apps/marketing/src/components/(marketing)/footer.tsx:31
 #: apps/marketing/src/components/(marketing)/header.tsx:42
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:24
 msgid "Pricing"
-msgstr "Preise"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:43
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:53
 msgid "Privacy"
-msgstr "Datenschutz"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/carousel.tsx:58
 msgid "Profile"
-msgstr "Profil"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:108
 msgid "React Widget (Soon)."
-msgstr "React Widget (Demnächst)."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:48
 msgid "Receive your personal link to share with everyone you care about."
-msgstr "Erhalten Sie Ihren persönlichen Link zum Teilen mit allen, die Ihnen wichtig sind."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/team-members.tsx:37
 msgid "Role"
-msgstr "Rolle"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/salary-bands.tsx:37
 #: apps/marketing/src/app/(marketing)/open/team-members.tsx:40
 msgid "Salary"
-msgstr "Gehalt"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:62
 msgid "Save $60 or $120"
-msgstr "Sparen Sie $60 oder $120"
+msgstr ""
 
-#: apps/marketing/src/components/(marketing)/i18n-switcher.tsx:47
-msgid "Search languages..."
-msgstr "Sprachen suchen..."
+#~ msgid "Search languages..."
+#~ msgstr "Sprachen suchen...>>>>>>> main"
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:109
 msgid "Securely. Our data centers are located in Frankfurt (Germany), giving us the best local privacy laws. We are very aware of the sensitive nature of our data and follow best practices to ensure the security and integrity of the data entrusted to us."
-msgstr "Sicher. Unsere Rechenzentren befinden sich in Frankfurt (Deutschland) und bieten uns die besten lokalen Datenschutzgesetze. Uns ist die sensible Natur unserer Daten sehr bewusst und wir folgen bewährten Praktiken, um die Sicherheit und Integrität der uns anvertrauten Daten zu gewährleisten."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/share-connect-paid-widget-bento.tsx:37
 msgid "Send, connect, receive and embed everywhere."
-msgstr "Überall senden, verbinden, empfangen und einbetten."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/salary-bands.tsx:34
 msgid "Seniority"
-msgstr "Dienstalter"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:39
 msgid "Shop"
-msgstr "Shop"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:63
 msgid "Sign"
@@ -456,115 +442,115 @@ msgstr "Signieren"
 #: apps/marketing/src/components/(marketing)/header.tsx:72
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:61
 msgid "Sign in"
-msgstr "Anmelden"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/header.tsx:77
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:57
 msgid "Sign up"
-msgstr "Registrieren"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/carousel.tsx:22
 msgid "Signing Process"
-msgstr "Signaturprozess"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:94
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:136
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:180
 msgid "Signup Now"
-msgstr "Jetzt registrieren"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/faster-smarter-beautiful-bento.tsx:89
 msgid "Smart."
-msgstr "Intelligent."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/hero.tsx:132
 msgid "Star on GitHub"
-msgstr "Auf GitHub favorisieren"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:226
 msgid "Stars"
-msgstr "Favoriten"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:40
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:44
 msgid "Status"
-msgstr "Status"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/footer.tsx:34
 #: apps/marketing/src/components/(marketing)/mobile-navigation.tsx:48
 msgid "Support"
-msgstr "Support"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/team-members.tsx:26
 msgid "Team"
-msgstr "Team"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:195
 msgid "Team Inbox"
-msgstr "Team-Posteingang"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/carousel.tsx:28
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:162
 msgid "Teams"
-msgstr "Teams"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/open-build-template-bento.tsx:83
 msgid "Template Store (Soon)."
-msgstr "Vorlagen-Shop (Demnächst)."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:138
 msgid "That's awesome. You can take a look at the current <0>Issues</0> and join our <1>Discord Community</1> to keep up to date, on what the current priorities are. In any case, we are an open community and welcome all input, technical and non-technical ❤️"
-msgstr "Das ist großartig. Sie können sich die aktuellen <0>Issues</0> ansehen und unserer <1>Discord-Community</1> beitreten, um auf dem neuesten Stand zu bleiben, was die aktuellen Prioritäten sind. In jedem Fall sind wir eine offene Gemeinschaft und begrüßen jegliche Beiträge, technische und nicht-technische ❤️"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:293
 msgid "This page is evolving as we learn what makes a great signing company. We'll update it when we have more to share."
-msgstr "Diese Seite entwickelt sich weiter, während wir lernen, was ein großartiges Signing-Unternehmen ausmacht. Wir werden sie aktualisieren, wenn wir mehr zu teilen haben."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/salary-bands.tsx:31
 msgid "Title"
-msgstr "Titel"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/total-signed-documents-chart.tsx:30
 #: apps/marketing/src/app/(marketing)/open/total-signed-documents-chart.tsx:55
 msgid "Total Completed Documents"
-msgstr "Insgesamt Abgeschlossene Dokumente"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/page.tsx:267
 #: apps/marketing/src/app/(marketing)/open/page.tsx:268
 msgid "Total Customers"
-msgstr "Insgesamt Kunden"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/funding-raised.tsx:29
 msgid "Total Funding Raised"
-msgstr "Insgesamt Finanzierungsvolumen"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/monthly-total-users-chart.tsx:30
 #: apps/marketing/src/app/(marketing)/open/monthly-total-users-chart.tsx:43
 #: apps/marketing/src/app/(marketing)/open/monthly-total-users-chart.tsx:52
 msgid "Total Users"
-msgstr "Gesamtanzahl der Benutzer"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/open-build-template-bento.tsx:31
 msgid "Truly your own."
-msgstr "Wirklich Ihr Eigenes."
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/callout.tsx:27
 #: apps/marketing/src/components/(marketing)/hero.tsx:123
 msgid "Try our Free Plan"
-msgstr "Probieren Sie unseren Gratisplan aus"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/typefully.tsx:20
 msgid "Twitter Stats"
-msgstr "Twitter-Statistiken"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:142
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:186
 msgid "Unlimited Documents per Month"
-msgstr "Unbegrenzte Dokumente pro Monat"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:103
 msgid "Up to 10 recipients per document"
-msgstr "Bis zu 10 Empfänger pro Dokument"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/singleplayer/client.tsx:52
 msgid "Upload a document and add fields."
@@ -572,48 +558,52 @@ msgstr "Laden Sie ein Dokument hoch und fügen Sie Felder hinzu."
 
 #: 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."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/open/typefully.tsx:33
 msgid "View all stats"
-msgstr "Alle Statistiken anzeigen"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:195
 msgid "We are happy to assist you at <0>support@documenso.com</0> or <1>in our Discord-Support-Channel</1> please message either Lucas or Timur to get added to the channel if you are not already a member."
-msgstr "Wir helfen Ihnen gerne unter <0>support@documenso.com</0> oder <1>in unserem Discord-Support-Kanal</1>. Bitte senden Sie Lucas oder Timur eine Nachricht, um dem Kanal beizutreten, falls Sie noch kein Mitglied sind."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:89
 msgid "What is the difference between the plans?"
-msgstr "Was ist der Unterschied zwischen den Plänen?"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/faster-smarter-beautiful-bento.tsx:47
 msgid "When it comes to sending or receiving a contract, you can count on lightning-fast speeds."
-msgstr "Wenn es um das Senden oder Empfangen eines Vertrags geht, können Sie auf blitzschnelle Geschwindigkeiten zählen."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:191
 msgid "Where can I get support?"
-msgstr "Wo kann ich Unterstützung bekommen?"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:177
 msgid "Why should I prefer Documenso over DocuSign or some other signing tool?"
-msgstr "Warum sollte ich Documenso gegenüber DocuSign oder einem anderen Signatur-Tool bevorzugen?"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:119
 msgid "Why should I use your hosting service?"
-msgstr "Warum sollte ich Ihren Hosting-Service nutzen?"
+msgstr ""
 
 #: apps/marketing/src/components/(marketing)/pricing-table.tsx:60
 msgid "Yearly"
-msgstr "Jährlich"
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:167
 msgid "Yes! Documenso is offered under the GNU AGPL V3 open source license. This means you can use it for free and even modify it to fit your needs, as long as you publish your changes under the same license."
-msgstr "Ja! Documenso wird unter der GNU AGPL V3 Open-Source-Lizenz angeboten. Das bedeutet, dass Sie es kostenlos nutzen und sogar an Ihre Bedürfnisse anpassen können, solange Sie Ihre Änderungen unter derselben Lizenz veröffentlichen."
+msgstr ""
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:93
 msgid "You can self-host Documenso for free or use our ready-to-use hosted version. The hosted version comes with additional support, painless scalability and more. Early adopters will get access to all features we build this year, for no additional cost! Forever! Yes, that includes multiple users per account later. If you want Documenso for your enterprise, we are happy to talk about your needs."
-msgstr "Sie können Documenso kostenlos selbst hosten oder unsere sofort einsatzbereite gehostete Version nutzen. Die gehostete Version bietet zusätzlichen Support, schmerzfreie Skalierbarkeit und mehr. Frühzeitige Anwender erhalten in diesem Jahr Zugriff auf alle Funktionen, die wir entwickeln, ohne zusätzliche Kosten! Für immer! Ja, das beinhaltet später mehrere Benutzer pro Konto. Wenn Sie Documenso für Ihr Unternehmen möchten, sprechen wir gerne über Ihre Bedürfnisse."
+msgstr ""
 
 #: 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."
+msgstr ""
+
+#: apps/marketing/src/components/(marketing)/carousel.tsx:265
+#~ msgid "Your browser does not support the video tag.<<<<<<< HEAD"
+#~ msgstr "Ihr Browser unterstützt das Video-Tag nicht.>>>>>>> main"

packages/lib/translations/en/common.po

@@ -77,19 +77,19 @@ msgstr "Add another option"
 msgid "Add another value"
 msgstr "Add another value"
 
-#: packages/ui/primitives/document-flow/add-signers.tsx:359
+#: packages/ui/primitives/document-flow/add-signers.tsx:459
 msgid "Add myself"
 msgstr "Add myself"
 
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:369
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:450
 msgid "Add Myself"
 msgstr "Add Myself"
 
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:355
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:436
 msgid "Add Placeholder Recipient"
 msgstr "Add Placeholder Recipient"
 
-#: packages/ui/primitives/document-flow/add-signers.tsx:348
+#: packages/ui/primitives/document-flow/add-signers.tsx:448
 msgid "Add Signer"
 msgstr "Add Signer"
 
@@ -111,7 +111,7 @@ msgid "Advanced Options"
 msgstr "Advanced Options"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:510
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:370
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:402
 msgid "Advanced settings"
 msgstr "Advanced settings"
 
@@ -143,14 +143,14 @@ msgstr "Black"
 msgid "Blue"
 msgstr "Blue"
 
-#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:297
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:287
 #: 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"
+#~ msgid "Cannot remove signer"
+#~ msgstr "Cannot remove signer"
 
 #: packages/lib/constants/recipient-roles.ts:17
 msgid "Cc"
@@ -170,7 +170,7 @@ msgid "Character Limit"
 msgstr "Character Limit"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:932
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:756
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:788
 msgid "Checkbox"
 msgstr "Checkbox"
 
@@ -199,7 +199,7 @@ 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:371
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:403
 msgid "Configure the {0} field"
 msgstr "Configure the {0} field"
 
@@ -216,7 +216,7 @@ msgid "Custom Text"
 msgstr "Custom Text"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:828
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:652
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:684
 msgid "Date"
 msgstr "Date"
 
@@ -225,7 +225,7 @@ msgstr "Date"
 msgid "Date Format"
 msgstr "Date Format"
 
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:312
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:393
 msgid "Direct link receiver"
 msgstr "Direct link receiver"
 
@@ -248,7 +248,7 @@ 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:782
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:814
 msgid "Dropdown"
 msgstr "Dropdown"
 
@@ -258,11 +258,11 @@ 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:600
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:210
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:217
+#: packages/ui/primitives/document-flow/add-signers.tsx:330
+#: packages/ui/primitives/document-flow/add-signers.tsx:337
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:632
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:296
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:303
 msgid "Email"
 msgstr "Email"
 
@@ -278,7 +278,7 @@ msgstr "Enable Direct Link Signing"
 msgid "Enter password"
 msgstr "Enter password"
 
-#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:226
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:216
 msgid "Error"
 msgstr "Error"
 
@@ -287,7 +287,7 @@ msgstr "Error"
 msgid "External ID"
 msgstr "External ID"
 
-#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:227
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:217
 msgid "Failed to save settings."
 msgstr "Failed to save settings."
 
@@ -373,10 +373,10 @@ 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:626
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:245
-#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:251
+#: packages/ui/primitives/document-flow/add-signers.tsx:364
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:658
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:327
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:333
 msgid "Name"
 msgstr "Name"
 
@@ -393,12 +393,12 @@ 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:465
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:497
 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:481
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:513
 msgid "No recipients with this role"
 msgstr "No recipients with this role"
 
@@ -423,7 +423,7 @@ 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:704
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:736
 msgid "Number"
 msgstr "Number"
 
@@ -458,7 +458,7 @@ msgid "Placeholder"
 msgstr "Placeholder"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:906
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:730
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:762
 msgid "Radio"
 msgstr "Radio"
 
@@ -509,14 +509,18 @@ msgstr "Required field"
 msgid "Rows per page"
 msgstr "Rows per page"
 
-#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:296
+#: packages/ui/primitives/document-flow/field-item-advanced-settings.tsx:286
 msgid "Save"
 msgstr "Save"
 
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:798
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:848
 msgid "Save Template"
 msgstr "Save Template"
 
+#: packages/ui/components/common/language-switcher-dialog.tsx:34
+msgid "Search languages..."
+msgstr "Search languages..."
+
 #: packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx:105
 msgid "Select"
 msgstr "Select"
@@ -551,8 +555,8 @@ msgstr "Share Signature Card"
 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
+#: packages/ui/primitives/document-flow/add-signers.tsx:477
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:468
 msgid "Show advanced settings"
 msgstr "Show advanced settings"
 
@@ -563,7 +567,7 @@ 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:548
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:580
 msgid "Signature"
 msgstr "Signature"
 
@@ -609,7 +613,7 @@ msgid "Template title"
 msgstr "Template title"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:854
-#: packages/ui/primitives/template-flow/add-template-fields.tsx:678
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:710
 msgid "Text"
 msgstr "Text"
 
@@ -677,13 +681,13 @@ msgstr "This document has already been sent to this recipient. You can no longer
 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
+#: packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx:396
 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."
+#~ 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."
@@ -699,6 +703,7 @@ msgid "Title"
 msgstr "Title"
 
 #: packages/ui/primitives/document-flow/add-fields.tsx:971
+#: packages/ui/primitives/template-flow/add-template-fields.tsx:828
 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/lib/translations/en/marketing.po

@@ -425,8 +425,8 @@ msgid "Save $60 or $120"
 msgstr "Save $60 or $120"
 
 #: apps/marketing/src/components/(marketing)/i18n-switcher.tsx:47
-msgid "Search languages..."
-msgstr "Search languages..."
+#~ msgid "Search languages..."
+#~ msgstr "Search languages..."
 
 #: apps/marketing/src/app/(marketing)/pricing/page.tsx:109
 msgid "Securely. Our data centers are located in Frankfurt (Germany), giving us the best local privacy laws. We are very aware of the sensitive nature of our data and follow best practices to ensure the security and integrity of the data entrusted to us."

packages/lib/utils/i18n.ts

@@ -2,8 +2,8 @@ import type { ReadonlyRequestCookies } from 'next/dist/server/web/spec-extension
 
 import type { I18n } from '@lingui/core';
 
-import { IS_APP_WEB } from '../constants/app';
-import type { SupportedLanguageCodes } from '../constants/i18n';
+import { IS_APP_WEB, IS_APP_WEB_I18N_ENABLED } from '../constants/app';
+import type { I18nLocaleData, SupportedLanguageCodes } from '../constants/i18n';
 import { APP_I18N_OPTIONS } from '../constants/i18n';
 
 export async function dynamicActivate(i18nInstance: I18n, locale: string) {
@@ -14,48 +14,58 @@ export async function dynamicActivate(i18nInstance: I18n, locale: string) {
   i18nInstance.loadAndActivate({ locale, messages });
 }
 
-/**
- * Extract the language if supported from the cookies header.
- *
- * Returns `null` if not supported or not found.
- */
-export const extractSupportedLanguageFromCookies = (
-  cookies: ReadonlyRequestCookies,
-): SupportedLanguageCodes | null => {
-  const preferredLanguage = cookies.get('i18n');
-
-  const foundSupportedLanguage = APP_I18N_OPTIONS.supportedLangs.find(
-    (lang): lang is SupportedLanguageCodes => lang === preferredLanguage?.value,
-  );
-
-  return foundSupportedLanguage || null;
-};
-
-/**
- * Extracts the language from the `accept-language` header.
- *
- * Returns `null` if not supported or not found.
- */
-export const extractSupportedLanguageFromHeaders = (
-  headers: Headers,
-): SupportedLanguageCodes | null => {
-  const locales = headers.get('accept-language') ?? '';
-
-  const [locale] = locales.split(',');
-
-  // Convert locale to language.
-  const [language] = locale.split('-');
+const parseLanguageFromLocale = (locale: string): SupportedLanguageCodes | null => {
+  const [language, _country] = locale.split('-');
 
   const foundSupportedLanguage = APP_I18N_OPTIONS.supportedLangs.find(
     (lang): lang is SupportedLanguageCodes => lang === language,
   );
 
-  return foundSupportedLanguage || null;
+  if (!foundSupportedLanguage) {
+    return null;
+  }
+
+  return foundSupportedLanguage;
 };
 
-type ExtractSupportedLanguageOptions = {
-  headers?: Headers;
-  cookies?: ReadonlyRequestCookies;
+/**
+ * Extract the language if supported from the cookies header.
+ *
+ * Returns `null` if not supported or not found.
+ */
+export const extractLocaleDataFromCookies = (
+  cookies: ReadonlyRequestCookies,
+): SupportedLanguageCodes | null => {
+  const preferredLocale = cookies.get('language')?.value || '';
+
+  const language = parseLanguageFromLocale(preferredLocale || '');
+
+  if (!language) {
+    return null;
+  }
+
+  return language;
+};
+
+/**
+ * Extracts the language from the `accept-language` header.
+ */
+export const extractLocaleDataFromHeaders = (
+  headers: Headers,
+): { lang: SupportedLanguageCodes | null; locales: string[] } => {
+  const headerLocales = (headers.get('accept-language') ?? '').split(',');
+
+  const language = parseLanguageFromLocale(headerLocales[0]);
+
+  return {
+    lang: language,
+    locales: [headerLocales[0]],
+  };
+};
+
+type ExtractLocaleDataOptions = {
+  headers: Headers;
+  cookies: ReadonlyRequestCookies;
 };
 
 /**
@@ -63,25 +73,25 @@ type ExtractSupportedLanguageOptions = {
  *
  * Will return the default fallback language if not found.
  */
-export const extractSupportedLanguage = ({
+export const extractLocaleData = ({
   headers,
   cookies,
-}: ExtractSupportedLanguageOptions): SupportedLanguageCodes => {
-  if (cookies) {
-    const langCookie = extractSupportedLanguageFromCookies(cookies);
+}: ExtractLocaleDataOptions): I18nLocaleData => {
+  let lang: SupportedLanguageCodes | null = extractLocaleDataFromCookies(cookies);
 
-    if (langCookie) {
-      return langCookie;
-    }
+  const langHeader = extractLocaleDataFromHeaders(headers);
+
+  if (!lang && langHeader?.lang) {
+    lang = langHeader.lang;
   }
 
-  if (headers) {
-    const langHeader = extractSupportedLanguageFromHeaders(headers);
-
-    if (langHeader) {
-      return langHeader;
-    }
+  // Override web app to be English.
+  if (!IS_APP_WEB_I18N_ENABLED && IS_APP_WEB) {
+    lang = 'en';
   }
 
-  return APP_I18N_OPTIONS.sourceLang;
+  return {
+    lang: lang || APP_I18N_OPTIONS.sourceLang,
+    locales: langHeader.locales,
+  };
 };

packages/trpc/server/recipient-router/router.ts

@@ -1,6 +1,8 @@
 import { TRPCError } from '@trpc/server';
 
 import { completeDocumentWithToken } from '@documenso/lib/server-only/document/complete-document-with-token';
+import { deleteRecipient } from '@documenso/lib/server-only/recipient/delete-recipient';
+import { deleteRecipientFromTemplate } from '@documenso/lib/server-only/recipient/delete-recipient-from-template';
 import { setRecipientsForDocument } from '@documenso/lib/server-only/recipient/set-recipients-for-document';
 import { setRecipientsForTemplate } from '@documenso/lib/server-only/recipient/set-recipients-for-template';
 import { extractNextApiRequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
@@ -10,6 +12,8 @@ import {
   ZAddSignersMutationSchema,
   ZAddTemplateSignersMutationSchema,
   ZCompleteDocumentWithTokenMutationSchema,
+  ZRemoveSignerMutationSchema,
+  ZRemoveTemplateSignerMutationSchema,
 } from './schema';
 
 export const recipientRouter = router({
@@ -70,6 +74,51 @@ export const recipientRouter = router({
       }
     }),
 
+  removeTemplateSigner: authenticatedProcedure
+    .input(ZRemoveTemplateSignerMutationSchema)
+    .mutation(async ({ input, ctx }) => {
+      try {
+        const { templateId, recipientId, teamId } = input;
+        const userId = ctx.user.id;
+
+        return await deleteRecipientFromTemplate({
+          userId,
+          templateId,
+          teamId,
+          recipientId,
+        });
+      } catch (e) {
+        console.error(e);
+        throw new TRPCError({
+          code: 'BAD_REQUEST',
+          message: 'We were unable to remove the recipient. Please try again later.',
+        });
+      }
+    }),
+
+  removeSigner: authenticatedProcedure
+    .input(ZRemoveSignerMutationSchema)
+    .mutation(async ({ input, ctx }) => {
+      try {
+        const { documentId, teamId, recipientId } = input;
+
+        return await deleteRecipient({
+          userId: ctx.user.id,
+          documentId,
+          teamId,
+          recipientId,
+          requestMetadata: extractNextApiRequestMetadata(ctx.req),
+        });
+      } catch (err) {
+        console.error(err);
+
+        throw new TRPCError({
+          code: 'BAD_REQUEST',
+          message: 'We were unable to set this field. Please try again later.',
+        });
+      }
+    }),
+
   completeDocumentWithToken: procedure
     .input(ZCompleteDocumentWithTokenMutationSchema)
     .mutation(async ({ input, ctx }) => {

packages/trpc/server/recipient-router/schema.ts

@@ -58,6 +58,14 @@ export const ZAddTemplateSignersMutationSchema = z
 
 export type TAddTemplateSignersMutationSchema = z.infer<typeof ZAddTemplateSignersMutationSchema>;
 
+export const ZRemoveSignerMutationSchema = z.object({
+  documentId: z.number(),
+  teamId: z.number().optional(),
+  recipientId: z.number(),
+});
+
+export type TRemoveSignerMutationSchema = z.infer<typeof ZRemoveSignerMutationSchema>;
+
 export const ZCompleteDocumentWithTokenMutationSchema = z.object({
   token: z.string(),
   documentId: z.number(),
@@ -67,3 +75,13 @@ export const ZCompleteDocumentWithTokenMutationSchema = z.object({
 export type TCompleteDocumentWithTokenMutationSchema = z.infer<
   typeof ZCompleteDocumentWithTokenMutationSchema
 >;
+
+export const ZRemoveTemplateSignerMutationSchema = z.object({
+  templateId: z.number(),
+  teamId: z.number().optional(),
+  recipientId: z.number(),
+});
+
+export type TRemoveTemplateSignerMutationSchema = z.infer<
+  typeof ZRemoveTemplateSignerMutationSchema
+>;

packages/ui/components/call-to-action.tsx

@@ -0,0 +1,35 @@
+import Link from 'next/link';
+
+import { Button } from '../primitives/button';
+import { Card, CardContent } from '../primitives/card';
+
+type CallToActionProps = {
+  className?: string;
+  utmSource?: string;
+};
+
+export const CallToAction = ({ className, utmSource = 'generic-cta' }: CallToActionProps) => {
+  return (
+    <Card spotlight className={className}>
+      <CardContent className="flex flex-col items-center justify-center p-12">
+        <h2 className="text-center text-2xl font-bold">Looking for the managed solution?</h2>
+
+        <p className="text-muted-foreground mt-4 max-w-[55ch] text-center leading-normal">
+          You can get started with Documenso in minutes. We handle the infrastructure, so you can
+          focus on signing documents.
+        </p>
+
+        <Button
+          className="focus-visible:ring-ring ring-offset-background bg-primary text-primary-foreground hover:bg-primary/90text-sm mt-8 inline-flex items-center justify-center rounded-full border font-medium no-underline transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50"
+          variant="default"
+          size="lg"
+          asChild
+        >
+          <Link href={`https://app.documenso.com/signup?utm_source=${utmSource}`} target="_blank">
+            Get started
+          </Link>
+        </Button>
+      </CardContent>
+    </Card>
+  );
+};

packages/ui/components/common/language-switcher-dialog.tsx

@@ -0,0 +1,57 @@
+import { msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
+import { CheckIcon } from 'lucide-react';
+
+import { SUPPORTED_LANGUAGES } from '@documenso/lib/constants/i18n';
+import { switchI18NLanguage } from '@documenso/lib/server-only/i18n/switch-i18n-language';
+import { dynamicActivate } from '@documenso/lib/utils/i18n';
+import { cn } from '@documenso/ui/lib/utils';
+import {
+  CommandDialog,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+} from '@documenso/ui/primitives/command';
+
+type LanguageSwitcherDialogProps = {
+  open: boolean;
+  setOpen: (_open: boolean) => void;
+};
+
+export const LanguageSwitcherDialog = ({ open, setOpen }: LanguageSwitcherDialogProps) => {
+  const { i18n, _ } = useLingui();
+
+  const setLanguage = async (lang: string) => {
+    setOpen(false);
+
+    await dynamicActivate(i18n, lang);
+    await switchI18NLanguage(lang);
+  };
+
+  return (
+    <CommandDialog open={open} onOpenChange={setOpen}>
+      <CommandInput placeholder={_(msg`Search languages...`)} />
+
+      <CommandList>
+        <CommandGroup>
+          {Object.values(SUPPORTED_LANGUAGES).map((language) => (
+            <CommandItem
+              key={language.short}
+              value={language.full}
+              onSelect={async () => setLanguage(language.short)}
+            >
+              <CheckIcon
+                className={cn(
+                  'mr-2 h-4 w-4',
+                  i18n.locale === language.short ? 'opacity-100' : 'opacity-0',
+                )}
+              />
+              {SUPPORTED_LANGUAGES[language.short].full}
+            </CommandItem>
+          ))}
+        </CommandGroup>
+      </CommandList>
+    </CommandDialog>
+  );
+};

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

@@ -2,6 +2,8 @@
 
 import React, { useId, useMemo, useState } from 'react';
 
+import { useRouter } from 'next/navigation';
+
 import { zodResolver } from '@hookform/resolvers/zod';
 import { Trans, msg } from '@lingui/macro';
 import { useLingui } from '@lingui/react';
@@ -11,10 +13,13 @@ import { useSession } from 'next-auth/react';
 import { useFieldArray, useForm } from 'react-hook-form';
 
 import { useLimits } from '@documenso/ee/server-only/limits/provider/client';
+import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { ZRecipientAuthOptionsSchema } from '@documenso/lib/types/document-auth';
 import { nanoid } from '@documenso/lib/universal/id';
 import type { Field, Recipient } from '@documenso/prisma/client';
 import { RecipientRole, SendStatus } from '@documenso/prisma/client';
+import type { DocumentWithDetails } from '@documenso/prisma/types/document';
+import { trpc } from '@documenso/trpc/react';
 import { AnimateGenericFadeInOut } from '@documenso/ui/components/animate/animate-generic-fade-in-out';
 import { RecipientActionAuthSelect } from '@documenso/ui/components/recipient/recipient-action-auth-select';
 import { RecipientRoleSelect } from '@documenso/ui/components/recipient/recipient-role-select';
@@ -41,32 +46,70 @@ import type { DocumentFlowStep } from './types';
 
 export type AddSignersFormProps = {
   documentFlow: DocumentFlowStep;
+  document: DocumentWithDetails;
   recipients: Recipient[];
   fields: Field[];
   isDocumentEnterprise: boolean;
   onSubmit: (_data: TAddSignersFormSchema) => void;
   isDocumentPdfLoaded: boolean;
+  teamId?: number;
 };
 
 export const AddSignersFormPartial = ({
   documentFlow,
+  document,
   recipients,
   fields,
   isDocumentEnterprise,
   onSubmit,
   isDocumentPdfLoaded,
+  teamId,
 }: AddSignersFormProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
   const { remaining } = useLimits();
   const { data: session } = useSession();
+  const router = useRouter();
 
   const user = session?.user;
 
   const initialId = useId();
+  const utils = trpc.useUtils();
 
   const { currentStep, totalSteps, previousStep } = useStep();
 
+  const { mutateAsync: addSigners } = trpc.recipient.addSigners.useMutation({
+    ...DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
+    onSuccess: (newRecipients) => {
+      utils.document.getDocumentWithDetailsById.setData(
+        {
+          id: document.id,
+          teamId,
+        },
+        (oldData) => ({ ...(oldData || document), Recipient: newRecipients }),
+      );
+    },
+  });
+
+  const { mutateAsync: deleteSigner } = trpc.recipient.removeSigner.useMutation({
+    ...DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
+    onSuccess: (deletedRecipient) => {
+      utils.document.getDocumentWithDetailsById.setData(
+        {
+          id: document.id,
+          teamId,
+        },
+        (oldData) => {
+          if (!oldData) return document;
+          return {
+            ...oldData,
+            Recipient: oldData.Recipient.filter((r) => r.id !== deletedRecipient.id),
+          };
+        },
+      );
+    },
+  });
+
   const form = useForm<TAddSignersFormSchema>({
     resolver: zodResolver(ZAddSignersFormSchema),
     defaultValues: {
@@ -156,22 +199,11 @@ export const AddSignersFormPartial = ({
     });
   };
 
-  const onRemoveSigner = (index: number) => {
-    const signer = signers[index];
-
-    if (hasBeenSentToRecipientId(signer.nativeId)) {
-      toast({
-        title: _(msg`Cannot remove signer`),
-        description: _(msg`This signer has already received the document.`),
-        variant: 'destructive',
-      });
-
-      return;
-    }
-
-    removeSigner(index);
-  };
-
+  /*
+    The self-signer is automatically saved on blur
+    since the email input is focused after adding the self-signer.
+    When the user clicks outside the input, the self-signer is saved in the db.
+  */
   const onAddSelfSigner = () => {
     if (emptySignerIndex !== -1) {
       setValue(`signers.${emptySignerIndex}.name`, user?.name ?? '');
@@ -193,6 +225,72 @@ export const AddSignersFormPartial = ({
     }
   };
 
+  const handleOnBlur = async (index: number) => {
+    try {
+      const currentSigner = form.getValues(`signers.${index}`);
+
+      if (!currentSigner.email) {
+        return;
+      }
+
+      await addSigners({
+        documentId: document.id,
+        teamId: teamId,
+        signers: form.getValues('signers').map((signer) => ({
+          ...signer,
+          actionAuth: signer.actionAuth || null,
+        })),
+      });
+
+      const isNewSigner = !currentSigner.nativeId;
+
+      toast({
+        title: isNewSigner ? 'Signer added' : 'Signer updated',
+        description: isNewSigner
+          ? 'The signer has been added to the document.'
+          : 'The signer information has been updated.',
+      });
+
+      router.refresh();
+    } catch (e) {
+      console.error(e);
+      toast({
+        title: 'Error',
+        description: 'An error occurred while updating the document recipient.',
+        variant: 'destructive',
+      });
+    }
+  };
+
+  const handleRemoveSigner = async (index: number) => {
+    const signer = signers[index];
+
+    if (hasBeenSentToRecipientId(signer.nativeId)) {
+      toast({
+        title: 'Cannot remove signer',
+        description: 'This signer has already received the document.',
+        variant: 'destructive',
+      });
+
+      return;
+    }
+
+    removeSigner(index);
+
+    if (signer.nativeId) {
+      await deleteSigner({
+        documentId: document.id,
+        teamId: teamId,
+        recipientId: signer.nativeId,
+      });
+
+      toast({
+        title: 'Signer removed',
+        description: 'The signer has been removed from the document.',
+      });
+    }
+  };
+
   return (
     <>
       <DocumentFlowFormContainerHeader
@@ -240,6 +338,7 @@ export const AddSignersFormPartial = ({
                             {...field}
                             disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
                             onKeyDown={onKeyDown}
+                            onBlur={() => void handleOnBlur(index)}
                           />
                         </FormControl>
 
@@ -266,6 +365,7 @@ export const AddSignersFormPartial = ({
                             {...field}
                             disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
                             onKeyDown={onKeyDown}
+                            onBlur={() => void handleOnBlur(index)}
                           />
                         </FormControl>
 
@@ -319,7 +419,7 @@ export const AddSignersFormPartial = ({
                       hasBeenSentToRecipientId(signer.nativeId) ||
                       signers.length === 1
                     }
-                    onClick={() => onRemoveSigner(index)}
+                    onClick={() => void handleRemoveSigner(index)}
                   >
                     <Trash className="h-5 w-5" />
                   </button>

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

@@ -155,17 +155,7 @@ export const FieldAdvancedSettings = forwardRef<HTMLDivElement, FieldAdvancedSet
 
     const doesFieldExist = (!!document || !!template) && field.nativeId !== undefined;
 
-    const { data: fieldData } = trpc.field.getField.useQuery(
-      {
-        fieldId: Number(field.nativeId),
-        teamId,
-      },
-      {
-        enabled: doesFieldExist,
-      },
-    );
-
-    const fieldMeta = fieldData?.fieldMeta;
+    const fieldMeta = field?.fieldMeta;
 
     const localStorageKey = `field_${field.formId}_${field.type}`;
 

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

@@ -157,6 +157,38 @@ export const AddTemplateFieldsFormPartial = ({
     selectedSignerIndex === -1 ? 0 : selectedSignerIndex,
   );
 
+  const filterFieldsWithEmptyValues = (fields: typeof localFields, fieldType: string) =>
+    fields
+      .filter((field) => field.type === fieldType)
+      .filter((field) => {
+        if (field.fieldMeta && 'values' in field.fieldMeta) {
+          return field.fieldMeta.values?.length === 0;
+        }
+
+        return true;
+      });
+
+  const emptyCheckboxFields = useMemo(
+    () => filterFieldsWithEmptyValues(localFields, FieldType.CHECKBOX),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [localFields],
+  );
+
+  const emptyRadioFields = useMemo(
+    () => filterFieldsWithEmptyValues(localFields, FieldType.RADIO),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [localFields],
+  );
+
+  const emptySelectFields = useMemo(
+    () => filterFieldsWithEmptyValues(localFields, FieldType.DROPDOWN),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [localFields],
+  );
+
+  const hasErrors =
+    emptyCheckboxFields.length > 0 || emptyRadioFields.length > 0 || emptySelectFields.length > 0;
+
   const [isFieldWithinBounds, setIsFieldWithinBounds] = useState(false);
   const [coords, setCoords] = useState({
     x: 0,
@@ -789,6 +821,24 @@ export const AddTemplateFieldsFormPartial = ({
             </div>
           </DocumentFlowFormContainerContent>
 
+          {hasErrors && (
+            <div className="mt-4">
+              <ul>
+                <li className="text-sm text-red-500">
+                  <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 step={currentStep} maxStep={totalSteps} />
 
@@ -796,6 +846,7 @@ export const AddTemplateFieldsFormPartial = ({
               loading={isSubmitting}
               disabled={isSubmitting}
               goNextLabel={msg`Save Template`}
+              disableNextStep={hasErrors}
               onGoBackClick={() => {
                 previousStep();
                 remove();

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

@@ -2,6 +2,8 @@
 
 import React, { useEffect, useId, useMemo, useState } from 'react';
 
+import { useRouter } from 'next/navigation';
+
 import { zodResolver } from '@hookform/resolvers/zod';
 import { Trans, msg } from '@lingui/macro';
 import { useLingui } from '@lingui/react';
@@ -10,11 +12,14 @@ import { Link2Icon, Plus, Trash } from 'lucide-react';
 import { useSession } from 'next-auth/react';
 import { useFieldArray, useForm } from 'react-hook-form';
 
+import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { ZRecipientAuthOptionsSchema } from '@documenso/lib/types/document-auth';
 import { nanoid } from '@documenso/lib/universal/id';
 import { generateRecipientPlaceholder } from '@documenso/lib/utils/templates';
 import type { TemplateDirectLink } from '@documenso/prisma/client';
 import { type Field, type Recipient, RecipientRole } from '@documenso/prisma/client';
+import type { TemplateWithDetails } from '@documenso/prisma/types/template';
+import { trpc } from '@documenso/trpc/react';
 import { AnimateGenericFadeInOut } from '@documenso/ui/components/animate/animate-generic-fade-in-out';
 import { RecipientActionAuthSelect } from '@documenso/ui/components/recipient/recipient-action-auth-select';
 import { RecipientRoleSelect } from '@documenso/ui/components/recipient/recipient-role-select';
@@ -22,6 +27,7 @@ import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
 import { FormErrorMessage } from '@documenso/ui/primitives/form/form-error-message';
 import { Input } from '@documenso/ui/primitives/input';
+import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { Checkbox } from '../checkbox';
 import {
@@ -46,6 +52,7 @@ export type AddTemplatePlaceholderRecipientsFormProps = {
   templateDirectLink: TemplateDirectLink | null;
   isEnterprise: boolean;
   isDocumentPdfLoaded: boolean;
+  template: TemplateWithDetails;
   onSubmit: (_data: TAddTemplatePlacholderRecipientsFormSchema) => void;
 };
 
@@ -57,7 +64,10 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
   fields,
   isDocumentPdfLoaded,
   onSubmit,
+  template,
 }: AddTemplatePlaceholderRecipientsFormProps) => {
+  const { toast } = useToast();
+  const router = useRouter();
   const initialId = useId();
 
   const { _ } = useLingui();
@@ -71,6 +81,38 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
 
   const { currentStep, totalSteps, previousStep } = useStep();
 
+  const utils = trpc.useUtils();
+
+  const { mutateAsync: addTemplateSigners } = trpc.recipient.addTemplateSigners.useMutation({
+    ...DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
+    onSuccess: (newData) => {
+      utils.template.getTemplateWithDetailsById.setData(
+        {
+          id: template.id,
+        },
+        (oldData) => ({ ...(oldData || template), ...newData }),
+      );
+    },
+  });
+
+  const { mutateAsync: removeTemplateSigner } = trpc.recipient.removeTemplateSigner.useMutation({
+    ...DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
+    onSuccess: (deletedRecipient) => {
+      utils.template.getTemplateWithDetailsById.setData(
+        {
+          id: template.id,
+        },
+        (oldData) => {
+          if (!oldData) return template;
+          return {
+            ...oldData,
+            recipients: oldData.Recipient.filter((r) => r.id !== deletedRecipient.id),
+          };
+        },
+      );
+    },
+  });
+
   const generateDefaultFormSigners = () => {
     if (recipients.length === 0) {
       return [
@@ -158,10 +200,6 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
     setPlaceholderRecipientCount((count) => count + 1);
   };
 
-  const onRemoveSigner = (index: number) => {
-    removeSigner(index);
-  };
-
   const isSignerDirectRecipient = (
     signer: TAddTemplatePlacholderRecipientsFormSchema['signers'][number],
   ): boolean => {
@@ -171,6 +209,54 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
     );
   };
 
+  const handleOnBlur = async (index: number) => {
+    try {
+      const currentSigner = form.getValues(`signers.${index}`);
+
+      if (!currentSigner.email) {
+        return;
+      }
+
+      await addTemplateSigners({
+        templateId: template.id,
+        teamId: template.teamId ?? undefined,
+        signers: form.getValues('signers'),
+      });
+
+      router.refresh();
+    } catch (e) {
+      console.error(e);
+      toast({
+        title: 'Error',
+        description: 'An error occurred while updating the template recipient.',
+        variant: 'destructive',
+      });
+    }
+  };
+
+  const handleRemoveSigner = async (index: number) => {
+    const signer = signers[index];
+
+    if (!signer) {
+      return;
+    }
+
+    removeSigner(index);
+
+    if (signer.nativeId) {
+      await removeTemplateSigner({
+        templateId: template.id,
+        teamId: template.teamId ?? undefined,
+        recipientId: signer.nativeId,
+      });
+
+      toast({
+        title: 'Signer removed',
+        description: 'The signer has been removed from the document.',
+      });
+    }
+  };
+
   return (
     <>
       <DocumentFlowFormContainerHeader
@@ -216,12 +302,8 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                             type="email"
                             placeholder={_(msg`Email`)}
                             {...field}
-                            disabled={
-                              field.disabled ||
-                              isSubmitting ||
-                              signers[index].email === user?.email ||
-                              isSignerDirectRecipient(signer)
-                            }
+                            disabled={field.disabled || isSubmitting}
+                            onBlur={() => void handleOnBlur(index)}
                           />
                         </FormControl>
 
@@ -250,12 +332,8 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                           <Input
                             placeholder={_(msg`Name`)}
                             {...field}
-                            disabled={
-                              field.disabled ||
-                              isSubmitting ||
-                              signers[index].email === user?.email ||
-                              isSignerDirectRecipient(signer)
-                            }
+                            disabled={field.disabled || isSubmitting}
+                            onBlur={() => void handleOnBlur(index)}
                           />
                         </FormControl>
 
@@ -291,7 +369,10 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                         <FormControl>
                           <RecipientRoleSelect
                             {...field}
-                            onValueChange={field.onChange}
+                            onValueChange={(value) => {
+                              field.onChange(value);
+                              void handleOnBlur(index);
+                            }}
                             disabled={isSubmitting}
                             hideCCRecipients={isSignerDirectRecipient(signer)}
                           />
@@ -325,7 +406,7 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
                       type="button"
                       className="col-span-1 mt-auto inline-flex h-10 w-10 items-center justify-center text-slate-500 hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50"
                       disabled={isSubmitting || signers.length === 1}
-                      onClick={() => onRemoveSigner(index)}
+                      onClick={() => void handleRemoveSigner(index)}
                     >
                       <Trash className="h-5 w-5" />
                     </button>