text:
[Theme Switching Migration] Master File Tracking

Coming from https://expensify.slack.com/archives/C03UK30EA1Z/p1700644906437179?thread_ts=1700563711.542099&cid=C03UK30EA1Z
We need to migrate the following files to use our styles/theme hooks.

[ ] src/libs/Navigation/AppNavigator/getRootNavigatorScreenOptions.js
[ ] src/components/AddressForm.js
[ ] src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.js
[ ] src/components/AvatarWithImagePicker.js
[ ] src/components/Composer/index.ios.js
[ ] src/components/Composer/index.android.js
[ ] src/components/EmojiPicker/EmojiPickerMenu/index.js
[ ] src/components/Icon/BankIcons.ts
[ ] src/components/MenuItem.js
[ ] src/components/ScreenWrapper/index.js
[ ] src/libs/ComposerUtils/updateNumberOfLines/index.native.ts
[ ] src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.js
[ ] src/libs/Navigation/AppNavigator/RHPScreenOptions.js
[ ] src/libs/Navigation/AppNavigator/getRootNavigatorScreenOptions.js
[ ] src/pages/ReferralDetailsPage.js
[ ] src/pages/ReimbursementAccount/RequestorStep.js
[ ] src/pages/settings/Wallet/Card/BaseGetPhysicalCard.js
[ ] src/pages/settings/Wallet/Card/GetPhysicalCardConfirm.js
[ ] src/pages/settings/Wallet/Card/GetPhysicalCardName.js
[ ] src/pages/settings/Wallet/Card/GetPhysicalCardPhone.js
[x] src/styles/addOutlineWidth/index.ts

PropTypes

[ ] src/components/OptionsList/optionsListPropTypes.js
[ ] src/components/OptionsSelector/optionsSelectorPropTypes.js

Styles

[ ] src/pages/signin/SignInPageLayout/signInPageStyles/index.native.js
[ ] src/pages/signin/SignInPageLayout/signInPageStyles/index.js
[ ] src/styles/containerComposeStyles/index.native.ts
[ ] src/styles/containerComposeStyles/index.ts
[ ] src/styles/getContextMenuItemStyles/index.native.ts
[ ] src/styles/getContextMenuItemStyles/index.ts
[ ] src/styles/optionRowStyles/index.ts
[ ] src/styles/optionRowStyles/index.native.ts

cc @roryabraham Let me know if you're interested in helping to review these when they're done!

cc @chrispader as well

Could you please assign me to this tracking issue?

@grgia it turns out we don't need to migrate src/styles/addOutlineWidth/index.ts - it's used in styles/styles.ts

@koko57 are you able to update the issue description? If so, feel free to update as needed! I used a strikethrough for that one

@grgia no, unfortunately I cannot update it 😞

@grgia should i work on some of this or are these issues/batches already assigned to someone?

@grgia here's the summary what we've managed to do so far
open PRs:
https://github.com/Expensify/App/pull/31774
https://github.com/Expensify/App/pull/31728
https://github.com/Expensify/App/pull/31723
https://github.com/Expensify/App/pull/31827
https://github.com/Expensify/App/pull/31691 (need to address one comment)
drafts:
https://github.com/Expensify/App/pull/31815

@chrispader, we've got PRs up for these; but if you'd like to help review, that would be great!

@grgia looks like only this one is missing something, the rest are ok

Tuesday update:
All the PRs are opened for review 🙂 🎉
I see that some of them are already approved 🙂

Should we make sure that all of these batches also include changes to propTypes? I noticed some of the components' propTypes haven't been updated, but we might ignore this since we're migrating TypeScript anway?
Wdyt? @grgia

@chrispader good point. I think we should include the proptypes for class components until they are officially migrated.
cc @koko57 thoughts on this?

All the PRs looks good to me! 👍

@koko57 @chrispader
It looks like we need to replace default theme import for these files

[ ] https://github.com/Expensify/App/blob/9c095833c924e564b6488a693c7eddd87e32f0b1/src/components/Icon/index.tsx#L5
[ ] https://github.com/Expensify/App/blob/3b02565ea9df14b93ca3c1f2ce3de2ef4c8f4c1d/src/styles/getTooltipStyles.ts
[ ] https://github.com/Expensify/App/blob/68233f4b7b7e2fae3f8031c0e3727e5f7c63ae94/src/components/MapView/MapView.web.tsx#L13
[ ] https://github.com/Expensify/App/blob/1080ca04fb28754b8f115a996943b37259bfa9d7/src/components/ShowMoreButton/index.js#L11
[ ] https://github.com/Expensify/App/blob/86767e1eda45e738c0335cbcaa1e3060d1ece82a/src/pages/home/report/ReportActionItem.js#L50
[ ] https://github.com/Expensify/App/blob/1d44d68e0d66ac69a032d119f2ca70ccf48e60f9/src/pages/home/report/ReportActionItemSingle.js#L24
[ ] https://github.com/Expensify/App/blob/e87d35d8af177df33c4fdfbf221ead732efec310/src/stories/Composer.stories.js#L10
[ ] https://github.com/Expensify/App/blob/e87d35d8af177df33c4fdfbf221ead732efec310/src/styles/getModalStyles.ts#L6
[ ] https://github.com/Expensify/App/blob/05a58d8ecbbea76e1b21a9f989d72e0bc278906f/src/styles/getReportActionContextMenuStyles.ts#L3
[ ] https://github.com/Expensify/App/blob/3b02565ea9df14b93ca3c1f2ce3de2ef4c8f4c1d/src/styles/getTooltipStyles.ts#L6
[ ] https://github.com/Expensify/App/blob/1b22f59fd874fcc4297ee8f4350ae34d02f74aeb/src/styles/styles.ts#L23
[ ] https://github.com/Expensify/App/blob/8537b739f520d3eba39958575d176b12f149b12a/src/styles/StyleUtils.ts#L12

Then I can take care of the rest of the files, but please clarify how should I change import like this: App/src/styles/StyleUtils.ts

We need to pass theme from the component with useTheme to any of the functions that currently depend on themeColors

@chrispader @grgia - for this file I think it should stay as it is App/src/styles/styles.ts

Hi, I’m Michael (Mykhailo) from Callstack and I would like to work on this issue.

@chrispader @grgia https://github.com/Expensify/App/pull/32247 ready for review

@chrispader @grgia - for this file I think it should stay as it is App/src/styles/styles.ts

Yes right. We're removing this import and defaultStyles as soon as all components are migrated.

@koko57
I created two issues for these
https://github.com/Expensify/App/issues/32254
https://github.com/Expensify/App/issues/32255

@grgia, I've opened a PR for review - https://github.com/Expensify/App/pull/32250.

@grgia thanks! we're almost done, but I will link the PRs for this issue. The last PR is nearly there

@grgia the last one I'm opening in a few minutes - there will be 2 PR for the Util issue

Closing as complete 🎊


text:
HIGH: Update the UnreadMessageSummary subject line to emphasize user content

Strategy:
Our plan to get a billion users involves convincing every business and organization in the world to create a "workspace" for their internal chat.  With luck it'll mean that users will be members of many workspaces, groups, and DMs.  Additionally, to fight the "tyranny of the straggler", all workspace communications fall back to email.
Problem:
As you use Expensify more for chat, you get more and more email notifications -- and they all contain Expensify Chat in the subject.  This feels very spammy: it's like, I get it, it's from Expensify Chat.   Consider the following subject lines:

DM: Expensify Chat between David and Joel
Group: Expensify Chat between Concierge, David and A Clean
Room: [Midtown Beer Garden] #announce Expensify Chat
Thread: [Midtown Beer Garden] Chat Report Expensify Chat

Contrast to Github, which devotes the entire subject line to the user's content:

