* Fixes issue #25011, removed MemoryRouter and added decorator with WrapInTestApp for proper routing context

Signed-off-by: Arup Chauhan <arupchauhan26@gmail.com>

* Fixes issue #25011, removed comment lines

Signed-off-by: Arup Chauhan <arupchauhan26@gmail.com>

* Fixes issue #25011: Updated package.json

Signed-off-by: Arup Chauhan <arupchauhan26@gmail.com>

---------

Signed-off-by: Arup Chauhan <arupchauhan26@gmail.com>
This commit is contained in:
Arup Chauhan
2024-08-13 07:59:31 -05:00
committed by GitHub
parent b10c109d29
commit 8c60eb7a46
4 changed files with 92 additions and 54 deletions
@@ -15,11 +15,14 @@
*/
import { Entity, GroupEntity } from '@backstage/catalog-model';
import { catalogApiRef, EntityProvider } from '@backstage/plugin-catalog-react';
import { TestApiProvider } from '@backstage/test-utils';
import {
catalogApiRef,
EntityProvider,
entityRouteRef,
} from '@backstage/plugin-catalog-react';
import { TestApiProvider, wrapInTestApp } from '@backstage/test-utils';
import Grid from '@material-ui/core/Grid';
import React from 'react';
import { MemoryRouter } from 'react-router-dom';
import React, { ComponentType, PropsWithChildren } from 'react';
import {
groupA,
mockedCatalogApiSupportingGroups,
@@ -29,6 +32,15 @@ import { MembersListCard } from './MembersListCard';
export default {
title: 'Plugins/Org/Group Members List Card',
component: MembersListCard,
decorators: [
(Story: ComponentType<PropsWithChildren<{}>>) =>
wrapInTestApp(
<div>
<Story />
</div>,
{ mountedRoutes: { '/': entityRouteRef } },
),
],
};
const makeUser = ({
@@ -108,45 +120,38 @@ const bob = makeUser({
const catalogApi = (items: Entity[]) => ({
getEntities: () => Promise.resolve({ items }),
});
export const Default = () => (
<MemoryRouter>
<TestApiProvider apis={[[catalogApiRef, catalogApi([alice, bob])]]}>
<EntityProvider entity={defaultEntity}>
<Grid container spacing={4}>
<Grid item xs={12} md={6}>
<MembersListCard />
</Grid>
<TestApiProvider apis={[[catalogApiRef, catalogApi([alice, bob])]]}>
<EntityProvider entity={defaultEntity}>
<Grid container spacing={4}>
<Grid item xs={12} md={6}>
<MembersListCard />
</Grid>
</EntityProvider>
</TestApiProvider>
</MemoryRouter>
</Grid>
</EntityProvider>
</TestApiProvider>
);
export const Empty = () => (
<MemoryRouter>
<TestApiProvider apis={[[catalogApiRef, catalogApi([])]]}>
<EntityProvider entity={defaultEntity}>
<Grid container spacing={4}>
<Grid item xs={12} md={6}>
<MembersListCard />
</Grid>
<TestApiProvider apis={[[catalogApiRef, catalogApi([])]]}>
<EntityProvider entity={defaultEntity}>
<Grid container spacing={4}>
<Grid item xs={12} md={6}>
<MembersListCard />
</Grid>
</EntityProvider>
</TestApiProvider>
</MemoryRouter>
</Grid>
</EntityProvider>
</TestApiProvider>
);
export const AggregateMembersToggle = () => (
<MemoryRouter>
<TestApiProvider apis={[[catalogApiRef, mockedCatalogApiSupportingGroups]]}>
<EntityProvider entity={groupA}>
<Grid container spacing={4}>
<Grid item xs={12} md={6}>
<MembersListCard showAggregateMembersToggle />
</Grid>
<TestApiProvider apis={[[catalogApiRef, mockedCatalogApiSupportingGroups]]}>
<EntityProvider entity={groupA}>
<Grid container spacing={4}>
<Grid item xs={12} md={6}>
<MembersListCard showAggregateMembersToggle />
</Grid>
</EntityProvider>
</TestApiProvider>
</MemoryRouter>
</Grid>
</EntityProvider>
</TestApiProvider>
);