Fix basedpyright type error

agent-notes/api/core/model_runtime/model_providers/__base/large_language_model.py.md

@@ -0,0 +1,27 @@
+# Notes: `large_language_model.py`
+
+## Purpose
+
+Provides the base `LargeLanguageModel` implementation used by the model runtime to invoke plugin-backed LLMs and to
+bridge plugin daemon streaming semantics back into API-layer entities (`LLMResult`, `LLMResultChunk`).
+
+## Key behaviors / invariants
+
+- `invoke(..., stream=False)` still calls the plugin in streaming mode and then synthesizes a single `LLMResult` from
+  the first yielded `LLMResultChunk`.
+- Plugin invocation is wrapped by `_invoke_llm_via_plugin(...)`, and `stream=False` normalization is handled by
+  `_normalize_non_stream_plugin_result(...)` / `_build_llm_result_from_first_chunk(...)`.
+- Tool call deltas are merged incrementally via `_increase_tool_call(...)` to support multiple provider chunking
+  patterns (IDs anchored to first chunk, every chunk, or missing entirely).
+- A tool-call delta with an empty `id` requires at least one existing tool call; otherwise we raise `ValueError` to
+  surface invalid delta sequences explicitly.
+- Callback invocation is centralized in `_run_callbacks(...)` to ensure consistent error handling/logging.
+- For compatibility with dify issue `#17799`, `prompt_messages` may be removed by the plugin daemon in chunks and must
+  be re-attached in this layer before callbacks/consumers use them.
+- Callback hooks (`on_before_invoke`, `on_new_chunk`, `on_after_invoke`, `on_invoke_error`) must not break invocation
+  unless `callback.raise_error` is true.
+
+## Test focus
+
+- `api/tests/unit_tests/core/model_runtime/__base/test_increase_tool_call.py` validates tool-call delta merging and
+  patches `_gen_tool_call_id` for deterministic IDs.

api/core/model_runtime/model_providers/__base/large_language_model.py

@@ -1,7 +1,7 @@
 import logging
 import time
 import uuid
-from collections.abc import Generator, Sequence
+from collections.abc import Callable, Generator, Iterator, Sequence
 from typing import Union
 
 from pydantic import ConfigDict
@@ -30,6 +30,142 @@ def _gen_tool_call_id() -> str:
     return f"chatcmpl-tool-{str(uuid.uuid4().hex)}"
 
 
+def _run_callbacks(callbacks: Sequence[Callback] | None, *, event: str, invoke: Callable[[Callback], None]) -> None:
+    if not callbacks:
+        return
+
+    for callback in callbacks:
+        try:
+            invoke(callback)
+        except Exception as e:
+            if callback.raise_error:
+                raise
+            logger.warning("Callback %s %s failed with error %s", callback.__class__.__name__, event, e)
+
+
+def _get_or_create_tool_call(
+    existing_tools_calls: list[AssistantPromptMessage.ToolCall],
+    tool_call_id: str,
+) -> AssistantPromptMessage.ToolCall:
+    """
+    Get or create a tool call by ID.
+
+    If `tool_call_id` is empty, returns the most recently created tool call.
+    """
+    if not tool_call_id:
+        if not existing_tools_calls:
+            raise ValueError("tool_call_id is empty but no existing tool call is available to apply the delta")
+        return existing_tools_calls[-1]
+
+    tool_call = next((tool_call for tool_call in existing_tools_calls if tool_call.id == tool_call_id), None)
+    if tool_call is None:
+        tool_call = AssistantPromptMessage.ToolCall(
+            id=tool_call_id,
+            type="function",
+            function=AssistantPromptMessage.ToolCall.ToolCallFunction(name="", arguments=""),
+        )
+        existing_tools_calls.append(tool_call)
+
+    return tool_call
+
+
+def _merge_tool_call_delta(
+    tool_call: AssistantPromptMessage.ToolCall,
+    delta: AssistantPromptMessage.ToolCall,
+) -> None:
+    if delta.id:
+        tool_call.id = delta.id
+    if delta.type:
+        tool_call.type = delta.type
+    if delta.function.name:
+        tool_call.function.name = delta.function.name
+    if delta.function.arguments:
+        tool_call.function.arguments += delta.function.arguments
+
+
+def _build_llm_result_from_first_chunk(
+    model: str,
+    prompt_messages: Sequence[PromptMessage],
+    chunks: Iterator[LLMResultChunk],
+) -> LLMResult:
+    """
+    Build a single `LLMResult` from the first returned chunk.
+
+    This is used for `stream=False` because the plugin side may still implement the response via a chunked stream.
+    """
+    content = ""
+    content_list: list[PromptMessageContentUnionTypes] = []
+    usage = LLMUsage.empty_usage()
+    system_fingerprint: str | None = None
+    tools_calls: list[AssistantPromptMessage.ToolCall] = []
+
+    first_chunk = next(chunks, None)
+    if first_chunk is not None:
+        if isinstance(first_chunk.delta.message.content, str):
+            content += first_chunk.delta.message.content
+        elif isinstance(first_chunk.delta.message.content, list):
+            content_list.extend(first_chunk.delta.message.content)
+
+        if first_chunk.delta.message.tool_calls:
+            _increase_tool_call(first_chunk.delta.message.tool_calls, tools_calls)
+
+        usage = first_chunk.delta.usage or LLMUsage.empty_usage()
+        system_fingerprint = first_chunk.system_fingerprint
+
+    return LLMResult(
+        model=model,
+        prompt_messages=prompt_messages,
+        message=AssistantPromptMessage(
+            content=content or content_list,
+            tool_calls=tools_calls,
+        ),
+        usage=usage,
+        system_fingerprint=system_fingerprint,
+    )
+
+
+def _invoke_llm_via_plugin(
+    *,
+    tenant_id: str,
+    user_id: str,
+    plugin_id: str,
+    provider: str,
+    model: str,
+    credentials: dict,
+    model_parameters: dict,
+    prompt_messages: Sequence[PromptMessage],
+    tools: list[PromptMessageTool] | None,
+    stop: Sequence[str] | None,
+    stream: bool,
+) -> Union[LLMResult, Generator[LLMResultChunk, None, None]]:
+    from core.plugin.impl.model import PluginModelClient
+
+    plugin_model_manager = PluginModelClient()
+    return plugin_model_manager.invoke_llm(
+        tenant_id=tenant_id,
+        user_id=user_id,
+        plugin_id=plugin_id,
+        provider=provider,
+        model=model,
+        credentials=credentials,
+        model_parameters=model_parameters,
+        prompt_messages=list(prompt_messages),
+        tools=tools,
+        stop=list(stop) if stop else None,
+        stream=stream,
+    )
+
+
+def _normalize_non_stream_plugin_result(
+    model: str,
+    prompt_messages: Sequence[PromptMessage],
+    result: Union[LLMResult, Iterator[LLMResultChunk]],
+) -> LLMResult:
+    if isinstance(result, LLMResult):
+        return result
+    return _build_llm_result_from_first_chunk(model=model, prompt_messages=prompt_messages, chunks=result)
+
+
 def _increase_tool_call(
     new_tool_calls: list[AssistantPromptMessage.ToolCall], existing_tools_calls: list[AssistantPromptMessage.ToolCall]
 ):
