chore(frontend): add detailed dashboard navigation debug logs

This commit is contained in:
Tiago Yamamoto 2026-03-05 14:02:53 -06:00
parent b0ffceefa8
commit 21aac7c495

View file

@ -1,7 +1,7 @@
"use client"; "use client";
import { useAuth } from "@/contexts/AuthContext"; import { useAuth } from "@/contexts/AuthContext";
import { useRouter } from "next/navigation"; import { usePathname, useRouter } from "next/navigation";
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import { UserRole } from "@/types/auth"; import { UserRole } from "@/types/auth";
import { UserRoundCog, Rocket, Crown } from "lucide-react"; import { UserRoundCog, Rocket, Crown } from "lucide-react";
@ -12,6 +12,7 @@ import { CadastroSuperadminModal } from "./components";
const Dashboard = () => { const Dashboard = () => {
const { user: authUser, userRole, isAuthenticated } = useAuth(); const { user: authUser, userRole, isAuthenticated } = useAuth();
const router = useRouter(); const router = useRouter();
const pathname = usePathname();
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [showCadastroSuperadminModal, setShowCadastroSuperadminModal] = useState(false); const [showCadastroSuperadminModal, setShowCadastroSuperadminModal] = useState(false);
@ -22,6 +23,28 @@ const Dashboard = () => {
const [registroIncompleto, setRegistroIncompleto] = useState(false); const [registroIncompleto, setRegistroIncompleto] = useState(false);
const [userData, setUserData] = useState<any>(null); const [userData, setUserData] = useState<any>(null);
const debugLog = (icon: string, message: string, payload?: unknown) => {
if (payload !== undefined) {
console.log(`[Dashboard] ${icon} ${message}`, payload);
return;
}
console.log(`[Dashboard] ${icon} ${message}`);
};
const navigateWithDebug = (target: string, source: string) => {
const token = localStorage.getItem("access_token");
debugLog("🧭", `Navegacao solicitada por '${source}'`, {
from: pathname,
to: target,
hasToken: Boolean(token),
userRole,
isAuthenticated,
userLevel: userData?.nivel,
isSuperadmin: userData?.superadmin,
});
router.push(target);
};
// Obter ID da empresa do usuário (se não for superadmin) // Obter ID da empresa do usuário (se não for superadmin)
const empresaId = (authUser as any)?.empresas?.[0] || null; const empresaId = (authUser as any)?.empresas?.[0] || null;
@ -37,31 +60,45 @@ const Dashboard = () => {
empresaId: empresaId || undefined, empresaId: empresaId || undefined,
}); });
useEffect(() => {
debugLog("📍", "Rota atual alterada", { pathname });
}, [pathname]);
// Verificar autenticação simples // Verificar autenticação simples
useEffect(() => { useEffect(() => {
const checkAuth = async () => { const checkAuth = async () => {
try { try {
// Verificar se há token armazenado // Verificar se há token armazenado
const storedToken = localStorage.getItem('access_token'); const storedToken = localStorage.getItem('access_token');
debugLog("🔐", "Validando sessao do dashboard", { hasToken: Boolean(storedToken), pathname });
if (!storedToken) { if (!storedToken) {
router.push("/login"); debugLog("⛔", "Token ausente. Redirecionando para login");
navigateWithDebug("/login", "checkAuth:no-token");
return; return;
} }
// Buscar dados do usuário da API // Buscar dados do usuário da API
const response = await fetch(`${process.env.NEXT_PUBLIC_BFF_API_URL}/auth/me`, { const authMeUrl = `${process.env.NEXT_PUBLIC_BFF_API_URL}/auth/me`;
debugLog("📡", "Consultando auth/me", { authMeUrl });
const response = await fetch(authMeUrl, {
method: "GET", method: "GET",
headers: { headers: {
"accept": "application/json", "accept": "application/json",
"Authorization": `Bearer ${storedToken}`, "Authorization": `Bearer ${storedToken}`,
}, },
}); });
debugLog("📨", "Resposta de auth/me", { status: response.status, ok: response.ok });
if (response.ok) { if (response.ok) {
const userData = await response.json(); const userData = await response.json();
setUserData(userData); setUserData(userData);
debugLog("✅", "Usuario carregado para dashboard", {
id: userData?.id,
nivel: userData?.nivel,
superadmin: userData?.superadmin,
});
// Verificar se registro-completo é false // Verificar se registro-completo é false
if (userData["registro-completo"] === false) { if (userData["registro-completo"] === false) {
@ -69,25 +106,26 @@ const Dashboard = () => {
} }
} else { } else {
localStorage.removeItem('access_token'); localStorage.removeItem('access_token');
router.push("/login"); debugLog("⛔", "auth/me nao autorizado. Limpando token e redirecionando");
navigateWithDebug("/login", "checkAuth:invalid-token");
return; return;
} }
setShowQuickActions(true); setShowQuickActions(true);
} catch (error) { } catch (error) {
console.error("Erro ao verificar autenticação:", error); console.error("Erro ao verificar autenticação:", error);
router.push("/login"); navigateWithDebug("/login", "checkAuth:exception");
} finally { } finally {
setLoading(false); setLoading(false);
} }
}; };
checkAuth(); checkAuth();
}, [router]); }, [pathname]);
// Funções para lidar com o banner de registro completo // Funções para lidar com o banner de registro completo
const handleCompletarCadastro = () => { const handleCompletarCadastro = () => {
setRegistroIncompleto(false); setRegistroIncompleto(false);
router.push("/completar-registro"); navigateWithDebug("/completar-registro", "banner:completar-cadastro");
}; };
const handleFecharBanner = () => { const handleFecharBanner = () => {
@ -487,7 +525,7 @@ const Dashboard = () => {
href="/dashboard/empresa-novo" href="/dashboard/empresa-novo"
onClick={(event) => { onClick={(event) => {
event.preventDefault(); event.preventDefault();
router.push('/dashboard/empresa-novo'); navigateWithDebug("/dashboard/empresa-novo", "quick-action:gestao-empresas");
}} }}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px] block" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px] block"
> >
@ -502,7 +540,7 @@ const Dashboard = () => {
{/* Gestão de Produtos Venda - Oculto para colaborador */} {/* Gestão de Produtos Venda - Oculto para colaborador */}
<button <button
onClick={() => router.push("/gestao-produtos-venda")} onClick={() => navigateWithDebug("/gestao-produtos-venda", "quick-action:meu-estoque")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-orange-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-orange-200 transition-colors"> <div className="w-12 h-12 bg-orange-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-orange-200 transition-colors">
@ -531,7 +569,7 @@ const Dashboard = () => {
{/* Produtos Venda */} {/* Produtos Venda */}
<button <button
onClick={() => router.push("/produtos")} onClick={() => navigateWithDebug("/produtos", "quick-action:comprar")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-green-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-green-200 transition-colors"> <div className="w-12 h-12 bg-green-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-green-200 transition-colors">
@ -559,9 +597,7 @@ const Dashboard = () => {
{/* Cadastrar Medicamento */} {/* Cadastrar Medicamento */}
<button <button
onClick={() => onClick={() => navigateWithDebug("/dashboard/cadastrar-medicamentos", "quick-action:cadastrar-medicamento")}
router.push("/dashboard/cadastrar-medicamentos")
}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-green-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-green-200 transition-colors"> <div className="w-12 h-12 bg-green-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-green-200 transition-colors">
@ -590,7 +626,7 @@ const Dashboard = () => {
{/* Catálogo de Produtos - Oculto para colaborador e admin (não superadmin) */} {/* Catálogo de Produtos - Oculto para colaborador e admin (não superadmin) */}
{userData?.nivel !== "colaborador" && !(userData?.nivel === "admin" && userData?.superadmin === false) && ( {userData?.nivel !== "colaborador" && !(userData?.nivel === "admin" && userData?.superadmin === false) && (
<button <button
onClick={() => router.push("/catalogo-produtos-api")} onClick={() => navigateWithDebug("/catalogo-produtos-api", "quick-action:catalogo-produtos")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-purple-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-purple-200 transition-colors"> <div className="w-12 h-12 bg-purple-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-purple-200 transition-colors">
@ -621,7 +657,7 @@ const Dashboard = () => {
{/* Usuários Pendentes - Apenas para superadmins */} {/* Usuários Pendentes - Apenas para superadmins */}
{userData?.superadmin === true && ( {userData?.superadmin === true && (
<button <button
onClick={() => router.push("/usuarios-pendentes")} onClick={() => navigateWithDebug("/usuarios-pendentes", "quick-action:usuarios-pendentes")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-amber-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-amber-200 transition-colors"> <div className="w-12 h-12 bg-amber-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-amber-200 transition-colors">
@ -668,7 +704,7 @@ const Dashboard = () => {
{/* Entregas - Visível para todos os roles */} {/* Entregas - Visível para todos os roles */}
<button <button
onClick={() => router.push("/entregas")} onClick={() => navigateWithDebug("/entregas", "quick-action:entregas")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-150 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-150 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-blue-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-blue-200 transition-colors duration-150"> <div className="w-12 h-12 bg-blue-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-blue-200 transition-colors duration-150">
@ -695,7 +731,7 @@ const Dashboard = () => {
{/* Gestão de Pedidos - Oculto para colaborador */} {/* Gestão de Pedidos - Oculto para colaborador */}
{userData?.nivel !== "colaborador" && ( {userData?.nivel !== "colaborador" && (
<button <button
onClick={() => router.push("/gestao-pedidos")} onClick={() => navigateWithDebug("/gestao-pedidos", "quick-action:gestao-pedidos")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-gray-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-gray-200 transition-colors"> <div className="w-12 h-12 bg-gray-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-gray-200 transition-colors">
@ -725,7 +761,7 @@ const Dashboard = () => {
{/* Relatórios - Oculto para colaborador */} {/* Relatórios - Oculto para colaborador */}
{userData?.nivel !== "colaborador" && ( {userData?.nivel !== "colaborador" && (
<button <button
onClick={() => router.push("/relatorios")} onClick={() => navigateWithDebug("/relatorios", "quick-action:relatorios")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-gray-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-gray-200 transition-colors"> <div className="w-12 h-12 bg-gray-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-gray-200 transition-colors">
@ -753,7 +789,7 @@ const Dashboard = () => {
{/* Gestão de Usuários - Oculto para colaborador e admin (não superadmin) */} {/* Gestão de Usuários - Oculto para colaborador e admin (não superadmin) */}
{userData?.nivel !== "colaborador" && !(userData?.nivel === "admin" && userData?.superadmin === false) && ( {userData?.nivel !== "colaborador" && !(userData?.nivel === "admin" && userData?.superadmin === false) && (
<button <button
onClick={() => router.push("/gestao-usuarios")} onClick={() => navigateWithDebug("/gestao-usuarios", "quick-action:gestao-usuarios")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-indigo-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-indigo-200 transition-colors"> <div className="w-12 h-12 bg-indigo-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-indigo-200 transition-colors">
@ -772,7 +808,7 @@ const Dashboard = () => {
{/* Gestão de Colaboradores - Oculto para colaborador */} {/* Gestão de Colaboradores - Oculto para colaborador */}
{userData?.nivel !== "colaborador" && ( {userData?.nivel !== "colaborador" && (
<button <button
onClick={() => router.push("/gestao-colaboradores")} onClick={() => navigateWithDebug("/gestao-colaboradores", "quick-action:gestao-colaboradores")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-teal-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-teal-200 transition-colors"> <div className="w-12 h-12 bg-teal-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-teal-200 transition-colors">
@ -802,7 +838,7 @@ const Dashboard = () => {
{/* Gestão de Laboratórios - Oculto para colaborador e admin (não superadmin) */} {/* Gestão de Laboratórios - Oculto para colaborador e admin (não superadmin) */}
{userData?.nivel !== "colaborador" && !(userData?.nivel === "admin" && userData?.superadmin === false) && ( {userData?.nivel !== "colaborador" && !(userData?.nivel === "admin" && userData?.superadmin === false) && (
<button <button
onClick={() => router.push("/laboratorios")} onClick={() => navigateWithDebug("/laboratorios", "quick-action:laboratorios")}
className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]" className="bg-white hover:bg-gray-50 border border-gray-200 rounded-xl p-6 text-center transition-colors duration-200 cursor-pointer group min-h-[48px]"
> >
<div className="w-12 h-12 bg-cyan-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-cyan-200 transition-colors"> <div className="w-12 h-12 bg-cyan-100 rounded-lg mx-auto mb-4 flex items-center justify-center group-hover:bg-cyan-200 transition-colors">