Redux state don't change after dispatch on next js - redux

Question

I am new on next js and i use redux-next-wrapper !
The problem is that i want to dispatch a token access but when i am doing it in getInitialProps, the store does not update after the render of the page !
I try to use componentDidMount, it work, but the state is update only after the render of the page, which make visible the button login one second before to be replace by logout !
componentDidMount () {
const token_access = Cookies.get('xxxxxxxxxx');
const token_refresh = Cookies.get('xxxxxxxxxx');
console.log(token_access);
if (token_access && token_refresh) {
const decode = jwt_decode(token_refresh);
if (decode.exp >= new Date()) {
this.props.store.dispatch(logout(token_refresh))
}
else {
const decode_access = jwt_decode(token_access);
if (decode_access.exp >= new Date()) {
refresh(token_refresh)
}
this.props.store.dispatch(userLoggedIn(token_access));
}
}
}
static async getInitialProps ({Component, ctx}) {
const token = '12345';
ctx.store.dispatch(userLoggedIn(token));
return {
pageProps: (Component.getInitialProps ? await Component.getInitialProps(ctx) : {})
}
}
import { createStore, applyMiddleware } from 'redux'
import { composeWithDevTools } from 'redux-devtools-extension';
import thunk from 'redux-thunk';
import rootReducer from '../reducers/index'
export default initialState => createStore(
rootReducer,
composeWithDevTools(
applyMiddleware(thunk)
)
);
is there a way to dispatch and load the store before the render of the page ?
Thank you for your answer

Answer 1

I fix this issue by changing the store ! Hope this help someone :)
export const initStore = (initialState = {} ) => {
return createStore(rootReducer,
initialState, composeWithDevTools(applyMiddleware(thunk)))
};