Add a new page that displays Mbin releases

package.json

@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "@iconify-json/material-symbols": "^1.1.82",
+    "@iconify-json/simple-icons": "^1.1.109",
     "@kobalte/core": "^0.13.3",
     "@solidjs/router": "^0.13.6",
     "@solidjs/start": "^1.0.2",

pnpm-lock.yaml

@@ -11,6 +11,9 @@ importers:
       '@iconify-json/material-symbols':
         specifier: ^1.1.82
         version: 1.1.82
+      '@iconify-json/simple-icons':
+        specifier: ^1.1.109
+        version: 1.1.109
       '@kobalte/core':
         specifier: ^0.13.3
         version: 0.13.3(solid-js@1.8.18)
@@ -500,6 +503,9 @@ packages:
   '@iconify-json/material-symbols@1.1.82':
     resolution: {integrity: sha512-E67LgMFiAbEVF7rE38ulZU6NeXcPvayFF4hUUqt3g33tWrLsDNqEFTSsPt03l34rH5uGGtHIakTqtBlZ+/hRkw==}
 
+  '@iconify-json/simple-icons@1.1.109':
+    resolution: {integrity: sha512-vIhIJQDdbS5R6kSyIHVBRCaR2jiFjVlbVtB4PAoLjQL45vJRHMTwkrFa536XcX7yW69HbQkoanydcyDjknI6pw==}
+
   '@iconify/types@2.0.0':
     resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
 
@@ -3634,6 +3640,10 @@ snapshots:
     dependencies:
       '@iconify/types': 2.0.0
 
+  '@iconify-json/simple-icons@1.1.109':
+    dependencies:
+      '@iconify/types': 2.0.0
+
   '@iconify/types@2.0.0': {}
 
   '@iconify/utils@2.1.25':

src/components/Chip.tsx

@@ -8,20 +8,26 @@ const Chip: ParentComponent<{
   classList?: {
     [k: string]: boolean | undefined;
   };
+  href?: string;
 }> = (props) => {
   return (
-    <span
+    <Dynamic
+      component={props.href ? 'a' : 'span'}
       class={
         'px-2 py-1 border rounded-lg inline-flex items-center ' + props.class
       }
-      classList={props.classList}
+      classList={{
+        'hover:text-blue-500': !!props.href,
+        ...props.classList,
+      }}
       title={props.title}
+      href={props.href}
     >
       <Show when={props.icon}>
         <Dynamic component={props.icon} class="pr-1" />
       </Show>
       {props.children}
-    </span>
+    </Dynamic>
   );
 };
 

src/components/Nav.tsx

@@ -21,6 +21,9 @@ export default function Nav() {
         <li class={navItemClass + active('/servers')}>
           <a href="/servers">Servers</a>
         </li>
+        <li class={navItemClass + active('/releases')}>
+          <a href="/releases">Releases</a>
+        </li>
 
         <span class="grow"></span>
 

src/initdata.js

@@ -145,20 +145,6 @@ const fetchServerInfo = async (domain) => {
 
   // A server is considered outdated if a newer version has been available for more than 30 days.
   const releaseIndex = releases.findIndex((v) => v.version === version);
-  console.log(
-    releaseIndex,
-    version,
-    releases[releaseIndex].version,
-    releases[releaseIndex].publishedAt,
-  );
-  if (releaseIndex > 0) {
-    console.log(
-      Date.now() - Date.parse(releases[releaseIndex - 1].publishedAt),
-      releases[releaseIndex - 1].publishedAt,
-      Date.now() - Date.parse(releases[releaseIndex - 1].publishedAt) >
-        1000 * 60 * 60 * 24 * 30,
-    );
-  }
   const versionOutdated =
     releaseIndex > 0 &&
     Date.now() - Date.parse(releases[releaseIndex - 1].publishedAt) >

src/routes/releases.tsx

@@ -1,6 +1,66 @@
+import { For } from 'solid-js';
+import releasesJson from '../../.output/data/releases.json';
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+} from '~/components/ui/accordion';
+import Markdown from '~/components/Markdown';
+import SimpleIconsGithub from '~icons/simple-icons/github';
+import { useSearchParams } from '@solidjs/router';
+
+const releases = releasesJson as Release[];
+
 export interface Release {
   version: string;
   publishedAt: string;
   githubUrl: string;
   body: string;
 }
+
+export default function ReleasesPage() {
+  const [searchParams] = useSearchParams();
+
+  return (
+    <main class="mx-auto p-4 max-w-screen-xl">
+      <h1 class="max-6-xs text-6xl text-sky-600 font-extralight uppercase my-16">
+        Mbin Releases
+      </h1>
+
+      <div class="mb-12 font-light">
+        Also view releases on{' '}
+        <a href="https://github.com/MbinOrg/mbin/releases" class="text-sky-600">
+          GitHub
+        </a>
+        .
+      </div>
+
+      <Accordion
+        multiple
+        defaultValue={[searchParams.version ?? releases[0].version]}
+      >
+        <For each={releases}>
+          {(release) => (
+            <AccordionItem value={release.version}>
+              <AccordionTrigger class="text-lg">
+                <span class="inline-flex items-center gap-3">
+                  {release.version}
+                  <span class="text-base font-light">
+                    {new Date(release.publishedAt).toLocaleDateString()}
+                  </span>
+                  <a href={release.githubUrl} class="hover:text-blue-500">
+                    <SimpleIconsGithub />
+                  </a>
+                </span>
+              </AccordionTrigger>
+              <AccordionContent>
+                <Markdown>{release.body}</Markdown>
+              </AccordionContent>
+            </AccordionItem>
+          )}
+        </For>
+      </Accordion>
+    </main>
+  );
+}

src/routes/servers.tsx

@@ -118,6 +118,17 @@ export default function ServersPage() {
       <h1 class="max-6-xs text-6xl text-sky-600 font-extralight uppercase my-16">
         Mbin Servers
       </h1>
+      <div class="mb-12 font-light">
+        Also view servers on{' '}
+        <a href="https://fedidb.org/software/mbin" class="text-sky-600">
+          FediDB
+        </a>{' '}
+        and{' '}
+        <a href="https://mbin.fediverse.observer/list" class="text-sky-600">
+          Fediverse Observer
+        </a>
+        .
+      </div>
       <div class="flex">
         <Checkbox
           id="open-registration"
@@ -190,6 +201,7 @@ export default function ServersPage() {
                   classList={{
                     'bg-red-900 bg-opacity-40': server.versionOutdated,
                   }}
+                  href={`/releases?version=${server.version}`}
                 >
                   Mbin {server.version}
                   <Show when={server.versionOutdated}>