ryardley / ts-bus

A lightweight JavaScript/TypeScript event bus to help manage your application architecture.
MIT License
135 stars 8 forks source link

Accept injected useReducer function to enable reinspect to attach to bus #18

Closed ryardley closed 4 years ago

ryardley commented 5 years ago

Currently we cannot tool useBusReducer with https://github.com/troch/reinspect because it automatically uses the React peer dependency.

Thinking syntax might be able to be something like this:

import React from "react";
import { useBusReducer } from "ts-bus";
import { useReducer } from "reinspect";

const useReducer = useBusReducer.with(useReducer);

export default function App() {
  const state = useReducer(...);
}
ryardley commented 5 years ago

Workshopping the syntax a bit more @dmicic what do you think about this? I am starting to think configuring via options makes more sense as it enables us to mimic the React API:

import {useBusReducer} from 'ts-bus/react';

// The output shares the exact signature of the React equivalent
// This would be a breaking change 
const state = useBusReducer(reducer, initState, init);
import {useBusReducer} from 'ts-bus/react';

// Create a configured useReducer function
const useReducer = useBusReducer.configure({subscriber, useReducer});

// The output shares the exact signature of the React equivalent but with the configuration applied
const state = useReducer(reducer, initState, init);

This would also be applicable to the useBusState PR: https://github.com/ryardley/ts-bus/pull/28 and should be considered before merging that PR.

dmicic commented 5 years ago

@ryardley In general, I like the the option based configuration idea. I would have to get my hands on reinspect to provide a constructive comment. But some random thoughts... At first glance, the integration could work nicely. The event name can be used for the "id" parameter required by reinspect. The only issue I see if you have multiple subscribers per event. In that case, the react devTools would probably dump the message 1*n-subscribers time. It would be useful to display to which component/subscriber the state belongs to.

I've actually started aligning useBusState to react's useState. (However, still struggeling to extract the event name from the type in order to avoid the additional parameter #28)