fix: Prompt input has incorrect height on first render when expanding split panel #2947
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
YueyingLu
changed the title
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #2947 +/- ##
========================================
Coverage 96.25% 96.25%
========================================
Files 769 769
Lines 21735 21736 +1
Branches 7441 7031 -410
========================================
+ Hits 20920 20921 +1
- Misses 762 807 +45
+ Partials 53 8 -45 ☔ View full report in Codecov by Sentry. |
georgylobko
previously approved these changes
Oct 29, 2024
YueyingLu
force-pushed
the
prompt-input-height
branch
from
4a561a9
to
1e4ad70
Compare
YueyingLu
force-pushed
the
prompt-input-height
branch
from
1e4ad70
to
f3c870d
Compare
YueyingLu
force-pushed
the
prompt-input-height
branch
from
f3c870d
to
96faf7b
Compare
georgylobko
reviewed
Oct 30, 2024
src/prompt-input/internal.tsx
Outdated
| @@ -108,7 +108,8 @@ const InternalPromptInput = React.forwardRef( | |||
| textareaRef.current.style.height = 'auto'; | |||
| const maxRowsHeight = `calc(${maxRows <= 0 ? 3 : maxRows} * (${LINE_HEIGHT} + ${PADDING} / 2) + ${PADDING})`; | |||
| const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`; | |||
| textareaRef.current.style.height = `min(${scrollHeight}, ${maxRowsHeight})`; | |||
| const minRowsHeight = `calc(${LINE_HEIGHT} + ${tokens.spaceScaledXxs} * 2)`; // the min height of Textarea with 1 line | |||
There was a problem hiding this comment.
Suggested change
| const minRowsHeight = `calc(${LINE_HEIGHT} + ${tokens.spaceScaledXxs} * 2)`; // the min height of Textarea with 1 line | |
| const minTextareaHeight = `calc(${LINE_HEIGHT} + ${tokens.spaceScaledXxs} * 2)`; |
YueyingLu
force-pushed
the
prompt-input-height
branch
from
96faf7b
to
42c6947
Compare
georgylobko
approved these changes
Oct 30, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Fix Prompt input has incorrect height on first render when expanding split panel. It is because the height is set to scrollHeight of the textarea Ref, but it can be 0 when it is in collapsed Split panel. The fix uses the 1 row height of textarea (1 line height + top&bottom padding) as the min height.
Related links, issue AWSUI-56326
How has this been tested?
Added integration test and run the fix though dev pipeline.Review checklist
The following items are to be evaluated by the author(s) and the reviewer(s).
Correctness
CONTRIBUTING.md.CONTRIBUTING.md.Security
checkSafeUrlfunction.Testing
By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.