Skip to content

Action Patterns

Pure action dispatching patterns without state management overhead.

Overview

Action patterns are perfect for event systems, command patterns, and side effects handling. All Action patterns are built on the standardized setup specifications from the Basic Action Setup guide.

Prerequisites

Before implementing any Action pattern, complete the setup process:

  1. Type DefinitionsCommon Action Patterns
  2. Context CreationContext Creation Patterns
  3. Provider SetupProvider Setup Patterns

All examples in Action pattern documents use the standardized setup patterns, particularly:

  • EventActions type pattern for basic examples
  • Single Domain Context creation pattern
  • Single Provider Setup for component integration

Available Action Patterns

Core Patterns

  • Basic Usage - Fundamental Action Only pattern with type-safe dispatching
    • Uses EventActions setup pattern from Basic Action Setup
  • Type System - TypeScript integration and type safety
    • Built on ActionPayloadMap extension pattern from setup guide
  • Register Delegation - Modular handler organization for large applications
    • Uses Multi-Domain Context Setup pattern

Advanced Patterns

  • Advanced Patterns - Overview of all advanced action patterns
    • Showcases multiple setup patterns for complex architectures
  • Dispatch Patterns - Execution modes, filtering, and performance
    • Uses AppActions extended interface pattern from setup
  • Advanced Filtering - Sophisticated handler filtering strategies
    • Handler ID, priority ranges, custom logic, and combined filtering patterns
  • Dispatch with Result - Result collection and processing
    • Built on setup patterns with result handling extensions
  • Register Patterns - Advanced handler registration and memory management
    • Uses conditional provider setup patterns for complex scenarios
    • Includes memory management and handler limit configuration
  • Dispatch Access - Hook-based vs register-based access
    • Demonstrates setup pattern variations for different access strategies
  • Handler State Access - ⚠️ Critical: Avoiding closure traps in handlers
    • Essential patterns for proper setup and handler lifecycle management

Quick Reference

All examples use the standardized Basic Action Setup specifications.

Setup-Based Quick Start

typescript
// 1. Use EventActions type pattern (from setup guide)
interface EventActions {
  userClick: { x: number; y: number };
  analytics: { event: string; data: any };
}

// 2. Use Single Domain Context pattern (from setup guide)
const {
  Provider: EventActionProvider,
  useActionDispatch: useEventDispatch,
  useActionHandler: useEventHandler
} = createActionContext<EventActions>('Events');

// 3. Use Single Provider Setup pattern (from setup guide)
function App() {
  return (
    <EventActionProvider>
      <InteractiveComponent />
    </EventActionProvider>
  );
}

// 4. Component implementation using setup patterns
function InteractiveComponent() {
  const dispatch = useEventDispatch();
  
  const clickHandler = useCallback((payload) => {
    console.log('Click at:', payload.x, payload.y);
  }, []);
  
  useEventHandler('userClick', clickHandler);
  
  return <button onClick={(e) => 
    dispatch('userClick', { x: e.clientX, y: e.clientY })
  }>
    Click Me
  </button>;
}

Pattern Reference

PatternSetup FoundationBest For
Basic UsageEventActions + Single DomainEvent systems, analytics, API calls
Advanced PatternsMulti-Domain SetupComplex applications, domain separation
Advanced FilteringProcessActions + Handler RegistryConditional execution, workflow control, performance optimization
Register DelegationMulti-Context SetupLarge apps, team separation, modular architecture

When to Use Action Patterns

Choose Action patterns (built on standardized setup) for:

  • Pure Side Effects: Analytics, logging, notifications
  • Command Patterns: User actions, system commands
  • Event Systems: Cross-component communication
  • API Integration: External service calls
  • Modular Architecture: Team-based handler separation

All implementations follow the setup specifications for consistency and maintainability.

Key Features

Action patterns provide these capabilities through standardized setup:

  • ✅ Type-safe action dispatching (via ActionPayloadMap extension)
  • ✅ Priority-based handler execution (through proper context creation)
  • ✅ Abort support and error handling (built into setup patterns)
  • ✅ Result handling with async support (via useActionDispatchWithResult)
  • ✅ Memory management and handler limits (configurable limits and monitoring)
  • ✅ Lightweight (no store overhead, setup-optimized)
  • ✅ Modular handler organization (through multi-domain setup patterns)

Setup-Based Architecture Integration

Action patterns integrate seamlessly with other patterns through shared setup foundations:

Setup Integration Flow

  1. Start with SetupBasic Action Setup
  2. Choose Pattern → Select appropriate Action pattern from this guide
  3. Implement Components → Use setup-based examples in each pattern
  4. Scale Architecture → Extend with Multi-Context Setup for complex apps

Next Steps

  1. Complete Setup: Follow Basic Action Setup first
  2. Start with Basics: Begin with Basic Usage
  3. Explore Advanced: Move to Advanced Patterns when ready
  4. Scale Up: Use Register Delegation for complex applications

Released under the Apache-2.0 License.