From 76be08be1c6fd5e865564016541736150dfe8579 Mon Sep 17 00:00:00 2001
From: Christoph Witzko <github@christophwitzko.com>
Date: Tue, 10 Oct 2023 16:16:16 +0200
Subject: [PATCH] feat: link to latest release

---
 app/components/PluginCard.tsx | 16 ++++++----------
 app/page.tsx                  |  1 +
 2 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/app/components/PluginCard.tsx b/app/components/PluginCard.tsx
index b87a8d0..7dc4185 100644
--- a/app/components/PluginCard.tsx
+++ b/app/components/PluginCard.tsx
@@ -8,10 +8,10 @@ import {
   Text,
   Tooltip,
 } from "@radix-ui/themes";
+import { formatDistanceToNow } from "date-fns";
+
 import style from "./PluginCard.module.css";
-import Link from "next/link";
-import { CheckCircledIcon } from "@radix-ui/react-icons";
-import { getPlugin } from "@/app/lib/registry";
+import { getPlugin } from "../lib/registry";
 
 export async function PluginCard({ name }: { name: string }) {
   const plugin = await getPlugin(name);
@@ -29,14 +29,10 @@ export async function PluginCard({ name }: { name: string }) {
               </Heading>
             </Flex>
             <Flex direction="row" gap="3" justify="end" height="max-content">
-              <Tooltip content="This is an official go-semantic-release plugin.">
-                <Badge color="cyan">
-                  <CheckCircledIcon />
-                  official
-                </Badge>
-              </Tooltip>
               <Tooltip
-                content={`This is the latest release of the plugin and was published ${plugin.LatestRelease.CreatedAt}.`}
+                content={`Published ${formatDistanceToNow(
+                  new Date(plugin.LatestRelease.CreatedAt),
+                )} ago.`}
               >
                 <Badge color="green">v{plugin.LatestRelease.Version}</Badge>
               </Tooltip>
diff --git a/app/page.tsx b/app/page.tsx
index 839cc76..e184186 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -9,6 +9,7 @@ export default async function Home({
   searchParams: { s: string | undefined };
 }) {
   const plugins = await getAllPlugins();
+  plugins.sort((a, b) => a.localeCompare(b));
   const filteredPlugins = plugins.filter(
     (p) =>
       searchParams.s === undefined || p.includes(searchParams.s.toLowerCase()),