Sudo auto fill password #441

Merged
Taoshan98 merged 5 commits from sudo-auto-fill-password into dev-1.10.0 2025-12-08 05:04:48 +00:00
Taoshan98 commented 2025-12-05 17:36:11 +00:00 (Migrated from github.com)

Overview

Short summary of what this PR does

  • Added: ...
  • Updated: ...
  • Removed: ...
  • Fixed: ...

Changes Made

Sudo Password Auto-Fill Implementation

For this feature, I focused on creating a seamless interaction between the terminal's data stream and the user interface, allowing for quick authentication when sudo prompts appear. Here is a technical breakdown of the changes.

1. Pattern Detection in Terminal Stream

The core logic resides in [Terminal.tsx].
I intercepted the WebSocket onmessage handler to inspect incoming data chunks from the server. I implemented a regex pattern match to detect standard sudo prompts (e.g., [sudo] password for user:).

When a match is detected—and provided the feature is enabled in the host configuration—the application pauses standard input processing momentarily to render the [SudoPasswordPopup] component.
This ensures the user sees the prompt immediately when authentication is requested.

2. UI Component and Event Interception

I created a new component, [SudoPasswordPopup.tsx], to handle the user interaction.
The most critical technical challenge here was managing keyboard focus and event propagation.

Since xterm.js aggressively captures keyboard input, I implemented a window-level keydown event listener using the capture phase. This allows the popup to intercept Enter (to confirm) and Escape (to dismiss) keys before they bubble down to the terminal instance. I explicitly used e.stopImmediatePropagation() and e.preventDefault() to ensure that confirming the password doesn't accidentally send a newline character to the shell, and dismissing the popup doesn't send an escape code.

3. Configuration and Type Definitions

To persist this setting, I updated the data models in [src/types/index.ts].
I added a sudoPasswordAutoFill boolean property to the [TerminalConfig] interface.

I then updated [HostManagerEditor.tsx] to include a toggle switch within the "Advanced terminal settings" tab. This required updating the Zod validation schema to correctly handle the new field during form submission and persistence.

4. Localization

I standardized the translation keys for this feature across all supported languages.
I placed the keys (title, hint, confirm, dismiss) under the terminal namespace in the [translation.json].
This ensures the feature feels native regardless of the selected interface language.

In the Terminal.tsx file, unfortunately the code ended up indented differently; it might be difficult to spot the differences. I hope that’s not a problem.

Screenshots / Demos

Terminal Settings

host-terminal-settings

Terminal

terminal

Checklist

  • Code follows project style guidelines
  • Supports mobile and desktop UI/app (if applicable)
  • I have read Contributing.md
# Overview _Short summary of what this PR does_ - [X] Added: ... - [ ] Updated: ... - [ ] Removed: ... - [ ] Fixed: ... # Changes Made ## Sudo Password Auto-Fill Implementation For this feature, I focused on creating a seamless interaction between the terminal's data stream and the user interface, allowing for quick authentication when sudo prompts appear. Here is a technical breakdown of the changes. ### 1. Pattern Detection in Terminal Stream The core logic resides in [Terminal.tsx]. I intercepted the WebSocket `onmessage` handler to inspect incoming data chunks from the server. I implemented a regex pattern match to detect standard sudo prompts (e.g., `[sudo] password for user:`). When a match is detected—and provided the feature is enabled in the host configuration—the application pauses standard input processing momentarily to render the [SudoPasswordPopup] component. This ensures the user sees the prompt immediately when authentication is requested. ### 2. UI Component and Event Interception I created a new component, [SudoPasswordPopup.tsx], to handle the user interaction. The most critical technical challenge here was managing keyboard focus and event propagation. Since xterm.js aggressively captures keyboard input, I implemented a window-level `keydown` event listener using the **capture phase**. This allows the popup to intercept `Enter` (to confirm) and `Escape` (to dismiss) keys before they bubble down to the terminal instance. I explicitly used `e.stopImmediatePropagation()` and `e.preventDefault()` to ensure that confirming the password doesn't accidentally send a newline character to the shell, and dismissing the popup doesn't send an escape code. ### 3. Configuration and Type Definitions To persist this setting, I updated the data models in [src/types/index.ts]. I added a `sudoPasswordAutoFill` boolean property to the [TerminalConfig] interface. I then updated [HostManagerEditor.tsx] to include a toggle switch within the "Advanced terminal settings" tab. This required updating the Zod validation schema to correctly handle the new field during form submission and persistence. ### 4. Localization I standardized the translation keys for this feature across all supported languages. I placed the keys (title, hint, confirm, dismiss) under the `terminal` namespace in the [translation.json]. This ensures the feature feels native regardless of the selected interface language. In the Terminal.tsx file, unfortunately the code ended up indented differently; it might be difficult to spot the differences. I hope that’s not a problem. # Screenshots / Demos ## Terminal Settings <img width="1334" height="866" alt="host-terminal-settings" src="https://github.com/user-attachments/assets/bda9e7ca-0a2a-4437-8d0c-1775a29949ab" /> ## Terminal <img width="1334" height="911" alt="terminal" src="https://github.com/user-attachments/assets/848d07a0-65cd-4ae2-a920-7892ed04b01e" /> # Checklist - [X] Code follows project style guidelines - [ ] Supports mobile and desktop UI/app (if applicable) - [X] I have read [Contributing.md](https://github.com/Termix-SSH/Termix/blob/main/CONTRIBUTING.md)
LukeGus commented 2025-12-08 05:04:44 +00:00 (Migrated from github.com)

LGTM. Termix has a built in alert system for managing alerts which I will migrate your auto-fill alert to use. Thanks.

LGTM. Termix has a built in alert system for managing alerts which I will migrate your auto-fill alert to use. Thanks.
Taoshan98 commented 2025-12-08 19:42:35 +00:00 (Migrated from github.com)

LGTM. Termix has a built in alert system for managing alerts which I will migrate your auto-fill alert to use. Thanks.

Thanks for the approval, actually, sorry if I didn't notice that there was already an ad-hoc component, if you want you can reopen the PR and I can do the migration

> LGTM. Termix has a built in alert system for managing alerts which I will migrate your auto-fill alert to use. Thanks. Thanks for the approval, actually, sorry if I didn't notice that there was already an ad-hoc component, if you want you can reopen the PR and I can do the migration
LukeGus commented 2025-12-09 00:16:41 +00:00 (Migrated from github.com)

No worries, it’s not an issue. I have it taken care of already.

No worries, it’s not an issue. I have it taken care of already.
Sign in to join this conversation.