1 | import React, { useMemo, useEffect } from 'react'
|
2 | import PropTypes from 'prop-types'
|
3 | import { ReactReduxContext } from './Context'
|
4 | import Subscription from '../utils/Subscription'
|
5 |
|
6 | function Provider({ store, context, children }) {
|
7 | const contextValue = useMemo(() => {
|
8 | const subscription = new Subscription(store)
|
9 | subscription.onStateChange = subscription.notifyNestedSubs
|
10 | return {
|
11 | store,
|
12 | subscription
|
13 | }
|
14 | }, [store])
|
15 |
|
16 | const previousState = useMemo(() => store.getState(), [store])
|
17 |
|
18 | useEffect(() => {
|
19 | const { subscription } = contextValue
|
20 | subscription.trySubscribe()
|
21 |
|
22 | if (previousState !== store.getState()) {
|
23 | subscription.notifyNestedSubs()
|
24 | }
|
25 | return () => {
|
26 | subscription.tryUnsubscribe()
|
27 | subscription.onStateChange = null
|
28 | }
|
29 | }, [contextValue, previousState])
|
30 |
|
31 | const Context = context || ReactReduxContext
|
32 |
|
33 | return <Context.Provider value={contextValue}>{children}</Context.Provider>
|
34 | }
|
35 |
|
36 | if (process.env.NODE_ENV !== 'production') {
|
37 | Provider.propTypes = {
|
38 | store: PropTypes.shape({
|
39 | subscribe: PropTypes.func.isRequired,
|
40 | dispatch: PropTypes.func.isRequired,
|
41 | getState: PropTypes.func.isRequired
|
42 | }),
|
43 | context: PropTypes.object,
|
44 | children: PropTypes.any
|
45 | }
|
46 | }
|
47 |
|
48 | export default Provider
|