github-starred/komodo
2
0
Fork 0
mirror of https://github.com/moghtech/komodo.git synced 2025-12-05 19:17:36 -06:00
Code Issues 258 Packages Projects Releases 10 Wiki Activity

[PR #750] [MERGED] Add Enter Key Support for Dialog Confirmations #776

New Issue
Closed
opened 2025-10-31 15:21:31 -05:00 by GiteaMirror · 0 comments
GiteaMirror commented 2025-10-31 15:21:31 -05:00
Owner
Copy Link

📋 Pull Request Information

Original PR: https://github.com/moghtech/komodo/pull/750
Author: @MP-Tool
Created: 8/21/2025
Status: ✅ Merged
Merged: 8/23/2025
Merged by: @mbecker20

Base: 1.19.1 ← Head: ux/prompt-hotkeys

📝 Commits (10+)

  • b7dabe2 start 1.19.1
  • ac2786f deploy 1.19.1-dev-1
  • 5307ebf Merge branch 'moghtech:1.19.1' into 1.19.1
  • c1b9f8f Merge branch 'moghtech:1.19.1' into 1.19.1
  • 607abdf Implement usePromptHotkeys for enhanced dialog interactions and UX
  • 8f8bba7 Refactor usePromptHotkeys to enhance confirm button detection and improve UX
  • 1947f8c Remove forceConfirmDialog prop from ActionWithDialog and related logic for cleaner implementation
  • aacc32a Add dialog descriptions to ConfirmUpdate and ActionWithDialog for better clarity and resolve warnings
  • 56b859f fix
  • d5ade95 Restore forceConfirmDialog prop to ActionWithDialog for enhanced confirmation handling

📊 Changes

3 files changed (+146 additions, -25 deletions)

View changed files

📝 frontend/src/components/config/util.tsx (+23 -5)
📝 frontend/src/components/util.tsx (+46 -20)
📝 frontend/src/lib/hooks.ts (+77 -0)

📄 Description

Add Enter Key Support for Dialog Confirmations

What this PR adds:

New Hook: usePromptHotkeys

  • Added central keyboard handling for dialogs
  • Enter key now triggers confirm buttons in dialogs
  • Smart detection ignores Enter when typing in input fields

Enhanced Components:

  • ActionWithDialog: Added Enter key support with double-confirmation safety
  • ConfirmButton: Now responds to Enter key via virtual clicking
  • ConfirmUpdate: Added Enter key support alongside existing Ctrl+Enter

Safety Features:

  • Double Enter confirmation for destructive actions
  • Button text changes to "Confirm" after first Enter
  • Visual feedback with green highlight on confirmation

Technical Implementation:

  • Virtual click system: Enter key programmatically clicks the correct button
  • Uses data-confirm-button attributes for button detection
  • Maintains all existing functionality (Ctrl+Enter, click handlers, etc.)

Files Changed:

  • frontend/src/lib/hooks.ts: New usePromptHotkeys hook
  • frontend/src/components/util.tsx: Enhanced ActionWithDialog and ConfirmButton
  • frontend/src/components/config/util.tsx: Added Enter support to ConfirmUpdate
  • frontend/src/components/resources/common.tsx: Cleanup of unused code

This is a simple quality-of-life improvement that adds expected Enter-to-confirm behavior to dialogs.

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/moghtech/komodo/pull/750 **Author:** [@MP-Tool](https://github.com/MP-Tool) **Created:** 8/21/2025 **Status:** ✅ Merged **Merged:** 8/23/2025 **Merged by:** [@mbecker20](https://github.com/mbecker20) **Base:** `1.19.1` ← **Head:** `ux/prompt-hotkeys` --- ### 📝 Commits (10+) - [`b7dabe2`](https://github.com/moghtech/komodo/commit/b7dabe217ca33b8fa5ff374b1672ed3c32b039ca) start 1.19.1 - [`ac2786f`](https://github.com/moghtech/komodo/commit/ac2786f16bab53df08ff8e0e9f5d786ae0b803cc) deploy 1.19.1-dev-1 - [`5307ebf`](https://github.com/moghtech/komodo/commit/5307ebf758a1aa24376f1783a277b477fa0dd0d1) Merge branch 'moghtech:1.19.1' into 1.19.1 - [`c1b9f8f`](https://github.com/moghtech/komodo/commit/c1b9f8f7e0d5a48883de740b37390fbab4ea6057) Merge branch 'moghtech:1.19.1' into 1.19.1 - [`607abdf`](https://github.com/moghtech/komodo/commit/607abdf2081efbec8216246e39b512b8f2ba72f6) Implement usePromptHotkeys for enhanced dialog interactions and UX - [`8f8bba7`](https://github.com/moghtech/komodo/commit/8f8bba77415ab709b52ce683228a19bc6088a77a) Refactor usePromptHotkeys to enhance confirm button detection and improve UX - [`1947f8c`](https://github.com/moghtech/komodo/commit/1947f8c643e1c77db59d7666556fbdaf358fa013) Remove forceConfirmDialog prop from ActionWithDialog and related logic for cleaner implementation - [`aacc32a`](https://github.com/moghtech/komodo/commit/aacc32ac90a96996eda46203e85edd0986b7ffa7) Add dialog descriptions to ConfirmUpdate and ActionWithDialog for better clarity and resolve warnings - [`56b859f`](https://github.com/moghtech/komodo/commit/56b859fa0d7a0bc6fcf3b7ffac25ad6a4e16344c) fix - [`d5ade95`](https://github.com/moghtech/komodo/commit/d5ade95f17d48c228b9040c9aa0b933b22d6647d) Restore forceConfirmDialog prop to ActionWithDialog for enhanced confirmation handling ### 📊 Changes **3 files changed** (+146 additions, -25 deletions) <details> <summary>View changed files</summary> 📝 `frontend/src/components/config/util.tsx` (+23 -5) 📝 `frontend/src/components/util.tsx` (+46 -20) 📝 `frontend/src/lib/hooks.ts` (+77 -0) </details> ### 📄 Description # Add Enter Key Support for Dialog Confirmations ## What this PR adds: ### New Hook: `usePromptHotkeys` - Added central keyboard handling for dialogs - Enter key now triggers confirm buttons in dialogs - Smart detection ignores Enter when typing in input fields ### Enhanced Components: - **ActionWithDialog**: Added Enter key support with double-confirmation safety - **ConfirmButton**: Now responds to Enter key via virtual clicking - **ConfirmUpdate**: Added `Enter` key support alongside existing `Ctrl+Enter` ### Safety Features: - Double Enter confirmation for destructive actions - Button text changes to "Confirm" after first Enter - Visual feedback with green highlight on confirmation ## Technical Implementation: - Virtual click system: Enter key programmatically clicks the correct button - Uses `data-confirm-button` attributes for button detection - Maintains all existing functionality (`Ctrl+Enter`, click handlers, etc.) ## Files Changed: - `frontend/src/lib/hooks.ts`: New `usePromptHotkeys` hook - `frontend/src/components/util.tsx`: Enhanced ActionWithDialog and ConfirmButton - `frontend/src/components/config/util.tsx`: Added Enter support to ConfirmUpdate - `frontend/src/components/resources/common.tsx`: Cleanup of unused code This is a simple quality-of-life improvement that adds expected Enter-to-confirm behavior to dialogs. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the
pull-request
 label 2025-10-31 15:21:31 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
1.19.0
1.19.1
1.19.2
1.19.3
1.19.4
bug
documentation
done
enhancement
help wanted
info
pull-request
Mirrored from GitHub Pull Request
question
security
seen 👀
setup
thinking 🤔
ui
No Label
pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/komodo#776
No description provided.
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?