From 4cefa02a8b75834f8c37e838d8577b83c1881405 Mon Sep 17 00:00:00 2001
From: Andreas Nedbal <andy@pixelde.su>
Date: Sat, 25 Jan 2020 14:51:12 +0100
Subject: [PATCH] add and configure vuex-persist as a plugin

---
 package-lock.json        | 17 +++++++++++++++--
 package.json             |  8 +++++++-
 src/store/index.js       |  2 ++
 src/store/persistence.js | 15 +++++++++++++++
 vue.config.js            |  1 +
 5 files changed, 40 insertions(+), 3 deletions(-)
 create mode 100644 src/store/persistence.js

diff --git a/package-lock.json b/package-lock.json
index 7f6438f..a9af860 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5202,8 +5202,7 @@
     "flatted": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/flatted/-/flatted-2.0.1.tgz",
-      "integrity": "sha512-a1hQMktqW9Nmqr5aktAux3JMNqaucxGcjtjWnZLHX7yyPCmlSV3M54nGYbqT8K+0GhF3NBgmJCc3ma+WOgX8Jg==",
-      "dev": true
+      "integrity": "sha512-a1hQMktqW9Nmqr5aktAux3JMNqaucxGcjtjWnZLHX7yyPCmlSV3M54nGYbqT8K+0GhF3NBgmJCc3ma+WOgX8Jg=="
     },
     "flush-write-stream": {
       "version": "1.1.1",
@@ -7445,6 +7444,11 @@
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=",
       "dev": true
     },
+    "lodash.merge": {
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
+      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ=="
+    },
     "lodash.orderby": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.orderby/-/lodash.orderby-4.6.0.tgz",
@@ -11629,6 +11633,15 @@
       "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.2.tgz",
       "integrity": "sha512-ha3jNLJqNhhrAemDXcmMJMKf1Zu4sybMPr9KxJIuOpVcsDQlTBYLLladav2U+g1AvdYDG5Gs0xBTb0M5pXXYFQ=="
     },
+    "vuex-persist": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/vuex-persist/-/vuex-persist-2.2.0.tgz",
+      "integrity": "sha512-o/qbBeMcKZZqMvCXc7kfIew/5cjHxlP1f53rx5YYp3r2tk2kxXYK/UZumxKn7OXywlurl2r0mgkuBzH6nIWFjw==",
+      "requires": {
+        "flatted": "^2.0.0",
+        "lodash.merge": "^4.6.2"
+      }
+    },
     "watchpack": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",
diff --git a/package.json b/package.json
index f1a34ad..f71834f 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "vue": "^2.6.10",
     "vuetify": "^2.1.0",
     "vuex": "^3.1.2",
+    "vuex-persist": "^2.2.0",
     "xml2js": "^0.4.23"
   },
   "devDependencies": {
@@ -48,7 +49,12 @@
       "airbnb-base"
     ],
     "rules": {
-      "no-param-reassign": ["error", { "props": false }]
+      "no-param-reassign": [
+        "error",
+        {
+          "props": false
+        }
+      ]
     },
     "parserOptions": {
       "parser": "babel-eslint"
diff --git a/src/store/index.js b/src/store/index.js
index f8fa320..9220f94 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -4,6 +4,7 @@ import Vuex from 'vuex';
 import actions from './actions';
 import mutations from './mutations';
 import state from './state';
+import persistence from './persistence';
 
 Vue.use(Vuex);
 
@@ -11,4 +12,5 @@ export default new Vuex.Store({
   state,
   mutations,
   actions,
+  plugins: [persistence.plugin],
 });
diff --git a/src/store/persistence.js b/src/store/persistence.js
new file mode 100644
index 0000000..418c62b
--- /dev/null
+++ b/src/store/persistence.js
@@ -0,0 +1,15 @@
+import VuexPersistence from 'vuex-persist';
+
+const ALLOWED_MUTATIONS = [
+  'TOGGLE_DRAWER',
+  'SELECT_CHANNEL',
+];
+
+export default new VuexPersistence({
+  storage: window.localStorage,
+  reducer: (state) => ({
+    drawer: state.drawer,
+    selectedChannel: state.selectedChannel,
+  }),
+  filter: (mutation) => ALLOWED_MUTATIONS.includes(mutation.type),
+});
diff --git a/vue.config.js b/vue.config.js
index 69830f2..c139399 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -1,6 +1,7 @@
 module.exports = {
   transpileDependencies: [
     'vuetify',
+    'vuex-persist',
   ],
   pwa: {
     name: 'videoline',