summaryrefslogtreecommitdiff
path: root/src/components/StateProvider.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/StateProvider.tsx')
-rw-r--r--src/components/StateProvider.tsx99
1 files changed, 0 insertions, 99 deletions
diff --git a/src/components/StateProvider.tsx b/src/components/StateProvider.tsx
deleted file mode 100644
index 1476b49..0000000
--- a/src/components/StateProvider.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import { produce, setAutoFreeze } from 'immer';
-import React from 'react';
-
-// in logs store we update logs in place
-// outside of immer produce
-// this is just workaround
-setAutoFreeze(false);
-
-const { createContext, memo, useMemo, useRef, useEffect, useCallback, useContext, useState } =
- React;
-
-export const immer = { produce, setAutoFreeze };
-
-const StateContext = createContext(null);
-const DispatchContext = createContext(null);
-const ActionsContext = createContext(null);
-
-export function useStoreState() {
- return useContext(StateContext);
-}
-
-export function useStoreDispatch() {
- return useContext(DispatchContext);
-}
-
-export function useStoreActions() {
- return useContext(ActionsContext);
-}
-
-// boundActionCreators
-export default function Provider({ initialState, actions = {}, children }) {
- const stateRef = useRef(initialState);
- const [state, setState] = useState(initialState);
- const getState = useCallback(() => stateRef.current, []);
- useEffect(() => {
- if (import.meta.env.DEV) {
- (window as any).getState2 = getState;
- }
- }, [getState]);
- const dispatch = useCallback(
- (actionId: string | ((a: any, b: any) => any), fn: (s: any) => void) => {
- if (typeof actionId === 'function') return actionId(dispatch, getState);
-
- const stateNext = produce(getState(), fn);
- if (stateNext !== stateRef.current) {
- if (import.meta.env.DEV) {
-
- console.log(actionId, stateNext);
- }
- stateRef.current = stateNext;
- setState(stateNext);
- }
- },
- [getState]
- );
- const boundActions = useMemo(() => bindActions(actions, dispatch), [actions, dispatch]);
-
- return (
- <StateContext.Provider value={state}>
- <DispatchContext.Provider value={dispatch}>
- <ActionsContext.Provider value={boundActions}>{children}</ActionsContext.Provider>
- </DispatchContext.Provider>
- </StateContext.Provider>
- );
-}
-
-export function connect(mapStateToProps: any) {
- return (Component: any) => {
- const MemoComponent = memo(Component);
- function Connected(props: any) {
- const state = useContext(StateContext);
- const dispatch = useContext(DispatchContext);
- const mapped = mapStateToProps(state, props);
- const nextProps = { dispatch, ...props, ...mapped };
- return <MemoComponent {...nextProps} />;
- }
- return Connected;
- };
-}
-
-// steal from https://github.com/reduxjs/redux/blob/master/src/bindActionCreators.ts
-function bindAction(action: any, dispatch: any) {
- return function (...args: any[]) {
- return dispatch(action(...args));
- };
-}
-
-function bindActions(actions: any, dispatch: any) {
- const boundActions = {};
- for (const key in actions) {
- const action = actions[key];
- if (typeof action === 'function') {
- boundActions[key] = bindAction(action, dispatch);
- } else if (typeof action === 'object') {
- boundActions[key] = bindActions(action, dispatch);
- }
- }
- return boundActions;
-}