diff --git a/frontend/src/lib/components/flows/flowStore.ts b/frontend/src/lib/components/flows/flowStore.ts index 957e51b4fb..e4d4d74b35 100644 --- a/frontend/src/lib/components/flows/flowStore.ts +++ b/frontend/src/lib/components/flows/flowStore.ts @@ -1,8 +1,9 @@ -import type { Flow, OpenFlow } from '$lib/gen' +import type { Flow } from '$lib/gen' import { writable } from 'svelte/store' import { initFlowState, type FlowState } from './flowState' import { sendUserToast } from '$lib/toast' import type { StateStore } from '$lib/utils' +import type { ExtendedOpenFlow } from './types' export type FlowMode = 'push' | 'pull' @@ -10,16 +11,24 @@ export const importFlowStore = writable(undefined) export async function initFlow( flow: Flow, - flowStore: StateStore, + flowStore: StateStore, flowStateStore: StateStore ) { await initFlowState(flow, flowStateStore) - flowStore.val = flow + // Initialize ExtendedOpenFlow with ui.notes field if not present + const extendedFlow: ExtendedOpenFlow = { + ...flow, + ui: { + notes: (flow as any).ui?.notes || [], + ...(flow as any).ui + } + } + flowStore.val = extendedFlow } export async function copyFirstStepSchema( flowState: FlowState, - flowStore: StateStore + flowStore: StateStore ): Promise { const firstModuleId = flowStore.val.value.modules[0]?.id @@ -40,7 +49,7 @@ export async function copyFirstStepSchema( return sendUserToast('No first step found', true) } -export async function getFirstStepSchema(flowState: FlowState, flow: OpenFlow) { +export async function getFirstStepSchema(flowState: FlowState, flow: ExtendedOpenFlow) { const firstModuleId = flow.value.modules[0]?.id if (!firstModuleId || !flowState[firstModuleId]) { diff --git a/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte b/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte index 8d8d7c1217..4256d6ff07 100644 --- a/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte +++ b/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte @@ -396,6 +396,13 @@ maxHeight={minHeight} modules={flowStore.val.value.modules} {noteMode} + notes={flowStore.val.ui?.notes || []} + onNotesChange={(newNotes) => { + if (!flowStore.val.ui) { + flowStore.val.ui = {} + } + flowStore.val.ui.notes = newNotes + }} preprocessorModule={flowStore.val.value?.preprocessor_module} {selectedId} {workspace} diff --git a/frontend/src/lib/components/flows/types.ts b/frontend/src/lib/components/flows/types.ts index 733cd304aa..57485e6b84 100644 --- a/frontend/src/lib/components/flows/types.ts +++ b/frontend/src/lib/components/flows/types.ts @@ -15,6 +15,14 @@ import type ResourceEditorDrawer from '../ResourceEditorDrawer.svelte' import type { ModulesTestStates } from '../modulesTest.svelte' import type { ButtonProp } from '$lib/components/DiffEditor.svelte' +export type Note = { + id: string + text: string + position: { x: number; y: number } + size: { width: number; height: number } + color: string +} + export type FlowInput = Record< string, { @@ -34,6 +42,9 @@ export type ExtendedOpenFlow = OpenFlow & { dedicated_worker?: boolean visible_to_runner_only?: boolean on_behalf_of_email?: string + ui?: { + notes?: Note[] + } } export type FlowInputEditorState = { diff --git a/frontend/src/lib/components/graph/FlowGraphV2.svelte b/frontend/src/lib/components/graph/FlowGraphV2.svelte index ebd181e4fc..ffa43b6b35 100644 --- a/frontend/src/lib/components/graph/FlowGraphV2.svelte +++ b/frontend/src/lib/components/graph/FlowGraphV2.svelte @@ -1,6 +1,7 @@