feat: use provides for shell header/footer visibility

Replace hardcoded inactive role list with `provides`-based callbacks,
letting apps declare when header/footer should be hidden. Rename
`getProvidedData` to `getProvides` and add shared `getProvidesAsRoles`
helper to deduplicate role ingestion across consumers.

BREAKING CHANGE: `getProvidedData` renamed to `getProvides`. Course
navigation bar `provides` data shape changed from
`{ courseNavigationRoles: string[] }` to `string[]`.

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

Author: arbrandes

docs/decisions/0013-app-provides-for-inter-app-data.rst

@@ -64,7 +64,7 @@ serve as a key.
 A runtime helper would look something like::
 
     // Returns all `provides` entries matching the given key.
-    function getProvidedData(key: string): unknown[]
+    function getProvides(key: string): unknown[]
 
 
 Guidelines
@@ -109,9 +109,9 @@ As a concrete illustration, the Instructor Dashboard app could declare::
     const config: App = {
       appId: 'org.openedx.frontend.app.instructor',
       provides: {
-        'org.openedx.frontend.provides.courseNavigationRoles.v1': {
-          courseNavigationRoles: ['org.openedx.frontend.role.instructor'],
-        },
+        'org.openedx.frontend.provides.courseNavigationRoles.v1': [
+          'org.openedx.frontend.role.instructor',
+        ],
       },
       routes: [...],
       slots: [...],

runtime/config/index.test.ts

@@ -3,7 +3,7 @@ import * as subscriptions from '../subscriptions';
 import {
   addAppConfigs,
   getAppConfig,
-  getProvidedData,
+  getProvides,
   getSiteConfig,
   mergeSiteConfig,
   setSiteConfig,
@@ -352,10 +352,10 @@ describe('mergeSiteConfig', () => {
     });
   });
 
-  describe('getProvidedData', () => {
+  describe('getProvides', () => {
     it('should return empty array when no apps exist', () => {
       setSiteConfig({ ...defaultSiteConfig, apps: [] });
-      expect(getProvidedData('org.openedx.frontend.provides.testKey.v1')).toEqual([]);
+      expect(getProvides('org.openedx.frontend.provides.testKey.v1')).toEqual([]);
     });
 
     it('should return empty array when no apps provide data for the consumer', () => {
@@ -366,7 +366,7 @@ describe('mergeSiteConfig', () => {
           { appId: 'app-two' },
         ],
       });
-      expect(getProvidedData('org.openedx.frontend.provides.testKey.v1')).toEqual([]);
+      expect(getProvides('org.openedx.frontend.provides.testKey.v1')).toEqual([]);
     });
 
     it('should collect provided data from apps that declare it', () => {
@@ -388,7 +388,7 @@ describe('mergeSiteConfig', () => {
         ],
       });
 
-      const result = getProvidedData('org.openedx.frontend.provides.testKey.v1');
+      const result = getProvides('org.openedx.frontend.provides.testKey.v1');
       expect(result).toEqual([
         { urlPattern: '/one/' },
         { urlPattern: '/two/' },
@@ -409,10 +409,10 @@ describe('mergeSiteConfig', () => {
         ],
       });
 
-      const headerData = getProvidedData('org.openedx.frontend.provides.testKey.v1');
+      const headerData = getProvides('org.openedx.frontend.provides.testKey.v1');
       expect(headerData).toEqual([{ urlPattern: '/one/' }]);
 
-      const footerData = getProvidedData('org.openedx.frontend.provides.otherKey.v1');
+      const footerData = getProvides('org.openedx.frontend.provides.otherKey.v1');
       expect(footerData).toEqual([{ showBranding: true }]);
     });
 
@@ -431,7 +431,7 @@ describe('mergeSiteConfig', () => {
         ],
       });
 
-      const result = getProvidedData('org.openedx.frontend.provides.testKey.v1');
+      const result = getProvides('org.openedx.frontend.provides.testKey.v1');
       expect(result).toEqual([{ urlPattern: '/two/' }]);
     });
   });

runtime/config/index.ts

