Add grouping for modded generators

src/app/components/generator/GeneratorList.tsx

@@ -8,8 +8,9 @@ import { GeneratorCard, TextInput, VersionSwitcher } from '../index.js'
 interface Props {
 	path?: string,
 	predicate?: (gen: ConfigGenerator) => boolean | undefined,
+	compare?: (first: ConfigGenerator, second: ConfigGenerator) => number,
 }
-export function GeneratorList({ predicate }: Props) {
+export function GeneratorList({ predicate , compare }: Props) {
 	const { locale } = useLocale()
 	const { version, changeVersion } = useVersion()
 
@@ -28,7 +29,7 @@ export function GeneratorList({ predicate }: Props) {
 	const filteredGenerators = useMemo(() => {
 		const results = versionedGenerators
 			.map(g => ({ ...g, name: locale(`generator.${g.id}`).toLowerCase() }))
-		return searchGenerators(results, search)
+		return searchGenerators(results, search, compare)
 	}, [versionedGenerators, search, locale])
 
 	return <div class="generator-list">
@@ -46,15 +47,18 @@ export function GeneratorList({ predicate }: Props) {
 	</div>
 }
 
-export function searchGenerators(generators: (ConfigGenerator & { name: string})[], search?: string) {
+export function searchGenerators(generators: (ConfigGenerator & { name: string})[], search?: string, compare?: (first: ConfigGenerator, second: ConfigGenerator) => number) {
 	if (search) {
 		const parts = search.split(' ').map(q => q.trim().toLowerCase()).filter(q => q.length > 0)
 		generators = generators.filter(g => parts.some(p => g.name.includes(p))
 			|| parts.some(p => g.path?.includes(p) ?? false)
 			|| parts.some(p => g.tags?.some(t => t.includes(p)) ?? false)
 			|| parts.some(p => g.aliases?.some(a => a.includes(p)) ?? false))
 	}
-	generators.sort((a, b) => a.name.localeCompare(b.name))
+	generators.sort((a, b) => {
+		const compared = compare ? compare(a, b) : 0
+		return compared == 0 ? a.name.localeCompare(b.name) : compared
+	})
 	if (search) {
 		generators.sort((a, b) => (b.name.startsWith(search) ? 1 : 0) - (a.name.startsWith(search) ? 1 : 0))
 	}

src/app/pages/Partners.tsx

@@ -10,7 +10,10 @@ export function Partners({}: Props) {
 
 	return <main>
 		<div class="legacy-container">
-			<GeneratorList predicate={gen => gen.tags?.includes('partners')} />
+			<GeneratorList predicate={gen => gen.tags?.includes('partners')} compare={(f, s) => {
+				// Compares by dependency but missing dependency will be treated last
+				return (s.dependency ?? "").localeCompare(f.dependency ?? "") * -1
+			}}/>
 		</div>
 		<Footer donate={false} />
 	</main>