From c0a5f6a8e42993fb5cc6193a2a266efb9d74c7da Mon Sep 17 00:00:00 2001 From: Hein Rutjes Date: Sat, 31 Aug 2019 23:51:28 +0200 Subject: [PATCH] fix: fixed `navigation.setParams` not working --- src/SharedElementRendererData.tsx | 39 +++++++----------------------- src/SharedElementRendererProxy.tsx | 16 ++++-------- src/SharedElementSceneData.tsx | 8 +++++- src/createSharedElementScene.tsx | 12 ++++++--- 4 files changed, 29 insertions(+), 46 deletions(-) diff --git a/src/SharedElementRendererData.tsx b/src/SharedElementRendererData.tsx index 98a2e07..b42b137 100644 --- a/src/SharedElementRendererData.tsx +++ b/src/SharedElementRendererData.tsx @@ -4,7 +4,6 @@ import { SharedElementsConfig, SharedElementAnimatedValue, SharedElementTransitionProps, - NavigationProp, } from './types'; import { normalizeSharedElementsConfig } from './utils'; @@ -13,27 +12,20 @@ export type SharedElementRendererUpdateHandler = () => any; export interface ISharedElementRendererData { startTransition(animValue: SharedElementAnimatedValue): void; endTransition(): void; - willActivateScene( - sceneData: SharedElementSceneData, - navigation: NavigationProp - ): void; - didActivateScene( - sceneData: SharedElementSceneData, - navigation: NavigationProp - ): void; + willActivateScene(sceneData: SharedElementSceneData): void; + didActivateScene(sceneData: SharedElementSceneData): void; } function getSharedElements( sceneData: SharedElementSceneData, - navigation: NavigationProp, - otherNavigation: NavigationProp, + otherSceneData: SharedElementSceneData, show: boolean ): SharedElementsConfig | null { const { sharedElements } = sceneData.Component; if (!sharedElements) return null; // TODO push/pop distinction? return normalizeSharedElementsConfig( - sharedElements(navigation, otherNavigation, show) + sharedElements(sceneData.navigation, otherSceneData.navigation, show) ); } @@ -41,7 +33,6 @@ export default class SharedElementRendererData implements ISharedElementRendererData { private sceneData: SharedElementSceneData | null = null; private prevSceneData: SharedElementSceneData | null = null; - private prevNavigation: NavigationProp | null = null; private updateSubscribers = new Set(); private sceneSubscription: SharedElementEventSubscription | null = null; private sharedElements: SharedElementsConfig = []; @@ -55,25 +46,17 @@ export default class SharedElementRendererData // Nothing to do } - willActivateScene( - sceneData: SharedElementSceneData, - navigation: NavigationProp - ): void { + willActivateScene(sceneData: SharedElementSceneData): void { /*console.log( 'SharedElementRendererData.willActivateScene: ', sceneData.name, ', previous: ', this.prevSceneData ? this.prevSceneData.name : '' );*/ - if (!this.prevSceneData || !this.prevNavigation) return; + if (!this.prevSceneData) return; const sharedElements = - getSharedElements(sceneData, navigation, this.prevNavigation, true) || - getSharedElements( - this.prevSceneData, - this.prevNavigation, - navigation, - false - ); + getSharedElements(sceneData, this.prevSceneData, true) || + getSharedElements(this.prevSceneData, sceneData, false); if (sharedElements && sharedElements.length) { // console.log('sharedElements: ', sharedElements, sceneData); this.sceneData = sceneData; @@ -86,17 +69,13 @@ export default class SharedElementRendererData } } - didActivateScene( - sceneData: SharedElementSceneData, - navigation: NavigationProp - ): void { + didActivateScene(sceneData: SharedElementSceneData): void { //console.log('SharedElementRendererData.didActivateScene: ', sceneData.name); if (this.sceneSubscription) { this.sceneSubscription.remove(); this.sceneSubscription = null; } this.prevSceneData = sceneData; - this.prevNavigation = navigation; if (this.sceneData) { this.sceneData = null; if (this.sharedElements.length) { diff --git a/src/SharedElementRendererProxy.tsx b/src/SharedElementRendererProxy.tsx index 7ed900e..a2d5583 100644 --- a/src/SharedElementRendererProxy.tsx +++ b/src/SharedElementRendererProxy.tsx @@ -1,7 +1,7 @@ import SharedElementRendererData, { ISharedElementRendererData, } from './SharedElementRendererData'; -import { SharedElementAnimatedValue, NavigationProp } from './types'; +import { SharedElementAnimatedValue } from './types'; import SharedElementSceneData from './SharedElementSceneData'; export class SharedElementRendererProxy implements ISharedElementRendererData { @@ -27,30 +27,24 @@ export class SharedElementRendererProxy implements ISharedElementRendererData { return this.data.endTransition(); } - willActivateScene( - sceneData: SharedElementSceneData, - navigation: NavigationProp - ) { + willActivateScene(sceneData: SharedElementSceneData) { if (!this.data) { console.warn( 'SharedElementRendererProxy.willActivateScene called before Proxy was initialized' ); return; } - return this.data.willActivateScene(sceneData, navigation); + return this.data.willActivateScene(sceneData); } - didActivateScene( - sceneData: SharedElementSceneData, - navigation: NavigationProp - ) { + didActivateScene(sceneData: SharedElementSceneData) { if (!this.data) { console.warn( 'SharedElementRendererProxy.didActivateScene called before Proxy was initialized' ); return; } - return this.data.didActivateScene(sceneData, navigation); + return this.data.didActivateScene(sceneData); } get source(): SharedElementRendererData | null { diff --git a/src/SharedElementSceneData.tsx b/src/SharedElementSceneData.tsx index d90df1a..5b16927 100644 --- a/src/SharedElementSceneData.tsx +++ b/src/SharedElementSceneData.tsx @@ -2,6 +2,7 @@ import { SharedElementNode, SharedElementEventSubscription, SharedElementSceneComponent, + NavigationProp, } from './types'; export type SharedElementSceneUpdateHandlerEventType = @@ -23,9 +24,14 @@ export default class SharedElementSceneData { } = {}; public readonly Component: SharedElementSceneComponent; public readonly name: string; + public navigation: NavigationProp; - constructor(Component: SharedElementSceneComponent) { + constructor( + Component: SharedElementSceneComponent, + navigation: NavigationProp + ) { this.Component = Component; + this.navigation = navigation; this.name = Component.displayName || Component.name || diff --git a/src/createSharedElementScene.tsx b/src/createSharedElementScene.tsx index 1f64efb..0f7e0c3 100644 --- a/src/createSharedElementScene.tsx +++ b/src/createSharedElementScene.tsx @@ -42,7 +42,8 @@ function createSharedElementScene( [key: string]: SharedElementEventSubscription; } = {}; private sceneData: SharedElementSceneData = new SharedElementSceneData( - Component + Component, + this.props.navigation ); componentDidMount() { @@ -74,13 +75,16 @@ function createSharedElementScene( ); } + componentDidUpdate() { + this.sceneData.navigation = this.props.navigation; + } + private onSetRef = (ref: any) => { this.sceneData.setAncestor(nodeFromRef(ref)); }; private onWillFocus = () => { - const { navigation } = this.props; - rendererData.willActivateScene(this.sceneData, navigation); + rendererData.willActivateScene(this.sceneData); }; private onDidFocus = () => { @@ -88,7 +92,7 @@ function createSharedElementScene( const activeRoute = getActiveRouteState(navigation.state); if (navigation.state.routeName === activeRoute.routeName) { // console.log('onDidFocus: ', this.sceneData.name, navigation); - rendererData.didActivateScene(this.sceneData, navigation); + rendererData.didActivateScene(this.sceneData); } }; }