diff --git a/web/app/components/workflow-app/hooks/use-workflow-vars.ts b/web/app/components/workflow-app/hooks/use-set-workflow-vars-with-value.ts
similarity index 85%
rename from web/app/components/workflow-app/hooks/use-workflow-vars.ts
rename to web/app/components/workflow-app/hooks/use-set-workflow-vars-with-value.ts
index 6dc6d37158..a05c62ad4c 100644
--- a/web/app/components/workflow-app/hooks/use-workflow-vars.ts
+++ b/web/app/components/workflow-app/hooks/use-set-workflow-vars-with-value.ts
@@ -1,10 +1,10 @@
 import type { NodeWithVar, VarInInspect } from '@/types/workflow'
 import { useWorkflowStore } from '../../workflow/store'
-import { useWorkflowVars as useDoFetchWorkflowVars } from '@/service/use-workflow'
+import { useWorkflowVars } from '@/service/use-workflow'
 import { useStoreApi } from 'reactflow'
 import type { Node } from '@/app/components/workflow/types'
 
-const useWorkflowVars = () => {
+const useSetWorkflowVarsWithValue = () => {
   const workflowStore = useWorkflowStore()
   const { setNodesWithInspectVars, appId } = workflowStore.getState()
   const store = useStoreApi()
@@ -13,6 +13,7 @@ const useWorkflowVars = () => {
     const { getNodes } = store.getState()
     const nodeArr = getNodes()
     const nodesKeyValue: Record<string, Node> = {}
+    // TODO: handle conversation, env and system variables
     nodeArr.forEach((node) => {
       nodesKeyValue[node.id] = node
     })
@@ -44,9 +45,8 @@ const useWorkflowVars = () => {
       return nodeWithVar
     })
     setNodesWithInspectVars(res)
-    console.log(res)
   }
-  useDoFetchWorkflowVars(appId, 1, addNodeInfo)
+  useWorkflowVars(appId, addNodeInfo)
 }
 
-export default useWorkflowVars
+export default useSetWorkflowVarsWithValue
diff --git a/web/app/components/workflow/index.tsx b/web/app/components/workflow/index.tsx
index a981da1d73..72b97c89a4 100644
--- a/web/app/components/workflow/index.tsx
+++ b/web/app/components/workflow/index.tsx
@@ -82,7 +82,7 @@ import Confirm from '@/app/components/base/confirm'
 import DatasetsDetailProvider from './datasets-detail-store/provider'
 import { HooksStoreContextProvider } from './hooks-store'
 import type { Shape as HooksStoreShape } from './hooks-store'
-import useWorkflowVars from '../workflow-app/hooks/use-workflow-vars'
+import useSetWorkflowVarsWithValue from '../workflow-app/hooks/use-set-workflow-vars-with-value'
 
 const nodeTypes = {
   [CUSTOM_NODE]: CustomNode,
@@ -274,7 +274,7 @@ export const Workflow: FC<WorkflowProps> = memo(({
   })
 
   useShortcuts()
-  useWorkflowVars()
+  useSetWorkflowVarsWithValue()
 
   const store = useStoreApi()
   if (process.env.NODE_ENV === 'development') {
diff --git a/web/service/use-workflow.ts b/web/service/use-workflow.ts
index 309d940dc2..067ac778ee 100644
--- a/web/service/use-workflow.ts
+++ b/web/service/use-workflow.ts
@@ -126,9 +126,9 @@ export const useLastRun = (appID: string, nodeId: string, enabled: boolean) => {
   })
 }
 
-export const useWorkflowVars = (appId: string, pageAt: number, onSuccess: (data: VarInInspect[]) => void) => {
+export const useWorkflowVars = (appId: string, onSuccess: (data: VarInInspect[]) => void) => {
   return useQuery({
-    queryKey: [NAME_SPACE, 'variables', appId, pageAt],
+    queryKey: [NAME_SPACE, 'variables', appId],
     queryFn: async () => {
       // TODO: mock data. and need to get the rest data if has more data
       await sleep(1000)