chore: add mobile app

mobile/src/context/NotificationContext.tsx

@@ -0,0 +1,248 @@
+import React, {
+    createContext,
+    useContext,
+    useState,
+    useEffect,
+    useRef,
+    useCallback,
+    type ReactNode,
+} from "react";
+import { getClientNotifications, markNotificationsRead } from "../api/api";
+import type { ClientNotification } from "../api/api";
+import { getToken } from "../auth/tokenStorage";
+import {
+    registerForPushNotificationsAsync,
+    sendPushTokenToBackend,
+    setupNotificationChannel,
+    addNotificationReceivedListener,
+    addNotificationResponseListener,
+    setBadgeCount,
+    getLastNotificationResponse,
+} from "../services/pushNotifications";
+
+interface ToastData {
+    message: string;
+    type: "success" | "error" | "warning" | "info";
+}
+
+interface NotificationContextType {
+    notifications: ClientNotification[];
+    unreadCount: number;
+    markAllRead: () => Promise<void>;
+    refreshNotifications: () => Promise<void>;
+    toast: ToastData | null;
+    clearToast: () => void;
+    pushToken: string | null;
+    navigateToOrder: number | null;
+    clearNavigateToOrder: () => void;
+}
+
+const NotificationContext = createContext<NotificationContextType>({
+    notifications: [],
+    unreadCount: 0,
+    markAllRead: async () => {},
+    refreshNotifications: async () => {},
+    toast: null,
+    clearToast: () => {},
+    pushToken: null,
+    navigateToOrder: null,
+    clearNavigateToOrder: () => {},
+});
+
+export function useNotifications() {
+    return useContext(NotificationContext);
+}
+
+function getToastType(
+    notifType: string,
+): "success" | "error" | "warning" | "info" {
+    switch (notifType) {
+        case "order_confirmed":
+        case "order_approved":
+            return "success";
+        case "order_en_route":
+        case "order_assigned":
+            return "info";
+        case "order_delivered":
+            return "warning";
+        default:
+            return "info";
+    }
+}
+
+export function NotificationProvider({ children }: { children: ReactNode }) {
+    const [notifications, setNotifications] = useState<ClientNotification[]>(
+        [],
+    );
+    const [unreadCount, setUnreadCount] = useState(0);
+    const [toast, setToast] = useState<ToastData | null>(null);
+    const [pushToken, setPushToken] = useState<string | null>(null);
+    const [navigateToOrder, setNavigateToOrder] = useState<number | null>(null);
+    const seenIdsRef = useRef<Set<string>>(new Set());
+    const isFirstLoadRef = useRef(true);
+
+    const clearToast = useCallback(() => setToast(null), []);
+    const clearNavigateToOrder = useCallback(
+        () => setNavigateToOrder(null),
+        [],
+    );
+
+    const showToast = useCallback(
+        (message: string, type: ToastData["type"]) => {
+            setToast({ message, type });
+            setTimeout(() => setToast(null), 5000);
+        },
+        [],
+    );
+
+    // Enregistrement push notifications
+    useEffect(() => {
+        let isMounted = true;
+
+        const initPush = async () => {
+            const token = await getToken();
+            if (!token) return;
+
+            // Configurer le channel Android
+            await setupNotificationChannel();
+
+            // Obtenir le push token
+            const expoPushToken = await registerForPushNotificationsAsync();
+            if (expoPushToken && isMounted) {
+                setPushToken(expoPushToken);
+                // Envoyer au backend
+                await sendPushTokenToBackend(expoPushToken);
+            }
+
+            // Vérifier si l'app a été ouverte par une notification
+            const lastResponse = await getLastNotificationResponse();
+            if (lastResponse && isMounted) {
+                const data = lastResponse.notification.request.content.data;
+                if (data?.command_id) {
+                    setNavigateToOrder(data.command_id as number);
+                }
+            }
+        };
+
+        initPush();
+
+        return () => {
+            isMounted = false;
+        };
+    }, []);
+
+    // Listeners pour les notifications push
+    useEffect(() => {
+        // Notification reçue en foreground
+        const receivedSub = addNotificationReceivedListener((notification) => {
+            const { title, body } = notification.request.content;
+            const data = notification.request.content.data;
+
+            // Afficher un toast pour la notification push en foreground
+            if (body) {
+                const notifType = (data?.type as string) || "";
+                showToast(body, getToastType(notifType));
+            }
+
+            // Rafraîchir la liste des notifications
+            fetchNotifications();
+        });
+
+        // L'utilisateur tap sur une notification
+        const responseSub = addNotificationResponseListener((response) => {
+            const data = response.notification.request.content.data;
+            if (data?.command_id) {
+                setNavigateToOrder(data.command_id as number);
+            }
+            // Rafraîchir les notifications
+            fetchNotifications();
+        });
+
+        return () => {
+            receivedSub.remove();
+            responseSub.remove();
+        };
+    }, [showToast]);
+
+    const fetchNotifications = useCallback(async () => {
+        const token = await getToken();
+        if (!token) return;
+
+        try {
+            const response = await getClientNotifications();
+            if (response.success) {
+                const newNotifs = response.notifications;
+                setNotifications(newNotifs);
+                setUnreadCount(response.unread_count);
+
+                // Mettre à jour le badge de l'app
+                await setBadgeCount(response.unread_count);
+
+                if (!isFirstLoadRef.current) {
+                    // Détecter les NOUVELLES notifications non lues
+                    for (const notif of newNotifs) {
+                        if (notif.read) continue;
+                        const key = `${notif.command_id}-${notif.type}-${notif.created_at}`;
+                        if (!seenIdsRef.current.has(key)) {
+                            seenIdsRef.current.add(key);
+                            showToast(notif.message, getToastType(notif.type));
+                        }
+                    }
+                } else {
+                    // Premier chargement : enregistrer tous les IDs sans toast
+                    for (const notif of newNotifs) {
+                        const key = `${notif.command_id}-${notif.type}-${notif.created_at}`;
+                        seenIdsRef.current.add(key);
+                    }
+                    isFirstLoadRef.current = false;
+                }
+            }
+        } catch {
+            // Silencieux en cas d'erreur
+        }
+    }, [showToast]);
+
+    const markAllRead = useCallback(async () => {
+        const token = await getToken();
+        if (!token) return;
+
+        try {
+            const response = await markNotificationsRead();
+            if (response.success) {
+                setUnreadCount(0);
+                setNotifications((prev) =>
+                    prev.map((n) => ({ ...n, read: true })),
+                );
+                // Remettre le badge à 0
+                await setBadgeCount(0);
+            }
+        } catch {
+            // Silencieux
+        }
+    }, []);
+
+    // Polling toutes les 15 secondes
+    useEffect(() => {
+        fetchNotifications();
+        const interval = setInterval(fetchNotifications, 15000);
+        return () => clearInterval(interval);
+    }, [fetchNotifications]);
+
+    return (
+        <NotificationContext.Provider
+            value={{
+                notifications,
+                unreadCount,
+                markAllRead,
+                refreshNotifications: fetchNotifications,
+                toast,
+                clearToast,
+                pushToken,
+                navigateToOrder,
+                clearNavigateToOrder,
+            }}
+        >
+            {children}
+        </NotificationContext.Provider>
+    );
+}