MembersListCard correction, test functions: wip

Signed-off-by: steff-petro <85114094+steff-petro@users.noreply.github.com>

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

@@ -19,6 +19,7 @@ import {
   CatalogApi,
   catalogApiRef,
   EntityProvider,
+  entityRouteRef,
   StarredEntitiesApi,
   starredEntitiesApiRef,
 } from '@backstage/plugin-catalog-react';
@@ -39,7 +40,6 @@ import { EntityLayout } from '@backstage/plugin-catalog';
 import { screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { Observable } from '@backstage/types';
-import { catalogIndexRouteRef } from '../../../../routes';
 
 // Mock needed because jsdom doesn't correctly implement box-sizing
 // https://github.com/ShinyChang/React-Text-Truncate/issues/70
@@ -127,7 +127,7 @@ describe('MemberTab Test', () => {
         </TestApiProvider>,
         {
           mountedRoutes: {
-            '/catalog': catalogIndexRouteRef,
+            '/catalog/:namespace/:kind/:name': entityRouteRef,
           },
         },
       ),
@@ -160,7 +160,7 @@ describe('MemberTab Test', () => {
         </TestApiProvider>,
         {
           mountedRoutes: {
-            '/catalog': catalogIndexRouteRef,
+            '/catalog/:namespace/:kind/:name': entityRouteRef,
           },
         },
       ),
@@ -189,7 +189,7 @@ describe('MemberTab Test', () => {
         </TestApiProvider>,
         {
           mountedRoutes: {
-            '/catalog': catalogIndexRouteRef,
+            '/catalog/:namespace/:kind/:name': entityRouteRef,
           },
         },
       );
@@ -217,7 +217,7 @@ describe('MemberTab Test', () => {
         </TestApiProvider>,
         {
           mountedRoutes: {
-            '/catalog': catalogIndexRouteRef,
+            '/catalog/:namespace/:kind/:name': entityRouteRef,
           },
         },
       );
@@ -244,7 +244,7 @@ describe('MemberTab Test', () => {
         </TestApiProvider>,
         {
           mountedRoutes: {
-            '/catalog': catalogIndexRouteRef,
+            '/catalog/:namespace/:kind/:name': entityRouteRef,
           },
         },
       );
@@ -280,7 +280,7 @@ describe('MemberTab Test', () => {
         </TestApiProvider>,
         {
           mountedRoutes: {
-            '/catalog': catalogIndexRouteRef,
+            '/catalog/:namespace/:kind/:name': entityRouteRef,
           },
         },
       );
@@ -316,7 +316,7 @@ describe('MemberTab Test', () => {
         </TestApiProvider>,
         {
           mountedRoutes: {
-            '/catalog': catalogIndexRouteRef,
+            '/catalog/:namespace/:kind/:name': entityRouteRef,
           },
         },
       );

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

@@ -20,11 +20,7 @@ import {
   UserEntity,
   stringifyEntityRef,
 } from '@backstage/catalog-model';
-import {
-  catalogApiRef,
-  entityRouteParams,
-  useEntity,
-} from '@backstage/plugin-catalog-react';
+import { catalogApiRef, useEntity } from '@backstage/plugin-catalog-react';
 import {
   Box,
   createStyles,
@@ -36,7 +32,6 @@ import {
 } from '@material-ui/core';
 import Pagination from '@material-ui/lab/Pagination';
 import React, { useState } from 'react';
-import { generatePath } from 'react-router-dom';
 import useAsync from 'react-use/lib/useAsync';
 
 import {
@@ -47,12 +42,12 @@ import {
   Link,
   OverflowTooltip,
 } from '@backstage/core-components';
-import { useApi, useRouteRef } from '@backstage/core-plugin-api';
+import { useApi } from '@backstage/core-plugin-api';
 import {
   getAllDesendantMembersForGroupEntity,
   removeDuplicateEntitiesFrom,
 } from '../../../../helpers/helpers';
-import { catalogIndexRouteRef } from '../../../../routes';
+import { EntityRefLink } from '@backstage/plugin-catalog-react';
 
 const useStyles = makeStyles((theme: Theme) =>
   createStyles({
@@ -71,7 +66,6 @@ const useStyles = makeStyles((theme: Theme) =>
 
 const MemberComponent = (props: { member: UserEntity }) => {
   const classes = useStyles();
-  const catalogLink = useRouteRef(catalogIndexRouteRef);
   const {
     metadata: { name: metaName, description },
     spec: { profile },
@@ -104,15 +98,7 @@ const MemberComponent = (props: { member: UserEntity }) => {
             textAlign="center"
           >
             <Typography variant="h6">
-              <Link
-                data-testid="user-link"
-                to={generatePath(
-                  `${catalogLink()}/:namespace/user/${metaName}`,
-                  entityRouteParams(props.member),
-                )}
-              >
-                <OverflowTooltip text={displayName} />
-              </Link>
+              <EntityRefLink entityRef={props.member} title={displayName} />
             </Typography>
             {profile?.email && (
               <Link to={`mailto:${profile.email}`}>