Extract the logic that makes hook shareable without Provider/Context

I’m loving the look of this lib! I’m currently rewriting some of my state management as a POC using it.

I was curious, would you be able to extract the logic that makes this hook “shareable” in any component without needing a Provider? If so that extracted utility would be highly valuable to the hook community. Any hook could use this utility to convert the regular hook to a “works anywhere as a singleton” hook.

Or is the “sharing” capability too coupled with the rest of the library?

Thinking something like this:

// This hook could now be used in many places with the same reference state.
const useSharedState = share(() => {
  const [state, setState] = useState(initialState)

  return [state, setState]
})

Some prior art are:

• constate: https://github.com/diegohaz/constate (but still uses Provider)
• hookleton: https://github.com/bySabi/hookleton (seems to achieve what I’m talking)

[JeremyRH]

This would be nice but I don’t know if your example is possible. State is shared without using a provider by collecting the setState and dispatch functions in a list and calling them when needed. It is possible for someone to create a package that does this though:

import { useReducer, useState } from 'react';
import share from 'react-share-state';
export const useSharedReducer = share(useReducer);
export const useSharedState = share(useState);

[timkindberg]

I’m thinking more if someone already had a hook written.

function useMyState() {
  const [state, dispatch] = userReducer(...)
  const actions = {...}
  // maybe some more logic
  return someApi
}

Then they could just make it “shared” state, meaning it could be used in multiple components. Like a higher-order hook.

export useMySharedState = share(useMyState)

Anyway, sorry to beat a dead horse 😃 THANK YOU for this library, we’ve started using it in our startup’s site. It’s going well so far!