Export DSL from history (#24939)

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

web/app/components/workflow/hooks/use-workflow-interactions.ts

@@ -346,7 +346,7 @@ export const useDSL = () => {
 
   const appDetail = useAppStore(s => s.appDetail)
 
-  const handleExportDSL = useCallback(async (include = false) => {
+  const handleExportDSL = useCallback(async (include = false, workflowId?: string) => {
     if (!appDetail)
       return
 
@@ -358,6 +358,7 @@ export const useDSL = () => {
       await doSyncWorkflowDraft()
       const { data } = await exportAppConfig({
         appID: appDetail.id,
+        workflowID: workflowId,
         include,
       })
       const a = document.createElement('a')

web/app/components/workflow/panel/version-history-panel/context-menu/use-context-menu.ts

@@ -29,6 +29,10 @@ const useContextMenu = (props: ContextMenuProps) => {
           key: VersionHistoryContextMenuOptions.edit,
           name: t('workflow.versionHistory.nameThisVersion'),
         },
+      {
+        key: VersionHistoryContextMenuOptions.exportDSL,
+        name: t('app.export'),
+      },
       {
         key: VersionHistoryContextMenuOptions.copyId,
         name: t('workflow.versionHistory.copyId'),

web/app/components/workflow/panel/version-history-panel/index.tsx

@@ -3,7 +3,7 @@ import React, { useCallback, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { RiArrowDownDoubleLine, RiCloseLine, RiLoader2Line } from '@remixicon/react'
 import copy from 'copy-to-clipboard'
-import { useNodesSyncDraft, useWorkflowRun } from '../../hooks'
+import { useDSL, useNodesSyncDraft, useWorkflowRun } from '../../hooks'
 import { useStore, useWorkflowStore } from '../../store'
 import { VersionHistoryContextMenuOptions, WorkflowVersionFilterOptions } from '../../types'
 import VersionHistoryItem from './version-history-item'
@@ -33,6 +33,7 @@ const VersionHistoryPanel = () => {
   const workflowStore = useWorkflowStore()
   const { handleSyncWorkflowDraft } = useNodesSyncDraft()
   const { handleRestoreFromPublishedWorkflow, handleLoadBackupDraft } = useWorkflowRun()
+  const { handleExportDSL } = useDSL()
   const appDetail = useAppStore.getState().appDetail
   const setShowWorkflowVersionHistoryPanel = useStore(s => s.setShowWorkflowVersionHistoryPanel)
   const currentVersion = useStore(s => s.currentVersion)
@@ -107,8 +108,11 @@ const VersionHistoryPanel = () => {
           message: t('workflow.versionHistory.action.copyIdSuccess'),
         })
         break
+      case VersionHistoryContextMenuOptions.exportDSL:
+        handleExportDSL(false, item.id)
+        break
     }
-  }, [t])
+  }, [t, handleExportDSL])
 
   const handleCancel = useCallback((operation: VersionHistoryContextMenuOptions) => {
     switch (operation) {

web/app/components/workflow/types.ts

@@ -452,6 +452,7 @@ export enum VersionHistoryContextMenuOptions {
   restore = 'restore',
   edit = 'edit',
   delete = 'delete',
+  exportDSL = 'exportDSL',
   copyId = 'copyId',
 }
 

web/service/apps.ts

@@ -35,8 +35,13 @@ export const copyApp: Fetcher<AppDetailResponse, { appID: string; name: string;
   return post<AppDetailResponse>(`apps/${appID}/copy`, { body: { name, icon_type, icon, icon_background, mode, description } })
 }
 
-export const exportAppConfig: Fetcher<{ data: string }, { appID: string; include?: boolean }> = ({ appID, include = false }) => {
-  return get<{ data: string }>(`apps/${appID}/export?include_secret=${include}`)
+export const exportAppConfig: Fetcher<{ data: string }, { appID: string; include?: boolean; workflowID?: string }> = ({ appID, include = false, workflowID }) => {
+  const params = new URLSearchParams({
+    include_secret: include.toString(),
+  })
+  if (workflowID)
+    params.append('workflow_id', workflowID)
+  return get<{ data: string }>(`apps/${appID}/export?${params.toString()}`)
 }
 
 // TODO: delete