diff --git a/client/src/components/Sidebar.tsx b/client/src/components/Sidebar.tsx index 502a2df..5ede545 100644 --- a/client/src/components/Sidebar.tsx +++ b/client/src/components/Sidebar.tsx @@ -11,15 +11,15 @@ import { Label } from "@/components/ui/label"; import { Input } from "@/components/ui/input"; import { useToast } from "@/hooks/use-toast"; import { apiRequest } from "@/lib/queryClient"; -import { - Store, - Calendar, - BarChart3, - Package, - Truck, - Building, - Users, - UserCog, +import { + Store, + Calendar, + BarChart3, + Package, + Truck, + Building, + Users, + UserCog, LogOut, FileText, Megaphone, @@ -106,7 +106,7 @@ export default function Sidebar() { const configResponse = await fetch('/api/webhook-bap-config', { credentials: 'include' }); - + if (configResponse.ok) { const config = await configResponse.json(); webhookUrl = config?.webhookUrl; @@ -150,9 +150,9 @@ export default function Sidebar() { if (!response.ok) { throw new Error(`Erreur ${response.status}: ${response.statusText}`); } - + handleCloseWaitingModal(); - + toast({ title: "Succès", description: "Fichier BAP envoyé avec succès", @@ -161,23 +161,23 @@ export default function Sidebar() { // Reset des données setSelectedFile(null); setSelectedRecipient(''); - + } catch (error: any) { handleCloseWaitingModal(); - + let errorMessage = "Impossible d'envoyer le fichier BAP"; if (error.name === 'AbortError') { errorMessage = "Le traitement a pris trop de temps (timeout de 60 secondes)"; } else if (error.message) { errorMessage = error.message; } - + toast({ title: "Erreur", description: errorMessage, variant: "destructive", }); - + // Réouvrir le modal de sélection en cas d'erreur setShowBapModal(true); } finally { @@ -193,7 +193,7 @@ export default function Sidebar() { const handleLogout = async () => { try { // Force logout via fetch to ensure session is destroyed - await fetch('/api/logout', { + await fetch('/api/logout', { method: 'POST', credentials: 'include' }); @@ -232,138 +232,138 @@ export default function Sidebar() { { title: "GESTION PRINCIPALE", items: [ - { - path: "/dashboard", - label: "Tableau de bord", - icon: BarChart3, - roles: ["admin", "directeur", "manager", "employee"] + { + path: "/dashboard", + label: "Tableau de bord", + icon: BarChart3, + roles: ["admin", "directeur", "manager", "employee"] }, - { - path: "/calendar", - label: "Calendrier", - icon: Calendar, - roles: ["admin", "directeur", "manager", "employee"] + { + path: "/calendar", + label: "Calendrier", + icon: Calendar, + roles: ["admin", "directeur", "manager", "employee"] }, ] }, { title: "LOGISTIQUE", items: [ - { - path: "/orders", - label: "Commandes", - icon: Package, - roles: ["admin", "directeur", "manager"] + { + path: "/orders", + label: "Commandes", + icon: Package, + roles: ["admin", "directeur", "manager"] }, - { - path: "/deliveries", - label: "Livraisons", - icon: Truck, - roles: ["admin", "directeur", "manager"] + { + path: "/deliveries", + label: "Livraisons", + icon: Truck, + roles: ["admin", "directeur", "manager"] }, - { - path: "/bl-reconciliation", - label: "Rapprochement", - icon: FileText, - roles: ["admin", "directeur"] + { + path: "/bl-reconciliation", + label: "Rapprochement", + icon: FileText, + roles: ["admin", "directeur"] }, - { - path: "/payment-schedule", - label: "Échéance", - icon: CreditCard, - roles: ["admin", "directeur"] + { + path: "/payment-schedule", + label: "Échéance", + icon: CreditCard, + roles: ["admin", "directeur"] }, - { - path: "/avoirs", - label: "Avoirs", - icon: Receipt, - roles: ["admin", "directeur", "manager"] + { + path: "/avoirs", + label: "Avoirs", + icon: Receipt, + roles: ["admin", "directeur", "manager"] }, ] }, { title: "ANALYSES", items: [ - { - path: "/analytics", - label: "Statistiques", - icon: BarChart3, - roles: ["admin", "directeur", "manager"] + { + path: "/analytics", + label: "Statistiques", + icon: BarChart3, + roles: ["admin", "directeur", "manager"] }, - { - path: "/sales-analysis", - label: "Analyse Vente", - icon: TrendingUp, - roles: ["admin", "directeur"] + { + path: "/sales-analysis", + label: "Analyse Vente", + icon: TrendingUp, + roles: ["admin", "directeur"] }, ] }, { title: "OPÉRATIONS", items: [ - { - path: "/publicities", - label: "Publicités", - icon: Megaphone, - roles: ["admin", "directeur", "manager", "employee"] + { + path: "/publicities", + label: "Publicités", + icon: Megaphone, + roles: ["admin", "directeur", "manager", "employee"] }, - { - path: "/customer-orders", - label: "Commandes Client", - icon: ShoppingCart, - roles: ["admin", "directeur", "manager", "employee"] + { + path: "/customer-orders", + label: "Commandes Client", + icon: ShoppingCart, + roles: ["admin", "directeur", "manager", "employee"] }, - { - path: "/dlc", - label: "Gestion DLC", - icon: Clock, - roles: ["admin", "directeur", "manager", "employee"] + { + path: "/dlc", + label: "Gestion DLC", + icon: Clock, + roles: ["admin", "directeur", "manager", "employee"] }, - { - path: "/tasks", - label: "Tâches", - icon: ListTodo, - roles: ["admin", "directeur", "manager", "employee"] + { + path: "/tasks", + label: "Tâches", + icon: ListTodo, + roles: ["admin", "directeur", "manager", "employee"] }, - { - path: "/sav", - label: "SAV", - icon: Wrench, - roles: ["admin", "directeur", "manager", "employee"] + { + path: "/sav", + label: "SAV", + icon: Wrench, + roles: ["admin", "directeur", "manager", "employee"] }, ] }, ]; const adminItems = [ - { - path: "/users", - label: "Utilisateurs", - icon: UserCog, - roles: ["admin"] + { + path: "/users", + label: "Utilisateurs", + icon: UserCog, + roles: ["admin"] }, - { - path: "/suppliers", - label: "Fournisseurs", - icon: Building, - roles: ["admin"] + { + path: "/suppliers", + label: "Fournisseurs", + icon: Building, + roles: ["admin"] }, - { - path: "/groups", - label: "Magasins", - icon: Users, - roles: ["admin"] + { + path: "/groups", + label: "Magasins", + icon: Users, + roles: ["admin"] }, - { - path: "/utilities", - label: "Utilitaires", - icon: Settings, - roles: ["admin"] + { + path: "/utilities", + label: "Utilitaires", + icon: Settings, + roles: ["admin"] }, - { - path: "#bap", - label: "BAP", - icon: FileUp, + { + path: "#bap", + label: "BAP", + icon: FileUp, roles: ["admin"], isButton: true }, @@ -383,27 +383,26 @@ export default function Sidebar() { // Classes responsives adaptées avec support tablette const getSidebarClasses = () => { if (isMobile) { - return `fixed inset-y-0 left-0 z-50 w-64 bg-white border-r border-gray-200 shadow-lg transform transition-transform duration-300 ease-in-out ${ - mobileMenuOpen ? 'translate-x-0' : '-translate-x-full' - }`; + return `fixed inset-y-0 left-0 z-50 w-64 bg-white border-r border-gray-200 shadow-lg transform transition-transform duration-300 ease-in-out ${mobileMenuOpen ? 'translate-x-0' : '-translate-x-full' + }`; } - + // Mode tablette : semi-collapsed par défaut ou collapsed si forcé if (isTablet) { return `${sidebarCollapsed ? 'sidebar-collapsed' : 'sidebar-tablet'} bg-white border-r border-gray-200 flex flex-col shadow-lg transition-all duration-300 ease-in-out`; } - + // Mode desktop standard return `${sidebarCollapsed ? 'sidebar-collapsed' : 'sidebar-expanded'} bg-white border-r border-gray-200 flex flex-col shadow-lg transition-all duration-300 ease-in-out`; }; - + const sidebarClasses = getSidebarClasses(); - + // Debug log pour vérifier l'état de la sidebar - console.log('🔧 Sidebar Debug:', { - isMobile, - sidebarCollapsed, - mobileMenuOpen, + console.log('🔧 Sidebar Debug:', { + isMobile, + sidebarCollapsed, + mobileMenuOpen, width: sidebarCollapsed ? 'collapsed (64px)' : 'expanded (256px)', classes: sidebarClasses }); @@ -593,48 +592,46 @@ export default function Sidebar() { {section.title} )} - + {/* Séparateur visuel en mode collapsed */} {sidebarCollapsed && sectionIndex > 0 && (
)} - + {/* Items du menu */}
{section.items.map((item) => { const hasRolePermission = hasPermission(item.roles); - + if (!hasRolePermission) return null; - + const Icon = item.icon; const active = isActive(item.path); - + return (
+ isMobile ? 'h-5 w-5' : + isTablet ? 'h-6 w-6' : + 'h-5 w-5' + } ${active ? 'text-blue-700' : 'text-gray-600' + } ${sidebarCollapsed && !isMobile ? '' : 'mr-3'}`} /> {(!sidebarCollapsed || isMobile) && ( {item.label} @@ -664,32 +661,30 @@ export default function Sidebar() {
{adminItems.map((item) => { if (!hasPermission(item.roles)) return null; - + const Icon = item.icon; const active = isActive(item.path); - + if (item.isButton && item.path === '#bap') { return (
{ setShowBapModal(true); if (isMobile) setMobileMenuOpen(false); }} > - + {(!sidebarCollapsed || isMobile) && ( {item.label} @@ -699,31 +694,27 @@ export default function Sidebar() {
); } - + return (
- + {(!sidebarCollapsed || isMobile) && ( {item.label} @@ -750,9 +741,9 @@ export default function Sidebar() { {/* NOUVELLE zone de sélection de fichier */}
- + {!selectedFile ? ( -
document.getElementById('hidden-file-input')?.click()} > @@ -786,8 +777,8 @@ export default function Sidebar() { {(selectedFile.size / 1024 / 1024).toFixed(2)} MB • PDF

-
)} - + {/* Input caché */} Prissela
- +
-
- C +
+ J
- Célia + Jeremy
@@ -840,14 +831,14 @@ export default function Sidebar() {
{/* Boutons améliorés */}
- -
- {processingSeconds < 60 + {processingSeconds < 60 ? `${processingSeconds}s écoulées` : '60s+ écoulées' } @@ -910,13 +901,13 @@ export default function Sidebar() { {user?.firstName || user?.lastName ? `${user?.firstName || ''} ${user?.lastName || ''}`.trim() : user?.username}

- {user?.role === 'admin' ? 'Administrateur' : - user?.role === 'manager' ? 'Manager' : - user?.role === 'directeur' ? 'Directeur' : 'Employé'} + {user?.role === 'admin' ? 'Administrateur' : + user?.role === 'manager' ? 'Manager' : + user?.role === 'directeur' ? 'Directeur' : 'Employé'}

-
- - + {testMutation.isSuccess && (
Connexion réussie
)} - + {testMutation.isError && (
@@ -266,7 +266,7 @@ export default function WebhookBAPConfig() {
-