Implementation:Langgenius Dify UsePublishWorkflow

Knowledge Sources	Dify
Domains	Workflow, DAG, Frontend
Last Updated	2026-02-12 00:00 GMT

Overview

Description

The usePublishWorkflow hook and its companion hooks (useWorkflowVersionHistory, useUpdateWorkflow, useDeleteWorkflow) implement the complete workflow version management lifecycle as React Query mutations and queries. usePublishWorkflow promotes the current workflow draft to a new published version by POSTing to the publish endpoint with optional title and release notes. The version history hooks provide paginated browsing of all published versions with infinite scroll support.

All hooks are built on TanStack React Query (useMutation, useQuery, useInfiniteQuery), providing automatic cache management, loading/error states, and optimistic updates.

Usage

• Use usePublishWorkflow in components that trigger workflow publication (e.g., a "Publish" button).
• Use useWorkflowVersionHistory to display the version history panel with infinite scroll.
• Use useUpdateWorkflow to allow users to edit version metadata after publication.
• Use useDeleteWorkflow to allow users to remove specific versions.

Code Reference

Source Location

web/service/use-workflow.ts, lines 116-126 (usePublishWorkflow), lines 75-91 (useWorkflowVersionHistory), lines 97-107 (useUpdateWorkflow), lines 109-114 (useDeleteWorkflow).

Signature

// Publish the current draft as a new version
export const usePublishWorkflow = () => {
  return useMutation({
    mutationKey: [NAME_SPACE, 'publish'],
    mutationFn: (params: PublishWorkflowParams) =>
      post<CommonResponse & { created_at: number }>(params.url, {
        body: {
          marked_name: params.title,
          marked_comment: params.releaseNotes,
        },
      }),
  })
}

// Browse paginated version history with infinite scroll
export const useWorkflowVersionHistory = (params: FetchWorkflowDraftPageParams) => {
  const { url, initialPage, limit, userId, namedOnly } = params
  return useInfiniteQuery({
    enabled: !!url,
    queryKey: [...WorkflowVersionHistoryKey, url, initialPage, limit, userId, namedOnly],
    queryFn: ({ pageParam = 1 }) => get<FetchWorkflowDraftPageResponse>(url, {
      params: {
        page: pageParam,
        limit,
        user_id: userId || '',
        named_only: !!namedOnly,
      },
    }),
    getNextPageParam: lastPage => lastPage.has_more ? lastPage.page + 1 : null,
    initialPageParam: initialPage,
  })
}

// Update title and release notes of an existing published version
export const useUpdateWorkflow = () => {
  return useMutation({
    mutationKey: [NAME_SPACE, 'update'],
    mutationFn: (params: UpdateWorkflowParams) => patch(params.url, {
      body: {
        marked_name: params.title,
        marked_comment: params.releaseNotes,
      },
    }),
  })
}

// Delete a published version
export const useDeleteWorkflow = () => {
  return useMutation({
    mutationKey: [NAME_SPACE, 'delete'],
    mutationFn: (url: string) => del(url),
  })
}

Import

import {
  usePublishWorkflow,
  useWorkflowVersionHistory,
  useUpdateWorkflow,
  useDeleteWorkflow,
} from '@/service/use-workflow'

I/O Contract

Inputs (usePublishWorkflow)

Parameter	Type	Required	Description
params.url	string	Yes	The API endpoint URL for publishing (e.g., /apps/{appId}/workflows/publish)
params.title	string	Yes	The version title (stored as marked_name)
params.releaseNotes	string	Yes	Release notes for this version (stored as marked_comment)

Outputs (usePublishWorkflow)

Field	Type	Description
result	CommonResponse & { created_at: number }	Standard response with the creation timestamp of the new published version

Inputs (useWorkflowVersionHistory)

Parameter	Type	Required	Description
params.url	string	Yes	The API endpoint URL for version history
params.initialPage	number	Yes	The starting page number
params.limit	number	Yes	Number of versions per page
params.userId	string	No	Filter versions by creator user ID
params.namedOnly	boolean	No	Only return versions that have a title

Outputs (useWorkflowVersionHistory)

Field	Type	Description
data.pages	FetchWorkflowDraftPageResponse[]	Array of page results, each containing items: VersionHistory[], has_more: boolean, page: number

Inputs (useUpdateWorkflow)

Parameter	Type	Required	Description
params.url	string	Yes	The API endpoint URL for the specific version to update
params.title	string	Yes	Updated version title
params.releaseNotes	string	Yes	Updated release notes

Inputs (useDeleteWorkflow)

Parameter	Type	Required	Description
url	string	Yes	The API endpoint URL for the specific version to delete

Usage Examples

import { usePublishWorkflow, useWorkflowVersionHistory } from '@/service/use-workflow'

// Publish the current draft
function PublishButton({ appId }: { appId: string }) {
  const { mutate: publish, isPending } = usePublishWorkflow()

  const handlePublish = () => {
    publish({
      url: `/apps/${appId}/workflows/publish`,
      title: 'v1.2.0',
      releaseNotes: 'Added knowledge retrieval step and improved error handling',
    })
  }

  return <button onClick={handlePublish} disabled={isPending}>Publish</button>
}

// Browse version history with infinite scroll
function VersionHistory({ appId }: { appId: string }) {
  const {
    data,
    fetchNextPage,
    hasNextPage,
    isFetchingNextPage,
  } = useWorkflowVersionHistory({
    url: `/apps/${appId}/workflows/versions`,
    initialPage: 1,
    limit: 20,
  })

  return (
    <div>
      {data?.pages.map(page =>
        page.items.map(version => (
          <div key={version.id}>
            {version.created_by.name} - {new Date(version.created_at * 1000).toLocaleString()}
          </div>
        ))
      )}
      {hasNextPage && (
        <button onClick={() => fetchNextPage()} disabled={isFetchingNextPage}>
          Load More
        </button>
      )}
    </div>
  )
}

Related Pages

• Principle:Langgenius_Dify_Workflow_Publishing
• Heuristic:Langgenius_Dify_Workflow_Draft_Hash_Sync