diff --git a/plugins/org/src/components/Cards/Group/GroupProfile/GroupProfileCard.stories.tsx b/plugins/org/src/components/Cards/Group/GroupProfile/GroupProfileCard.stories.tsx index cdf6240fc0..fc45d9a8fe 100644 --- a/plugins/org/src/components/Cards/Group/GroupProfile/GroupProfileCard.stories.tsx +++ b/plugins/org/src/components/Cards/Group/GroupProfile/GroupProfileCard.stories.tsx @@ -15,17 +15,17 @@ */ import { GroupEntity } from '@backstage/catalog-model'; -import { EntityProvider } from '@backstage/plugin-catalog-react'; +import { + CatalogApi, + catalogApiRef, + EntityProvider, + entityRouteRef, +} from '@backstage/plugin-catalog-react'; +import { TestApiProvider, wrapInTestApp } from '@backstage/test-utils'; import { Grid } from '@material-ui/core'; -import React from 'react'; -import { MemoryRouter } from 'react-router'; +import React, { ComponentType } from 'react'; import { GroupProfileCard } from './GroupProfileCard'; -export default { - title: 'Plugins/Org/Group Profile Card', - component: GroupProfileCard, -}; - const dummyDepartment = { type: 'childOf', targetRef: 'group:default/department-a', @@ -56,14 +56,34 @@ const defaultEntity: GroupEntity = { relations: [dummyDepartment], }; +const catalogApi: Partial = { + async refreshEntity() {}, +}; + export const Default = () => ( - - - - - - + + + + - - + + ); + +export default { + title: 'Plugins/Org/Group Profile Card', + component: GroupProfileCard, + decorators: [ + (Story: ComponentType<{}>) => + wrapInTestApp( + + + , + { + mountedRoutes: { + '/a': entityRouteRef, + }, + }, + ), + ], +}; diff --git a/plugins/org/src/components/Cards/User/UserProfileCard/UserProfileCard.stories.tsx b/plugins/org/src/components/Cards/User/UserProfileCard/UserProfileCard.stories.tsx index 0b2d2790a0..eb7b8fadda 100644 --- a/plugins/org/src/components/Cards/User/UserProfileCard/UserProfileCard.stories.tsx +++ b/plugins/org/src/components/Cards/User/UserProfileCard/UserProfileCard.stories.tsx @@ -15,17 +15,15 @@ */ import { UserEntity } from '@backstage/catalog-model'; -import { EntityProvider } from '@backstage/plugin-catalog-react'; +import { + EntityProvider, + entityRouteRef, +} from '@backstage/plugin-catalog-react'; +import { wrapInTestApp } from '@backstage/test-utils'; import { Grid } from '@material-ui/core'; -import React from 'react'; -import { MemoryRouter } from 'react-router'; +import React, { ComponentType } from 'react'; import { UserProfileCard } from './UserProfileCard'; -export default { - title: 'Plugins/Org/User Profile Card', - component: UserProfileCard, -}; - const dummyGroup = { type: 'memberOf', targetRef: 'group:default/team-a', @@ -56,15 +54,13 @@ const defaultEntity: UserEntity = { }; export const Default = () => ( - - - - - - + + + + - - + + ); const noImageEntity: UserEntity = { @@ -85,13 +81,24 @@ const noImageEntity: UserEntity = { }; export const NoImage = () => ( - - - - - - + + + + - - + + ); + +export default { + title: 'Plugins/Org/User Profile Card', + component: UserProfileCard, + decorators: [ + (Story: ComponentType<{}>) => + wrapInTestApp(, { + mountedRoutes: { + '/a': entityRouteRef, + }, + }), + ], +};