Skip to content

Latest commit

 

History

History
70 lines (49 loc) · 1.65 KB

README.md

File metadata and controls

70 lines (49 loc) · 1.65 KB

Reflex Developer Tools

Developer tools for Reflex, a Roblox state container library.

image

Warning

This is nowhere near finished, but is usable! It should only be used on the Client at this time.

Installation

Building

npm install
npm run build

...and place it in your Roblox/Plugins folder.

Middleware

You will need to use a middleware to dispatch actions and state to the plugin.

Here's what I use:

const event = ReplicatedStorage.FindFirstChild("REFLEX_DEVTOOLS") as RemoteEvent

const middleware: ProducerMiddleware<RootState, RootActions> = () => {
	return (nextAction, actionName) => {
		return (...args) => {
			const state = nextAction(...args)
			if (RunService.IsStudio() && event) {
				event.FireServer({ name: actionName, args: [...args], state })
			}

			return state
		}
	}
}

export = middleware

Whatever you do, fire the event an object that satisfies the following type:

interface DispatchedAction {
	name: string
	args: unknown[]
	state: {}
}

...then apply it to your store:

export const store = combineProducers({
	// ...
}).applyMiddleware(devTools)

Why does it use RemoteEvents?

Couldn't get BindableEvents to be received by the Plugin. Context: https://discord.com/channels/385151591524597761/385151591998816257/1149590579529912320