refactor: extract shared ContributorsList component

frontend/__tests__/a11y/components/TopContributorsList.a11y.test.tsx → frontend/__tests__/a11y/components/ContributorsList.a11y.test.tsx

@@ -2,7 +2,8 @@ import { render } from '@testing-library/react'
 import { axe, toHaveNoViolations } from 'jest-axe'
 import { ReactNode } from 'react'
 import { Contributor } from 'types/contributor'
-import TopContributorsList from 'components/TopContributorsList'
+import { getMemberUrl } from 'utils/urlFormatter'
+import ContributorsList from 'components/ContributorsList'
 
 expect.extend(toHaveNoViolations)
 
@@ -53,9 +54,11 @@ const mockContributors: Contributor[] = [
   },
 ]
 
-describe('TopContributorsList Accessibility', () => {
+describe('ContributorsList Accessibility', () => {
   it('should not have any accessibility violations', async () => {
-    const { container } = render(<TopContributorsList contributors={mockContributors} />)
+    const { container } = render(
+      <ContributorsList contributors={mockContributors} getUrl={getMemberUrl} />
+    )
 
     const results = await axe(container)
 

frontend/__tests__/unit/components/CardDetailsPage.test.tsx

@@ -359,25 +359,27 @@ jest.mock('components/ToggleableList', () => ({
   ),
 }))
 
-jest.mock('components/TopContributorsList', () => ({
+jest.mock('components/ContributorsList', () => ({
   __esModule: true,
   default: ({
     contributors,
     maxInitialDisplay,
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     icon,
+    label = 'Contributors',
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    label,
+    getUrl,
     ...props
   }: {
     contributors: unknown[]
     icon?: unknown
     label?: string
     maxInitialDisplay: number
+    getUrl: (login: string) => string
     [key: string]: unknown
   }) => (
-    <div data-testid="top-contributors-list" {...props}>
-      Top Contributors ({contributors.length} items, max display: {maxInitialDisplay})
+    <div data-testid="contributors-list" {...props}>
+      {label} ({contributors.length} items, max display: {maxInitialDisplay})
     </div>
   ),
 }))
@@ -964,7 +966,7 @@ describe('CardDetailsPage', () => {
     it('passes correct props to child components', () => {
       render(<CardDetailsPage {...defaultProps} topContributors={mockContributors} />)
 
-      expect(screen.getByTestId('top-contributors-list')).toHaveTextContent(
+      expect(screen.getByTestId('contributors-list')).toHaveTextContent(
         'Top Contributors (2 items, max display: 12)'
       )
     })
@@ -1054,9 +1056,7 @@ describe('CardDetailsPage', () => {
       )
 
       expect(screen.getByTestId('health-metrics')).toHaveTextContent('Health Metrics (1 items)')
-      expect(screen.getByTestId('top-contributors-list')).toHaveTextContent(
-        'Top Contributors (2 items'
-      )
+      expect(screen.getByTestId('contributors-list')).toHaveTextContent('Top Contributors (2 items')
       expect(screen.getByTestId('repositories-card')).toHaveTextContent('Repositories (2 items)')
     })
 
@@ -1165,7 +1165,7 @@ describe('CardDetailsPage', () => {
 
       render(<CardDetailsPage {...defaultProps} topContributors={largeContributorsList} />)
 
-      expect(screen.getByTestId('top-contributors-list')).toHaveTextContent(
+      expect(screen.getByTestId('contributors-list')).toHaveTextContent(
         'Top Contributors (50 items, max display: 12)'
       )
     })
@@ -1225,7 +1225,7 @@ describe('CardDetailsPage', () => {
 
       render(<CardDetailsPage {...defaultProps} topContributors={largeContributors} />)
 
-      expect(screen.getByTestId('top-contributors-list')).toHaveTextContent(
+      expect(screen.getByTestId('contributors-list')).toHaveTextContent(
         'Top Contributors (1000 items, max display: 12)'
       )
     })
@@ -1375,7 +1375,7 @@ describe('CardDetailsPage', () => {
       expect(screen.getByText('Project summary text')).toBeInTheDocument()
       expect(screen.getByText('User summary content')).toBeInTheDocument()
       expect(screen.getByTestId('health-metrics')).toBeInTheDocument()
-      expect(screen.getByTestId('top-contributors-list')).toBeInTheDocument()
+      expect(screen.getByTestId('contributors-list')).toBeInTheDocument()
       expect(screen.getByTestId('repositories-card')).toBeInTheDocument()
       expect(screen.getByTestId('sponsor-card')).toBeInTheDocument()
     })