feat: web i18n (#1286)

This commit is contained in:
David Nguyen
2024-08-27 20:34:39 +09:00
committed by GitHub
parent 0829311214
commit 75c8772a02
294 changed files with 14846 additions and 2229 deletions

View File

@ -1,5 +1,8 @@
import type { HTMLAttributes } from 'react';
import type { MessageDescriptor } from '@lingui/core';
import { msg } from '@lingui/macro';
import { useLingui } from '@lingui/react';
import { CheckCircle2, Clock, File } from 'lucide-react';
import type { LucideIcon } from 'lucide-react/dist/lucide-react';
@ -8,34 +11,40 @@ import { SignatureIcon } from '@documenso/ui/icons/signature';
import { cn } from '@documenso/ui/lib/utils';
type FriendlyStatus = {
label: string;
label: MessageDescriptor;
labelExtended: MessageDescriptor;
icon?: LucideIcon;
color: string;
};
export const FRIENDLY_STATUS_MAP: Record<ExtendedDocumentStatus, FriendlyStatus> = {
PENDING: {
label: 'Pending',
label: msg`Pending`,
labelExtended: msg`Document pending`,
icon: Clock,
color: 'text-blue-600 dark:text-blue-300',
},
COMPLETED: {
label: 'Completed',
label: msg`Completed`,
labelExtended: msg`Document completed`,
icon: CheckCircle2,
color: 'text-green-500 dark:text-green-300',
},
DRAFT: {
label: 'Draft',
label: msg`Draft`,
labelExtended: msg`Document draft`,
icon: File,
color: 'text-yellow-500 dark:text-yellow-200',
},
INBOX: {
label: 'Inbox',
label: msg`Inbox`,
labelExtended: msg`Document inbox`,
icon: SignatureIcon,
color: 'text-muted-foreground',
},
ALL: {
label: 'All',
label: msg`All`,
labelExtended: msg`Document All`,
color: 'text-muted-foreground',
},
};
@ -51,6 +60,8 @@ export const DocumentStatus = ({
inheritColor,
...props
}: DocumentStatusProps) => {
const { _ } = useLingui();
const { label, icon: Icon, color } = FRIENDLY_STATUS_MAP[status];
return (
@ -62,7 +73,7 @@ export const DocumentStatus = ({
})}
/>
)}
{label}
{_(label)}
</span>
);
};

View File

@ -1,5 +1,8 @@
import type { HTMLAttributes } from 'react';
import type { MessageDescriptor } from '@lingui/core';
import { msg } from '@lingui/macro';
import { useLingui } from '@lingui/react';
import { Globe2, Lock } from 'lucide-react';
import type { LucideIcon } from 'lucide-react/dist/lucide-react';
@ -7,7 +10,7 @@ import type { TemplateType as TemplateTypePrisma } from '@documenso/prisma/clien
import { cn } from '@documenso/ui/lib/utils';
type TemplateTypeIcon = {
label: string;
label: MessageDescriptor;
icon?: LucideIcon;
color: string;
};
@ -16,12 +19,12 @@ type TemplateTypes = (typeof TemplateTypePrisma)[keyof typeof TemplateTypePrisma
const TEMPLATE_TYPES: Record<TemplateTypes, TemplateTypeIcon> = {
PRIVATE: {
label: 'Private',
label: msg`Private`,
icon: Lock,
color: 'text-blue-600 dark:text-blue-300',
},
PUBLIC: {
label: 'Public',
label: msg`Public`,
icon: Globe2,
color: 'text-green-500 dark:text-green-300',
},
@ -33,6 +36,8 @@ export type TemplateTypeProps = HTMLAttributes<HTMLSpanElement> & {
};
export const TemplateType = ({ className, type, inheritColor, ...props }: TemplateTypeProps) => {
const { _ } = useLingui();
const { label, icon: Icon, color } = TEMPLATE_TYPES[type];
return (
@ -44,7 +49,7 @@ export const TemplateType = ({ className, type, inheritColor, ...props }: Templa
})}
/>
)}
{label}
{_(label)}
</span>
);
};