← Back to PRs

#14967: fix(ui): replace Manual RPC text input with sorted method dropdown

by rixau open 2026-02-12 20:38 View on GitHub →
app: web-ui stale size: XS
## Summary - Replace the free-text method input in Debug > Manual RPC with a `<select>` dropdown populated from `hello.features.methods` - Stack the method and params fields vertically instead of side-by-side (`stack` instead of `form-grid`) - Add a disabled "Select a method..." placeholder when no method is chosen ## Why The gateway exposes a known, finite set of RPC methods (~80+ base methods plus channel plugin methods). These are already sent to the client in the WebSocket hello message via `features.methods`. The current free-text input requires users to guess or look up method names in source code, which defeats the purpose of a debug panel. The side-by-side layout also causes the text input to sit far below its label on narrower viewports. ## Changes - `ui/src/ui/views/debug.ts` — Add `methods: string[]` prop, replace `<input>` with `<select>`, change `form-grid` to `stack` - `ui/src/ui/app-render.ts` — Pass sorted `hello.features.methods` array to `renderDebug` ## Test plan - [x] `pnpm build` passes - [x] `pnpm check` passes (format + types + lint) - [x] `pnpm test` — 882 passed - [x] Tested locally: dropdown renders all gateway methods alphabetically, RPC calls work correctly ## AI Disclosure - [x] AI-assisted (Claude) - [x] Lightly tested — verified build/check/test pass and visually confirmed in local Control UI - [x] I understand what the code does: wires `hello.features.methods` into a `<select>` element and changes the CSS layout class <!-- greptile_comment --> <h2>Greptile Overview</h2> <h3>Greptile Summary</h3> This PR updates the Debug  Manual RPC panel to use a method dropdown populated from the gateway hello payload (`hello.features.methods`), and adjusts the layout from a side-by-side grid to a vertical stack. The method list is passed down from `ui/src/ui/app-render.ts` into `renderDebug` in `ui/src/ui/views/debug.ts`, sorted client-side. <h3>Confidence Score: 4/5</h3> - This PR is close to safe to merge, with one UI state management issue to address. - Changes are small and localized, but the new <select> mixes a controlled `.value` binding with explicit `selected` attributes on options, which can cause the displayed selection to desync from state on rerender. - ui/src/ui/views/debug.ts <sub>Last reviewed commit: 7c5b68b</sub> <!-- greptile_other_comments_section --> <sub>(2/5) Greptile learns from your feedback when you react with thumbs up/down!</sub> <!-- /greptile_comment -->

Most Similar PRs