[Expensify/react-native-onyx] Fix Prettier diff (PR #442)

Solution:
Streamline the subject line to focus less on us and more on the user's content by:

Non-Threads: Use the room name (ie, whatever is shown in product in the header) for the subject,

DM: David and Joel
Group: Concierge, David, and A Clean
Room: Midtown Beer Garden / #announce

Threads: Put the "parent room" in brackets, and the threaded comment after:

DM: [David and Joel] What do you think of blah?
Group: [Concierge, David, and A Clean] What do you think of blah?
Room: [Midtown Beer Garden / #announce] What do you think of blah?
Thread in thread: [What do you think of blah?] Bananas, mostly

This preserves "threading" where same-subject messages neatly combine in Gmail.  But it prevents the redundant Expensify Chat everywhere.  It also has the benefit of reminding the user that DMs, groups, rooms, and threads are all subtly different.
Realtime Slack conversation happening here: https://expensify.slack.com/archives/C066HJM2CAZ/p1703535720130769

Part of this change made it so that I can't filter these emails anymore, can we please do something so that I can?
Some context here staging.new.expensify.com/r/6170818806991248

Per the link above, @iwiznia 's concern about filters should be alleviated with this

I've always loved how GH does their email notifications (utilize a no-reply address in the CC field) which also allows them to be filtered based on the action that triggered the notification. I think that would be pretty easy to implement and could work well. Though, we should be careful about spending too much time perfecting these as there could be more valuable work to do elsewhere.

Auth PR has been merged, Web-E is in review.

Web-E is still in review.

Feature is in staging

This is deployed to prod, so closing this one
It created a new bug https://github.com/Expensify/App/issues/37568, which I will get to.

source: gharchive/issue

authors: iwiznia mallenexpensify quinthar rlinoz tgolen

repo: Expensify/App

license: MIT

license_type: permissive

license_source: github-api


text:
Login - Can not login with Apple ID and Google ID

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Version Number: 1.4.43-0
Reproducible in staging?: Y
Reproducible in production?: Y
Email or phone of affected tester (no customers): fischer9966@gmail.com
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: Applause-Internal Team
Slack conversation:
Action Performed:

Go to staging.new.expensify.com or open Expensify app
Select login with Apple ID or Google ID
Follow the flow

Expected Result:
User can successfully login with Apple ID and Google ID
Actual Result:
User can not login with Apple ID and Google ID
Workaround:
Unknown
Platforms:

Which of our officially supported platforms is this issue occurring on?

[x] Android: Native
[x] Android: mWeb Chrome
[x] iOS: Native
[x] iOS: mWeb Safari
[x] MacOS: Chrome / Safari
[x] MacOS: Desktop

Screenshots/Videos
https://github.com/Expensify/App/assets/115492554/1a012bdd-bf22-4675-9597-ac03ef67a940

View all open jobs on GitHub

Fixed internally: https://expensify.slack.com/archives/C06KNCDSSBC/p1708433037553489

authors: izarutskaya muttmuure


text:
[$250] [Wave Collect] [Ideal Nav] Workspaces - Status bar is white in workspace list when app is in light mode

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Found when validating PR : https://github.com/Expensify/App/pull/37421
Version Number: 1.4.52-0
Reproducible in staging?: Y
Reproducible in production?: Y
Logs: https://stackoverflow.com/c/expensify/questions/4856
Issue reported by: Applause-Internal team
Action Performed:
Precondition:

App is in light mode.

Launch New Expensify app.
Go to Profile.
Go to Workspaces.

Expected Result:
The status bar will appear black when app is in light mode.
Actual Result:
The status bar is white when app is in light mode.
Workaround:
Unknown
Platforms:

Which of our officially supported platforms is this issue occurring on?

[x] Android: Native
[ ] Android: mWeb Chrome
[x] iOS: Native
[ ] iOS: mWeb Safari
[ ] MacOS: Chrome / Safari
[ ] MacOS: Desktop

Screenshots/Videos
https://github.com/Expensify/App/assets/115492554/ed529a8e-b528-4c35-8443-68d8335dafe5

View all open jobs on GitHub
Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~01c548479525f9eebb
Upwork Job ID: 1768704311192559616
Last Price Increase: 2024-03-15

@abekkala I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors.

Proposal
Please re-state the problem that we are trying to solve in this issue.
The status bar text is white which makes it invisible in light mode.
What is the root cause of that problem?
We define the status bar style for the workspace list page as light content.
https://github.com/Expensify/App/blob/0a512c9f3cf1b207668ab93f3d79866c80345f88/src/styles/theme/themes/light.ts#L114-L117
This value is used in CustomStatusBarAndBackground. Because it's set to light content, the status bar color becomes white.
What changes do you think we should make in order to solve the problem?

Change the status bar style to dark content.
CONST.STATUS_BAR_STYLE.DARK_CONTENT
we might need to check for other page too

Proposal
Please re-state the problem that we are trying to solve in this issue.
Workspaces - Status bar is white in workspace list when app is in light mode
What is the root cause of that problem?
Only in the Workspace Setting Page i.e. Here :
https://github.com/Expensify/App/blob/0a512c9f3cf1b207668ab93f3d79866c80345f88/src/styles/theme/themes/light.ts#L114-L117
we are using CONST.STATUS_BAR_STYLE.LIGHT_CONTENT, because of which the status bar is showing white content on white background.
What changes do you think we should make in order to solve the problem?

Since, there is a white background and white content case, we need to change it to CONST.STATUS_BAR_STYLE.DARK_CONTENT.
What alternative solutions did you explore? (Optional)
N/A
Result :
https://github.com/Expensify/App/assets/158435970/9814410e-4e25-4e23-b895-4c5c1687e945

I agree that we should have dark text at the top when in light mode and light text when in dark mode.
It seems we're keeping light text in both modes.

Yeah, that seems like a bug to me. Flagging @mountiny @luacmartins as I think this is related to the ideal-nav v2 changes.

Seems like coming from the ideal nav, seems like a minor change so changing to $250
@parasharrajat can you please review the proposals

Proposal

Please re-state the problem that we are trying to solve in this issue.
In Workspace Setting Page  - Status bar is white in workspace list when app is in light mode

What is the root cause of that problem?
In Workspace Setting Page :
https://github.com/Expensify/App/blob/d17b4df0809e941faf52a49d9a9eac295ba46e83/src/styles/theme/themes/light.ts#L114-L118
CONST.STATUS_BAR_STYLE is set to LIGHT_CONTENT  which is causing the status bar to show light content on white LIGHT theme.
Since the backgroundColor: colors.productLight100 is White and CONST.STATUS_BAR_STYLE is set to LIGHT_CONTENT, this makes the status bar appear white almost entirely.

What changes do you think we should make in order to solve the problem?
CONST.STATUS_BAR_STYLE should be set to DARK_CONTENT for light theme.

 Current Behaviour:
https://github.com/Expensify/App/assets/38328775/fbf1a76e-4a46-4d8f-89f7-48d0d8643e61
 After making the required Changes:
The Status bar will have STATUS_BAR_STYLE set to  DARK_CONTENT and the status bar will appear correctly in the app.

@parasharrajat Please review my proposal.

Contributor details
Your Expensify account email: abhigurjeet@gmail.com
Upwork Profile Link: https://www.upwork.com/freelancers/~013b026a356f3bc13f

updated proposal with a note

PR is ready
cc: @parasharrajat

@sakluger    I'm ooo until April 08

CURRENT STATUS
PR has been created. Once it's deployed to prod this title should update with payment date.
Payments would go to:

FIx: @bernhardoj [$250] Offer link
PR Review: @parasharrajat [$250] - payment is via NEWDOT

PR is on staging, I'll add the payment date once it's on prod.

I dont think we will need regression test for this one, people would notice this quickly imho
$250 to @parasharrajat and $250 to @bernhardoj

Summarizing payment on this issue:
Contributor: @bernhardoj $250, paid via Upwork
Contributor+: @parasharrajat $250, please request on Newdot

$250 approved for @parasharrajat

authors: JmillsExpensify abekkala abhigurjeet bernhardoj godofoutcasts94 izarutskaya mountiny sakluger shawnborton


text:
Long Workspace Name gets Cut

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Action Performed:

Enter a very long email address for the signin
Go to FAB and click on New Workspace
You'll see that the workspace name has no margin and it gets cut from the screen.

Expected Result:
Should have a margin with the text having ellipses. It should then on hover show the full name.
Actual Result:
Text gets cut and no way to see the full workspace name.

Workaround:
Can the user still use Expensify without this being fixed? Have you informed them of the workaround?
Platform:

Where is this issue occurring?

Web
iOS
Android
Desktop App
Mobile Web

Version Number:
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation
Expensify/Expensify Issue URL:
View all open jobs on GitHub

Triggered auto assignment to @mateocole (AutoAssignerTriage), see https://stackoverflow.com/c/expensify/questions/4749 for more details.

Proposed Solution
In WorkspaceSidebar change the policy.name Pressable as:
<Pressable
    style={[
        styles.alignSelfCenter,
        styles.mt4,
        styles.mb6,
        styles.w100,
    ]}
    onPress={openEditor}
>
    <Tooltip text={policy.name}>
        <Text
            numberOfLines={1}
            style={[
                styles.displayName,
            ]}
        >
            {policy.name}
        </Text>
    </Tooltip>
</Pressable>

@mateocole Eep! 4 days overdue now. Issues have feelings too...

Triggered auto assignment to @mountiny (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

This can be worked on by external contributor for sure, assigning the label.

Triggered auto assignment to @mallenexpensify (External), see https://stackoverflow.com/c/expensify/questions/8582 for more details.

Hired @akshayasalvi in Upwork!

For reference, it looks like this regression was introduced by this issue, and has been fixed already.

Updating payment til 9/5, due to regression.

Paid in Upwork, included bonus for reporting the issue

authors: Julesssss MelvinBot akshayasalvi mallenexpensify mountiny


text:
Search filters - (you) disappears after selecting own user name

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Version Number: 9.0.22-5
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Email or phone of affected tester (no customers): applausetester+kh05081@applause.expensifail.com
Issue reported by: Applause - Internal Team
Action Performed:

Go to staging.new.expensify.com/search/filters
Click From or To
Select your user name

Expected Result:
(you) will not disappear after selecting own user name
Actual Result:
(you) disappears after selecting own user name
Workaround:
Unknown
Platforms:

Which of our officially supported platforms is this issue occurring on?

[ ] Android: Native
[ ] Android: mWeb Chrome
[ ] iOS: Native
[ ] iOS: mWeb Safari
[x] MacOS: Chrome / Safari
[ ] MacOS: Desktop

Screenshots/Videos
Add any screenshot/video evidence

https://github.com/user-attachments/assets/0d3a4fab-3206-40fa-937f-3c09d3fc5858
View all open jobs on GitHub

We think that this bug might be related to #wave-collect - Release 1

Proposal
Please re-state the problem that we are trying to solve in this issue.
Search filters - (you) disappears after selecting own user name
What is the root cause of that problem?
We are not getting the text from getDisplayName when current user is selected here
https://github.com/Expensify/App/blob/a32da40e1017d2136389f05735bace7bc307e098/src/components/Search/SearchFiltersParticipantsSelector.tsx#L111
What changes do you think we should make in order to solve the problem?

Remove the condition !isCurrentUserSelected
What alternative solutions did you explore? (Optional)

Proposal
Please re-state the problem that we are trying to solve in this issue.
Search filters - (you) disappears after selecting own user name
What is the root cause of that problem?
We are not getting the text from getDisplayName when current user is selected here
https://github.com/Expensify/App/blob/a32da40e1017d2136389f05735bace7bc307e098/src/components/Search/SearchFiltersParticipantsSelector.tsx#L111
What changes do you think we should make in order to solve the problem?

We need to get the text from get getDisplayNameForParticipant when current user is selected
What alternative solutions did you explore? (Optional)

Proposal
Please re-state the problem that we are trying to solve in this issue.
(you) disappears after selecting own user name
What is the root cause of that problem?
When the user selects their account, In getParticipantsOption, we assign assign displayName which is the users name without (you) to text
https://github.com/Expensify/App/blob/d519981587b065ce96f73ab341d84f9eb17a864c/src/libs/OptionsListUtils.ts#L447-L457
And the text prop will be used to render the users display name in InviteMemberListItem component
What changes do you think we should make in order to solve the problem?
Since participant.text has the display name that includes (you) we should assign participant.text to text prop and fallback to displayName if  participant.text is undefiend
text: participant?.text ?? displayName,

What alternative solutions did you explore? (Optional)

Proposal
Please re-state the problem that we are trying to solve in this issue.
Search filters - (you) disappears after selecting own user name
What is the root cause of that problem?
We are properly setting (you) to current user here
https://github.com/Expensify/App/blob/a32da40e1017d2136389f05735bace7bc307e098/src/components/Search/SearchFiltersParticipantsSelector.tsx#L111-L113
but only doing it when current user is not selected
What changes do you think we should make in order to solve the problem?

We should do the same update of text we did here for selected current user too
   const currentUserSelected = formattedResults.section.data.find((option) => option.accountID === chatOptions.currentUserOption?.accountID);

        if (chatOptions.currentUserOption) {
            const formattedName = ReportUtils.getDisplayNameForParticipant(chatOptions.currentUserOption.accountID, false, true, true, personalDetails);
            if (!currentUserSelected) {
                newSections.push({
                    title: '',
                    data: [{...chatOptions.currentUserOption, text: formattedName}],
                    shouldShow: true,
                });
            } else {
                currentUserSelected.text = formattedName;
            }
        }
        newSections.push(formattedResults.section);

What alternative solutions did you explore? (Optional)

Proposal
Please re-state the problem that we are trying to solve in this issue.
The (you) text disappears from the current user option after selecting it.
What is the root cause of that problem?
When the current user is not selected yet, we format the name using getDisplayNameForParticipant and pass shouldAddCurrentUserPostfix as true which adds the (you) suffix.
https://github.com/Expensify/App/blob/c6d81c82fc88d52622c41a958844b2fcc9b1bb33/src/components/Search/SearchFiltersParticipantsSelector.tsx#L111-L115
When the user is selected, the selected options is formatted with OptionsListUtils.formatSectionsFromSearchTerm > getParticipantsOption.
https://github.com/Expensify/App/blob/c6d81c82fc88d52622c41a958844b2fcc9b1bb33/src/components/Search/SearchFiltersParticipantsSelector.tsx#L98-L100
https://github.com/Expensify/App/blob/c6d81c82fc88d52622c41a958844b2fcc9b1bb33/src/libs/OptionsListUtils.ts#L2378
In getParticipantsOption, the text is from PersonalDetailsUtils.getDisplayNameOrDefault whcih doesn't contains the (you) suffix because we don't pass shouldAddCurrentUserPostfix to it.
https://github.com/Expensify/App/blob/c6d81c82fc88d52622c41a958844b2fcc9b1bb33/src/libs/OptionsListUtils.ts#L451
What changes do you think we should make in order to solve the problem?

Pass as true for shouldAddCurrentUserPostfix to getDisplayNameOrDefault.
const displayName = PersonalDetailsUtils.getDisplayNameOrDefault(detail, LocalePhoneNumber.formatPhoneNumber(login), undefined, shouldAddCurrentUserPostfix);

This will require us to pass down the value as true from SearchFiltersParticipantsSelector > formatSectionsFromSearchTerm > getParticipantsOption.

Hi, came back from weekend. Will check in the morning.

@FitseTLT 's proposal here https://github.com/Expensify/App/issues/47712#issuecomment-2299001034 looks good and works well. It aims to fix the issue in the SearchFiltersParticipantsSelector similar to existing approach of showing (you).
🎀 👀 🎀
C+ Reviewed

@abdulrahuman5196 any opinion with my proposal?
I think the selected proposal doesn't follow a similar approach. The approach is mutating the item returned from the array below.
https://github.com/Expensify/App/blob/a32da40e1017d2136389f05735bace7bc307e098/src/components/Search/SearchFiltersParticipantsSelector.tsx#L107
The current approach is, selected options are formatted by OptionsListUtils.formatSectionsFromSearchTerm and then pushed to the list. If the current user isn't selected, we push the current user with (you) suffix to the list. If the user is selected, then it will be handled by OptionsListUtils.formatSectionsFromSearchTerm, just like the other selected items.
Also, the selected proposal will cause the current user to always be at the top even though there are selected items.

Also, the selected proposal will cause the current user to always be at the top even though there are selected items.

@abdulrahuman5196  It's because I moved down the newSections.push(formattedResults.section); below the if block I have updated It works fine now.
We alreay have a code that concatenates (you) the only problem we forgot to do the same for selected list so my approach is indeed using the same as existing approach.
https://github.com/user-attachments/assets/9db1d9d7-e907-4aad-a96b-d03bb69bec33

@bernhardoj

I think the selected proposal doesn't follow a similar approach. The approach is mutating the item returned from the array below.

I noticed that during approval, but its more like a PR code fix.
for the issue you mentioned, we can fix that during PR since we don't consider the proposal code to be the expect PR code.

any opinion with my proposal?
Pass as true for shouldAddCurrentUserPostfix to getDisplayNameOrDefault

I was not aligned in passing shouldAddCurrentUserPostfix as true in the common helper method usecase. Since the default value of shouldAddCurrentUserPostfix in getDisplayNameOrDefault is false and I have also noticed we are not passing it as true in multiple common places.

I was not aligned in passing shouldAddCurrentUserPostfix as true in the common helper method usecase. Since the default value of shouldAddCurrentUserPostfix in getDisplayNameOrDefault is false and I have also noticed we are not passing it as true in multiple common places.

I don't see why this is a problem since we only pass it as true in the filter page just like we did with the non-selected current user section.

I think the selected proposal doesn't follow a similar approach. The approach is mutating the item returned from the array below.

I noticed that during approval, but its more like a PR code fix.

I believe the root issue is that we are not formatting it inside OptionsListUtils.formatSectionsFromSearchTerm (assuming you agree with this), but the selected proposal explanation is revolving around mutating the array and lacks the explanation that we already did some formatting inside OptionsListUtils.formatSectionsFromSearchTerm which is why I posted my proposal because I think the approach is very different.
^ just an explain why I posted my proposal 😄, i'll accept any decision

We have an assignee @MelvinBot

We have an assignee @MelvinBot

PR will be up tomorrow

bump for a review @abdulrahuman5196

It seems like we can close this issue then?

@twisterdotcom PR was raised and was on review; I think Payment is due here.

@twisterdotcom PR was raised and was on review; I think Payment is due here.

Yeah. Same is mentioned in C+ doc as well

Aha, I see.

If a contributor has been hired for a job and we decide to close the job before it is successfully completed, full payment is due for the hired contributor. If the C+ only reviewed proposals and not a PR, they are eligible for 50%. If they started reviewing a PR it's 100%. One caveat here might be if the hired contributor wasn't working on their PR with urgency.

Okay, cool, @abdulrahuman5196 was actively reviewing, so let's do both $250.
Payment Summary:

@FitseTLT paid $250 via Upwork here (Contributor)
@abdulrahuman5196 paid $250 via Newdot requests (C+)

$250 approved for @abdulrahuman5196

authors: FitseTLT JmillsExpensify abdulrahuman5196 bernhardoj etCoderDysto lanitochka17 luacmartins twisterdotcom


text:
Editing Approver offline does not gray out category but grays out Approver for other categories

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Version Number: 9.0.32-1
Reproducible in staging?: Y
Reproducible in production?: N/A - new feature, doesn't exist in prod
If this was caught during regression testing, add the test name, ID and link from TestRail: Exp https://expensify.testrail.io/index.php?/tests/view/4948337
Email or phone of affected tester (no customers): applausetester+kh010901@applause.expensifail.com
Issue reported by: Applause Internal Team
Action Performed:
Precondition:

Rules are enabled.

Go to staging.new.expensify.com
Go to workspace settings > Categories.
Go offline.
Click on any category.
Click Approver.
Add any approver.
Close the RHP.
Note that the edited category is not grayed out.
Open a different category.
Note that Approver field is grayed out when it is not edited.

Expected Result:
In Step 8. the edited category should be grayed out after modifying Approver field offline.
In Step 10, the Approver field for other categories should not gray out when the categories are untouched.
Actual Result:
In Step 8. the edited category is not grayed out after modifying Approver field offline.
In Step 10, the Approver field for other categories is gray out when the categories are untouched.
Workaround:
Unknown
Platforms:

[x] Android: Native
[x] Android: mWeb Chrome
[x] iOS: Native
[x] iOS: mWeb Safari
[x] MacOS: Chrome / Safari
[x] MacOS: Desktop

Screenshots/Videos
https://github.com/user-attachments/assets/6038662c-3db5-4d81-be51-b5c0d5e3ba9c

View all open jobs on GitHub

Might be related to https://github.com/Expensify/App/pull/48171. cc @WojtekBoman @dukenv0307 @marcaaron

@nkdengineer is this a regression from a recent PR?

I'm gonna demote this from being a blocker since it's a minor issue.

In Step 8. the edited category should be grayed out after modifying Approver field offline.

Hmm I don't feel strongly that we need to do this tbh. Feels fine how it is now.

In Step 10, the Approver field for other categories should not gray out when the categories are untouched.

This should be fixed.

Hi! I can fix that as I'm the author of the PR that caused this regression

Nice! Merged

Payment summary:
Contributor+: @eh2077 $250 via NewDot
Please apply/request!

Requested in NewDot

$250 approved for @ntdiary

authors: IuliiaHerets JmillsExpensify WojtekBoman dylanexpensify eh2077 luacmartins marcaaron


text:
Fix OptionRow shouldComponentUpdate

Details
Fixes bad implementation of OptionRow.shouldComponentUpdate (regression caused by https://github.com/Expensify/App/pull/14426/files.
Fixed Issues
$ https://github.com/Expensify/App/issues/14787
Tests

Press CMD+K
Press ArrowDown
Verify that you can use the arrow keys to scroll through and select options as usual.

[ ] Verify that no errors appear in the JS console

Offline tests
None.
QA Steps
Steps listed in https://github.com/Expensify/App/issues/14787. Should also be covered by regression tests.

[ ] Verify that no errors appear in the JS console

PR Author Checklist

[x] I linked the correct issue in the ### Fixed Issues section above
[x] I wrote clear testing steps that cover the changes made in this PR

[x] I added steps for local testing in the Tests section
[x] I added steps for the expected offline behavior in the Offline steps section
[x] I added steps for Staging and/or Production testing in the QA steps section
[x] I added steps to cover failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
[x] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
[x] I tested this PR with a High Traffic account against the staging or production API to ensure there are no regressions (e.g. long loading states that impact usability).

[x] I included screenshots or videos for tests on all platforms
[x] I ran the tests on all platforms & verified they passed on:

[x] Android / native
[x] Android / Chrome
[x] iOS / native
[x] iOS / Safari
[x] MacOS / Chrome / Safari
[x] MacOS / Desktop

[x] I verified there are no console errors (if there's a console error not related to the PR, report it or open an issue for it to be fixed)
[x] I followed proper code patterns (see Reviewing the code)

[x] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick)
[x] I verified that comments were added to code that is not self explanatory
[x] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
[x] I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method

[x] If any non-english text was added/modified, I verified the translation was requested/reviewed in #expensify-open-source and it was approved by an internal Expensify engineer. Link to Slack message:

[x] I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
[x] I verified any copy / text that was added to the app is correct English and approved by marketing by adding the Waiting for Copy label for a copy review on the original GH to get the correct copy.
[x] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
[x] I verified the JSDocs style guidelines (in STYLE.md) were followed

[x] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
[x] I followed the guidelines as stated in the Review Guidelines
[x] I tested other components that can be impacted by my changes (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar are working as expected)
[x] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
[x] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
[x] I verified that if a function's arguments changed that all usages have also been updated correctly
[x] If a new component is created I verified that:

[x] A similar component doesn't exist in the codebase
[x] All props are defined accurately and each prop has a /** comment above it */
[x] The file is named correctly
[x] The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
[x] The only data being stored in the state is data necessary for rendering and nothing else
[x] For Class Components, any internal methods passed to components event handlers are bound to this properly so there are no scoping issues (i.e. for onClick={this.submit} the method this.submit should be bound to this in the constructor)
[x] Any internal methods bound to this are necessary to be bound (i.e. avoid this.submit = this.submit.bind(this); if this.submit is never passed to a component event handler like onClick)
[x] All JSX used for rendering exists in the render method
[x] The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions

[x] If any new file was added I verified that:

[x] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory

[x] If a new CSS style is added I verified that:

[x] A similar style doesn't already exist
[x] The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG)

[x] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
[x] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
[x] If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
[x] I have checked off every checkbox in the PR author checklist, including those that don't apply to this PR.

Screenshots/Videos
Because this is a deploy blocker (#urgency). Screenshots are only shown for web where the issue is most easily demonstrated. This is a small patch that's an obvious mistake in hindsight.

Web
https://user-images.githubusercontent.com/47436092/216558970-6dc785fa-5261-48a4-896e-dec3a09101f3.mov

Mobile Web - Chrome

Mobile Web - Safari

Desktop

iOS

Android

Reviewer Checklist

[ ] I have verified the author checklist is complete (all boxes are checked off).
[ ] I verified the correct issue is linked in the ### Fixed Issues section above
[ ] I verified testing steps are clear and they cover the changes made in this PR

[ ] I verified the steps for local testing are in the Tests section
[ ] I verified the steps for Staging and/or Production testing are in the QA steps section
[ ] I verified the steps cover any possible failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
[ ] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)

[ ] I checked that screenshots or videos are included for tests on all platforms
[ ] I included screenshots or videos for tests on all platforms
[ ] I verified tests pass on all platforms & I tested again on:

[ ] Android / native
[ ] Android / Chrome
[ ] iOS / native
[ ] iOS / Safari
[ ] MacOS / Chrome / Safari
[ ] MacOS / Desktop

[ ] If there are any errors in the console that are unrelated to this PR, I either fixed them (preferred) or linked to where I reported them in Slack
[ ] I verified proper code patterns were followed (see Reviewing the code)

[ ] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick).
[ ] I verified that comments were added to code that is not self explanatory
[ ] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
[ ] I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method
[ ] I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
[ ] I verified any copy / text that was added to the app is correct English and approved by marketing by adding the Waiting for Copy label for a copy review on the original GH to get the correct copy.
[ ] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
[ ] I verified the JSDocs style guidelines (in STYLE.md) were followed

[ ] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
[ ] I verified that this PR follows the guidelines as stated in the Review Guidelines
[ ] I verified other components that can be impacted by these changes have been tested, and I retested again (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar have been tested & I retested again)
[ ] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
[ ] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
[ ] If a new component is created I verified that:

[ ] A similar component doesn't exist in the codebase
[ ] All props are defined accurately and each prop has a /** comment above it */
[ ] The file is named correctly
[ ] The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
[ ] The only data being stored in the state is data necessary for rendering and nothing else
[ ] For Class Components, any internal methods passed to components event handlers are bound to this properly so there are no scoping issues (i.e. for onClick={this.submit} the method this.submit should be bound to this in the constructor)
[ ] Any internal methods bound to this are necessary to be bound (i.e. avoid this.submit = this.submit.bind(this); if this.submit is never passed to a component event handler like onClick)
[ ] All JSX used for rendering exists in the render method
[ ] The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions

[ ] If any new file was added I verified that:

[ ] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory

[ ] If a new CSS style is added I verified that:

[ ] A similar style doesn't already exist
[ ] The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG)

[ ] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
[ ] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
[ ] If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
[ ] I have checked off every checkbox in the PR reviewer checklist, including those that don't apply to this PR.

Screenshots/Videos

Web

Mobile Web - Chrome

Mobile Web - Safari

Desktop

iOS

Android

Well I think this is a small change and in the worst case the option row wont update when the icons change so I will make a follow up on that without CP to let that go in a normal process.

🚀 Cherry-picked to staging by https://github.com/mountiny in version: 1.2.64-5 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

@Expensify/applauseleads please QA this PR and check it off on the deploy checklist if it passes.

🚀 Deployed to production by https://github.com/thienlnam in version: 1.2.64-7 🚀

platform
result

🤖 android 🤖
failure ❌

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
failure ❌

🕸 web 🕸
success ✅

🚀 Deployed to production by https://github.com/thienlnam in version: 1.2.64-7 🚀

platform
result

🤖 android 🤖
failure ❌

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

🚀 Deployed to production by https://github.com/thienlnam in version: 1.2.64-7 🚀

platform
result

🤖 android 🤖
failure ❌

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

🚀 Cherry-picked to staging by https://github.com/AndrewGable in version: 1.3.28-2 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

@Expensify/applauseleads please QA this PR and check it off on the deploy checklist if it passes.

🚀 Deployed to production by https://github.com/AndrewGable in version: 1.3.28-5 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

source: gharchive/pull-request

authors: OSBotify mountiny roryabraham


text:
🍒 Cherry pick PR #15871 to staging 🍒

🍒 Cherry pick https://github.com/Expensify/App/pull/15871 to staging 🍒

🚀 Cherry-picked to staging by https://github.com/OSBotify in version: 1.2.83-1 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

@Expensify/applauseleads please QA this PR and check it off on the deploy checklist if it passes.

🚀 Deployed to production by https://github.com/roryabraham in version: 1.2.83-3 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

🚀 Cherry-picked to staging by https://github.com/AndrewGable in version: 1.3.28-2 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

@Expensify/applauseleads please QA this PR and check it off on the deploy checklist if it passes.

🚀 Deployed to production by https://github.com/AndrewGable in version: 1.3.28-5 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅


text:
Use icon data to determine tool tips for MultipleAvatars

Details

When we get all the icons for a report, every icon is an object that has a key name associated with its login. This is a much more reliable source to match for the tooltips.
Fixed Issues

$ https://github.com/Expensify/App/issues/19091
Tests

(WEB / DESKTOP ONLY)

[ ] Verify that no errors appear in the JS console
[ ] For the following cases of multiple avatars, ensure that tool tips show the correct information in Header, LHN, Report Action etc.

[ ] a DM
[ ] a workspace chat
[ ] a thread (in replies preview and in report header)
[ ] a group chat
[ ] IOU preview
[ ] Archived room

Offline tests

QA Steps

[ ] Verify that no errors appear in the JS console

PR Author Checklist

[x] I linked the correct issue in the ### Fixed Issues section above
[x] I wrote clear testing steps that cover the changes made in this PR

[x] I added steps for local testing in the Tests section
[x] I added steps for the expected offline behavior in the Offline steps section
[x] I added steps for Staging and/or Production testing in the QA steps section
[x] I added steps to cover failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
[x] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
[x] I tested this PR with a High Traffic account against the staging or production API to ensure there are no regressions (e.g. long loading states that impact usability).

[x] I included screenshots or videos for tests on all platforms
[x] I ran the tests on all platforms & verified they passed on:

[x] Android / native
[x] Android / Chrome
[x] iOS / native
[x] iOS / Safari
[x] MacOS / Chrome / Safari
[x] MacOS / Desktop

[x] I verified there are no console errors (if there's a console error not related to the PR, report it or open an issue for it to be fixed)
[x] I followed proper code patterns (see Reviewing the code)

[x] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick)
[x] I verified that the left part of a conditional rendering a React component is a boolean and NOT a string, e.g. myBool && <MyComponent />.
[x] I verified that comments were added to code that is not self explanatory
[x] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
[x] I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method

[x] If any non-english text was added/modified, I verified the translation was requested/reviewed in #expensify-open-source and it was approved by an internal Expensify engineer. Link to Slack message:

[x] I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
[x] I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is approved by marketing by adding the Waiting for Copy label for a copy review on the original GH to get the correct copy.
[x] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
[x] I verified the JSDocs style guidelines (in STYLE.md) were followed

[x] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
[x] I followed the guidelines as stated in the Review Guidelines
[x] I tested other components that can be impacted by my changes (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar are working as expected)
[x] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
[x] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
[x] I verified that if a function's arguments changed that all usages have also been updated correctly
[x] If a new component is created I verified that:

[x] A similar component doesn't exist in the codebase
[x] All props are defined accurately and each prop has a /** comment above it */
[x] The file is named correctly
[x] The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
[x] The only data being stored in the state is data necessary for rendering and nothing else
[x] For Class Components, any internal methods passed to components event handlers are bound to this properly so there are no scoping issues (i.e. for onClick={this.submit} the method this.submit should be bound to this in the constructor)
[x] Any internal methods bound to this are necessary to be bound (i.e. avoid this.submit = this.submit.bind(this); if this.submit is never passed to a component event handler like onClick)
[x] All JSX used for rendering exists in the render method
[x] The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions

[x] If any new file was added I verified that:

[x] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory

[x] If a new CSS style is added I verified that:

[x] A similar style doesn't already exist
[x] The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG))

