fix: remove unused className prop from AnchorTitle component

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

@@ -405,20 +405,20 @@ jest.mock('components/ContributorsList', () => ({
     maxInitialDisplay,
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     icon,
-    label = 'Contributors',
+    title = 'Contributors',
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     getUrl,
     ...props
   }: {
     contributors: unknown[]
     icon?: unknown
-    label?: string
+    title?: string
     maxInitialDisplay: number
     getUrl: (login: string) => string
     [key: string]: unknown
   }) => (
     <div data-testid="contributors-list" {...props}>
-      {label} ({contributors.length} items, max display: {maxInitialDisplay})
+      {title} ({contributors.length} items, max display: {maxInitialDisplay})
     </div>
   ),
 }))

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

@@ -302,7 +302,7 @@ describe('ContributorsList Component', () => {
   describe('Prop-based behavior', () => {
     it('uses custom label when provided', () => {
       const customLabel = 'Featured Contributors'
-      render(<ContributorsList {...defaultProps} label={customLabel} />)
+      render(<ContributorsList {...defaultProps} title={customLabel} />)
 
       expect(screen.getByText(customLabel)).toBeInTheDocument()
     })
@@ -551,7 +551,7 @@ describe('ContributorsList Component', () => {
     })
 
     it('renders title with proper structure', () => {
-      render(<ContributorsList {...defaultProps} label="Custom Title" />)
+      render(<ContributorsList {...defaultProps} title="Custom Title" />)
 
       expect(screen.getByTestId('anchor-title')).toBeInTheDocument()
       expect(screen.getByText('Custom Title')).toBeInTheDocument()

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

@@ -25,8 +25,8 @@ jest.mock('utils/dateFormatter', () => {
 })
 
 jest.mock('components/AnchorTitle', () => {
-  const MockAnchorTitle = ({ title, className }: { title: string; className?: string }) => {
-    return <h2 className={className}>{title}</h2>
+  const MockAnchorTitle = ({ title }: { title: string }) => {
+    return <h2>{title}</h2>
   }
 
   return {

frontend/src/app/about/page.tsx

@@ -144,7 +144,7 @@ const About = () => {
           <ContributorsList
             contributors={topContributors}
             icon={HiUserGroup}
-            label="Wall of Fame"
+            title="Wall of Fame"
             maxInitialDisplay={12}
             getUrl={getMemberUrl}
           />

frontend/src/app/page.tsx

@@ -159,7 +159,7 @@ export default function Home() {
           icon={FaCalendarAlt}
           title={
             <div className="flex items-center gap-2">
-              <AnchorTitle title="Upcoming Events" className="flex items-center leading-none" />
+              <AnchorTitle title="Upcoming Events" />
             </div>
           }
           className="overflow-hidden"
@@ -220,7 +220,7 @@ export default function Home() {
             icon={FaMapMarkerAlt}
             title={
               <div className="flex items-center gap-2">
-                <AnchorTitle title="New Chapters" className="flex items-center leading-none" />
+                <AnchorTitle title="New Chapters" />
               </div>
             }
             className="overflow-hidden"
@@ -266,7 +266,7 @@ export default function Home() {
             icon={FaFolder}
             title={
               <div className="flex items-center gap-2">
-                <AnchorTitle title="New Projects" className="flex items-center leading-none" />
+                <AnchorTitle title="New Projects" />
               </div>
             }
             className="overflow-hidden"
@@ -309,7 +309,7 @@ export default function Home() {
         <div className="mb-20">
           <div className="mb-4 flex items-center gap-2">
             <FaGlobe className="h-4 w-4" style={{ verticalAlign: 'middle' }} />
-            <AnchorTitle title="Chapters Worldwide" className="flex items-center leading-none" />
+            <AnchorTitle title="Chapters Worldwide" />
           </div>
           <ChapterMapWrapper
             geoLocData={geoLocData}
@@ -328,7 +328,7 @@ export default function Home() {
           contributors={data?.topContributors ?? []}
           icon={HiUserGroup}
           maxInitialDisplay={20}
-          label="Top Contributors"
+          title="Top Contributors"
           getUrl={getMemberUrl}
         />
         <div className="grid-cols-2 gap-4 lg:grid">
@@ -352,7 +352,7 @@ export default function Home() {
           icon={FaNewspaper}
           title={
             <div className="flex items-center gap-2">
-              <AnchorTitle title="News & Opinions" className="flex items-center leading-none" />
+              <AnchorTitle title="News & Opinions" />
             </div>
           }
           className="overflow-hidden"

frontend/src/components/AnchorTitle.tsx

@@ -4,7 +4,6 @@ import { scrollToAnchor, scrollToAnchorWithHistory } from 'utils/scrollToAnchor'
 import slugify from 'utils/slugify'
 
 interface AnchorTitleProps {
-  className?: string
   title: string
 }
 

frontend/src/components/CardDetailsPage.tsx

@@ -337,7 +337,7 @@ const DetailsCard = ({
             contributors={topContributors}
             icon={HiUserGroup}
             maxInitialDisplay={12}
-            label="Top Contributors"
+            title="Top Contributors"
             getUrl={getMemberUrl}
           />
         )}
@@ -346,7 +346,7 @@ const DetailsCard = ({
             icon={HiUserGroup}
             contributors={admins}
             maxInitialDisplay={6}
-            label="Admins"
+            title="Admins"
             getUrl={getMemberUrl}
           />
         )}
@@ -355,7 +355,7 @@ const DetailsCard = ({
             icon={HiUserGroup}
             contributors={mentors}
             maxInitialDisplay={6}
-            label="Mentors"
+            title="Mentors"
             getUrl={getMemberUrl}
           />
         )}
@@ -364,7 +364,7 @@ const DetailsCard = ({
             icon={HiUserGroup}
             contributors={mentees}
             maxInitialDisplay={6}
-            label="Mentees"
+            title="Mentees"
             getUrl={(login) => getMenteeUrl(programKey || '', entityKey || '', login)}
           />
         )}

frontend/src/components/ContributorsList.tsx

@@ -10,15 +10,15 @@ import ShowMoreButton from 'components/ShowMoreButton'
 
 interface ContributorsListProps {
   contributors: Contributor[]
-  label?: string
+  title?: string
   maxInitialDisplay?: number
   icon?: IconType
   getUrl: (login: string) => string
 }
 
 const ContributorsList = ({
   contributors,
-  label = 'Contributors',
+  title: label = 'Contributors',
   maxInitialDisplay = 12,
   icon,
   getUrl,
@@ -40,7 +40,7 @@ const ContributorsList = ({
       icon={icon}
       title={
         <div className="flex items-center gap-2">
-          <AnchorTitle title={label} className="flex items-center" />
+          <AnchorTitle title={label} />
         </div>
       }
     >

frontend/src/components/Milestones.tsx

@@ -30,7 +30,7 @@ const Milestones: React.FC<ProjectMilestonesProps> = ({
     <ItemCardList
       title={
         <div className="flex items-center gap-2">
-          <AnchorTitle title="Recent Milestones" className="flex items-center leading-none" />
+          <AnchorTitle title="Recent Milestones" />
         </div>
       }
       data={data}

frontend/src/components/RecentIssues.tsx

@@ -19,7 +19,7 @@ const RecentIssues: React.FC<RecentIssuesProps> = ({ data, showAvatar = true })
     <ItemCardList
       title={
         <div className="flex items-center gap-2">
-          <AnchorTitle title="Recent Issues" className="flex items-center leading-none" />
+          <AnchorTitle title="Recent Issues" />
         </div>
       }
       data={data}

frontend/src/components/RecentPullRequests.tsx

@@ -19,7 +19,7 @@ const RecentPullRequests: React.FC<RecentPullRequestsProps> = ({ data, showAvata
     <ItemCardList
       title={
         <div className="flex items-center gap-2">
-          <AnchorTitle title="Recent Pull Requests" className="flex items-center leading-none" />
+          <AnchorTitle title="Recent Pull Requests" />
         </div>
       }
       data={data}

frontend/src/components/RecentReleases.tsx

@@ -21,7 +21,7 @@ const RecentReleases: React.FC<RecentReleasesProps> = ({
       icon={FaTag}
       title={
         <div className="flex items-center gap-2">
-          <AnchorTitle title="Recent Releases" className="flex items-center leading-none" />
+          <AnchorTitle title="Recent Releases" />
         </div>
       }
     >