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,6 +1,8 @@
'use client';
import { zodResolver } from '@hookform/resolvers/zod';
import { Trans, msg } from '@lingui/macro';
import { useLingui } from '@lingui/react';
import { useForm } from 'react-hook-form';
import { z } from 'zod';
@ -40,6 +42,7 @@ export type PasswordFormProps = {
};
export const PasswordForm = ({ className }: PasswordFormProps) => {
const { _ } = useLingui();
const { toast } = useToast();
const form = useForm<TPasswordFormSchema>({
@ -65,23 +68,24 @@ export const PasswordForm = ({ className }: PasswordFormProps) => {
form.reset();
toast({
title: 'Password updated',
description: 'Your password has been updated successfully.',
title: _(msg`Password updated`),
description: _(msg`Your password has been updated successfully.`),
duration: 5000,
});
} catch (err) {
if (err instanceof TRPCClientError && err.data?.code === 'BAD_REQUEST') {
toast({
title: 'An error occurred',
title: _(msg`An error occurred`),
description: err.message,
variant: 'destructive',
});
} else {
toast({
title: 'An unknown error occurred',
title: _(msg`An unknown error occurred`),
description: _(
msg`We encountered an unknown error while attempting to update your password. Please try again later.`,
),
variant: 'destructive',
description:
'We encountered an unknown error while attempting to update your password. Please try again later.',
});
}
}
@ -99,7 +103,9 @@ export const PasswordForm = ({ className }: PasswordFormProps) => {
name="currentPassword"
render={({ field }) => (
<FormItem>
<FormLabel>Current Password</FormLabel>
<FormLabel>
<Trans>Current Password</Trans>
</FormLabel>
<FormControl>
<PasswordInput autoComplete="current-password" {...field} />
</FormControl>
@ -113,7 +119,9 @@ export const PasswordForm = ({ className }: PasswordFormProps) => {
name="password"
render={({ field }) => (
<FormItem>
<FormLabel>Password</FormLabel>
<FormLabel>
<Trans>Password</Trans>
</FormLabel>
<FormControl>
<PasswordInput autoComplete="new-password" {...field} />
</FormControl>
@ -127,7 +135,9 @@ export const PasswordForm = ({ className }: PasswordFormProps) => {
name="repeatedPassword"
render={({ field }) => (
<FormItem>
<FormLabel>Repeat Password</FormLabel>
<FormLabel>
<Trans>Repeat Password</Trans>
</FormLabel>
<FormControl>
<PasswordInput autoComplete="new-password" {...field} />
</FormControl>
@ -139,7 +149,7 @@ export const PasswordForm = ({ className }: PasswordFormProps) => {
<div className="ml-auto mt-4">
<Button type="submit" loading={isSubmitting}>
{isSubmitting ? 'Updating password...' : 'Update password'}
{isSubmitting ? <Trans>Updating password...</Trans> : <Trans>Update password</Trans>}
</Button>
</div>
</form>