[x] If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
[x] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
[x] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
[x] If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
[x] If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.
[x] I have checked off every checkbox in the PR author checklist, including those that don't apply to this PR.

Screenshots/Videos

Web

Mobile Web - Chrome

N/A

Mobile Web - Safari

N/A

Desktop

iOS

N/A

Android

N/A

Reviewer Checklist

[X] I have verified the author checklist is complete (all boxes are checked off).
[X] I verified the correct issue is linked in the ### Fixed Issues section above
[X] I verified testing steps are clear and they cover the changes made in this PR

[X] I verified the steps for local testing are in the Tests section
[X] I verified the steps for Staging and/or Production testing are in the QA steps section
[X] I verified the steps cover any possible failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
[X] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)

[X] I checked that screenshots or videos are included for tests on all platforms
[X] I included screenshots or videos for tests on all platforms
[X] I verified tests pass on all platforms & I tested again on:

[X] Android / native
[X] Android / Chrome
[X] iOS / native
[X] iOS / Safari
[X] MacOS / Chrome / Safari
[X] MacOS / Desktop

[X] If there are any errors in the console that are unrelated to this PR, I either fixed them (preferred) or linked to where I reported them in Slack
[ ] I verified proper code patterns were followed (see Reviewing the code)

[X] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick).
[X] I verified that the left part of a conditional rendering a React component is a boolean and NOT a string, e.g. myBool && <MyComponent />.
[X] I verified that comments were added to code that is not self explanatory
[X] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
[X] I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method
[X] I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
[X] I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is approved by marketing by adding the Waiting for Copy label for a copy review on the original GH to get the correct copy.
[X] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
[X] I verified the JSDocs style guidelines (in STYLE.md) were followed

