♻️ (Navigation) move fullScreen properties in FullScreenDelegate

Author: tpucci

src/FullScreenPortal.tsx

@@ -5,7 +5,9 @@ import { fromStream } from 'mobx-utils';
 import { Navigation } from './Navigation';
 
 export class FullScreenPortal extends ReactComponent {
-  fullScreenStack = fromStream(Navigation.getInstance().fullSceenStack$);
+  fullScreenStack = fromStream(
+    Navigation.getInstance().fullScreenDelegate.fullSceenStack$
+  );
 
   render() {
     return (

src/Navigation/FullScreenDelegate.ts

@@ -0,0 +1,44 @@
+import { Subject, Observable } from 'rxjs';
+import { mergeAll, map, scan } from 'rxjs/operators';
+import { IStop } from './Stop';
+
+type Stack = IStop[];
+
+interface IFullScreenStackProperties {
+  canalId: string;
+  fullScreenStack: Stack;
+}
+
+interface IFullScreenStackMap {
+  [canalId: string]: Stack;
+}
+
+export class FullScreenDelegate {
+  canalsFullScreenStackProperties$ = new Subject<
+    Observable<IFullScreenStackProperties>
+  >();
+
+  fullSceenStack$: Observable<
+    Stack
+  > = this.canalsFullScreenStackProperties$.pipe(
+    mergeAll(),
+    scan(
+      (
+        fullScreenStackMap: IFullScreenStackMap,
+        fullScreenStackProperties: IFullScreenStackProperties
+      ) => ({
+        ...fullScreenStackMap,
+        [fullScreenStackProperties.canalId]:
+          fullScreenStackProperties.fullScreenStack
+      }),
+      {}
+    ),
+    map((fullScreenStackMap: IFullScreenStackMap) =>
+      Object.keys(fullScreenStackMap).reduce(
+        (fullScreenStack: Stack, canalId: string) =>
+          fullScreenStack.concat(fullScreenStackMap[canalId]),
+        []
+      )
+    )
+  );
+}

src/Navigation/Navigation.ts

@@ -1,23 +1,4 @@
-import { Subject, Observable } from 'rxjs';
-import { ComponentType } from 'react';
-import { mergeAll, map, scan } from 'rxjs/operators';
-
-export interface IStop {
-  name: string;
-  Component: ComponentType;
-  isFullScreen?: boolean;
-}
-
-type Stack = IStop[];
-
-interface IFullScreenStackProperties {
-  canalId: string;
-  fullScreenStack: Stack;
-}
-
-interface IFullScreenStackMap {
-  [canalId: string]: Stack;
-}
+import { FullScreenDelegate } from './FullScreenDelegate';
 
 export class Navigation {
   static getInstance() {
@@ -29,31 +10,5 @@ export class Navigation {
   }
   private static instance: Navigation;
 
-  canalsFullScreenStackProperties$ = new Subject<
-    Observable<IFullScreenStackProperties>
-  >();
-
-  fullSceenStack$: Observable<
-    Stack
-  > = this.canalsFullScreenStackProperties$.pipe(
-    mergeAll(),
-    scan(
-      (
-        fullScreenStackMap: IFullScreenStackMap,
-        fullScreenStackProperties: IFullScreenStackProperties
-      ) => ({
-        ...fullScreenStackMap,
-        [fullScreenStackProperties.canalId]:
-          fullScreenStackProperties.fullScreenStack
-      }),
-      {}
-    ),
-    map((fullScreenStackMap: IFullScreenStackMap) =>
-      Object.keys(fullScreenStackMap).reduce(
-        (fullScreenStack: Stack, canalId: string) =>
-          fullScreenStack.concat(fullScreenStackMap[canalId]),
-        []
-      )
-    )
-  );
+  fullScreenDelegate = new FullScreenDelegate();
 }

src/Navigation/Stop.d.ts

@@ -0,0 +1,7 @@
+import { ComponentType } from 'react';
+
+export interface IStop {
+  name: string;
+  Component: ComponentType;
+  isFullScreen?: boolean;
+}

src/createCanal.tsx

@@ -102,7 +102,7 @@ export const createCanal = <
        */
       // @ts-ignore
       this.authorizations$.next(nextAuthorizations);
-      Navigation.getInstance().canalsFullScreenStackProperties$.next(
+      Navigation.getInstance().fullScreenDelegate.canalsFullScreenStackProperties$.next(
         this.fullScreenStackProperties$
       );
     }