diff --git a/packages/app-defaults/src/defaults/themes.tsx b/packages/app-defaults/src/defaults/themes.tsx
index 90a4a0f47f..397c160168 100644
--- a/packages/app-defaults/src/defaults/themes.tsx
+++ b/packages/app-defaults/src/defaults/themes.tsx
@@ -28,7 +28,6 @@ export const themes: AppTheme[] = [
title: 'Light Theme',
variant: 'light',
icon: ,
- theme: lightTheme,
Provider: ({ children }) => (
{children}
@@ -40,7 +39,6 @@ export const themes: AppTheme[] = [
title: 'Dark Theme',
variant: 'dark',
icon: ,
- theme: darkTheme,
Provider: ({ children }) => (
{children}
diff --git a/packages/core-app-api/src/app/AppThemeProvider.tsx b/packages/core-app-api/src/app/AppThemeProvider.tsx
index 2e145025d5..797e2bce87 100644
--- a/packages/core-app-api/src/app/AppThemeProvider.tsx
+++ b/packages/core-app-api/src/app/AppThemeProvider.tsx
@@ -15,8 +15,6 @@
*/
import React, { useMemo, useEffect, useState, PropsWithChildren } from 'react';
-import { ThemeProvider } from '@material-ui/core/styles';
-import CssBaseline from '@material-ui/core/CssBaseline';
import { useApi, appThemeApiRef, AppTheme } from '@backstage/core-plugin-api';
import { useObservable } from 'react-use';
@@ -90,20 +88,9 @@ export function AppThemeProvider({ children }: PropsWithChildren<{}>) {
throw new Error('App has no themes');
}
- if (appTheme.Provider) {
- return ;
+ if (!appTheme.Provider) {
+ throw new Error('App has no theme provider');
}
- // eslint-disable-next-line no-console
- console.warn(
- "DEPRECATION WARNING: A provided app theme is using the deprecated 'theme' property " +
- 'and should be migrated to use a Provider instead. ' +
- 'See https://backstage.io/docs/api/deprecations#app-theme for more info.',
- );
-
- return (
-
- {children}
-
- );
+ return ;
}
diff --git a/packages/core-plugin-api/api-report.md b/packages/core-plugin-api/api-report.md
index 709e56c22d..b31722f29d 100644
--- a/packages/core-plugin-api/api-report.md
+++ b/packages/core-plugin-api/api-report.md
@@ -6,7 +6,6 @@
///
import { BackstagePlugin as BackstagePlugin_2 } from '@backstage/core-plugin-api';
-import { BackstageTheme } from '@backstage/theme';
import { ComponentType } from 'react';
import { Config } from '@backstage/config';
import { IconComponent as IconComponent_2 } from '@backstage/core-plugin-api';
@@ -164,7 +163,6 @@ export type AppTheme = {
id: string;
title: string;
variant: 'light' | 'dark';
- theme: BackstageTheme;
icon?: React.ReactElement;
Provider?(props: { children: ReactNode }): JSX.Element | null;
};
diff --git a/packages/core-plugin-api/src/apis/definitions/AppThemeApi.ts b/packages/core-plugin-api/src/apis/definitions/AppThemeApi.ts
index 8053c449a1..7f8aed9573 100644
--- a/packages/core-plugin-api/src/apis/definitions/AppThemeApi.ts
+++ b/packages/core-plugin-api/src/apis/definitions/AppThemeApi.ts
@@ -16,7 +16,6 @@
import { ReactNode } from 'react';
import { ApiRef, createApiRef } from '../system';
-import { BackstageTheme } from '@backstage/theme';
import { Observable } from '@backstage/types';
/**
@@ -40,12 +39,6 @@ export type AppTheme = {
*/
variant: 'light' | 'dark';
- /**
- * The specialized MaterialUI theme instance.
- * @deprecated use Provider instead, see https://backstage.io/docs/api/deprecations#app-theme
- */
- theme: BackstageTheme;
-
/**
* An Icon for the theme mode setting.
*/
diff --git a/packages/dev-utils/src/devApp/SidebarThemeSwitcher.test.tsx b/packages/dev-utils/src/devApp/SidebarThemeSwitcher.test.tsx
index 43eaa6218c..bc44b69dbb 100644
--- a/packages/dev-utils/src/devApp/SidebarThemeSwitcher.test.tsx
+++ b/packages/dev-utils/src/devApp/SidebarThemeSwitcher.test.tsx
@@ -16,7 +16,6 @@
import { AppThemeApi, appThemeApiRef } from '@backstage/core-plugin-api';
import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
-import { BackstageTheme } from '@backstage/theme';
import userEvent from '@testing-library/user-event';
import React from 'react';
import ObservableImpl from 'zen-observable';
@@ -41,13 +40,11 @@ describe('SidebarThemeSwitcher', () => {
id: 'dark',
title: 'Dark Theme',
variant: 'dark',
- theme: {} as unknown as BackstageTheme,
},
{
id: 'light',
title: 'Light Theme',
variant: 'light',
- theme: {} as unknown as BackstageTheme,
},
]);
});
diff --git a/plugins/user-settings/src/components/General/UserSettingsThemeToggle.test.tsx b/plugins/user-settings/src/components/General/UserSettingsThemeToggle.test.tsx
index 83d9e23f83..09b27cb559 100644
--- a/plugins/user-settings/src/components/General/UserSettingsThemeToggle.test.tsx
+++ b/plugins/user-settings/src/components/General/UserSettingsThemeToggle.test.tsx
@@ -21,6 +21,8 @@ import {
wrapInTestApp,
} from '@backstage/test-utils';
import { lightTheme } from '@backstage/theme';
+import { ThemeProvider } from '@material-ui/core/styles';
+import CssBaseline from '@material-ui/core/CssBaseline';
import { fireEvent } from '@testing-library/react';
import React from 'react';
import { UserSettingsThemeToggle } from './UserSettingsThemeToggle';
@@ -30,7 +32,11 @@ const mockTheme: AppTheme = {
id: 'light-theme',
title: 'Mock Theme',
variant: 'light',
- theme: lightTheme,
+ Provider: ({ children }) => (
+
+ {children}
+
+ ),
};
const apiRegistry = TestApiRegistry.from([