johanneslumpe / redux-history-transitions

history transitions based on arbitrary actions
MIT License
167 stars 10 forks source link

URL replaced but transition not happening #11

Closed tijs closed 7 years ago

tijs commented 7 years ago

I'm running into a weird issue where the URL changes when i use a meta attribute with a transition in my actions but the view does not actually change.

My configureStore() method looks like this:

import { compose, applyMiddleware, createStore } from 'redux'
import { persistStore, autoRehydrate } from 'redux-persist'
import { localStorage } from 'redux-persist/storages';
import thunkMiddleware from 'redux-thunk'
import { createLogger } from 'redux-logger'
import handleTransitions from 'redux-history-transitions';
import createHistory from 'history/createBrowserHistory'
import { routerMiddleware } from 'react-router-redux'

import reducers from '../reducers'

const loggerMiddleware = createLogger()

export default function configureStore() {
  const history = createHistory()
  const enhancer = handleTransitions(history)

  const store = createStore(
    reducers,
    undefined,
    compose(
      applyMiddleware(
        thunkMiddleware,
        loggerMiddleware,
        routerMiddleware(history),
      ),
      enhancer,
      autoRehydrate()
    )
  )

  // begin periodically persisting the store
  persistStore(store, { storage: localStorage })

  return store;

}

And my action looks like this:

function addedDish(restaurantID, json) {
  return {
    type: NEW_DISH,
    dish: json,
    restaurantID,
    receivedAt: Date.now(),
    meta: {
      done: true,
      transition: {
        success: (prevState, nextState, action) => ({
          pathname: `/${restaurantID}/dishes/${action.dish.id}/`,
        }),
      },
    },
  }
}

The dish is added, the action triggered, and the URL changes, but the view is not re-rendered. 'normal' react-router changes triggered with Link or Redirect do work as expected.

Did i misconfigure the enhancer somehow or should i look elsewhere for the culprit?

tijs commented 7 years ago

I was using react-router with the withRouter wrapper instead of the full router-redux integration which explains why i could not trigger view changes via redux. I have since implemented the full react-router-redux integration via routerMiddleware and now it's working as intended. Will close this issue!