Skip to content

Commit 0215fb1

Browse files
dai-shidai-shi
authored
Merge pull request #26 from dai-shi/direct-state-in-context
Direct state in context
2 parents f67cdb7 + 91cc226 commit 0215fb1

20 files changed

+293
-226
lines changed

‎CHANGELOG.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
# Change Log
22

33
## [Unreleased]
4+
### Changed
5+
- Direct state context
6+
- No breaking change in API, but it may behave differently
7+
- Support custom context
48

59
## [3.0.0] - 2019-05-18
610
### Changed

‎dist/ReduxProvider.js

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
exports.ReduxProvider = exports.defaultContext = exports.createCustomContext = void 0;
7+
8+
var _react = require("react");
9+
10+
var _utils = require("./utils");
11+
12+
// -------------------------------------------------------
13+
// context
14+
// -------------------------------------------------------
15+
var warningObject = {
16+
get state() {
17+
throw new Error('Please use <TrackedProvider ...>');
18+
},
19+
20+
get dispatch() {
21+
throw new Error('Please use <TrackedProvider ...>');
22+
},
23+
24+
get subscribe() {
25+
throw new Error('Please use <TrackedProvider ...>');
26+
}
27+
28+
};
29+
30+
var calculateChangedBits = function calculateChangedBits(a, b) {
31+
return a.dispatch !== b.dispatch || a.subscribe !== b.subscribe ? 1 : 0;
32+
};
33+
34+
var createCustomContext = function createCustomContext() {
35+
var w = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : warningObject;
36+
var c = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : calculateChangedBits;
37+
return (0, _react.createContext)(w, c);
38+
};
39+
40+
exports.createCustomContext = createCustomContext;
41+
var defaultContext = createCustomContext(); // -------------------------------------------------------
42+
// provider
43+
// -------------------------------------------------------
44+
45+
exports.defaultContext = defaultContext;
46+
47+
var ReduxProvider = function ReduxProvider(_ref) {
48+
var store = _ref.store,
49+
_ref$customContext = _ref.customContext,
50+
customContext = _ref$customContext === void 0 ? defaultContext : _ref$customContext,
51+
children = _ref.children;
52+
var forceUpdate = (0, _utils.useForceUpdate)();
53+
var state = store.getState();
54+
var listeners = (0, _react.useRef)([]);
55+
(0, _utils.useIsomorphicLayoutEffect)(function () {
56+
listeners.current.forEach(function (listener) {
57+
return listener(state);
58+
});
59+
}, [state]);
60+
var subscribe = (0, _react.useCallback)(function (listener) {
61+
listeners.current.push(listener);
62+
63+
var unsubscribe = function unsubscribe() {
64+
var index = listeners.current.indexOf(listener);
65+
listeners.current.splice(index, 1);
66+
}; // run once in case the state is already changed
67+
68+
69+
listener(store.getState());
70+
return unsubscribe;
71+
}, [store]);
72+
(0, _react.useEffect)(function () {
73+
var unsubscribe = store.subscribe(function () {
74+
forceUpdate();
75+
});
76+
return unsubscribe;
77+
}, [store, forceUpdate]);
78+
return (0, _react.createElement)(customContext.Provider, {
79+
value: {
80+
state: state,
81+
dispatch: store.dispatch,
82+
subscribe: subscribe
83+
}
84+
}, children);
85+
};
86+
87+
exports.ReduxProvider = ReduxProvider;

