feat: inform whether screen is opening/closing in onTransition callba…

…cks (facebook#169)
react-one · Aug 18, 2019 · c0c17e9 · c0c17e9
1 parent 81b1bdf
commit c0c17e9
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 11 deletions.
diff --git a/packages/stack/src/types.tsx b/packages/stack/src/types.tsx
@@ -107,8 +107,8 @@ export type NavigationStackOptions = HeaderOptions &
       vertical?: number;
       horizontal?: number;
     };
-    onTransitionStart?: () => void;
-    onTransitionEnd?: () => void;
+    onTransitionStart?: (closing: boolean) => void;
+    onTransitionEnd?: (closing: boolean) => void;
   };
 
 export type NavigationStackConfig = {

diff --git a/packages/stack/src/views/Stack/Stack.tsx b/packages/stack/src/views/Stack/Stack.tsx
@@ -254,21 +254,27 @@ export default class Stack extends React.Component<Props, State> {
     }));
   };
 
-  private handleTransitionStart = ({ route }: { route: Route }) => {
+  private handleTransitionStart = (
+    { route }: { route: Route },
+    closing: boolean
+  ) => {
     const { descriptors } = this.props;
     const descriptor = descriptors[route.key];
 
     descriptor &&
       descriptor.options.onTransitionStart &&
-      descriptor.options.onTransitionStart();
+      descriptor.options.onTransitionStart(closing);
   };
 
-  private handleTransitionEnd = ({ route }: { route: Route }) => {
+  private handleTransitionEnd = (
+    { route }: { route: Route },
+    closing: boolean
+  ) => {
     const descriptor = this.props.descriptors[route.key];
 
     descriptor &&
       descriptor.options.onTransitionEnd &&
-      descriptor.options.onTransitionEnd();
+      descriptor.options.onTransitionEnd(closing);
   };
 
   render() {

diff --git a/packages/stack/src/views/Stack/StackItem.tsx b/packages/stack/src/views/Stack/StackItem.tsx
@@ -33,8 +33,8 @@ type Props = TransitionPreset & {
   onOpenRoute: (props: { route: Route }) => void;
   onCloseRoute: (props: { route: Route }) => void;
   onGoBack: (props: { route: Route }) => void;
-  onTransitionStart?: (props: { route: Route }) => void;
-  onTransitionEnd?: (props: { route: Route }) => void;
+  onTransitionStart?: (props: { route: Route }, closing: boolean) => void;
+  onTransitionEnd?: (props: { route: Route }, closing: boolean) => void;
   onPageChangeStart?: () => void;
   onPageChangeConfirm?: () => void;
   onPageChangeCancel?: () => void;
@@ -52,14 +52,14 @@ export default class StackItem extends React.PureComponent<Props> {
   private handleOpen = () => {
     const { scene, onTransitionEnd, onOpenRoute } = this.props;
 
-    onTransitionEnd && onTransitionEnd({ route: scene.route });
+    onTransitionEnd && onTransitionEnd({ route: scene.route }, false);
     onOpenRoute({ route: scene.route });
   };
 
   private handleClose = () => {
     const { scene, onTransitionEnd, onCloseRoute } = this.props;
 
-    onTransitionEnd && onTransitionEnd({ route: scene.route });
+    onTransitionEnd && onTransitionEnd({ route: scene.route }, true);
     onCloseRoute({ route: scene.route });
   };
 
@@ -78,7 +78,7 @@ export default class StackItem extends React.PureComponent<Props> {
       onPageChangeCancel && onPageChangeCancel();
     }
 
-    onTransitionStart && onTransitionStart({ route: scene.route });
+    onTransitionStart && onTransitionStart({ route: scene.route }, closing);
     closing && onGoBack({ route: scene.route });
   };