⭐️ Impl:ModalView Eventts

Related: * `TODO:2023-05-01-19-12-26` - Implement: `ModalView` events. * `TODO:2023-04-05-15-35-49` - Impl. `onModalDismissWillCancel` and `onModalDismissDidCancel`.
dominicstop · May 4, 2023 · 49fdbdc · 49fdbdc
1 parent c5870c4
commit 49fdbdc
Show file tree

Hide file tree

Showing 9 changed files with 77 additions and 6 deletions.
diff --git a/ios/src_library/React Native/RNIModalView/RNIModalView.swift b/ios/src_library/React Native/RNIModalView/RNIModalView.swift
@@ -47,11 +47,18 @@ public class RNIModalView:
   public var modalIndexPrev: Int!;
 
   public lazy var modalPresentationState = RNIModalPresentationStateMachine(
-    onDismissWillCancel: { [weak self] in
-      // no-op - TBA
+    onDismissWillCancel: { [unowned self] in
+      let eventData = self.synthesizedBaseEventData;
+      self.onModalDismissWillCancel?(
+        eventData.synthesizedJSDictionary
+      );
     },
-    onDismissDidCancel: { [weak self] in
-      // no-op - TBA
+
+    onDismissDidCancel: { [unowned self] in
+      let eventData = self.synthesizedBaseEventData;
+      self.onModalDismissDidCancel?(
+        eventData.synthesizedJSDictionary
+      );
     }
   );
 
@@ -99,6 +106,9 @@ public class RNIModalView:
   @objc var onModalSwipeGestureStart: RCTBubblingEventBlock?;
   @objc var onModalSwipeGestureDidEnd: RCTBubblingEventBlock?;
 
+  @objc var onModalDismissWillCancel: RCTBubblingEventBlock?;
+  @objc var onModalDismissDidCancel: RCTBubblingEventBlock?;
+
   // MARK: - Properties: React Props - General
   // -----------------------------------------
 

diff --git a/ios/src_library/React Native/RNIModalView/RNIModalViewManager.m b/ios/src_library/React Native/RNIModalView/RNIModalViewManager.m
@@ -36,6 +36,9 @@ @interface RCT_EXTERN_MODULE(RNIModalViewManager, RCTViewManager)
 RCT_EXPORT_VIEW_PROPERTY(onModalSwipeGestureStart, RCTBubblingEventBlock);
 RCT_EXPORT_VIEW_PROPERTY(onModalSwipeGestureDidEnd, RCTBubblingEventBlock);
 
+RCT_EXPORT_VIEW_PROPERTY(onModalDismissWillCancel, RCTBubblingEventBlock);
+RCT_EXPORT_VIEW_PROPERTY(onModalDismissDidCancel, RCTBubblingEventBlock);
+
 // MARK: - Value Props - General
 // -----------------------------
 

diff --git a/src/components/ModalView/ModalView.tsx b/src/components/ModalView/ModalView.tsx
@@ -42,6 +42,8 @@ import {
   OnModalDidSnapEvent,
   OnModalSwipeGestureStartEvent,
   OnModalSwipeGestureDidEndEvent,
+  OnModalDismissWillCancelEvent,
+  OnModalDismissDidCancelEvent,
 } from '../../native_components/RNIModalView';
 
 import { RNIModalViewModule } from '../../native_modules/RNIModalViewModule';
@@ -711,7 +713,31 @@ export class ModalView extends
     );
   };
 
