Skip to content
This repository was archived by the owner on Oct 26, 2018. It is now read-only.
This repository was archived by the owner on Oct 26, 2018. It is now read-only.

Double location change pushing an url in action creator #429

Closed
@maiopirata

Description

@maiopirata

I've an Isomorphic app.
I'm experiencing a problem similar to #403 I tried to put in my package.json:
"react-router-redux": "dlmr/react-router-redux#fix-inital-server-load-dist",
but it is not working...

In my action creator I have:

export function formComplete(id, router) {
  return (dispatch, getState) => {
    dispatch(checkForm(id))

    if (getState().registration[id]) {
      return dispatch(formPassed(id, router))
    }
  }
}

The first action check that the page is completed and in that case a second action is dispatched:

export function formPassed(id, router) {
  router.push('/registration')
}

Now I'm in an url that is /registration/login. When I click to validate the form the two actions are dispatched in the correct order and finally my app redirects to /registration.. But it automatically redirect a second time to registration/login

My client.js:

let preloadedState = window.__PRELOADED_STATE__
const persistedState = loadState()
if (persistedState != null) preloadedState = persistedState

const store = configureStore(preloadedState, browserHistory)
const rootElement = document.getElementById('app')
const history = syncHistoryWithStore(browserHistory, store)

store.subscribe(throttle(()=> {
  saveState(store.getState());
}, 1000))

render(
  <Provider store={store}>
    <Router routes={ routes } history={ history } 
      onUpdate={() => { window.scrollTo(0, 0) }} 
     />
  </Provider>, rootElement
)

my server.js

function storeUpAndGo (sessionState, history) {

    // setup of the Redux store
    let preloadedState = { rootReducer }
    const persistedState = loadState(sessionState)
    if (persistedState != null) {
      preloadedState = persistedState
    }

    // Create a new Redux store instance
    return configureStore(preloadedState, history)

  }

  // This is fired every time the server side receives a request
  const jsFile = parameters.chunks().javascript.main
  const cssFile = parameters.chunks().styles.main

  app.use(handleRender)

  function handleRender(req, res) {

    const memoryHistory = createMemoryHistory(req.url)
    const store = storeUpAndGo(req.session, memoryHistory)
    const history = syncHistoryWithStore(memoryHistory, store)

    match({ history, routes, location: req.url }, (err, redirectLocation, renderProps) => {
      if (err) {
        console.error(err);
        return res.status(500).end('Internal server error');
      }

      if (!renderProps) {
        return res.status(404).end('Not found.');
      }

      const params = qs.parse(req.query)

      const InitialComponent = (
        <Provider store={store}>
           <RouterContext {...renderProps} />
        </Provider>
      );

      // Render the component to a string
      const html = renderToString(InitialComponent)

      // Grab the initial state from our Redux store
      const finalState = store.getState()

      // Send the rendered page back to the client
      res.send(renderFullPage(html, finalState))
    })
  }

and finally my configureStore

export default function configureStore(preloadedState, history) {

  const logger = createLogger();
  const middleware = routerMiddleware(history)
  const store = createStore(
    rootReducer,
    preloadedState,
    compose(applyMiddleware(thunk, logger, middleware))
  )

  if (module.hot) {
    // Enable Webpack hot module replacement for reducers
    module.hot.accept('../reducers', () => {
      const nextRootReducer = require('../reducers').default
      store.replaceReducer(nextRootReducer)
    })
  }
  return store
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions