[HOLD for payment 2022-10-31] [$250] Chat - Composer goes to the top on pressing expand @thesahindia

[kbecciv]

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:

1. Go to staging.new.expensify.com
2. Navigate to any chat
3. Add few lines and press expand button at the left corner

Expected Result:

The composer should expand and shouldn't move

Actual Result:

The composer goes to the top

Workaround:

Unknown

Platform:

Where is this issue occurring?

• Web
• Desktop App
• Mobile Web/safari

Version Number: 1.2.9.0

Reproducible in staging?: Yes

Reproducible in production?: Yes

Email or phone of affected tester (no customers): any

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

Screenrecording_20220926_182030.mp4

Expensify/Expensify Issue URL:

Issue reported by: @thesahindia

Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1664196729312989

View all open jobs on GitHub

[melvin-bot]

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

[Puneet-here]

Proposal

It is happening because the ReportActionCompose is wrapped by OfflineWithFeedback

App/src/pages/home/ReportScreen.js

Lines 290 to 296 in b058975

	<OfflineWithFeedback
	pendingAction={addWorkspaceRoomPendingAction}
	>
	<ReportActionCompose
	onSubmit={this.onSubmitComment}
	reportID={reportID}
	reportActions={this.props.reportActions}

To solve it we need to use style.h100 for the View at 90 and 92
We can pass styles for the first View using style but we will have to add another prop to pass style to 92 or we can just use styles.h100 or styles.flex1 because it's not breaking anything.

App/src/components/OfflineWithFeedback.js

Lines 90 to 94 in b058975

	<View style={props.style}>
	{!hideChildren && (
	<View style={needsOpacity ? styles.offlineFeedback.pending : {}}>
	{children}
	</View>

[melvin-bot]

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

[amyevans]

Reproducible, releasing to External. A reminder @Puneet-here that you need to wait for the Help wanted label before submitting proposals, thanks! 😄

[melvin-bot]

Current assignee @laurenreidexpensify is eligible for the External assigner, not assigning anyone new.

[melvin-bot]

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