refactor: replacement of injectIntl with useIntl part 1 #1635
Conversation
jacobo-dominguez-wgu
added
the
mao-onboarding
jacobo-dominguez-wgu
changed the title
openedx-webhooks
added
the
open-source-contribution
|
Thanks for the pull request, @jacobo-dominguez-wgu! This repository is currently maintained by Once you've gone through the following steps feel free to tag them in a comment and let them know that your changes are ready for engineering review. 🔘 Get product approvalIf you haven't already, check this list to see if your contribution needs to go through the product review process.
🔘 Provide contextTo help your reviewers and other members of the community understand the purpose and larger context of your changes, feel free to add as much of the following information to the PR description as you can:
🔘 Get a green buildIf one or more checks are failing, continue working on your changes until this is no longer the case and your build turns green. Where can I find more information?If you'd like to get more details on all aspects of the review process for open source pull requests (OSPRs), check out the following resources: When can I expect my changes to be merged?Our goal is to get community contributions seen and reviewed as efficiently as possible. However, the amount of time that it takes to review and merge a PR can vary significantly based on factors such as:
💡 As a result it may take up to several weeks or months to complete a review and merge your PR. |
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## master #1635 +/- ##
==========================================
- Coverage 87.10% 87.10% -0.01%
==========================================
Files 780 780
Lines 17765 17759 -6
Branches 3636 3635 -1
==========================================
- Hits 15475 15469 -6
Misses 2226 2226
Partials 64 64 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
There was a problem hiding this comment.
To the future reviewer, to facilitate validation of these changes, you can run the script to extract the fields from i18n
See
frontend-app-admin-portal/package.json
Line 14 in 3c9502e
npm run extract_i18n
It is a bit out of the scope, but I created an issue #1651 to achieve this shortly. |
…X/frontend-app-admin-portal into intl-modernization-1
…X/frontend-app-admin-portal into intl-modernization-1
…X/frontend-app-admin-portal into intl-modernization-1
|
Hi @brian-smith-tcril, could you take a look at this please? |
| if (searchQuery !== prevSearchQuery || searchCourseQuery !== prevSearchCourseQuery | ||
| || searchDateQuery !== prevSearchDateQuery || searchBudgetQuery !== prevSearchBudgetQuery | ||
| || searchGroupQuery !== prevSearchGroupQuery) { | ||
| this.handleSearch(); | ||
| } |
There was a problem hiding this comment.
Have you tested that this still works? It looks like this was calling handleSearch whenever any of the queries changed, but I only see a useEffect for searchEnrollmentsList.
There was a problem hiding this comment.
You are right, I updated the useEffect to behave like the componentDidUpdate.
There was a problem hiding this comment.
Interesting, I hadn't made it far enough down to see that there is an AdminSearchForm in the Admin directory and the AdminV2 directory. Do you know if both are being used?
There was a problem hiding this comment.
The files from both directories Admin and AdminV2 are being used in an AdminPage and AdminPageV2, but the AdminPage with the components from Admin directory is not being used anywhere in the repo. So It looks like the files inside Admin directory are deprecated.
There was a problem hiding this comment.
@kiram15 can you provide some more context here? It looks like there's been recent activity on some components in both the Admin and AdminV2 directories, but only AdminPageV2 is being used.
I think instead of updating unused components, it likely makes more sense to remove AdminPage and any components that are only used by AdminPage, and then only handle the injectIntl -> useIntl in the components that are still in use.
There was a problem hiding this comment.
Ok that make sense, I will wait on @kiram15 confirmation before proceeding.
There was a problem hiding this comment.
Yes I think removing the AdminPage and all related components are good! I will make sure that all the changes pushed related to it are mimicked in the AdminV2 directory!
…X/frontend-app-admin-portal into intl-modernization-1
…-admin-portal into intl-modernization-1
|
The admin v1 files were removed on this pr. Now this one is clean and ready for another review @brian-smith-tcril @kiram15 |
| const isFirstRender = useRef(true); | ||
|
|
||
| if (searchQuery !== prevSearchQuery || searchCourseQuery !== prevSearchCourseQuery | ||
| || searchDateQuery !== prevSearchDateQuery || searchBudgetQuery !== prevSearchBudgetQuery | ||
| || searchGroupQuery !== prevSearchGroupQuery) { | ||
| this.handleSearch(); | ||
| useEffect(() => { | ||
| if (isFirstRender.current) { | ||
| isFirstRender.current = false; | ||
| return; | ||
| } | ||
| } | ||
|
|
||
| handleSearch() { | ||
| this.props.searchEnrollmentsList(); | ||
| } | ||
| searchEnrollmentsList(); | ||
| }, [searchEnrollmentsList, searchQuery, searchCourseQuery, searchDateQuery, searchBudgetQuery, searchGroupQuery]); |
There was a problem hiding this comment.
I assume the isFirstRender logic is here because according to the react docs:
This method is not called for the initial render.
This solution makes sense, and matches a decently well upvoted stackoverflow answer.
I am curious as to how this behaves without the isFirstRender check. Did you encounter issues In your testing when that check wasn't there?
There was a problem hiding this comment.
Hi @brian-smith-tcril, yes the isFirstRender logic is intended to mimic the behavior on componentDidUpdate to not be called in the first render.
Without the isFirstRender check, it does not represent significant changes from the user perspective on the UI, but the searchEnrollmentsList() method was being executed more than once on first load causing some unit tests to fail, and I was trying to imitate as much as possible the behavior as it was before with the componentDidUpdate and class component.
There was a problem hiding this comment.
LGTM!
@kiram15 - I'm going to hold off on merging this for now so can have a chance to look at it if you'd like.
|
Just following up in here @brian-smith-tcril @kiram15. |
Description
As part of Unit test improvement project, we replace all usages of the deprecated injectIntl HOC with the useIntl() hook from @edx/frontend-platform/i18n.
Closes #1591.
Class components were refactored into functional components in order to use the useIntl hook, and some unit tests related to them were modified to make them pass.
For all changes
Only if submitting a visual change