[PR #24205] feat(workflow): Plugin Trigger Node with Unified Entry Node System #30551

Closed
opened 2026-02-21 20:47:43 -05:00 by yindo · 0 comments
Owner

Original Pull Request: https://github.com/langgenius/dify/pull/24205

State: closed
Merged: Yes


Overview

This PR implements the Plugin Trigger Node frontend components as requested in #24196, providing the foundation for plugin-based workflow triggers with complete UI/UX integration and unified entry node system architecture.

Implementation Summary

Core Changes

  • Extended BlockIcon component to support TriggerPlugin types with dynamic icons
  • Enhanced useToolIcon hook to work with trigger plugins
  • Expanded type definitions for PluginTriggerNodeType with provider integration
  • Created TriggerPluginSelector component for Start Tab plugin selection
  • Added AllStartBlocks container with complete Tools-tab-like functionality
  • Implemented search and filtering for trigger plugins
  • Added marketplace footer consistent with Tools tab
  • Enhanced trigger service layer for future backend integration

Architecture Approach

This implementation follows a maximum code reuse strategy, leveraging the existing tool system architecture:

  • TriggerPlugin nodes reuse the same icon rendering logic as Tool nodes
  • Plugin selection UI reuses the Tools component with filtering
  • Start Tab now has identical functionality to Tools Tab (search, footer, layout)
  • Type definitions extend existing patterns for consistency
  • Service layer prepares for backend API integration

UI/UX Improvements

  • Complete Start Tab redesign: Now matches Tools tab with search box, content area, and marketplace footer
  • Dynamic node display: Plugin trigger nodes show specific plugin names/icons instead of generic titles
  • Consistent interaction patterns: Search, filter, and selection work identically to Tools tab
  • Internationalization: Added translations for search placeholder in English, Chinese, and Japanese

Entry Node System Enhancements (Latest Updates)

  • Unified Entry Node Architecture: Created ENTRY_NODE_TYPES constant grouping Start, TriggerSchedule, TriggerWebhook, and TriggerPlugin
  • Intelligent Deletion Logic: Implemented unified deletion system allowing any entry node to be deleted as long as at least one remains
  • Visual Distinction: Added 'original start node' label to User Input with full i18n support (en/zh-Hans/ja-JP)
  • Improved UI Layout: Added divider between User Input and trigger types for better visual separation
  • Icon Consistency: Fixed icon sizing inconsistencies across trigger types

Current Status: Ready for Review

The plugin trigger architecture is functionally complete with full UI integration and enhanced entry node management:

  • Basic plugin trigger node architecture
  • Icon system integration with dynamic plugin-specific icons
  • Complete Start Tab redesign with search and marketplace integration
  • Plugin trigger node canvas display with dynamic content
  • Type system extension for provider integration
  • Service layer preparation for backend API
  • Unified entry node deletion system - Start nodes can now be deleted like other triggers
  • Enhanced UI/UX - Clear visual separation and labeling of different entry types
  • Visual consistency - Fixed icon sizing and layout inconsistencies
  • 🔄 Ready for backend integration - Only requires replacing useAllBuiltInTools() with useAllTriggerPlugins()

Files Changed (11 commits)

  • app/components/workflow/block-icon.tsx - Extended for TriggerPlugin support + fixed icon sizing
  • app/components/workflow/hooks/use-workflow.ts - Added TriggerPlugin icon support
  • app/components/workflow/hooks/use-nodes-interactions.ts - NEW: Unified entry node deletion logic
  • app/components/workflow/nodes/trigger-plugin/ - Enhanced node display and panel
  • app/components/workflow/block-selector/ - Complete Start Tab redesign + entry node improvements
  • service/use-triggers.ts - Service layer for trigger plugins
  • i18n/ - EXPANDED: Added search + entry node translations (en/zh-Hans/ja-JP)

Testing

  • Manual testing of plugin trigger node creation in Start Tab
  • Visual verification of icon rendering and dynamic display
  • Search functionality testing
  • UI consistency verification with Tools Tab
  • NEW: Entry node deletion testing - verified at least one entry node remains
  • NEW: Visual separation and labeling verification
  • NEW: Icon sizing consistency verification across all trigger types

Related to #24196, #24198

**Original Pull Request:** https://github.com/langgenius/dify/pull/24205 **State:** closed **Merged:** Yes --- ## Overview This PR implements the Plugin Trigger Node frontend components as requested in #24196, providing the foundation for plugin-based workflow triggers with complete UI/UX integration and unified entry node system architecture. ## Implementation Summary ### Core Changes - **Extended BlockIcon component** to support TriggerPlugin types with dynamic icons - **Enhanced useToolIcon hook** to work with trigger plugins - **Expanded type definitions** for PluginTriggerNodeType with provider integration - **Created TriggerPluginSelector** component for Start Tab plugin selection - **Added AllStartBlocks container** with complete Tools-tab-like functionality - **Implemented search and filtering** for trigger plugins - **Added marketplace footer** consistent with Tools tab - **Enhanced trigger service layer** for future backend integration ### Architecture Approach This implementation follows a **maximum code reuse strategy**, leveraging the existing tool system architecture: - TriggerPlugin nodes reuse the same icon rendering logic as Tool nodes - Plugin selection UI reuses the Tools component with filtering - Start Tab now has identical functionality to Tools Tab (search, footer, layout) - Type definitions extend existing patterns for consistency - Service layer prepares for backend API integration ### UI/UX Improvements - **Complete Start Tab redesign**: Now matches Tools tab with search box, content area, and marketplace footer - **Dynamic node display**: Plugin trigger nodes show specific plugin names/icons instead of generic titles - **Consistent interaction patterns**: Search, filter, and selection work identically to Tools tab - **Internationalization**: Added translations for search placeholder in English, Chinese, and Japanese ### Entry Node System Enhancements (Latest Updates) - **Unified Entry Node Architecture**: Created ENTRY_NODE_TYPES constant grouping Start, TriggerSchedule, TriggerWebhook, and TriggerPlugin - **Intelligent Deletion Logic**: Implemented unified deletion system allowing any entry node to be deleted as long as at least one remains - **Visual Distinction**: Added 'original start node' label to User Input with full i18n support (en/zh-Hans/ja-JP) - **Improved UI Layout**: Added divider between User Input and trigger types for better visual separation - **Icon Consistency**: Fixed icon sizing inconsistencies across trigger types ## Current Status: ✅ Ready for Review The plugin trigger architecture is functionally complete with full UI integration and enhanced entry node management: - ✅ Basic plugin trigger node architecture - ✅ Icon system integration with dynamic plugin-specific icons - ✅ Complete Start Tab redesign with search and marketplace integration - ✅ Plugin trigger node canvas display with dynamic content - ✅ Type system extension for provider integration - ✅ Service layer preparation for backend API - ✅ **Unified entry node deletion system** - Start nodes can now be deleted like other triggers - ✅ **Enhanced UI/UX** - Clear visual separation and labeling of different entry types - ✅ **Visual consistency** - Fixed icon sizing and layout inconsistencies - 🔄 **Ready for backend integration** - Only requires replacing `useAllBuiltInTools()` with `useAllTriggerPlugins()` ## Files Changed (11 commits) - `app/components/workflow/block-icon.tsx` - Extended for TriggerPlugin support + fixed icon sizing - `app/components/workflow/hooks/use-workflow.ts` - Added TriggerPlugin icon support - `app/components/workflow/hooks/use-nodes-interactions.ts` - **NEW**: Unified entry node deletion logic - `app/components/workflow/nodes/trigger-plugin/` - Enhanced node display and panel - `app/components/workflow/block-selector/` - Complete Start Tab redesign + entry node improvements - `service/use-triggers.ts` - Service layer for trigger plugins - `i18n/` - **EXPANDED**: Added search + entry node translations (en/zh-Hans/ja-JP) ## Testing - [x] Manual testing of plugin trigger node creation in Start Tab - [x] Visual verification of icon rendering and dynamic display - [x] Search functionality testing - [x] UI consistency verification with Tools Tab - [x] **NEW**: Entry node deletion testing - verified at least one entry node remains - [x] **NEW**: Visual separation and labeling verification - [x] **NEW**: Icon sizing consistency verification across all trigger types Related to #24196, #24198
yindo added the pull-request label 2026-02-21 20:47:43 -05:00
yindo closed this issue 2026-02-21 20:47:43 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: langgenius/dify#30551