[X] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
[X] I verified that this PR follows the guidelines as stated in the Review Guidelines
[X] I verified other components that can be impacted by these changes have been tested, and I retested again (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar have been tested & I retested again)
[X] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
[X] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
[X] If a new component is created I verified that:

[X] A similar component doesn't exist in the codebase
[X] All props are defined accurately and each prop has a /** comment above it */
[X] The file is named correctly
[X] The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
[X] The only data being stored in the state is data necessary for rendering and nothing else
[X] For Class Components, any internal methods passed to components event handlers are bound to this properly so there are no scoping issues (i.e. for onClick={this.submit} the method this.submit should be bound to this in the constructor)
[X] Any internal methods bound to this are necessary to be bound (i.e. avoid this.submit = this.submit.bind(this); if this.submit is never passed to a component event handler like onClick)
[X] All JSX used for rendering exists in the render method
[X] The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions

[X] If any new file was added I verified that:

[X] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory

[X] If a new CSS style is added I verified that:

[X] A similar style doesn't already exist
[X] The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG)

[X] If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
[X] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
[X] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
[X] If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
[X] If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.
[X] I have checked off every checkbox in the PR reviewer checklist, including those that don't apply to this PR.

Screenshots/Videos

Web

Mobile Web - Chrome

Mobile Web - Safari

