rsnext/examples/with-redux-saga/components/page.js
TodorTotev cc4b0c7b40
Refactor with redux saga (#13342)
Related to [11014](https://github.com/zeit/next.js/issues/11014)

Upgraded all the packages from package.json, removed the saga-wrapper package since it is totally outdated to today's use.

I have refactored the whole example using the new API of the next-redux-wrapper package, using their new support of "getStaticProps".

All of the class components were converted to functional, using the new redux hooks API.

If you want me to change anything or you are not satisfied with any given change, I'm open to suggestions.
2020-05-25 16:21:35 +00:00

32 lines
886 B
JavaScript

import Link from 'next/link'
import { useSelector } from 'react-redux'
import Counter from './counter'
import Clock from './clock'
function Page({ linkTo, NavigateTo, title }) {
const placeholderData = useSelector((state) => state.placeholderData)
const error = useSelector((state) => state.error)
const light = useSelector((state) => state.light)
const lastUpdate = useSelector((state) => state.lastUpdate)
return (
<div>
<h1>{title}</h1>
<Clock lastUpdate={lastUpdate} light={light} />
<Counter />
<nav>
<Link href={linkTo}>
<a>Navigate: {NavigateTo}</a>
</Link>
</nav>
{placeholderData && (
<pre>
<code>{JSON.stringify(placeholderData, null, 2)}</code>
</pre>
)}
{error && <p style={{ color: 'red' }}>Error: {error.message}</p>}
</div>
)
}
export default Page