Massive bug fix. Clear button added into fields.

This commit is contained in:
AG
2025-12-05 20:31:02 +02:00
parent 41d1d0f16a
commit 27afacee3f
14 changed files with 155 additions and 120 deletions

View File

@@ -1,4 +1,5 @@
import React, { useState } from 'react';
import FilledInput from './FilledInput';
import { login, changePassword } from '../services/auth';
import { User, Language } from '../types';
import { Dumbbell, ArrowRight, Lock, Mail, Globe } from 'lucide-react';
@@ -58,15 +59,12 @@ const Login: React.FC<LoginProps> = ({ onLogin, language, onLanguageChange }) =>
<p className="text-sm text-on-surface-variant mb-6">{t('change_pass_desc', language)}</p>
<div className="space-y-4">
<div className="bg-surface-container-high rounded-t-lg border-b border-outline-variant px-4 py-2">
<label className="text-[10px] text-on-surface-variant font-medium">{t('change_pass_new', language)}</label>
<input
type="password"
className="w-full bg-transparent text-lg text-on-surface focus:outline-none pt-1"
value={newPassword}
onChange={(e) => setNewPassword(e.target.value)}
/>
</div>
<FilledInput
label={t('change_pass_new', language)}
value={newPassword}
onChange={(e) => setNewPassword(e.target.value)}
type="password"
/>
<button
onClick={handleChangePassword}
className="w-full py-3 bg-primary text-on-primary rounded-full font-medium"
@@ -104,32 +102,22 @@ const Login: React.FC<LoginProps> = ({ onLogin, language, onLanguageChange }) =>
<form onSubmit={handleLogin} className="w-full max-w-sm space-y-6">
<div className="space-y-4">
<div className="group bg-surface-container-high rounded-t-lg border-b border-outline-variant focus-within:border-primary transition-colors">
<div className="flex items-center px-4 pt-4">
<Mail size={16} className="text-on-surface-variant mr-2" />
<label className="text-xs text-on-surface-variant font-medium">{t('login_email', language)}</label>
</div>
<input
type="email"
value={email}
onChange={(e) => setEmail(e.target.value)}
className="w-full bg-transparent px-4 pb-3 pt-1 text-lg text-on-surface focus:outline-none"
placeholder="user@gymflow.ai"
/>
</div>
<FilledInput
label={t('login_email', language)}
value={email}
onChange={(e) => setEmail(e.target.value)}
type="email"
icon={<Mail size={16} />}
inputMode="email"
/>
<div className="group bg-surface-container-high rounded-t-lg border-b border-outline-variant focus-within:border-primary transition-colors">
<div className="flex items-center px-4 pt-4">
<Lock size={16} className="text-on-surface-variant mr-2" />
<label className="text-xs text-on-surface-variant font-medium">{t('login_password', language)}</label>
</div>
<input
type="password"
value={password}
onChange={(e) => setPassword(e.target.value)}
className="w-full bg-transparent px-4 pb-3 pt-1 text-lg text-on-surface focus:outline-none"
/>
</div>
<FilledInput
label={t('login_password', language)}
value={password}
onChange={(e) => setPassword(e.target.value)}
type="password"
icon={<Lock size={16} />}
/>
</div>
{error && <div className="text-error text-sm text-center bg-error-container/10 p-2 rounded-lg">{error}</div>}