Desktop

iOS

Android

@s77rt @tgolen updated a comment, should be ready for final review!

Ah, did you decide to not make these changes for the styles then? https://github.com/Expensify/App/pull/19104#pullrequestreview-1436520238

@tgolen I started to work on those in a separate PR, do you think that they should be done in this PR?

I think a separate PR is OK as long as it gets done 👍

:hand: 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/tgolen in version: 1.3.18-0 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
failure ❌

🕸 web 🕸
success ✅

🚀 Deployed to staging by https://github.com/tgolen in version: 1.3.18-0 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
cancelled 🔪

🕸 web 🕸
success ✅

🚀 Deployed to staging by https://github.com/tgolen in version: 1.3.18-0 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
failure ❌

🕸 web 🕸
success ✅

@grgia Do we need to QA anything here?

@mvtglobally yes, I updated the QA steps

🚀 Deployed to production by https://github.com/yuwenmemon in version: 1.3.18-2 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

authors: OSBotify grgia mvtglobally s77rt tgolen


text:
Revert "Remove all uses of  actorEmail as part of personalDetails migration"

Reverts Expensify/App#21874
Due to https://github.com/Expensify/App/issues/22286#issuecomment-1622255439

This is a revert, not doing the checklist really

Feel free to merge since we got some reviews here already, removing myself!

