[HOLD for payment 2022-11-04] [$250] Bug: No focus indicator at edit composer reported by @Puneet-here

[kavimuru]

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 any chat > Send a message
2. Edit

Expected Result:

There should be a focus indicator (blue border) like our all other fields

Actual Result:

There's no focus indicator

Workaround:

unknown

Platform:

Where is this issue occurring?

• Web
• iOS
• Android
• Desktop App
• Mobile Web

Version Number: 1.2.12-3
Reproducible in staging?: y
Reproducible in production?: y
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos:

Recording.670.mp4

Expensify/Expensify Issue URL:
Issue reported by: @Puneet-here
Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1665499439983919

View all open jobs on GitHub

[melvin-bot]

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

[Puneet-here]

Proposal

We need to add a state "isFocused" we will set it to true at onFocus and false at onBlur prop of Composer

App/src/pages/home/report/ReportActionItemMessageEdit.js

Lines 203 to 212 in 757fb5e

	onFocus={() => {
	ReportScrollManager.scrollToIndex({animated: true, index: this.props.index}, true);
	toggleReportActionComposeView(false, VirtualKeyboard.shouldAssumeIsOpen());
	}}
	onBlur={(event) => {
	// Return to prevent re-render when save/cancel button is pressed which cancels the onPress event by re-rendering
	if (_.contains([this.saveButtonID, this.cancelButtonID], lodashGet(event, 'nativeEvent.relatedTarget.id'))) {
	return;
	}

we need to use isFocused like below to change border color
this.state.isFocused ? styles.chatItemComposeBoxFocusedColor : styles.chatItemComposeBoxColor

App/src/pages/home/report/ReportActionItemMessageEdit.js

Line 191 in 2f7f5ea

<View style={[styles.chatItemComposeBox, styles.flexRow, styles.chatItemComposeBoxColor]}>

[melvin-bot]

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

[melvin-bot]

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

[pecanoro]

I think this has worked this way forever so I am not sure if it's worth fixing it, but I am going to reach out to the rest of the team and I will come back to export it or close it.

[pecanoro]

Ok, we agreed we should fix it, so assigning external1

[melvin-bot]

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

[melvin-bot]

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

[melvin-bot]

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

[parasharrajat]

@Puneet-here 's proposal looks good to me.

cc: @ctkochan22

🎀 👀 🎀 C+ reviewed

[ctkochan22]

Looks good @jliexpensify lets hire @Puneet-here

[jayeshmangwani]

@kavimuru I reported this 3 months ago, can you please check this once?

[jliexpensify]

@parasharrajat - I think you could make a call here, but it feels like @jayeshmangwani should get the Reporting fee, and @Puneet-here should get the PR fee.

[parasharrajat]

Seems so.

[Puneet-here]

Yes, It's fine by me, since it was a dupe.

[jliexpensify]

Posted:

• Internal https://www.upwork.com/ab/applicants/1582854050876055552/job-details
• External https://www.upwork.com/jobs/~01fa637bc66f289807

Everyone has been invited, thanks!

[melvin-bot]

📣 @Puneet-here You have been assigned to this job by @jliexpensify!
Please apply to this job in Upwork and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[Puneet-here]

Sorry for the delay. I was waiting for my another PR to get merged so that we don't get conflicts. I have raised the PR now.

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.2.20-3 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Add focus indicator for edit composer #12095

If no regressions arise, payment will be issued on 2022-11-04. 🎊

[ctkochan22]

Not overdue

[jliexpensify]

Good to pay, please accept your offers. @parasharrajat also, please accept the invite, cheers!

[jliexpensify]

Paid Puneet and Jayesh (+ contracts ended), will close once Rajat has accepted and is paid.

[parasharrajat]

@jliexpensify Done.

[jliexpensify]

All done and job closed. Thanks everyone!