Persistent background pages deprecated about webext-redux HOT 8 CLOSED

@sporkd Totally! I actually use it with an event page in a little side project. Basically, you just listen for changes on the redux store and tie something to persist it to localStorage (or whatever else you want):

https://github.com/tshaddix/next-read/blob/master/event/src/setup.js#L30-L46

Then you can load it up when the event page reactivates:

https://github.com/tshaddix/next-read/blob/master/event/src/index.js#L11-L20

Thoughts?

from webext-redux.

@tshaddix looks like the next-read example is no longer on github. Can you point towards another example that doesn't rely on persistent background pages? I could probably figure it out but examples always help :)

Thanks!

from webext-redux.

@3flex Sorry about that! Don't remember why I took it public. It should be open now!

Here is the code in that project that persists the background store. @sriharrsha This should help you as well.

from webext-redux.

Oh awesome! Thanks for sharing that example. I'll check it out and let you know if I have any additional thoughts.

from webext-redux.

Sounds good! Closing for now but feel free to continue the convo!

from webext-redux.

@tshaddix I was using react-persist in background with localstorage. But it seems like taking a lot of time. Can you give an example of persisting background Store?

from webext-redux.

@tshaddix That repo is no longer visible, the permalink doesn't even work. Do you have a working example?

from webext-redux.

@petemill I have the original example code here (rm'd parts that don't apply):

// @flow

/* global chrome */

import {wrapStore} from 'react-chrome-redux';
import throttle from 'lodash/throttle';
import omit from 'lodash/omit';

import {
  PORT_NAME,
  TAB_ID_TYPE
} from '../../shared/constants';

import Store from './store';

let store = null;

chrome.storage.local.get([
  'state'
], ({state}) => {
  store = Store(state || {});

  wrapStore(store, {portName: PORT_NAME});

  /**
   * Save the current store state to local storage
   */
  const saveState = () => {
    if (!store) {
      return;
    }

    console.info('Saving state to chrome.storage.local');

    const state = store.getState();

    chrome.storage.local.set({
      // remove bookmark folders from taking up unnecessary space
      state: omit(state, 'entities')
    });
  };

  // On new state, persist to local storage
  const throttledSave = throttle(saveState, 10000, {trailing: true, leading: true});
  store.subscribe(throttledSave);
});

Basically comes in two parts. Part 1: When the event page loads, load the state tree from local storage and then kick off the basic extension bootstrapping once that's complete. Part 2: Set up a listener for state changes on the store and save them to local storage every X seconds.

from webext-redux.