Did not wait for travis to pass since this is a revert

:hand: 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/iwiznia in version: 1.3.37-2 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

🚀 Deployed to production by https://github.com/Julesssss in version: 1.3.37-7 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
failure ❌

🕸 web 🕸
success ✅

authors: OSBotify PauloGasparSv iwiznia


text:
[CP Staging] Fix user cannot open detail page of chat room

Details

Fix user cannot open detail page of chat room
Fixed Issues
$ https://github.com/Expensify/App/issues/22691
$ https://github.com/Expensify/App/issues/24124
PROPOSAL: https://github.com/Expensify/App/issues/22691#issuecomment-1631954206
Tests

Login with any account
Create a workspace
Go to announce chat
Verify that we can click on header to go to detail page of the chat
Delete the workspace
Go to announce chat again
Verify that we still can click on header to go to detail page of the chat
Create a public room and copy the URL
Logout and go to the public room with the URL
Verify that we can click on header to go to profile page

[x] Verify that no errors appear in the JS console

Offline tests

QA Steps

Login with any account
Create a workspace
Go to announce chat
Verify that we can click on header to go to detail page of the chat
Delete the workspace
Go to announce chat again
Verify that we still can click on header to go to detail page of the chat
Create a public room and copy the URL
Logout and go to the public room with the URL
Verify that we can click on header to go to profile page

[x] Verify that no errors appear in the JS console

PR Author Checklist

[x] I linked the correct issue in the ### Fixed Issues section above
[x] I wrote clear testing steps that cover the changes made in this PR

[x] I added steps for local testing in the Tests section
[x] I added steps for the expected offline behavior in the Offline steps section
[x] I added steps for Staging and/or Production testing in the QA steps section
[x] I added steps to cover failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
[x] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
[x] I tested this PR with a High Traffic account against the staging or production API to ensure there are no regressions (e.g. long loading states that impact usability).

[x] I included screenshots or videos for tests on all platforms
[x] I ran the tests on all platforms & verified they passed on:

[x] Android / native
[x] Android / Chrome
[x] iOS / native
[x] iOS / Safari
[x] MacOS / Chrome / Safari
[x] MacOS / Desktop

[x] I verified there are no console errors (if there's a console error not related to the PR, report it or open an issue for it to be fixed)
[x] I followed proper code patterns (see Reviewing the code)

[x] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick)
[x] I verified that the left part of a conditional rendering a React component is a boolean and NOT a string, e.g. myBool && <MyComponent />.
[x] I verified that comments were added to code that is not self explanatory
[x] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
[x] I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method

[x] If any non-english text was added/modified, I verified the translation was requested/reviewed in #expensify-open-source and it was approved by an internal Expensify engineer. Link to Slack message:

[x] I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
[x] I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is approved by marketing by adding the Waiting for Copy label for a copy review on the original GH to get the correct copy.
[x] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
[x] I verified the JSDocs style guidelines (in STYLE.md) were followed

[x] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
[x] I followed the guidelines as stated in the Review Guidelines
[x] I tested other components that can be impacted by my changes (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar are working as expected)
[x] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
[x] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
[x] I verified that if a function's arguments changed that all usages have also been updated correctly
[x] If a new component is created I verified that:

[x] A similar component doesn't exist in the codebase
[x] All props are defined accurately and each prop has a /** comment above it */
[x] The file is named correctly
[x] The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
[x] The only data being stored in the state is data necessary for rendering and nothing else
[x] If we are not using the full Onyx data that we loaded, I've added the proper selector in order to ensure the component only re-renders when the data it is using changes
[x] For Class Components, any internal methods passed to components event handlers are bound to this properly so there are no scoping issues (i.e. for onClick={this.submit} the method this.submit should be bound to this in the constructor)
[x] Any internal methods bound to this are necessary to be bound (i.e. avoid this.submit = this.submit.bind(this); if this.submit is never passed to a component event handler like onClick)
[x] All JSX used for rendering exists in the render method
[x] The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions

