[HOLD for payment 2023-06-21] [$250] Migrate ReportTypingIndicator.js to function component

[marcaaron]

Class Component Migration

Filenames

• src/pages/home/report/ReportTypingIndicator.js
  • type: React.Component
  • has state values: true
  • has refs: false
  • has context: false
  • lifecycle methods: componentDidUpdate

Task

• We currently have some class components in our codebase that we would like to refactor to a function component.
• Here's a link with some general advice on how to refactor a class component to a function component: https://react.dev/reference/react/Component#alternatives
• If you need additional guidance, please ask in #expensify-open-source
• Test for any regressions and verify that there are no breaking changes

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~017bb70fdccbb440b5
• Upwork Job ID: 1664734515678191616
• Last Price Increase: 2023-06-02

[marcaaron]

@danieldoglas taking this issue off HOLD as per this Slack post

IMPORTANT: If anything unexpected pops up during the refactor/review:

• Take it to #expensify-open-source to get clarification on.
• Prefix the conversation with [HOOK REFACTOR] so that we can find it easily.
• Link the result of the conversation in this section of the Design Doc titled “Best Practices Conversations”
• Add it to the STYLE.md guide in this open PR so we can reference it and apply any teachings in the next phase

[MelvinBot]

⚠️ Could not update price automatically because there is no linked Upwork Job ID. The BZ team member will need to update the price manually in Upwork.

[marcaaron]

Heads up! The pricing for this issue has been adjusted based on the scope of the work and the fact that no complex bug investigations or proposal are required.

[danieldoglas]

I'll actually unassign this one from me and leave it open for when we reach external people.

[melvin-bot]

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

[melvin-bot]

Triggered auto assignment to @miljakljajic (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 - @eVoloshchak (External)

[melvin-bot]

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

[jayeshmangwani]

I would like to take this

[chychkoi]

I'd like to work on this issue

[Vishrut19]

I would like to work on it.

[jaybarnes33]

Title: Migrate ReportTypingIndicator.js to function component

Problem: ReportTypingIndicator.js was written as a class component and hence not in accordance with latest react conventions.

Suggested Solution: Rewrite ReportTypingIndicator.js as a functional component so that we are up to date with latest react conventions and also to be able to use hooks.

[MahmudjonToraqulov]

I would like to take this

[melvin-bot]

📣 @achmadk! 📣
Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
Please follow these steps:

1. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
2. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
3. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.
   
   Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

[achmadk]

Contributor details
Your Expensify account email: achmad.kurnianto@gmail.com
Upwork Profile Link: https://www.upwork.com/freelancers/~01f7ee376ef5018bba

[melvin-bot]

✅ Contributor details stored successfully. Thank you for contributing to Expensify!

[hayata-suenaga]

@eVoloshchak I think the first one who posts a comment is picked for migration issues

[eVoloshchak]

@hayata-suenaga, agree, for the issues where the investigation isn't needed and the scope of work is clearly defined - whoever posts the comment first is assigned to the issue seems like the logical approach, so let's proceed with @jayeshmangwani's proposal

[melvin-bot]

📣 @jayeshmangwani You have been assigned to this job by @hayata-suenaga!
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 📖

[achmadk]

Thanks for the wise consideration, @eVoloshchak @hayata-suenaga. Maybe I can contribute to the Expensify app in another issue.

@jayeshmangwani, please do your best!

[jayeshmangwani]

PR is ready for review
cc: @hayata-suenaga @eVoloshchak

[melvin-bot]

@eVoloshchak, @miljakljajic, @jayeshmangwani, @hayata-suenaga Whoops! This issue is 2 days overdue. Let's get this updated quick!

[eVoloshchak]

Not overdue, this was deployed to staging 2 days ago

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

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

• Feat: migrate report typing indicator to functional component #20339

If no regressions arise, payment will be issued on 2023-06-21. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[miljakljajic]

Just to confirm - will @eVoloshchak and @jayeshmangwani be owed 250 USD each for this issue? I will send out the offers today so we're ready to pay on the 21st.

[hayata-suenaga]

@miljakljajic I found a slack comment by Marc on contributor compensation being $250

[miljakljajic]

I'll issue payment today!

[miljakljajic]

contracts extended @jayeshmangwani and @eVoloshchak

[miljakljajic]

Paid, contracts ended.