From 4a5bec10cefaf17c9b8e06c2a102f701a6c79452 Mon Sep 17 00:00:00 2001
From: Igor Randjelovic <rigor789@gmail.com>
Date: Tue, 7 Sep 2021 21:24:12 +0200
Subject: [PATCH] feat: Frame replacePage by entry (#9460)

* feat: Frame replacePage by entry

* feat(webpack): improved svelte HMR (#9497)

* update svelte config to use svelte-loader

* handle null config

* fix: worker support in .svelte files & update snapshots

* fix after merge

Co-authored-by: halfnelson <dpershouse@gmail.com>
Co-authored-by: Igor Randjelovic <rigor789@gmail.com>

* feat(webpack): use svelte-loader and fallback to svelte-loader-hot

Allows running older projects

* feat: allow overwriting replacePage transition

Co-authored-by: farfromrefuge <martin.guillon@akylas.fr>
Co-authored-by: halfnelson <dpershouse@gmail.com>
---
 packages/core/ui/frame/frame-common.ts  | 22 +++++++++++++++++-----
 packages/core/ui/frame/index.android.ts |  9 +--------
 packages/core/ui/frame/index.ios.ts     | 10 +---------
 3 files changed, 19 insertions(+), 22 deletions(-)

diff --git a/packages/core/ui/frame/frame-common.ts b/packages/core/ui/frame/frame-common.ts
index 64a82c684..50c22b494 100644
--- a/packages/core/ui/frame/frame-common.ts
+++ b/packages/core/ui/frame/frame-common.ts
@@ -631,7 +631,14 @@ export class FrameBase extends CustomLayoutView {
 		if (this.currentPage && viewMatchesModuleContext(this.currentPage, context, ['markup', 'script'])) {
 			Trace.write(`Change Handled: Replacing page ${context.path}`, Trace.categories.Livesync);
 
-			this.replacePage(context.path);
+			// replace current page with a default fade transition
+			this.replacePage({
+				moduleName: context.path,
+				transition: {
+					name: 'fade',
+					duration: 100,
+				},
+			});
 
 			return true;
 		}
@@ -676,13 +683,18 @@ export class FrameBase extends CustomLayoutView {
 		return true;
 	}
 
-	protected replacePage(pagePath: string): void {
+	public replacePage(entry: string | NavigationEntry): void {
 		const currentBackstackEntry = this._currentEntry;
-		const contextModuleName = sanitizeModuleName(pagePath);
 
-		const newPage = <Page>Builder.createViewFromEntry({ moduleName: contextModuleName });
+		if (typeof entry === 'string') {
+			const contextModuleName = sanitizeModuleName(entry);
+			entry = { moduleName: contextModuleName };
+		}
+
+		const newPage = Builder.createViewFromEntry(entry) as Page;
+
 		const newBackstackEntry: BackstackEntry = {
-			entry: currentBackstackEntry.entry,
+			entry: Object.assign({}, currentBackstackEntry.entry, entry),
 			resolvedPage: newPage,
 			navDepth: currentBackstackEntry.navDepth,
 			fragmentTag: currentBackstackEntry.fragmentTag,
diff --git a/packages/core/ui/frame/index.android.ts b/packages/core/ui/frame/index.android.ts
index a9ce04d29..200083ea8 100644
--- a/packages/core/ui/frame/index.android.ts
+++ b/packages/core/ui/frame/index.android.ts
@@ -29,7 +29,6 @@ const INTENT_EXTRA = 'com.tns.activity';
 const ROOT_VIEW_ID_EXTRA = 'com.tns.activity.rootViewId';
 const FRAMEID = '_frameId';
 const CALLBACKS = '_callbacks';
-const HMR_REPLACE_TRANSITION = 'fade';
 
 const ownerSymbol = Symbol('_owner');
 const activityRootViewsMap = new Map<number, WeakRef<View>>();
@@ -413,13 +412,7 @@ export class Frame extends FrameBase {
 		// layout pass so we will wait forever for transitionCompleted handler...
 		// https://github.com/NativeScript/NativeScript/issues/4895
 		let navigationTransition: NavigationTransition;
-		if (isReplace) {
-			animated = true;
-			navigationTransition = {
-				name: HMR_REPLACE_TRANSITION,
-				duration: 100,
-			};
-		} else if (this._currentEntry) {
+		if (this._currentEntry) {
 			navigationTransition = this._getNavigationTransition(newEntry.entry);
 		} else {
 			navigationTransition = null;
diff --git a/packages/core/ui/frame/index.ios.ts b/packages/core/ui/frame/index.ios.ts
index b429dc24e..1686f9e77 100644
--- a/packages/core/ui/frame/index.ios.ts
+++ b/packages/core/ui/frame/index.ios.ts
@@ -20,7 +20,6 @@ const DELEGATE = '_delegate';
 const NAV_DEPTH = '_navDepth';
 const TRANSITION = '_transition';
 const NON_ANIMATED_TRANSITION = 'non-animated';
-const HMR_REPLACE_TRANSITION = 'fade';
 
 let navDepth = -1;
 
@@ -84,14 +83,7 @@ export class Frame extends FrameBase {
 
 		let navigationTransition: NavigationTransition;
 		let animated = this.currentPage ? this._getIsAnimatedNavigation(backstackEntry.entry) : false;
-		if (isReplace) {
-			animated = true;
-			navigationTransition = {
-				name: HMR_REPLACE_TRANSITION,
-				duration: 100,
-			};
-			viewController[TRANSITION] = navigationTransition;
-		} else if (animated) {
+		if (animated) {
 			navigationTransition = this._getNavigationTransition(backstackEntry.entry);
 			if (navigationTransition) {
 				viewController[TRANSITION] = navigationTransition;