openedx / openedx/frontend-app-authoring
Remove Higher Order Components from Editors
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 17
- Forks
- 218
- Avg merge
- 9d 20h
- Merged PRs (30d)
- 20
Description
In src/editors/...
- Replace
injectIntlwithuseIntl()-> https://github.com/openedx/frontend-app-authoring/issues/2280 - Replace usage of
connectwithuseSelector()anduseDispatch()-> https://github.com/openedx/frontend-app-authoring/issues/2312 - Update the code and tests to get rid of the
Internalexport pattern:
Example of exporting(Component)InternalandComponent = injectIntl(connect(...))HOCs, then testing with theInternalone.
Once the HOCs (injectIntl, connect) are replaced with hooks, if it's necessary to mock redux state in tests, convert the tests to use initializeMocks from src/testUtils.tsx and pass in initialState to initializeMocks. Or use const { reduxStore } = initializeMocks(); and dispatch changes to the redux store.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reviewing src/editors/ and the AnswerOption.jsx and AnswerOption.test.jsx examples, then read src/testUtils.tsx and the linked injectIntl and connect issues. Update the editor code and tests to use hooks and remove the Internal export pattern; use initializeMocks when tests need Redux state. Done means the listed HOCs and Internal exports are no longer needed.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, redux, typescript
- Domain
- frontend, testing
- Issue type
- Refactor
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100