[PR #5372] [CLOSED] [WIP] fix: ensure consistent text selection in reconciliation modal #5901

Closed
opened 2026-02-28 21:20:37 -06:00 by GiteaMirror · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/actualbudget/actual/pull/5372
Author: @Atharvshukla
Created: 7/22/2025
Status: Closed

Base: masterHead: reconciliation-input-highlight


📝 Commits (2)

  • 44c5fbd fix: ensure consistent text selection in reconciliation modal
  • 4a68a25 [autofix.ci] apply automated fixes

📊 Changes

1 file changed (+23 additions, -1 deletions)

View changed files

📝 packages/component-library/src/Input.tsx (+23 -1)

📄 Description

This PR resolves inconsistent text selection behavior in the reconciliation modal's amount input field. The issue manifested as the input field's text not being reliably highlighted when the modal opened, making it harder for users to quickly type over the value.

Solution

  1. Adding a dedicated useRef hook to maintain a stable reference to the input element
  2. Implementing a useEffect hook that watches for changes to the input value
  3. Adding a small delay (100ms) before selecting the text to ensure the component is fully mounted and visible
  4. Maintaining compatibility with existing ref usage while adding our own reference

Key changes:

  • Added proper ref handling to support both function and object refs
  • Implemented a consistent selection mechanism that only triggers when there's a value to select
  • Ensured the selection happens after the component is fully mounted and visible

Testing

The fix was tested by:

  1. Opening the reconciliation modal multiple times
  2. Verifying that the input text is consistently highlighted
  3. Confirming that the selection behavior works across different scenarios (empty vs non-empty values)
  4. Ensuring no regression in existing functionality

Closes #5366

https://github.com/user-attachments/assets/22676351-0a3b-4876-9bfb-d382215e0585


🔄 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/actualbudget/actual/pull/5372 **Author:** [@Atharvshukla](https://github.com/Atharvshukla) **Created:** 7/22/2025 **Status:** ❌ Closed **Base:** `master` ← **Head:** `reconciliation-input-highlight` --- ### 📝 Commits (2) - [`44c5fbd`](https://github.com/actualbudget/actual/commit/44c5fbd027aad51b191ba7553113aac470fb57e5) fix: ensure consistent text selection in reconciliation modal - [`4a68a25`](https://github.com/actualbudget/actual/commit/4a68a254139999194c4e62fa9f4923b858205cd6) [autofix.ci] apply automated fixes ### 📊 Changes **1 file changed** (+23 additions, -1 deletions) <details> <summary>View changed files</summary> 📝 `packages/component-library/src/Input.tsx` (+23 -1) </details> ### 📄 Description This PR resolves inconsistent text selection behavior in the reconciliation modal's amount input field. The issue manifested as the input field's text not being reliably highlighted when the modal opened, making it harder for users to quickly type over the value. ## Solution 1. Adding a dedicated `useRef` hook to maintain a stable reference to the input element 2. Implementing a `useEffect` hook that watches for changes to the input value 3. Adding a small delay (100ms) before selecting the text to ensure the component is fully mounted and visible 4. Maintaining compatibility with existing ref usage while adding our own reference Key changes: - Added proper ref handling to support both function and object refs - Implemented a consistent selection mechanism that only triggers when there's a value to select - Ensured the selection happens after the component is fully mounted and visible ## Testing The fix was tested by: 1. Opening the reconciliation modal multiple times 2. Verifying that the input text is consistently highlighted 3. Confirming that the selection behavior works across different scenarios (empty vs non-empty values) 4. Ensuring no regression in existing functionality ## Related Issues Closes #5366 https://github.com/user-attachments/assets/22676351-0a3b-4876-9bfb-d382215e0585 --- <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 2026-02-28 21:20:37 -06:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/actual#5901