Frontend - Web node custom memory in URL (#894)

Author: directcuteo

frontend/src/app/app.component.ts

@@ -59,13 +59,15 @@ export class AppComponent extends StoreDispatcher implements OnInit {
   }
 
   goToWebNode(): void {
-    this.router.navigate([Routes.LOADING_WEB_NODE]);
+    this.router.navigate([Routes.LOADING_WEB_NODE], { queryParamsHandling: 'merge' });
     this.initAppFunctionalities();
   }
 
   private initAppFunctionalities(): void {
     if (this.webNodeService.hasWebNodeConfig() && !this.webNodeService.isWebNodeLoaded()) {
-      this.router.navigate([Routes.LOADING_WEB_NODE]);
+      if (!window.location.href.includes(`/${Routes.LOADING_WEB_NODE}`)) {
+        this.router.navigate([Routes.LOADING_WEB_NODE], { queryParamsHandling: 'preserve' });
+      }
     }
     this.dispatch2(AppActions.init());
     if (!this.hideToolbar && !CONFIG.hideNodeStats) {

frontend/src/app/core/services/web-node.service.ts

@@ -20,6 +20,8 @@ export class WebNodeService {
 
   readonly webnodeProgress$: BehaviorSubject<string> = new BehaviorSubject<string>('');
 
+  memory: WebAssembly.Memory;
+
   constructor(private http: HttpClient) {
     FileProgressHelper.initDownloadProgress();
     const basex = base('123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz');
@@ -54,7 +56,7 @@ export class WebNodeService {
   startWasm$(): Observable<any> {
     return of(any(window).webnode)
       .pipe(
-        switchMap((wasm: any) => from(wasm.default()).pipe(map(() => wasm))),
+        switchMap((wasm: any) => from(wasm.default(undefined, this.memory)).pipe(map(() => wasm))),
         switchMap((wasm) => {
           this.webnodeProgress$.next('Loaded');
           return from(wasm.run(this.webNodeKeyPair.privateKey));

frontend/src/app/features/webnode/webnode.component.ts

@@ -2,6 +2,10 @@ import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
 import { WebNodeInitializationComponent } from '@app/features/webnode/web-node-initialization/web-node-initialization.component';
 import { Platform } from '@angular/cdk/platform';
 import { WebNodeNotSupportedComponent } from '@app/features/webnode/web-node-not-supported/web-node-not-supported.component';
+import { StoreDispatcher } from '@shared/base-classes/store-dispatcher.class';
+import { getMergedRoute, MergedRoute } from '@openmina/shared';
+import { filter } from 'rxjs';
+import { WebNodeService } from '@core/services/web-node.service';
 
 @Component({
   selector: 'mina-webnode',
@@ -14,15 +18,26 @@ import { WebNodeNotSupportedComponent } from '@app/features/webnode/web-node-not
   styleUrl: './webnode.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class WebnodeComponent implements OnInit {
+export class WebnodeComponent extends StoreDispatcher implements OnInit {
 
   supported: boolean = false;
   isPhone: boolean = false;
 
-  constructor(private platform: Platform) {}
+  constructor(private platform: Platform,
+              private webNodeService: WebNodeService) { super(); }
 
   ngOnInit(): void {
     this.checkIfDeviceIsSupported();
+    this.listenToRoute();
+  }
+
+  private listenToRoute(): void {
+    this.select(getMergedRoute, (route: MergedRoute) => {
+      const initial = Number(route.queryParams['initial']);
+      const maximum = Number(route.queryParams['maximum']);
+      const shared = route.queryParams['shared'] === 'true';
+      this.webNodeService.memory = new WebAssembly.Memory({ initial, maximum, shared });
+    }, filter(Boolean));
   }
 
   private checkIfDeviceIsSupported(): void {