From ab45c8da8e1e1658b5d692b450e09d36f74a57c9 Mon Sep 17 00:00:00 2001
From: TJWater CI <ci@waternetwork.cn>
Date: Tue, 11 Aug 2026 09:51:13 +0800
Subject: [PATCH 1/3] ci: add frontend v2 deployment workflow

---
 .gitea/workflows/package.yml | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 .gitea/workflows/package.yml

diff --git a/.gitea/workflows/package.yml b/.gitea/workflows/package.yml
new file mode 100644
index 0000000..ffb8382
--- /dev/null
+++ b/.gitea/workflows/package.yml
@@ -0,0 +1,21 @@
+name: Frontend CI/CD v2
+
+on:
+  push:
+    tags:
+      - "v*"
+  workflow_dispatch: {}
+
+jobs:
+  build-test-publish-and-deploy:
+    uses: OrgTJWater/ci-templates/.gitea/workflows/container-cd.yml@main
+    with:
+      image_name: gitea.waternetwork.cn/orgtjwater/tjwaterfrontend_refine
+      dockerfile: Dockerfile
+      build_context: .
+      deploy_service: frontend
+      deploy_host: 192.168.1.114
+    secrets:
+      REGISTRY_USERNAME: ${{ secrets.REGISTRY_USERNAME }}
+      REGISTRY_PASSWORD: ${{ secrets.REGISTRY_PASSWORD }}
+      DEV_DEPLOY_SSH_KEY: ${{ secrets.DEV_DEPLOY_SSH_KEY }}

From f5bcf28f7e29c9bc74856d8c13de76aaee272fab Mon Sep 17 00:00:00 2001
From: TJWater CI <ci@waternetwork.cn>
Date: Tue, 11 Aug 2026 10:32:18 +0800
Subject: [PATCH 2/3] fix(map): preserve hook order while data loads

---
 src/app/OlMap/Controls/LayerControl.tsx       | 11 ++++-
 src/app/OlMap/Controls/StyleEditorPanel.tsx   | 14 ++++---
 src/app/OlMap/Controls/Timeline.tsx           | 40 ++++++++++++-------
 src/app/OlMap/Controls/Toolbar.tsx            | 14 +++++--
 .../olmap/HealthRiskAnalysis/Timeline.tsx     | 16 ++++++--
 5 files changed, 67 insertions(+), 28 deletions(-)

