Initialize GUI fixed

src/components/InitializeAccount.tsx

@@ -1,7 +1,8 @@
 import React, { useState } from 'react';
 import { initializeAccount } from '../services/auth';
 import { User, Language } from '../types';
-import { Globe, ArrowRight, Check } from 'lucide-react';
+import { Globe, ArrowRight, Check, Calendar } from 'lucide-react';
+import { DatePicker } from './ui/DatePicker';
 import { t } from '../services/i18n';
 
 interface InitializeAccountProps {
@@ -16,7 +17,7 @@ const InitializeAccount: React.FC<InitializeAccountProps> = ({ onInitialized, la
     const [birthDate, setBirthDate] = useState('');
     const [height, setHeight] = useState('');
     const [weight, setWeight] = useState('');
-    const [gender, setGender] = useState<'MALE' | 'FEMALE' | 'OTHER' | ''>('');
+    const [gender, setGender] = useState<'MALE' | 'FEMALE' | 'OTHER'>('MALE');
 
     const handleInitialize = async () => {
         setIsSubmitting(true);
@@ -91,16 +92,13 @@ const InitializeAccount: React.FC<InitializeAccountProps> = ({ onInitialized, la
 
                 <div className="w-full mb-8">
                     <div className="space-y-4 animate-in fade-in slide-in-from-top-2 duration-300">
-                        <div>
+                        <DatePicker
-                            <label htmlFor="birthDate" className="block text-xs text-on-surface-variant mb-1 ml-1">{t('birth_date', language)}</label>
+                            label={t('birth_date', language)}
-                            <input
-                                id="birthDate"
-                                type="date"
                             value={birthDate}
-                                onChange={(e) => setBirthDate(e.target.value)}
+                            onChange={(val) => setBirthDate(val)}
-                                className="w-full p-4 rounded-2xl bg-surface-container-high border border-outline-variant/30 text-on-surface focus:border-primary focus:outline-none transition-all"
+                            maxDate={new Date()}
+                            testId="init-birth-date"
                         />
-                        </div>
                         <div className="grid grid-cols-2 gap-4">
                             <div>
                                 <label htmlFor="height" className="block text-xs text-on-surface-variant mb-1 ml-1">{t('height', language)}</label>
@@ -114,7 +112,7 @@ const InitializeAccount: React.FC<InitializeAccountProps> = ({ onInitialized, la
                                 />
                             </div>
                             <div>
-                                <label htmlFor="weight" className="block text-xs text-on-surface-variant mb-1 ml-1">{t('my_weight', language).split('(')[0].trim()}</label>
+                                <label htmlFor="weight" className="block text-xs text-on-surface-variant mb-1 ml-1">{t('bodyweight', language).split('(')[0].trim()}</label>
                                 <input
                                     id="weight"
                                     type="number"
@@ -133,7 +131,6 @@ const InitializeAccount: React.FC<InitializeAccountProps> = ({ onInitialized, la
                                 onChange={(e) => setGender(e.target.value as any)}
                                 className="w-full p-4 rounded-2xl bg-surface-container-high border border-outline-variant/30 text-on-surface focus:border-primary focus:outline-none transition-all appearance-none"
                             >
-                                <option value="">{t('select_gender', language)}</option>
                                 <option value="MALE">{t('male', language)}</option>
                                 <option value="FEMALE">{t('female', language)}</option>
                                 <option value="OTHER">{t('other', language)}</option>

src/components/Profile.tsx

@@ -302,7 +302,7 @@ const Profile: React.FC<ProfileProps> = ({ user, onLogout, lang, onLanguageChang
                         <h3 className="text-sm font-bold text-primary mb-4">{t('personal_data', lang)}</h3>
                         <div className="grid grid-cols-2 gap-4 mb-4">
                             <div className="bg-surface-container-high rounded-t-lg border-b border-outline-variant px-3 py-2">
-                                <label htmlFor="profileWeight" className="text-[10px] text-on-surface-variant flex gap-1 items-center"><Scale size={10} /> {t('weight_kg', lang)}</label>
+                                <label htmlFor="profileWeight" className="text-[10px] text-on-surface-variant flex gap-1 items-center"><Scale size={10} /> {t('bodyweight', lang)}</label>
                                 <input
                                     id="profileWeight"
                                     data-testid="profile-weight-input"

src/components/Tracker/IdleView.tsx

@@ -95,7 +95,7 @@ const IdleView: React.FC<IdleViewProps> = ({ tracker, lang }) => {
                     <div className="w-full max-w-sm bg-surface-container rounded-2xl p-6 flex flex-col items-center gap-4 shadow-elevation-1">
                         <label className="text-xs text-on-surface-variant font-bold tracking-wide flex items-center gap-2">
                             <User size={14} />
-                            {t('my_weight', lang)}
+                            {t('bodyweight', lang)}
                         </label>
                         <div className="flex items-center gap-4">
                             <input

src/components/ui/DatePicker.tsx

@@ -470,9 +470,19 @@ export const DatePicker: React.FC<DatePickerProps> = ({
                             if (textInputValue && validateDateInput(textInputValue)) {
                                 onChange(textInputValue);
                                 setTextInputValue('');
+                                setIsOpen(false);
+                                (e.target as HTMLInputElement).blur();
+                            } else if (!textInputValue) {
+                                setIsOpen(false);
                                 (e.target as HTMLInputElement).blur();
                             }
                         }
+                        if (e.key === 'Escape') {
+                            setIsOpen(false);
+                            setTextInputValue('');
+                            setTextInputError('');
+                            (e.target as HTMLInputElement).blur();
+                        }
                     }}
                     placeholder={placeholder}
                     disabled={disabled}

src/services/i18n.ts

@@ -51,7 +51,7 @@ const translations = {
     // Tracker
     ready_title: 'Ready?',
     ready_subtitle: 'Start your workout and break records.',
-    my_weight: 'My Weight (kg)',
+    bodyweight: 'Bodyweight (kg)',
     change_in_profile: 'Change in profile',
     last_workout_today: 'Last workout: Today',
     days_off: 'Days off training:',
@@ -275,7 +275,7 @@ const translations = {
     // Tracker
     ready_title: 'Готовы?',
     ready_subtitle: 'Начните тренировку и побейте рекорды.',
-    my_weight: 'Мой вес (кг)',
+    bodyweight: 'Вес тела (кг)',
     change_in_profile: 'Можно изменить в профиле',
     last_workout_today: 'Последняя тренировка: Сегодня',
     days_off: 'Дней без тренировок:',

tests/01_core_auth.spec.ts

@@ -202,8 +202,9 @@ test.describe('I. Core & Authentication', () => {
 
         // Fill data
         await page.getByLabel(/Birth Date|Дата рожд./i).fill('1990-01-01');
+        await page.keyboard.press('Enter');
         await page.getByLabel(/Height|Рост/i).fill('180');
-        await page.getByLabel(/Weight|Мой вес/i).fill('80');
+        await page.getByLabel(/Bodyweight|Вес тела/i).fill('80');
         await page.getByLabel(/Gender|Пол/i).selectOption('MALE');
 
         await page.getByRole('button', { name: /Get Started|Начать работу/i }).click();