Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 22 additions & 9 deletions src/components/auth/LoginPage.jsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { useMemo, useState } from 'react';
import { Eye, EyeOff } from 'lucide-react';
import { authRepository } from '../../repositories';
import { createTenantAuthTicketRedirect } from '../../firebase/authBrokerService';
import {
Expand All @@ -23,6 +24,7 @@ export default function LoginPage() {
const returnTo = useMemo(getReturnToParam, []);
const [email, setEmail] = useState(authRepository.getConfiguredAdminEmail?.() || '');
const [password, setPassword] = useState('');
const [showPassword, setShowPassword] = useState(false);
const [rememberDevice, setRememberDevice] = useState(true);
const [status, setStatus] = useState('idle');
const [message, setMessage] = useState('');
Expand Down Expand Up @@ -174,15 +176,26 @@ export default function LoginPage() {

<label className="block text-sm font-black text-slate-700">
Password
<input
type="password"
value={password}
onChange={(event) => setPassword(event.target.value)}
className="mt-1.5 w-full rounded-2xl border border-slate-200 bg-white px-3 py-3 text-slate-950 outline-none transition focus:border-cyan-400 focus:ring-4 focus:ring-cyan-100"
required
maxLength={MAX_PASSWORD_LENGTH}
autoComplete="current-password"
/>
<div className="relative mt-1.5">
<input
type={showPassword ? 'text' : 'password'}
value={password}
onChange={(event) => setPassword(event.target.value)}
className="w-full rounded-2xl border border-slate-200 bg-white py-3 pl-3 pr-11 text-slate-950 outline-none transition focus:border-cyan-400 focus:ring-4 focus:ring-cyan-100"
required
maxLength={MAX_PASSWORD_LENGTH}
autoComplete="current-password"
/>
<button
type="button"
onClick={() => setShowPassword((prev) => !prev)}
className="absolute inset-y-0 right-0 flex items-center pr-3 text-slate-400 hover:text-slate-700 transition"
aria-label={showPassword ? 'Απόκρυψη κωδικού' : 'Εμφάνιση κωδικού'}
title={showPassword ? 'Απόκρυψη κωδικού' : 'Εμφάνιση κωδικού'}
>
{showPassword ? <EyeOff size={18} /> : <Eye size={18} />}
</button>
</div>
</label>

<div className="flex items-center justify-between gap-3 text-sm">
Expand Down
14 changes: 12 additions & 2 deletions src/components/scheduler/AdminLoginModal.jsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { KeyRound, LockKeyhole, Mail, X } from 'lucide-react';
import { Eye, EyeOff, KeyRound, LockKeyhole, Mail, X } from 'lucide-react';
import { useEffect, useState } from 'react';
import { createPortal } from 'react-dom';

Expand All @@ -15,6 +15,7 @@ export default function AdminLoginModal({
email: defaultEmail,
password: '',
});
const [showPassword, setShowPassword] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const [isSendingReset, setIsSendingReset] = useState(false);
const [submitError, setSubmitError] = useState('');
Expand Down Expand Up @@ -139,14 +140,23 @@ export default function AdminLoginModal({
<div className="input-glass mt-1 flex items-center gap-2 rounded-lg border border-slate-300 px-3 py-2 dark:border-cyan-300/45">
<KeyRound size={14} className="text-slate-600 dark:text-slate-300" />
<input
type="password"
type={showPassword ? 'text' : 'password'}
value={credentials.password}
onChange={(event) => setCredentials((prev) => ({ ...prev, password: event.target.value }))}
placeholder="Κωδικός"
className="w-full border-none bg-transparent p-0 text-sm font-semibold text-slate-950 outline-none placeholder:text-slate-500 dark:text-white dark:placeholder:text-slate-400"
required
disabled={!isFirebaseConfigured}
/>
<button
type="button"
onClick={() => setShowPassword((prev) => !prev)}
className="rounded text-slate-400 hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-200 transition"
aria-label={showPassword ? 'Απόκρυψη κωδικού' : 'Εμφάνιση κωδικού'}
title={showPassword ? 'Απόκρυψη κωδικού' : 'Εμφάνιση κωδικού'}
>
{showPassword ? <EyeOff size={16} /> : <Eye size={16} />}
</button>
</div>
</label>

Expand Down