@grove-dev/astro 0.1.5 → 0.2.5

package/templates/default/src/components/AppCard.astro

@@ -1,248 +0,0 @@
----
-import type { OpenSourceApp } from "../data/types";
-import Icon from "./icons/Icon.astro";
-import { getOwnerAndRepoFromRepoUrl, getOwnerAvatarUrl } from "../lib/repo";
-import { formatStars, formatRelative } from "../lib/format";
-
-interface Props {
-  app: OpenSourceApp;
-}
-
-const { app } = Astro.props;
-
-// Stale apps: a repo with no commits in 365+ days is not really
-// "mature" — it's a snapshot. Override the label so we don't show
-// "Mature" on a 6-year-old fork. (See healthFromSignals in
-// scripts/app-schema.mjs for how status is computed.)
-const isStale = app.status === "stale";
-
-const label = isStale
-  ? "stale"
-  : app.labels?.find((l) => l === "new" || l === "hot" || l === "mature") ??
-    app.labels?.[0];
-
-const labelClass = label === "new"
-  ? "badge-new"
-  : label === "hot"
-    ? "badge-hot"
-    : label === "mature"
-      ? "badge-mature"
-      : label === "stale"
-        ? "badge-stale"
-        : "";
-
-// Curated = at least one of the hand-written fields is filled in. These
-// are the apps a human actually looked at. Shown as a "verified" mark
-// next to the label badge so it doesn't dominate the card.
-const isCurated = Boolean(
-  app.bestFor?.length || app.whyListed?.length || app.caveats?.length || app.scores,
-);
-
-// Initials for placeholder logo (first 2 letters of any word in name).
-const initials = app.name
-  .split(/\s+/)
-  .map((w) => w[0])
-  .filter(Boolean)
-  .slice(0, 2)
-  .join("")
-  .toUpperCase();
-
-// Resolve a logo URL for this app:
-//   1. Explicit `logoUrl` on the app
-//   2. GitHub owner avatar (extracted from `repoUrl`)
-//   3. Initials placeholder.
-const { owner, repo } = getOwnerAndRepoFromRepoUrl(app.repoUrl);
-const logoUrl = app.logoUrl ?? getOwnerAvatarUrl(owner, 80);
-
-// Show up to 4 platforms; overflow as +N.
-const visiblePlatforms = app.platforms.slice(0, 4);
-const platformOverflow = app.platforms.length - visiblePlatforms.length;
-
-// Show up to 3 stack chips (primary + first 2 secondary).
-const allStacks = [app.stack, ...(app.stacks ?? [])].filter(Boolean);
-const visibleStacks = allStacks.slice(0, 3);
-const stackOverflow = allStacks.length - visibleStacks.length;
-
-const starsLabel = formatStars(app.stars);
-const updatedLabel = formatRelative(app.lastCommitAt);
-
-const detailHref = `/apps/${app.slug}`;
-const repoHref = app.repoUrl;
----
-
-<article
-  class="card card-hover group relative flex h-full flex-col gap-3 p-4"
->
-  {/* Top row: logo + name + label badge. */}
-  <header class="relative z-10 flex items-start gap-3">
-    <a
-      href={detailHref}
-      aria-label={`Open ${app.name} details`}
-      class="absolute inset-0 z-0 rounded-lg"
-    ></a>
-
-    {logoUrl ? (
-      <img
-        src={logoUrl}
-        alt={`${app.name} avatar`}
-        width="40"
-        height="40"
-        loading="lazy"
-        decoding="async"
-        class="h-10 w-10 shrink-0 rounded-md border border-ink-200 bg-white object-cover dark:border-ink-800 dark:bg-ink-900"
-      />
-    ) : (
-      <span
-        aria-hidden="true"
-        class="flex h-10 w-10 shrink-0 items-center justify-center rounded-md border border-ink-200 bg-ink-50 text-2xs font-semibold text-ink-700 dark:border-ink-800 dark:bg-ink-900/60 dark:text-ink-300"
-      >
-        {initials}
-      </span>
-    )}
-
-    <div class="flex min-w-0 flex-1 flex-col gap-0.5">
-      <h3
-        class="m-0 truncate text-[0.9375rem] font-semibold tracking-tight text-ink-900 group-hover:underline dark:text-ink-100"
-      >
-        {/* Name → detail page (not GitHub repo). Stacks above the
-            stretched link via z-index. */}
-        <a
-          href={detailHref}
-          class="relative z-10 text-inherit no-underline"
-        >
-          {app.name}
-        </a>
-      </h3>
-      <span class="truncate text-2xs text-ink-500 dark:text-ink-400">
-        {owner ? (
-          <>
-            <a
-              href={repoHref}
-              target="_blank"
-              rel="noopener noreferrer"
-              class="relative z-10 font-mono text-ink-500 hover:text-ink-900 dark:text-ink-400 dark:hover:text-ink-100"
-            >
-              <span class="text-ink-400 dark:text-ink-500">@</span>{owner}{repo ? <span class="text-ink-400 dark:text-ink-500">/{repo}</span> : ""}
-            </a>
-            <span class="mx-1 text-ink-300 dark:text-ink-700">·</span>
-            {app.category}
-          </>
-        ) : (
-          app.category
-        )}
-      </span>
-    </div>
-
-    <div class="flex shrink-0 flex-col items-end gap-1">
-      {label && (
-        <span class={`badge ${labelClass} text-[10px] leading-none`}>
-          {label}
-        </span>
-      )}
-      {isCurated && (
-        <span
-          class="inline-flex items-center gap-1 text-[10px] font-medium uppercase tracking-wider text-emerald-700 dark:text-emerald-400"
-          title="Hand-curated entry: bestFor, whyListed, caveats, or scores are filled in"
-        >
-          <svg viewBox="0 0 16 16" width="10" height="10" aria-hidden="true" fill="currentColor">
-            <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0Zm3.41 5.09a.75.75 0 0 0-1.06 0L6.75 8.69 5.65 7.59a.75.75 0 1 0-1.06 1.06l1.65 1.65a.75.75 0 0 0 1.06 0l4.11-4.11a.75.75 0 0 0 0-1.06Z"/>
-          </svg>
-          curated
-        </span>
-      )}
-    </div>
-  </header>
-
-  {/* Description */}
-  <p
-    class="relative z-10 m-0 line-clamp-2 text-[0.8125rem] leading-relaxed text-ink-500 dark:text-ink-400"
-  >
-    {app.description}
-  </p>
-
-  {/* Metadata row: stars · updated · license — the three signals
-      that answer "is this alive and usable?" at a glance. */}
-  <div class="relative z-10 flex flex-wrap items-center gap-x-3 gap-y-1 text-2xs text-ink-500 dark:text-ink-400">
-    {starsLabel !== null && (
-      <span class="inline-flex items-center gap-1" title={`${app.stars} stars on GitHub`}>
-        <svg viewBox="0 0 16 16" width="11" height="11" aria-hidden="true" fill="currentColor" class="text-amber-500">
-          <path d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Z"/>
-        </svg>
-        <span class="font-mono">{starsLabel}</span>
-      </span>
-    )}
-    {app.lastCommitAt && (
-      <span class="inline-flex items-center gap-1" title={`Last commit ${app.lastCommitAt}`}>
-        <svg viewBox="0 0 16 16" width="11" height="11" aria-hidden="true" fill="currentColor" class="text-ink-400">
-          <path d="M8 2a6 6 0 1 0 0 12A6 6 0 0 0 8 2Zm0 1.5a4.5 4.5 0 1 1 0 9 4.5 4.5 0 0 1 0-9Zm-.5 1.5a.5.5 0 0 0-1 0v3.25c0 .15.07.29.18.39l1.95 1.65a.5.5 0 0 0 .66-.76L7.5 7.55V5Z"/>
-        </svg>
-        <span class="font-mono">Updated {updatedLabel}</span>
-      </span>
-    )}
-    {app.license && (
-      <span class="inline-flex items-center gap-1" title={`License: ${app.license}`}>
-        <span class="font-mono uppercase tracking-wide text-[10px]">{app.license}</span>
-      </span>
-    )}
-  </div>
-
-  {/* Platform + stack chips, pushed to the bottom. */}
-  <div class="relative z-10 mt-auto flex flex-col gap-1.5">
-    <div class="flex flex-wrap items-center gap-1.5">
-      {visiblePlatforms.map((p) => (
-        <span class="chip">
-          <Icon name={p} category="platform" size={11} />
-          <span>{p}</span>
-        </span>
-      ))}
-      {platformOverflow > 0 && (
-        <span class="chip text-ink-400 dark:text-ink-500">+{platformOverflow}</span>
-      )}
-    </div>
-    <div class="flex flex-wrap items-center gap-1.5">
-      {visibleStacks.map((s) => (
-        <span class="chip chip-stack">
-          <Icon name={s} category="stack" size={11} />
-          <span>{s}</span>
-        </span>
-      ))}
-      {stackOverflow > 0 && (
-        <span class="chip chip-stack text-ink-400 dark:text-ink-500">+{stackOverflow}</span>
-      )}
-    </div>
-  </div>
-
-  {/* Footer row: View repo + Details links, separated from chips.
-      Stacks above the stretched link via z-index. */}
-  <footer class="relative z-10 mt-1 flex items-center justify-between gap-2 border-t border-ink-100 pt-2 text-2xs dark:border-ink-900">
-    <a
-      href={repoHref}
-      target="_blank"
-      rel="noopener noreferrer"
-      class="relative z-10 inline-flex items-center gap-1 font-medium text-ink-700 transition-colors hover:text-ink-900 dark:text-ink-300 dark:hover:text-ink-100"
-    >
-      View repo
-      <svg viewBox="0 0 16 16" width="10" height="10" aria-hidden="true" fill="currentColor">
-        <path d="M3.75 2A1.75 1.75 0 0 0 2 3.75v8.5C2 13.216 2.784 14 3.75 14h8.5A1.75 1.75 0 0 0 14 12.25v-3.5a.75.75 0 0 0-1.5 0v3.5a.25.25 0 0 1-.25.25h-8.5a.25.25 0 0 1-.25-.25v-8.5a.25.25 0 0 1 .25-.25h3.5a.75.75 0 0 0 0-1.5h-3.5Z"/>
-        <path d="M10 0a.75.75 0 0 0-.75.75v.75h-3a.75.75 0 0 0 0 1.5h3v.75A.75.75 0 0 0 10.75 4.5h2.5A.75.75 0 0 0 14 3.75v-2.5A.75.75 0 0 0 13.25.5H10Z"/>
-      </svg>
-    </a>
-    <a
-      href={detailHref}
-      class="relative z-10 inline-flex items-center gap-1 font-medium text-ink-500 transition-colors hover:text-ink-900 dark:text-ink-400 dark:hover:text-ink-100"
-    >
-      Details →
-    </a>
-  </footer>
-</article>
-
-<style>
-  @reference "../styles/global.css";
-
-  .chip {
-    @apply inline-flex items-center gap-1 rounded-md border border-ink-200 bg-white px-1.5 py-0.5 text-2xs font-medium text-ink-700 transition-colors dark:border-ink-800 dark:bg-ink-950 dark:text-ink-300;
-  }
-  .chip-stack {
-    @apply bg-ink-50 dark:bg-ink-900/60;
-  }
-</style>

