Status clear after#24620
Conversation
stitesExpensify
left a comment
There was a problem hiding this comment.
LGTM, let's do this!
|
✋ 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/stitesExpensify in version: 1.4.13-0 🚀
|
|
🚀 Deployed to staging by https://github.com/stitesExpensify in version: 1.4.13-0 🚀
|
| backgroundColor={theme.PAGE_THEMES[SCREENS.SETTINGS.PROFILE.STATUS].backgroundColor} | ||
| footer={footerComponent} | ||
| <ScreenWrapper | ||
| style={[StyleUtils.getBackgroundColorStyle(theme.PAGE_THEMES[SCREENS.SETTINGS.PROFILE.STATUS].backgroundColor)]} |
There was a problem hiding this comment.
Any reason for adding this style?
This caused style regression on light mode:

There was a problem hiding this comment.
This part was added before theme switching. So needs to be updated now
|
Hey gang 👋 I think this PR may have resulted in this deploy blocker #33128. Is this something we can get fixed quickly? |
|
🚀 Deployed to production by https://github.com/jasperhuangg in version: 1.4.13-8 🚀
|
| Navigation.goBack(ROUTES.SETTINGS_STATUS_CLEAR_AFTER); | ||
| }; | ||
|
|
||
| if (lodashGet(privatePersonalDetails, 'isLoading', true)) { |
| if (selectionHour.start !== selectionHour.end || !isOnlyNumericValue) { | ||
| return; | ||
| } |
There was a problem hiding this comment.
This made the user unable to select all and delete (selection range have a start that is different than the end) - Coming from #33143
There was a problem hiding this comment.
It was made intentionally as it brings a new level of complexity, and validating becomes messy. We decided to release it as is and change how this input would work in further PRs
| enabledWhenOffline | ||
| shouldUseDefaultValue | ||
| > | ||
| <DatePicker |
There was a problem hiding this comment.
We should use field components via the InputComponent wrapper in FormProvider. It works with the lifecycle of the Form. Directly using the component caused the #33423
| InteractionManager.runAfterInteractions(() => { | ||
| navigateBackToPreviousScreen(); | ||
| }); |
There was a problem hiding this comment.
As far as I rememeber, it helps to first update the status and then navigate back. This way, you avoid seeing the flickering status when going back
There was a problem hiding this comment.
Maybe you could remember on what platform this was happening? I couldn't reproduce on the web even with the network set to "Slow 3G".
There was a problem hiding this comment.
Coming from #64873, calling clearDraftCustomStatus outside of runAfterInteractions will cause the status to flicker. More details here #64873 (comment)
| if (shouldClearServerError) { | ||
| FormActions.setErrors(formID, null); | ||
| } | ||
| FormActions.setErrorFields(formID, null); |
There was a problem hiding this comment.
Tiny issue - #34684 (comment)
We should have re-rendered the form if the locale has changed.
| const [hourStr] = timeString.split(/[:\s]+/); | ||
| const hour = parseInt(hourStr, 10); | ||
|
|
||
| if (hour === 0) { |
There was a problem hiding this comment.
This caused this bug: we can't update the custom time to 0h

Details
In this PR, the ability to set an expiration date for the status has been added.
To test it, you need to enable the beta flag 'customStatus'. I encountered some challenges regarding the UX of certain components, such as the time picker. Originally, the document described it as a 'terminal-like' input, where input goes from right to left, replacing inappropriate numbers with zeros. However, this approach didn't work well for numbers like 9:00. For instance, 9 was corrected to 0, resulting in 00:90. As a workaround, I implemented it as a standard time picker where you can change a number by replacing the next one after the caret.
I have ideas on how to enhance the user experience, but for now, this is version 1.
Fixed Issues
$ #23138
PROPOSAL:
Tests
Offline tests
QA Steps
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectiontoggleReportand notonIconClick)myBool && <MyComponent />.src/languages/*files and using the translation methodWaiting for Copylabel for a copy review on the original GH to get the correct copy.STYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)/** comment above it */thisare necessary to be bound (i.e. avoidthis.submit = this.submit.bind(this);ifthis.submitis never passed to a component event handler likeonClick)StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG))Avataris modified, I verified thatAvataris working as expected in all cases)ScrollViewcomponent to make it scrollable when more elements are added to the page.mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps.Screenshots/Videos
Web
Untitled.2.mov
Mobile Web - Chrome
telegram-cloud-document-2-5235489383485814489.mp4
Mobile Web - Safari
Simulator.Screen.Recording.-.SE.16.2.-.2023-09-27.at.17.55.10.mp4
Desktop
Screen.Recording.2023-09-27.at.18.25.27.mov
iOS
Simulator.Screen.Recording.-.SE.16.2.-.2023-09-27.at.19.59.15.mp4
Android
telegram-cloud-document-2-5235489383485814486.mp4