Only show the top supporters on hompage

I no longer have time to maintain the full contributors list unfortunately

Author: misode

src/app/pages/Home.tsx

@@ -1,13 +1,12 @@
 import { useMemo } from 'preact/hooks'
-import contributors from '../../contributors.json'
+import supporters from '../../supporters.json'
 import { Card, ChangelogEntry, Footer, GeneratorCard, Giscus, ToolCard, ToolGroup } from '../components/index.js'
 import { WhatsNewTime } from '../components/whatsnew/WhatsNewTime.jsx'
 import { useLocale, useTitle } from '../contexts/index.js'
 import { useAsync } from '../hooks/useAsync.js'
 import { useMediaQuery } from '../hooks/useMediaQuery.js'
 import { fetchChangelogs, fetchVersions, fetchWhatsNew } from '../services/DataFetcher.js'
 import { Store } from '../Store.js'
-import { shuffle } from '../Utils.js'
 
 const MIN_FAVORITES = 2
 const MAX_FAVORITES = 5
@@ -153,32 +152,20 @@ function WhatsNew() {
 }
 
 function Contributors() {
-	const supporters = useMemo(() => {
-		return contributors.filter(c => c.types.includes('support') || c.types.includes('infrastructure'))
-	}, [])
-
-	const otherContributors = useMemo(() => {
-		return shuffle(contributors.filter(c => !supporters.includes(c)))
-	}, [])
-
 	return <div class="contributors">
 		<h3>Supporters</h3>
 		<ContributorsList list={supporters} large />
-		<h3>Contributors</h3>
-		<ContributorsList list={otherContributors} />
 	</div>
 }
 
 interface ContributorsListProps {
-	list: typeof contributors
+	list: typeof supporters
 	large?: boolean
 }
 function ContributorsList({ list, large }: ContributorsListProps) {
-	const { locale } = useLocale()
-
 	return <div class={`contributors-list ${large ? 'contributors-large' : ''}`}>
 		{list.map((c) =>
-			<a class="tooltipped tip-se" href={c.url} target="_blank" aria-label={`${c.name}\n${c.types.map(t => `• ${locale('contributor.' + t)}`).join('\n')}`}>
+			<a class="tooltipped tip-se" href={c.url} target="_blank" aria-label={c.name}>
 				<img width={large ? 48 : 32} height={large ? 48 : 32} src={c.avatar} alt={c.name} loading="lazy" />
 			</a>
 		)}