feat(EntityLayout): navigates to root of catalog after unregistering and entity

Signed-off-by: Matthew Prinold <matthewprinold@gmail.com>

packages/app/src/components/catalog/EntityPage.test.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { EntityLayout } from '@backstage/plugin-catalog';
+import { EntityLayout, catalogPlugin } from '@backstage/plugin-catalog';
 import {
   EntityProvider,
   starredEntitiesApiRef,
@@ -51,6 +51,7 @@ describe('EntityPage Test', () => {
     listWorkflowRuns: jest.fn().mockResolvedValue([]),
   };
   const mockPermissionApi = new MockPermissionApi();
+  const rootRouteRef = catalogPlugin.routes.catalogIndex;
 
   describe('cicdContent', () => {
     it('Should render GitHub Actions View', async () => {
@@ -70,6 +71,11 @@ describe('EntityPage Test', () => {
             </EntityLayout>
           </EntityProvider>
         </TestApiProvider>,
+        {
+          mountedRoutes: {
+            '/catalog': rootRouteRef,
+          },
+        },
       );
 
       expect(rendered.getByText('ExampleComponent')).toBeInTheDocument();

plugins/catalog/src/components/EntityLayout/EntityLayout.test.tsx

@@ -35,6 +35,7 @@ import {
 import { act, fireEvent, screen } from '@testing-library/react';
 import React from 'react';
 import { EntityLayout } from './EntityLayout';
+import { rootRouteRef } from '../../routes';
 
 const mockEntity = {
   kind: 'MyKind',
@@ -65,6 +66,7 @@ describe('EntityLayout', () => {
       {
         mountedRoutes: {
           '/catalog/:namespace/:kind/:name': entityRouteRef,
+          '/catalog': rootRouteRef,
         },
       },
     );
@@ -97,6 +99,7 @@ describe('EntityLayout', () => {
       {
         mountedRoutes: {
           '/catalog/:namespace/:kind/:name': entityRouteRef,
+          '/catalog': rootRouteRef,
         },
       },
     );
@@ -120,6 +123,7 @@ describe('EntityLayout', () => {
       {
         mountedRoutes: {
           '/catalog/:namespace/:kind/:name': entityRouteRef,
+          '/catalog': rootRouteRef,
         },
       },
     );
@@ -146,6 +150,7 @@ describe('EntityLayout', () => {
       {
         mountedRoutes: {
           '/catalog/:namespace/:kind/:name': entityRouteRef,
+          '/catalog': rootRouteRef,
         },
       },
     );
@@ -178,6 +183,7 @@ describe('EntityLayout', () => {
       {
         mountedRoutes: {
           '/catalog/:namespace/:kind/:name': entityRouteRef,
+          '/catalog': rootRouteRef,
         },
       },
     );
@@ -225,6 +231,7 @@ describe('EntityLayout', () => {
       {
         mountedRoutes: {
           '/catalog/:namespace/:kind/:name': entityRouteRef,
+          '/catalog': rootRouteRef,
         },
       },
     );

plugins/catalog/src/components/EntityLayout/EntityLayout.tsx

@@ -33,6 +33,7 @@ import {
   attachComponentData,
   IconComponent,
   useElementFilter,
+  useRouteRef,
   useRouteRefParams,
 } from '@backstage/core-plugin-api';
 import {
@@ -50,6 +51,7 @@ import { Alert } from '@material-ui/lab';
 import React, { useEffect, useState } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
 import { EntityContextMenu } from '../EntityContextMenu/EntityContextMenu';
+import { rootRouteRef } from '../../routes';
 
 /** @public */
 export type EntityLayoutRouteProps = {
@@ -229,10 +231,11 @@ export const EntityLayout = (props: EntityLayoutProps) => {
   const [confirmationDialogOpen, setConfirmationDialogOpen] = useState(false);
   const [inspectionDialogOpen, setInspectionDialogOpen] = useState(false);
   const navigate = useNavigate();
+  const catalogRoute = useRouteRef(rootRouteRef);
   const cleanUpAfterRemoval = async () => {
     setConfirmationDialogOpen(false);
     setInspectionDialogOpen(false);
-    navigate('/');
+    navigate(catalogRoute());
   };
 
   // Make sure to close the dialog if the user clicks links in it that navigate

plugins/org/src/components/Cards/Group/MembersList/MembersListCard.test.tsx

@@ -31,7 +31,7 @@ import {
   mockedCatalogApiSupportingGroups,
 } from '../../../../__testUtils__/catalogMocks';
 import { permissionApiRef } from '@backstage/plugin-permission-react';
-import { EntityLayout } from '@backstage/plugin-catalog';
+import { EntityLayout, catalogPlugin } from '@backstage/plugin-catalog';
 import { screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { Observable } from '@backstage/types';
@@ -63,6 +63,8 @@ const mockedStarredEntitiesApi: Partial<StarredEntitiesApi> = {
   },
 };
 
+const rootRouteRef = catalogPlugin.routes.catalogIndex;
+
 describe('MemberTab Test', () => {
   const groupEntity: GroupEntity = {
     apiVersion: 'backstage.io/v1alpha1',
@@ -122,6 +124,7 @@ describe('MemberTab Test', () => {
       {
         mountedRoutes: {
           '/catalog/:namespace/:kind/:name': entityRouteRef,
+          '/catalog': rootRouteRef,
         },
       },
     );
@@ -151,6 +154,7 @@ describe('MemberTab Test', () => {
       {
         mountedRoutes: {
           '/catalog/:namespace/:kind/:name': entityRouteRef,
+          '/catalog': rootRouteRef,
         },
       },
     );
@@ -179,6 +183,7 @@ describe('MemberTab Test', () => {
         {
           mountedRoutes: {
             '/catalog/:namespace/:kind/:name': entityRouteRef,
+            '/catalog': rootRouteRef,
           },
         },
       );
@@ -206,6 +211,7 @@ describe('MemberTab Test', () => {
         {
           mountedRoutes: {
             '/catalog/:namespace/:kind/:name': entityRouteRef,
+            '/catalog': rootRouteRef,
           },
         },
       );
@@ -231,6 +237,7 @@ describe('MemberTab Test', () => {
         {
           mountedRoutes: {
             '/catalog/:namespace/:kind/:name': entityRouteRef,
+            '/catalog': rootRouteRef,
           },
         },
       );
@@ -265,6 +272,7 @@ describe('MemberTab Test', () => {
         {
           mountedRoutes: {
             '/catalog/:namespace/:kind/:name': entityRouteRef,
+            '/catalog': rootRouteRef,
           },
         },
       );
@@ -299,6 +307,7 @@ describe('MemberTab Test', () => {
         {
           mountedRoutes: {
             '/catalog/:namespace/:kind/:name': entityRouteRef,
+            '/catalog': rootRouteRef,
           },
         },
       );