App: [$500] Create an ESLint rule to detect multiple uses of withOnyx
Problem
When withOnyx is used multiple times while composing components, it adds overhead to what Onyx has to keep track of and also prevents optimizations like batched render updates from working to their full potential.
Solution
Create a custom ESLint in https://github.com/Expensify/eslint-config-expensify/tree/main/eslint-plugin-expensify which detects when withOnyx() is used multiple times in the same file, and throws an error. The error should give instructions on the best practices which is something like:
Only use withOnyx() once. If there are dependent Onyx keys, they can all be handled in a single instance of withOnyx through the use of selectors.
That should also link to the Onyx readme, and I’m going to write a specific section in there about the best practice that we can link to.
Upwork Automation - Do Not Edit
- Upwork Job URL: https://www.upwork.com/jobs/~01f185d4f92edd4f6c
- Upwork Job ID: 1702383017796775936
- Last Price Increase: 2023-09-14
- Automatic offers:
- mollfpr | Reviewer | 26743007
- studentofcoding | Contributor | 26743012
About this issue
- Original URL
- State: closed
- Created 10 months ago
- Comments: 33 (25 by maintainers)
Contributor: @studentofcoding paid $750 via Upwork, includes 50% urgency bonus Contributor+: @mollfpr is due $750. Unsure if paying via Upwork or NewDot yet, will know next week.
@mollfpr I actually like @studentofcoding’s proposal better because the program exit thing seems like a good idea, and more importantly he used the correct error message mentioned in the issue.
In the interest of speed I’m going to hire him now, hopefully everyone feels good about this.
I was really only thinking of targeting multiple
withOnyxin the compose function (the first example).I didn’t consider about the second example, but I am guessing we don’t have very many HOCs that use
withOnyx(). It’s probably fine for now. I think ofwithPolicymore like it’s own component, just like any other component.