Implementation:Langgenius Dify UseTriggers

Knowledge Sources	Langgenius_Dify
Domains	Frontend, React Query, Triggers, Plugin System, OAuth
Last Updated	2026-02-08 00:00 GMT

Overview

Provides React Query hooks for managing trigger plugins, trigger subscriptions, OAuth configuration, and dynamic form options in the Dify workflow trigger system.

Description

web/service/use-triggers.ts implements the data layer for the Dify trigger plugin system using TanStack React Query. Triggers are event-driven workflow entry points powered by plugins (e.g., webhooks, scheduled events, third-party integrations).

The module includes a data transformation function convertToTriggerWithProvider that maps raw API entities (TriggerProviderApiEntity) to the frontend-friendly TriggerWithProvider type, normalizing plugin metadata, event definitions, parameter schemas, and subscription constructors.

Query hooks:

useAllTriggerPlugins() - Fetches all available trigger plugins
useTriggerPluginsByType(triggerType) - Fetches trigger plugins filtered by type
useTriggerProviderInfo(provider) - Fetches detailed info about a trigger provider
useTriggerSubscriptions(provider) - Lists subscriptions for a provider
useTriggerSubscriptionBuilderLogs(provider, subscriptionBuilderId) - Polls subscription builder logs with optional refetch interval
useTriggerOAuthConfig(provider) - Fetches OAuth configuration for a trigger provider
useTriggerPluginDynamicOptions(payload) - Fetches dynamic form options based on plugin context and credentials

Mutation hooks:

useCreateTriggerSubscriptionBuilder() - Creates a new subscription builder
useUpdateTriggerSubscriptionBuilder() - Updates subscription builder properties and parameters
useVerifyAndUpdateTriggerSubscriptionBuilder() - Verifies and updates subscription builder credentials
useVerifyTriggerSubscription() - Verifies subscription credentials
useBuildTriggerSubscription() - Finalizes building a subscription from a builder
useDeleteTriggerSubscription() - Deletes a subscription
useUpdateTriggerSubscription() - Updates an existing subscription
useConfigureTriggerOAuth() - Configures OAuth settings for a trigger provider
useDeleteTriggerOAuth() - Removes OAuth configuration
useInitiateTriggerOAuth() - Initiates the OAuth authorization flow

Cache invalidation hooks:

useInvalidateAllTriggerPlugins() - Invalidates the trigger plugins cache
useInvalidateTriggerSubscriptions() - Returns a function to invalidate subscriptions for a specific provider
useInvalidateTriggerOAuthConfig() - Returns a function to invalidate OAuth config cache for a provider

Usage

Use these hooks in trigger configuration UIs, subscription management panels, and OAuth setup flows:

import { useAllTriggerPlugins, useTriggerSubscriptions, useConfigureTriggerOAuth } from '@/service/use-triggers'

Code Reference

Source Location

Repository: Langgenius_Dify
File: web/service/use-triggers.ts
Lines: 1-374

Signature

// Data transformation
const convertToTriggerWithProvider = (provider: TriggerProviderApiEntity): TriggerWithProvider

// Query hooks
export const useAllTriggerPlugins = (enabled?: boolean) => useQuery<TriggerWithProvider[]>({...})
export const useTriggerPluginsByType = (triggerType: string, enabled?: boolean) => useQuery<TriggerWithProvider[]>({...})
export const useTriggerProviderInfo = (provider: string, enabled?: boolean) => useQuery<TriggerProviderApiEntity>({...})
export const useTriggerSubscriptions = (provider: string, enabled?: boolean) => useQuery<TriggerSubscription[]>({...})
export const useTriggerSubscriptionBuilderLogs = (provider: string, subscriptionBuilderId: string, options?: {...}) => useQuery<{ logs: TriggerLogEntity[] }>({...})
export const useTriggerOAuthConfig = (provider: string, enabled?: boolean) => useQuery<TriggerOAuthConfig>({...})
export const useTriggerPluginDynamicOptions = (payload: {...}, enabled?: boolean) => useQuery<{ options: FormOption[] }>({...})

