From eb7da6ef8019fd2b4b08a25dea1c1fb94bb90efe Mon Sep 17 00:00:00 2001
From: mlogclub <mlog1@qq.com>
Date: Mon, 22 Jun 2026 12:49:59 +0800
Subject: [PATCH] fix: stabilize dashboard crud action callbacks

---
 .../dashboard/crud/dashboard-crud-page.tsx         | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/web/components/dashboard/crud/dashboard-crud-page.tsx b/web/components/dashboard/crud/dashboard-crud-page.tsx
index 9e1645f..c0d95ac 100644
--- a/web/components/dashboard/crud/dashboard-crud-page.tsx
+++ b/web/components/dashboard/crud/dashboard-crud-page.tsx
@@ -1,7 +1,7 @@
 "use client"
 
 import type { ReactNode } from "react"
-import { useCallback, useEffect, useState } from "react"
+import { useCallback, useEffect, useRef, useState } from "react"
 import {
   closestCenter,
   DndContext,
@@ -264,6 +264,12 @@ export function DashboardCrudPage<TItem, TPayload>({
     setEditingItem(null)
     setDialogOpen(true)
   }, [onCreateItem])
+  const loadDataRef = useRef(loadData)
+  const openCreateDialogRef = useRef(openCreateDialog)
+  loadDataRef.current = loadData
+  openCreateDialogRef.current = openCreateDialog
+  const actionRefresh = useCallback(() => void loadDataRef.current(), [])
+  const actionCreate = useCallback(() => openCreateDialogRef.current(), [])
 
   function openEditDialog(item: TItem) {
     setEditingItem(item)
@@ -272,11 +278,11 @@ export function DashboardCrudPage<TItem, TPayload>({
 
   useEffect(() => {
     onActionStateChange?.({
-      onRefresh: () => void loadData(),
-      onCreate: openCreateDialog,
+      onRefresh: actionRefresh,
+      onCreate: actionCreate,
       loading,
     })
-  }, [loadData, loading, onActionStateChange, openCreateDialog])
+  }, [actionCreate, actionRefresh, loading, onActionStateChange])
 
   function handleDialogOpenChange(open: boolean) {
     if (saving) return