@open-mercato/ui 0.5.1-develop.3036.f02c281f23 → 0.5.1-develop.3045.b4b3320cc2

package/src/backend/notifications/__tests__/useNotificationEffect.test.tsx

@@ -0,0 +1,77 @@
+import { act, renderHook } from '@testing-library/react'
+import type { NotificationDto } from '@open-mercato/shared/modules/notifications/types'
+import { APP_EVENT_DOM_NAME } from '../../injection/useAppEvent'
+import {
+  __resetNotificationDispatcherForTests,
+  dispatchNotificationHandlers,
+} from '../NotificationDispatcher'
+import { useNotificationEffect } from '../useNotificationEffect'
+
+function makeNotification(id: string, type: string): NotificationDto {
+  return {
+    id,
+    type,
+    title: `title-${id}`,
+    severity: 'info',
+    status: 'unread',
+    actions: [],
+    createdAt: new Date().toISOString(),
+  }
+}
+
+function dispatchNotificationCreated(notification: NotificationDto) {
+  window.dispatchEvent(
+    new CustomEvent(APP_EVENT_DOM_NAME, {
+      detail: {
+        id: 'notifications.notification.created',
+        payload: { notification },
+        timestamp: Date.now(),
+        organizationId: 'org-1',
+      },
+    }),
+  )
+}
+
+function runtime() {
+  return {
+    features: [],
+    currentPath: '/backend/umes-next-phases',
+    refreshNotifications: jest.fn(),
+    navigate: jest.fn(),
+    markAsRead: jest.fn(async () => {}),
+    dismiss: jest.fn(async () => {}),
+  }
+}
+
+describe('useNotificationEffect', () => {
+  beforeEach(() => {
+    __resetNotificationDispatcherForTests()
+  })
+
+  it('runs component-scoped effects from notification-created bridge events', () => {
+    const calls: string[] = []
+    const notification = makeNotification('n1', 'example.umes.actionable')
+
+    renderHook(() => useNotificationEffect('example.umes.actionable', (item) => calls.push(item.id)))
+
+    act(() => {
+      dispatchNotificationCreated(notification)
+    })
+
+    expect(calls).toEqual(['n1'])
+  })
+
+  it('dedupes when the dispatcher and bridge deliver the same notification', () => {
+    const calls: string[] = []
+    const notification = makeNotification('n1', 'example.umes.actionable')
+
+    renderHook(() => useNotificationEffect('example.umes.actionable', (item) => calls.push(item.id)))
+
+    act(() => {
+      dispatchNotificationHandlers([notification], runtime())
+      dispatchNotificationCreated(notification)
+    })
+
+    expect(calls).toEqual(['n1'])
+  })
+})

package/src/backend/notifications/useNotificationEffect.ts

@@ -2,16 +2,61 @@
 
 import * as React from 'react'
 import type { NotificationDto } from '@open-mercato/shared/modules/notifications/types'
+import type { AppEventPayload } from '@open-mercato/shared/modules/widgets/injection'
+import { useAppEvent } from '../injection/useAppEvent'
 import { subscribeNotificationEffects } from './NotificationDispatcher'
 
+const NOTIFICATION_CREATED_EVENT = 'notifications.notification.created'
+const MAX_SEEN_IDS = 200
+
+function matchesType(pattern: string | string[], type: string): boolean {
+  const patterns = Array.isArray(pattern) ? pattern : [pattern]
+  return patterns.some((current) => {
+    if (current === '*') return true
+    if (current.endsWith('.*')) return type.startsWith(current.slice(0, -1))
+    return current === type
+  })
+}
+
+function readNotificationFromEvent(event: AppEventPayload): NotificationDto | null {
+  const payload = event.payload
+  if (!payload || typeof payload !== 'object') return null
+  const notification = (payload as { notification?: unknown }).notification
+  if (!notification || typeof notification !== 'object') return null
+  const candidate = notification as Partial<NotificationDto>
+  if (typeof candidate.id !== 'string' || typeof candidate.type !== 'string') return null
+  return candidate as NotificationDto
+}
+
 export function useNotificationEffect(
   notificationType: string | string[],
   effect: (notification: NotificationDto) => void,
   deps: React.DependencyList = [],
 ) {
+  const seenIdsRef = React.useRef<string[]>([])
+
+  const handleNotification = React.useCallback((notification: NotificationDto) => {
+    if (!matchesType(notificationType, notification.type)) return
+    if (seenIdsRef.current.includes(notification.id)) return
+    seenIdsRef.current = [notification.id, ...seenIdsRef.current.filter((id) => id !== notification.id)]
+      .slice(0, MAX_SEEN_IDS)
+    effect(notification)
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [notificationType, ...deps])
+
   React.useEffect(() => {
-    const unsubscribe = subscribeNotificationEffects(notificationType, effect)
+    const unsubscribe = subscribeNotificationEffects(notificationType, handleNotification)
     return unsubscribe
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [notificationType, ...deps])
+  }, [notificationType, handleNotification])
+
+  useAppEvent(
+    NOTIFICATION_CREATED_EVENT,
+    (event) => {
+      const notification = readNotificationFromEvent(event)
+      if (!notification) return
+      handleNotification(notification)
+    },
+    [handleNotification],
+  )
 }

package/src/index.ts

@@ -47,3 +47,4 @@ export * from './primitives/Notice'
 export * from './primitives/ErrorNotice'
 export * from './primitives/dialog'
 export * from './primitives/progress'
+export * from './ai'