fix: placeholders translations (#2020)

This commit is contained in:
samuel-cglg
2025-11-13 04:26:19 +01:00
committed by GitHub
parent 58bff33275
commit 74a03077b7
21 changed files with 93 additions and 112 deletions

View File

@ -1,7 +1,7 @@
import { useState } from 'react'; import { useState } from 'react';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { Trans } from '@lingui/react/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
import { z } from 'zod'; import { z } from 'zod';
@ -57,6 +57,7 @@ export function AssistantConfirmationDialog({
allowDictateNextSigner = false, allowDictateNextSigner = false,
defaultNextSigner, defaultNextSigner,
}: ConfirmationDialogProps) { }: ConfirmationDialogProps) {
const { t } = useLingui();
const [isEditingNextSigner, setIsEditingNextSigner] = useState(false); const [isEditingNextSigner, setIsEditingNextSigner] = useState(false);
const form = useForm<TNextSignerFormSchema>({ const form = useForm<TNextSignerFormSchema>({
@ -146,7 +147,7 @@ export function AssistantConfirmationDialog({
<Input <Input
{...field} {...field}
className="mt-2" className="mt-2"
placeholder="Enter the next signer's name" placeholder={t`Enter the next signer's name`}
/> />
</FormControl> </FormControl>
@ -168,7 +169,7 @@ export function AssistantConfirmationDialog({
{...field} {...field}
type="email" type="email"
className="mt-2" className="mt-2"
placeholder="Enter the next signer's email" placeholder={t`Enter the next signer's email`}
/> />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />

View File

@ -1,8 +1,7 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { useLingui } from '@lingui/react/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { Trans } from '@lingui/react/macro';
import type * as DialogPrimitive from '@radix-ui/react-dialog'; import type * as DialogPrimitive from '@radix-ui/react-dialog';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
import type { z } from 'zod'; import type { z } from 'zod';
@ -149,7 +148,7 @@ export const OrganisationEmailCreateDialog = ({
<Trans>Display Name</Trans> <Trans>Display Name</Trans>
</FormLabel> </FormLabel>
<FormControl> <FormControl>
<Input {...field} placeholder="Support" /> <Input {...field} placeholder={t`Support`} />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
<FormDescription> <FormDescription>
@ -175,7 +174,7 @@ export const OrganisationEmailCreateDialog = ({
onChange={(e) => { onChange={(e) => {
field.onChange(e.target.value + '@' + emailDomain.domain); field.onChange(e.target.value + '@' + emailDomain.domain);
}} }}
placeholder="support" placeholder={t`support`}
/> />
<div className="bg-muted text-muted-foreground absolute bottom-0 right-0 top-0 flex items-center rounded-r-md border px-3 py-2 text-sm"> <div className="bg-muted text-muted-foreground absolute bottom-0 right-0 top-0 flex items-center rounded-r-md border px-3 py-2 text-sm">
@{emailDomain.domain} @{emailDomain.domain}

View File

@ -1,8 +1,7 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { useLingui } from '@lingui/react/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { Trans } from '@lingui/react/macro';
import type * as DialogPrimitive from '@radix-ui/react-dialog'; import type * as DialogPrimitive from '@radix-ui/react-dialog';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
import type { z } from 'zod'; import type { z } from 'zod';
@ -134,7 +133,7 @@ export const OrganisationEmailUpdateDialog = ({
<Trans>Display Name</Trans> <Trans>Display Name</Trans>
</FormLabel> </FormLabel>
<FormControl> <FormControl>
<Input {...field} placeholder="Support" /> <Input {...field} placeholder={t`Support`} />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
<FormDescription> <FormDescription>

View File

@ -1,9 +1,7 @@
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 { Plural, Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Plural, Trans } from '@lingui/react/macro';
import type * as DialogPrimitive from '@radix-ui/react-dialog'; import type * as DialogPrimitive from '@radix-ui/react-dialog';
import { startRegistration } from '@simplewebauthn/browser'; import { startRegistration } from '@simplewebauthn/browser';
import { KeyRoundIcon } from 'lucide-react'; import { KeyRoundIcon } from 'lucide-react';
@ -54,7 +52,7 @@ export const PasskeyCreateDialog = ({ trigger, onSuccess, ...props }: PasskeyCre
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const [formError, setFormError] = useState<string | null>(null); const [formError, setFormError] = useState<string | null>(null);
const { _ } = useLingui(); const { t } = useLingui();
const { toast } = useToast(); const { toast } = useToast();
const form = useForm<TCreatePasskeyFormSchema>({ const form = useForm<TCreatePasskeyFormSchema>({
@ -83,7 +81,7 @@ export const PasskeyCreateDialog = ({ trigger, onSuccess, ...props }: PasskeyCre
}); });
toast({ toast({
description: _(msg`Successfully created passkey`), description: t`Successfully created passkey`,
duration: 5000, duration: 5000,
}); });
@ -176,7 +174,7 @@ export const PasskeyCreateDialog = ({ trigger, onSuccess, ...props }: PasskeyCre
<Trans>Passkey name</Trans> <Trans>Passkey name</Trans>
</FormLabel> </FormLabel>
<FormControl> <FormControl>
<Input className="bg-background" placeholder="eg. Mac" {...field} /> <Input className="bg-background" placeholder={t`eg. Mac`} {...field} />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>

View File

@ -1,9 +1,7 @@
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 { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import type * as DialogPrimitive from '@radix-ui/react-dialog'; import type * as DialogPrimitive from '@radix-ui/react-dialog';
import { Plus } from 'lucide-react'; import { Plus } from 'lucide-react';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
@ -49,7 +47,7 @@ type TCreateTeamEmailFormSchema = z.infer<typeof ZCreateTeamEmailFormSchema>;
export const TeamEmailAddDialog = ({ teamId, trigger, ...props }: TeamEmailAddDialogProps) => { export const TeamEmailAddDialog = ({ teamId, trigger, ...props }: TeamEmailAddDialogProps) => {
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const { _ } = useLingui(); const { t } = useLingui();
const { toast } = useToast(); const { toast } = useToast();
const { revalidate } = useRevalidator(); const { revalidate } = useRevalidator();
@ -73,8 +71,8 @@ export const TeamEmailAddDialog = ({ teamId, trigger, ...props }: TeamEmailAddDi
}); });
toast({ toast({
title: _(msg`Success`), title: t`Success`,
description: _(msg`We have sent a confirmation email for verification.`), description: t`We have sent a confirmation email for verification.`,
duration: 5000, duration: 5000,
}); });
@ -87,17 +85,15 @@ export const TeamEmailAddDialog = ({ teamId, trigger, ...props }: TeamEmailAddDi
if (error.code === AppErrorCode.ALREADY_EXISTS) { if (error.code === AppErrorCode.ALREADY_EXISTS) {
form.setError('email', { form.setError('email', {
type: 'manual', type: 'manual',
message: _(msg`This email is already being used by another team.`), message: t`This email is already being used by another team.`,
}); });
return; return;
} }
toast({ toast({
title: _(msg`An unknown error occurred`), title: t`An unknown error occurred`,
description: _( description: t`We encountered an unknown error while attempting to add this email. Please try again later.`,
msg`We encountered an unknown error while attempting to add this email. Please try again later.`,
),
variant: 'destructive', variant: 'destructive',
}); });
} }
@ -150,7 +146,7 @@ export const TeamEmailAddDialog = ({ teamId, trigger, ...props }: TeamEmailAddDi
<Trans>Name</Trans> <Trans>Name</Trans>
</FormLabel> </FormLabel>
<FormControl> <FormControl>
<Input className="bg-background" placeholder="eg. Legal" {...field} /> <Input className="bg-background" placeholder={t`eg. Legal`} {...field} />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>

View File

@ -1,9 +1,7 @@
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 { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import type { TeamEmail } from '@prisma/client'; import type { TeamEmail } from '@prisma/client';
import type * as DialogPrimitive from '@radix-ui/react-dialog'; import type * as DialogPrimitive from '@radix-ui/react-dialog';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
@ -50,7 +48,7 @@ export const TeamEmailUpdateDialog = ({
}: TeamEmailUpdateDialogProps) => { }: TeamEmailUpdateDialogProps) => {
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const { _ } = useLingui(); const { t } = useLingui();
const { toast } = useToast(); const { toast } = useToast();
const { revalidate } = useRevalidator(); const { revalidate } = useRevalidator();
@ -73,8 +71,8 @@ export const TeamEmailUpdateDialog = ({
}); });
toast({ toast({
title: _(msg`Success`), title: t`Success`,
description: _(msg`Team email was updated.`), description: t`Team email was updated.`,
duration: 5000, duration: 5000,
}); });
@ -83,10 +81,8 @@ export const TeamEmailUpdateDialog = ({
setOpen(false); setOpen(false);
} catch (err) { } catch (err) {
toast({ toast({
title: _(msg`An unknown error occurred`), title: t`An unknown error occurred`,
description: _( description: t`We encountered an unknown error while attempting update the team email. Please try again later.`,
msg`We encountered an unknown error while attempting update the team email. Please try again later.`,
),
variant: 'destructive', variant: 'destructive',
}); });
} }
@ -138,7 +134,7 @@ export const TeamEmailUpdateDialog = ({
<Trans>Name</Trans> <Trans>Name</Trans>
</FormLabel> </FormLabel>
<FormControl> <FormControl>
<Input className="bg-background" placeholder="eg. Legal" {...field} /> <Input className="bg-background" placeholder={t`eg. Legal`} {...field} />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>

View File

@ -1,9 +1,7 @@
import { useState } from 'react'; import { useState } from 'react';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { msg } from '@lingui/core/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import type { Webhook } from '@prisma/client'; import type { Webhook } from '@prisma/client';
import { WebhookTriggerEvents } from '@prisma/client'; import { WebhookTriggerEvents } from '@prisma/client';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
@ -52,7 +50,7 @@ const ZTestWebhookFormSchema = z.object({
type TTestWebhookFormSchema = z.infer<typeof ZTestWebhookFormSchema>; type TTestWebhookFormSchema = z.infer<typeof ZTestWebhookFormSchema>;
export const WebhookTestDialog = ({ webhook, children }: WebhookTestDialogProps) => { export const WebhookTestDialog = ({ webhook, children }: WebhookTestDialogProps) => {
const { _ } = useLingui(); const { t } = useLingui();
const { toast } = useToast(); const { toast } = useToast();
const team = useCurrentTeam(); const team = useCurrentTeam();
@ -77,18 +75,16 @@ export const WebhookTestDialog = ({ webhook, children }: WebhookTestDialogProps)
}); });
toast({ toast({
title: _(msg`Test webhook sent`), title: t`Test webhook sent`,
description: _(msg`The test webhook has been successfully sent to your endpoint.`), description: t`The test webhook has been successfully sent to your endpoint.`,
duration: 5000, duration: 5000,
}); });
setOpen(false); setOpen(false);
} catch (error) { } catch (error) {
toast({ toast({
title: _(msg`Test webhook failed`), title: t`Test webhook failed`,
description: _( description: t`We encountered an error while sending the test webhook. Please check your endpoint and try again.`,
msg`We encountered an error while sending the test webhook. Please check your endpoint and try again.`,
),
variant: 'destructive', variant: 'destructive',
duration: 5000, duration: 5000,
}); });
@ -129,7 +125,7 @@ export const WebhookTestDialog = ({ webhook, children }: WebhookTestDialogProps)
<Select onValueChange={field.onChange} value={field.value}> <Select onValueChange={field.onChange} value={field.value}>
<FormControl> <FormControl>
<SelectTrigger> <SelectTrigger>
<SelectValue placeholder="Select an event type" /> <SelectValue placeholder={t`Select an event type`} />
</SelectTrigger> </SelectTrigger>
</FormControl> </FormControl>
<SelectContent> <SelectContent>

View File

@ -1,5 +1,4 @@
import { useLingui } from '@lingui/react'; import { Trans, useLingui } from '@lingui/react/macro';
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';
@ -45,7 +44,7 @@ export const ConfigureDocumentAdvancedSettings = ({
control, control,
isSubmitting, isSubmitting,
}: ConfigureDocumentAdvancedSettingsProps) => { }: ConfigureDocumentAdvancedSettingsProps) => {
const { _ } = useLingui(); const { t } = useLingui();
const form = useFormContext<TConfigureEmbedFormSchema>(); const form = useFormContext<TConfigureEmbedFormSchema>();
const { features } = useConfigureDocument(); const { features } = useConfigureDocument();
@ -121,13 +120,13 @@ export const ConfigureDocumentAdvancedSettings = ({
<FormControl> <FormControl>
<MultiSelectCombobox <MultiSelectCombobox
options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({ options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({
label: _(option.label), label: t(option.label),
value: option.value, value: option.value,
}))} }))}
selectedValues={field.value} selectedValues={field.value}
onChange={field.onChange} onChange={field.onChange}
className="bg-background w-full" className="bg-background w-full"
emptySelectionPlaceholder="Select signature types" emptySelectionPlaceholder={t`Select signature types`}
/> />
</FormControl> </FormControl>
<FormMessage /> <FormMessage />

View File

@ -1,7 +1,7 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { Trans } from '@lingui/react/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
import { z } from 'zod'; import { z } from 'zod';
@ -46,6 +46,8 @@ export const DocumentSigningAuthPassword = ({
open, open,
onOpenChange, onOpenChange,
}: DocumentSigningAuthPasswordProps) => { }: DocumentSigningAuthPasswordProps) => {
const { t } = useLingui();
const { recipient, isCurrentlyAuthenticating, setIsCurrentlyAuthenticating } = const { recipient, isCurrentlyAuthenticating, setIsCurrentlyAuthenticating } =
useRequiredDocumentSigningAuthContext(); useRequiredDocumentSigningAuthContext();
@ -120,7 +122,7 @@ export const DocumentSigningAuthPassword = ({
<FormControl> <FormControl>
<Input <Input
type="password" type="password"
placeholder="Enter your password" placeholder={t`Enter your password`}
{...field} {...field}
autoComplete="current-password" autoComplete="current-password"
/> />

View File

@ -2,7 +2,7 @@ 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 } from '@lingui/core/macro';
import { Trans } from '@lingui/react/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
import { useNavigate } from 'react-router'; import { useNavigate } from 'react-router';
import { useSearchParams } from 'react-router'; import { useSearchParams } from 'react-router';
@ -48,6 +48,7 @@ export function DocumentSigningRejectDialog({
onRejected, onRejected,
trigger, trigger,
}: DocumentSigningRejectDialogProps) { }: DocumentSigningRejectDialogProps) {
const { t } = useLingui();
const { toast } = useToast(); const { toast } = useToast();
const navigate = useNavigate(); const navigate = useNavigate();
const [searchParams] = useSearchParams(); const [searchParams] = useSearchParams();
@ -141,7 +142,7 @@ export function DocumentSigningRejectDialog({
<Textarea <Textarea
{...field} {...field}
rows={4} rows={4}
placeholder="Please provide a reason for rejecting this document" placeholder={t`Please provide a reason for rejecting this document`}
disabled={form.formState.isSubmitting} disabled={form.formState.isSubmitting}
/> />
</FormControl> </FormControl>

View File

@ -1,5 +1,6 @@
import React, { forwardRef } from 'react'; import React, { forwardRef } from 'react';
import { useLingui } from '@lingui/react/macro';
import { TeamMemberRole } from '@prisma/client'; import { TeamMemberRole } from '@prisma/client';
import type { SelectProps } from '@radix-ui/react-select'; import type { SelectProps } from '@radix-ui/react-select';
import { InfoIcon } from 'lucide-react'; import { InfoIcon } from 'lucide-react';
@ -27,6 +28,8 @@ export const DocumentVisibilitySelect = forwardRef<HTMLButtonElement, DocumentVi
{ currentTeamMemberRole, isTeamSettings = false, disabled, canUpdateVisibility, ...props }, { currentTeamMemberRole, isTeamSettings = false, disabled, canUpdateVisibility, ...props },
ref, ref,
) => { ) => {
const { t } = useLingui();
const isAdmin = currentTeamMemberRole === TeamMemberRole.ADMIN; const isAdmin = currentTeamMemberRole === TeamMemberRole.ADMIN;
const isManager = currentTeamMemberRole === TeamMemberRole.MANAGER; const isManager = currentTeamMemberRole === TeamMemberRole.MANAGER;
const canEdit = isTeamSettings || canUpdateVisibility; const canEdit = isTeamSettings || canUpdateVisibility;
@ -34,7 +37,7 @@ export const DocumentVisibilitySelect = forwardRef<HTMLButtonElement, DocumentVi
return ( return (
<Select {...props} disabled={!canEdit || disabled}> <Select {...props} disabled={!canEdit || disabled}>
<SelectTrigger ref={ref} className="bg-background text-muted-foreground"> <SelectTrigger ref={ref} className="bg-background text-muted-foreground">
<SelectValue data-testid="documentVisibilitySelectValue" placeholder="Everyone" /> <SelectValue data-testid="documentVisibilitySelectValue" placeholder={t`Everyone`} />
</SelectTrigger> </SelectTrigger>
<SelectContent position="popper"> <SelectContent position="popper">

View File

@ -419,7 +419,7 @@ export const AddSettingsFormPartial = ({
void handleAutoSave(); void handleAutoSave();
}} }}
className="bg-background w-full" className="bg-background w-full"
emptySelectionPlaceholder="Select signature types" emptySelectionPlaceholder={t`Select signature types`}
/> />
</FormControl> </FormControl>

View File

@ -1,6 +1,4 @@
import { msg } from '@lingui/core/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import { validateFields as validateDateFields } from '@documenso/lib/advanced-fields-validation/validate-fields'; import { validateFields as validateDateFields } from '@documenso/lib/advanced-fields-validation/validate-fields';
import { type TDateFieldMeta as DateFieldMeta } from '@documenso/lib/types/field-meta'; import { type TDateFieldMeta as DateFieldMeta } from '@documenso/lib/types/field-meta';
@ -25,7 +23,7 @@ export const DateFieldAdvancedSettings = ({
handleFieldChange, handleFieldChange,
handleErrors, handleErrors,
}: DateFieldAdvancedSettingsProps) => { }: DateFieldAdvancedSettingsProps) => {
const { _ } = useLingui(); const { t } = useLingui();
// const handleInput = (field: keyof DateFieldMeta, value: string | boolean) => { // const handleInput = (field: keyof DateFieldMeta, value: string | boolean) => {
// if (field === 'fontSize') { // if (field === 'fontSize') {
@ -67,7 +65,7 @@ export const DateFieldAdvancedSettings = ({
id="fontSize" id="fontSize"
type="number" type="number"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field font size`)} placeholder={t`Field font size`}
value={fieldState.fontSize} value={fieldState.fontSize}
onChange={(e) => handleInput('fontSize', e.target.value)} onChange={(e) => handleInput('fontSize', e.target.value)}
min={8} min={8}
@ -85,7 +83,7 @@ export const DateFieldAdvancedSettings = ({
onValueChange={(value) => handleInput('textAlign', value)} onValueChange={(value) => handleInput('textAlign', value)}
> >
<SelectTrigger className="bg-background mt-2"> <SelectTrigger className="bg-background mt-2">
<SelectValue placeholder="Select text align" /> <SelectValue placeholder={t`Select text align`} />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>

View File

@ -1,6 +1,4 @@
import { msg } from '@lingui/core/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import { validateFields as validateEmailFields } from '@documenso/lib/advanced-fields-validation/validate-fields'; import { validateFields as validateEmailFields } from '@documenso/lib/advanced-fields-validation/validate-fields';
import { type TEmailFieldMeta as EmailFieldMeta } from '@documenso/lib/types/field-meta'; import { type TEmailFieldMeta as EmailFieldMeta } from '@documenso/lib/types/field-meta';
@ -25,7 +23,7 @@ export const EmailFieldAdvancedSettings = ({
handleFieldChange, handleFieldChange,
handleErrors, handleErrors,
}: EmailFieldAdvancedSettingsProps) => { }: EmailFieldAdvancedSettingsProps) => {
const { _ } = useLingui(); const { t } = useLingui();
const handleInput = (field: keyof EmailFieldMeta, value: string | boolean) => { const handleInput = (field: keyof EmailFieldMeta, value: string | boolean) => {
const fontSize = field === 'fontSize' ? Number(value) : Number(fieldState.fontSize ?? 14); const fontSize = field === 'fontSize' ? Number(value) : Number(fieldState.fontSize ?? 14);
@ -49,7 +47,7 @@ export const EmailFieldAdvancedSettings = ({
id="fontSize" id="fontSize"
type="number" type="number"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field font size`)} placeholder={t`Field font size`}
value={fieldState.fontSize} value={fieldState.fontSize}
onChange={(e) => handleInput('fontSize', e.target.value)} onChange={(e) => handleInput('fontSize', e.target.value)}
min={8} min={8}
@ -67,7 +65,7 @@ export const EmailFieldAdvancedSettings = ({
onValueChange={(value) => handleInput('textAlign', value)} onValueChange={(value) => handleInput('textAlign', value)}
> >
<SelectTrigger className="bg-background mt-2"> <SelectTrigger className="bg-background mt-2">
<SelectValue placeholder="Select text align" /> <SelectValue placeholder={t`Select text align`} />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>

View File

@ -1,6 +1,4 @@
import { msg } from '@lingui/core/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import { validateFields as validateInitialsFields } from '@documenso/lib/advanced-fields-validation/validate-fields'; import { validateFields as validateInitialsFields } from '@documenso/lib/advanced-fields-validation/validate-fields';
import { type TInitialsFieldMeta as InitialsFieldMeta } from '@documenso/lib/types/field-meta'; import { type TInitialsFieldMeta as InitialsFieldMeta } from '@documenso/lib/types/field-meta';
@ -20,7 +18,7 @@ export const InitialsFieldAdvancedSettings = ({
handleFieldChange, handleFieldChange,
handleErrors, handleErrors,
}: InitialsFieldAdvancedSettingsProps) => { }: InitialsFieldAdvancedSettingsProps) => {
const { _ } = useLingui(); const { t } = useLingui();
const handleInput = (field: keyof InitialsFieldMeta, value: string | boolean) => { const handleInput = (field: keyof InitialsFieldMeta, value: string | boolean) => {
const fontSize = field === 'fontSize' ? Number(value) : Number(fieldState.fontSize ?? 14); const fontSize = field === 'fontSize' ? Number(value) : Number(fieldState.fontSize ?? 14);
@ -44,7 +42,7 @@ export const InitialsFieldAdvancedSettings = ({
id="fontSize" id="fontSize"
type="number" type="number"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field font size`)} placeholder={t`Field font size`}
value={fieldState.fontSize} value={fieldState.fontSize}
onChange={(e) => handleInput('fontSize', e.target.value)} onChange={(e) => handleInput('fontSize', e.target.value)}
min={8} min={8}
@ -62,7 +60,7 @@ export const InitialsFieldAdvancedSettings = ({
onValueChange={(value) => handleInput('textAlign', value)} onValueChange={(value) => handleInput('textAlign', value)}
> >
<SelectTrigger className="bg-background mt-2"> <SelectTrigger className="bg-background mt-2">
<SelectValue placeholder="Select text align" /> <SelectValue placeholder={t`Select text align`} />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>

View File

@ -1,6 +1,4 @@
import { msg } from '@lingui/core/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import { validateFields as validateNameFields } from '@documenso/lib/advanced-fields-validation/validate-fields'; import { validateFields as validateNameFields } from '@documenso/lib/advanced-fields-validation/validate-fields';
import { type TNameFieldMeta as NameFieldMeta } from '@documenso/lib/types/field-meta'; import { type TNameFieldMeta as NameFieldMeta } from '@documenso/lib/types/field-meta';
@ -25,7 +23,7 @@ export const NameFieldAdvancedSettings = ({
handleFieldChange, handleFieldChange,
handleErrors, handleErrors,
}: NameFieldAdvancedSettingsProps) => { }: NameFieldAdvancedSettingsProps) => {
const { _ } = useLingui(); const { t } = useLingui();
const handleInput = (field: keyof NameFieldMeta, value: string | boolean) => { const handleInput = (field: keyof NameFieldMeta, value: string | boolean) => {
const fontSize = field === 'fontSize' ? Number(value) : Number(fieldState.fontSize ?? 14); const fontSize = field === 'fontSize' ? Number(value) : Number(fieldState.fontSize ?? 14);
@ -49,7 +47,7 @@ export const NameFieldAdvancedSettings = ({
id="fontSize" id="fontSize"
type="number" type="number"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field font size`)} placeholder={t`Field font size`}
value={fieldState.fontSize} value={fieldState.fontSize}
onChange={(e) => handleInput('fontSize', e.target.value)} onChange={(e) => handleInput('fontSize', e.target.value)}
min={8} min={8}
@ -67,7 +65,7 @@ export const NameFieldAdvancedSettings = ({
onValueChange={(value) => handleInput('textAlign', value)} onValueChange={(value) => handleInput('textAlign', value)}
> >
<SelectTrigger className="bg-background mt-2"> <SelectTrigger className="bg-background mt-2">
<SelectValue placeholder="Select text align" /> <SelectValue placeholder={t`Select text align`} />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>

View File

@ -1,8 +1,6 @@
import { useState } from 'react'; import { useState } from 'react';
import { msg } from '@lingui/core/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import { ChevronDown, ChevronUp } from 'lucide-react'; import { ChevronDown, ChevronUp } from 'lucide-react';
import { validateNumberField } from '@documenso/lib/advanced-fields-validation/validate-number'; import { validateNumberField } from '@documenso/lib/advanced-fields-validation/validate-number';
@ -32,7 +30,7 @@ export const NumberFieldAdvancedSettings = ({
handleFieldChange, handleFieldChange,
handleErrors, handleErrors,
}: NumberFieldAdvancedSettingsProps) => { }: NumberFieldAdvancedSettingsProps) => {
const { _ } = useLingui(); const { t } = useLingui();
const [showValidation, setShowValidation] = useState(false); const [showValidation, setShowValidation] = useState(false);
@ -68,7 +66,7 @@ export const NumberFieldAdvancedSettings = ({
<Input <Input
id="label" id="label"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Label`)} placeholder={t`Label`}
value={fieldState.label} value={fieldState.label}
onChange={(e) => handleFieldChange('label', e.target.value)} onChange={(e) => handleFieldChange('label', e.target.value)}
/> />
@ -80,7 +78,7 @@ export const NumberFieldAdvancedSettings = ({
<Input <Input
id="placeholder" id="placeholder"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Placeholder`)} placeholder={t`Placeholder`}
value={fieldState.placeholder} value={fieldState.placeholder}
onChange={(e) => handleFieldChange('placeholder', e.target.value)} onChange={(e) => handleFieldChange('placeholder', e.target.value)}
/> />
@ -92,7 +90,7 @@ export const NumberFieldAdvancedSettings = ({
<Input <Input
id="value" id="value"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Value`)} placeholder={t`Value`}
value={fieldState.value} value={fieldState.value}
onChange={(e) => handleInput('value', e.target.value)} onChange={(e) => handleInput('value', e.target.value)}
/> />
@ -106,7 +104,7 @@ export const NumberFieldAdvancedSettings = ({
onValueChange={(val) => handleInput('numberFormat', val)} onValueChange={(val) => handleInput('numberFormat', val)}
> >
<SelectTrigger className="text-muted-foreground bg-background mt-2 w-full"> <SelectTrigger className="text-muted-foreground bg-background mt-2 w-full">
<SelectValue placeholder={_(msg`Field format`)} /> <SelectValue placeholder={t`Field format`} />
</SelectTrigger> </SelectTrigger>
<SelectContent position="popper"> <SelectContent position="popper">
{numberFormatValues.map((item, index) => ( {numberFormatValues.map((item, index) => (
@ -126,7 +124,7 @@ export const NumberFieldAdvancedSettings = ({
id="fontSize" id="fontSize"
type="number" type="number"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field font size`)} placeholder={t`Field font size`}
value={fieldState.fontSize} value={fieldState.fontSize}
onChange={(e) => handleInput('fontSize', e.target.value)} onChange={(e) => handleInput('fontSize', e.target.value)}
min={8} min={8}
@ -144,7 +142,7 @@ export const NumberFieldAdvancedSettings = ({
onValueChange={(value) => handleInput('textAlign', value)} onValueChange={(value) => handleInput('textAlign', value)}
> >
<SelectTrigger className="bg-background mt-2"> <SelectTrigger className="bg-background mt-2">
<SelectValue placeholder="Select text align" /> <SelectValue placeholder={t`Select text align`} />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
@ -198,7 +196,7 @@ export const NumberFieldAdvancedSettings = ({
<Input <Input
id="minValue" id="minValue"
className="bg-background mt-2" className="bg-background mt-2"
placeholder="E.g. 0" placeholder={t`E.g. 0`}
value={fieldState.minValue ?? ''} value={fieldState.minValue ?? ''}
onChange={(e) => handleInput('minValue', e.target.value)} onChange={(e) => handleInput('minValue', e.target.value)}
/> />
@ -210,7 +208,7 @@ export const NumberFieldAdvancedSettings = ({
<Input <Input
id="maxValue" id="maxValue"
className="bg-background mt-2" className="bg-background mt-2"
placeholder="E.g. 100" placeholder={t`E.g. 100`}
value={fieldState.maxValue ?? ''} value={fieldState.maxValue ?? ''}
onChange={(e) => handleInput('maxValue', e.target.value)} onChange={(e) => handleInput('maxValue', e.target.value)}
/> />

View File

@ -1,6 +1,4 @@
import { msg } from '@lingui/core/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro';
import { validateTextField } from '@documenso/lib/advanced-fields-validation/validate-text'; import { validateTextField } from '@documenso/lib/advanced-fields-validation/validate-text';
import { type TTextFieldMeta as TextFieldMeta } from '@documenso/lib/types/field-meta'; import { type TTextFieldMeta as TextFieldMeta } from '@documenso/lib/types/field-meta';
@ -27,7 +25,7 @@ export const TextFieldAdvancedSettings = ({
handleFieldChange, handleFieldChange,
handleErrors, handleErrors,
}: TextFieldAdvancedSettingsProps) => { }: TextFieldAdvancedSettingsProps) => {
const { _ } = useLingui(); const { t } = useLingui();
const handleInput = (field: keyof TextFieldMeta, value: string | boolean) => { const handleInput = (field: keyof TextFieldMeta, value: string | boolean) => {
const text = field === 'text' ? String(value) : (fieldState.text ?? ''); const text = field === 'text' ? String(value) : (fieldState.text ?? '');
@ -58,7 +56,7 @@ export const TextFieldAdvancedSettings = ({
<Input <Input
id="label" id="label"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field label`)} placeholder={t`Field label`}
value={fieldState.label} value={fieldState.label}
onChange={(e) => handleFieldChange('label', e.target.value)} onChange={(e) => handleFieldChange('label', e.target.value)}
/> />
@ -70,7 +68,7 @@ export const TextFieldAdvancedSettings = ({
<Input <Input
id="placeholder" id="placeholder"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field placeholder`)} placeholder={t`Field placeholder`}
value={fieldState.placeholder} value={fieldState.placeholder}
onChange={(e) => handleFieldChange('placeholder', e.target.value)} onChange={(e) => handleFieldChange('placeholder', e.target.value)}
/> />
@ -83,7 +81,7 @@ export const TextFieldAdvancedSettings = ({
<Textarea <Textarea
id="text" id="text"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Add text to the field`)} placeholder={t`Add text to the field`}
value={fieldState.text} value={fieldState.text}
onChange={(e) => handleInput('text', e.target.value)} onChange={(e) => handleInput('text', e.target.value)}
/> />
@ -98,7 +96,7 @@ export const TextFieldAdvancedSettings = ({
type="number" type="number"
min={0} min={0}
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field character limit`)} placeholder={t`Field character limit`}
value={fieldState.characterLimit} value={fieldState.characterLimit}
onChange={(e) => handleInput('characterLimit', e.target.value)} onChange={(e) => handleInput('characterLimit', e.target.value)}
/> />
@ -112,7 +110,7 @@ export const TextFieldAdvancedSettings = ({
id="fontSize" id="fontSize"
type="number" type="number"
className="bg-background mt-2" className="bg-background mt-2"
placeholder={_(msg`Field font size`)} placeholder={t`Field font size`}
value={fieldState.fontSize} value={fieldState.fontSize}
onChange={(e) => handleInput('fontSize', e.target.value)} onChange={(e) => handleInput('fontSize', e.target.value)}
min={8} min={8}
@ -136,7 +134,7 @@ export const TextFieldAdvancedSettings = ({
}} }}
> >
<SelectTrigger className="bg-background mt-2"> <SelectTrigger className="bg-background mt-2">
<SelectValue placeholder="Select text align" /> <SelectValue placeholder={t`Select text align`} />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>

View File

@ -1,6 +1,7 @@
import * as React from 'react'; import * as React from 'react';
import type { MessageDescriptor } from '@lingui/core'; import type { MessageDescriptor } from '@lingui/core';
import { t } from '@lingui/core/macro';
import { useLingui } from '@lingui/react'; import { useLingui } from '@lingui/react';
import { Trans } from '@lingui/react/macro'; import { Trans } from '@lingui/react/macro';
import { AnimatePresence } from 'framer-motion'; import { AnimatePresence } from 'framer-motion';
@ -43,7 +44,7 @@ type MultiSelectComboboxProps<T = OptionValue> = {
* - Clear all button * - Clear all button
*/ */
export function MultiSelectCombobox<T = OptionValue>({ export function MultiSelectCombobox<T = OptionValue>({
emptySelectionPlaceholder = 'Select values...', emptySelectionPlaceholder = t`Select values...`,
enableClearAllButton, enableClearAllButton,
enableSearch = true, enableSearch = true,
className, className,

View File

@ -1,5 +1,7 @@
import { useState } from 'react'; import { useState } from 'react';
import { useLingui } from '@lingui/react/macro';
import { cn } from '../../lib/utils'; import { cn } from '../../lib/utils';
export type SignaturePadTypeProps = { export type SignaturePadTypeProps = {
@ -9,6 +11,7 @@ export type SignaturePadTypeProps = {
}; };
export const SignaturePadType = ({ className, value, onChange }: SignaturePadTypeProps) => { export const SignaturePadType = ({ className, value, onChange }: SignaturePadTypeProps) => {
const { t } = useLingui();
// Colors don't actually work for text. // Colors don't actually work for text.
const [selectedColor, setSelectedColor] = useState('black'); const [selectedColor, setSelectedColor] = useState('black');
@ -16,7 +19,7 @@ export const SignaturePadType = ({ className, value, onChange }: SignaturePadTyp
<div className={cn('flex h-full w-full items-center justify-center', className)}> <div className={cn('flex h-full w-full items-center justify-center', className)}>
<input <input
data-testid="signature-pad-type-input" data-testid="signature-pad-type-input"
placeholder="Type your signature" placeholder={t`Type your signature`}
className="font-signature w-full bg-transparent px-4 text-center text-7xl text-black placeholder:text-4xl focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 dark:text-white" className="font-signature w-full bg-transparent px-4 text-center text-7xl text-black placeholder:text-4xl focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0 dark:text-white"
// style={{ color: selectedColor }} // style={{ color: selectedColor }}
value={value} value={value}

View File

@ -1,8 +1,7 @@
import { useEffect } from 'react'; import { useEffect } from 'react';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { useLingui } from '@lingui/react/macro'; import { Trans, useLingui } from '@lingui/react/macro';
import { Trans } from '@lingui/react/macro';
import { DocumentVisibility, TeamMemberRole } from '@prisma/client'; import { DocumentVisibility, TeamMemberRole } from '@prisma/client';
import { DocumentDistributionMethod, type Field, type Recipient } from '@prisma/client'; import { DocumentDistributionMethod, type Field, type Recipient } from '@prisma/client';
import { InfoIcon } from 'lucide-react'; import { InfoIcon } from 'lucide-react';
@ -425,7 +424,7 @@ export const AddTemplateSettingsFormPartial = ({
void handleAutoSave(); void handleAutoSave();
}} }}
className="bg-background w-full" className="bg-background w-full"
emptySelectionPlaceholder="Select signature types" emptySelectionPlaceholder={t`Select signature types`}
/> />
</FormControl> </FormControl>