Now persist/restore queue/radio/player state automatically

front/src/store/index.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
+import createPersistedState from 'vuex-persistedstate'
 
 import favorites from './favorites'
 import auth from './auth'
@@ -16,5 +17,84 @@ export default new Vuex.Store({
     queue,
     radios,
     player
-  }
+  },
+  plugins: [
+    createPersistedState({
+      key: 'auth',
+      paths: ['auth'],
+      filter: (mutation) => {
+        return mutation.type.startsWith('auth/')
+      }
+    }),
+    createPersistedState({
+      key: 'radios',
+      paths: ['radios'],
+      filter: (mutation) => {
+        return mutation.type.startsWith('radios/')
+      }
+    }),
+    createPersistedState({
+      key: 'player',
+      paths: [
+        'player.looping',
+        'player.playing',
+        'player.volume',
+        'player.duration',
+        'player.errored'],
+      filter: (mutation) => {
+        return mutation.type.startsWith('player/') && mutation.type !== 'player/currentTime'
+      }
+    }),
+    createPersistedState({
+      key: 'progress',
+      paths: ['player.currentTime'],
+      filter: (mutation) => {
+        let delay = 10
+        return mutation.type === 'player/currentTime' && parseInt(mutation.payload) % delay === 0
+      },
+      reducer: (state) => {
+        return {
+          player: {
+            currentTime: state.player.currentTime
+          }
+        }
+      }
+    }),
+    createPersistedState({
+      key: 'queue',
+      filter: (mutation) => {
+        return mutation.type.startsWith('queue/')
+      },
+      reducer: (state) => {
+        return {
+          queue: {
+            currentIndex: state.queue.currentIndex,
+            tracks: state.queue.tracks.map(track => {
+              // we keep only valuable fields to make the cache lighter and avoid
+              // cyclic value serialization errors
+              let artist = {
+                id: track.artist.id,
+                mbid: track.artist.mbid,
+                name: track.artist.name
+              }
+              return {
+                id: track.id,
+                title: track.title,
+                mbid: track.mbid,
+                album: {
+                  id: track.album.id,
+                  title: track.album.title,
+                  mbid: track.album.mbid,
+                  cover: track.album.cover,
+                  artist: artist
+                },
+                artist: artist,
+                files: track.files
+              }
+            })
+          }
+        }
+      }
+    })
+  ]
 })