problem with module caching when used in _app and other pages

[Ilaiwi]

Describe the bug
I am having a problem when using packages that have module caching and keep track of internal state in server rendering. An example of such packages is redux-act where module caching is used to keep track of an id used to serialize action types. The bug happens when importing my store.js file with all the actions, reducers and the store in _app, and importing it in other pages as well. This causes my store.js file to be bundled with both _app and any other page I am rendering like index. This causes the createAction to be called twice to the same action which causes the internal redux-act ids to be out of sync and thus the reducer never handles the add action

To Reproduce
this reproduce code is passed on the with-redux-wrapper example.

1. clone https://github.com/Ilaiwi/next-_app-bug-example
2. run npm run dev
3. go to localhost:3000

Expected behavior
the AddCount should be 1 because an add action was dispatched in getInitialProps

System information

• OS: [Windows 10 and osx]
• Version of Next.js: [e.g. 6.0.3]

Additional context
what I did in the example is I just added redux-act and replaced the actions with redux-act actions and deleted the thunk AddCount action.

[abusada]

Please refer to redux-act readme:

createAction([description], [payloadReducer], [metaReducer])

• description (string, optional): used by logging and devtools when displaying the action. If this parameter is uppercase only, with underscores and numbers, it will be used as the action type without any generated id. You can use this feature to have serializable actions you can share between client and server.

so using uppercase description will solve your issue, see the following

const addTodo = createAction('Add todo');
addTodo('content');
// return { type: '[1] Add todo', payload: 'content' }

const editTodo = createAction('Edit todo', (id, content) => ({id, content}));
editTodo(42, 'the answer');
// return { type: '[2] Edit todo', payload: {id: 42, content: 'the answer'} }

const serializeTodo = createAction('SERIALIZE_TODO');
serializeTodo(1);
// return { type: 'SERIALIZE_TODO', payload: 1 }

This is an issue with how redux-act is designed, not nextjs

[timneutkens]

Duplicate of #4194

[Ilaiwi]

@timneutkens will follow there thanks.
@abusada I tried capitalizing the types but redux-act will through an error TypeError: Duplicate action type: ADD which is logical since createAction("ADD") was called twice with same type