Ability to hydrate all pages without getServerSideProps and connect.
lukasfri opened this issue · 4 comments
I opened this in the next-redux-wrapper issues but it might be more appropriate here. I use Redux for saving my current theme I use in Material UI. They use a wrapper that provides the theme and as such I have a component that uses a selector to get the current theme and apply it. The issue is that I need to hydrate all pages for it to work meaning I have to create lots of empty getServerSIdeProps functions and connect pages which leads to alot of boilerplate. I would like the ability to turn on hydration for all pages regardless of if it is connected or not.
Hi @DreamplaySE,
that's exactly what #22 is about – I addressed #22 by always dispatching a HYDRATE action on the initial client-side page load, accepting duplicate HYDRATE actions on pages with data loading functions. In other words, this should work with version 2.1.2.
On the server, next-redux-cookie-wrapper only dispatches a HYDRATE action if client cookies are actually available, so on static pages (= without getServerSideProps), your server-rendered markup has no chance to respect a client-specific theme. If you want this, @kirill-konshin's suggestion is the way to go – although/because it disables automatic static optimization.
Cheers!
Sorry I should've been more clear! I read thru that issue but basically my hope was for some future feature to simply the boilerplate by maybe providing a wrapper of some kind that automatically provides it all through the _app file. Since you need to default export the page and you can't provide getServerSideProps as a property of the page it means that there's no way to easily make a one-line function that both connects and enables server-side rendering. My question was if there's any way you could create a feature that enables this via a config or some kind of special function of the wrapper that also specifies to NextJS that you're server-side rendering with cookies.
by maybe providing a wrapper of some kind that automatically provides it all through the _app file
I believe what you are looking for is adding getInitialProps to your _app file, as suggested in the next-redux-wrapper issue. All your pages will be server-rendered on each request then, no matter if they have getServerSideProps or not.