Run Multistep Workflows with react-use-workflow
Update: public github and npm package.
React-workflow is a lightweight framework to automate multi-step workflows. I designed it to streamline multi-step Web3.js transactions, but it can be used for any multi-step React workflow.
Here's a demo with a three-step workflow:
Video for https://omarish-assets.s3.us-east-1.amazonaws.com/images/2020-10-28/react-workflow-demo.webm is loading
- In this example, the first step waits for a response from metamask.
- Optionally, you can pass in a function that waits for an event to be emitted on chain. Or runs some other logic to make sure a result happened.
- The second and third steps set short timeouts and then resolve.
How to use react-use-workflow
There are two parts to adding a react-use-workflow:
- Define the workflow using the createWorkflow helper
- Add the workflow to a React component
Define the workflow using createWorkflow:
2. Mount the workflow using useWorkflow
Use the useWorkflow React hook to mount the workflow in a component.
Proposed type definitions: these are a little hand-wavey, but I'll firm them up if there's enough demand for this library:
Want to use this?
• github • npm package