daverivera

 import React from 'react'
 import { render } from 'react-dom'
-import { createStore } from 'redux'
+import { createStore, compose } from 'redux'
 import { Provider } from 'react-redux'
 import App from './components/App'
 import reducer from './reducers'
 import 'todomvc-app-css/index.css'

+import PouchDB from 'pouchdb'

daverivera

 import { combineReducers } from 'redux'
 import todos from './todos'
 import visibilityFilter from './visibilityFilter'

+import { persistentReducer } from 'redux-pouchdb'

 const rootReducer = combineReducers({
   todos,
   visibilityFilter
 })

daverivera

 import { combineReducers } from 'redux'
 import todos from './todos'
 import visibilityFilter from './visibilityFilter'

+import { withReduxStateSync } from 'redux-state-sync'

 const rootReducer = combineReducers({
   todos,
   visibilityFilter
 })

daverivera

 import React from 'react'
 import { render } from 'react-dom'
-import { createStore } from 'redux'
+import { createStore, applyMiddleware } from 'redux'
 import { Provider } from 'react-redux'
 import App from './components/App'
 import reducer from './reducers'
 import 'todomvc-app-css/index.css'

+import { createStateSyncMiddleware, initStateWithPrevTab } from 'redux-state-sync'

daverivera

 import React from 'react'
 import { render } from 'react-dom'
 import { createStore } from 'redux'
 import { Provider } from 'react-redux'
 import App from './components/App'
 import reducer from './reducers'
 import 'todomvc-app-css/index.css'

+import { persistStore, persistReducer } from 'redux-persist'
+import { PersistGate } from 'redux-persist/integration/react'

daverivera

import { getStoredState, REHYDRATE } from 'redux-persist'

export default
function crossBrowserListener(store, persistConfig) {
  return async function() {
    let state = await getStoredState(persistConfig)

    store.dispatch({
      type: REHYDRATE,
      key: persistConfig.key,

daverivera

import { render } from 'react-dom'
-import { createStore } from 'redux'
+import { createStore, compose, applyMiddleware } from 'redux'
import { Provider } from 'react-redux'
import App from './components/App'
import reducer from './reducers'
import 'todomvc-app-css/index.css'

+import { storageMiddleware } from './middleware/storage'
+import { createStorageListener } from './utils/storage-listener'

daverivera

export function createStorageListener(store) {
  return () => {
    const wrappedAction = JSON.parse(localStorage.getItem(storageKey))

    delete wrappedAction.source
    store.dispatch(wrappedAction)
  }
}

daverivera

const storageKey = 'redux-local-tab-sync'

export function storageMiddleware() {
  return () => next => action => {
    if (!action.source) {
      const wrappedAction = Object.assign({ source: 'another tab' }, action)
      localStorage.setItem(storageKey, JSON.stringify(wrappedAction))
    }

    next(action)

daverivera

import { Component, Inject, ViewContainerRef } from '@angular/core'

import { Service } from './service'

@Component({
  selector: 'my-app',
  template: `<h1>Hello {{name}}</h1>`
})
export class AppComponent {