diff --git a/packages/core/src/components/CopyTextButton/CopyTextButton.stories.tsx b/packages/core/src/components/CopyTextButton/CopyTextButton.stories.tsx
index 3dc5854ab3..92db2073d3 100644
--- a/packages/core/src/components/CopyTextButton/CopyTextButton.stories.tsx
+++ b/packages/core/src/components/CopyTextButton/CopyTextButton.stories.tsx
@@ -16,33 +16,10 @@
import React from 'react';
import CopyTextButton from '.';
-import {
- ApiProvider,
- errorApiRef,
- ApiRegistry,
- ErrorApi,
-} from '@backstage/core-api';
export default {
title: 'CopyTextButton',
component: CopyTextButton,
- decorators: [
- (storyFn: () => JSX.Element) => {
- // TODO: move this to common storybook config, requires core package to be separate from components
- const registry = ApiRegistry.from([
- [
- errorApiRef,
- {
- post(error) {
- // eslint-disable-next-line no-alert
- window.alert(`Component posted error, ${error}`);
- },
- } as ErrorApi,
- ],
- ]);
- return ;
- },
- ],
};
export const Default = () => (
diff --git a/packages/storybook/.storybook/apis.js b/packages/storybook/.storybook/apis.js
new file mode 100644
index 0000000000..5743dac50b
--- /dev/null
+++ b/packages/storybook/.storybook/apis.js
@@ -0,0 +1,16 @@
+import {
+ ApiRegistry,
+ alertApiRef,
+ errorApiRef,
+ AlertApiForwarder,
+ ErrorApiForwarder,
+ ErrorAlerter,
+} from '@backstage/core';
+
+const builder = ApiRegistry.builder();
+
+const alertApi = builder.add(alertApiRef, new AlertApiForwarder());
+
+builder.add(errorApiRef, new ErrorAlerter(alertApi, new ErrorApiForwarder()));
+
+export const apis = builder.build();
diff --git a/packages/storybook/.storybook/config.js b/packages/storybook/.storybook/config.js
index 941b02718b..69145ea057 100644
--- a/packages/storybook/.storybook/config.js
+++ b/packages/storybook/.storybook/config.js
@@ -3,14 +3,18 @@ import { addDecorator, addParameters } from '@storybook/react';
import { lightTheme, darkTheme } from '@backstage/theme';
import { CssBaseline, ThemeProvider } from '@material-ui/core';
import { useDarkMode } from 'storybook-dark-mode';
-import { Content } from '@backstage/core';
+import { Content, ApiProvider, AlertDisplay } from '@backstage/core';
+import { apis } from './apis';
-addDecorator((story) => (
-
-
- {story()}
-
-
+addDecorator(story => (
+
+
+
+
+ {story()}
+
+
+
));
addParameters({