From a9734f24bf15ab322c8244fbb8e86c37caf30f4a Mon Sep 17 00:00:00 2001
From: Dominik Guzei <dominik.guzei@gmail.com>
Date: Thu, 21 Mar 2019 15:04:31 +0100
Subject: improve workspace switching ux

---
 src/features/workspaces/store.js | 25 ++++++++++++++++++++-----
 1 file changed, 20 insertions(+), 5 deletions(-)

(limited to 'src/features/workspaces/store.js')

diff --git a/src/features/workspaces/store.js b/src/features/workspaces/store.js
index 1b57ba2da..f6b9b2ff4 100644
--- a/src/features/workspaces/store.js
+++ b/src/features/workspaces/store.js
@@ -31,7 +31,7 @@ export default class WorkspacesStore extends Store {
      */
     reaction(
       () => this.allWorkspacesRequest.isExecuting,
-      isExecuting => this._setIsLoading(isExecuting),
+      isExecuting => this._setIsLoadingWorkspaces(isExecuting),
     );
     /**
      * Update the state with the workspace to be edited when route matches.
@@ -66,8 +66,8 @@ export default class WorkspacesStore extends Store {
     this.state.workspaces = workspaces.map(data => new Workspace(data));
   };
 
-  @action _setIsLoading = (isLoading) => {
-    this.state.isLoading = isLoading;
+  @action _setIsLoadingWorkspaces = (isLoading) => {
+    this.state.isLoadingWorkspaces = isLoading;
   };
 
   @action _edit = ({ workspace }) => {
@@ -107,11 +107,26 @@ export default class WorkspacesStore extends Store {
   };
 
   @action _setActiveWorkspace = ({ workspace }) => {
-    this.state.activeWorkspace = workspace;
+    Object.assign(this.state, {
+      isSwitchingWorkspace: true,
+      nextWorkspace: workspace,
+    });
+    setTimeout(() => { this.state.activeWorkspace = workspace; }, 100);
+    setTimeout(() => {
+      Object.assign(this.state, {
+        isSwitchingWorkspace: false,
+        nextWorkspace: null,
+      });
+    }, 1000);
   };
 
   @action _deactivateActiveWorkspace = () => {
-    this.state.activeWorkspace = null;
+    Object.assign(this.state, {
+      isSwitchingWorkspace: true,
+      nextWorkspace: null,
+    });
+    setTimeout(() => { this.state.activeWorkspace = null; }, 100);
+    setTimeout(() => { this.state.isSwitchingWorkspace = false; }, 1000);
   };
 
   @action _toggleWorkspaceDrawer = () => {
-- 
cgit v1.2.3-54-g00ecf