Actions and reducers for managing UI contexts

src/store/layout/actions.js

@@ -1,3 +1,18 @@
+export const addActiveContext = state => ({
+  type: 'ADD_ACTIVE_CONTEXT',
+  state,
+});
+
+export const removeActiveContext = state => ({
+  type: 'REMOVE_ACTIVE_CONTEXT',
+  state,
+});
+
+export const clearActiveContexts = state => ({
+  type: 'CLEAR_ACTIVE_CONTEXTS',
+  state,
+});
+
 export const setLeftSidebarOpen = state => ({
   type: 'SET_LEFT_SIDEBAR_OPEN',
   state,
@@ -14,6 +29,10 @@ export const setUserPreferencesModalOpen = state => ({
 });
 
 const actions = {
+  addActiveContext,
+  removeActiveContext,
+  clearActiveContexts,
+  //
   setLeftSidebarOpen,
   setRightSidebarOpen,
   setUserPreferencesModalOpen,

src/store/layout/reducers.js

@@ -4,10 +4,28 @@ const defaultState = {
   userPreferencesModalOpen: false,
   labelling: {},
   contextMenu: {},
+  activeContexts: [],
 };
 
 const ui = (state = defaultState, action) => {
   switch (action.type) {
+    // ~ ACTIVE CONTEXTS
+    // https://redux.js.org/recipes/structuring-reducers/immutable-update-patterns#inserting-and-removing-items-in-arrays
+    case 'ADD_ACTIVE_CONTEXT': {
+      const shallowCopy = Object.assign({}, state);
+      shallowCopy.activeContexts = [...shallowCopy.activeContexts, action.item];
+      return shallowCopy;
+    }
+    case 'REMOVE_ACTIVE_CONTEXT': {
+      const shallowCopy = Object.assign({}, state);
+      shallowCopy.activeContexts = shallowCopy.activeContexts.filter(
+        item => item !== action.item
+      );
+      return shallowCopy;
+    }
+    case 'CLEAR_ACTIVE_CONTEXTS':
+      return Object.assign({}, state, { activeContexts: [] });
+    // ~ SIDEBAR
     case 'SET_LEFT_SIDEBAR_OPEN':
       return Object.assign({}, state, { leftSidebarOpen: action.state });
     case 'SET_RIGHT_SIDEBAR_OPEN':