package/templates/default/src/components/AppSection.astro

@@ -1,58 +0,0 @@
----
-import type { OpenSourceApp } from "../data/types";
-import AppCard from "./AppCard.astro";
-import SectionHeader from "./layout/SectionHeader.astro";
-import Container from "./layout/Container.astro";
-
-interface Props {
-  id: string;
-  title: string;
-  /** Plain-language subtitle explaining the lens. */
-  description: string;
-  apps: OpenSourceApp[];
-  /** Where the "View all" link points (typically the apps page with a
-   *  filter applied). */
-  viewAllHref?: string;
-  /** Custom label for the "View all" link. Lets us say
-   *  "View all new" / "View hot apps" / "View mature apps"
-   *  instead of the generic "View all". */
-  viewAllLabel?: string;
-}
-
-const {
-  id,
-  title,
-  description,
-  apps,
-  viewAllHref = "#",
-  viewAllLabel = "View all",
-} = Astro.props;
----
-
-<section id={id} class="section border-b border-ink-200 dark:border-ink-800 scroll-mt-20">
-  <Container>
-    <div class="flex items-end justify-between gap-4">
-      <SectionHeader title={title} description={description} />
-      <a
-        href={viewAllHref}
-        class="hidden shrink-0 pb-2 text-2xs font-medium text-ink-500 transition-colors hover:text-ink-900 sm:inline dark:text-ink-400 dark:hover:text-ink-100"
-      >
-        {viewAllLabel} →
-      </a>
-    </div>
-
-    <div
-      class="grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3"
-    >
-      {apps.map((app) => <AppCard app={app} />)}
-    </div>
-
-    <div class="mt-4 sm:hidden">
-      <a
-        href={viewAllHref}
-        class="text-2xs font-medium text-ink-500 transition-colors hover:text-ink-900 dark:text-ink-400 dark:hover:text-ink-100"
-        >{viewAllLabel} →</a
-      >
-    </div>
-  </Container>
-</section>

