mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-20 18:30:15 +01:00
chore: Translation Fixes, Lint Error Corrections, and Additional Translations (#788)
* fix translation and small lint error * changed from localize to useLocalize hook * changed to useLocalize
This commit is contained in:
Marco Beretta
GitHub
parent
b64cc71d88
commit
74802dd720
26 changed files with 421 additions and 421 deletions
|
|
@ -2,18 +2,14 @@ import React, { useEffect } from 'react';
|
|||
import LoginForm from './LoginForm';
|
||||
import { useAuthContext } from '~/hooks/AuthContext';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import store from '~/store';
|
||||
import { localize } from '~/localization/Translation';
|
||||
import { useLocalize } from '~/hooks';
|
||||
import { useGetStartupConfig } from 'librechat-data-provider';
|
||||
import { GoogleIcon, OpenIDIcon, GithubIcon, DiscordIcon } from '~/components';
|
||||
|
||||
function Login() {
|
||||
const { login, error, isAuthenticated } = useAuthContext();
|
||||
const { data: startupConfig } = useGetStartupConfig();
|
||||
|
||||
const lang = useRecoilValue(store.lang);
|
||||
const localize = useLocalize();
|
||||
|
||||
const navigate = useNavigate();
|
||||
|
||||
|
|
@ -27,23 +23,23 @@ function Login() {
|
|||
<div className="flex min-h-screen flex-col items-center justify-center bg-white pt-6 sm:pt-0">
|
||||
<div className="mt-6 w-96 overflow-hidden bg-white px-6 py-4 sm:max-w-md sm:rounded-lg">
|
||||
<h1 className="mb-4 text-center text-3xl font-semibold">
|
||||
{localize(lang, 'com_auth_welcome_back')}
|
||||
{localize('com_auth_welcome_back')}
|
||||
</h1>
|
||||
{error && (
|
||||
<div
|
||||
className="relative mt-4 rounded border border-red-400 bg-red-100 px-4 py-3 text-red-700"
|
||||
role="alert"
|
||||
>
|
||||
{localize(lang, 'com_auth_error_login')}
|
||||
{localize('com_auth_error_login')}
|
||||
</div>
|
||||
)}
|
||||
<LoginForm onSubmit={login} />
|
||||
{startupConfig?.registrationEnabled && (
|
||||
<p className="my-4 text-center text-sm font-light text-gray-700">
|
||||
{' '}
|
||||
{localize(lang, 'com_auth_no_account')}{' '}
|
||||
{localize('com_auth_no_account')}{' '}
|
||||
<a href="/register" className="p-1 text-green-500 hover:underline">
|
||||
{localize(lang, 'com_auth_sign_up')}
|
||||
{localize('com_auth_sign_up')}
|
||||
</a>
|
||||
</p>
|
||||
)}
|
||||
|
|
@ -64,7 +60,7 @@ function Login() {
|
|||
href={`${startupConfig.serverDomain}/oauth/google`}
|
||||
>
|
||||
<GoogleIcon />
|
||||
<p>{localize(lang, 'com_auth_google_login')}</p>
|
||||
<p>{localize('com_auth_google_login')}</p>
|
||||
</a>
|
||||
</div>
|
||||
</>
|
||||
|
|
@ -96,7 +92,7 @@ function Login() {
|
|||
href={`${startupConfig.serverDomain}/oauth/github`}
|
||||
>
|
||||
<GithubIcon />
|
||||
<p>{localize(lang, 'com_auth_github_login')}</p>
|
||||
<p>{localize('com_auth_github_login')}</p>
|
||||
</a>
|
||||
</div>
|
||||
</>
|
||||
|
|
@ -110,7 +106,7 @@ function Login() {
|
|||
href={`${startupConfig.serverDomain}/oauth/discord`}
|
||||
>
|
||||
<DiscordIcon />
|
||||
<p>{localize(lang, 'com_auth_discord_login')}</p>
|
||||
<p>{localize('com_auth_discord_login')}</p>
|
||||
</a>
|
||||
</div>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,5 @@
|
|||
import { useForm } from 'react-hook-form';
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import store from '~/store';
|
||||
import { localize } from '~/localization/Translation';
|
||||
import { useLocalize } from '~/hooks';
|
||||
import { TLoginUser } from 'librechat-data-provider';
|
||||
|
||||
type TLoginFormProps = {
|
||||
|
|
@ -9,7 +7,7 @@ type TLoginFormProps = {
|
|||
};
|
||||
|
||||
function LoginForm({ onSubmit }: TLoginFormProps) {
|
||||
const lang = useRecoilValue(store.lang);
|
||||
const localize = useLocalize();
|
||||
|
||||
const {
|
||||
register,
|
||||
|
|
@ -30,20 +28,20 @@ function LoginForm({ onSubmit }: TLoginFormProps) {
|
|||
type="text"
|
||||
id="email"
|
||||
autoComplete="email"
|
||||
aria-label={localize(lang, 'com_auth_email')}
|
||||
aria-label={localize('com_auth_email')}
|
||||
{...register('email', {
|
||||
required: localize(lang, 'com_auth_email_required'),
|
||||
required: localize('com_auth_email_required'),
|
||||
minLength: {
|
||||
value: 3,
|
||||
message: localize(lang, 'com_auth_email_min_length'),
|
||||
message: localize('com_auth_email_min_length'),
|
||||
},
|
||||
maxLength: {
|
||||
value: 120,
|
||||
message: localize(lang, 'com_auth_email_max_length'),
|
||||
message: localize('com_auth_email_max_length'),
|
||||
},
|
||||
pattern: {
|
||||
value: /\S+@\S+\.\S+/,
|
||||
message: localize(lang, 'com_auth_email_pattern'),
|
||||
message: localize('com_auth_email_pattern'),
|
||||
},
|
||||
})}
|
||||
aria-invalid={!!errors.email}
|
||||
|
|
@ -54,7 +52,7 @@ function LoginForm({ onSubmit }: TLoginFormProps) {
|
|||
htmlFor="email"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_email_address')}
|
||||
{localize('com_auth_email_address')}
|
||||
</label>
|
||||
</div>
|
||||
{errors.email && (
|
||||
|
|
@ -70,16 +68,16 @@ function LoginForm({ onSubmit }: TLoginFormProps) {
|
|||
type="password"
|
||||
id="password"
|
||||
autoComplete="current-password"
|
||||
aria-label={localize(lang, 'com_auth_password')}
|
||||
aria-label={localize('com_auth_password')}
|
||||
{...register('password', {
|
||||
required: localize(lang, 'com_auth_password_required'),
|
||||
required: localize('com_auth_password_required'),
|
||||
minLength: {
|
||||
value: 8,
|
||||
message: localize(lang, 'com_auth_password_min_length'),
|
||||
message: localize('com_auth_password_min_length'),
|
||||
},
|
||||
maxLength: {
|
||||
value: 40,
|
||||
message: localize(lang, 'com_auth_password_max_length'),
|
||||
message: localize('com_auth_password_max_length'),
|
||||
},
|
||||
})}
|
||||
aria-invalid={!!errors.password}
|
||||
|
|
@ -90,7 +88,7 @@ function LoginForm({ onSubmit }: TLoginFormProps) {
|
|||
htmlFor="password"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_password')}
|
||||
{localize('com_auth_password')}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -102,7 +100,7 @@ function LoginForm({ onSubmit }: TLoginFormProps) {
|
|||
)}
|
||||
</div>
|
||||
<a href="/forgot-password" className="text-sm text-green-500 hover:underline">
|
||||
{localize(lang, 'com_auth_password_forgot')}
|
||||
{localize('com_auth_password_forgot')}
|
||||
</a>
|
||||
<div className="mt-6">
|
||||
<button
|
||||
|
|
@ -111,7 +109,7 @@ function LoginForm({ onSubmit }: TLoginFormProps) {
|
|||
type="submit"
|
||||
className="w-full transform rounded-sm bg-green-500 px-4 py-3 tracking-wide text-white transition-colors duration-200 hover:bg-green-600 focus:bg-green-600 focus:outline-none"
|
||||
>
|
||||
{localize(lang, 'com_auth_continue')}
|
||||
{localize('com_auth_continue')}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,7 @@
|
|||
import { useState, useEffect } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import store from '~/store';
|
||||
import { localize } from '~/localization/Translation';
|
||||
import { useLocalize } from '~/hooks';
|
||||
import {
|
||||
useRegisterUserMutation,
|
||||
TRegisterUser,
|
||||
|
|
@ -15,7 +13,7 @@ function Registration() {
|
|||
const navigate = useNavigate();
|
||||
const { data: startupConfig } = useGetStartupConfig();
|
||||
|
||||
const lang = useRecoilValue(store.lang);
|
||||
const localize = useLocalize();
|
||||
|
||||
const {
|
||||
register,
|
||||
|
|
@ -56,7 +54,7 @@ function Registration() {
|
|||
<div className="flex min-h-screen flex-col items-center justify-center bg-white pt-6 sm:pt-0">
|
||||
<div className="mt-6 w-96 overflow-hidden bg-white px-6 py-4 sm:max-w-md sm:rounded-lg">
|
||||
<h1 className="mb-4 text-center text-3xl font-semibold">
|
||||
{localize(lang, 'com_auth_create_account')}
|
||||
{localize('com_auth_create_account')}
|
||||
</h1>
|
||||
{error && (
|
||||
<div
|
||||
|
|
@ -64,7 +62,7 @@ function Registration() {
|
|||
role="alert"
|
||||
data-testid="registration-error"
|
||||
>
|
||||
{localize(lang, 'com_auth_error_create')} {errorMessage}
|
||||
{localize('com_auth_error_create')} {errorMessage}
|
||||
</div>
|
||||
)}
|
||||
<form
|
||||
|
|
@ -79,16 +77,16 @@ function Registration() {
|
|||
id="name"
|
||||
type="text"
|
||||
autoComplete="name"
|
||||
aria-label={localize(lang, 'com_auth_full_name')}
|
||||
aria-label={localize('com_auth_full_name')}
|
||||
{...register('name', {
|
||||
required: localize(lang, 'com_auth_name_required'),
|
||||
required: localize('com_auth_name_required'),
|
||||
minLength: {
|
||||
value: 3,
|
||||
message: localize(lang, 'com_auth_name_min_length'),
|
||||
message: localize('com_auth_name_min_length'),
|
||||
},
|
||||
maxLength: {
|
||||
value: 80,
|
||||
message: localize(lang, 'com_auth_name_max_length'),
|
||||
message: localize('com_auth_name_max_length'),
|
||||
},
|
||||
})}
|
||||
aria-invalid={!!errors.name}
|
||||
|
|
@ -99,7 +97,7 @@ function Registration() {
|
|||
htmlFor="name"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-sm text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_full_name')}
|
||||
{localize('com_auth_full_name')}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -115,16 +113,16 @@ function Registration() {
|
|||
<input
|
||||
type="text"
|
||||
id="username"
|
||||
aria-label={localize(lang, 'com_auth_username')}
|
||||
aria-label={localize('com_auth_username')}
|
||||
{...register('username', {
|
||||
required: localize(lang, 'com_auth_username_required'),
|
||||
required: localize('com_auth_username_required'),
|
||||
minLength: {
|
||||
value: 3,
|
||||
message: localize(lang, 'com_auth_username_min_length'),
|
||||
message: localize('com_auth_username_min_length'),
|
||||
},
|
||||
maxLength: {
|
||||
value: 20,
|
||||
message: localize(lang, 'com_auth_username_max_length'),
|
||||
message: localize('com_auth_username_max_length'),
|
||||
},
|
||||
})}
|
||||
aria-invalid={!!errors.username}
|
||||
|
|
@ -136,7 +134,7 @@ function Registration() {
|
|||
htmlFor="username"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-sm text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_username')}
|
||||
{localize('com_auth_username')}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -153,20 +151,20 @@ function Registration() {
|
|||
type="email"
|
||||
id="email"
|
||||
autoComplete="email"
|
||||
aria-label={localize(lang, 'com_auth_email')}
|
||||
aria-label={localize('com_auth_email')}
|
||||
{...register('email', {
|
||||
required: localize(lang, 'com_auth_email_required'),
|
||||
required: localize('com_auth_email_required'),
|
||||
minLength: {
|
||||
value: 3,
|
||||
message: localize(lang, 'com_auth_email_min_length'),
|
||||
message: localize('com_auth_email_min_length'),
|
||||
},
|
||||
maxLength: {
|
||||
value: 120,
|
||||
message: localize(lang, 'com_auth_email_max_length'),
|
||||
message: localize('com_auth_email_max_length'),
|
||||
},
|
||||
pattern: {
|
||||
value: /\S+@\S+\.\S+/,
|
||||
message: localize(lang, 'com_auth_email_pattern'),
|
||||
message: localize('com_auth_email_pattern'),
|
||||
},
|
||||
})}
|
||||
aria-invalid={!!errors.email}
|
||||
|
|
@ -177,7 +175,7 @@ function Registration() {
|
|||
htmlFor="email"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-sm text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_email')}
|
||||
{localize('com_auth_email')}
|
||||
</label>
|
||||
</div>
|
||||
{errors.email && (
|
||||
|
|
@ -194,16 +192,16 @@ function Registration() {
|
|||
id="password"
|
||||
data-testid="password"
|
||||
autoComplete="current-password"
|
||||
aria-label={localize(lang, 'com_auth_password')}
|
||||
aria-label={localize('com_auth_password')}
|
||||
{...register('password', {
|
||||
required: localize(lang, 'com_auth_password_required'),
|
||||
required: localize('com_auth_password_required'),
|
||||
minLength: {
|
||||
value: 8,
|
||||
message: localize(lang, 'com_auth_password_min_length'),
|
||||
message: localize('com_auth_password_min_length'),
|
||||
},
|
||||
maxLength: {
|
||||
value: 128,
|
||||
message: localize(lang, 'com_auth_password_max_length'),
|
||||
message: localize('com_auth_password_max_length'),
|
||||
},
|
||||
})}
|
||||
aria-invalid={!!errors.password}
|
||||
|
|
@ -214,7 +212,7 @@ function Registration() {
|
|||
htmlFor="password"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-sm text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_password')}
|
||||
{localize('com_auth_password')}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -231,7 +229,7 @@ function Registration() {
|
|||
type="password"
|
||||
id="confirm_password"
|
||||
data-testid="confirm_password"
|
||||
aria-label={localize(lang, 'com_auth_password_confirm')}
|
||||
aria-label={localize('com_auth_password_confirm')}
|
||||
// uncomment to block pasting in confirm field
|
||||
// onPaste={(e) => {
|
||||
// e.preventDefault();
|
||||
|
|
@ -239,7 +237,7 @@ function Registration() {
|
|||
// }}
|
||||
{...register('confirm_password', {
|
||||
validate: (value) =>
|
||||
value === password || localize(lang, 'com_auth_password_not_match'),
|
||||
value === password || localize('com_auth_password_not_match'),
|
||||
})}
|
||||
aria-invalid={!!errors.confirm_password}
|
||||
className="peer block w-full appearance-none rounded-t-md border-0 border-b-2 border-gray-300 bg-gray-50 px-2.5 pb-2.5 pt-5 text-sm text-gray-900 focus:border-green-500 focus:outline-none focus:ring-0"
|
||||
|
|
@ -249,7 +247,7 @@ function Registration() {
|
|||
htmlFor="confirm_password"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-sm text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_password_confirm')}
|
||||
{localize('com_auth_password_confirm')}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -273,19 +271,19 @@ function Registration() {
|
|||
aria-label="Submit registration"
|
||||
className="w-full transform rounded-sm bg-green-500 px-4 py-3 tracking-wide text-white transition-colors duration-200 hover:bg-green-600 focus:bg-green-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_continue')}
|
||||
{localize('com_auth_continue')}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<p className="my-4 text-center text-sm font-light text-gray-700">
|
||||
{' '}
|
||||
{localize(lang, 'com_auth_already_have_account')}{' '}
|
||||
{localize('com_auth_already_have_account')}{' '}
|
||||
<a
|
||||
href="/login"
|
||||
aria-label="Login"
|
||||
className="p-1 font-medium text-green-500 hover:underline"
|
||||
>
|
||||
{localize(lang, 'com_auth_login')}
|
||||
{localize('com_auth_login')}
|
||||
</a>
|
||||
</p>
|
||||
{startupConfig?.socialLoginEnabled && (
|
||||
|
|
@ -305,7 +303,7 @@ function Registration() {
|
|||
href={`${startupConfig.serverDomain}/oauth/google`}
|
||||
>
|
||||
<GoogleIcon />
|
||||
<p>{localize(lang, 'com_auth_google_login')}</p>
|
||||
<p>{localize('com_auth_google_login')}</p>
|
||||
</a>
|
||||
</div>
|
||||
</>
|
||||
|
|
@ -337,7 +335,7 @@ function Registration() {
|
|||
href={`${startupConfig.serverDomain}/oauth/github`}
|
||||
>
|
||||
<GithubIcon />
|
||||
<p>{localize(lang, 'com_auth_github_login')}</p>
|
||||
<p>{localize('com_auth_github_login')}</p>
|
||||
</a>
|
||||
</div>
|
||||
</>
|
||||
|
|
@ -351,7 +349,7 @@ function Registration() {
|
|||
href={`${startupConfig.serverDomain}/oauth/discord`}
|
||||
>
|
||||
<DiscordIcon />
|
||||
<p>{localize(lang, 'com_auth_discord_login')}</p>
|
||||
<p>{localize('com_auth_discord_login')}</p>
|
||||
</a>
|
||||
</div>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,6 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import store from '~/store';
|
||||
import { localize } from '~/localization/Translation';
|
||||
import { useLocalize } from '~/hooks';
|
||||
import {
|
||||
useRequestPasswordResetMutation,
|
||||
useGetStartupConfig,
|
||||
|
|
@ -11,7 +9,7 @@ import {
|
|||
} from 'librechat-data-provider';
|
||||
|
||||
function RequestPasswordReset() {
|
||||
const lang = useRecoilValue(store.lang);
|
||||
const localize = useLocalize();
|
||||
const {
|
||||
register,
|
||||
handleSubmit,
|
||||
|
|
@ -44,22 +42,22 @@ function RequestPasswordReset() {
|
|||
useEffect(() => {
|
||||
if (requestPasswordReset.isSuccess) {
|
||||
if (config.data?.emailEnabled) {
|
||||
setHeaderText(localize(lang, 'com_auth_reset_password_link_sent'));
|
||||
setBodyText(localize(lang, 'com_auth_reset_password_email_sent'));
|
||||
setHeaderText(localize('com_auth_reset_password_link_sent'));
|
||||
setBodyText(localize('com_auth_reset_password_email_sent'));
|
||||
} else {
|
||||
setHeaderText(localize(lang, 'com_auth_reset_password'));
|
||||
setHeaderText(localize('com_auth_reset_password'));
|
||||
setBodyText(
|
||||
<span>
|
||||
{localize(lang, 'com_auth_click')}{' '}
|
||||
{localize('com_auth_click')}{' '}
|
||||
<a className="text-green-600 hover:underline" href={resetLink}>
|
||||
{localize(lang, 'com_auth_here')}
|
||||
{localize('com_auth_here')}
|
||||
</a>{' '}
|
||||
{localize(lang, 'com_auth_to_reset_your_password')}
|
||||
{localize('com_auth_to_reset_your_password')}
|
||||
</span>,
|
||||
);
|
||||
}
|
||||
} else {
|
||||
setHeaderText(localize(lang, 'com_auth_reset_password'));
|
||||
setHeaderText(localize('com_auth_reset_password'));
|
||||
setBodyText(undefined);
|
||||
}
|
||||
}, [requestPasswordReset.isSuccess, config.data?.emailEnabled, resetLink, lang]);
|
||||
|
|
@ -73,7 +71,7 @@ function RequestPasswordReset() {
|
|||
className="relative mt-4 rounded border border-red-400 bg-red-100 px-4 py-3 text-red-700"
|
||||
role="alert"
|
||||
>
|
||||
{localize(lang, 'com_auth_error_reset_password')}
|
||||
{localize('com_auth_error_reset_password')}
|
||||
</div>
|
||||
)}
|
||||
{bodyText ? (
|
||||
|
|
@ -96,20 +94,20 @@ function RequestPasswordReset() {
|
|||
type="email"
|
||||
id="email"
|
||||
autoComplete="off"
|
||||
aria-label={localize(lang, 'com_auth_email')}
|
||||
aria-label={localize('com_auth_email')}
|
||||
{...register('email', {
|
||||
required: localize(lang, 'com_auth_email_required'),
|
||||
required: localize('com_auth_email_required'),
|
||||
minLength: {
|
||||
value: 3,
|
||||
message: localize(lang, 'com_auth_email_min_length'),
|
||||
message: localize('com_auth_email_min_length'),
|
||||
},
|
||||
maxLength: {
|
||||
value: 120,
|
||||
message: localize(lang, 'com_auth_email_max_length'),
|
||||
message: localize('com_auth_email_max_length'),
|
||||
},
|
||||
pattern: {
|
||||
value: /\S+@\S+\.\S+/,
|
||||
message: localize(lang, 'com_auth_email_pattern'),
|
||||
message: localize('com_auth_email_pattern'),
|
||||
},
|
||||
})}
|
||||
aria-invalid={!!errors.email}
|
||||
|
|
@ -120,7 +118,7 @@ function RequestPasswordReset() {
|
|||
htmlFor="email"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_email_address')}
|
||||
{localize('com_auth_email_address')}
|
||||
</label>
|
||||
</div>
|
||||
{errors.email && (
|
||||
|
|
@ -136,7 +134,7 @@ function RequestPasswordReset() {
|
|||
disabled={!!errors.email}
|
||||
className="w-full rounded-sm border border-transparent bg-green-500 px-4 py-2 text-sm font-medium text-white shadow-sm hover:bg-green-600 focus:outline-none active:bg-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_continue')}
|
||||
{localize('com_auth_continue')}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@ import { useResetPasswordMutation, TResetPassword } from 'librechat-data-provide
|
|||
import { useNavigate, useSearchParams } from 'react-router-dom';
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import store from '~/store';
|
||||
import { localize } from '~/localization/Translation';
|
||||
import { useLocalize } from '~/hooks';
|
||||
|
||||
function ResetPassword() {
|
||||
const lang = useRecoilValue(store.lang);
|
||||
const localize = useLocalize();
|
||||
const {
|
||||
register,
|
||||
handleSubmit,
|
||||
|
|
@ -33,20 +33,20 @@ function ResetPassword() {
|
|||
<div className="flex min-h-screen flex-col items-center justify-center bg-white pt-6 sm:pt-0">
|
||||
<div className="mt-6 w-96 overflow-hidden bg-white px-6 py-4 sm:max-w-md sm:rounded-lg">
|
||||
<h1 className="mb-4 text-center text-3xl font-semibold">
|
||||
{localize(lang, 'com_auth_reset_password_success')}
|
||||
{localize('com_auth_reset_password_success')}
|
||||
</h1>
|
||||
<div
|
||||
className="relative mb-8 mt-4 rounded border border-green-400 bg-green-100 px-4 py-3 text-center text-green-700"
|
||||
role="alert"
|
||||
>
|
||||
{localize(lang, 'com_auth_login_with_new_password')}
|
||||
{localize('com_auth_login_with_new_password')}
|
||||
</div>
|
||||
<button
|
||||
onClick={() => navigate('/login')}
|
||||
aria-label={localize(lang, 'com_auth_sign_in')}
|
||||
aria-label={localize('com_auth_sign_in')}
|
||||
className="w-full transform rounded-sm bg-green-500 px-4 py-3 tracking-wide text-white transition-colors duration-200 hover:bg-green-600 focus:bg-green-600 focus:outline-none"
|
||||
>
|
||||
{localize(lang, 'com_auth_continue')}
|
||||
{localize('com_auth_continue')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -56,18 +56,18 @@ function ResetPassword() {
|
|||
<div className="flex min-h-screen flex-col items-center justify-center bg-white pt-6 sm:pt-0">
|
||||
<div className="mt-6 w-96 overflow-hidden bg-white px-6 py-4 sm:max-w-md sm:rounded-lg">
|
||||
<h1 className="mb-4 text-center text-3xl font-semibold">
|
||||
{localize(lang, 'com_auth_reset_password')}
|
||||
{localize('com_auth_reset_password')}
|
||||
</h1>
|
||||
{resetError && (
|
||||
<div
|
||||
className="relative mt-4 rounded border border-red-400 bg-red-100 px-4 py-3 text-red-700"
|
||||
role="alert"
|
||||
>
|
||||
{localize(lang, 'com_auth_error_invalid_reset_token')}{' '}
|
||||
{localize('com_auth_error_invalid_reset_token')}{' '}
|
||||
<a className="font-semibold text-green-600 hover:underline" href="/forgot-password">
|
||||
{localize(lang, 'com_auth_click_here')}
|
||||
{localize('com_auth_click_here')}
|
||||
</a>{' '}
|
||||
{localize(lang, 'com_auth_to_try_again')}
|
||||
{localize('com_auth_to_try_again')}
|
||||
</div>
|
||||
)}
|
||||
<form
|
||||
|
|
@ -96,16 +96,16 @@ function ResetPassword() {
|
|||
type="password"
|
||||
id="password"
|
||||
autoComplete="current-password"
|
||||
aria-label={localize(lang, 'com_auth_password')}
|
||||
aria-label={localize('com_auth_password')}
|
||||
{...register('password', {
|
||||
required: localize(lang, 'com_auth_password_required'),
|
||||
required: localize('com_auth_password_required'),
|
||||
minLength: {
|
||||
value: 8,
|
||||
message: localize(lang, 'com_auth_password_min_length'),
|
||||
message: localize('com_auth_password_min_length'),
|
||||
},
|
||||
maxLength: {
|
||||
value: 128,
|
||||
message: localize(lang, 'com_auth_password_max_length'),
|
||||
message: localize('com_auth_password_max_length'),
|
||||
},
|
||||
})}
|
||||
aria-invalid={!!errors.password}
|
||||
|
|
@ -116,7 +116,7 @@ function ResetPassword() {
|
|||
htmlFor="password"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-sm text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_password')}
|
||||
{localize('com_auth_password')}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -132,7 +132,7 @@ function ResetPassword() {
|
|||
<input
|
||||
type="password"
|
||||
id="confirm_password"
|
||||
aria-label={localize(lang, 'com_auth_password_confirm')}
|
||||
aria-label={localize('com_auth_password_confirm')}
|
||||
// uncomment to prevent pasting in confirm field
|
||||
onPaste={(e) => {
|
||||
e.preventDefault();
|
||||
|
|
@ -140,7 +140,7 @@ function ResetPassword() {
|
|||
}}
|
||||
{...register('confirm_password', {
|
||||
validate: (value) =>
|
||||
value === password || localize(lang, 'com_auth_password_not_match'),
|
||||
value === password || localize('com_auth_password_not_match'),
|
||||
})}
|
||||
aria-invalid={!!errors.confirm_password}
|
||||
className="peer block w-full appearance-none rounded-t-md border-0 border-b-2 border-gray-300 bg-gray-50 px-2.5 pb-2.5 pt-5 text-sm text-gray-900 focus:border-green-500 focus:outline-none focus:ring-0"
|
||||
|
|
@ -150,7 +150,7 @@ function ResetPassword() {
|
|||
htmlFor="confirm_password"
|
||||
className="absolute left-2.5 top-4 z-10 origin-[0] -translate-y-4 scale-75 transform text-sm text-gray-500 duration-300 peer-placeholder-shown:translate-y-0 peer-placeholder-shown:scale-100 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:text-green-500"
|
||||
>
|
||||
{localize(lang, 'com_auth_password_confirm')}
|
||||
{localize('com_auth_password_confirm')}
|
||||
</label>
|
||||
</div>
|
||||
{errors.confirm_password && (
|
||||
|
|
@ -176,10 +176,10 @@ function ResetPassword() {
|
|||
<button
|
||||
disabled={!!errors.password || !!errors.confirm_password}
|
||||
type="submit"
|
||||
aria-label={localize(lang, 'com_auth_submit_registration')}
|
||||
aria-label={localize('com_auth_submit_registration')}
|
||||
className="w-full transform rounded-sm bg-green-500 px-4 py-3 tracking-wide text-white transition-colors duration-200 hover:bg-green-600 focus:bg-green-600 focus:outline-none"
|
||||
>
|
||||
{localize(lang, 'com_auth_continue')}
|
||||
{localize('com_auth_continue')}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -77,6 +77,7 @@ test('renders registration form', () => {
|
|||
);
|
||||
});
|
||||
|
||||
// eslint-disable-next-line jest/no-commented-out-tests
|
||||
// test('calls registerUser.mutate on registration', async () => {
|
||||
// const mutate = jest.fn();
|
||||
// const { getByTestId, getByRole, history } = setup({
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue