Feat course optimizer page

[jesperhodge]

Description

Course Optimizer Page.
Depends on openedx/edx-platform#35887 - test together.

This is a draft. What's missing:

• Some Cleanup
• Tests

[bradenmacdonald]

Is there a reason for putting this in the Redux state and for implementing all this new code as JavaScript instead of TypeScript? I would really prefer that all net-new modules be using TypeScript, React Context, and React Query instead of JS and Redux, as recommended in OEP-67.

Is there something more I can do to raise awareness of this?

[bradenmacdonald]

Please use useIntl instead of injectIntl. If you use VS Code there should be a visual reminder of this:

let me know if not.

[bradenmacdonald]

Don't use defaultProps - it's deprecated.

[bradenmacdonald]

I strongly prefer TypeScript types over propTypes, because TypeScript types get checked by CI whereas propTypes warnings are routinely ignored. Open up the JS console on any authoring MFE page in your browser, and you'll see the problem.

[bradenmacdonald]

Instead of all this boilerplate, you can just use

const { axiosMock } = initializeMocks();

as the first line of each test case. You can then remove the beforeEach and afterEach you have here, because initializeMocks takes care of that all for you, including jest.clearAllMocks();.

See

frontend-app-authoring/src/testUtils.tsx

Lines 152 to 162 in f86c609

	/**
	* Initialize common mocks that many of our React components will require.
	*
	* This should be called within each test case, or in `beforeEach()`.
	*
	* Returns the new `axiosMock` in case you need to mock out axios requests.
	*/
	export function initializeMocks({ user = defaultUser, initialState = undefined }: {
	user?: { userId: number, username: string },
	initialState?: Record<string, any>, // TODO: proper typing for our redux state
	} = {}) {