make translate for login, register pages

src/app/ui/login-form.tsx

@@ -3,53 +3,71 @@
 import styles from '@/app/styles/login.module.scss'
 import { useActionState } from 'react';
 import { authorization } from '@/app/actions/auth';
+import { useTranslations } from 'next-intl';
 
 export default function LoginForm() {
 	const [state, formAction, isPending] = useActionState(
 		authorization,
 		undefined,
 	);
+	const t = useTranslations('Login-register-form');
 
 	return (
 		<form action={formAction}>
 			<div className={`${styles['form-group']}`}>
-				<label className={`${styles['form-label']}`}>Email адрес</label>
+				<label className={`${styles['form-label']}`}>
+					{t('email-adress')}
+				</label>
 				<input
 					type="readOnly"
 					id="email"
 					name="email"
 					className={`${styles['form-input']}`}
-					placeholder="Введите ваш email"
+					placeholder={t('enter-email')}
 					defaultValue={state?.previousState?.email ? state?.previousState?.email : ''}
 				/>
 				{state?.error?.email && (
-					<p className={`${styles['form-error']}`}>{state?.error?.email}</p>
+					<p className={`${styles['form-error']}`}>
+						{t(state?.error?.email)}
+					</p>
 				)}
 			</div>
 			<div className={`${styles['form-group']}`}>
-				<label className={`${styles['form-label']}`}>Пароль</label>
+				<label className={`${styles['form-label']}`}>
+					{t('password')}
+				</label>
 				<input
 					type="password"
 					id="password"
 					name="password"
 					className={`${styles['form-input']}`}
-					placeholder="Введите пароль"
+					placeholder={t('enter-password')}
 				/>
 				{state?.error?.password && (
-					<p className={`${styles['form-error']}`}>{state?.error?.password}</p>
+					<p className={`${styles['form-error']}`}>
+						{t(state?.error?.password)}
+					</p>
 				)}
 			</div>
 			{state?.error.server && (
-				<p className={`${styles['form-error']}`}>{state?.error.server}</p>
+				<p className={`${styles['form-error']}`}>
+					{t(state?.error.server)}
+				</p>
 			)}
 			<div className={`${styles['form-options']}`}>
 				<div className={`${styles['form-checkbox']}`}>
 					<input type="checkbox" id="remember" name="remember" />
-					<label>Запомнить меня</label>
+					<label>
+						{t('remember-me')}
+					</label>
 				</div>
-				<a href="forgot-password" className={`${styles['forgot-password']}`} >Забыли пароль?</a>
+				<a href="forgot-password" className={`${styles['forgot-password']}`} >
+					{t('forgot-password')}?
+				</a>
 			</div>
-			<button type="submit" className={`${styles['btn']}`}>Войти в систему</button>
+			<button type="submit" className={`${styles['btn']}`}>
+				{t('sign-in')}
+			</button>
 		</form>
 	)
 }