Triggered auto assignment to @bfitzexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

Proposal

Please re-state the problem that we are trying to solve in this issue.

Onboarding - Onboarding modal closes for manage expenses when arriving on accounting modal

What is the root cause of that problem?

The overlap issue occurs due to missing safe area padding, which causes the UI to clash with system controls on Android.

What changes do you think we should make in order to solve the problem?

We can wrap this code with ScreenWrapper and add includeSafeAreaPaddingBottom

        return (
            <>
                <ScreenWrapper
                    includeSafeAreaPaddingBottom={true}
                    testID={AttachmentView.displayName}
                >
                    <View style={styles.imageModalImageCenterContainer}>
                        <AttachmentViewImage
                            url={imageSource}
                            file={file}
                            isAuthTokenRequired={isAuthTokenRequired}
                            loadComplete={loadComplete}
                            isImage={isFileImage}
                            onPress={onPress}
                            onError={() => {
                                if (isOffline) {
                                    return;
                                }
                                setImageError(true);
                            }}
                        />
                    </View>
                    {isHighResolution && <HighResolutionInfo isUploaded={isUploaded} />}
                </ScreenWrapper>
            </>
        );

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

POC

Proposal

Please re-state the problem that we are trying to solve in this issue.

"This image has been resized" message overlaps with Android controls

What is the root cause of that problem?

We don't have a safe area padding bottom for HighResolutionInfo then it's overlapped with the Android controls

What changes do you think we should make in order to solve the problem?

We need to get the safe area padding-bottom and add a wrap View to HighResolutionInfo with this padding-bottom

const insets = useSafeAreaInsets();
<View style={{paddingBottom: StyleUtils.getSafeAreaPadding(insets).paddingBottom}}>{isHighResolution && <HighResolutionInfo isUploaded={isUploaded} />}</View>

Note: we should only apply padding-bottom style with the HighResolutionInfo to not break the image view with other normal images

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

Job added to Upwork: https://www.upwork.com/jobs/~021867655181903495230

Triggered auto assignment to Contributor-plus team member for initial proposal review - @allgandalf (External)

I will review today

testing the proposals....

@bfitzexpensify, @allgandalf Whoops! This issue is 2 days overdue. Let's get this updated quick!

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

Will review today

@bfitzexpensify @allgandalf this issue was created 2 weeks ago. Are we close to approving a proposal? If not, what's blocking us from getting this issue assigned? Don't hesitate to create a thread in #expensify-open-source to align faster in real time. Thanks!

@bfitzexpensify, @allgandalf Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