Skip to content

Instantly share code, notes, and snippets.

@jake-daniels

jake-daniels/init-redux-full.jsx

Last active November 2, 2019 15:25
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save jake-daniels/d403415b10aebdfe2feea3c09beae6c0 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save jake-daniels/d403415b10aebdfe2feea3c09beae6c0 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. jake-daniels revised this gist Feb 20, 2019. 1 changed file with 5 additions and 1 deletion.
    6 changes: 5 additions & 1 deletion init-redux-full.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -23,7 +23,11 @@ function initRedux(reducer, initialState) {
    const actionCreator = actionMap[key]
    const fn = (...args) => {
    const action = actionCreator(...args)
    dispatch(action)
    if (typeof action === 'function') {
    action(dispatch, () => appState)
    } else {
    dispatch(action)
    }
    }
    return { ...acc, [key]: fn }
    }, {})
  2. jake-daniels revised this gist Feb 19, 2019. 1 changed file with 24 additions and 24 deletions.
    48 changes: 24 additions & 24 deletions init-redux-full.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -1,35 +1,35 @@
    function initRedux(reducer, initialState) {
    const StateContext = React.createContext(null)
    const DispatchContext = React.createContext(null)
    const DispatchContext = React.createContext(null)

    function Provider(props) {
    const [appState, dispatch] = React.useReducer(reducer, initialState)
    return (
    <StateContext.Provider value={appState}>
    <DispatchContext.Provider value={dispatch}>
    function Provider(props) {
    const [appState, dispatch] = React.useReducer(reducer, initialState)
    return (
    <StateContext.Provider value={appState}>
    <DispatchContext.Provider value={dispatch}>
    {props.children}
    </DispatchContext.Provider>
    </StateContext.Provider>
    )
    }
    </StateContext.Provider>
    )
    }

    function useRedux(extractState, actionMap) {
    const appState = React.useContext(StateContext)
    const dispatch = React.useContext(DispatchContext)
    function useRedux(extractState, actionMap) {
    const appState = React.useContext(StateContext)
    const dispatch = React.useContext(DispatchContext)

    const stateExtract = extractState(appState)
    const stateExtract = extractState(appState)

    const actions = Object.keys(actionMap).reduce((acc, key) => {
    const actionCreator = actionMap[key]
    const fn = (...args) => {
    const action = actionCreator(...args)
    dispatch(action)
    }
    return { ...acc, [key]: fn }
    }, {})
    const actions = Object.keys(actionMap).reduce((acc, key) => {
    const actionCreator = actionMap[key]
    const fn = (...args) => {
    const action = actionCreator(...args)
    dispatch(action)
    }
    return { ...acc, [key]: fn }
    }, {})

    return [stateExtract, actions]
    }
    return [stateExtract, actions]
    }

    return { Provider, useRedux }
    return { Provider, useRedux }
    }
  3. jake-daniels revised this gist Feb 19, 2019. No changes.
  4. jake-daniels revised this gist Feb 19, 2019. 1 changed file with 14 additions and 19 deletions.
    33 changes: 14 additions & 19 deletions init-redux-full.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -1,39 +1,34 @@
    export function initRehoox<R extends AnyReducer, S extends React.ReducerState<R>>(reducer: R, initialState: S) {
    const StateContext = React.createContext<S | null>(null)
    const DispatchContext = React.createContext<React.Dispatch<React.ReducerAction<R>> | null>(null)
    function initRedux(reducer, initialState) {
    const StateContext = React.createContext(null)
    const DispatchContext = React.createContext(null)

    function Provider(props: { children: JSX.Element }) {
    function Provider(props) {
    const [appState, dispatch] = React.useReducer(reducer, initialState)
    return (
    <StateContext.Provider value={appState}>
    <DispatchContext.Provider value={dispatch}>{props.children}</DispatchContext.Provider>
    <DispatchContext.Provider value={dispatch}>
    {props.children}
    </DispatchContext.Provider>
    </StateContext.Provider>
    )
    }

    function useRedux<StateExtract, ActionMap extends DispatchMap<S>>(
    extractState: (state: S) => StateExtract,
    actionMap: ActionMap,
    ) {
    const appState = React.useContext(StateContext) as S
    const dispatch = React.useContext(DispatchContext) as React.Dispatch<React.ReducerAction<R>>
    function useRedux(extractState, actionMap) {
    const appState = React.useContext(StateContext)
    const dispatch = React.useContext(DispatchContext)

    const stateExtract = extractState(appState)

    const actions = Object.keys(actionMap).reduce((acc: object, key: string) => {
    const actions = Object.keys(actionMap).reduce((acc, key) => {
    const actionCreator = actionMap[key]
    const fn = (...args: ArgsTypes<typeof actionCreator>) => {
    const fn = (...args) => {
    const action = actionCreator(...args)
    if (typeof action === 'function') {
    action(dispatch as Dispatch<S, Action<any>>, () => appState)
    } else {
    dispatch(action as React.ReducerAction<R>)
    }
    dispatch(action)
    }
    return { ...acc, [key]: fn }
    }, {})

    return [stateExtract, actions] as [StateExtract, AppActions<ActionMap>]
    return [stateExtract, actions]
    }

    return { Provider, useRedux }
  5. jake-daniels created this gist Feb 19, 2019.
    40 changes: 40 additions & 0 deletions init-redux-full.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,40 @@
    export function initRehoox<R extends AnyReducer, S extends React.ReducerState<R>>(reducer: R, initialState: S) {
    const StateContext = React.createContext<S | null>(null)
    const DispatchContext = React.createContext<React.Dispatch<React.ReducerAction<R>> | null>(null)

    function Provider(props: { children: JSX.Element }) {
    const [appState, dispatch] = React.useReducer(reducer, initialState)
    return (
    <StateContext.Provider value={appState}>
    <DispatchContext.Provider value={dispatch}>{props.children}</DispatchContext.Provider>
    </StateContext.Provider>
    )
    }

    function useRedux<StateExtract, ActionMap extends DispatchMap<S>>(
    extractState: (state: S) => StateExtract,
    actionMap: ActionMap,
    ) {
    const appState = React.useContext(StateContext) as S
    const dispatch = React.useContext(DispatchContext) as React.Dispatch<React.ReducerAction<R>>

    const stateExtract = extractState(appState)

    const actions = Object.keys(actionMap).reduce((acc: object, key: string) => {
    const actionCreator = actionMap[key]
    const fn = (...args: ArgsTypes<typeof actionCreator>) => {
    const action = actionCreator(...args)
    if (typeof action === 'function') {
    action(dispatch as Dispatch<S, Action<any>>, () => appState)
    } else {
    dispatch(action as React.ReducerAction<R>)
    }
    }
    return { ...acc, [key]: fn }
    }, {})

    return [stateExtract, actions] as [StateExtract, AppActions<ActionMap>]
    }

    return { Provider, useRedux }
    }