feat: tạo hook useNotification.tsx để dùng chung toàn hệ thống

frontend/src/components/ItineraryTimeline.tsx

@@ -2,7 +2,8 @@ import React, { useState, useEffect } from 'react';
 import { format, differenceInMinutes, parseISO } from 'date-fns';
 import { CheckCircle2, Circle, Clock, MapPin, AlertCircle, Zap, Navigation, Edit2, Trash2, Plus, List, X, Calendar as CalendarIcon, AlignLeft, MessageSquare } from 'lucide-react';
 import { useTourStore } from '@/store/useTourStore';
-import { ConfirmModal } from '@/components/ConfirmModal'; 
+import { useConfirm } from '@/hooks/useConfirm';
+import { useNotification } from '@/hooks/useNotification';
 import { CommentModal } from '@/components/CommentModal';
 
 const TimeVariance = ({ planned, actual }: { planned: string, actual: string | null }) => {
@@ -58,7 +59,8 @@ export const ItineraryTimeline = ({
   // Khai báo logic canEdit để sử dụng trong toàn bộ component
   const canEdit = isPublicView ? false : ['OWNER', 'MANAGER'].includes(userRole || '');
 
-  const [confirmState, setConfirmState] = useState<{ open: boolean; title?: string; message?: string; onConfirm?: () => void }>({ open: false });
+  const confirm = useConfirm();
+  const notify = useNotification();
   const [isLegCountModalOpen, setIsLegCountModalOpen] = useState(false);
   const [tempLegCount, setTempLegCount] = useState(3);
   const [isCommentModalOpen, setIsCommentModalOpen] = useState(false);
@@ -151,35 +153,31 @@ export const ItineraryTimeline = ({
   };
 
   const handleDeleteLeg = async (legId: string) => {
-    setConfirmState({
-      open: true,
+    const isConfirmed = await confirm({
       title: 'Xóa chặng',
-      message: 'Bạn có chắc chắn muốn xóa chặng này?',
-      onConfirm: async () => {
-        try {
-          await deleteLeg(legId);
-        } catch (err: any) {
-          alert(err.message);
-        } finally {
-          setConfirmState({ open: false });
-        }
-      },
+      message: 'Bạn có chắc chắn muốn xóa chặng này?'
     });
+    if (isConfirmed) {
+      try {
+        await deleteLeg(legId);
+      } catch (err: any) {
+        notify({ title: 'Lỗi', message: err.message, type: 'error' });
+      }
+    }
   };
 
   const handleDeleteLocation = async (id: string) => {
-    setConfirmState({
-      open: true,
+    const isConfirmed = await confirm({
       title: 'Xóa địa điểm',
-      message: 'Bạn có chắc chắn muốn xóa địa điểm này?',
-      onConfirm: async () => {
-        try {
-          await deleteLocation(id);
-        } catch (err: any) { alert(err.message); } finally {
-          setConfirmState({ open: false });
-        }
-      },
+      message: 'Bạn có chắc chắn muốn xóa địa điểm này?'
     });
+    if (isConfirmed) {
+      try {
+        await deleteLocation(id);
+      } catch (err: any) {
+        notify({ title: 'Lỗi', message: err.message, type: 'error' });
+      }
+    }
   };
 
   return (
@@ -454,13 +452,6 @@ export const ItineraryTimeline = ({
           </div>
         )}
       </div>
-      <ConfirmModal
-        isOpen={confirmState.open}
-        title={confirmState.title}
-        message={confirmState.message}
-        onConfirm={() => confirmState.onConfirm?.()}
-        onCancel={() => setConfirmState({ open: false })}
-      />
 
       {/* Modal Khai báo số chặng (Popover) */}
       {isLegCountModalOpen && (