Remove Legacy UI Waffle Flags [DEPR]

[farhan]

Ticket: #3063

Description

See ticket for the details implemented in this PR

Testing instructions

Phase 1a:

Files cleaner: card-item/index.tsx, CustomPages.tsx, ChecklistItemComment.jsx, Textbooks.jsx, textbooks/hooks.jsx
flags removed: useNewCourseOutlinePage

Test URLs:

• http://apps.local.openedx.io:2001/authoring/home - [index.tsx] — course card navigates to /course/<id>
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/custom-pages - [CustomPages.tsx] — "Content" breadcrumb stays in MFE
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/checklists - [ChecklistItemComment.jsx] — assignment deadline links point to MFE outline
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/textbooks - [Textbooks.jsx], [hooks.jsx] — "Content" breadcrumb stays in MFE

---

Phase 1b:

Files cleaned: Header.tsx, ChecklistItemBody.jsx, Breadcrumbs.tsx, AddComponent.tsx
flags removed: useNewHomePage, useNewCourseOutlinePage, useNewUnitPage, useNewPdfEditor, useNewCertificatesPage removed

Test URLs:

• http://apps.local.openedx.io:2001/authoring/home - [Header.tsx] — isNewHomePage always true
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10 - [Header.tsx] — outline link in header always MFE path
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/checklists - [ChecklistItemBody.jsx] — certificate/outline "Update" links point to MFE routes
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/certificates - [ChecklistItemBody.jsx] — page loads in MFE
• Any unit page → Add Component → Advanced → PDF - [Breadcrumbs.tsx], [AddComponent.tsx] — React editor opens inline

---

Phase 1c:

Files cleaned: CourseAuthoringContext.tsx, VideoEditorModal.tsx, VideoSettingsModal/index.tsx, header/hooks.tsx, PageSettingButton.jsx
flags removed: useNewUnitPage, useNewCourseOutlinePage, useNewUpdatesPage, useNewFilesUploadsPage, useNewImportPage, useNewExportPage, useNewCertificatesPage, useNewVideoUploadsPage, useNewTextbooksPage, useNewCustomPages removed

Test URLs:

• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10 — [CourseAuthoringContext.tsx] — clicking a unit block in the outline opens /course/<id>/container/<locator> (MFE unit page)
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10 — [hooks.tsx] — Header → Content → "Outline" link stays in MFE
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/course_info — [hooks.tsx] — Header → Content → "Updates" link stays in MFE
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/assets — [hooks.tsx] — Header → Content → "Files & Uploads" link stays in MFE
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/import — [hooks.tsx] — Header → Tools → "Import" link stays in MFE
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/export — [hooks.tsx] — Header → Tools → "Export" link stays in MFE
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/certificates — [hooks.tsx] — Header → Settings → "Certificates" appears only when ENABLE_CERTIFICATE_PAGE === 'true'
• Any unit page → open a Video component → click "Video Settings" — [VideoEditorModal.tsx], [VideoSettingsModal/index.tsx] — "Upload from video uploads page" button is always visible (non-library courses)
• http://apps.local.openedx.io:2001/authoring/course/course-v1:axim+10+10/pages-and-resources — [PageSettingButton.jsx] — Textbooks and Custom Pages settings icons navigate to MFE paths

Best Practices Checklist

We're trying to move away from some deprecated patterns in this codebase. Please
check if your PR meets these recommendations before asking for a review:

• Any new files are using TypeScript (.ts, .tsx).
• Avoid propTypes and defaultProps in any new or modified code.
• Tests should use the helpers in src/testUtils.tsx (specifically initializeMocks)
• Do not add new fields to the Redux state/store. Use React Context to share state among multiple components.
• Use React Query to load data from REST APIs. See any apiHooks.ts in this repo for examples.
• All new i18n messages in messages.ts files have a description for translators to use.
• Avoid using ../ in import paths. To import from parent folders, use @src, e.g. import { initializeMocks } from '@src/testUtils'; instead of from '../../../../testUtils'

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 95.59%. Comparing base (fc51f17) to head (16407a2).

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #3069      +/-   ##
==========================================
+ Coverage   95.57%   95.59%   +0.01%     
==========================================
  Files        1393     1393              
  Lines       33029    32998      -31     
  Branches     7662     7648      -14     
==========================================
- Hits        31568    31543      -25     
+ Misses       1408     1392      -16     
- Partials       53       63      +10     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[Copilot]

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

This PR removes multiple waffle-flag / config gated “legacy vs MFE” code paths and standardizes navigation to always use the MFE routes (e.g., /course/:courseId/...), while also cleaning up related flags, config, and tests.

Changes:

• Removed usage of several waffle flags and config toggles across navigation, breadcrumbs, and unit-page components, defaulting behavior to MFE routes/UI.
• Deleted legacy unit-page/new-design branching logic and related helpers/config.
• Updated tests and mocks to reflect the removal of the deprecated flags and legacy fallbacks.

Reviewed changes

