From 77335fbbf0a7c8aedc175f6f83bcd00a61abc10e Mon Sep 17 00:00:00 2001
From: tiddlygit-test <linonetwo012@gmail.com>
Date: Tue, 16 Mar 2021 23:41:12 +0800
Subject: [PATCH] fix: observable subscription causes lots of rerender

beware not pipe in the react hock, as it will re-pipe every time React reRenders, and every time regarded as new Observable, so re-subscribe
---
 src/services/workspaces/hooks.ts | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/services/workspaces/hooks.ts b/src/services/workspaces/hooks.ts
index 80b6d72d..ef76e6e3 100644
--- a/src/services/workspaces/hooks.ts
+++ b/src/services/workspaces/hooks.ts
@@ -2,15 +2,17 @@ import { useState } from 'react';
 import { map } from 'rxjs/operators';
 import { useObservable } from 'beautiful-react-hooks';
 import { IWorkspace } from './interface';
+import { Observable } from 'rxjs';
+import { v4 as uuid } from 'uuid';
+
+// beware not pipe in the react hock, as it will re-pipe every time React reRenders, and every time regarded as new Observable, so re-subscribe
+const workspacesList$ = window.service.workspace.workspaces$.pipe(
+  map<Record<string, IWorkspace>, IWorkspace[]>((workspaces) => Object.values(workspaces)),
+);
 
 export function useWorkspacesListObservable(): IWorkspace[] | undefined {
   const [workspaces, workspacesSetter] = useState<IWorkspace[] | undefined>();
-  useObservable<IWorkspace[] | undefined>(
-    window.service.workspace.workspaces$.pipe(
-      map<Record<string, IWorkspace>, IWorkspace[]>((workspaces) => Object.values(workspaces)),
-    ),
-    workspacesSetter,
-  );
+  useObservable<IWorkspace[] | undefined>(workspacesList$, workspacesSetter);
   return workspaces;
 }