refactor: migrate to frontend-base by arbrandes · Pull Request #1512 · openedx/frontend-app-authn

arbrandes · 2025-06-24T18:57:47Z

Description

Refer to the parent issue for a full description.

In short, this refactors the codebase for frontend-base support. There are several breaking changes. It is a long-lived feature branch, and as such, should not be rebased or squashed until time comes for it to either merge to master or become master.

BREAKING CHANGE: refactors the MFE for frontend-base.

arbrandes · 2025-06-26T13:29:08Z

  it('renders Image layout when ENABLE_IMAGE_LAYOUT configuration is enabled', () => {
-    mergeConfig({
-      ENABLE_IMAGE_LAYOUT: true,
+    mergeSiteConfig({


Suggested change

mergeSiteConfig({

mergeAppConfig(testAppId, {

arbrandes · 2025-06-26T13:30:21Z

+      {
+        path: '*',
+        element: (
+          <Navigate replace to={PAGE_NOT_FOUND} />
+        ),
+      }


Probably not a good idea having an app with a catch-all. This should be handled by the shell. (Thanks @bradenmacdonald for catching this.)

The only purpose of the included index.html is to serve the dev environment, so modify it to make that clear.

Apps should avoid having a catch-all route, instead relying on the shell to provide it.

Update package.json for publication as a "buildless" library. (Also upgrade openedx-atlas.)

feat: Prepare for publication to NPM

Now we have a way to discover app URLs dynamically; do so for the (default) redirect on login.

Bump frontend-base to alpha.4 to fix a bug with the route role redirection mechanism.

Bump frontend-base to avoid the inotify handle resource starvation.

BREAKING CHANGE: Pre-design-tokens theming is no longer supported.

It was being called on every data sync effect run, causing a flash of PENDING state even when TPA data was already available. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

In ProgressiveProfiling, the TPA query fired even when registrationEmbedded was false and the result was ignored. Added an enabled option to useThirdPartyAuthHook and set it to registrationEmbedded in ProgressiveProfiling. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Add USER_RETENTION_COOKIE_NAME and SESSION_COOKIE_DOMAIN to the dependency array instead of suppressing react-hooks/exhaustive-deps. Both are config constants from useAppConfig() that never change at runtime, so behavior is unchanged. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Remove unused useThirdPartyAuthHook mock body, inline dead mockSetShowError variable, and extract shared TPA context mock constant in Logistration tests. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Adds tests that were removed or simplified during the Redux-to-React-Query migration, as identified in PR #1641 review. Logistration: CSRF token on mount, institution login page events for both login and register pages, institution login track+page event assertions. LoginPage: reset password banner dismissal on form submit, SSO redirect to finishAuthUrl, and redirectUrl precedence over finishAuthUrl. ProgressiveProfiling: sendPageEvent('login_and_registration', 'welcome') assertion on component mount. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

PasswordField is a shared component used across login, registration, and reset-password flows, but it was reaching directly into RegisterContext for validation state and callbacks. Replace context coupling with explicit props (validateField, clearRegistrationBackendError, validationApiRateLimited) passed by RegistrationPage, and remove the now-unused useRegisterContextOptional hook. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

When a user navigates to a protected SPA route while logged out, the authenticatedLoader redirects to /authn/login?next=%2Fsome-path. Previously, this relative next param was sent to the LMS backend, which resolved it against itself and returned an absolute LMS URL — causing a full page navigation away from the SPA shell. Now, when next starts with /, it is stripped from the API payload and handled locally: after login/registration succeeds, fetchAuthenticatedUser refreshes the auth cache so authenticatedLoader allows the target route, RedirectLogistration uses <Navigate> for SPA navigation, and hydrateAuthenticatedUser runs in the background to populate the full user profile (avatar, etc.) in the header. Also applies the same relative-path SPA navigation pattern to ProgressiveProfilingPageModal and replaces the hardcoded LMS dashboard fallback in the registration API with getUrlByRouteRole for consistency. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Routes are nested by default, but navigation constants used absolute paths like '/login', causing navigate() and <Navigate> to go to /login instead of /authn/login. Replace path constants in navigation calls with getUrlByRouteRole() where possible, which resolves the URL for a given route role from the route config. Path constants are still generally useful, but are now all relative (and camelCase). Centralize route roles, path segments, and the dashboard role in src/constants.ts. Last but not least, prefer SPA navigation (<Navigate>, useNavigate) over window.location.href where the target URL may be internal. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

When the backend returns the LMS dashboard URL as redirect_url after login or registration, replace it with getUrlByRouteRole(dashboardRole) so that RedirectLogistration can use <Navigate> for SPA navigation instead of a full page reload. Also hydrate the authenticated user before SPA navigation so the shell header displays the user's name. This applies the same fetchAuthenticatedUser/hydrateAuthenticatedUser pattern already used for the localNextPath flow to any redirect URL that starts with '/'. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

If the dashboard route role isn't registered, getUrlByRouteRole() returns undefined, breaking navigation. Fall back to '/' in all four call sites so the app degrades gracefully. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

The formatjs formatter in @openedx/frontend-base now outputs flat KV JSON directly to src/i18n/transifex_input.json (as of alpha.16), so the separate i18n.concat step and its associated transifex-utils dependency are no longer needed. Bump @openedx/frontend-base peer dep to ^1.0.0-alpha.16 to require the version that includes this change. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Add workspaces configuration and workspace-aware scripts for developing with local packages (such as frontend-base). Also, since npm skips bin-linking for workspace packages during install, do it when frontend-base is built. Part of openedx/frontend-base#184 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Adds `.releaserc` and a release GitHub Actions workflow, releasing from the `frontend-base` branch as a prerelease (`alpha`) to the `latest` dist-tag. Co-Authored-By: Claude <noreply@anthropic.com>

openedx-semantic-release-bot · 2026-04-02T18:03:26Z

🎉 This PR is included in version 1.0.0-alpha.7 🎉

The release is available on:

Your semantic-release bot 📦🚀

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

- Rename src/i18n/index.js → index.ts (project uses TypeScript) - Add src/i18n/messages.d.ts type stub so TypeScript is satisfied before translations:pull has been run - Remove src/i18n/messages.ts from git tracking (gitignored, generated) - Remove unused intl_imports and i18n Makefile variables - Remove detect_changed_source_translations Makefile target (unused by any CI workflow, extract_translations, or pull_translations) - Update package-lock to resolve @openedx/frontend-base to 1.0.0-alpha.23 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

openedx-semantic-release-bot · 2026-04-09T13:20:49Z

🎉 This PR is included in version 1.0.0-alpha.8 🎉

The release is available on:

Your semantic-release bot 📦🚀

The old App.messages pattern included apps exporting their messages via \`src/index.ts\`. There is no reason for apps to export this. The file only exists so the app can run as a site with \`npm run dev\`. With frontend-base's i18n pipeline, translations are handled at the site level via \`site.i18n\`. App-only testing didn't catch this because the webpack fallback plugin correctly resolves the missing messages file when \`npm run dev\` is running the app as a site from the repo root (\`src/i18n/\` context). The broken export only surfaces when the compiled \`dist/\` is consumed by a site. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

openedx-semantic-release-bot · 2026-04-09T13:55:50Z

🎉 This PR is included in version 1.0.0-alpha.9 🎉

The release is available on:

Your semantic-release bot 📦🚀

Co-Authored-By: Claude <noreply@anthropic.com>

openedx-semantic-release-bot · 2026-04-10T18:00:54Z

🎉 This PR is included in version 1.0.0-alpha.10 🎉

The release is available on:

Your semantic-release bot 📦🚀

frontend-base now expects `roles: [role]` instead of `role: role` in route handle objects. Co-Authored-By: Claude <noreply@anthropic.com>

openedx-semantic-release-bot · 2026-04-15T17:28:53Z

🎉 This PR is included in version 1.0.0-alpha.11 🎉

The release is available on:

Your semantic-release bot 📦🚀

refactor: migrate to frontend-base

8f8531a

BREAKING CHANGE: refactors the MFE for frontend-base.

arbrandes requested a review from a team as a code owner June 24, 2025 18:57

arbrandes mentioned this pull request Jun 24, 2025

refactor: migrate to frontend-base #1511

Closed

arbrandes marked this pull request as draft June 24, 2025 18:59

arbrandes mentioned this pull request Jun 20, 2025

Convert Authn to frontend-base #1498

Open

6 tasks

arbrandes linked an issue Jun 25, 2025 that may be closed by this pull request

Convert Authn to frontend-base #1498

Open

6 tasks

arbrandes commented Jun 26, 2025

View reviewed changes

arbrandes added 22 commits June 26, 2025 19:27

test: fix a couple of tests

7c8051a

docs: remove reference to devstack

014a990

fix: update index.html

3d77880

The only purpose of the included index.html is to serve the dev environment, so modify it to make that clear.

fix: remove catch-all route

aea12a6

Apps should avoid having a catch-all route, instead relying on the shell to provide it.

chore: prepare for publication

6acbf64

Update package.json for publication as a "buildless" library. (Also upgrade openedx-atlas.)

refactor: use appId from constants

4dd5ddc

chore: clean up npmignore

18951cc

chore: gitignore npm pack artifacts

1ecdb0b

feat: handle authentication roles

033e0fd

chore: bump frontend-base

095b156

Merge pull request #1515 from arbrandes/frontend-base-fixes

762ff75

feat: Prepare for publication to NPM

v1.0.0-alpha.0

b811648

chore: bump frontend-base

f83f24a

1.0.0-alpha.1

7efa279

feat: redirect to route role on successful login

b6c659c

Now we have a way to discover app URLs dynamically; do so for the (default) redirect on login.

1.0.0-alpha.2

c98b9a1

fix: bump frontend-base

3252b59

Bump frontend-base to alpha.4 to fix a bug with the route role redirection mechanism.

1.0.0-alpha.3

967c52b

fix: work around inotify handle starvation

9a48fe3

Bump frontend-base to avoid the inotify handle resource starvation.

chore: bump frontend-base and regenerate package-lock

c602136

1.0.0-alpha.4

2d6b401

feat!: add design tokens support

49f42a8

BREAKING CHANGE: Pre-design-tokens theming is no longer supported.

arbrandes and others added 15 commits March 13, 2026 16:36

fix: call setThirdPartyAuthContextBegin only on mount in LoginPage

8dcf552

It was being called on every data sync effect run, causing a flash of PENDING state even when TPA data was already available. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

fix: address review nits for test mock cleanup

c2a3c70

Remove unused useThirdPartyAuthHook mock body, inline dead mockSetShowError variable, and extract shared TPA context mock constant in Logistration tests. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

style: add explanatory comments for late imports after jest.mock()

1267024

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

refactor: simplify onSuccess redirect logic in login and registration

0cf13b3

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

build: add semantic-release for automated npm publishing

ffe7e18

Adds `.releaserc` and a release GitHub Actions workflow, releasing from the `frontend-base` branch as a prerelease (`alpha`) to the `latest` dist-tag. Co-Authored-By: Claude <noreply@anthropic.com>

openedx-semantic-release-bot added the released on @latest label Apr 2, 2026

arbrandes force-pushed the frontend-base branch from 544d16b to ffe7e18 Compare April 2, 2026 18:17

brian-smith-tcril and others added 5 commits April 9, 2026 09:50

feat: add atlasTranslations to package.json

222a0af

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat: properly use openedx translations:pull

48d97e8

fix: pass ATLAS_OPTIONS through to translations:pull

3764889

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

chore: trigger release

80394d2

feat: provide chromeless roles to hide shell header and footer

b61a6f4

Co-Authored-By: Claude <noreply@anthropic.com>

fix: use roles array in route handle config

104975f

frontend-base now expects `roles: [role]` instead of `role: role` in route handle objects. Co-Authored-By: Claude <noreply@anthropic.com>

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

refactor: migrate to frontend-base#1512

refactor: migrate to frontend-base#1512
arbrandes wants to merge 72 commits intomasterfrom
frontend-base

arbrandes commented Jun 24, 2025 •

edited

Loading

Uh oh!

arbrandes Jun 26, 2025

Uh oh!

arbrandes Jun 26, 2025

Uh oh!

openedx-semantic-release-bot commented Apr 2, 2026

Uh oh!

openedx-semantic-release-bot commented Apr 9, 2026

Uh oh!

openedx-semantic-release-bot commented Apr 9, 2026

Uh oh!

openedx-semantic-release-bot commented Apr 10, 2026

Uh oh!

openedx-semantic-release-bot commented Apr 15, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

10 participants

Conversation

arbrandes commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Uh oh!

arbrandes Jun 26, 2025

Choose a reason for hiding this comment

Uh oh!

arbrandes Jun 26, 2025

Choose a reason for hiding this comment

Uh oh!

openedx-semantic-release-bot commented Apr 2, 2026

Uh oh!

openedx-semantic-release-bot commented Apr 9, 2026

Uh oh!

openedx-semantic-release-bot commented Apr 9, 2026

Uh oh!

openedx-semantic-release-bot commented Apr 10, 2026

Uh oh!

openedx-semantic-release-bot commented Apr 15, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

10 participants

arbrandes commented Jun 24, 2025 •

edited

Loading