Localforage 2: Add support for localstorage.

src/lib/localforage_redux.js

@@ -0,0 +1,65 @@
+const wrap = (request) => {
+  return new Promise((resolve, reject) => {
+    request.onerror = (event) => reject(event)
+    request.onsuccess = (event) => resolve(event.target.result)
+  })
+}
+
+const getDb = (database, version) => {
+  const request = window.indexedDB.open(database, version)
+  request.onupgradeneeded = (event) => {
+    const db = event.target.result
+    db.createObjectStore('keyvaluepairs')
+  }
+  return wrap(request)
+}
+
+const storageBuilder = async (database = 'storage_2', version = 1) => {
+  try {
+    let db = await getDb(database, version)
+    const storage = {
+      getItem: async (key) => {
+        const dataRequest =
+          db
+            .transaction(['keyvaluepairs'])
+            .objectStore('keyvaluepairs')
+            .get(key)
+
+        const dataRequestPromise = wrap(dataRequest)
+
+        return dataRequestPromise
+      },
+      setItem: async (key, value) => {
+        const dataRequest =
+          db
+            .transaction(['keyvaluepairs'], 'readwrite')
+            .objectStore('keyvaluepairs')
+            .put(value, key)
+
+        return wrap(dataRequest)
+      }
+    }
+
+    return storage
+  } catch (e) {
+    console.log("Can't get indexeddb going, let's use localstorage")
+
+    const storage = {
+      getItem: async (key) => {
+        const result = window.localStorage.getItem(`${database}/${key}`)
+        try {
+          return JSON.parse(result)
+        } catch (e) {
+          return undefined
+        }
+      },
+      setItem: async (key, value) => {
+        const json = JSON.stringify(value)
+        return window.localStorage.setItem(`${database}/${key}`, json)
+      }
+    }
+    return storage
+  }
+}
+
+export default storageBuilder

src/lib/persisted_state.js

@@ -1,6 +1,5 @@
-import merge from 'lodash.merge'
-import localforage from 'localforage'
-import { each, get, set } from 'lodash'
+import localforage2 from './localforage_redux'
+import { merge, each, get, set } from 'lodash'
 
 let loaded = false
 
@@ -22,11 +21,13 @@ const saveImmedeatelyActions = [
   'clearToken'
 ]
 
-const defaultStorage = (() => {
-  return localforage
-})()
+const defaultStorageBuilder = () => {
+  // Use this to use the existing localforage db
+  // return localforage2('localforage', 2)
+  return localforage2()
+}
 
-export default function createPersistedState ({
+export default async function createPersistedState ({
   key = 'vuex-lz',
   paths = [],
   getState = (key, storage) => {
@@ -42,9 +43,10 @@ export default function createPersistedState ({
     }
   },
   reducer = defaultReducer,
-  storage = defaultStorage,
+  storageBuilder = defaultStorageBuilder,
   subscriber = store => handler => store.subscribe(handler)
 } = {}) {
+  const storage = await storageBuilder()
   return getState(key, storage).then((savedState) => {
     return store => {
       try {

src/sw.js

@@ -1,9 +1,10 @@
 /* eslint-env serviceworker */
 
-import localForage from 'localforage'
+import localForage from './lib/localforage_redux'
 
-function isEnabled () {
-  return localForage.getItem('vuex-lz')
+async function isEnabled () {
+  const storage = await localForage()
+  return storage.getItem('vuex-lz')
     .then(data => data.config.webPushNotifications)
 }