CURRENTLY RELEASED AS AN ALPHA IF YOU WANT TO TESTnpx @fiberplane/studio@0.5.0-alpha.1
This is a major quality of life overhaul to the Requestor UI, which also introduces some (WIP) UX around playing with WebSockets.
My opinion is that we should hide the WebSocket stuff in the UI for now, and then tackle the UX for WebSockets in a separate PR, so I hid it behind a janky feature flag for now.
If you want to play with the websocket stuff, either turn on the feature flag locally (look for the file: webSocketFeatureFlag), or run this in your browser console:
Below are some notes I took about what needs to be done to support WebSocket testing more robustly in Requestor.
WebSocket TODOs (for future PR)
[ ] Freeze Request Panel "Params" tab once the WebSocket connection has been opened
[ ] Freeze the Request Panel "Headers" tab once the WebSocket connection has been opened
[ ] Show the 101 response in the Response Panel upon successful connection
[ ] Show a specific WebSocket connection error message in the Response Panel when we fail to connect
[ ] Modify keyboard shortcuts to connect/disconnect websocket
[ ] Show a placeholder in the Debug tab for Websockets
[ ] Clear Request Panel Message form after submitting a message
[ ] Retain the history of websocket messages after disconnecting (do not clear the UI)
[ ] TBD: How will AI message generation work?
Changes
WebSockets
Support requests against websockets
Hackily auto-detect websocket routes if it seems like the user copy-pasted the Hono boilerplate for working with websockets
Route Matching
Match the input values of the requestor form (method and path) with known routes using Hono's SmartRouter to emulate route matching logic as much as possible
Savable Draft Routes
Introduce the concept of a "draft route" when you start typing a route that doesn't yet exist in the database. In this case, an icon will appear next to the "Send" button, which allows you to save the route as a custom route
General Improvements
Move most of the Requestor UI state into a single reducer to be able to reason more clearly about the interplay between form fields
Fix issue where the Requests Panel content would be blank when you had the "Body" tab selected for a POST request, but then switched to look at a GET request
Database Updates
Migrate database schema for app_routes to include the route origin column in its computed primary key
Migrate database schema for app_routes to have a column "requestType" which specifies either websocket or http
This is a major quality of life overhaul to the Requestor UI, which also introduces some (WIP) UX around playing with WebSockets.
My opinion is that we should hide the WebSocket stuff in the UI for now, and then tackle the UX for WebSockets in a separate PR, so I hid it behind a janky feature flag for now.
If you want to play with the websocket stuff, either turn on the feature flag locally (look for the file:
webSocketFeatureFlag), or run this in your browser console:Below are some notes I took about what needs to be done to support WebSocket testing more robustly in Requestor.
WebSocket TODOs (for future PR)
101response in the Response Panel upon successful connectionDebugtab for WebsocketsMessageform after submitting a messageChanges
WebSockets
Route Matching
methodandpath) with known routes using Hono'sSmartRouterto emulate route matching logic as much as possibleSavable Draft Routes
General Improvements
Database Updates
app_routesto include the route origin column in its computed primary keyapp_routesto have a column "requestType" which specifies either websocket or http