From e81985c10dd3a7923c02485ef0a3b55917430348 Mon Sep 17 00:00:00 2001
From: ThibaudAv <thibaud.avenier@gmail.com>
Date: Tue, 1 Dec 2020 12:36:06 +0100
Subject: [PATCH] fixup! feat: add a rewrite of client angular rendering

---
 .../client/preview/angular-beta/app.token.ts  | 28 +++++++++++++++++--
 1 file changed, 25 insertions(+), 3 deletions(-)

diff --git a/app/angular/src/client/preview/angular-beta/app.token.ts b/app/angular/src/client/preview/angular-beta/app.token.ts
index 08ee81b5c9fa..fac08eeea082 100644
--- a/app/angular/src/client/preview/angular-beta/app.token.ts
+++ b/app/angular/src/client/preview/angular-beta/app.token.ts
@@ -1,10 +1,32 @@
-import { InjectionToken, Provider } from '@angular/core';
-import { Subject } from 'rxjs';
+import { InjectionToken, NgZone, Provider } from '@angular/core';
+import { Observable, Subject, Subscriber } from 'rxjs';
 import { ICollection } from '../types';
 
 export const STORY_PROPS = new InjectionToken<Subject<ICollection | undefined>>('STORY_PROPS');
 
 export const storyPropsProvider = (storyProps$: Subject<ICollection | undefined>): Provider => ({
   provide: STORY_PROPS,
-  useValue: storyProps$,
+  useFactory: storyDataFactory(storyProps$.asObservable()),
+  deps: [NgZone],
 });
+
+function storyDataFactory<T>(data: Observable<T>) {
+  return (ngZone: NgZone) =>
+    new Observable((subscriber: Subscriber<T>) => {
+      const sub = data.subscribe(
+        (v: T) => {
+          ngZone.run(() => subscriber.next(v));
+        },
+        (err) => {
+          ngZone.run(() => subscriber.error(err));
+        },
+        () => {
+          ngZone.run(() => subscriber.complete());
+        }
+      );
+
+      return () => {
+        sub.unsubscribe();
+      };
+    });
+}