Context.js

// MyContext.js
let MyContext = createContext();

export function MyDataProvider({ children }) {
  let state = useState(null);
  return <MyContext.Provider value={state} children={children} />
}

export function useData() {
  let [data] = useContext(MyContext);
  return data;
}

export function useDataUpdateA() {
  let [,dispatch] = useContext(MyContext);
  return (payload) => dispatch({ type: 'UpdateA', payload });
}

export function useDataUpdateB() {
  let [,dispatch] = useContext(MyContext);
  return (payload) => dispatch({ type: 'UpdateB', payload });
}

// MyComponent.js
import { MyDataProvider, useData, useDataUpdateA } from './MyContext.js';

export default function MyComponent() {
  let data = useData();
  let updateThing = useDataUpdateA();
  return ...;
}