fix: Swap Footer pages

lerna.json

@@ -3,5 +3,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "1.3.39-alpha.9"
+  "version": "1.3.39-alpha.10"
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "midi-bricks-mono",
-  "version": "1.3.39-alpha.9",
+  "version": "1.3.39-alpha.10",
   "private": false,
   "license": "MIT",
   "repository": "https://github.com/TimSusa/midi-bricks-mono.git",

packages/midi-bricks-doc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "midi-bricks-doc",
-  "version": "1.3.39-alpha.9",
+  "version": "1.3.39-alpha.10",
   "private": true,
   "description": "Documentation for midi-bricks",
   "author": "TimSusa <timsusa@altus-insight.de>",

packages/midi-bricks-electron/package.json

@@ -1,7 +1,7 @@
 {
   "name": "midi-bricks-electron",
   "productName": "MIDI-Bricks",
-  "version": "1.3.39-alpha.9",
+  "version": "1.3.39-alpha.10",
   "main": "./app/electron.js",
   "homepage": ".",
   "repository": "https://github.com/TimSusa/midi-bricks-mono.git",

packages/midi-bricks/package.json

@@ -1,6 +1,6 @@
 {
   "name": "midi-bricks",
-  "version": "1.3.39-alpha.9",
+  "version": "1.3.39-alpha.10",
   "private": false,
   "homepage": "https://midi-bricks.timsusa.now.sh",
   "main": "./src/index.js",

packages/midi-bricks/src/components/footer/Footer.jsx

@@ -67,10 +67,14 @@ function Footer() {
           return (
             <div key={`footer-button-${item.id}`}>
               <IconButton
-                onClick={swapFooterPages.bind(this, {
-                  srcIdx: item.id,
-                  offset: -1
-                })}
+                onClick={() =>
+                  dispatch(
+                    swapFooterPages({
+                      srcIdx: item.id,
+                      offset: -1
+                    })
+                  )
+                }
                 className={classes.signButton}
                 color='inherit'
                 aria-label='Menu'
@@ -86,10 +90,14 @@ function Footer() {
               />
 
               <IconButton
-                onClick={swapFooterPages.bind(this, {
-                  srcIdx: item.id,
-                  offset: 1
-                })}
+                onClick={() =>
+                  dispatch(
+                    swapFooterPages({
+                      srcIdx: item.id,
+                      offset: 1
+                    })
+                  )
+                }
                 className={classes.signButton}
                 color='inherit'
                 aria-label='Menu'

packages/midi-bricks/src/global-state/index.js

@@ -3,17 +3,40 @@ import { createSlice } from '@reduxjs/toolkit'
 import { sliders, initId } from './reducers/slider-list'
 import { viewSettings } from './reducers/view-settings'
 import { undoRedo } from './reducers/undo-redo'
-
 import { pages } from './reducers/pages'
 
+//
+// PAGES
+//
+export const pagesInit = {
+  [initId]: {
+    sliderList: [],
+    id: initId,
+    label: 'Page 1'
+  }
+}
+
+const {reducer: reducerPagess, actions: actionsPagess} = createSlice({
+  name: 'pages',
+  initialState: pagesInit,
+  reducers: pages
+
+})
+
+export const actionsPages = actionsPagess
+export const reducerPages = reducerPagess
+
+//
+// ViewSettings
+//
 export const PAGE_TYPES = {
   HOME_MODE: 'HOME_MODE',
   GLOBAL_MODE: 'GLOBAL_MODE',
   MIDI_DRIVER_MODE: 'MIDI_DRIVER_MODE',
 // VIEW_SETTINGS_MODE: 'VIEW_SETTINGS_MODE'
 }
 
-const initState = {
+export const viewSettingsInitState = {
   columns: 18,
   rowHeight: 40,
   isAutoSize: false,
@@ -43,25 +66,7 @@ const initState = {
     isAllowedDowngrade: false,
     isWindowSizeLocked: true,
     windowCoords: [0, 0, 600, 800]
-  }
-}
-
-export const pagesInit = {
-  [initId]: {
-    sliderList: [],
-    id: initId,
-    label: 'Page 1'
-  }
-}
-
-const slidersInitState = {
-  isMidiFailed: false,
-  midi: null,
-  sliderList: []
-}
-
-export const viewSettingsInitState = {
-  ...initState,
+  },
   isLiveMode: false,
   isSettingsDialogMode: false,
   isLayoutMode: false,
@@ -87,18 +92,24 @@ export const viewSettingsInitState = {
     }
   ]
 }
-
-const {reducer: reducerPagess, actions: actionsPagess} = createSlice({
-  name: 'pages',
-  initialState: pagesInit,
-  reducers: pages
+const {reducer: reducerViewSettingss, actions: actionsViewSettingss} = createSlice({
+  name: 'viewSettings',
+  initialState: viewSettingsInitState,
+  reducers: viewSettings
 
 })
 
-export const actionsPages = actionsPagess
-export const reducerPages = reducerPagess
-
+export const actionsViewSettings = actionsViewSettingss
+export const reducerViewSettings = reducerViewSettingss
 
+//
+// SLIDERS
+//
+const slidersInitState = {
+  isMidiFailed: false,
+  midi: null,
+  sliderList: []
+}
 const {reducer: reducerSliderss, actions: actionsSliderss} = createSlice({
   name: 'sliders',
   initialState: slidersInitState,
@@ -109,16 +120,9 @@ const {reducer: reducerSliderss, actions: actionsSliderss} = createSlice({
 export const actionsSliders = actionsSliderss
 export const reducerSliders = reducerSliderss
 
-const {reducer: reducerViewSettingss, actions: actionsViewSettingss} = createSlice({
-  name: 'viewSettings',
-  initialState: viewSettingsInitState,
-  reducers: viewSettings
-
-})
-
-export const actionsViewSettings = actionsViewSettingss
-export const reducerViewSettings= reducerViewSettingss
-
+//
+// UNDO REDO
+//
 const {reducer: reducerUndoRedod, actions: actionsUndoRedod} = createSlice({
   name: 'undoRedo',
   initialState: {},
@@ -127,7 +131,7 @@ const {reducer: reducerUndoRedod, actions: actionsUndoRedod} = createSlice({
 })
 
 export const actionsUndoRedo = actionsUndoRedod
-export const reducerUndoRedo= reducerUndoRedod
+export const reducerUndoRedo = reducerUndoRedod
 
 export const reducer = combineReducers({
   sliders: reducerSliders,

packages/midi-bricks/src/global-state/reducers/view-settings.js

@@ -161,10 +161,10 @@ export const viewSettings = {
         newArray.push(item)
       }
     })
-
-    return Object.assign({}, state, {
-      pageTargets: newArray
-    })
+    state.pageTargets = newArray
+    // return Object.assign({}, state, {
+    //   pageTargets: newArray
+    // })
   },
   toggleSettingsDialogMode(draftState, action) {
     const { isSettingsDialogMode, i, lastFocusedPage } = action.payload