feat: slash command handling with autocomplete in consumer UI#2
feat: slash command handling with autocomplete in consumer UI#2
Conversation
Consumer HTML now detects `/` prefix and sends slash commands as
`{ type: "slash_command" }` instead of `user_message`, enabling the
existing bridge/executor pipeline. Adds autocomplete popup with keyboard
navigation, consumer-local `/help` and `/clear` commands, improved
command result rendering, and a central command registry. Fixes overlap
where `/cost` and `/context` were in both NATIVE_COMMANDS and
EMULATABLE_COMMANDS.
- Add stopPropagation() to Escape handler so dismissing autocomplete doesn't also send an interrupt when a task is running - Add hide() call in click handler so popup dismisses after selection
Apply truncate(content, 5000) in renderCommandResult, consistent with peer methods that truncate tool results and inputs.
Summary of ChangesHello @teng-lin, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request significantly enhances the user experience in the consumer UI by introducing robust slash command functionality. Users can now easily discover and execute commands through an intuitive autocomplete interface, and benefit from immediate responses for common local actions. The changes streamline command processing, improve message rendering, and establish a clear, centralized system for managing all available commands. Highlights
Changelog
Activity
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
There was a problem hiding this comment.
Code Review
This pull request introduces a robust slash command handling system in the consumer UI, including an autocomplete interface with keyboard navigation and centralized command definitions. The implementation correctly handles local commands like /help and /clear while forwarding others to the server. The addition of a central registry improves maintainability and ensures consistency between the UI and the backend executor. I have identified a few minor areas for improvement regarding input parsing edge cases and the robustness of the UUID fallback mechanism.
| const trimmed = input.trim(); | ||
| const spaceIdx = trimmed.indexOf(' '); | ||
| if (spaceIdx === -1) return { name: trimmed, args: '' }; | ||
| return { name: trimmed.slice(0, spaceIdx), args: trimmed.slice(spaceIdx + 1).trim() }; |
There was a problem hiding this comment.
The parse method assumes that the command name and arguments are separated by a single space. While trim() is called on the arguments, if the user input contains multiple spaces between the command and the first argument (e.g., /command arg), the current logic might include leading spaces in the args string before the final trim(). Although the final trim() handles this, a more robust approach would be to use a regular expression to split by one or more whitespace characters.
| return { name: trimmed.slice(0, spaceIdx), args: trimmed.slice(spaceIdx + 1).trim() }; | |
| const parts = trimmed.split(/\s+/); | |
| const name = parts[0]; | |
| const args = trimmed.slice(name.length).trim(); | |
| return { name, args }; |
There was a problem hiding this comment.
This code was superseded by the Phase 2 rewrite (9f66855). The SlashCommandHandler class no longer exists in the consumer HTML.
| // Server slash command | ||
| const requestId = window.crypto.randomUUID | ||
| ? window.crypto.randomUUID() | ||
| : `${Date.now()}-${Math.random()}`; |
There was a problem hiding this comment.
There was a problem hiding this comment.
This code was superseded by the Phase 2 rewrite (9f66855). The Math.random() fallback no longer exists — all UUID generation now uses crypto.randomUUID() directly.
Summary
/prefix and sends slash commands as{ type: "slash_command" }instead ofuser_message, enabling the existing bridge/executor pipeline from the browser/helpand/clearcommands that work without networkslash_command_resultrendering with command header + preformatted content blockslash-command-registry.ts) with categorized command definitions/costand/contextwere in bothNATIVE_COMMANDSandEMULATABLE_COMMANDSTest plan
npx vitest run— all 1108 tests pass (62 files, 0 failures)/— autocomplete popup appears with all commands/statusvia keyboard or click — see formatted status output with command header/help— see grouped command list (consumer-local, no network round-trip)/clear— messages cleared/compact— forwarded to CLI as pass-throughuser_message(unchanged behavior)