draft updated at

web/app/components/workflow/header/index.tsx

@@ -3,6 +3,7 @@ import {
   memo,
   useCallback,
 } from 'react'
+import dayjs from 'dayjs'
 import { useStore } from '../store'
 import RunAndHistory from './run-and-history'
 import Publish from './publish'
@@ -17,6 +18,7 @@ const Header: FC = () => {
   const setShowFeaturesPanel = useStore(state => state.setShowFeaturesPanel)
   const runStaus = useStore(state => state.runStaus)
   const setRunStaus = useStore(state => state.setRunStaus)
+  const draftUpdatedAt = useStore(state => state.draftUpdatedAt)
 
   const handleShowFeatures = useCallback(() => {
     setShowFeaturesPanel(true)
@@ -35,6 +37,16 @@ const Header: FC = () => {
           <div className='flex items-center text-xs text-gray-500'>
             <Edit03 className='mr-1 w-3 h-3 text-gray-400' />
             Editing
+            {
+              draftUpdatedAt && (
+                <>
+                  <span className='flex items-center mx-1'>·</span>
+                  <span>
+                    Auto-Saved {dayjs(draftUpdatedAt).format('HH:mm:ss')}
+                  </span>
+                </>
+              )
+            }
           </div>
         </div>
       </div>

web/app/components/workflow/index.tsx

@@ -136,6 +136,11 @@ const WorkflowWrap: FC<WorkflowProps> = ({
   const { data, isLoading, error } = useSWR(appDetail?.id ? `/apps/${appDetail.id}/workflows/draft` : null, fetchWorkflowDraft)
   const nodesInitialData = useNodesInitialData()
 
+  useEffect(() => {
+    if (data)
+      useStore.setState({ draftUpdatedAt: data.updated_at })
+  }, [data])
+
   const startNode = {
     id: `${Date.now()}`,
     type: 'custom',

web/app/components/workflow/nodes/if-else/default.ts

@@ -5,11 +5,11 @@ const nodeDefault: NodeDefault<IfElseNodeType> = {
   defaultValue: {
     _targetBranches: [
       {
-        id: 'if-true',
+        id: 'true',
         name: 'IS TRUE',
       },
       {
-        id: 'if-false',
+        id: 'false',
         name: 'IS FALSE',
       },
     ],

web/app/components/workflow/nodes/if-else/node.tsx

@@ -19,7 +19,7 @@ const IfElseNode: FC<NodeProps<IfElseNodeType>> = (props) => {
         <div className='w-full text-right text-gray-700 text-xs font-semibold'>IF</div>
         <NodeSourceHandle
           {...props}
-          handleId='if-true'
+          handleId='true'
           handleClassName='!top-1 !-right-[21px]'
         />
       </div>
@@ -43,7 +43,7 @@ const IfElseNode: FC<NodeProps<IfElseNodeType>> = (props) => {
         <div className='w-full text-right text-gray-700 text-xs font-semibold'>ELSE</div>
         <NodeSourceHandle
           {...props}
-          handleId='if-false'
+          handleId='false'
           handleClassName='!top-1 !-right-[21px]'
         />
       </div>

web/app/components/workflow/store.ts

@@ -15,6 +15,7 @@ type State = {
   helpLine?: HelpLinePosition
   toolsets: CollectionWithExpanded[]
   toolsMap: ToolsMap
+  draftUpdatedAt: number
 }
 
 type Action = {
@@ -25,6 +26,7 @@ type Action = {
   setHelpLine: (helpLine?: HelpLinePosition) => void
   setToolsets: (toolsets: CollectionWithExpanded[]) => void
   setToolsMap: (toolsMap: Record<string, ToolInWorkflow[]>) => void
+  setDraftUpdatedAt: (draftUpdatedAt: number) => void
 }
 
 export const useStore = create<State & Action>(set => ({
@@ -43,4 +45,6 @@ export const useStore = create<State & Action>(set => ({
   setToolsets: toolsets => set(() => ({ toolsets })),
   toolsMap: {},
   setToolsMap: toolsMap => set(() => ({ toolsMap })),
+  draftUpdatedAt: 0,
+  setDraftUpdatedAt: draftUpdatedAt => set(() => ({ draftUpdatedAt })),
 }))

web/i18n/en-US/workflow.ts

@@ -1,4 +1,26 @@
 const translation = {
+  common: {
+    editing: 'Editing',
+    autoSaved: 'Auto-Saved',
+    unpublished: 'Unpublished',
+    published: 'Published',
+    publish: 'Publish',
+    run: 'Run',
+    inRunMode: 'In Run Mode',
+    inPreview: 'In Preview',
+    inPreviewMode: 'In Preview Mode',
+    preview: 'Preview',
+    viewRunHistory: 'View run history',
+    runHistory: 'Run History',
+    goBackToEdit: 'Go back to editor',
+    conversationLog: 'Conversation Log',
+    features: 'Features',
+    debugAndPreview: 'Debug and Preview',
+    restart: 'Restart',
+    currentDraft: 'Current Draft',
+    latestPublished: 'Latest Published',
+    restore: 'Restore',
+  },
   tabs: {
     blocks: 'Blocks',
     builtInTool: 'Built-in Tool',

web/i18n/zh-Hans/workflow.ts

@@ -1,4 +1,26 @@
 const translation = {
+  common: {
+    editing: '编辑中',
+    autoSaved: '自动保存',
+    unpublished: '未发布',
+    published: '已发布',
+    publish: '发布',
+    run: '运行',
+    inRunMode: '运行中',
+    inPreview: '预览中',
+    inPreviewMode: '预览中',
+    preview: '预览',
+    viewRunHistory: '查看运行历史',
+    runHistory: '运行历史',
+    goBackToEdit: '返回编辑模式',
+    conversationLog: '对话记录',
+    features: '功能',
+    debugAndPreview: '调试和预览',
+    restart: '重新开始',
+    currentDraft: '当前草稿',
+    latestPublished: '最新发布',
+    restore: '恢复',
+  },
   tabs: {
     blocks: 'Blocks',
     builtInTool: '内置工具',

web/types/workflow.ts

@@ -12,4 +12,5 @@ export type FetchWorkflowDraftResponse = {
     viewport?: Viewport
   }
   features?: any
+  updated_at: number
 }