From 5c44c66dbd6f025698dbbd02c60c943255411586 Mon Sep 17 00:00:00 2001 From: bender Date: Mon, 25 May 2026 23:27:16 +0000 Subject: [PATCH 1/3] Update src/app/admin/page.tsx --- src/app/admin/page.tsx | 344 +++++++++++++++++++++++++---------------- 1 file changed, 213 insertions(+), 131 deletions(-) diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx index dc46369..e39c98d 100644 --- a/src/app/admin/page.tsx +++ b/src/app/admin/page.tsx @@ -2,12 +2,153 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import ReactLenis from "lenis/react"; -import FaqDouble from '@/components/sections/faq/FaqDouble'; -import FooterBase from '@/components/sections/footer/FooterBase'; import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay'; -import TextAbout from '@/components/sections/about/TextAbout'; +import FooterBase from '@/components/sections/footer/FooterBase'; +import CardStack from '@/components/cardStack/CardStack'; +import ButtonShiftHover from '@/components/button/ButtonShiftHover/ButtonShiftHover'; +import { useState, useEffect, useCallback } from 'react'; +import { Phone, MessageCircle } from 'lucide-react'; // For call and WhatsApp icons + + +// Mock data for orders +interface OrderItem { + name: string; + quantity: number; + price: number; +} + +interface Order { + id: string; + customerName: string; + customerPhone: string; // E.g., "0550123456" + customerAddress: string; + items: OrderItem[]; + totalPrice: number; + timestamp: string; // ISO string or similar +} + +const mockOrders: Order[] = [ + { + id: "ORD001", customerName: "Ahmed Benali", customerPhone: "0550123456", customerAddress: "Rue Didouche Mourad, Alger Centre", items: [ + { name: "Burger Classique", quantity: 2, price: 450 }, + { name: "Frites XXL", quantity: 1, price: 200 }, + ], + totalPrice: 1100, + timestamp: new Date().toISOString(), + }, + { + id: "ORD002", customerName: "Fatima Zahra", customerPhone: "0770987654", customerAddress: "Cité El Wouroud, Bab Ezzouar", items: [ + { name: "Pizza Pepperoni", quantity: 1, price: 850 }, + { name: "Boisson Gazeuse", quantity: 2, price: 100 }, + ], + totalPrice: 1050, + timestamp: new Date(Date.now() - 5 * 60 * 1000).toISOString(), // 5 mins ago + }, + { + id: "ORD003", customerName: "Rachid Khelifa", customerPhone: "0660112233", customerAddress: "Boulevard Krim Belkacem, Oran", items: [ + { name: "Taco Poulet", quantity: 1, price: 500 }, + { name: "Chicken Nuggets (6pcs)", quantity: 1, price: 600 }, + { name: "Boisson Gazeuse", quantity: 1, price: 100 }, + ], + totalPrice: 1200, + timestamp: new Date(Date.now() - 10 * 60 * 1000).toISOString(), // 10 mins ago + }, +]; + +const OrderCard: React.FC<{ order: Order; onOrderReady: (id: string) => void }> = ({ order, onOrderReady }) => { + const formatPhoneNumberForWhatsApp = (phone: string) => { + // Remove leading '0' if present and add country code "+213" + let formatted = phone.startsWith('0') ? phone.substring(1) : phone; + if (!formatted.startsWith('213')) { + formatted = '213' + formatted; + } + return formatted; + }; + + return ( +
+

Commande #{order.id}

+
+

Client: {order.customerName}

+

Téléphone: {order.customerPhone}

+

Adresse: {order.customerAddress}

+

Heure: {new Date(order.timestamp).toLocaleTimeString('fr-FR')}

+
+
+

Articles:

+
    + {order.items.map((item, index) => ( +
  • {item.name} x{item.quantity} ({item.price * item.quantity} DA)
    • + ))} +
+
+

Total: {order.totalPrice} DA

+ +
+ + + Appeler + + + + WhatsApp + + onOrderReady(order.id)} + className="flex-1 bg-primary-cta hover:bg-primary-cta/80 text-primary-cta-text" + ariaLabel={`Marquer la commande ${order.id} comme prête`} + /> +
+
+ ); +}; + + +export default function AdminPage() { + const [orders, setOrders] = useState([]); + + // Simulate fetching orders from a backend + const fetchOrders = useCallback(() => { + // In a real app, this would be an API call + console.log("Fetching orders..."); + // For now, load mockOrders if empty, otherwise just return current orders + setOrders(prevOrders => { + if (prevOrders.length === 0) { + return mockOrders; + } + return prevOrders; + }); + }, []); + + useEffect(() => { + fetchOrders(); // Fetch immediately on component mount + + const intervalId = setInterval(fetchOrders, 2000); // Fetch every 2 seconds + + return () => clearInterval(intervalId); // Cleanup interval on unmount + }, [fetchOrders]); + + const handleOrderReady = (id: string) => { + setOrders(prevOrders => prevOrders.filter(order => order.id !== id)); + console.log(`Order ${id} marked as ready and cleared.`); + // In a real app, this would also trigger an API call to update order status in backend + }; -export default function LandingPage() { return ( - + -
- -
+
+
+

Gestion des Commandes

+ {orders.length === 0 ? ( +

Aucune commande en attente.

+ ) : ( + + {orders.map((order) => ( + + ))} + + )} +
+
-
- -
- - + ); -} +} \ No newline at end of file -- 2.49.1 From 61175df14688062efd5fa0d87afe964b20511b25 Mon Sep 17 00:00:00 2001 From: bender Date: Mon, 25 May 2026 23:27:16 +0000 Subject: [PATCH 2/3] Update src/app/page.tsx --- src/app/page.tsx | 202 +++++++++++------------------------------------ 1 file changed, 44 insertions(+), 158 deletions(-) diff --git a/src/app/page.tsx b/src/app/page.tsx index 2ae28fb..c4ea86b 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -29,21 +29,13 @@ export default function LandingPage() { @@ -259,54 +166,33 @@ export default function LandingPage() { Date: Mon, 25 May 2026 23:27:17 +0000 Subject: [PATCH 3/3] Update src/app/styles/variables.css --- src/app/styles/variables.css | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css index a7f8f0c..a83e972 100644 --- a/src/app/styles/variables.css +++ b/src/app/styles/variables.css @@ -10,15 +10,15 @@ --accent: #ffffff; --background-accent: #ffffff; */ - --background: #ffffff; - --card: #f9f9f9; - --foreground: #120a00e6; - --primary-cta: #E34400; + --background: #1a1a1a; + --card: #2a2a2a; + --foreground: #f5f5f5; + --primary-cta: #e43b2f; --primary-cta-text: #ffffff; - --secondary-cta: #f9f9f9; + --secondary-cta: #ff7b00; --secondary-cta-text: #120a00e6; - --accent: #e2e2e2; - --background-accent: #E34400; + --accent: #facc15; + --background-accent: #e43b2f; /* text sizing - set by ThemeProvider */ /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem); -- 2.49.1