package/templates/default/src/components/AppsIndexRow.astro

@@ -1,230 +0,0 @@
----
-import type { OpenSourceApp } from "../data/types";
-import Icon from "./icons/Icon.astro";
-import {
-  getOwnerAndRepoFromRepoUrl,
-  getOwnerAvatarUrl,
-} from "../lib/repo";
-import { formatStars, formatRelative } from "../lib/format";
-
-interface Props {
-  app: OpenSourceApp;
-}
-
-const { app } = Astro.props;
-
-const { owner, repo } = getOwnerAndRepoFromRepoUrl(app.repoUrl);
-const avatar = app.logoUrl ?? getOwnerAvatarUrl(owner, 80);
-
-// "Mature" wins over "Hot" wins over "New" wins over anything else.
-const label =
-  app.labels?.find((l) => l === "mature" || l === "hot" || l === "new") ??
-  app.labels?.[0];
-
-const labelClass = label === "new"
-  ? "border-emerald-300/60 bg-emerald-50 text-emerald-800 dark:border-emerald-800/60 dark:bg-emerald-950/40 dark:text-emerald-300"
-  : label === "hot"
-    ? "border-orange-300/60 bg-orange-50 text-orange-800 dark:border-orange-800/60 dark:bg-orange-950/40 dark:text-orange-300"
-    : label === "mature"
-      ? "border-blue-300/60 bg-blue-50 text-blue-800 dark:border-blue-800/60 dark:bg-blue-950/40 dark:text-blue-300"
-      : "border-ink-200 bg-ink-50 text-ink-700 dark:border-ink-800 dark:bg-ink-900/60 dark:text-ink-300";
-
-const isCurated = Boolean(
-  app.bestFor?.length || app.whyListed?.length || app.caveats?.length || app.scores,
-);
-
-// Initials for placeholder logo.
-const initials = app.name
-  .split(/\s+/)
-  .map((w) => w[0])
-  .filter(Boolean)
-  .slice(0, 2)
-  .join("")
-  .toUpperCase();
-
-const allStacks = [app.stack, ...(app.stacks ?? [])].filter(Boolean);
-const visibleStacks = allStacks.slice(0, 4);
-const stackOverflow = allStacks.length - visibleStacks.length;
-
-const visiblePlatforms = app.platforms.slice(0, 4);
-const platformOverflow = app.platforms.length - visiblePlatforms.length;
-
-const starsLabel = formatStars(app.stars);
-const updatedLabel = formatRelative(app.lastCommitAt);
-
-const detailHref = `/apps/${app.slug}`;
-const repoHref = app.repoUrl;
----
-
-<article
-  class="apps-row group relative flex flex-col gap-3 rounded-lg border border-ink-200 bg-white p-4 transition-colors hover:border-ink-300 hover:shadow-[0_1px_2px_rgba(0,0,0,0.04),0_4px_12px_-2px_rgba(0,0,0,0.06)] dark:border-ink-800 dark:bg-ink-950 dark:hover:border-ink-700 dark:hover:shadow-[0_1px_2px_rgba(0,0,0,0.4),0_4px_12px_-2px_rgba(0,0,0,0.3)]"
-  data-slug={app.slug}
-  data-stack={app.stack}
-  data-stacks={allStacks.join("|")}
-  data-category={app.category ?? ""}
-  data-platforms={(app.platforms ?? []).join("|")}
-  data-labels={(app.labels ?? []).join("|")}
-  data-status={app.status ?? ""}
-  data-license={app.license ?? ""}
-  data-stars={app.stars ?? 0}
-  data-updated={app.lastCommitAt ?? ""}
-  data-name={app.name.toLowerCase()}
-  data-owner={(owner ?? "").toLowerCase()}
-  data-q={(app.description ?? "").toLowerCase()}
->
-  {/* Header: avatar + name + label */}
-  <header class="flex items-start gap-3">
-    <a
-      href={detailHref}
-      class="relative z-10 flex shrink-0"
-      aria-label={`Open ${app.name} details`}
-    >
-      {avatar ? (
-        <img
-          src={avatar}
-          alt={`${app.name} avatar`}
-          width="44"
-          height="44"
-          loading="lazy"
-          decoding="async"
-          class="h-11 w-11 rounded-md border border-ink-200 bg-white object-cover dark:border-ink-800 dark:bg-ink-900"
-        />
-      ) : (
-        <span
-          aria-hidden="true"
-          class="flex h-11 w-11 items-center justify-center rounded-md border border-ink-200 bg-ink-50 text-sm font-semibold text-ink-700 dark:border-ink-800 dark:bg-ink-900/60 dark:text-ink-300"
-        >
-          {initials}
-        </span>
-      )}
-    </a>
-
-    <div class="flex min-w-0 flex-1 flex-col gap-0.5">
-      <div class="flex flex-wrap items-baseline gap-x-2 gap-y-0.5">
-        <h3 class="m-0 text-[1.0625rem] font-semibold tracking-tight text-ink-900 dark:text-ink-100">
-          <a
-            href={detailHref}
-            class="relative z-10 text-inherit no-underline hover:underline"
-          >
-            {app.name}
-          </a>
-        </h3>
-        {label && (
-          <span
-            class={`inline-flex items-center rounded border px-1.5 py-0 text-[10px] font-medium uppercase tracking-wider ${labelClass}`}
-          >
-            {label}
-          </span>
-        )}
-        {isCurated && (
-          <span
-            class="inline-flex items-center gap-1 text-[10px] font-medium uppercase tracking-wider text-emerald-700 dark:text-emerald-400"
-            title="Hand-curated entry"
-          >
-            <svg viewBox="0 0 16 16" width="9" height="9" aria-hidden="true" fill="currentColor">
-              <path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.75.75 0 0 1 1.06-1.06L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"/>
-            </svg>
-            curated
-          </span>
-        )}
-      </div>
-      <div class="flex flex-wrap items-center gap-x-1.5 gap-y-0.5 text-2xs text-ink-500 dark:text-ink-400">
-        {owner && (
-          <a
-            href={repoHref}
-            target="_blank"
-            rel="noopener noreferrer"
-            class="relative z-10 font-mono hover:text-ink-900 dark:hover:text-ink-100"
-          >
-            <span class="text-ink-400 dark:text-ink-500">@</span>{owner}
-            {repo && <span class="text-ink-400 dark:text-ink-500">/{repo}</span>}
-          </a>
-        )}
-        {owner && <span class="text-ink-300 dark:text-ink-700">·</span>}
-        <span>{app.category}</span>
-      </div>
-    </div>
-  </header>
-
-  {/* Description */}
-  <p class="apps-row-desc m-0 line-clamp-2 text-[0.8125rem] leading-relaxed text-ink-600 dark:text-ink-300">
-    {app.description}
-  </p>
-
-  {/* High-priority metadata row: stars · updated · license — the
-      "is this alive and usable?" answers at a glance. */}
-  <dl class="apps-row-meta grid grid-cols-3 gap-x-3 text-2xs">
-    {starsLabel !== null && (
-      <div class="flex items-baseline gap-1.5">
-        <dt class="sr-only">Stars</dt>
-        <dd class="inline-flex items-center gap-1 font-mono text-ink-700 dark:text-ink-300">
-          <svg viewBox="0 0 16 16" width="10" height="10" aria-hidden="true" fill="currentColor" class="text-amber-500">
-            <path d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Z"/>
-          </svg>
-          {starsLabel}
-        </dd>
-      </div>
-    )}
-    <div class="flex items-baseline gap-1.5">
-      <dt class="font-medium uppercase tracking-wider text-ink-500 dark:text-ink-400">Updated</dt>
-      <dd class="font-mono text-ink-700 dark:text-ink-300" title={app.lastCommitAt ?? ""}>{updatedLabel}</dd>
-    </div>
-    <div class="flex items-baseline gap-1.5">
-      <dt class="font-medium uppercase tracking-wider text-ink-500 dark:text-ink-400">License</dt>
-      <dd class="font-mono text-ink-700 dark:text-ink-300">{app.license ?? "—"}</dd>
-    </div>
-  </dl>
-
-  {/* Medium-priority metadata: platforms + stacks. Hidden in compact mode
-      (controlled by parent via the `data-density` attribute on the
-      results container). */}
-  <div class="apps-row-chips flex flex-col gap-1.5">
-    <div class="flex flex-wrap items-center gap-1.5">
-      {visiblePlatforms.map((p) => (
-        <span class="apps-chip inline-flex items-center gap-1 rounded-md border border-ink-200 bg-white px-1.5 py-0.5 text-2xs font-medium text-ink-700 dark:border-ink-800 dark:bg-ink-950 dark:text-ink-300">
-          <Icon name={p} category="platform" size={11} />
-          <span>{p}</span>
-        </span>
-      ))}
-      {platformOverflow > 0 && (
-        <span class="apps-chip text-2xs text-ink-400 dark:text-ink-500">+{platformOverflow}</span>
-      )}
-    </div>
-    <div class="flex flex-wrap items-center gap-1.5">
-      {visibleStacks.map((s) => (
-        <span class="apps-chip inline-flex items-center gap-1 rounded-md border border-ink-200 bg-ink-50 px-1.5 py-0.5 text-2xs font-medium text-ink-700 dark:border-ink-800 dark:bg-ink-900/60 dark:text-ink-300">
-          <Icon name={s} category="stack" size={11} />
-          <span>{s}</span>
-        </span>
-      ))}
-      {stackOverflow > 0 && (
-        <span class="apps-chip text-2xs text-ink-400 dark:text-ink-500">+{stackOverflow}</span>
-      )}
-    </div>
-  </div>
-
-  {/* Footer actions: View details + GitHub. Always visible (even in
-      compact mode) so the two primary actions never disappear. */}
-  <footer class="relative z-10 mt-1 flex items-center gap-2 border-t border-ink-100 pt-2 text-2xs dark:border-ink-900">
-    <a
-      href={detailHref}
-      class="relative z-10 inline-flex items-center gap-1 rounded-md border border-ink-200 bg-white px-2 py-1 font-medium text-ink-700 transition-colors hover:border-ink-300 hover:bg-ink-50 dark:border-ink-800 dark:bg-ink-950 dark:text-ink-300 dark:hover:border-ink-700 dark:hover:bg-ink-900/60"
-    >
-      View details
-      <svg viewBox="0 0 16 16" width="10" height="10" aria-hidden="true" fill="currentColor">
-        <path d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.75.75 0 0 1-1.06-1.06L9.94 8 6.22 4.28a.75.75 0 0 1 0-1.06Z"/>
-      </svg>
-    </a>
-    <a
-      href={repoHref}
-      target="_blank"
-      rel="noopener noreferrer"
-      class="relative z-10 inline-flex items-center gap-1 rounded-md border border-ink-200 bg-white px-2 py-1 font-medium text-ink-700 transition-colors hover:border-ink-300 hover:bg-ink-50 dark:border-ink-800 dark:bg-ink-950 dark:text-ink-300 dark:hover:border-ink-700 dark:hover:bg-ink-900/60"
-    >
-      <svg viewBox="0 0 16 16" width="11" height="11" aria-hidden="true" fill="currentColor">
-        <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38v-1.33c-2.22.48-2.69-1.07-2.69-1.07-.36-.92-.89-1.17-.89-1.17-.73-.5.05-.49.05-.49.8.06 1.23.83 1.23.83.72 1.22 1.87.87 2.33.67.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48v2.19c0 .21.15.46.55.38A8 8 0 0 0 8 0Z"/>
-      </svg>
-      GitHub
-    </a>
-  </footer>
-</article>