[x] If any new file was added I verified that:

[x] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory

[x] If a new CSS style is added I verified that:

[x] A similar style doesn't already exist
[x] The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(themeColors.componentBG))

[x] If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
[x] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
[x] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
[x] If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
[x] If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.
[x] I have checked off every checkbox in the PR author checklist, including those that don't apply to this PR.

Screenshots/Videos

Web
Screencast from 03-08-2023 19:01:18.webm

Mobile Web - Chrome
https://github.com/Expensify/App/assets/129500732/16f46d0b-45c7-4a54-b7cc-0e38efd4798b

Mobile Web - Safari
https://github.com/Expensify/App/assets/129500732/0ad59ad4-147f-4f3a-a127-accf78a083b2

Desktop
https://github.com/Expensify/App/assets/129500732/d517d2c6-d828-4e49-9433-6d0da1ccb2c3

iOS
https://github.com/Expensify/App/assets/129500732/3e4fb31d-38bf-4470-b1ef-82dbc49ac04a

Android
https://github.com/Expensify/App/assets/129500732/10c965ae-8957-4dce-a479-aa8c518ed31f

Do you have the error with hermes-engine?

@dukenv0307 Nope. Attached the error.

@sobitneupane @dukenv0307 should we continue reviewing this or is there an issue this causes with hermes-engine?

It looks like y'all are discussing issue on the android simulator, right? Can you bring this discussion to Slack (if you haven't already) so more people with the same issues can potentially help / be helped?

🚀 Cherry-picked to staging by https://github.com/Beamanator in version: 1.3.50-2 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

@Expensify/applauseleads please QA this PR and check it off on the deploy checklist if it passes.

🚀 Deployed to production by https://github.com/puneetlath in version: 1.3.50-3 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

🚀 Deployed to staging by https://github.com/Beamanator in version: 1.3.52-0 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

🚀 Deployed to production by https://github.com/puneetlath in version: 1.3.52-5 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

authors: Beamanator OSBotify dukenv0307 sobitneupane


text:
[No QA] Move skip condition if from step to job in Expensify Help deploy workflow

Details
https://expensify.slack.com/archives/C03TQ48KC/p1711382901016869?thread_ts=1710433785.564939&cid=C03TQ48KC
Fixed Issues
$ n/a
Tests
Merge this PR then create a PR from a fork. Verify deployExpensifyHelp doesn't fail.

[x] Verify that no errors appear in the JS console

Offline tests
n/a
QA Steps
None

[ ] Verify that no errors appear in the JS console

PR Author Checklist

[x] I linked the correct issue in the ### Fixed Issues section above
[x] I wrote clear testing steps that cover the changes made in this PR

[x] I added steps for local testing in the Tests section
[x] I added steps for the expected offline behavior in the Offline steps section
[x] I added steps for Staging and/or Production testing in the QA steps section
[x] I added steps to cover failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
[x] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
[x] I tested this PR with a High Traffic account against the staging or production API to ensure there are no regressions (e.g. long loading states that impact usability).

[x] I included screenshots or videos for tests on all platforms
[x] I ran the tests on all platforms & verified they passed on:

[x] Android: Native
[x] Android: mWeb Chrome
[x] iOS: Native
[x] iOS: mWeb Safari
[x] MacOS: Chrome / Safari
[x] MacOS: Desktop

[x] I verified there are no console errors (if there's a console error not related to the PR, report it or open an issue for it to be fixed)
[x] I followed proper code patterns (see Reviewing the code)

[x] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick)
[x] I verified that the left part of a conditional rendering a React component is a boolean and NOT a string, e.g. myBool && <MyComponent />.
[x] I verified that comments were added to code that is not self explanatory
[x] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
[x] I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method

[x] If any non-english text was added/modified, I verified the translation was requested/reviewed in #expensify-open-source and it was approved by an internal Expensify engineer. Link to Slack message:

[x] I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
[x] I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is either coming verbatim from figma or has been approved by marketing (in order to get marketing approval, ask the Bug Zero team member to add the Waiting for copy label to the issue)
[x] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
[x] I verified the JSDocs style guidelines (in STYLE.md) were followed

[x] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
[x] I followed the guidelines as stated in the Review Guidelines
[x] I tested other components that can be impacted by my changes (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar are working as expected)
[x] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
[x] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
[x] I verified that if a function's arguments changed that all usages have also been updated correctly
[x] If any new file was added I verified that:

[x] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory

[x] If a new CSS style is added I verified that:

[x] A similar style doesn't already exist
[x] The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))

[x] If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
[x] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
[x] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
[x] If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
[x] If the PR modifies the UI (e.g. new buttons, new UI components, changing the padding/spacing/sizing, moving components, etc) or modifies the form input styles:

[x] I verified that all the inputs inside a form are aligned with each other.
[x] I added Design label and/or tagged @Expensify/design so the design team can review the changes.

[x] If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
[x] If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.

Screenshots/Videos

Android: Native

Android: mWeb Chrome

iOS: Native

iOS: mWeb Safari

MacOS: Chrome / Safari

MacOS: Desktop

Reviewer Checklist

[ ] I have verified the author checklist is complete (all boxes are checked off).
[ ] I verified the correct issue is linked in the ### Fixed Issues section above
[ ] I verified testing steps are clear and they cover the changes made in this PR

[ ] I verified the steps for local testing are in the Tests section
[ ] I verified the steps for Staging and/or Production testing are in the QA steps section
[ ] I verified the steps cover any possible failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
[ ] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)

[ ] I checked that screenshots or videos are included for tests on all platforms
[ ] I included screenshots or videos for tests on all platforms
[ ] I verified tests pass on all platforms & I tested again on:

[ ] Android: Native
[ ] Android: mWeb Chrome
[ ] iOS: Native
[ ] iOS: mWeb Safari
[ ] MacOS: Chrome / Safari
[ ] MacOS: Desktop

[ ] If there are any errors in the console that are unrelated to this PR, I either fixed them (preferred) or linked to where I reported them in Slack
[ ] I verified proper code patterns were followed (see Reviewing the code)

[ ] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick).
[ ] I verified that the left part of a conditional rendering a React component is a boolean and NOT a string, e.g. myBool && <MyComponent />.
[ ] I verified that comments were added to code that is not self explanatory
[ ] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
[ ] I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method
[ ] I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
[ ] I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is either coming verbatim from figma or has been approved by marketing (in order to get marketing approval, ask the Bug Zero team member to add the Waiting for copy label to the issue)
[ ] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
[ ] I verified the JSDocs style guidelines (in STYLE.md) were followed

[ ] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
[ ] I verified that this PR follows the guidelines as stated in the Review Guidelines
[ ] I verified other components that can be impacted by these changes have been tested, and I retested again (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar have been tested & I retested again)
[ ] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
[ ] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
[ ] If a new component is created I verified that:

[ ] A similar component doesn't exist in the codebase
[ ] All props are defined accurately and each prop has a /** comment above it */
[ ] The file is named correctly
[ ] The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
[ ] The only data being stored in the state is data necessary for rendering and nothing else
[ ] For Class Components, any internal methods passed to components event handlers are bound to this properly so there are no scoping issues (i.e. for onClick={this.submit} the method this.submit should be bound to this in the constructor)
[ ] Any internal methods bound to this are necessary to be bound (i.e. avoid this.submit = this.submit.bind(this); if this.submit is never passed to a component event handler like onClick)
[ ] All JSX used for rendering exists in the render method
[ ] The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions

[ ] If any new file was added I verified that:

[ ] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory

[ ] If a new CSS style is added I verified that:

[ ] A similar style doesn't already exist
[ ] The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(theme.componentBG)

[ ] If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
[ ] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
[ ] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
[ ] If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
[ ] If the PR modifies the UI (e.g. new buttons, new UI components, changing the padding/spacing/sizing, moving components, etc) or modifies the form input styles:

[ ] I verified that all the inputs inside a form are aligned with each other.
[ ] I added Design label and/or tagged @Expensify/design so the design team can review the changes.

[ ] If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
[ ] If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.
[ ] I have checked off every checkbox in the PR reviewer checklist, including those that don't apply to this PR.

Screenshots/Videos

Android: Native

Android: mWeb Chrome

