refactor(FE): Refactor fetchChecklistDetail with useCallback

src/figma-make/components/pages/list-daily-checklist/detail/DetailDailyChecklistContent.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useCallback } from 'react';
 import * as React from 'react';
 import { ArrowLeft, CheckCircle, XCircle, AlertCircle } from 'lucide-react';
 import { Card, CardContent } from '@/figma-make/components/base/card';
@@ -137,15 +137,7 @@ export function DetailDailyChecklistContent() {
   const [rejectReason, setRejectReason] = useState('');
   const [actionLoading, setActionLoading] = useState(false);
 
-  useEffect(() => {
+  const fetchChecklistDetail = useCallback(async () => {
-    if (checklistId) {
-      fetchChecklistDetail();
-    } else {
-      router.push('/404');
-    }
-  }, [checklistId]);
-
-  const fetchChecklistDetail = async () => {
     if (!checklistId) {
       console.warn('checklistId missing');
       setLoading(false);
@@ -320,7 +312,15 @@ export function DetailDailyChecklistContent() {
     } finally {
       setLoading(false);
     }
-  };
+  }, [checklistId, router]);
+
+  useEffect(() => {
+    if (checklistId) {
+      fetchChecklistDetail();
+    } else {
+      router.push('/404');
+    }
+  }, [checklistId, fetchChecklistDetail, router]);
 
   const groupDetailData = (rows: ChecklistDetailRow[]) => {
     // Group by phase_id