Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2026-06-22 04:12:06 +10:00
Code Issues Packages Projects Releases Wiki Activity

fix(i18n): mark supported languages for translation (#2377)

Browse Source
This commit is contained in:
Konrad
2026-02-26 02:06:18 +01:00
committed by GitHub
parent 484e1c20d0
commit 92d82c0423
10 changed files with 72 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/remix/app/components/embed/authoring/configure-document-advanced-settings.tsx
+6 -4
View File
@@ -1,4 +1,6 @@
import { Trans, useLingui } from '@lingui/react/macro'; import { t } from '@lingui/core/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import { DocumentDistributionMethod } from '@prisma/client'; import { DocumentDistributionMethod } from '@prisma/client';
import { InfoIcon } from 'lucide-react'; import { InfoIcon } from 'lucide-react';
import type { Control } from 'react-hook-form'; import type { Control } from 'react-hook-form';
@@ -44,7 +46,7 @@ export const ConfigureDocumentAdvancedSettings = ({
control, control,
isSubmitting, isSubmitting,
}: ConfigureDocumentAdvancedSettingsProps) => { }: ConfigureDocumentAdvancedSettingsProps) => {
const { t } = useLingui(); const { _ } = useLingui();
const form = useFormContext<TConfigureEmbedFormSchema>(); const form = useFormContext<TConfigureEmbedFormSchema>();
const { features } = useConfigureDocument(); const { features } = useConfigureDocument();
@@ -93,7 +95,7 @@ export const ConfigureDocumentAdvancedSettings = ({
<FormControl> <FormControl>
<MultiSelectCombobox <MultiSelectCombobox
options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({ options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({
label: t(option.label), label: _(option.label),
value: option.value, value: option.value,
}))} }))}
selectedValues={field.value} selectedValues={field.value}
@@ -125,7 +127,7 @@ export const ConfigureDocumentAdvancedSettings = ({
<SelectContent> <SelectContent>
{Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => ( {Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => (
<SelectItem key={code} value={code}> <SelectItem key={code} value={code}>
{language.full} {_(language.full)}
</SelectItem> </SelectItem>
))} ))}
</SelectContent> </SelectContent>
apps/remix/app/components/forms/document-preferences-form.tsx
+5 -5
View File
@@ -1,6 +1,6 @@
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { msg } from '@lingui/core/macro'; import { msg, t } from '@lingui/core/macro';
import { useLingui } from '@lingui/react/macro'; import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro'; import { Trans } from '@lingui/react/macro';
import type { TeamGlobalSettings } from '@prisma/client'; import type { TeamGlobalSettings } from '@prisma/client';
import { DocumentVisibility, OrganisationType, type RecipientRole } from '@prisma/client'; import { DocumentVisibility, OrganisationType, type RecipientRole } from '@prisma/client';
@@ -109,7 +109,7 @@ export const DocumentPreferencesForm = ({
canInherit, canInherit,
isAiFeaturesConfigured = false, isAiFeaturesConfigured = false,
}: DocumentPreferencesFormProps) => { }: DocumentPreferencesFormProps) => {
const { t } = useLingui(); const { _ } = useLingui();
const { user, organisations } = useSession(); const { user, organisations } = useSession();
const currentOrganisation = useCurrentOrganisation(); const currentOrganisation = useCurrentOrganisation();
const optionalTeam = useOptionalCurrentTeam(); const optionalTeam = useOptionalCurrentTeam();
@@ -242,7 +242,7 @@ export const DocumentPreferencesForm = ({
<SelectContent> <SelectContent>
{Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => ( {Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => (
<SelectItem key={code} value={code}> <SelectItem key={code} value={code}>
{language.full} {_(language.full)}
</SelectItem> </SelectItem>
))} ))}
@@ -342,7 +342,7 @@ export const DocumentPreferencesForm = ({
<FormControl> <FormControl>
<MultiSelectCombobox <MultiSelectCombobox
options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({ options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({
label: t(option.label), label: _(option.label),
value: option.value, value: option.value,
}))} }))}
selectedValues={field.value} selectedValues={field.value}
apps/remix/app/components/general/app-command-menu.tsx
+4 -5
View File
@@ -256,10 +256,10 @@ export function AppCommandMenu({ open, onOpenChange }: AppCommandMenuProps) {
<CommandGroup className="mx-2 p-0 pb-2" heading={_(msg`Preferences`)}> <CommandGroup className="mx-2 p-0 pb-2" heading={_(msg`Preferences`)}>
<CommandItem className="-mx-2 -my-1 rounded-lg" onSelect={() => addPage('language')}> <CommandItem className="-mx-2 -my-1 rounded-lg" onSelect={() => addPage('language')}>
Change language {_(msg`Change language`)}
</CommandItem> </CommandItem>
<CommandItem className="-mx-2 -my-1 rounded-lg" onSelect={() => addPage('theme')}> <CommandItem className="-mx-2 -my-1 rounded-lg" onSelect={() => addPage('theme')}>
Change theme {_(msg`Change theme`)}
</CommandItem> </CommandItem>
</CommandGroup> </CommandGroup>
@@ -367,15 +367,14 @@ const LanguageCommands = () => {
return Object.values(SUPPORTED_LANGUAGES).map((language) => ( return Object.values(SUPPORTED_LANGUAGES).map((language) => (
<CommandItem <CommandItem
disabled={isLoading} disabled={isLoading}
key={language.full} key={language.short}
onSelect={async () => setLanguage(language.short)} onSelect={async () => setLanguage(language.short)}
className="-my-1 mx-2 rounded-lg first:mt-2 last:mb-2" className="-my-1 mx-2 rounded-lg first:mt-2 last:mb-2"
> >
<CheckIcon <CheckIcon
className={cn('mr-2 h-4 w-4', i18n.locale === language.short ? 'opacity-100' : 'opacity-0')} className={cn('mr-2 h-4 w-4', i18n.locale === language.short ? 'opacity-100' : 'opacity-0')}
/> />
{_(language.full)}
{language.full}
</CommandItem> </CommandItem>
)); ));
}; };
apps/remix/app/components/general/envelope-editor/envelope-editor-settings-dialog.tsx
+12 -11
View File
@@ -1,8 +1,9 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { msg } from '@lingui/core/macro'; import { msg, t } from '@lingui/core/macro';
import { Trans, useLingui } from '@lingui/react/macro'; import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import { import {
DocumentDistributionMethod, DocumentDistributionMethod,
DocumentVisibility, DocumentVisibility,
@@ -154,13 +155,13 @@ const tabs = [
id: 'email', id: 'email',
title: msg`Email`, title: msg`Email`,
icon: MailIcon, icon: MailIcon,
description: msg`Configure email settings for the document`, description: msg`Configure email settings for the document.`,
}, },
{ {
id: 'security', id: 'security',
title: msg`Security`, title: msg`Security`,
icon: ShieldIcon, icon: ShieldIcon,
description: msg`Configure security settings for the document`, description: msg`Configure security settings for the document.`,
}, },
] as const; ] as const;
@@ -174,7 +175,7 @@ export const EnvelopeEditorSettingsDialog = ({
trigger, trigger,
...props ...props
}: EnvelopeEditorSettingsDialogProps) => { }: EnvelopeEditorSettingsDialogProps) => {
const { t, i18n } = useLingui(); const { _ } = useLingui();
const { toast } = useToast(); const { toast } = useToast();
const { envelope, updateEnvelopeAsync } = useCurrentEnvelopeEditor(); const { envelope, updateEnvelopeAsync } = useCurrentEnvelopeEditor();
@@ -363,7 +364,7 @@ export const EnvelopeEditorSettingsDialog = ({
})} })}
> >
<tab.icon className="mr-2 h-5 w-5" /> <tab.icon className="mr-2 h-5 w-5" />
{t(tab.title)} {_(tab.title)}
</Button> </Button>
))} ))}
</nav> </nav>
@@ -372,8 +373,8 @@ export const EnvelopeEditorSettingsDialog = ({
{/* Content. */} {/* Content. */}
<div className="flex w-full flex-col"> <div className="flex w-full flex-col">
<CardHeader className="border-b pb-4"> <CardHeader className="border-b pb-4">
<CardTitle>{t(selectedTab?.title ?? '')}</CardTitle> <CardTitle>{selectedTab ? _(selectedTab.title) : ''}</CardTitle>
<CardDescription>{t(selectedTab?.description ?? '')}</CardDescription> <CardDescription>{selectedTab ? _(selectedTab.description) : ''}</CardDescription>
</CardHeader> </CardHeader>
<Form {...form}> <Form {...form}>
@@ -421,7 +422,7 @@ export const EnvelopeEditorSettingsDialog = ({
<SelectContent> <SelectContent>
{Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => ( {Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => (
<SelectItem key={code} value={code}> <SelectItem key={code} value={code}>
{language.full} {_(language.full)}
</SelectItem> </SelectItem>
))} ))}
</SelectContent> </SelectContent>
@@ -444,7 +445,7 @@ export const EnvelopeEditorSettingsDialog = ({
<FormControl> <FormControl>
<MultiSelectCombobox <MultiSelectCombobox
options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({ options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({
label: t(option.label), label: _(option.label),
value: option.value, value: option.value,
}))} }))}
selectedValues={field.value} selectedValues={field.value}
@@ -632,7 +633,7 @@ export const EnvelopeEditorSettingsDialog = ({
{Object.values(DOCUMENT_DISTRIBUTION_METHODS).map( {Object.values(DOCUMENT_DISTRIBUTION_METHODS).map(
({ value, description }) => ( ({ value, description }) => (
<SelectItem key={value} value={value}> <SelectItem key={value} value={value}>
{i18n._(description)} {_(description)}
</SelectItem> </SelectItem>
), ),
)} )}
lingui.config.ts
+1 -1
View File
@@ -2,7 +2,7 @@ import { defineConfig } from '@lingui/cli';
import type { LinguiConfig } from '@lingui/conf'; import type { LinguiConfig } from '@lingui/conf';
import { formatter } from '@lingui/format-po'; import { formatter } from '@lingui/format-po';
import { APP_I18N_OPTIONS } from '@documenso/lib/constants/i18n'; import { APP_I18N_OPTIONS } from '@documenso/lib/constants/locales';
const config: LinguiConfig = { const config: LinguiConfig = {
sourceLocale: APP_I18N_OPTIONS.sourceLang, sourceLocale: APP_I18N_OPTIONS.sourceLang,
packages/lib/constants/i18n.ts
+17 -33
View File
@@ -1,23 +1,13 @@
import type { MessageDescriptor } from '@lingui/core';
import { msg } from '@lingui/core/macro';
import { z } from 'zod'; import { z } from 'zod';
export const SUPPORTED_LANGUAGE_CODES = [ import { SUPPORTED_LANGUAGE_CODES, type SupportedLanguageCodes } from './locales';
'de',
'en', export * from './locales';
'fr',
'es',
'it',
'nl',
'pl',
'pt-BR',
'ja',
'ko',
'zh',
] as const;
export const ZSupportedLanguageCodeSchema = z.enum(SUPPORTED_LANGUAGE_CODES).catch('en'); export const ZSupportedLanguageCodeSchema = z.enum(SUPPORTED_LANGUAGE_CODES).catch('en');
export type SupportedLanguageCodes = (typeof SUPPORTED_LANGUAGE_CODES)[number];
export type I18nLocaleData = { export type I18nLocaleData = {
/** /**
* The supported language extracted from the locale. * The supported language extracted from the locale.
@@ -30,61 +20,55 @@ export type I18nLocaleData = {
locales: string[]; locales: string[];
}; };
export const APP_I18N_OPTIONS = {
supportedLangs: SUPPORTED_LANGUAGE_CODES,
sourceLang: 'en',
defaultLocale: 'en-US',
} as const;
type SupportedLanguage = { type SupportedLanguage = {
full: string;
short: string; short: string;
full: MessageDescriptor;
}; };
export const SUPPORTED_LANGUAGES: Record<string, SupportedLanguage> = { export const SUPPORTED_LANGUAGES: Record<string, SupportedLanguage> = {
de: { de: {
full: 'German',
short: 'de', short: 'de',
full: msg`German`,
}, },
en: { en: {
full: 'English',
short: 'en', short: 'en',
full: msg`English`,
}, },
fr: { fr: {
full: 'French',
short: 'fr', short: 'fr',
full: msg`French`,
}, },
es: { es: {
full: 'Spanish',
short: 'es', short: 'es',
full: msg`Spanish`,
}, },
it: { it: {
full: 'Italian',
short: 'it', short: 'it',
full: msg`Italian`,
}, },
nl: { nl: {
short: 'nl', short: 'nl',
full: 'Dutch', full: msg`Dutch`,
}, },
pl: { pl: {
short: 'pl', short: 'pl',
full: 'Polish', full: msg`Polish`,
}, },
'pt-BR': { 'pt-BR': {
short: 'pt-BR', short: 'pt-BR',
full: 'Portuguese (Brazil)', full: msg`Portuguese (Brazil)`,
}, },
ja: { ja: {
short: 'ja', short: 'ja',
full: 'Japanese', full: msg`Japanese`,
}, },
ko: { ko: {
short: 'ko', short: 'ko',
full: 'Korean', full: msg`Korean`,
}, },
zh: { zh: {
short: 'zh', short: 'zh',
full: 'Chinese', full: msg`Chinese`,
}, },
} satisfies Record<SupportedLanguageCodes, SupportedLanguage>; } satisfies Record<SupportedLanguageCodes, SupportedLanguage>;
packages/lib/constants/locales.ts
+21
View File
@@ -0,0 +1,21 @@
export const SUPPORTED_LANGUAGE_CODES = [
'de',
'en',
'fr',
'es',
'it',
'nl',
'pl',
'pt-BR',
'ja',
'ko',
'zh',
] as const;
export type SupportedLanguageCodes = (typeof SUPPORTED_LANGUAGE_CODES)[number];
export const APP_I18N_OPTIONS = {
supportedLangs: SUPPORTED_LANGUAGE_CODES,
sourceLang: 'en',
defaultLocale: 'en-US',
} as const;
packages/ui/components/common/language-switcher-dialog.tsx
+2 -2
View File
@@ -45,7 +45,7 @@ export const LanguageSwitcherDialog = ({ open, setOpen }: LanguageSwitcherDialog
{Object.values(SUPPORTED_LANGUAGES).map((language) => ( {Object.values(SUPPORTED_LANGUAGES).map((language) => (
<CommandItem <CommandItem
key={language.short} key={language.short}
value={language.full} value={_(language.full)}
onSelect={async () => setLanguage(language.short)} onSelect={async () => setLanguage(language.short)}
> >
<CheckIcon <CheckIcon
@@ -54,7 +54,7 @@ export const LanguageSwitcherDialog = ({ open, setOpen }: LanguageSwitcherDialog
i18n.locale === language.short ? 'opacity-100' : 'opacity-0', i18n.locale === language.short ? 'opacity-100' : 'opacity-0',
)} )}
/> />
{SUPPORTED_LANGUAGES[language.short].full} {_(language.full)}
</CommandItem> </CommandItem>
))} ))}
</CommandGroup> </CommandGroup>
packages/ui/primitives/document-flow/add-settings.tsx
+1 -1
View File
@@ -269,7 +269,7 @@ export const AddSettingsFormPartial = ({
<SelectContent> <SelectContent>
{Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => ( {Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => (
<SelectItem key={code} value={code}> <SelectItem key={code} value={code}>
{language.full} {t(language.full)}
</SelectItem> </SelectItem>
))} ))}
</SelectContent> </SelectContent>
packages/ui/primitives/template-flow/add-template-settings.tsx
+3 -3
View File
@@ -96,7 +96,7 @@ export const AddTemplateSettingsFormPartial = ({
onSubmit, onSubmit,
onAutoSave, onAutoSave,
}: AddTemplateSettingsFormProps) => { }: AddTemplateSettingsFormProps) => {
const { t, i18n } = useLingui(); const { t } = useLingui();
const organisation = useCurrentOrganisation(); const organisation = useCurrentOrganisation();
@@ -262,7 +262,7 @@ export const AddTemplateSettingsFormPartial = ({
<SelectContent> <SelectContent>
{Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => ( {Object.entries(SUPPORTED_LANGUAGES).map(([code, language]) => (
<SelectItem key={code} value={code}> <SelectItem key={code} value={code}>
{language.full} {t(language.full)}
</SelectItem> </SelectItem>
))} ))}
</SelectContent> </SelectContent>
@@ -391,7 +391,7 @@ export const AddTemplateSettingsFormPartial = ({
{Object.values(DOCUMENT_DISTRIBUTION_METHODS).map( {Object.values(DOCUMENT_DISTRIBUTION_METHODS).map(
({ value, description }) => ( ({ value, description }) => (
<SelectItem key={value} value={value}> <SelectItem key={value} value={value}>
{i18n._(description)} {t(description)}
</SelectItem> </SelectItem>
), ),
)} )}