basic setup of workspaces settings screen

4 files changed, 37 insertions, 16 deletions

diff --git a/src/features/workspaces/api.js b/src/features/workspaces/api.js
index 1ee2440fe..97badbd01 100644
--- a/src/features/workspaces/api.js
+++ b/src/features/workspaces/api.js
@@ -1,9 +1,13 @@
-// TODO: use real server instead
-const workspaces = [
-  { id: 'workspace-1', name: 'Private' },
-  { id: 'workspace-2', name: 'Office' },
-];
+import { prepareAuthRequest } from '../../api/utils/auth';
+import { API, API_VERSION } from '../../environment';
 
 export default {
-  getUserWorkspaces: () => Promise.resolve(workspaces),
+  getUserWorkspaces: async () => {
+    const url = `${API}/${API_VERSION}/workspace`;
+    const request = await window.fetch(url, prepareAuthRequest({
+      method: 'GET',
+    }));
+    if (!request.ok) throw request;
+    return request.json();
+  },
 };
diff --git a/src/features/workspaces/index.js b/src/features/workspaces/index.js
index b4cfd3c2d..50ac3b414 100644
--- a/src/features/workspaces/index.js
+++ b/src/features/workspaces/index.js
@@ -1,14 +1,11 @@
-import { observable, reaction } from 'mobx';
-import { merge } from 'lodash';
+import { reaction } from 'mobx';
 import WorkspacesStore from './store';
 import api from './api';
+import { state, resetState } from './state';
 
 const debug = require('debug')('Franz:feature:workspaces');
 
 let store = null;
-const defaultState = { workspaces: [] };
-
-export const state = observable(defaultState);
 
 export default function initWorkspaces(stores, actions) {
   const { features, user } = stores;
@@ -27,8 +24,7 @@ export default function initWorkspaces(stores, actions) {
         debug('Disabling `workspaces` feature');
         store.teardown();
         store = null;
-        // Reset state to default
-        merge(state, defaultState);
+        resetState(); // Reset state to default
       }
     },
     {
diff --git a/src/features/workspaces/state.js b/src/features/workspaces/state.js
new file mode 100644
index 000000000..ed3fe9f00
--- /dev/null
+++ b/src/features/workspaces/state.js
@@ -0,0 +1,12 @@
+import { observable } from 'mobx';
+
+const defaultState = {
+  isLoading: false,
+  workspaces: [],
+};
+
+export const state = observable(defaultState);
+
+export function resetState() {
+  Object.assign(state, defaultState);
+}
diff --git a/src/features/workspaces/store.js b/src/features/workspaces/store.js
index 4b4e729ed..2b6d55cc7 100644
--- a/src/features/workspaces/store.js
+++ b/src/features/workspaces/store.js
@@ -1,6 +1,7 @@
 import { observable, reaction } from 'mobx';
 import Store from '../../stores/lib/Store';
 import CachedRequest from '../../stores/lib/CachedRequest';
+import Workspace from '../../models/Workspace';
 
 const debug = require('debug')('Franz:feature:workspaces');
 
@@ -18,12 +19,20 @@ export default class WorkspacesStore extends Store {
 
     reaction(
       () => this.allWorkspacesRequest.result,
-      workspaces => this.setWorkspaces(workspaces),
+      workspaces => this._setWorkspaces(workspaces),
+    );
+    reaction(
+      () => this.allWorkspacesRequest.isExecuting,
+      isExecuting => this._setIsLoading(isExecuting),
     );
   }
 
-  setWorkspaces = (workspaces) => {
+  _setWorkspaces = (workspaces) => {
     debug('setting user workspaces', workspaces.slice());
-    this.state.workspaces = workspaces;
+    this.state.workspaces = workspaces.map(data => new Workspace(data));
+  };
+
+  _setIsLoading = (isLoading) => {
+    this.state.isLoading = isLoading;
   };
 }