init

frontend/src/pages/NoFamily.tsx

@@ -1,10 +1,12 @@
 import { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
 import { useStore } from '../store/useStore';
 import { authApi, familyApi, inviteLinkApi } from '../api/client';
 import { Users, LogOut, Settings, Plus, Loader2, Eye, EyeOff } from 'lucide-react';
 
 export default function NoFamily() {
+  const { t } = useTranslation();
   const navigate = useNavigate();
   const { user, logout, setUser } = useStore();
 
@@ -37,9 +39,9 @@ export default function NoFamily() {
       }
     } catch (err: any) {
       if (err.response?.status === 400) {
-        setError('Ссылка-приглашение недействительна или истекла');
+        setError(t('noFamily.invalidInvite'));
       } else {
-        setError('Ошибка при присоединении к семье');
+        setError(t('noFamily.joinError'));
       }
     } finally {
       setJoiningFamily(false);
@@ -64,7 +66,7 @@ export default function NoFamily() {
     e.preventDefault();
 
     if (!familyName.trim()) {
-      setError('Введите название семьи');
+      setError(t('noFamily.enterFamilyName'));
       return;
     }
 
@@ -87,12 +89,12 @@ export default function NoFamily() {
       if (err && typeof err === 'object' && 'response' in err) {
         const axiosError = err as { response?: { status?: number } };
         if (axiosError.response?.status === 409) {
-          setError('Вы уже состоите в семье');
+          setError(t('noFamily.alreadyInFamily'));
         } else {
-          setError('Ошибка при создании семьи');
+          setError(t('noFamily.createError'));
         }
       } else {
-        setError('Ошибка при создании семьи');
+        setError(t('noFamily.createError'));
       }
       console.error(err);
     } finally {
@@ -105,7 +107,7 @@ export default function NoFamily() {
       <div className="min-h-screen flex items-center justify-center gradient-bg">
         <div className="flex items-center gap-3 text-white">
           <Loader2 className="w-8 h-8 animate-spin" />
-          <span className="text-xl font-medium">Присоединение к семье...</span>
+          <span className="text-xl font-medium">{t('noFamily.joiningFamily')}</span>
         </div>
       </div>
     );
@@ -120,7 +122,7 @@ export default function NoFamily() {
               <Users className="w-12 h-12" />
             </div>
             <h1 className="text-2xl sm:text-3xl font-bold text-gray-900 mb-2">
-              Добро пожаловать!
+              {t('noFamily.welcome')}
             </h1>
             <p className="text-gray-600">
               <span className="font-semibold text-purple-600">{user?.email || user?.username}</span>
@@ -129,7 +131,7 @@ export default function NoFamily() {
 
           <form onSubmit={handleCreateFamily} className="mb-6">
             <h2 className="text-lg font-semibold text-gray-800 mb-4 text-center">
-              Создайте свою семью
+              {t('noFamily.createFamily')}
             </h2>
 
             {error && (
@@ -141,14 +143,14 @@ export default function NoFamily() {
             <div className="space-y-4">
               <div>
                 <label htmlFor="familyName" className="block text-sm font-medium text-gray-700 mb-1">
-                  Название семьи *
+                  {t('noFamily.familyNameRequired')}
                 </label>
                 <input
                   type="text"
                   id="familyName"
                   value={familyName}
                   onChange={(e) => setFamilyName(e.target.value)}
-                  placeholder="Например: Семья Ивановых"
+                  placeholder={t('noFamily.familyNamePlaceholder')}
                   className="w-full px-4 py-3 border-2 border-gray-300 rounded-xl focus:border-purple-500 focus:outline-none transition-colors"
                   disabled={loading}
                 />
@@ -156,7 +158,7 @@ export default function NoFamily() {
 
               <div>
                 <label htmlFor="password" className="block text-sm font-medium text-gray-700 mb-1">
-                  Пароль <span className="text-gray-400">(необязательно)</span>
+                  {t('noFamily.password')} <span className="text-gray-400">{t('noFamily.passwordOptional')}</span>
                 </label>
                 <div className="relative">
                   <input
@@ -164,7 +166,7 @@ export default function NoFamily() {
                     id="password"
                     value={password}
                     onChange={(e) => setPassword(e.target.value)}
-                    placeholder="Для защиты доступа"
+                    placeholder={t('noFamily.passwordPlaceholder')}
                     className="w-full px-4 py-3 pr-12 border-2 border-gray-300 rounded-xl focus:border-purple-500 focus:outline-none transition-colors"
                     disabled={loading}
                   />
@@ -177,7 +179,7 @@ export default function NoFamily() {
                   </button>
                 </div>
                 <p className="mt-1 text-xs text-gray-500">
-                  Пароль понадобится для доступа к бюджету семьи
+                  {t('noFamily.passwordHint')}
                 </p>
               </div>
 
@@ -191,7 +193,7 @@ export default function NoFamily() {
                 ) : (
                   <>
                     <Plus className="w-5 h-5" />
-                    Создать семью
+                    {t('noFamily.createButton')}
                   </>
                 )}
               </button>
@@ -206,7 +208,7 @@ export default function NoFamily() {
                   className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-2xl transition-all duration-300 font-medium"
                 >
                   <Settings className="w-5 h-5" />
-                  Админ панель
+                  {t('noFamily.adminPanel')}
                 </button>
               )}
               <button
@@ -214,7 +216,7 @@ export default function NoFamily() {
                 className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-2xl transition-all duration-300 font-medium"
               >
                 <LogOut className="w-5 h-5" />
-                Выйти
+                {t('common.logout')}
               </button>
             </div>
           </div>