diff --git a/src/app/OlMap/Controls/LayerControl.tsx b/src/app/OlMap/Controls/LayerControl.tsx
index 8b539a5..1e49724 100644
--- a/src/app/OlMap/Controls/LayerControl.tsx
+++ b/src/app/OlMap/Controls/LayerControl.tsx
@@ -16,9 +16,16 @@ interface LayerItem {
 }
 
 const LayerControl: React.FC = () => {
-  const map = useMap();
   const data = useData();
-  if (!data) return;
+  if (!data) return null;
+
+  return <LayerControlContent data={data} />;
+};
+
+const LayerControlContent: React.FC<{
+  data: NonNullable<ReturnType<typeof useData>>;
+}> = ({ data }) => {
+  const map = useMap();
   const {
     deckLayer,
     isContourLayerAvailable,
diff --git a/src/app/OlMap/Controls/StyleEditorPanel.tsx b/src/app/OlMap/Controls/StyleEditorPanel.tsx
index 25dfec7..a79539e 100644
--- a/src/app/OlMap/Controls/StyleEditorPanel.tsx
+++ b/src/app/OlMap/Controls/StyleEditorPanel.tsx
@@ -174,15 +174,19 @@ const hexToRgba = (hex: string) => {
     : "rgba(0, 0, 0, 1)";
 };
 
-const StyleEditorPanel: React.FC<StyleEditorPanelProps> = ({
-  layerStyleStates,
-  setLayerStyleStates,
-}) => {
-  const map = useMap();
+const StyleEditorPanel: React.FC<StyleEditorPanelProps> = (props) => {
   const data = useData();
   if (!data) {
     return <div>Loading...</div>; // 或其他占位符
   }
+
+  return <StyleEditorPanelContent {...props} data={data} />;
+};
+
+const StyleEditorPanelContent: React.FC<
+  StyleEditorPanelProps & { data: NonNullable<ReturnType<typeof useData>> }
+> = ({ layerStyleStates, setLayerStyleStates, data }) => {
+  const map = useMap();
   const {
     currentJunctionCalData,
     currentPipeCalData,
diff --git a/src/app/OlMap/Controls/Timeline.tsx b/src/app/OlMap/Controls/Timeline.tsx
index 0688edb..422ac3a 100644
--- a/src/app/OlMap/Controls/Timeline.tsx
+++ b/src/app/OlMap/Controls/Timeline.tsx
@@ -38,17 +38,37 @@ interface TimelineProps {
   schemeType?: string;
 }
 
-const Timeline: React.FC<TimelineProps> = ({
+const Timeline: React.FC<TimelineProps> = (props) => {
+  const data = useData();
+  if (
+    !data ||
+    data.setCurrentTime === undefined ||
+    data.currentTime === undefined ||
+    data.selectedDate === undefined ||
+    data.setSelectedDate === undefined
+  ) {
+    return <div>Loading...</div>;
+  }
+
+  return <TimelineContent {...props} data={data} />;
+};
+
+const TimelineContent: React.FC<
+  TimelineProps & { data: NonNullable<ReturnType<typeof useData>> }
+> = ({
   schemeDate,
   timeRange,
   disableDateSelection = false,
   schemeName = "",
   schemeType = "burst_Analysis",
+  data,
 }) => {
-  const data = useData();
-  if (!data) {
-    return <div>Loading...</div>; // 或其他占位符
-  }
+  const readyData = data as typeof data & {
+    currentTime: NonNullable<typeof data.currentTime>;
+    setCurrentTime: NonNullable<typeof data.setCurrentTime>;
+    selectedDate: NonNullable<typeof data.selectedDate>;
+    setSelectedDate: NonNullable<typeof data.setSelectedDate>;
+  };
   const {
     currentTime,
     setCurrentTime,
@@ -58,15 +78,7 @@ const Timeline: React.FC<TimelineProps> = ({
     setCurrentPipeCalData,
     junctionText,
     pipeText,
-  } = data;
-  if (
-    setCurrentTime === undefined ||
-    currentTime === undefined ||
-    selectedDate === undefined ||
-    setSelectedDate === undefined
-  ) {
-    return <div>Loading...</div>; // 或其他占位符
-  }
+  } = readyData;
   const { open } = useNotification();
 
   const [isPlaying, setIsPlaying] = useState<boolean>(false);
diff --git a/src/app/OlMap/Controls/Toolbar.tsx b/src/app/OlMap/Controls/Toolbar.tsx
index 73b2c2c..06cb5b1 100644
--- a/src/app/OlMap/Controls/Toolbar.tsx
+++ b/src/app/OlMap/Controls/Toolbar.tsx
@@ -27,15 +27,23 @@ interface ToolbarProps {
   queryType?: string; // 可选的查询类型参数
   HistoryPanel?: React.FC<any>; // 可选的自定义历史数据面板
 }
-const Toolbar: React.FC<ToolbarProps> = ({
+const Toolbar: React.FC<ToolbarProps> = (props) => {
+  const data = useData();
+  if (!data) return null;
+
+  return <ToolbarContent {...props} data={data} />;
+};
+
+const ToolbarContent: React.FC<
+  ToolbarProps & { data: NonNullable<ReturnType<typeof useData>> }
+> = ({
   hiddenButtons,
   queryType,
   HistoryPanel,
+  data,
 }) => {
   const map = useMap();
-  const data = useData();
   const { open } = useNotification();
-  if (!data) return null;
   const { currentTime, selectedDate, schemeName } = data;
   const [activeTools, setActiveTools] = useState<string[]>([]);
   const [highlightFeatures, setHighlightFeatures] = useState<Feature[]>([]);
diff --git a/src/components/olmap/HealthRiskAnalysis/Timeline.tsx b/src/components/olmap/HealthRiskAnalysis/Timeline.tsx
index 382a4c3..5c12d81 100644
--- a/src/components/olmap/HealthRiskAnalysis/Timeline.tsx
+++ b/src/components/olmap/HealthRiskAnalysis/Timeline.tsx
@@ -59,13 +59,21 @@ interface TimelineProps {
   schemeName?: string;
 }
 
-const Timeline: React.FC<TimelineProps> = ({
-  disableDateSelection = false,
-}) => {
+const Timeline: React.FC<TimelineProps> = (props) => {
   const data = useData();
   if (!data) {
-    return <div>Loading...</div>; // 或其他占位符
+    return <div>Loading...</div>;
   }
+
+  return <TimelineContent {...props} data={data} />;
+};
+
+const TimelineContent: React.FC<
+  TimelineProps & { data: NonNullable<ReturnType<typeof useData>> }
+> = ({
+  disableDateSelection = false,
+  data,
+}) => {
   const { open } = useNotification();
   const {
     predictionResults,

From 4a978de9054151f5bc30e665e68fd8dc6821deae Mon Sep 17 00:00:00 2001
From: Huarch <huarch97@outlook.com>
Date: Tue, 11 Aug 2026 10:44:56 +0800
Subject: [PATCH 3/3] ci(frontend): inject public build configuration

---
 .gitea/workflows/package.yml | 3 +++
 Dockerfile                   | 5 +++++
 2 files changed, 8 insertions(+)

diff --git a/.gitea/workflows/package.yml b/.gitea/workflows/package.yml
index ffb8382..763d58c 100644
--- a/.gitea/workflows/package.yml
+++ b/.gitea/workflows/package.yml
@@ -13,6 +13,9 @@ jobs:
       image_name: gitea.waternetwork.cn/orgtjwater/tjwaterfrontend_refine
       dockerfile: Dockerfile
       build_context: .
+      build_args: |
+        NEXT_PUBLIC_BACKEND_URL=${{ vars.NEXT_PUBLIC_BACKEND_URL }}
+        NEXT_PUBLIC_MAP_URL=${{ vars.NEXT_PUBLIC_MAP_URL }}
       deploy_service: frontend
       deploy_host: 192.168.1.114
     secrets:
diff --git a/Dockerfile b/Dockerfile
index d792d2a..9fc17b6 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -15,6 +15,11 @@ RUN \
 
 FROM base AS builder
 
+ARG NEXT_PUBLIC_BACKEND_URL
+ARG NEXT_PUBLIC_MAP_URL
+ENV NEXT_PUBLIC_BACKEND_URL=${NEXT_PUBLIC_BACKEND_URL} \
+    NEXT_PUBLIC_MAP_URL=${NEXT_PUBLIC_MAP_URL}
+
 COPY --from=deps /app/refine/node_modules ./node_modules
 
 COPY . .