// Mutation hooks
export const useCreateTriggerSubscriptionBuilder = () => useMutation({...})
export const useUpdateTriggerSubscriptionBuilder = () => useMutation({...})
export const useVerifyAndUpdateTriggerSubscriptionBuilder = () => useMutation({...})
export const useBuildTriggerSubscription = () => useMutation({...})
export const useDeleteTriggerSubscription = () => useMutation({...})
export const useUpdateTriggerSubscription = () => useMutation({...})
export const useConfigureTriggerOAuth = () => useMutation({...})
export const useDeleteTriggerOAuth = () => useMutation({...})
export const useInitiateTriggerOAuth = () => useMutation({...})

// Cache invalidation
export const useInvalidateAllTriggerPlugins = () => () => void
export const useInvalidateTriggerSubscriptions = () => (provider: string) => void
export const useInvalidateTriggerOAuthConfig = () => (provider: string) => void

// Payload types
export type BuildTriggerSubscriptionPayload = {
  provider: string; subscriptionBuilderId: string;
  name?: string; parameters?: Record<string, unknown>;
}
export type ConfigureTriggerOAuthPayload = {
  provider: string; client_params?: TriggerOAuthClientParams; enabled: boolean;
}
export type UpdateTriggerSubscriptionPayload = {
  subscriptionId: string; name?: string;
  properties?: Record<string, unknown>; parameters?: Record<string, unknown>;
  credentials?: Record<string, unknown>;
}

Import

import {
  useAllTriggerPlugins, useTriggerSubscriptions, useBuildTriggerSubscription,
  useConfigureTriggerOAuth, useInvalidateTriggerSubscriptions
} from '@/service/use-triggers'

I/O Contract

Inputs

Name	Type	Required	Description
provider	string	Yes (most hooks)	Trigger provider identifier
triggerType	string	Yes (useTriggerPluginsByType)	Type filter for trigger plugins
subscriptionBuilderId	string	Yes (builder hooks)	ID of the subscription builder being configured
subscriptionId	string	Yes (subscription hooks)	ID of the existing subscription
enabled	boolean	No	Controls whether the query is active (defaults to true)
refetchInterval	number or false	No	Polling interval for log queries (defaults to false)
credentials	Record<string, unknown>	No	Credentials for verification and dynamic options
plugin_id	string	Yes (dynamic options)	Plugin identifier for fetching dynamic form options

Outputs

Name	Type	Description
TriggerWithProvider[]	array	List of trigger plugins with normalized provider/event metadata
TriggerSubscription[]	array	List of subscriptions for a trigger provider
TriggerOAuthConfig	object	OAuth configuration state for a trigger provider
{ logs: TriggerLogEntity[] }	object	Subscription builder execution logs
{ options: FormOption[] }	object	Dynamic form option values resolved from the plugin
{ authorization_url, subscription_builder }	object	OAuth authorization URL and associated builder (from initiate)
{ verified: boolean }	object	Credential verification result

Usage Examples

import {
  useAllTriggerPlugins,
  useTriggerSubscriptions,
  useBuildTriggerSubscription,
  useInvalidateTriggerSubscriptions,
} from '@/service/use-triggers'

function TriggerManager({ provider }: { provider: string }) {
  const { data: plugins, isLoading } = useAllTriggerPlugins()
  const { data: subscriptions } = useTriggerSubscriptions(provider)
  const buildMutation = useBuildTriggerSubscription()
  const invalidateSubscriptions = useInvalidateTriggerSubscriptions()

  const handleBuild = async (builderId: string) => {
    await buildMutation.mutateAsync({
      provider,
      subscriptionBuilderId: builderId,
      name: 'My Trigger',
      parameters: { event: 'push' },
    })
    invalidateSubscriptions(provider)
  }

  if (isLoading) return <Loading />

  return (
    <div>
      <h2>Available Triggers: {plugins?.length}</h2>
      <h3>Active Subscriptions: {subscriptions?.length}</h3>
      {subscriptions?.map(sub => (
        <div key={sub.id}>{sub.name}</div>
      ))}
    </div>
  )
}

Related Pages

Page Connections

Double-click a node to navigate. Hold to expand connections.

Principle

Implementation

Heuristic

Environment