fix: atualizar icone de senha com olho e corrigir fallback de email

This commit is contained in:
Sidney 2026-06-07 20:29:34 -03:00
parent 73b7e171c9
commit 3d2b41bf56
2 changed files with 49 additions and 20 deletions

View File

@ -1,5 +1,5 @@
import { useState, useEffect } from 'react'; import { useState, useEffect } from 'react';
import { Store, Clock, Globe, Bell, Palette, Shield, Save, Copy, ExternalLink, Check, Link } from 'lucide-react'; import { Store, Clock, Globe, Bell, Palette, Shield, Save, Copy, ExternalLink, Check, Link, Eye, EyeOff } from 'lucide-react';
const tabs = [ const tabs = [
{ id: 'general', label: 'Geral', icon: Store }, { id: 'general', label: 'Geral', icon: Store },
@ -397,25 +397,54 @@ export default function Settings() {
)} )}
{activeTab === 'security' && ( {activeTab === 'security' && (
<div className="card"> <SecurityTab handleSave={handleSave} saved={saved} />
<h3 className="card-title mb-4">Segurança</h3>
<div className="form-group">
<label className="form-label">Senha Atual</label>
<input className="form-input" type="password" placeholder="••••••••" />
</div>
<div className="grid-2">
<div className="form-group">
<label className="form-label">Nova Senha</label>
<input className="form-input" type="password" placeholder="••••••••" />
</div>
<div className="form-group">
<label className="form-label">Confirmar Nova Senha</label>
<input className="form-input" type="password" placeholder="••••••••" />
</div>
</div>
<button className="btn btn-primary mt-4" onClick={handleSave}><Save size={16} /> {saved ? '✓ Salvo!' : 'Salvar'}</button>
</div>
)} )}
</div> </div>
); );
} }
function SecurityTab({ handleSave, saved }: { handleSave: () => void; saved: boolean }) {
const [showCurrent, setShowCurrent] = useState(false);
const [showNew, setShowNew] = useState(false);
const [showConfirm, setShowConfirm] = useState(false);
// Re-importing specific lucide icons dynamically if possible, or we can use a generic button.
// Actually, we can use Eye and EyeOff if we import them at the top. Let's assume they are imported.
// Wait, I need to add the import at the top of the file!
// For now, I'll just use a button that says "Mostrar" or "Ocultar", or try to use Eye/EyeOff.
return (
<div className="card">
<h3 className="card-title mb-4">Segurança</h3>
<div className="form-group">
<label className="form-label">Senha Atual</label>
<div style={{ position: 'relative' }}>
<input className="form-input" type={showCurrent ? "text" : "password"} placeholder="••••••••" style={{ paddingRight: '40px' }} />
<button type="button" className="btn-ghost btn-icon" onClick={() => setShowCurrent(!showCurrent)} style={{ position: 'absolute', right: '4px', top: '50%', transform: 'translateY(-50%)', padding: '4px' }}>
{showCurrent ? <EyeOff size={16} color="var(--text-muted)" /> : <Eye size={16} color="var(--text-muted)" />}
</button>
</div>
</div>
<div className="grid-2">
<div className="form-group">
<label className="form-label">Nova Senha</label>
<div style={{ position: 'relative' }}>
<input className="form-input" type={showNew ? "text" : "password"} placeholder="••••••••" style={{ paddingRight: '40px' }} />
<button type="button" className="btn-ghost btn-icon" onClick={() => setShowNew(!showNew)} style={{ position: 'absolute', right: '4px', top: '50%', transform: 'translateY(-50%)', padding: '4px' }}>
{showNew ? <EyeOff size={16} color="var(--text-muted)" /> : <Eye size={16} color="var(--text-muted)" />}
</button>
</div>
</div>
<div className="form-group">
<label className="form-label">Confirmar Nova Senha</label>
<div style={{ position: 'relative' }}>
<input className="form-input" type={showConfirm ? "text" : "password"} placeholder="••••••••" style={{ paddingRight: '40px' }} />
<button type="button" className="btn-ghost btn-icon" onClick={() => setShowConfirm(!showConfirm)} style={{ position: 'absolute', right: '4px', top: '50%', transform: 'translateY(-50%)', padding: '4px' }}>
{showConfirm ? <EyeOff size={16} color="var(--text-muted)" /> : <Eye size={16} color="var(--text-muted)" />}
</button>
</div>
</div>
</div>
<button className="btn btn-primary mt-4" onClick={handleSave}><Save size={16} /> {saved ? '✓ Salvo!' : 'Salvar'}</button>
</div>
);
}

View File

@ -16,7 +16,7 @@ const mockNotifications = [
export default function Topbar({ title, subtitle, onMenuClick }: TopbarProps) { export default function Topbar({ title, subtitle, onMenuClick }: TopbarProps) {
const [avatarInitials, setAvatarInitials] = useState('AD'); const [avatarInitials, setAvatarInitials] = useState('AD');
const [tenantName, setTenantName] = useState('Administrador'); const [tenantName, setTenantName] = useState('Administrador');
const [email, setEmail] = useState('admin@agendapro.com'); const [email, setEmail] = useState('');
const [showNotifications, setShowNotifications] = useState(false); const [showNotifications, setShowNotifications] = useState(false);
const [showProfile, setShowProfile] = useState(false); const [showProfile, setShowProfile] = useState(false);