AutoGPT icon indicating copy to clipboard operation
AutoGPT copied to clipboard

fix(frontend): Fix text area input not updating input field

Open majdyz opened this issue 1 year ago โ€ข 3 comments

Background

Detailed Textbox modal is not updating the input text value, because the change is only triggered by inputBox unblur.

https://github.com/user-attachments/assets/ee07e592-6022-4cfc-b8c9-3d5b101ee22d

Problem:

  • We can't use onChange & HTML value controlled combination, because this will make cursor keep change on each change, making us unable to type in the middle of the text.
  • We uses onBlur and make the input uncontrolled to circumvent the issue, but this makes the changing the input outside the box unusable.

Solution:

  • We keep creating a new ref on each render / statechange with the state value, it will allow flexible change, the inputbox will still be uncontrolled, but it will still be up to date on each state change.

Changes ๐Ÿ—๏ธ

Each node-input-component will pass a HTML input ref that will always match the state value. Side Changes: Fix linting errors, latest master introduced stricter linting rules.

Testing ๐Ÿ”

[!NOTE] Only for the new autogpt platform, currently in autogpt_platform/

  • Create from scratch and execute an agent with at least 3 blocks
  • Import an agent from file upload, and confirm it executes correctly
  • Upload agent to marketplace
  • Import an agent from marketplace and confirm it executes correctly
  • Edit an agent from monitor, and confirm it executes correctly

majdyz avatar Sep 27 '24 22:09 majdyz

PR Reviewer Guide ๐Ÿ”

โฑ๏ธย Estimated effort to review: 2 ๐Ÿ”ต๐Ÿ”ตโšชโšชโšช
๐Ÿงชย No relevant tests
๐Ÿ”’ย No security concerns identified
โšกย Key issues to review

Potential Performance Issue
The getInputRef function is creating a new ref on each render, which might lead to unnecessary re-renders and affect performance.

Possible Bug
The NodeTextBoxInput component removed the onBlur event handler, which might affect the functionality of updating input values.

qodo-merge-pro[bot] avatar Sep 27 '24 22:09 qodo-merge-pro[bot]

Deploy Preview for auto-gpt-docs canceled.

Name Link
Latest commit b54bd5ebc0eeeecea598fe2a8ea9ce910e20f678
Latest deploy log https://app.netlify.com/sites/auto-gpt-docs/deploys/66fb2499d6cc3c0008b1b8f3

netlify[bot] avatar Sep 27 '24 22:09 netlify[bot]

CLA assistant check
All committers have signed the CLA.

CLAassistant avatar Sep 30 '24 08:09 CLAassistant

This pull request has conflicts with the base branch, please resolve those so we can evaluate the pull request.

github-actions[bot] avatar Oct 01 '24 10:10 github-actions[bot]

Superseded by https://github.com/Significant-Gravitas/AutoGPT/pull/8190

majdyz avatar Oct 02 '24 20:10 majdyz