feat(events): Add ModalAttemptedToDismiss event

Author: jpgarcia

src/index.test.ts

@@ -4,6 +4,7 @@ import {
   ComponentDidAppearEvent,
   ComponentDidDisappearEvent,
   CommandCompletedEvent,
+  ModalAttemptedToDismissEvent,
   ScreenPoppedEvent,
   ModalDismissedEvent,
   BottomTabSelectedEvent,
@@ -19,6 +20,7 @@ import {
   useNavigationComponentDidDisappear,
   useNavigationCommand,
   useNavigationCommandComplete,
+  useNavigationModalAttemptedToDismiss,
   useNavigationModalDismiss,
   useNavigationScreenPop,
   useNavigationBottomTabSelect,
@@ -431,6 +433,97 @@ describe('useNavigationCommandComplete', () => {
   })
 })
 
+describe('useNavigationModalAttemptedToDismiss', () => {
+  let triggerEvent: (event: ModalAttemptedToDismissEvent) => void
+  let mockRemoveSubscription: () => void
+  let mockHandler: () => void
+
+  beforeEach(() => {
+    mockHandler = jest.fn(() => {})
+    mockRemoveSubscription = jest.fn()
+
+    Navigation.events = jest.fn().mockReturnValue({
+      registerModalAttemptedToDismissListener: jest.fn(callback => {
+        triggerEvent = callback
+
+        return { remove: mockRemoveSubscription }
+      }),
+    })
+  })
+
+  it('should remove the event listener on unmount', () => {
+    const { result, unmount } = renderHook(() => {
+      useNavigationModalAttemptedToDismiss(() => {})
+    })
+
+    unmount()
+
+    expect(mockRemoveSubscription).toBeCalledTimes(1)
+
+    expect(result.current).toBeUndefined()
+    expect(result.error).toBeUndefined()
+  })
+
+  it('should never call the handler if no event was triggered', () => {
+    const { result } = renderHook(() => {
+      useNavigationModalAttemptedToDismiss(() => {})
+    })
+
+    expect(mockHandler).toBeCalledTimes(0)
+
+    expect(result.current).toBeUndefined()
+    expect(result.error).toBeUndefined()
+  })
+
+  it('should call handler twice when componentId is not provided', () => {
+    const { result } = renderHook(() => {
+      useNavigationModalAttemptedToDismiss(mockHandler)
+    })
+
+    const event1 = { componentId: 'COMPONENT_ID_1' }
+    triggerEvent(event1)
+
+    const event2 = { componentId: 'COMPONENT_ID_2' }
+    triggerEvent(event2)
+
+    expect(mockHandler).toBeCalledTimes(2)
+    expect(mockHandler).toHaveBeenNthCalledWith(1, event1)
+    expect(mockHandler).toHaveBeenNthCalledWith(2, event2)
+
+    expect(result.current).toBeUndefined()
+    expect(result.error).toBeUndefined()
+  })
+
+  it('should call handler once if componentId provided', () => {
+    const { result } = renderHook(() => {
+      useNavigationModalAttemptedToDismiss(mockHandler, 'COMPONENT_ID_1')
+    })
+
+    const event = { componentId: 'COMPONENT_ID_1' }
+    triggerEvent(event)
+
+    expect(mockHandler).toBeCalledTimes(1)
+    expect(mockHandler).toBeCalledWith(event)
+
+    expect(result.current).toBeUndefined()
+    expect(result.error).toBeUndefined()
+  })
+
+  it('should never call the handler if componentId does not match', () => {
+    const { result } = renderHook(() => {
+      useNavigationModalAttemptedToDismiss(mockHandler, 'COMPONENT_ID_1')
+    })
+
+    const event = { componentId: 'COMPONENT_ID_2' }
+    triggerEvent(event)
+
+    expect(mockHandler).toBeCalledTimes(0)
+
+    expect(result.current).toBeUndefined()
+    expect(result.error).toBeUndefined()
+  })
+})
+
 describe('useNavigationScreenPop', () => {
   let triggerEvent: (event: ScreenPoppedEvent) => void
   let mockRemoveSubscription: () => void

src/index.ts

@@ -4,6 +4,7 @@ import {
   ComponentDidAppearEvent,
   ComponentDidDisappearEvent,
   CommandCompletedEvent,
+  ModalAttemptedToDismissEvent,
   ModalDismissedEvent,
   ScreenPoppedEvent,
   BottomTabSelectedEvent,
@@ -80,6 +81,25 @@ function useNavigationCommandComplete(handler: (event: CommandCompletedEvent) =>
   }, [handler, commandName])
 }
 
+function useNavigationModalAttemptedToDismiss(
+  handler: (event: ModalAttemptedToDismissEvent) => void,
+  componentId?: string
+) {
+  useLayoutEffect(() => {
+    const subscription = Navigation.events().registerModalAttemptedToDismissListener(event => {
+      const equalCommandId = event.componentId === componentId
+
+      if (componentId && !equalCommandId) {
+        return
+      }
+
+      handler(event)
+    })
+
+    return () => subscription.remove()
+  }, [handler, componentId])
+}
+
 function useNavigationModalDismiss(handler: (event: ModalDismissedEvent) => void, componentId?: string) {
   useLayoutEffect(() => {
     const subscription = Navigation.events().registerModalDismissedListener(event => {
@@ -197,6 +217,7 @@ export {
   useNavigationComponentDidDisappear,
   useNavigationCommand,
   useNavigationCommandComplete,
+  useNavigationModalAttemptedToDismiss,
   useNavigationModalDismiss,
   useNavigationScreenPop,
   useNavigationBottomTabSelect,