Merge pull request #41 from rede5/codex/add-link-to-profile-without-break

Add owner "Meu Perfil" page and keep profile dropdown button on one line
This commit is contained in:
Tiago Yamamoto 2025-12-23 09:23:10 -03:00 committed by GitHub
commit 16d5ef994c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 54 additions and 1 deletions

View file

@ -8,6 +8,7 @@ import { CompanyPage } from './pages/Company'
import { SellerDashboardPage } from './pages/SellerDashboard'
import { EmployeeDashboardPage } from './pages/EmployeeDashboard'
import { DeliveryDashboardPage } from './pages/DeliveryDashboard'
import { MyProfilePage } from './pages/MyProfile'
import { ProtectedRoute } from './components/ProtectedRoute'
import { DashboardLayout } from './layouts/DashboardLayout'
import {
@ -134,6 +135,14 @@ function App() {
</ProtectedRoute>
}
/>
<Route
path="/meu-perfil"
element={
<ProtectedRoute allowedRoles={['owner', 'seller']}>
<MyProfilePage />
</ProtectedRoute>
}
/>
<Route path="/search" element={<Navigate to="/dashboard" replace />} />
<Route path="*" element={<Navigate to="/login" replace />} />
</Routes>

View file

@ -65,7 +65,7 @@ export function Shell({ children }: { children: React.ReactNode }) {
<button
type="button"
onClick={() => setIsProfileOpen((prev) => !prev)}
className="flex items-center gap-2 rounded bg-white/10 px-3 py-1 text-xs font-semibold hover:bg-white/20"
className="flex items-center gap-2 rounded bg-white/10 px-3 py-1 text-xs font-semibold hover:bg-white/20 whitespace-nowrap"
aria-haspopup="true"
aria-expanded={isProfileOpen}
>
@ -77,6 +77,15 @@ export function Shell({ children }: { children: React.ReactNode }) {
</button>
{isProfileOpen && (
<div className="absolute right-0 mt-2 w-48 rounded-md bg-white py-1 text-sm text-gray-700 shadow-lg ring-1 ring-black/5">
{isOwner && (
<Link
to="/meu-perfil"
className="block px-4 py-2 hover:bg-gray-100"
onClick={() => setIsProfileOpen(false)}
>
Meu Perfil
</Link>
)}
{isOwner && (
<Link
to="/company"

View file

@ -0,0 +1,35 @@
import { Shell } from '../layouts/Shell'
import { useAuth } from '../context/AuthContext'
export function MyProfilePage() {
const { user } = useAuth()
return (
<Shell>
<div className="space-y-6 rounded-lg bg-white p-6 shadow-sm">
<div>
<h1 className="text-xl font-semibold text-medicalBlue">Meu Perfil</h1>
<p className="text-sm text-gray-600">Acompanhe as informações básicas da sua conta.</p>
</div>
<div className="grid gap-4 sm:grid-cols-2">
<div className="rounded-md border border-gray-200 p-4">
<p className="text-xs uppercase text-gray-400">Nome</p>
<p className="text-sm font-semibold text-gray-800">{user?.name ?? 'Não informado'}</p>
</div>
<div className="rounded-md border border-gray-200 p-4">
<p className="text-xs uppercase text-gray-400">Perfil</p>
<p className="text-sm font-semibold text-gray-800">{user?.role ?? 'Não informado'}</p>
</div>
<div className="rounded-md border border-gray-200 p-4">
<p className="text-xs uppercase text-gray-400">E-mail</p>
<p className="text-sm font-semibold text-gray-800">{user?.email ?? 'Não informado'}</p>
</div>
<div className="rounded-md border border-gray-200 p-4">
<p className="text-xs uppercase text-gray-400">Usuário</p>
<p className="text-sm font-semibold text-gray-800">{user?.username ?? 'Não informado'}</p>
</div>
</div>
</div>
</Shell>
)
}