Implement secure user authentication with role-based access control

Integrates user authentication using bcrypt, session management with PostgreSQL, and role-based access control for enhanced security and user management. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 91318273-c764-4fd4-be04-bdc12c38af32 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/0715008c-7244-40f4-befc-26c014852236/ab880d72-1a34-4d36-b5be-9f44df85ed1a.jpg
2026-10-23 15:18:17 +02:00 · 2025-07-09 18:44:20 +00:00
1 parent 42b249e5b0
commit 5c01234fc4
@@ -0,0 +1,105 @@
+import { useState } from "react";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Button } from "@/components/ui/button";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { useAuth } from "@/hooks/useAuth";
+import NewSaleForm from "@/components/NewSaleForm";
+import SalesHistory from "@/components/SalesHistory";
+import Administration from "@/components/Administration";
+import { Package, History, Settings, LogOut, User } from "lucide-react";
+import { useToast } from "@/hooks/use-toast";
+
+export default function Dashboard() {
+  const { user, logout } = useAuth();
+  const { toast } = useToast();
+  const [activeTab, setActiveTab] = useState("new-sale");
+
+  const handleLogout = async () => {
+    try {
+      await logout();
+      toast({
+        title: "Déconnexion réussie",
+        description: "À bientôt !",
+      });
+    } catch (error) {
+      toast({
+        title: "Erreur",
+        description: "Erreur lors de la déconnexion",
+        variant: "destructive",
+      });
+    }
+  };
+
+  const canAccessAdmin = user?.role === "admin";
+  const canDeleteSales = user?.role === "admin" || user?.role === "manager";
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      {/* Header */}
+      <header className="bg-white shadow-sm border-b">
+        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+          <div className="flex justify-between items-center h-16">
+            <div className="flex items-center gap-3">
+              <div className="p-2 bg-primary/10 rounded-lg">
+                <Package className="h-6 w-6 text-primary" />
+              </div>
+              <div>
+                <h1 className="text-xl font-bold text-gray-900">Registre des Ventes</h1>
+                <p className="text-sm text-gray-500">Gestion des feux d'artifice</p>
+              </div>
+            </div>
+            
+            <div className="flex items-center gap-4">
+              <div className="text-right">
+                <p className="text-sm font-medium text-gray-900">
+                  {user?.firstName} {user?.lastName}
+                </p>
+                <p className="text-xs text-gray-500 capitalize">{user?.role}</p>
+              </div>
+              <Button variant="outline" size="sm" onClick={handleLogout}>
+                <LogOut className="h-4 w-4 mr-2" />
+                Déconnexion
+              </Button>
+            </div>
+          </div>
+        </div>
+      </header>
+
+      {/* Main Content */}
+      <main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+        <Tabs value={activeTab} onValueChange={setActiveTab} className="space-y-6">
+          <TabsList className="grid w-full grid-cols-3 lg:w-auto lg:grid-cols-auto">
+            <TabsTrigger value="new-sale" className="flex items-center gap-2">
+              <Package className="h-4 w-4" />
+              Nouvelle Vente
+            </TabsTrigger>
+            <TabsTrigger value="history" className="flex items-center gap-2">
+              <History className="h-4 w-4" />
+              Historique
+            </TabsTrigger>
+            {canAccessAdmin && (
+              <TabsTrigger value="admin" className="flex items-center gap-2">
+                <Settings className="h-4 w-4" />
+                Administration
+              </TabsTrigger>
+            )}
+          </TabsList>
+
+          <TabsContent value="new-sale">
+            <NewSaleForm />
+          </TabsContent>
+
+          <TabsContent value="history">
+            <SalesHistory canDelete={canDeleteSales} />
+          </TabsContent>
+
+          {canAccessAdmin && (
+            <TabsContent value="admin">
+              <Administration />
+            </TabsContent>
+          )}
+        </Tabs>
+      </main>
+    </div>
+  );
+}