Ensure consuming projects install @edx/brand as the @edx/brand-openedx package by default

[adamstankiewicz]

There was a recent question posed in the Open edX frontend working group Slack channel:

The gradebook upstream repo https://github.com/openedx/frontend-app-gradebook depends on the edx.org branding package (https://github.com/edx/brand-edx.org). Can this be used without problem, even if it does not depend on the package: https://github.com/openedx/brand-openedx?

The reporter mentioned their colleague went through all MFEs and noticed the only MFE without the brand-openedx package installed by default is frontend-app-gradebook.

At a higher level, many 2U/edX engineers who work on MFEs only want to run their apps using the brand-edx.org theme so their local environment matches what they will see on stage/production. To do this, consumers often install @edx/brand-edx.org as the default theme, and forget to change it back to the default, open-source friendly @edx/brand-openedx theme before committing/pushing.

In theory, we may also be able to encourage consumers to override the @edx/brand package via module.config.js instead. We should check to see whether module.config.js works with @edx/brand overrides, too.

It's also worth mentioning some MFEs get around this by defining install-theme, start:with-theme, and build:with-theme NPM scripts that overrides the default @edx/brand package via a custom brand package through the THEME environment variable (source). This solution as implemented still hardcodes @edx/brand-edx.org as the custom theme, though, which is not ideal.

I believe we could adapt these install-theme, start:with-theme, build:with-theme NPM scripts to be more generic and avoid hardcoding @edx/brand-edx.org anywhere in the repos by relying on consuming to pass THEME="@edx/brand-edx.org" themselves when running npm run start:with-theme or npm run build:with-theme (e.g., THEME="@edx/brand-edx.org" npm run start:with-theme.

Acceptance Criteria

Beta Give feedback

1. Consider whether there's a possible technical solution that would allow consumers of the Paragon and @edx/brand packages to run the MFE locally with a custom @edx/brand package installed (e.g., @edx/brand-edx.org).
2. If a technical solution to allow consumers to run/build their MFEs during local development without modifying the default installed @edx/brand-openedx package, standardize on this format across all consuming projects where relevant.
3. Consider whether this could be a command as part of a Paragon CLI tool (e.g., Discovery: Paragon CLI/Migrator #2242), where no manual modifications would be needed to repos?

[monteri]

#2460 Here is Paragon-CLI solution

[viktorrusakov]

We decided to implement this via CLI command and adding npm script to the consuming MFE, the progress is tracked in #2831