@@ -331,7 +331,7 @@ export function getActiveRoles() {
  * @param key - The namespaced identifier for the provided data.
  * @returns An array of provided data objects from all apps that declared data for this key.
  */
-export function getProvidedData(key: string): unknown[] {
+export function getProvides(key: string): unknown[] {
   const { apps } = getSiteConfig();
   if (!apps) return [];
 

runtime/index.ts

@@ -45,7 +45,7 @@ export {
   getActiveWidgetRoles,
   getActiveRoles,
   getExternalLinkUrl,
-  getProvidedData
+  getProvides
 } from './config';
 
 export * from './constants';

shell/app.ts

@@ -1,15 +1,15 @@
-import { WidgetOperationTypes } from '../runtime';
+import { getActiveRoles, WidgetOperationTypes } from '../runtime';
 import { App } from '../types';
 import { Footer } from './footer';
 import { Header } from './header';
+import { hideFooterRolesProvidesKey, hideHeaderRolesProvidesKey } from './constants';
+import { getProvidesAsRoles } from './provides';
 
-const inactive = [
-  'org.openedx.frontend.role.login',
-  'org.openedx.frontend.role.register',
-  'org.openedx.frontend.role.resetPassword',
-  'org.openedx.frontend.role.confirmPassword',
-  'org.openedx.frontend.role.welcome'
-];
+function isActive(providesKey: string): boolean {
+  const activeRoles = getActiveRoles();
+  const inactiveRoles = getProvidesAsRoles(providesKey);
+  return !inactiveRoles.some(role => activeRoles.includes(role));
+}
 
 const app: App = {
   appId: 'org.openedx.frontend.app.shell',
@@ -20,7 +20,7 @@ const app: App = {
       op: WidgetOperationTypes.APPEND,
       component: Header,
       condition: {
-        inactive,
+        callback: () => isActive(hideHeaderRolesProvidesKey),
       }
     },
     {
@@ -29,7 +29,7 @@ const app: App = {
       op: WidgetOperationTypes.APPEND,
       component: Footer,
       condition: {
-        inactive,
+        callback: () => isActive(hideFooterRolesProvidesKey),
       }
     },
   ]

shell/constants.ts

@@ -0,0 +1,2 @@
+export const hideHeaderRolesProvidesKey = 'org.openedx.frontend.provides.hideHeaderRoles.v1';
+export const hideFooterRolesProvidesKey = 'org.openedx.frontend.provides.hideFooterRoles.v1';

shell/header/course-navigation-bar/utils.test.ts

@@ -1,33 +1,31 @@
 import { isClientRoute, isCourseNavigationRoute } from './utils';
 import * as runtime from '../../../runtime';
+import * as provides from '../../provides';
 
 jest.mock('../../../runtime');
+jest.mock('../../provides');
 
 const mockGetActiveRoles = runtime.getActiveRoles as jest.MockedFunction<typeof runtime.getActiveRoles>;
-const mockGetProvidedData = runtime.getProvidedData as jest.MockedFunction<typeof runtime.getProvidedData>;
+const mockGetProvidedRoles = provides.getProvidesAsRoles as jest.MockedFunction<typeof provides.getProvidesAsRoles>;
 const mockGetUrlByRouteRole = runtime.getUrlByRouteRole as jest.MockedFunction<typeof runtime.getUrlByRouteRole>;
 
 describe('isCourseNavigationRoute', () => {
   it('returns true when a provided role is active', () => {
-    mockGetProvidedData.mockReturnValue([
-      { courseNavigationRoles: ['org.openedx.frontend.role.instructor'] },
-    ]);
+    mockGetProvidedRoles.mockReturnValue(['org.openedx.frontend.role.instructor']);
     mockGetActiveRoles.mockReturnValue(['org.openedx.frontend.role.instructor']);
 
     expect(isCourseNavigationRoute()).toBe(true);
   });
 
   it('returns false when no provided roles are active', () => {
-    mockGetProvidedData.mockReturnValue([
-      { courseNavigationRoles: ['org.openedx.frontend.role.instructor'] },
-    ]);
+    mockGetProvidedRoles.mockReturnValue(['org.openedx.frontend.role.instructor']);
     mockGetActiveRoles.mockReturnValue(['org.openedx.frontend.role.learning']);
 
     expect(isCourseNavigationRoute()).toBe(false);
   });
 
   it('returns false when no providers exist', () => {
-    mockGetProvidedData.mockReturnValue([]);
+    mockGetProvidedRoles.mockReturnValue([]);
     mockGetActiveRoles.mockReturnValue(['org.openedx.frontend.role.instructor']);
 
     expect(isCourseNavigationRoute()).toBe(false);
@@ -36,45 +34,35 @@ describe('isCourseNavigationRoute', () => {
 
 describe('isClientRoute', () => {
   it('matches a pathname under a static route path', () => {
-    mockGetProvidedData.mockReturnValue([
-      { courseNavigationRoles: ['org.openedx.frontend.role.learning'] },
-    ]);
+    mockGetProvidedRoles.mockReturnValue(['org.openedx.frontend.role.learning']);
     mockGetUrlByRouteRole.mockReturnValue('/course');
 
     expect(isClientRoute('/course/outline')).toBe(true);
   });
 
   it('matches a pathname under a parameterized route path', () => {
-    mockGetProvidedData.mockReturnValue([
-      { courseNavigationRoles: ['org.openedx.frontend.role.instructor'] },
-    ]);
+    mockGetProvidedRoles.mockReturnValue(['org.openedx.frontend.role.instructor']);
     mockGetUrlByRouteRole.mockReturnValue('/instructor-dashboard/:courseId');
 
     expect(isClientRoute('/instructor-dashboard/course-v1:edX+DemoX+Demo')).toBe(true);
   });
 
   it('does not match a pathname outside the route prefix', () => {
-    mockGetProvidedData.mockReturnValue([
-      { courseNavigationRoles: ['org.openedx.frontend.role.instructor'] },
-    ]);
+    mockGetProvidedRoles.mockReturnValue(['org.openedx.frontend.role.instructor']);
     mockGetUrlByRouteRole.mockReturnValue('/instructor-dashboard/:courseId');
 
     expect(isClientRoute('/courses/some-course/instructor')).toBe(false);
   });
 
   it('returns false for external routes', () => {
-    mockGetProvidedData.mockReturnValue([
-      { courseNavigationRoles: ['org.openedx.frontend.role.learning'] },
-    ]);
+    mockGetProvidedRoles.mockReturnValue(['org.openedx.frontend.role.learning']);
     mockGetUrlByRouteRole.mockReturnValue('https://external.example.com/course');
 
     expect(isClientRoute('/course/outline')).toBe(false);
   });
 
   it('returns false when role has no matching route', () => {
-    mockGetProvidedData.mockReturnValue([
-      { courseNavigationRoles: ['org.openedx.frontend.role.learning'] },
-    ]);
+    mockGetProvidedRoles.mockReturnValue(['org.openedx.frontend.role.learning']);
     mockGetUrlByRouteRole.mockReturnValue(null);
 
     expect(isClientRoute('/course/outline')).toBe(false);

shell/header/course-navigation-bar/utils.ts

@@ -1,32 +1,19 @@
 import { matchPath } from 'react-router-dom';
-import { getActiveRoles, getProvidedData, getUrlByRouteRole } from '../../../runtime';
+import { getActiveRoles, getUrlByRouteRole } from '../../../runtime';
+import { getProvidesAsRoles } from '../../provides';
 import { courseNavigationRolesProvidesKey } from '../constants';
 
-interface CourseNavigationProviderData {
-  courseNavigationRoles: string[],
-}
-
-function getProviders(): CourseNavigationProviderData[] {
-  return getProvidedData(courseNavigationRolesProvidesKey).filter(
-    (data): data is CourseNavigationProviderData =>
-      data !== null
-      && typeof data === 'object'
-      && 'courseNavigationRoles' in data
-      && Array.isArray((data as CourseNavigationProviderData).courseNavigationRoles)
-  );
-}
-
-function getProvidedRoles(): string[] {
-  return getProviders().flatMap(data => data.courseNavigationRoles);
+function getRoles(): string[] {
+  return getProvidesAsRoles(courseNavigationRolesProvidesKey);
 }
 
 export function isCourseNavigationRoute(): boolean {
   const activeRoles = getActiveRoles();
-  return getProvidedRoles().some(role => activeRoles.includes(role));
+  return getRoles().some(role => activeRoles.includes(role));
 }
 
 export function isClientRoute(pathname: string): boolean {
-  return getProvidedRoles().some(role => {
+  return getRoles().some(role => {
     const routePath = getUrlByRouteRole(role);
     return routePath !== null
       && routePath.startsWith('/')

shell/header/index.ts

@@ -1,2 +1,3 @@
 export { default as headerApp } from './app';
+export { courseNavigationRolesProvidesKey } from './constants';
 export { default as Header } from './Header';

shell/index.ts

@@ -2,6 +2,8 @@ export { default as DefaultLayout } from './DefaultLayout';
 export { default as DefaultMain } from './DefaultMain';
 export { default as shellApp } from './app';
 export { Footer, footerApp } from './footer';
-export { Header, headerApp } from './header';
+export { courseNavigationRolesProvidesKey, Header, headerApp } from './header';
+export { hideFooterRolesProvidesKey, hideHeaderRolesProvidesKey } from './constants';
+export { getProvidesAsRoles } from './provides';
 export { default as LinkMenuItem } from './menus/LinkMenuItem';
 export { default as NavDropdownMenuSlot } from './menus/NavDropdownMenuSlot';