feat(website): add contributors section to landing page and fix star link

website/src/app/layout/site-header.html

@@ -40,7 +40,7 @@
         <span class="hidden sm:inline">Sponsor</span>
       </a>
       <a
-        href="https://github.com/tomalaforge/angular-challenges"
+        href="https://github.com/tomalaforge/angular-challenges/stargazers"
         target="_blank"
         rel="noopener"
         aria-label="Star the repository on GitHub"

website/src/app/pages/landing/landing.html

@@ -157,6 +157,23 @@ <h2 class="mb-2 font-semibold text-neutral-900 dark:text-neutral-100">{{ card.ti
       }
     </section>
 
+    <!-- Contributors -->
+    @if (contributors().length > 0) {
+      <section class="mb-16 flex flex-wrap items-center justify-center gap-3 text-sm text-neutral-600 dark:text-neutral-400">
+        <span class="font-medium">Contributors:</span>
+        <span class="flex flex-wrap -space-x-2">
+          @for (contributor of contributors(); track contributor.login) {
+            <a [href]="'https://github.com/' + contributor.login" [title]="contributor.login" target="_blank" rel="noopener">
+              <img
+                [src]="contributor.avatar"
+                [alt]="contributor.login"
+                class="relative h-8 w-8 rounded-full ring-2 ring-white transition hover:z-10 hover:scale-110 dark:ring-neutral-950" />
+            </a>
+          }
+        </span>
+      </section>
+    }
+
     <!-- Newsletter -->
     <section class="relative mx-auto mb-20 max-w-2xl overflow-hidden rounded-2xl border border-neutral-200 bg-neutral-100/40 px-6 py-10 text-center sm:px-12 dark:border-neutral-800 dark:bg-neutral-900/40">
       <div

website/src/app/pages/landing/landing.ts

@@ -12,7 +12,7 @@ import { MANIFEST } from '../../generated/manifest';
 import { Consent } from '../../consent';
 import { SiteHeader } from '../../layout/site-header';
 
-interface Sponsor {
+interface GithubUser {
   login: string;
   avatar: string;
 }
@@ -40,14 +40,22 @@ export class Landing {
     this.isBrowser ? '/api/stats' : undefined,
   );
 
-  protected readonly sponsorsResource = httpResource<{ sponsors: Sponsor[] }>(() =>
+  protected readonly sponsorsResource = httpResource<{ sponsors: GithubUser[] }>(() =>
     this.isBrowser ? '/api/sponsors' : undefined,
   );
 
   protected readonly sponsors = computed(
     () => this.sponsorsResource.value()?.sponsors ?? [],
   );
 
+  protected readonly contributorsResource = httpResource<{ contributors: GithubUser[] }>(() =>
+    this.isBrowser ? '/api/contributors' : undefined,
+  );
+
+  protected readonly contributors = computed(
+    () => this.contributorsResource.value()?.contributors ?? [],
+  );
+
   protected readonly cards = [
     {
       icon: 'zap',

website/src/server/github-api.ts

@@ -371,6 +371,20 @@ githubApi.get('/leaderboard/:board', async (req, res) => {
   res.json({ entries });
 });
 
+/** All repository contributors for the landing page. */
+githubApi.get('/contributors', async (_req, res) => {
+  const { status, data } = await github(`/repos/${REPO}/contributors?per_page=100`, 3600);
+  if (status !== 200) {
+    res.status(503).json({ error: 'github request failed' });
+    return;
+  }
+  const contributors = (data as any[])
+    .filter((u) => !EXCLUDED_USERS.has(u.login) && u.type === 'User')
+    .map((u) => ({ login: u.login, avatar: u.avatar_url }));
+  res.set('Cache-Control', 'public, s-maxage=3600, stale-while-revalidate=86400');
+  res.json({ contributors });
+});
+
 /** Repository stats for the landing page. */
 githubApi.get('/stats', async (_req, res) => {
   const { status, data } = await github(`/repos/${REPO}`, 900);