package/templates/default/src/components/AppsPagination.astro

@@ -1,147 +0,0 @@
----
-/**
- * Pagination for the /apps list. Server-rendered; the page index in
- * the URL is the source of truth. "Load more" is not used here — the
- * full result set is small (a few hundred at most) so a real page
- * index is simpler and more shareable.
- *
- * The component renders Prev / numbered pages / Next, plus a small
- * "Page X of Y" caption. If there's only one page, returns nothing.
- */
-interface Props {
-  /** 1-based current page. */
-  current: number;
-  /** Total page count. */
-  total: number;
-  /**
-   * Build the URL for a target page. Caller passes the function so
-   * we can preserve any active filter query string. The function
-   * receives the target page and should return a href with that
-   * page query param updated.
-   */
-  hrefFor: (page: number) => string;
-  class?: string;
-}
-
-const { current, total, hrefFor, class: className = "" } = Astro.props;
-
-// Windowed page list: always show first, last, current ± 1. Hides
-// distant pages with "…". Keeps the bar compact for large total.
-function pageList(current: number, total: number): (number | "ellipsis")[] {
-  if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
-  const out: (number | "ellipsis")[] = [];
-  const add = (n: number) => {
-    if (out[out.length - 1] !== n) out.push(n);
-  };
-  add(1);
-  if (current > 3) out.push("ellipsis");
-  for (let p = Math.max(2, current - 1); p <= Math.min(total - 1, current + 1); p++) add(p);
-  if (current < total - 2) out.push("ellipsis");
-  add(total);
-  return out;
-}
-
-const pages = pageList(current, total);
-const hasPrev = current > 1;
-const hasNext = current < total;
-const prevHref = hasPrev ? hrefFor(current - 1) : null;
-const nextHref = hasNext ? hrefFor(current + 1) : null;
-
-const baseBtn =
-  "inline-flex h-8 min-w-8 items-center justify-center rounded-md border px-2 text-2xs font-medium transition-colors";
-const inactiveBtn =
-  "border-ink-200 bg-white text-ink-700 hover:border-ink-300 hover:bg-ink-50 dark:border-ink-800 dark:bg-ink-950 dark:text-ink-300 dark:hover:border-ink-700 dark:hover:bg-ink-900/60";
-const activeBtn =
-  "border-ink-900 bg-ink-900 text-white dark:border-ink-100 dark:bg-ink-100 dark:text-ink-900";
-const disabledBtn =
-  "border-ink-200 bg-white text-ink-300 dark:border-ink-800 dark:bg-ink-950 dark:text-ink-700";
----
-
-{
-  total > 1 && (
-    <nav
-      class={`mt-8 flex flex-col items-center gap-3 sm:flex-row sm:justify-between ${className}`}
-      aria-label="Pagination"
-    >
-      <p class="m-0 text-2xs text-ink-500 dark:text-ink-400">
-        Page <span class="font-mono text-ink-700 dark:text-ink-300">{current}</span> of{" "}
-        <span class="font-mono text-ink-700 dark:text-ink-300">{total}</span>
-      </p>
-      <ul class="m-0 flex list-none flex-wrap items-center justify-center gap-1 p-0">
-        <li>
-          {hasPrev && prevHref ? (
-            <a
-              href={prevHref}
-              rel="prev"
-              class={`${baseBtn} ${inactiveBtn}`}
-              aria-label="Previous page"
-            >
-              <svg viewBox="0 0 16 16" width="11" height="11" aria-hidden="true" fill="currentColor">
-                <path d="M9.78 3.22a.75.75 0 0 1 0 1.06L6.56 7.5h6.69a.75.75 0 0 1 0 1.5H6.56l3.22 3.22a.75.75 0 1 1-1.06 1.06l-4.5-4.5a.75.75 0 0 1 0-1.06l4.5-4.5a.75.75 0 0 1 1.06 0Z"/>
-              </svg>
-              <span class="ml-1">Prev</span>
-            </a>
-          ) : (
-            <span class={`${baseBtn} ${disabledBtn} cursor-not-allowed`} aria-disabled="true">
-              <svg viewBox="0 0 16 16" width="11" height="11" aria-hidden="true" fill="currentColor">
-                <path d="M9.78 3.22a.75.75 0 0 1 0 1.06L6.56 7.5h6.69a.75.75 0 0 1 0 1.5H6.56l3.22 3.22a.75.75 0 1 1-1.06 1.06l-4.5-4.5a.75.75 0 0 1 0-1.06l4.5-4.5a.75.75 0 0 1 1.06 0Z"/>
-              </svg>
-              <span class="ml-1">Prev</span>
-            </span>
-          )}
-        </li>
-        {pages.map((p) =>
-          p === "ellipsis" ? (
-            <li>
-              <span class={`${baseBtn} border-transparent text-ink-400 dark:text-ink-500`} aria-hidden="true">
-                …
-              </span>
-            </li>
-          ) : p === current ? (
-            <li>
-              <span
-                class={`${baseBtn} ${activeBtn}`}
-                aria-current="page"
-                aria-label={`Page ${p}, current`}
-              >
-                {p}
-              </span>
-            </li>
-          ) : (
-            <li>
-              <a
-                href={hrefFor(p)}
-                class={`${baseBtn} ${inactiveBtn}`}
-                aria-label={`Go to page ${p}`}
-              >
-                {p}
-              </a>
-            </li>
-          ),
-        )}
-        <li>
-          {hasNext && nextHref ? (
-            <a
-              href={nextHref}
-              rel="next"
-              class={`${baseBtn} ${inactiveBtn}`}
-              aria-label="Next page"
-            >
-              <span class="mr-1">Next</span>
-              <svg viewBox="0 0 16 16" width="11" height="11" aria-hidden="true" fill="currentColor">
-                <path d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.5 4.5a.75.75 0 0 1 0 1.06l-4.5 4.5a.75.75 0 0 1-1.06-1.06L9.44 8.5H2.75a.75.75 0 0 1 0-1.5h6.69L6.22 4.28a.75.75 0 0 1 0-1.06Z"/>
-              </svg>
-            </a>
-          ) : (
-            <span class={`${baseBtn} ${disabledBtn} cursor-not-allowed`} aria-disabled="true">
-              <span class="mr-1">Next</span>
-              <svg viewBox="0 0 16 16" width="11" height="11" aria-hidden="true" fill="currentColor">
-                <path d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.5 4.5a.75.75 0 0 1 0 1.06l-4.5 4.5a.75.75 0 0 1-1.06-1.06L9.44 8.5H2.75a.75.75 0 0 1 0-1.5h6.69L6.22 4.28a.75.75 0 0 1 0-1.06Z"/>
-              </svg>
-            </span>
-          )}
-        </li>
-      </ul>
-    </nav>
-  )
-}