Skip to content

hook notificationevents

Paulo Gomes da Cruz Junior edited this page Sep 11, 2026 · 2 revisions

🔔 useNotificationEvents Hook

Overview

useNotificationEvents is a shared, generic React hook for publishing and subscribing to application notification events. It wraps the Notification context and exposes helpers for sending toast or inline events, subscribing to event types, and clearing scoped notifications. It is not waste-specific.

🧪 Usage Example

import useNotificationEvents from '@/hooks/useNotificationEvents';

const Component = () => {
  const { sendToastEvent, subscribe } = useNotificationEvents();

  useEffect(() => {
    const off = subscribe('info', (event) => {
      console.log(event.title, event.description);
    });
    return () => off();
  }, [subscribe]);

  const handleClick = () => {
    sendToastEvent({
      eventType: 'info',
      title: 'Saved',
      description: 'Changes were saved.',
      eventTarget: 'my-page',
    });
  };

  return <button onClick={handleClick}>Save</button>;
};

🔍 Implementation Details

  • Wraps useNotification from NotificationProvider.
  • sendToastEvent forces displayMode: 'toast'.
  • sendInlineEvent forces displayMode: 'inline'.
  • sendEvent passes through without forcing display mode.
  • subscribe and unsubscribe operate by EventType.
  • clearEvents dispatches a clear-events info event for scoped clearing.

📦 Return Type

function useNotificationEvents(): {
  clearEvents: (eventTarget?: string) => void;
  sendEvent: (event: GlobalEvent) => void;
  sendInlineEvent: (event: Omit<GlobalEvent, 'displayMode'>) => void;
  sendToastEvent: (event: Omit<GlobalEvent, 'displayMode'>) => void;
  subscribe: (eventType: EventType, listener: EventListener) => () => void;
  unsubscribe: (eventType: EventType, listener: EventListener) => void;
}

Key types

  • EventType: 'error' | 'info' | 'success' | 'warning'
  • NotificationDisplayMode: 'inline' | 'toast'
  • GlobalEvent: title, description, eventType, optional timeout, eventTarget, displayMode, meta

💡 Why It Matters

Decouples event producers from consumers and supports scoped page clears without tying components to waste domain logic.


For more hooks, see Contexts & Hooks.

Waste Plus Wiki

Home

Architecture

Codes

Decisions

Knowledge Base

Development

Changes

Clone this wiki locally