修复lint errors

src/components/olmap/HealthRiskAnalysis/Timeline.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState, useEffect, useRef, useCallback } from "react";
+import React, { useState, useEffect, useRef, useCallback, useMemo } from "react";
 import { useNotification } from "@refinedev/core";
 import WebGLVectorTileLayer from "ol/layer/WebGLVectorTile";
 
@@ -27,7 +27,6 @@ import dayjs from "dayjs";
 import { PlayArrow, Pause, Stop, Refresh } from "@mui/icons-material";
 import { TbArrowBackUp, TbArrowForwardUp } from "react-icons/tb";
 import { FiSkipBack, FiSkipForward } from "react-icons/fi";
-import { useData } from "@components/olmap/core/MapComponent";
 import { config, NETWORK_NAME } from "@/config/config";
 import { apiFetch } from "@/lib/apiFetch";
 import { useMap } from "@components/olmap/core/MapComponent";
@@ -63,10 +62,6 @@ interface TimelineProps {
 const Timeline: React.FC<TimelineProps> = ({
   disableDateSelection = false,
 }) => {
-  const data = useData();
-  if (!data) {
-    return <div>Loading...</div>; // 或其他占位符
-  }
   const { open } = useNotification();
   const {
     predictionResults,
@@ -79,7 +74,6 @@ const Timeline: React.FC<TimelineProps> = ({
   const [isPlaying, setIsPlaying] = useState<boolean>(false);
   const [playInterval, setPlayInterval] = useState<number>(5000); // 毫秒
   const [isPredicting, setIsPredicting] = useState<boolean>(false);
-  const [pipeLayer, setPipeLayer] = useState<WebGLVectorTileLayer | null>(null);
 
   // 使用 ref 存储当前的健康数据，供事件监听器读取，避免重复绑定
   const healthDataRef = useRef<Map<string, number>>(new Map());
@@ -228,10 +222,21 @@ const Timeline: React.FC<TimelineProps> = ({
         clearTimeout(debounceRef.current);
       }
     };
-  }, [pipeLayer]);
+  }, []);
 
   // 获取地图实例
   const map = useMap();
+  const pipeLayer = useMemo(() => {
+    if (!map) return null;
+
+    const layers = map.getLayers().getArray();
+    return (
+      layers.find(
+        (layer) =>
+          layer instanceof WebGLVectorTileLayer && layer.get("value") === "pipes",
+      ) as WebGLVectorTileLayer | undefined
+    ) ?? null;
+  }, [map]);
 
   // 根据索引从 survival_function 中获取生存概率
   const getSurvivalProbabilityAtYear = useCallback(
@@ -362,21 +367,6 @@ const Timeline: React.FC<TimelineProps> = ({
     updatePipeHealthData,
   ]);
 
-  // 初始化管道图层
-  useEffect(() => {
-    if (!map) return;
-
-    const layers = map.getLayers().getArray();
-    const pipesLayer = layers.find(
-      (layer) =>
-        layer instanceof WebGLVectorTileLayer && layer.get("value") === "pipes",
-    ) as WebGLVectorTileLayer | undefined;
-
-    if (pipesLayer) {
-      setPipeLayer(pipesLayer);
-    }
-  }, [map]);
-
   // 监听依赖变化，更新样式
   useEffect(() => {
     if (predictionResults.length > 0 && pipeLayer) {