From b651807e562485ac0d09b8540a4ad6684a5e3aae Mon Sep 17 00:00:00 2001 From: Charles de Dreuille Date: Mon, 30 Mar 2026 11:55:27 +0100 Subject: [PATCH] fix(storybook): replace require() with ESM import in Toast stories The RealAlertApiStory component used require('@backstage/core-plugin-api') inside the function body. Vite bundles Storybook as ESM, where require is not available at runtime, causing a ReferenceError. Replace with a standard top-level import. Signed-off-by: Charles de Dreuille Made-with: Cursor --- plugins/app/src/components/Toast/Toast.stories.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/plugins/app/src/components/Toast/Toast.stories.tsx b/plugins/app/src/components/Toast/Toast.stories.tsx index f008bc2550..6cd895a5f8 100644 --- a/plugins/app/src/components/Toast/Toast.stories.tsx +++ b/plugins/app/src/components/Toast/Toast.stories.tsx @@ -19,6 +19,7 @@ import preview from '../../../../../.storybook/preview'; import { Button, Flex, Text } from '../../../../../packages/ui/src'; /* eslint-enable @backstage/no-relative-monorepo-imports */ import { ToastQueue } from '@react-stately/toast'; +import { useApi, alertApiRef } from '@backstage/core-plugin-api'; import { ToastContainer } from './index'; import type { ToastApiMessageContent } from './types'; import { MemoryRouter } from 'react-router-dom'; @@ -567,8 +568,6 @@ export const AlertApiIntegration = meta.story({ * Backstage app where the app plugin's elements.tsx is used. */ function RealAlertApiStory() { - // eslint-disable-next-line @backstage/no-relative-monorepo-imports - const { useApi, alertApiRef } = require('@backstage/core-plugin-api'); const alertApi = useApi(alertApiRef); return (