- private _renderModal() {
+  private _handleOnModalDismissWillCancel: OnModalDismissWillCancelEvent = (event) => {
+    const props = this.props;
+
+    props.onModalDismissWillCancel?.(event);
+    event.stopPropagation();
+
+    this.emitter.emit(
+      ModalViewEmitterEvents.onModalDismissWillCancel,
+      event.nativeEvent
+    );
+  };
+
+  private _handleOnModalDismissDidCancel: OnModalDismissDidCancelEvent = (event) => {
+    const props = this.props;
+
+    props.onModalDismissDidCancel?.(event);
+    event.stopPropagation();
+
+    this.emitter.emit(
+      ModalViewEmitterEvents.onModalDismissDidCancel,
+      event.nativeEvent
+    );
+  };
+
+  private _renderModal() {
     const { viewProps, ...props } = this.getProps();
     const state = this.state;
 
@@ -760,6 +786,8 @@ export class ModalView extends
         onModalDidSnap={this._handleOnModalDidSnap}
         onModalSwipeGestureStart={this._handleOnModalSwipeGestureStart}
         onModalSwipeGestureDidEnd={this._handleOnModalSwipeGestureDidEnd}
+        onModalDismissWillCancel={this._handleOnModalDismissWillCancel}
+        onModalDismissDidCancel={this._handleOnModalDismissDidCancel}
         {...overrideProps}
         {...viewProps}
       >

diff --git a/src/components/ModalView/ModalViewEmitter.ts b/src/components/ModalView/ModalViewEmitter.ts
@@ -22,6 +22,8 @@ import type {
   OnModalDidSnapEventObject,
   OnModalSwipeGestureStartEventObject,
   OnModalSwipeGestureDidEndEventObject,
+  OnModalDismissWillCancelEventObject,
+  OnModalDismissDidCancelEventObject,
 } from 'src/native_components/RNIModalView';
 
 import type { KeyMapType } from '../../types/UtilityTypes';
@@ -53,6 +55,8 @@ export enum ModalViewEmitterEvents {
   onModalDidSnap = 'onModalDidSnap',
   onModalSwipeGestureStart = 'onModalSwipeGestureStart',
   onModalSwipeGestureDidEnd = 'onModalSwipeGestureDidEnd',
+  onModalDismissWillCancel = 'onModalDismissWillCancel',
+  onModalDismissDidCancel = 'onModalDismissDidCancel',
 
   onLayoutModalContentContainer = 'onLayoutModalContentContainer',
 }
@@ -84,6 +88,8 @@ export type ModalViewEmitterEventMap =
     onModalDidSnap: OnModalDidSnapEventObject['nativeEvent'];
     onModalSwipeGestureStart: OnModalSwipeGestureStartEventObject['nativeEvent'];
     onModalSwipeGestureDidEnd: OnModalSwipeGestureDidEndEventObject['nativeEvent'];
+    onModalDismissWillCancel: OnModalDismissWillCancelEventObject['nativeEvent'];
+    onModalDismissDidCancel: OnModalDismissDidCancelEventObject['nativeEvent'];
 
     onLayoutModalContentContainer: LayoutChangeEvent['nativeEvent'];
   }

diff --git a/src/components/ModalView/ModalViewProps.ts b/src/components/ModalView/ModalViewProps.ts
@@ -65,6 +65,8 @@ export type ModalViewBaseProps = Partial<
     | 'onModalDidSnap'
     | 'onModalSwipeGestureStart'
     | 'onModalSwipeGestureDidEnd'
+    | 'onModalDismissWillCancel'
+    | 'onModalDismissDidCancel'
   >
 > & {
   modalContentPreferredContentSize?: RNIComputableSize;

diff --git a/src/native_components/RNIModalView/RNIModalViewEventData.ts b/src/native_components/RNIModalView/RNIModalViewEventData.ts
@@ -3,7 +3,7 @@ import type { CGPoint, CGSize } from 'src/types/NativeTypes';
 import type {
   ModalFocusState,
   ModalPresentationState,
-} from 'src/types/RNIModalViewRelatedTypes';
+} from 'src/types/RNIModalTypes';
 
 // Event Object Types
 // ------------------

diff --git a/src/native_components/RNIModalView/RNIModalViewEventObjects.ts b/src/native_components/RNIModalView/RNIModalViewEventObjects.ts
@@ -71,3 +71,9 @@ export type OnModalSwipeGestureStartEventObject =
 
 export type OnModalSwipeGestureDidEndEventObject =
   NativeSyntheticEvent<RNIModalSwipeGestureEventData>;
+
+export type OnModalDismissWillCancelEventObject =
+  NativeSyntheticEvent<RNIModalBaseEventData>;
+
+export type OnModalDismissDidCancelEventObject =
+  NativeSyntheticEvent<RNIModalBaseEventData>;
diff --git a/src/native_components/RNIModalView/RNIModalViewEvents.ts b/src/native_components/RNIModalView/RNIModalViewEvents.ts
@@ -21,6 +21,8 @@ import type {
   OnModalDidSnapEventObject,
   OnModalSwipeGestureStartEventObject,
   OnModalSwipeGestureDidEndEventObject,
+  OnModalDismissWillCancelEventObject,
+  OnModalDismissDidCancelEventObject,
 } from './RNIModalViewEventObjects';
 
 // Event Handler Types
@@ -105,3 +107,12 @@ export type OnModalSwipeGestureStartEvent = (
 export type OnModalSwipeGestureDidEndEvent = (
   event: OnModalSwipeGestureDidEndEventObject
 ) => void;
+
+export type OnModalDismissWillCancelEvent = (
+  event: OnModalDismissWillCancelEventObject
+) => void;
+
+export type OnModalDismissDidCancelEvent = (
+  event: OnModalDismissDidCancelEventObject
+) => void;
+
diff --git a/src/native_components/RNIModalView/RNIModalViewTypes.ts b/src/native_components/RNIModalView/RNIModalViewTypes.ts
@@ -31,6 +31,8 @@ import type {
   OnModalDidSnapEvent,
   OnModalSwipeGestureStartEvent,
   OnModalSwipeGestureDidEndEvent,
+  OnModalDismissWillCancelEvent,
+  OnModalDismissDidCancelEvent,
 } from './RNIModalViewEvents';
 
 import type { UnionWithAutoComplete } from 'src/types/UtilityTypes';
@@ -119,6 +121,9 @@ export type RNIModalViewBaseProps = {
 
   onModalSwipeGestureStart: OnModalSwipeGestureStartEvent;
   onModalSwipeGestureDidEnd: OnModalSwipeGestureDidEndEvent;
+
+  onModalDismissWillCancel: OnModalDismissWillCancelEvent;
+  onModalDismissDidCancel: OnModalDismissDidCancelEvent;
 };
 
 export type RNIModalViewProps = Partial<ViewProps> & RNIModalViewBaseProps;