iOS: Native

iOS: mWeb Safari

MacOS: Chrome / Safari

MacOS: Desktop

making WIP while we test a build with changes not from a fork

A preview of your ExpensifyHelp changes have been deployed to https://967d0e5c.helpdot.pages.dev ⚡

I think these tests are most likely failing on main as well...

confirmed, tests are failing on main as well

How's this PR coming along? Can we merge main and get it merged?

Whoa, this is embarrassing ... I have no memory of opening this PR 🙈
let me remember what I was even doing here.

:hand: 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/roryabraham in version: 1.4.65-0 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

🚀 Deployed to production by https://github.com/mountiny in version: 1.4.65-5 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

authors: OSBotify amyevans marcochavezf roryabraham


text:
Fullstory integration Update.

Details

FS Pod dependency updated to 1.48
React-Native FS lib updated to 1.4.2
Video preview, Attachment Preview fs-exclude class added to exclude session recording.
Cleanup redundant fsClass="fs-exclude" and props

Fixed Issues
$ https://github.com/Expensify/App/issues/40910
$ https://github.com/Expensify/App/issues/40784
Tests

Click on the attachment upload menu
Upload an Video via file manager selection
Verify a modal appears displaying a preview of the Video
Upload the Attachment file

[x] Verify that no errors appear in the JS console

Offline tests

QA Steps

Login to the App
Open chat
Click on the attachment upload menu
Upload an Video via file manager selection
Verify a modal appears displaying a preview of the Video
Upload the Attachment file

[x] Verify that app does not crash
[x] Verify that no errors appear in the JS console

PR Author Checklist

[X] I linked the correct issue in the ### Fixed Issues section above
[X] I wrote clear testing steps that cover the changes made in this PR

[X] I added steps for local testing in the Tests section
[x] I added steps for the expected offline behavior in the Offline steps section
[X] I added steps for Staging and/or Production testing in the QA steps section
[x] I added steps to cover failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
[ ] I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
[ ] I tested this PR with a High Traffic account against the staging or production API to ensure there are no regressions (e.g. long loading states that impact usability).

[X] I included screenshots or videos for tests on all platforms
[ ] I ran the tests on all platforms & verified they passed on:

[X] Android: Native
[ ] Android: mWeb Chrome
[X] iOS: Native
[ ] iOS: mWeb Safari
[X] MacOS: Chrome / Safari
[X] MacOS: Desktop

[X] I verified there are no console errors (if there's a console error not related to the PR, report it or open an issue for it to be fixed)
[X] I followed proper code patterns (see Reviewing the code)

[X] I verified that any callback methods that were added or modified are named for what the method does and never what callback they handle (i.e. toggleReport and not onIconClick)
[X] I verified that the left part of a conditional rendering a React component is a boolean and NOT a string, e.g. myBool && <MyComponent />.
[X] I verified that comments were added to code that is not self explanatory
[X] I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
[] I verified any copy / text shown in the product is localized by adding it to src/languages/* files and using the translation method

[ ] If any non-english text was added/modified, I verified the translation was requested/reviewed in #expensify-open-source and it was approved by an internal Expensify engineer. Link to Slack message:

[ ] I verified all numbers, amounts, dates and phone numbers shown in the product are using the localization methods
[ ] I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is either coming verbatim from figma or has been approved by marketing (in order to get marketing approval, ask the Bug Zero team member to add the Waiting for copy label to the issue)
[X] I verified proper file naming conventions were followed for any new files or renamed files. All non-platform specific files are named after what they export and are not named "index.js". All platform-specific files are named for the platform the code supports as outlined in the README.
[ ] I verified the JSDocs style guidelines (in STYLE.md) were followed

[ ] If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
[ ] I followed the guidelines as stated in the Review Guidelines
[X] I tested other components that can be impacted by my changes (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar are working as expected)
[X ] I verified all code is DRY (the PR doesn't include any logic written more than once, with the exception of tests)
[X] I verified any variables that can be defined as constants (ie. in CONST.js or at the top of the file that uses the constant) are defined as such
[X] I verified that if a function's arguments changed that all usages have also been updated correctly
[ ] If any new file was added I verified that:

[ ] The file has a description of what it does and/or why is needed at the top of the file if the code is not self explanatory

[ ] If a new CSS style is added I verified that:

[ ] A similar style doesn't already exist
[ ] The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))

[ ] If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
[X] If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
[ ] If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
[ ] If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
[ ] If the PR modifies the UI (e.g. new buttons, new UI components, changing the padding/spacing/sizing, moving components, etc) or modifies the form input styles:

[ ] I verified that all the inputs inside a form are aligned with each other.
[ ] I added Design label and/or tagged @Expensify/design so the design team can review the changes.

[ ] If a new page is added, I verified it's using the ScrollView component to make it scrollable when more elements are added to the page.
[x] If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.

Screenshots/Videos

Android: Native
https://drive.google.com/file/d/1EQRkfkWRo5Gm8uBQ_nSJg-h5XqDBJwqB/view?usp=drive_link

iOS: Native
https://drive.google.com/file/d/1R3ALatTtvHBW-E0x4PqhbcUrVv70s1UC/view?usp=drive_link

MacOS: Chrome / Safari
https://drive.google.com/file/d/1pK0UacdVlrCWuSCSLpsrGs7rHsjiGu-N/view?usp=drive_link

MacOS: Desktop
https://drive.google.com/file/d/1m2DdKWPDjrY7HAVVhHeRLZNhgmGlSVAq/view?usp=drive_link

@alitoshmatov , removing you from this one since @ishpaul777 was already assigned to the original issue!

@LCOleksii can you please apply this PR on top of yours? https://github.com/Expensify/App/pull/40807/files
We've implemented the user metadata keys, so now you can use those to map everything instead of the session key. That was reverted with the other changes.

Looks like we're still missing this:

can you please apply this PR on top of yours? https://github.com/Expensify/App/pull/40807/files

@ishpaul777 theres one more commit incoming, so please wait until that's done!

Hi @ishpaul777
Cannot reproduce the issue, also prior last commit push i have checked locally.
Please Insure that you had:

Had clean the project ('npm run clean') + node_modules remove (to be sure no cache issues, we had similar issues that could be fixed only after proper clean, especially if you are switching between the branches)
Reinstalled all the pods for IOs build
Deleted previous build from the IOs simulator
Build the new version from the branch

Please see the latest recording:
Simulator Screen Recording - iPhone 15 Plus - 2024-05-20 at 22.37.25

If after this the issue still persist, please could you provide full crash log for investigation.

Attachment - Corrupted pdf can be uploaded without error
Version Number: v1.4.74-4
Reproducible in staging?: n
Reproducible in production?: n
Action Performed:

Launch New Expensify app.
Go to any chat.
Go to + > Add attachment > Choose document.
Select a corrupted pdf file (attached below).
Upload the corrupted file.

Expected Result:
In Step 4, the preview will show "Failed to load PDF file" (production behavior).
In Step 5, the corrupted file will not be uploaded and shows "Failed to load PDF file" (production behavior).
Actual Result:
In Step 4, the preview shows filename.pdf.
In Step 5, the corrupted file is uploaded successfully.
Workaround:
n/a
Platforms:

Which of our officially supported platforms is this issue occurring on?

[ ] Android: Native
[ ] iOS: Native

Screenshots/Videos
Add any screenshot/video evidence
https://github.com/Expensify/App/assets/93399543/f611b5c0-2b17-4e66-997e-ccfae13853bd
https://github.com/Expensify/App/assets/93399543/934cd551-51a5-4b02-b211-17cf03ce6f92

@ishpaul777 I've done a few other changes, can you please recheck/approve? this will only affect loading the fullstory lib in production, so you don't need to do all tests again

🚀 Cherry-picked to staging by https://github.com/puneetlath in version: 1.4.76-1 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

@Expensify/applauseleads please QA this PR and check it off on the deploy checklist if it passes.

🚀 Deployed to production by https://github.com/Beamanator in version: 1.4.76-7 🚀

platform
result

🤖 android 🤖
success ✅

🖥 desktop 🖥
success ✅

🍎 iOS 🍎
success ✅

🕸 web 🕸
success ✅

authors: LCOleksii OSBotify danieldoglas kbecciv