-
Notifications
You must be signed in to change notification settings - Fork 2.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Web - Profile - When selecting the last country or state extra space is displayed for a while #31737
Conversation
… extra space is displayed for a while
Hey! I see that you made changes to our Form component. Make sure to update the docs in FORMS.md accordingly. Cheers! |
@burczu Plus a little explanation Before the last comment I implemented the pre-negotiated solution But I noticed a small flaw on mobile apps (Video without opacity while transitioning between screens) 2.movIt looks much better than main (Main) Screen.Recording.2023-11-22.at.21.59.18.movTherefore, I decided to update the solution a little and added the last comment where I hide the elements until we have the desired index. And when the elements are visible we will be in the right place (Video with opacity while transitioning between screens) 3.movShould I reconsider my last comment? |
@@ -71,6 +72,8 @@ function BaseSelectionList({ | |||
const shouldShowSelectAll = Boolean(onSelectAll); | |||
const activeElement = useActiveElement(); | |||
const isFocused = useIsFocused(); | |||
const [maxToRenderPerBatch, setMaxToRenderPerBatch] = useState(shouldUseDynamicMaxToRenderPerBatch ? 0 : 5); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think we could extract this 5
to some constant with meaningful name.
const listHeight = lodashGet(nativeEvent, 'layout.height', 0); | ||
const itemHeight = lodashGet(nativeEvent, 'layout.y', 0); | ||
|
||
setMaxToRenderPerBatch((Math.ceil(listHeight / itemHeight) || 0) + 5); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is this 5
here the same as the one I've mentioned in my previous comment? If so the constant has even more sense I think.
@burczu |
Reviewer Checklist
Screenshots/VideosAndroid: NativeScreen.Recording.2023-11-27.at.12.28.11.movAndroid: mWeb ChromeScreen.Recording.2023-11-27.at.12.31.01.moviOS: NativeScreen.Recording.2023-11-27.at.12.26.20.moviOS: mWeb SafariScreen.Recording.2023-11-27.at.12.29.31.movMacOS: Chrome / SafariScreen.Recording.2023-11-27.at.12.32.01.movMacOS: DesktopScreen.Recording.2023-11-27.at.12.33.49.mov |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Seems good to me, thank you both @ZhenjaHorbach and @burczu 🚀
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
🚀 Deployed to staging by https://github.com/mountiny in version: 1.4.4-0 🚀
|
🚀 Deployed to production by https://github.com/mountiny in version: 1.4.4-3 🚀
|
Details
Web - Profile - When selecting the last country or state extra space is displayed for a while
Fixed Issues
$ #31660
PROPOSAL: #31660 (comment)
Tests
Offline tests
QA Steps
PR Author Checklist
### Fixed Issues
section aboveTests
sectionOffline steps
sectionQA steps
sectiontoggleReport
and notonIconClick
)myBool && <MyComponent />
.src/languages/*
files and using the translation methodWaiting for Copy
label for a copy review on the original GH to get the correct copy.STYLE.md
) were followedAvatar
, I verified the components usingAvatar
are working as expected)StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG)
)Avatar
is modified, I verified thatAvatar
is working as expected in all cases)ScrollView
component to make it scrollable when more elements are added to the page.main
branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTest
steps.Screenshots/Videos
Android: Native
Screen.Recording.2023-11-22.at.19.53.58.mov
Android: mWeb Chrome
web-android.mov
iOS: Native
Screen.Recording.2023-11-22.at.19.49.50.mov
iOS: mWeb Safari
web-ios.mov
MacOS: Chrome / Safari
web.mov
MacOS: Desktop
desktop.mov