@@ -40,42 +176,13 @@ def _increase_tool_call(
     :param existing_tools_calls: List of existing tool calls to be modified IN-PLACE.
     """
 
-    def get_tool_call(tool_call_id: str):
-        """
-        Get or create a tool call by ID
-
-        :param tool_call_id: tool call ID
-        :return: existing or new tool call
-        """
-        if not tool_call_id:
-            return existing_tools_calls[-1]
-
-        _tool_call = next((_tool_call for _tool_call in existing_tools_calls if _tool_call.id == tool_call_id), None)
-        if _tool_call is None:
-            _tool_call = AssistantPromptMessage.ToolCall(
-                id=tool_call_id,
-                type="function",
-                function=AssistantPromptMessage.ToolCall.ToolCallFunction(name="", arguments=""),
-            )
-            existing_tools_calls.append(_tool_call)
-
-        return _tool_call
-
     for new_tool_call in new_tool_calls:
         # generate ID for tool calls with function name but no ID to track them
         if new_tool_call.function.name and not new_tool_call.id:
             new_tool_call.id = _gen_tool_call_id()
-        # get tool call
-        tool_call = get_tool_call(new_tool_call.id)
-        # update tool call
-        if new_tool_call.id:
-            tool_call.id = new_tool_call.id
-        if new_tool_call.type:
-            tool_call.type = new_tool_call.type
-        if new_tool_call.function.name:
-            tool_call.function.name = new_tool_call.function.name
-        if new_tool_call.function.arguments:
-            tool_call.function.arguments += new_tool_call.function.arguments
+
+        tool_call = _get_or_create_tool_call(existing_tools_calls, new_tool_call.id)
+        _merge_tool_call_delta(tool_call, new_tool_call)
 
 
 class LargeLanguageModel(AIModel):
@@ -141,10 +248,7 @@ class LargeLanguageModel(AIModel):
         result: Union[LLMResult, Generator[LLMResultChunk, None, None]]
 
         try:
-            from core.plugin.impl.model import PluginModelClient
-
-            plugin_model_manager = PluginModelClient()
-            result = plugin_model_manager.invoke_llm(
+            result = _invoke_llm_via_plugin(
                 tenant_id=self.tenant_id,
                 user_id=user or "unknown",
                 plugin_id=self.plugin_id,
@@ -154,38 +258,13 @@ class LargeLanguageModel(AIModel):
                 model_parameters=model_parameters,
                 prompt_messages=prompt_messages,
                 tools=tools,
-                stop=list(stop) if stop else None,
+                stop=stop,
                 stream=stream,
             )
 
             if not stream:
-                content = ""
-                content_list = []
-                usage = LLMUsage.empty_usage()
-                system_fingerprint = None
-                tools_calls: list[AssistantPromptMessage.ToolCall] = []
-
-                for chunk in result:
-                    if isinstance(chunk.delta.message.content, str):
-                        content += chunk.delta.message.content
-                    elif isinstance(chunk.delta.message.content, list):
-                        content_list.extend(chunk.delta.message.content)
-                    if chunk.delta.message.tool_calls:
-                        _increase_tool_call(chunk.delta.message.tool_calls, tools_calls)
-
-                    usage = chunk.delta.usage or LLMUsage.empty_usage()
-                    system_fingerprint = chunk.system_fingerprint
-                    break
-
-                result = LLMResult(
-                    model=model,
-                    prompt_messages=prompt_messages,
-                    message=AssistantPromptMessage(
-                        content=content or content_list,
-                        tool_calls=tools_calls,
-                    ),
-                    usage=usage,
-                    system_fingerprint=system_fingerprint,
+                result = _normalize_non_stream_plugin_result(
+                    model=model, prompt_messages=prompt_messages, result=result
                 )
         except Exception as e:
             self._trigger_invoke_error_callbacks(
@@ -425,27 +504,21 @@ class LargeLanguageModel(AIModel):
         :param user: unique user id
         :param callbacks: callbacks
         """
-        if callbacks:
-            for callback in callbacks:
-                try:
-                    callback.on_before_invoke(
-                        llm_instance=self,
-                        model=model,
-                        credentials=credentials,
-                        prompt_messages=prompt_messages,
-                        model_parameters=model_parameters,
-                        tools=tools,
-                        stop=stop,
-                        stream=stream,
-                        user=user,
-                    )
-                except Exception as e:
-                    if callback.raise_error:
-                        raise e
-                    else:
-                        logger.warning(
-                            "Callback %s on_before_invoke failed with error %s", callback.__class__.__name__, e
-                        )
+        _run_callbacks(
+            callbacks,
+            event="on_before_invoke",
+            invoke=lambda callback: callback.on_before_invoke(
+                llm_instance=self,
+                model=model,
+                credentials=credentials,
+                prompt_messages=prompt_messages,
+                model_parameters=model_parameters,
+                tools=tools,
+                stop=stop,
+                stream=stream,
+                user=user,
+            ),
+        )
 
     def _trigger_new_chunk_callbacks(
         self,
@@ -473,26 +546,22 @@ class LargeLanguageModel(AIModel):
         :param stream: is stream response
         :param user: unique user id
         """
-        if callbacks:
-            for callback in callbacks:
-                try:
-                    callback.on_new_chunk(
-                        llm_instance=self,
-                        chunk=chunk,
-                        model=model,
-                        credentials=credentials,
-                        prompt_messages=prompt_messages,
-                        model_parameters=model_parameters,
-                        tools=tools,
-                        stop=stop,
-                        stream=stream,
-                        user=user,
-                    )
-                except Exception as e:
-                    if callback.raise_error:
-                        raise e
-                    else:
-                        logger.warning("Callback %s on_new_chunk failed with error %s", callback.__class__.__name__, e)
+        _run_callbacks(
+            callbacks,
+            event="on_new_chunk",
+            invoke=lambda callback: callback.on_new_chunk(
+                llm_instance=self,
+                chunk=chunk,
+                model=model,
+                credentials=credentials,
+                prompt_messages=prompt_messages,
+                model_parameters=model_parameters,
+                tools=tools,
+                stop=stop,
+                stream=stream,
+                user=user,
+            ),
+        )
 
     def _trigger_after_invoke_callbacks(
         self,
@@ -521,28 +590,22 @@ class LargeLanguageModel(AIModel):
         :param user: unique user id
         :param callbacks: callbacks
         """
-        if callbacks:
-            for callback in callbacks:
-                try:
-                    callback.on_after_invoke(
-                        llm_instance=self,
-                        result=result,
-                        model=model,
-                        credentials=credentials,
-                        prompt_messages=prompt_messages,
-                        model_parameters=model_parameters,
-                        tools=tools,
-                        stop=stop,
-                        stream=stream,
-                        user=user,
-                    )
-                except Exception as e:
-                    if callback.raise_error:
-                        raise e
-                    else:
-                        logger.warning(
-                            "Callback %s on_after_invoke failed with error %s", callback.__class__.__name__, e
-                        )
+        _run_callbacks(
+            callbacks,
+            event="on_after_invoke",
+            invoke=lambda callback: callback.on_after_invoke(
+                llm_instance=self,
+                result=result,
+                model=model,
+                credentials=credentials,
+                prompt_messages=prompt_messages,
+                model_parameters=model_parameters,
+                tools=tools,
+                stop=stop,
+                stream=stream,
+                user=user,
+            ),
+        )
 
     def _trigger_invoke_error_callbacks(
         self,
@@ -571,25 +634,19 @@ class LargeLanguageModel(AIModel):
         :param user: unique user id
         :param callbacks: callbacks
         """
-        if callbacks:
-            for callback in callbacks:
-                try:
-                    callback.on_invoke_error(
-                        llm_instance=self,
-                        ex=ex,
-                        model=model,
-                        credentials=credentials,
-                        prompt_messages=prompt_messages,
-                        model_parameters=model_parameters,
-                        tools=tools,
-                        stop=stop,
-                        stream=stream,
-                        user=user,
-                    )
-                except Exception as e:
-                    if callback.raise_error:
-                        raise e
-                    else:
-                        logger.warning(
-                            "Callback %s on_invoke_error failed with error %s", callback.__class__.__name__, e
-                        )
+        _run_callbacks(
+            callbacks,
+            event="on_invoke_error",
+            invoke=lambda callback: callback.on_invoke_error(
+                llm_instance=self,
+                ex=ex,
+                model=model,
+                credentials=credentials,
+                prompt_messages=prompt_messages,
+                model_parameters=model_parameters,
+                tools=tools,
+                stop=stop,
+                stream=stream,
+                user=user,
+            ),
+        )

api/tests/unit_tests/core/model_runtime/__base/test_increase_tool_call.py

@@ -1,5 +1,7 @@
 from unittest.mock import MagicMock, patch
 
+import pytest
+
 from core.model_runtime.entities.message_entities import AssistantPromptMessage
 from core.model_runtime.model_providers.__base.large_language_model import _increase_tool_call
 
@@ -97,3 +99,14 @@ def test__increase_tool_call():
     mock_id_generator.side_effect = [_exp_case.id for _exp_case in EXPECTED_CASE_4]
     with patch("core.model_runtime.model_providers.__base.large_language_model._gen_tool_call_id", mock_id_generator):
         _run_case(INPUTS_CASE_4, EXPECTED_CASE_4)
+
+
+def test__increase_tool_call__no_id_no_name_first_delta_should_raise():
+    inputs = [
+        ToolCall(id="", type="function", function=ToolCall.ToolCallFunction(name="", arguments='{"arg1": ')),
+        ToolCall(id="", type="function", function=ToolCall.ToolCallFunction(name="func_foo", arguments='"value"}')),
+    ]
+    actual: list[ToolCall] = []
+    with patch("core.model_runtime.model_providers.__base.large_language_model._gen_tool_call_id", MagicMock()):
+        with pytest.raises(ValueError):
+            _increase_tool_call(inputs, actual)

api/tests/unit_tests/core/model_runtime/__base/test_large_language_model_non_stream_parsing.py

@@ -0,0 +1,103 @@
+from core.model_runtime.entities.llm_entities import LLMResult, LLMResultChunk, LLMResultChunkDelta, LLMUsage
+from core.model_runtime.entities.message_entities import (
+    AssistantPromptMessage,
+    TextPromptMessageContent,
+    UserPromptMessage,
+)
+from core.model_runtime.model_providers.__base.large_language_model import _normalize_non_stream_plugin_result
+
+
+def _make_chunk(
+    *,
+    model: str = "test-model",
+    content: str | list[TextPromptMessageContent] | None,
+    tool_calls: list[AssistantPromptMessage.ToolCall] | None = None,
+    usage: LLMUsage | None = None,
+    system_fingerprint: str | None = None,
+) -> LLMResultChunk:
+    message = AssistantPromptMessage(content=content, tool_calls=tool_calls or [])
+    delta = LLMResultChunkDelta(index=0, message=message, usage=usage)
+    return LLMResultChunk(model=model, delta=delta, system_fingerprint=system_fingerprint)
+
+
+def test__normalize_non_stream_plugin_result__from_first_chunk_str_content_and_tool_calls():
+    prompt_messages = [UserPromptMessage(content="hi")]
+
+    tool_calls = [
+        AssistantPromptMessage.ToolCall(
+            id="1",
+            type="function",
+            function=AssistantPromptMessage.ToolCall.ToolCallFunction(name="func_foo", arguments=""),
+        ),
+        AssistantPromptMessage.ToolCall(
+            id="",
+            type="function",
+            function=AssistantPromptMessage.ToolCall.ToolCallFunction(name="", arguments='{"arg1": '),
+        ),
+        AssistantPromptMessage.ToolCall(
+            id="",
+            type="function",
+            function=AssistantPromptMessage.ToolCall.ToolCallFunction(name="", arguments='"value"}'),
+        ),
+    ]
+
+    usage = LLMUsage.empty_usage().model_copy(update={"prompt_tokens": 1, "total_tokens": 1})
+    chunk = _make_chunk(content="hello", tool_calls=tool_calls, usage=usage, system_fingerprint="fp-1")
+
+    result = _normalize_non_stream_plugin_result(
+        model="test-model", prompt_messages=prompt_messages, result=iter([chunk])
+    )
+
+    assert result.model == "test-model"
+    assert result.prompt_messages == prompt_messages
+    assert result.message.content == "hello"
+    assert result.usage.prompt_tokens == 1
+    assert result.system_fingerprint == "fp-1"
+    assert result.message.tool_calls == [
+        AssistantPromptMessage.ToolCall(
+            id="1",
+            type="function",
+            function=AssistantPromptMessage.ToolCall.ToolCallFunction(name="func_foo", arguments='{"arg1": "value"}'),
+        )
+    ]
+
+
+def test__normalize_non_stream_plugin_result__from_first_chunk_list_content():
+    prompt_messages = [UserPromptMessage(content="hi")]
+
+    content_list = [TextPromptMessageContent(data="a"), TextPromptMessageContent(data="b")]
+    chunk = _make_chunk(content=content_list, usage=LLMUsage.empty_usage())
+
+    result = _normalize_non_stream_plugin_result(
+        model="test-model", prompt_messages=prompt_messages, result=iter([chunk])
+    )
+
+    assert result.message.content == content_list
+
+
+def test__normalize_non_stream_plugin_result__passthrough_llm_result():
+    prompt_messages = [UserPromptMessage(content="hi")]
+    llm_result = LLMResult(
+        model="test-model",
+        prompt_messages=prompt_messages,
+        message=AssistantPromptMessage(content="ok"),
+        usage=LLMUsage.empty_usage(),
+    )
+
+    assert (
+        _normalize_non_stream_plugin_result(model="test-model", prompt_messages=prompt_messages, result=llm_result)
+        == llm_result
+    )
+
+
+def test__normalize_non_stream_plugin_result__empty_iterator_defaults():
+    prompt_messages = [UserPromptMessage(content="hi")]
+
+    result = _normalize_non_stream_plugin_result(model="test-model", prompt_messages=prompt_messages, result=iter([]))
+
+    assert result.model == "test-model"
+    assert result.prompt_messages == prompt_messages
+    assert result.message.content == []
+    assert result.message.tool_calls == []
+    assert result.usage == LLMUsage.empty_usage()
+    assert result.system_fingerprint is None

web/app/components/workflow-app/hooks/use-nodes-sync-draft.spec.ts

@@ -1,705 +0,0 @@
-/**
- * Test Suite for useNodesSyncDraft Hook
- *
- * PURPOSE:
- * This hook handles syncing workflow draft to the server. The key fix being tested
- * is the error handling behavior when `draft_workflow_not_sync` error occurs.
- *
- * MULTI-TAB PROBLEM SCENARIO:
- * 1. User opens the same workflow in Tab A and Tab B (both have hash: v1)
- * 2. Tab A saves successfully, server returns new hash: v2
- * 3. Tab B tries to save with old hash: v1, server returns 400 error with code
- *    'draft_workflow_not_sync'
- * 4. BEFORE FIX: handleRefreshWorkflowDraft() was called without args, which fetched
- *    draft AND overwrote canvas - user lost unsaved changes in Tab B
- * 5. AFTER FIX: handleRefreshWorkflowDraft(true) is called, which fetches draft but
- *    only updates hash (notUpdateCanvas=true), preserving user's canvas changes
- *
- * TESTING STRATEGY:
- * We don't simulate actual tab switching UI behavior. Instead, we mock the API to
- * return `draft_workflow_not_sync` error and verify:
- * - The hook calls handleRefreshWorkflowDraft(true) - not handleRefreshWorkflowDraft()
- * - This ensures canvas data is preserved while hash is updated for retry
- *
- * This is behavior-driven testing - we verify "what the code does when receiving
- * specific API errors" rather than simulating complete user interaction flows.
- * True multi-tab integration testing would require E2E frameworks like Playwright.
- */
-
-import { act, renderHook, waitFor } from '@testing-library/react'
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-import { useNodesSyncDraft } from './use-nodes-sync-draft'
-
-// Mock reactflow store
-const mockGetNodes = vi.fn()
-
-type MockEdge = {
-  id: string
-  source: string
-  target: string
-  data: Record<string, unknown>
-}
-
-const mockStoreState: {
-  getNodes: ReturnType<typeof vi.fn>
-  edges: MockEdge[]
-  transform: number[]
-} = {
-  getNodes: mockGetNodes,
-  edges: [],
-  transform: [0, 0, 1],
-}
-vi.mock('reactflow', () => ({
-  useStoreApi: () => ({
-    getState: () => mockStoreState,
-  }),
-}))
-
-// Mock features store
-const mockFeaturesState = {
-  features: {
-    opening: { enabled: false, opening_statement: '', suggested_questions: [] },
-    suggested: {},
-    text2speech: {},
-    speech2text: {},
-    citation: {},
-    moderation: {},
-    file: {},
-  },
-}
-vi.mock('@/app/components/base/features/hooks', () => ({
-  useFeaturesStore: () => ({
-    getState: () => mockFeaturesState,
-  }),
-}))
-
-// Mock workflow service
-const mockSyncWorkflowDraft = vi.fn()
-vi.mock('@/service/workflow', () => ({
-  syncWorkflowDraft: (...args: unknown[]) => mockSyncWorkflowDraft(...args),
-}))
-
-// Mock useNodesReadOnly
-const mockGetNodesReadOnly = vi.fn()
-vi.mock('@/app/components/workflow/hooks/use-workflow', () => ({
-  useNodesReadOnly: () => ({
-    getNodesReadOnly: mockGetNodesReadOnly,
-  }),
-}))
-
-// Mock useSerialAsyncCallback - pass through the callback
-vi.mock('@/app/components/workflow/hooks/use-serial-async-callback', () => ({
-  useSerialAsyncCallback: (callback: (...args: unknown[]) => unknown) => callback,
-}))
-
-// Mock workflow store
-const mockSetSyncWorkflowDraftHash = vi.fn()
-const mockSetDraftUpdatedAt = vi.fn()
-
-const createMockWorkflowStoreState = (overrides = {}) => ({
-  appId: 'test-app-id',
-  conversationVariables: [],
-  environmentVariables: [],
-  syncWorkflowDraftHash: 'current-hash-123',
-  isWorkflowDataLoaded: true,
-  setSyncWorkflowDraftHash: mockSetSyncWorkflowDraftHash,
-  setDraftUpdatedAt: mockSetDraftUpdatedAt,
-  ...overrides,
-})
-
-const mockWorkflowStoreGetState = vi.fn()
-vi.mock('@/app/components/workflow/store', () => ({
-  useWorkflowStore: () => ({
-    getState: mockWorkflowStoreGetState,
-  }),
-}))
-
-// Mock useWorkflowRefreshDraft (THE KEY DEPENDENCY FOR THIS TEST)
-const mockHandleRefreshWorkflowDraft = vi.fn()
-vi.mock('.', () => ({
-  useWorkflowRefreshDraft: () => ({
-    handleRefreshWorkflowDraft: mockHandleRefreshWorkflowDraft,
-  }),
-}))
-
-// Mock API_PREFIX
-vi.mock('@/config', () => ({
-  API_PREFIX: '/api',
-}))
-
-// Create a mock error response that mimics the actual API error
-const createMockErrorResponse = (code: string) => {
-  const errorBody = { code, message: 'Draft not in sync' }
-  let bodyUsed = false
-
-  return {
-    json: vi.fn().mockImplementation(() => {
-      bodyUsed = true
-      return Promise.resolve(errorBody)
-    }),
-    get bodyUsed() {
-      return bodyUsed
-    },
-  }
-}
-
-describe('useNodesSyncDraft', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-    mockGetNodesReadOnly.mockReturnValue(false)
-    mockGetNodes.mockReturnValue([
-      { id: 'node-1', type: 'start', data: { type: 'start' } },
-      { id: 'node-2', type: 'llm', data: { type: 'llm' } },
-    ])
-    mockStoreState.edges = [
-      { id: 'edge-1', source: 'node-1', target: 'node-2', data: {} },
-    ]
-    mockWorkflowStoreGetState.mockReturnValue(createMockWorkflowStoreState())
-    mockSyncWorkflowDraft.mockResolvedValue({
-      hash: 'new-hash-456',
-      updated_at: Date.now(),
-    })
-  })
-
-  afterEach(() => {
-    vi.resetAllMocks()
-  })
-
-  describe('doSyncWorkflowDraft function', () => {
-    it('should return doSyncWorkflowDraft function', () => {
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      expect(result.current.doSyncWorkflowDraft).toBeDefined()
-      expect(typeof result.current.doSyncWorkflowDraft).toBe('function')
-    })
-
-    it('should return syncWorkflowDraftWhenPageClose function', () => {
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      expect(result.current.syncWorkflowDraftWhenPageClose).toBeDefined()
-      expect(typeof result.current.syncWorkflowDraftWhenPageClose).toBe('function')
-    })
-  })
-
-  describe('successful sync', () => {
-    it('should call syncWorkflowDraft service on successful sync', async () => {
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      expect(mockSyncWorkflowDraft).toHaveBeenCalledWith({
-        url: '/apps/test-app-id/workflows/draft',
-        params: expect.objectContaining({
-          hash: 'current-hash-123',
-          graph: expect.objectContaining({
-            nodes: expect.any(Array),
-            edges: expect.any(Array),
-            viewport: expect.any(Object),
-          }),
-        }),
-      })
-    })
-
-    it('should update syncWorkflowDraftHash on success', async () => {
-      mockSyncWorkflowDraft.mockResolvedValue({
-        hash: 'new-hash-789',
-        updated_at: 1234567890,
-      })
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      expect(mockSetSyncWorkflowDraftHash).toHaveBeenCalledWith('new-hash-789')
-    })
-
-    it('should update draftUpdatedAt on success', async () => {
-      const updatedAt = 1234567890
-      mockSyncWorkflowDraft.mockResolvedValue({
-        hash: 'new-hash',
-        updated_at: updatedAt,
-      })
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      expect(mockSetDraftUpdatedAt).toHaveBeenCalledWith(updatedAt)
-    })
-
-    it('should call onSuccess callback on success', async () => {
-      const onSuccess = vi.fn()
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft(false, { onSuccess })
-      })
-
-      expect(onSuccess).toHaveBeenCalled()
-    })
-
-    it('should call onSettled callback after success', async () => {
-      const onSettled = vi.fn()
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft(false, { onSettled })
-      })
-
-      expect(onSettled).toHaveBeenCalled()
-    })
-  })
-
-  describe('sync error handling - draft_workflow_not_sync (THE KEY FIX)', () => {
-    /**
-     * This is THE KEY TEST for the bug fix.
-     *
-     * SCENARIO: Multi-tab editing
-     * 1. User opens workflow in Tab A and Tab B
-     * 2. Tab A saves draft successfully, gets new hash
-     * 3. Tab B tries to save with old hash
-     * 4. Server returns 400 with code 'draft_workflow_not_sync'
-     *
-     * BEFORE FIX:
-     * - handleRefreshWorkflowDraft() was called without arguments
-     * - This would fetch draft AND overwrite the canvas
-     * - User loses their unsaved changes in Tab B
-     *
-     * AFTER FIX:
-     * - handleRefreshWorkflowDraft(true) is called
-     * - This fetches draft but DOES NOT overwrite canvas
-     * - Only hash is updated for the next sync attempt
-     * - User's unsaved changes are preserved
-     */
-    it('should call handleRefreshWorkflowDraft with notUpdateCanvas=true when draft_workflow_not_sync error occurs', async () => {
-      const mockError = createMockErrorResponse('draft_workflow_not_sync')
-      mockSyncWorkflowDraft.mockRejectedValue(mockError)
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      // THE KEY ASSERTION: handleRefreshWorkflowDraft must be called with true
-      await waitFor(() => {
-        expect(mockHandleRefreshWorkflowDraft).toHaveBeenCalledWith(true)
-      })
-    })
-
-    it('should NOT call handleRefreshWorkflowDraft when notRefreshWhenSyncError is true', async () => {
-      const mockError = createMockErrorResponse('draft_workflow_not_sync')
-      mockSyncWorkflowDraft.mockRejectedValue(mockError)
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        // First parameter is notRefreshWhenSyncError
-        await result.current.doSyncWorkflowDraft(true)
-      })
-
-      // Wait a bit for async operations
-      await new Promise(resolve => setTimeout(resolve, 100))
-
-      expect(mockHandleRefreshWorkflowDraft).not.toHaveBeenCalled()
-    })
-
-    it('should call onError callback when draft_workflow_not_sync error occurs', async () => {
-      const mockError = createMockErrorResponse('draft_workflow_not_sync')
-      mockSyncWorkflowDraft.mockRejectedValue(mockError)
-      const onError = vi.fn()
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft(false, { onError })
-      })
-
-      expect(onError).toHaveBeenCalled()
-    })
-
-    it('should call onSettled callback after error', async () => {
-      const mockError = createMockErrorResponse('draft_workflow_not_sync')
-      mockSyncWorkflowDraft.mockRejectedValue(mockError)
-      const onSettled = vi.fn()
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft(false, { onSettled })
-      })
-
-      expect(onSettled).toHaveBeenCalled()
-    })
-  })
-
-  describe('other error handling', () => {
-    it('should NOT call handleRefreshWorkflowDraft for non-draft_workflow_not_sync errors', async () => {
-      const mockError = createMockErrorResponse('some_other_error')
-      mockSyncWorkflowDraft.mockRejectedValue(mockError)
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      // Wait a bit for async operations
-      await new Promise(resolve => setTimeout(resolve, 100))
-
-      expect(mockHandleRefreshWorkflowDraft).not.toHaveBeenCalled()
-    })
-
-    it('should handle error without json method', async () => {
-      const mockError = new Error('Network error')
-      mockSyncWorkflowDraft.mockRejectedValue(mockError)
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-      const onError = vi.fn()
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft(false, { onError })
-      })
-
-      expect(onError).toHaveBeenCalled()
-      expect(mockHandleRefreshWorkflowDraft).not.toHaveBeenCalled()
-    })
-
-    it('should handle error with bodyUsed already true', async () => {
-      const mockError = {
-        json: vi.fn(),
-        bodyUsed: true,
-      }
-      mockSyncWorkflowDraft.mockRejectedValue(mockError)
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      // Should not call json() when bodyUsed is true
-      expect(mockError.json).not.toHaveBeenCalled()
-      expect(mockHandleRefreshWorkflowDraft).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('read-only mode', () => {
-    it('should not sync when nodes are read-only', async () => {
-      mockGetNodesReadOnly.mockReturnValue(true)
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      expect(mockSyncWorkflowDraft).not.toHaveBeenCalled()
-    })
-
-    it('should not sync on page close when nodes are read-only', () => {
-      mockGetNodesReadOnly.mockReturnValue(true)
-
-      // Mock sendBeacon
-      const mockSendBeacon = vi.fn()
-      Object.defineProperty(navigator, 'sendBeacon', {
-        value: mockSendBeacon,
-        writable: true,
-      })
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      act(() => {
-        result.current.syncWorkflowDraftWhenPageClose()
-      })
-
-      expect(mockSendBeacon).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('workflow data not loaded', () => {
-    it('should not sync when workflow data is not loaded', async () => {
-      mockWorkflowStoreGetState.mockReturnValue(
-        createMockWorkflowStoreState({ isWorkflowDataLoaded: false }),
-      )
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      expect(mockSyncWorkflowDraft).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('no appId', () => {
-    it('should not sync when appId is not set', async () => {
-      mockWorkflowStoreGetState.mockReturnValue(
-        createMockWorkflowStoreState({ appId: null }),
-      )
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      expect(mockSyncWorkflowDraft).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('node filtering', () => {
-    it('should filter out temp nodes', async () => {
-      mockGetNodes.mockReturnValue([
-        { id: 'node-1', type: 'start', data: { type: 'start' } },
-        { id: 'node-temp', type: 'custom', data: { type: 'custom', _isTempNode: true } },
-        { id: 'node-2', type: 'llm', data: { type: 'llm' } },
-      ])
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      expect(mockSyncWorkflowDraft).toHaveBeenCalledWith(
-        expect.objectContaining({
-          params: expect.objectContaining({
-            graph: expect.objectContaining({
-              nodes: expect.not.arrayContaining([
-                expect.objectContaining({ id: 'node-temp' }),
-              ]),
-            }),
-          }),
-        }),
-      )
-    })
-
-    it('should remove internal underscore properties from nodes', async () => {
-      mockGetNodes.mockReturnValue([
-        {
-          id: 'node-1',
-          type: 'start',
-          data: {
-            type: 'start',
-            _internalProp: 'should be removed',
-            _anotherInternal: true,
-            publicProp: 'should remain',
-          },
-        },
-      ])
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      const callArgs = mockSyncWorkflowDraft.mock.calls[0][0]
-      const sentNode = callArgs.params.graph.nodes[0]
-
-      expect(sentNode.data).not.toHaveProperty('_internalProp')
-      expect(sentNode.data).not.toHaveProperty('_anotherInternal')
-      expect(sentNode.data).toHaveProperty('publicProp', 'should remain')
-    })
-  })
-
-  describe('edge filtering', () => {
-    it('should filter out temp edges', async () => {
-      mockStoreState.edges = [
-        { id: 'edge-1', source: 'node-1', target: 'node-2', data: {} },
-        { id: 'edge-temp', source: 'node-1', target: 'node-3', data: { _isTemp: true } },
-      ]
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      const callArgs = mockSyncWorkflowDraft.mock.calls[0][0]
-      const sentEdges = callArgs.params.graph.edges
-
-      expect(sentEdges).toHaveLength(1)
-      expect(sentEdges[0].id).toBe('edge-1')
-    })
-
-    it('should remove internal underscore properties from edges', async () => {
-      mockStoreState.edges = [
-        {
-          id: 'edge-1',
-          source: 'node-1',
-          target: 'node-2',
-          data: {
-            _internalEdgeProp: 'should be removed',
-            publicEdgeProp: 'should remain',
-          },
-        },
-      ]
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      const callArgs = mockSyncWorkflowDraft.mock.calls[0][0]
-      const sentEdge = callArgs.params.graph.edges[0]
-
-      expect(sentEdge.data).not.toHaveProperty('_internalEdgeProp')
-      expect(sentEdge.data).toHaveProperty('publicEdgeProp', 'should remain')
-    })
-  })
-
-  describe('viewport handling', () => {
-    it('should send current viewport from transform', async () => {
-      mockStoreState.transform = [100, 200, 1.5]
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      expect(mockSyncWorkflowDraft).toHaveBeenCalledWith(
-        expect.objectContaining({
-          params: expect.objectContaining({
-            graph: expect.objectContaining({
-              viewport: { x: 100, y: 200, zoom: 1.5 },
-            }),
-          }),
-        }),
-      )
-    })
-  })
-
-  describe('multi-tab concurrent editing scenario (END-TO-END TEST)', () => {
-    /**
-     * Simulates the complete multi-tab scenario to verify the fix works correctly.
-     *
-     * Scenario:
-     * 1. Tab A and Tab B both have the workflow open with hash 'hash-v1'
-     * 2. Tab A saves successfully, server returns 'hash-v2'
-     * 3. Tab B tries to save with 'hash-v1', gets 'draft_workflow_not_sync' error
-     * 4. Tab B should only update hash to 'hash-v2', not overwrite canvas
-     * 5. Tab B can now retry save with correct hash
-     */
-    it('should preserve canvas data during hash conflict resolution', async () => {
-      // Initial state: both tabs have hash-v1
-      mockWorkflowStoreGetState.mockReturnValue(
-        createMockWorkflowStoreState({ syncWorkflowDraftHash: 'hash-v1' }),
-      )
-
-      // Tab B tries to save with old hash, server returns error
-      const syncError = createMockErrorResponse('draft_workflow_not_sync')
-      mockSyncWorkflowDraft.mockRejectedValue(syncError)
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      // Tab B attempts to sync
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      // Verify the sync was attempted with old hash
-      expect(mockSyncWorkflowDraft).toHaveBeenCalledWith(
-        expect.objectContaining({
-          params: expect.objectContaining({
-            hash: 'hash-v1',
-          }),
-        }),
-      )
-
-      // Verify handleRefreshWorkflowDraft was called with true (not overwrite canvas)
-      await waitFor(() => {
-        expect(mockHandleRefreshWorkflowDraft).toHaveBeenCalledWith(true)
-      })
-
-      // The key assertion: only one argument (true) was passed
-      expect(mockHandleRefreshWorkflowDraft).toHaveBeenCalledTimes(1)
-      expect(mockHandleRefreshWorkflowDraft.mock.calls[0]).toEqual([true])
-    })
-
-    it('should handle multiple consecutive sync failures gracefully', async () => {
-      // Create fresh error for each call to avoid bodyUsed issue
-      mockSyncWorkflowDraft
-        .mockRejectedValueOnce(createMockErrorResponse('draft_workflow_not_sync'))
-        .mockRejectedValueOnce(createMockErrorResponse('draft_workflow_not_sync'))
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      // First sync attempt
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      // Wait for first refresh call
-      await waitFor(() => {
-        expect(mockHandleRefreshWorkflowDraft).toHaveBeenCalledTimes(1)
-      })
-
-      // Second sync attempt
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft()
-      })
-
-      // Both should call handleRefreshWorkflowDraft with true
-      await waitFor(() => {
-        expect(mockHandleRefreshWorkflowDraft).toHaveBeenCalledTimes(2)
-      })
-
-      mockHandleRefreshWorkflowDraft.mock.calls.forEach((call) => {
-        expect(call).toEqual([true])
-      })
-    })
-  })
-
-  describe('callbacks behavior', () => {
-    it('should not call onSuccess when sync fails', async () => {
-      const syncError = createMockErrorResponse('draft_workflow_not_sync')
-      mockSyncWorkflowDraft.mockRejectedValue(syncError)
-      const onSuccess = vi.fn()
-      const onError = vi.fn()
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft(false, { onSuccess, onError })
-      })
-
-      expect(onSuccess).not.toHaveBeenCalled()
-      expect(onError).toHaveBeenCalled()
-    })
-
-    it('should always call onSettled regardless of success or failure', async () => {
-      const onSettled = vi.fn()
-
-      const { result } = renderHook(() => useNodesSyncDraft())
-
-      // Test success case
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft(false, { onSettled })
-      })
-      expect(onSettled).toHaveBeenCalledTimes(1)
-
-      // Reset
-      onSettled.mockClear()
-
-      // Test failure case
-      const syncError = createMockErrorResponse('draft_workflow_not_sync')
-      mockSyncWorkflowDraft.mockRejectedValue(syncError)
-
-      await act(async () => {
-        await result.current.doSyncWorkflowDraft(false, { onSettled })
-      })
-      expect(onSettled).toHaveBeenCalledTimes(1)
-    })
-  })
-})

web/app/components/workflow-app/hooks/use-nodes-sync-draft.ts

@@ -115,7 +115,7 @@ export const useNodesSyncDraft = () => {
         if (error && error.json && !error.bodyUsed) {
           error.json().then((err: any) => {
             if (err.code === 'draft_workflow_not_sync' && !notRefreshWhenSyncError)
-              handleRefreshWorkflowDraft(true)
+              handleRefreshWorkflowDraft()
           })
         }
         callback?.onError?.()

web/app/components/workflow-app/hooks/use-workflow-refresh-draft.spec.ts

@@ -1,556 +0,0 @@
-/**
- * Test Suite for useWorkflowRefreshDraft Hook
- *
- * PURPOSE:
- * This hook is responsible for refreshing workflow draft data from the server.
- * The key fix being tested is the `notUpdateCanvas` parameter behavior.
- *
- * MULTI-TAB PROBLEM SCENARIO:
- * 1. User opens the same workflow in Tab A and Tab B (both have hash: v1)
- * 2. Tab A saves successfully, server returns new hash: v2
- * 3. Tab B tries to save with old hash: v1, server returns 400 error (draft_workflow_not_sync)
- * 4. BEFORE FIX: handleRefreshWorkflowDraft() was called without args, which fetched
- *    draft AND overwrote canvas - user lost unsaved changes in Tab B
- * 5. AFTER FIX: handleRefreshWorkflowDraft(true) is called, which fetches draft but
- *    only updates hash, preserving user's canvas changes
- *
- * TESTING STRATEGY:
- * We don't simulate actual tab switching UI behavior. Instead, we test the hook's
- * response to specific inputs:
- * - When notUpdateCanvas=true: should NOT call handleUpdateWorkflowCanvas
- * - When notUpdateCanvas=false/undefined: should call handleUpdateWorkflowCanvas
- *
- * This is behavior-driven testing - we verify "what the code does when given specific
- * inputs" rather than simulating complete user interaction flows.
- */
-
-import { act, renderHook, waitFor } from '@testing-library/react'
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-import { useWorkflowRefreshDraft } from './use-workflow-refresh-draft'
-
-// Mock the workflow service
-const mockFetchWorkflowDraft = vi.fn()
-vi.mock('@/service/workflow', () => ({
-  fetchWorkflowDraft: (...args: unknown[]) => mockFetchWorkflowDraft(...args),
-}))
-
-// Mock the workflow update hook
-const mockHandleUpdateWorkflowCanvas = vi.fn()
-vi.mock('@/app/components/workflow/hooks', () => ({
-  useWorkflowUpdate: () => ({
-    handleUpdateWorkflowCanvas: mockHandleUpdateWorkflowCanvas,
-  }),
-}))
-
-// Mock store state
-const mockSetSyncWorkflowDraftHash = vi.fn()
-const mockSetIsSyncingWorkflowDraft = vi.fn()
-const mockSetEnvironmentVariables = vi.fn()
-const mockSetEnvSecrets = vi.fn()
-const mockSetConversationVariables = vi.fn()
-const mockSetIsWorkflowDataLoaded = vi.fn()
-const mockCancelDebouncedSync = vi.fn()
-
-const createMockStoreState = (overrides = {}) => ({
-  appId: 'test-app-id',
-  setSyncWorkflowDraftHash: mockSetSyncWorkflowDraftHash,
-  setIsSyncingWorkflowDraft: mockSetIsSyncingWorkflowDraft,
-  setEnvironmentVariables: mockSetEnvironmentVariables,
-  setEnvSecrets: mockSetEnvSecrets,
-  setConversationVariables: mockSetConversationVariables,
-  setIsWorkflowDataLoaded: mockSetIsWorkflowDataLoaded,
-  isWorkflowDataLoaded: true,
-  debouncedSyncWorkflowDraft: {
-    cancel: mockCancelDebouncedSync,
-  },
-  ...overrides,
-})
-
-const mockWorkflowStoreGetState = vi.fn()
-vi.mock('@/app/components/workflow/store', () => ({
-  useWorkflowStore: () => ({
-    getState: mockWorkflowStoreGetState,
-  }),
-}))
-
-// Default mock response from fetchWorkflowDraft
-const createMockDraftResponse = (overrides = {}) => ({
-  hash: 'new-hash-12345',
-  graph: {
-    nodes: [{ id: 'node-1', type: 'start', data: {} }],
-    edges: [{ id: 'edge-1', source: 'node-1', target: 'node-2' }],
-    viewport: { x: 100, y: 200, zoom: 1.5 },
-  },
-  environment_variables: [
-    { id: 'env-1', name: 'API_KEY', value: 'secret-key', value_type: 'secret' },
-    { id: 'env-2', name: 'BASE_URL', value: 'https://api.example.com', value_type: 'string' },
-  ],
-  conversation_variables: [
-    { id: 'conv-1', name: 'user_input', value: 'test' },
-  ],
-  ...overrides,
-})
-
-describe('useWorkflowRefreshDraft', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-    mockWorkflowStoreGetState.mockReturnValue(createMockStoreState())
-    mockFetchWorkflowDraft.mockResolvedValue(createMockDraftResponse())
-  })
-
-  afterEach(() => {
-    vi.resetAllMocks()
-  })
-
-  describe('handleRefreshWorkflowDraft function', () => {
-    it('should return handleRefreshWorkflowDraft function', () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      expect(result.current.handleRefreshWorkflowDraft).toBeDefined()
-      expect(typeof result.current.handleRefreshWorkflowDraft).toBe('function')
-    })
-  })
-
-  describe('notUpdateCanvas parameter behavior (THE KEY FIX)', () => {
-    it('should NOT call handleUpdateWorkflowCanvas when notUpdateCanvas is true', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockFetchWorkflowDraft).toHaveBeenCalledWith('/apps/test-app-id/workflows/draft')
-      })
-
-      await waitFor(() => {
-        expect(mockSetSyncWorkflowDraftHash).toHaveBeenCalledWith('new-hash-12345')
-      })
-
-      // THE KEY ASSERTION: Canvas should NOT be updated when notUpdateCanvas is true
-      expect(mockHandleUpdateWorkflowCanvas).not.toHaveBeenCalled()
-    })
-
-    it('should call handleUpdateWorkflowCanvas when notUpdateCanvas is false', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(false)
-      })
-
-      await waitFor(() => {
-        expect(mockFetchWorkflowDraft).toHaveBeenCalledWith('/apps/test-app-id/workflows/draft')
-      })
-
-      await waitFor(() => {
-        // Canvas SHOULD be updated when notUpdateCanvas is false
-        expect(mockHandleUpdateWorkflowCanvas).toHaveBeenCalledWith({
-          nodes: [{ id: 'node-1', type: 'start', data: {} }],
-          edges: [{ id: 'edge-1', source: 'node-1', target: 'node-2' }],
-          viewport: { x: 100, y: 200, zoom: 1.5 },
-        })
-      })
-
-      await waitFor(() => {
-        expect(mockSetSyncWorkflowDraftHash).toHaveBeenCalledWith('new-hash-12345')
-      })
-    })
-
-    it('should call handleUpdateWorkflowCanvas when notUpdateCanvas is undefined (default)', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft()
-      })
-
-      await waitFor(() => {
-        expect(mockFetchWorkflowDraft).toHaveBeenCalled()
-      })
-
-      await waitFor(() => {
-        // Canvas SHOULD be updated when notUpdateCanvas is undefined
-        expect(mockHandleUpdateWorkflowCanvas).toHaveBeenCalled()
-      })
-    })
-
-    it('should still update hash even when notUpdateCanvas is true', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockSetSyncWorkflowDraftHash).toHaveBeenCalledWith('new-hash-12345')
-      })
-
-      // Verify canvas was NOT updated
-      expect(mockHandleUpdateWorkflowCanvas).not.toHaveBeenCalled()
-    })
-
-    it('should still update environment variables when notUpdateCanvas is true', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockSetEnvironmentVariables).toHaveBeenCalledWith([
-          { id: 'env-1', name: 'API_KEY', value: '[__HIDDEN__]', value_type: 'secret' },
-          { id: 'env-2', name: 'BASE_URL', value: 'https://api.example.com', value_type: 'string' },
-        ])
-      })
-
-      expect(mockHandleUpdateWorkflowCanvas).not.toHaveBeenCalled()
-    })
-
-    it('should still update env secrets when notUpdateCanvas is true', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockSetEnvSecrets).toHaveBeenCalledWith({
-          'env-1': 'secret-key',
-        })
-      })
-
-      expect(mockHandleUpdateWorkflowCanvas).not.toHaveBeenCalled()
-    })
-
-    it('should still update conversation variables when notUpdateCanvas is true', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockSetConversationVariables).toHaveBeenCalledWith([
-          { id: 'conv-1', name: 'user_input', value: 'test' },
-        ])
-      })
-
-      expect(mockHandleUpdateWorkflowCanvas).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('syncing state management', () => {
-    it('should set isSyncingWorkflowDraft to true before fetch', () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft()
-      })
-
-      expect(mockSetIsSyncingWorkflowDraft).toHaveBeenCalledWith(true)
-    })
-
-    it('should set isSyncingWorkflowDraft to false after fetch completes', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft()
-      })
-
-      await waitFor(() => {
-        expect(mockSetIsSyncingWorkflowDraft).toHaveBeenCalledWith(false)
-      })
-    })
-
-    it('should set isSyncingWorkflowDraft to false even when fetch fails', async () => {
-      mockFetchWorkflowDraft.mockRejectedValue(new Error('Network error'))
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft()
-      })
-
-      await waitFor(() => {
-        expect(mockSetIsSyncingWorkflowDraft).toHaveBeenCalledWith(false)
-      })
-    })
-  })
-
-  describe('isWorkflowDataLoaded flag management', () => {
-    it('should set isWorkflowDataLoaded to false before fetch when it was true', () => {
-      mockWorkflowStoreGetState.mockReturnValue(
-        createMockStoreState({ isWorkflowDataLoaded: true }),
-      )
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft()
-      })
-
-      expect(mockSetIsWorkflowDataLoaded).toHaveBeenCalledWith(false)
-    })
-
-    it('should set isWorkflowDataLoaded to true after fetch succeeds', async () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft()
-      })
-
-      await waitFor(() => {
-        expect(mockSetIsWorkflowDataLoaded).toHaveBeenCalledWith(true)
-      })
-    })
-
-    it('should restore isWorkflowDataLoaded when fetch fails and it was previously loaded', async () => {
-      mockWorkflowStoreGetState.mockReturnValue(
-        createMockStoreState({ isWorkflowDataLoaded: true }),
-      )
-      mockFetchWorkflowDraft.mockRejectedValue(new Error('Network error'))
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft()
-      })
-
-      await waitFor(() => {
-        // Should restore to true because wasLoaded was true
-        expect(mockSetIsWorkflowDataLoaded).toHaveBeenLastCalledWith(true)
-      })
-    })
-  })
-
-  describe('debounced sync cancellation', () => {
-    it('should cancel debounced sync before fetching draft', () => {
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft()
-      })
-
-      expect(mockCancelDebouncedSync).toHaveBeenCalled()
-    })
-
-    it('should handle case when debouncedSyncWorkflowDraft has no cancel method', () => {
-      mockWorkflowStoreGetState.mockReturnValue(
-        createMockStoreState({ debouncedSyncWorkflowDraft: {} }),
-      )
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      // Should not throw
-      expect(() => {
-        act(() => {
-          result.current.handleRefreshWorkflowDraft()
-        })
-      }).not.toThrow()
-    })
-  })
-
-  describe('edge cases', () => {
-    it('should handle empty graph in response', async () => {
-      mockFetchWorkflowDraft.mockResolvedValue({
-        hash: 'hash-empty',
-        graph: null,
-        environment_variables: [],
-        conversation_variables: [],
-      })
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(false)
-      })
-
-      await waitFor(() => {
-        expect(mockHandleUpdateWorkflowCanvas).toHaveBeenCalledWith({
-          nodes: [],
-          edges: [],
-          viewport: { x: 0, y: 0, zoom: 1 },
-        })
-      })
-    })
-
-    it('should handle missing viewport in response', async () => {
-      mockFetchWorkflowDraft.mockResolvedValue({
-        hash: 'hash-no-viewport',
-        graph: {
-          nodes: [{ id: 'node-1' }],
-          edges: [],
-          viewport: null,
-        },
-        environment_variables: [],
-        conversation_variables: [],
-      })
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(false)
-      })
-
-      await waitFor(() => {
-        expect(mockHandleUpdateWorkflowCanvas).toHaveBeenCalledWith({
-          nodes: [{ id: 'node-1' }],
-          edges: [],
-          viewport: { x: 0, y: 0, zoom: 1 },
-        })
-      })
-    })
-
-    it('should handle missing environment_variables in response', async () => {
-      mockFetchWorkflowDraft.mockResolvedValue({
-        hash: 'hash-no-env',
-        graph: { nodes: [], edges: [], viewport: { x: 0, y: 0, zoom: 1 } },
-        environment_variables: undefined,
-        conversation_variables: [],
-      })
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockSetEnvironmentVariables).toHaveBeenCalledWith([])
-        expect(mockSetEnvSecrets).toHaveBeenCalledWith({})
-      })
-    })
-
-    it('should handle missing conversation_variables in response', async () => {
-      mockFetchWorkflowDraft.mockResolvedValue({
-        hash: 'hash-no-conv',
-        graph: { nodes: [], edges: [], viewport: { x: 0, y: 0, zoom: 1 } },
-        environment_variables: [],
-        conversation_variables: undefined,
-      })
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockSetConversationVariables).toHaveBeenCalledWith([])
-      })
-    })
-
-    it('should filter only secret type for envSecrets', async () => {
-      mockFetchWorkflowDraft.mockResolvedValue({
-        hash: 'hash-mixed-env',
-        graph: { nodes: [], edges: [], viewport: { x: 0, y: 0, zoom: 1 } },
-        environment_variables: [
-          { id: 'env-1', name: 'SECRET_KEY', value: 'secret-value', value_type: 'secret' },
-          { id: 'env-2', name: 'PUBLIC_URL', value: 'https://example.com', value_type: 'string' },
-          { id: 'env-3', name: 'ANOTHER_SECRET', value: 'another-secret', value_type: 'secret' },
-        ],
-        conversation_variables: [],
-      })
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockSetEnvSecrets).toHaveBeenCalledWith({
-          'env-1': 'secret-value',
-          'env-3': 'another-secret',
-        })
-      })
-    })
-
-    it('should hide secret values in environment variables', async () => {
-      mockFetchWorkflowDraft.mockResolvedValue({
-        hash: 'hash-secrets',
-        graph: { nodes: [], edges: [], viewport: { x: 0, y: 0, zoom: 1 } },
-        environment_variables: [
-          { id: 'env-1', name: 'SECRET_KEY', value: 'super-secret', value_type: 'secret' },
-          { id: 'env-2', name: 'PUBLIC_URL', value: 'https://example.com', value_type: 'string' },
-        ],
-        conversation_variables: [],
-      })
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockSetEnvironmentVariables).toHaveBeenCalledWith([
-          { id: 'env-1', name: 'SECRET_KEY', value: '[__HIDDEN__]', value_type: 'secret' },
-          { id: 'env-2', name: 'PUBLIC_URL', value: 'https://example.com', value_type: 'string' },
-        ])
-      })
-    })
-  })
-
-  describe('multi-tab scenario simulation (THE BUG FIX VERIFICATION)', () => {
-    /**
-     * This test verifies the fix for the multi-tab scenario:
-     * 1. User opens workflow in Tab A and Tab B
-     * 2. Tab A saves draft successfully
-     * 3. Tab B tries to save but gets 'draft_workflow_not_sync' error (hash mismatch)
-     * 4. BEFORE FIX: Tab B would fetch draft and overwrite canvas with old data
-     * 5. AFTER FIX: Tab B only updates hash, preserving user's canvas changes
-     */
-    it('should only update hash when called with notUpdateCanvas=true (simulating sync error recovery)', async () => {
-      const mockResponse = createMockDraftResponse()
-      mockFetchWorkflowDraft.mockResolvedValue(mockResponse)
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      // Simulate the sync error recovery scenario where notUpdateCanvas is true
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(true)
-      })
-
-      await waitFor(() => {
-        expect(mockFetchWorkflowDraft).toHaveBeenCalled()
-      })
-
-      await waitFor(() => {
-        // Hash should be updated for next sync attempt
-        expect(mockSetSyncWorkflowDraftHash).toHaveBeenCalledWith('new-hash-12345')
-      })
-
-      // Canvas should NOT be updated - user's changes are preserved
-      expect(mockHandleUpdateWorkflowCanvas).not.toHaveBeenCalled()
-
-      // Other states should still be updated
-      expect(mockSetEnvironmentVariables).toHaveBeenCalled()
-      expect(mockSetConversationVariables).toHaveBeenCalled()
-    })
-
-    it('should update canvas when called with notUpdateCanvas=false (normal refresh)', async () => {
-      const mockResponse = createMockDraftResponse()
-      mockFetchWorkflowDraft.mockResolvedValue(mockResponse)
-
-      const { result } = renderHook(() => useWorkflowRefreshDraft())
-
-      // Simulate normal refresh scenario
-      act(() => {
-        result.current.handleRefreshWorkflowDraft(false)
-      })
-
-      await waitFor(() => {
-        expect(mockFetchWorkflowDraft).toHaveBeenCalled()
-      })
-
-      await waitFor(() => {
-        expect(mockSetSyncWorkflowDraftHash).toHaveBeenCalledWith('new-hash-12345')
-      })
-
-      // Canvas SHOULD be updated in normal refresh
-      await waitFor(() => {
-        expect(mockHandleUpdateWorkflowCanvas).toHaveBeenCalled()
-      })
-    })
-  })
-})

web/app/components/workflow-app/hooks/use-workflow-refresh-draft.ts

@@ -8,7 +8,7 @@ export const useWorkflowRefreshDraft = () => {
   const workflowStore = useWorkflowStore()
   const { handleUpdateWorkflowCanvas } = useWorkflowUpdate()
 
-  const handleRefreshWorkflowDraft = useCallback((notUpdateCanvas?: boolean) => {
+  const handleRefreshWorkflowDraft = useCallback(() => {
     const {
       appId,
       setSyncWorkflowDraftHash,
@@ -31,14 +31,12 @@ export const useWorkflowRefreshDraft = () => {
     fetchWorkflowDraft(`/apps/${appId}/workflows/draft`)
       .then((response) => {
         // Ensure we have a valid workflow structure with viewport
-        if (!notUpdateCanvas) {
-          const workflowData: WorkflowDataUpdater = {
-            nodes: response.graph?.nodes || [],
-            edges: response.graph?.edges || [],
-            viewport: response.graph?.viewport || { x: 0, y: 0, zoom: 1 },
-          }
-          handleUpdateWorkflowCanvas(workflowData)
+        const workflowData: WorkflowDataUpdater = {
+          nodes: response.graph?.nodes || [],
+          edges: response.graph?.edges || [],
+          viewport: response.graph?.viewport || { x: 0, y: 0, zoom: 1 },
         }
+        handleUpdateWorkflowCanvas(workflowData)
         setSyncWorkflowDraftHash(response.hash)
         setEnvSecrets((response.environment_variables || []).filter(env => env.value_type === 'secret').reduce((acc, env) => {
           acc[env.id] = env.value