Copilot reviewed 41 out of 41 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
src/textbooks/hooks.tsx	Always links breadcrumbs to MFE course routes; removes waffle/config branching.
src/textbooks/Textbooks.tsx	Adjusts ConnectionErrorAlert import path.
src/studio-home/card-item/index.tsx	Removes waffle-flag gating for destination URL selection.
src/plugin-slots/CourseAuthoringUnitSidebarSlot/index.tsx	Removes conditional sidebar class logic; always applies sidebar.
src/pages-and-resources/pages/PageSettingButton.jsx	Removes waffle-flag based legacy/new link logic; always uses MFE route for supported legacy links.
src/pages-and-resources/pages/PageSettingButton.test.jsx	Removes legacy/flag-branch test cases; updates expectations.
src/pages-and-resources/pages/PageCard.test.jsx	Adjusts waffle flags API mock response.
src/index.jsx	Removes unit-page related config keys.
src/header/hooks.tsx	Always uses MFE URLs for content/tools menu items; removes several waffle-flag branches.
src/header/hooks.test.tsx	Updates tests to match always-MFE URL behavior; removes flag-specific setup.
src/header/Header.tsx	Removes waffle-flag dependency; always uses MFE outline link and sets isNewHomePage true.
src/editors/containers/VideoEditor/components/VideoSettingsModal/index.tsx	Removes useNewVideoUploadsPage prop and gating; always renders back button when not library.
src/editors/containers/VideoEditor/components/VideoSettingsModal/index.test.tsx	Updates test to reflect removal of useNewVideoUploadsPage.
src/editors/containers/VideoEditor/components/VideoEditorModal.tsx	Removes waffle-flag plumbing to VideoSettingsModal.
src/data/apiHooks.test.tsx	Updates waffle-flag test to assert useReactMarkdownEditor instead of removed flags.
src/data/apiHooks.mock.ts	Updates documentation comment for mock usage examples.
src/data/api.ts	Removes deprecated waffle-flag defaults.
src/custom-pages/CustomPages.tsx	Removes waffle-flag gated breadcrumb link; always uses MFE route.
src/custom-pages/CustomPages.test.tsx	Adjusts waffle flags API mock response.
src/course-unit/xblock-container-iframe/index.tsx	Removes legacy manage-tags modal path; always uses new flow (sidebar + iframe message).
src/course-unit/utils.ts	Removes isUnitPageNewDesignEnabled helper and related config import.
src/course-unit/unit-sidebar/unit-info/UnitVisibilityInfo.tsx	Removes legacy visibility UI and prop; always renders new visibility content.
src/course-unit/unit-sidebar/unit-info/PublishControls.tsx	Stops passing legacy-only openVisibleModal prop.
src/course-unit/unit-sidebar/UnitSidebar.tsx	Removes legacy sidebar branching; always uses new sidebar.
src/course-unit/header-title/HeaderTitle.tsx	Removes legacy settings/configure modal UI; keeps inline title editing.
src/course-unit/header-title/HeaderTitle.test.tsx	Removes config setup tied to unit-page-new-design flag.
src/course-unit/header-navigations/HeaderNavigations.tsx	Removes new-design feature gate; always shows new-design buttons/behavior.
src/course-unit/header-navigations/HeaderNavigations.test.tsx	Removes config setup tied to unit-page-new-design flag.
src/course-unit/breadcrumbs/Breadcrumbs.tsx	Removes waffle/config-based URL adaptation; always uses MFE URLs.
src/course-unit/breadcrumbs/Breadcrumbs.test.tsx	Removes legacy-fallback test and updates waffle mock response.
src/course-unit/add-component/AddComponent.tsx	Removes useNewPdfEditor gating; always treats PDF creation as new flow.
src/course-unit/add-component/AddComponent.test.tsx	Removes test validating legacy PDF-editor path.
src/course-unit/CourseUnit.tsx	Removes unit-page-new-design gating for StatusBar; always renders for vertical units.
src/course-unit/CourseUnit.test.tsx	Removes config toggles for unit-page-new-design across test cases.
src/course-checklist/ChecklistSection/ChecklistSection.test.jsx	Adjusts waffle flags API mock response.
src/course-checklist/ChecklistSection/ChecklistItemComment.jsx	Removes waffle/config gating; always links to MFE outline anchor.
src/course-checklist/ChecklistSection/ChecklistItemBody.jsx	Simplifies update links; always uses MFE outline URL and removes waffle dependency.
src/CourseAuthoringContext.tsx	Removes legacy unit-page URL branching and full-page navigation; always uses SPA navigation to MFE unit route.
plugins/course-apps/proctoring/Settings.test.jsx	Updates expected network call count after removing waffle flag fetch.
.env.development	Removes deprecated env flags for unit page / new video upload page.
.env	Removes deprecated env flags for unit page / unit page new design.

Comments suppressed due to low confidence (3)

src/textbooks/Textbooks.tsx:1

• This switches from the project’s @src/... import alias style to a relative import. To keep imports consistent (and avoid brittleness when files move), prefer using the existing alias import (e.g., @src/generic/ConnectionErrorAlert) unless there’s a specific reason the alias cannot be used here.
  src/pages-and-resources/pages/PageSettingButton.jsx:1
• The identifier determineLinkDestination reads like a function, but it’s a memoized value (string/null). Renaming it to something like linkDestination / destinationHref would better match its actual type and reduce confusion for future readers.
  src/header/Header.tsx:1
• Passing isNewHomePage with no value hard-codes it to true. If the legacy home page behavior is fully removed, consider deleting the prop entirely from the downstream component API (and any related branching) to reduce dead/obsolete configuration surface area. If legacy behavior is still needed in some contexts, this should remain conditional rather than always-on.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.