- Search your language
+ Search your language(s)
- Or select the programming language you would like to find
+ Or select one or more programming languages you would like to find
repositories for.
+
- {mainLanguages.map(language => (
-
- ))}
+ {mainLanguages.map(language => {
+ const id = `lang-${language}`;
+ const checked = selected.includes(language);
+ return (
+
+ );
+ })}
-
diff --git a/src/app/(public)/_components/search-form.tsx b/src/app/(public)/_components/search-form.tsx
index 9ceacc4..cb52e32 100644
--- a/src/app/(public)/_components/search-form.tsx
+++ b/src/app/(public)/_components/search-form.tsx
@@ -26,20 +26,20 @@ export function SearchForm() {
}
function onSubmit({ searchQuery }: FormValues) {
+ if (!pathname.startsWith('/repos')) return;
+
+ const reposPathname = pathname as `/repos/${string}`;
const trimmedQuery = searchQuery.trim();
if (trimmedQuery !== '') {
const sp = new URLSearchParams(searchParams);
sp.set('q', trimmedQuery);
- router.push(`${pathname}?${sp.toString()}`);
+ router.push(`${reposPathname}?${sp.toString()}`);
}
}
return (
-
);
-}
\ No newline at end of file
+}
diff --git a/src/app/(public)/repos/loading.tsx b/src/app/(public)/repos/loading.tsx
new file mode 100644
index 0000000..7206bf3
--- /dev/null
+++ b/src/app/(public)/repos/loading.tsx
@@ -0,0 +1,109 @@
+export default function Loading() {
+ return (
+ <>
+ {/* Header Skeleton */}
+
+
+
+
+ {/* Title Section Skeleton */}
+
+
+ {/* Sorter Skeleton */}
+
+
+ {/* Stars Filter Skeleton */}
+
+
+ {/* Repository Cards Grid Skeleton */}
+
+ {Array.from({ length: 21 }).map((_, index) => (
+
+ {/* Repository Title */}
+
+
+ {/* Language and Stats */}
+
+
+ {/* Topics */}
+
+
+ {/* Action Button */}
+
+
+ ))}
+
+
+
+ {/* Pagination Skeleton */}
+
+
+
+ {Array.from({ length: 5 }).map((_, index) => (
+
+ ))}
+
+
+
+
+
+ );
+}
diff --git a/src/app/(public)/repos/page.tsx b/src/app/(public)/repos/page.tsx
new file mode 100644
index 0000000..3b03988
--- /dev/null
+++ b/src/app/(public)/repos/page.tsx
@@ -0,0 +1,157 @@
+import { env } from '@/env.mjs';
+import { notFound } from 'next/navigation';
+import { Header } from '@/app/(public)/_components/header';
+import { ScrollToTop } from './_components/scroll-to-top';
+import { RepoCard } from './_components/repo-card';
+import { Sorter } from './_components/sorter';
+import { StarsFilter } from './_components/stars-filter';
+import { Pagination } from './_components/pagination';
+import { auth } from '@/auth';
+import { db } from '@/lib/db/connection';
+import { accountsTable, reportsTable } from '@/lib/db/migrations/schema';
+import { eq } from 'drizzle-orm';
+import type { RepoResponse, RepoData, RepoItem, SearchParams } from '@/types';
+import { capitalize } from '@/lib/utils';
+
+export default async function ReposPage({
+ searchParams
+}: {
+ searchParams: Promise
;
+}) {
+ const sp = await searchParams;
+ const langs: string[] = Array.isArray(sp.l)
+ ? sp.l
+ : sp.l
+ ? [String(sp.l)]
+ : [];
+
+ const reposRes = await getRepos(langs, sp);
+ if (!reposRes) notFound();
+
+ const { repos, page } = reposRes;
+ const languagesList = langs
+ .map(lang => capitalize(decodeURIComponent(lang)))
+ .join(', ');
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+
+ {Intl.NumberFormat().format(repos.total_count)}
+ {' '}
+ repositories for{' '}
+
+ {sp.q ? sp.q + ' in ' + languagesList : languagesList}
+
+
+
+
+
+
+
+ {repos.items.map(repo => (
+
+ ))}
+
+
+
+
+