‎dist/index.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,13 @@ Object.defineProperty(exports, "__esModule", {
66
Object.defineProperty(exports, "ReduxProvider", {
77
enumerable: true,
88
get: function get() {
9-
return _provider.ReduxProvider;
9+
return _ReduxProvider.ReduxProvider;
10+
}
11+
});
12+
Object.defineProperty(exports, "createCustomContext", {
13+
enumerable: true,
14+
get: function get() {
15+
return _ReduxProvider.createCustomContext;
1016
}
1117
});
1218
Object.defineProperty(exports, "useReduxDispatch", {
@@ -40,7 +46,7 @@ Object.defineProperty(exports, "useReduxSelectors", {
4046
}
4147
});
4248

43-
var _provider = require("./provider");
49+
var _ReduxProvider = require("./ReduxProvider");
4450

4551
var _useReduxDispatch = require("./useReduxDispatch");
4652

‎dist/provider.js

Lines changed: 0 additions & 76 deletions
This file was deleted.

‎dist/useReduxDispatch.js

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,17 @@ exports.useReduxDispatch = void 0;
77

88
var _react = require("react");
99

10-
var _provider = require("./provider");
10+
var _ReduxProvider = require("./ReduxProvider");
1111

1212
var useReduxDispatch = function useReduxDispatch() {
13-
var store = (0, _react.useContext)(_provider.ReduxStoreContext);
14-
return store.dispatch;
13+
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
14+
var _opts$customContext = opts.customContext,
15+
customContext = _opts$customContext === void 0 ? _ReduxProvider.defaultContext : _opts$customContext;
16+
17+
var _useContext = (0, _react.useContext)(customContext),
18+
dispatch = _useContext.dispatch;
19+
20+
return dispatch;
1521
};
1622

1723
exports.useReduxDispatch = useReduxDispatch;

‎dist/useReduxSelectors.js

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ var _memoizeState = _interopRequireDefault(require("memoize-state"));
1111

1212
var _withKnownUsage = require("with-known-usage");
1313

14-
var _provider = require("./provider");
14+
var _ReduxProvider = require("./ReduxProvider");
1515

1616
var _utils = require("./utils");
1717

@@ -62,10 +62,15 @@ var runSelector = function runSelector(state, selector) {
6262
};
6363

6464
var useReduxSelectors = function useReduxSelectors(selectorMap) {
65-
var forceUpdate = (0, _utils.useForceUpdate)(); // redux store&state
65+
var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
66+
var _opts$customContext = opts.customContext,
67+
customContext = _opts$customContext === void 0 ? _ReduxProvider.defaultContext : _opts$customContext;
68+
var forceUpdate = (0, _utils.useForceUpdate)(); // redux state
69+
70+
var _useContext = (0, _react.useContext)(customContext),
71+
state = _useContext.state,
72+
subscribe = _useContext.subscribe; // mapped result
6673

67-
var store = (0, _react.useContext)(_provider.ReduxStoreContext);
68-
var state = store.getState(); // mapped result
6974

7075
var keys = Object.keys(selectorMap);
7176
var mapped = createMap(keys, function (key) {
@@ -85,9 +90,8 @@ var useReduxSelectors = function useReduxSelectors(selectorMap) {
8590
}); // subscription
8691

8792
(0, _react.useEffect)(function () {
88-
var callback = function callback() {
93+
var callback = function callback(nextState) {
8994
try {
90-
var nextState = store.getState();
9195
var changed = false;
9296
var nextMapped = createMap(lastTracked.current.keys, function (key) {
9397
var lastResult = lastTracked.current.mapped[key];
@@ -109,13 +113,11 @@ var useReduxSelectors = function useReduxSelectors(selectorMap) {
109113
// detect erorr (probably stale props)
110114
forceUpdate();
111115
}
112-
}; // run once in case the state is already changed
113-
116+
};
114117

115-
callback();
116-
var unsubscribe = store.subscribe(callback);
118+
var unsubscribe = subscribe(callback);
117119
return unsubscribe;
118-
}, [store, forceUpdate]);
120+
}, [subscribe, forceUpdate]);
119121
return trapped.proxy;
120122
};
121123

‎dist/useReduxState.js

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,22 @@ exports.useReduxState = void 0;
77

88
var _react = require("react");
99

10-
var _provider = require("./provider");
10+
var _ReduxProvider = require("./ReduxProvider");
1111

1212
var _utils = require("./utils");
1313

1414
var _deepProxy = require("./deepProxy");
1515

1616
var useReduxState = function useReduxState() {
1717
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
18+
var _opts$customContext = opts.customContext,
19+
customContext = _opts$customContext === void 0 ? _ReduxProvider.defaultContext : _opts$customContext;
1820
var forceUpdate = (0, _utils.useForceUpdate)();
19-
var store = (0, _react.useContext)(_provider.ReduxStoreContext);
20-
var state = store.getState();
21+
22+
var _useContext = (0, _react.useContext)(customContext),
23+
state = _useContext.state,
24+
subscribe = _useContext.subscribe;
25+
2126
var affected = new WeakMap();
2227
var lastTracked = (0, _react.useRef)(null);
2328
(0, _utils.useIsomorphicLayoutEffect)(function () {
@@ -35,21 +40,18 @@ var useReduxState = function useReduxState() {
3540
};
3641
});
3742
(0, _react.useEffect)(function () {
38-
var callback = function callback() {
39-
var nextState = store.getState();
43+
var callback = function callback(nextState) {
4044
var changed = (0, _deepProxy.isDeepChanged)(lastTracked.current.state, nextState, lastTracked.current.affected, lastTracked.current.cache, lastTracked.current.assumeChangedIfNotAffected);
4145

4246
if (changed) {
4347
lastTracked.current.state = nextState;
4448
forceUpdate();
4549
}
46-
}; // run once in case the state is already changed
47-
50+
};
4851

49-
callback();
50-
var unsubscribe = store.subscribe(callback);
52+
var unsubscribe = subscribe(callback);
5153
return unsubscribe;
52-
}, [store, forceUpdate]);
54+
}, [subscribe, forceUpdate]);
5355
var proxyCache = (0, _react.useRef)(new WeakMap()); // per-hook proxyCache
5456

5557
return (0, _deepProxy.createDeepProxy)(state, affected, proxyCache.current);

‎dist/useReduxStateRich.js

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ var _react = require("react");
99

1010
var _proxyequal = require("proxyequal");
1111

12-
var _provider = require("./provider");
12+
var _ReduxProvider = require("./ReduxProvider");
1313

1414
var _utils = require("./utils");
1515

@@ -35,10 +35,15 @@ var useTrapped = function useTrapped(state) {
3535
};
3636

3737
var useReduxStateRich = function useReduxStateRich() {
38-
var forceUpdate = (0, _utils.useForceUpdate)(); // redux store&state
38+
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
39+
var _opts$customContext = opts.customContext,
40+
customContext = _opts$customContext === void 0 ? _ReduxProvider.defaultContext : _opts$customContext;
41+
var forceUpdate = (0, _utils.useForceUpdate)(); // redux state
42+
43+
var _useContext = (0, _react.useContext)(customContext),
44+
state = _useContext.state,
45+
subscribe = _useContext.subscribe; // trapped
3946

40-
var store = (0, _react.useContext)(_provider.ReduxStoreContext);
41-
var state = store.getState(); // trapped
4247

4348
var trapped = useTrapped(state); // ref
4449

@@ -51,21 +56,18 @@ var useReduxStateRich = function useReduxStateRich() {
5156
}); // subscription
5257

5358
(0, _react.useEffect)(function () {
54-
var callback = function callback() {
55-
var nextState = store.getState();
59+
var callback = function callback(nextState) {
5660
var changed = !(0, _proxyequal.proxyEqual)(lastTracked.current.state, nextState, lastTracked.current.affected);
5761

5862
if (changed) {
5963
lastTracked.current.state = nextState;
6064
forceUpdate();
6165
}
62-
}; // run once in case the state is already changed
63-
66+
};
6467

65-
callback();
66-
var unsubscribe = store.subscribe(callback);
68+
var unsubscribe = subscribe(callback);
6769
return unsubscribe;
68-
}, [store, forceUpdate]);
70+
}, [subscribe, forceUpdate]);
6971
return trapped.state;
7072
};
7173

0 commit comments

Comments
 (0)