dashboard

This commit is contained in:
2026-03-03 15:10:14 +00:00
parent 97d62a61f1
commit 8dc232f2fe
2 changed files with 51 additions and 41 deletions

View File

@@ -27,25 +27,29 @@ export const Header = () => {
{/* Desktop Navigation */}
<nav className="hidden md:flex items-center gap-4">
<Link
to="/explorar"
className="flex items-center gap-1.5 text-sm font-medium text-slate-700 hover:text-indigo-600 transition-colors px-3 py-1.5 rounded-lg hover:bg-indigo-50"
>
<MapPin size={16} />
<span>Barbearias</span>
</Link>
{user?.role !== 'barbearia' && (
<>
<Link
to="/explorar"
className="flex items-center gap-1.5 text-sm font-medium text-slate-700 hover:text-indigo-600 transition-colors px-3 py-1.5 rounded-lg hover:bg-indigo-50"
>
<MapPin size={16} />
<span>Barbearias</span>
</Link>
<Link
to="/carrinho"
className="relative text-slate-700 hover:text-indigo-600 transition-colors p-2 rounded-lg hover:bg-indigo-50"
>
<ShoppingCart size={18} />
{cart.length > 0 && (
<span className="absolute -right-1 -top-1 rounded-full bg-gradient-to-r from-indigo-500 to-blue-600 px-1.5 py-0.5 text-[10px] font-bold text-white shadow-sm min-w-[18px] text-center">
{cart.length}
</span>
)}
</Link>
<Link
to="/carrinho"
className="relative text-slate-700 hover:text-indigo-600 transition-colors p-2 rounded-lg hover:bg-indigo-50"
>
<ShoppingCart size={18} />
{cart.length > 0 && (
<span className="absolute -right-1 -top-1 rounded-full bg-gradient-to-r from-indigo-500 to-blue-600 px-1.5 py-0.5 text-[10px] font-bold text-white shadow-sm min-w-[18px] text-center">
{cart.length}
</span>
)}
</Link>
</>
)}
{user ? (
<div className="flex items-center gap-2">
@@ -91,28 +95,32 @@ export const Header = () => {
{mobileMenuOpen && (
<div className="md:hidden border-t border-slate-200/60 bg-white/95 backdrop-blur-md animate-in slide-in-from-top">
<nav className="px-4 py-3 space-y-2">
<Link
to="/explorar"
onClick={() => setMobileMenuOpen(false)}
className="flex items-center gap-2 text-sm font-medium text-slate-700 hover:text-amber-600 transition-colors px-3 py-2 rounded-lg hover:bg-amber-50"
>
<MapPin size={16} />
Barbearias
</Link>
{user?.role !== 'barbearia' && (
<>
<Link
to="/explorar"
onClick={() => setMobileMenuOpen(false)}
className="flex items-center gap-2 text-sm font-medium text-slate-700 hover:text-amber-600 transition-colors px-3 py-2 rounded-lg hover:bg-amber-50"
>
<MapPin size={16} />
Barbearias
</Link>
<Link
to="/carrinho"
onClick={() => setMobileMenuOpen(false)}
className="flex items-center gap-2 text-sm font-medium text-slate-700 hover:text-amber-600 transition-colors px-3 py-2 rounded-lg hover:bg-amber-50"
>
<ShoppingCart size={16} />
Carrinho
{cart.length > 0 && (
<span className="ml-auto rounded-full bg-amber-500 px-2 py-0.5 text-[10px] font-bold text-white">
{cart.length}
</span>
)}
</Link>
<Link
to="/carrinho"
onClick={() => setMobileMenuOpen(false)}
className="flex items-center gap-2 text-sm font-medium text-slate-700 hover:text-amber-600 transition-colors px-3 py-2 rounded-lg hover:bg-amber-50"
>
<ShoppingCart size={16} />
Carrinho
{cart.length > 0 && (
<span className="ml-auto rounded-full bg-amber-500 px-2 py-0.5 text-[10px] font-bold text-white">
{cart.length}
</span>
)}
</Link>
</>
)}
{user ? (
<>

View File

@@ -76,7 +76,9 @@ export default function Dashboard() {
if (!user || user.role !== 'barbearia') return <div>Área exclusiva para barbearias.</div>;
if (!shop && !shopsReady) {
// Aguarda o refreshShops terminar antes de declarar que a loja não existe
// ou se shops continua vazio mas shopsReady está a true, dá uma tolerância
if (!shop && (!shopsReady || shops.length === 0)) {
return (
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '60vh' }}>
<div style={{ textAlign: 'center' }}>
@@ -84,7 +86,7 @@ export default function Dashboard() {
width: 40, height: 40, border: '4px solid #e2e8f0', borderTopColor: '#6366f1',
borderRadius: '50%', animation: 'spin 0.8s linear infinite', margin: '0 auto 12px'
}} />
<p style={{ color: '#64748b', fontSize: 14 }}>A carregar painel...</p>
<p style={{ color: '#64748b', fontSize: 14 }}>A preparar painel...</p>
<style>{`@keyframes spin { to { transform: rotate(360deg); } }`}</style>
</div>
</div>