From 1e11e31dd8861322461ea2134fbe9cac7043b11a Mon Sep 17 00:00:00 2001
From: James Osborne <incentive@circlewithadot.net>
Date: Fri, 6 Feb 2026 21:16:13 -0500
Subject: [PATCH] add connected instances list to aprelay

---
 index.html                      |  23 +++---
 services/aprelay.html           |  29 ++++++--
 services/aprelay.js             |  34 +++++++++
 services/aprelay_instances.json | 121 ++++++++++++++++++++++++++++++++
 style.css                       |  53 ++++++++++++++
 5 files changed, 244 insertions(+), 16 deletions(-)
 create mode 100644 services/aprelay_instances.json

diff --git a/index.html b/index.html
index 2819b1a..cf2ebd8 100644
--- a/index.html
+++ b/index.html
@@ -74,7 +74,7 @@
       </div>
       <!-- Second row (smaller) -->
       <div class="icon-row centralized-row smaller-row">
-        <a href="https://youtube.com/@incentive_music" target="_blank" rel="noopener">
+        <a href="https://youtube.com/@incentive_music" target_hint="_blank" rel="noopener">
           <img src="images/icon_youtube.png" alt="" />
         </a>
         <a href="https://www.twitch.tv/incentivebeats" target="_blank" rel="noopener">
@@ -92,7 +92,13 @@
         <a href="services/aprelay.html">
           <img src="images/icon_aprelay.png" alt="" />
         </a>
-        <a href="https://relibre.site">
+
+        <!-- NEW: hosting/services page -->
+        <a href="services/hosting.html">
+          <img src="images/cwad_logo.png" alt="Hosting & Administration" />
+        </a>
+
+        <a href="https://circlewithadot.net/relibre">
           <img src="images/icon_relibre.png" alt="" />
         </a>
       </div>
@@ -127,16 +133,13 @@
         <a href="https://pixelfed.circlewithadot.net/@incentive" target="_blank" rel="noopener">
           <img src="images/icon_pixelfed.png" alt="" />
         </a>
-        <a href="https://lemmy.ml/u/incentive" target="_blank" rel="noopener">
-          <img src="images/icon_lemmy.png" alt="" />
-        </a>
         <a href="https://blog.circlewithadot.net" target="_blank" rel="noopener">
           <img src="images/icon_writefreely.png" alt="" />
         </a>
       </div>
 
       <div class="icon-row centralized-row">
-        <a href="https://bsky.app/profile/did:plc:yulwemd4he5qhnzmtcbgzo5d" target="_blank" rel="noopener">
+        <a href="https://bsky.app/profile/incentive.bsky.social" target="_blank" rel="noopener">
           <img src="images/icon_bluesky.png" alt="" />
         </a>
         <a href="http://facebook.com/incentivemusic" target="_blank" rel="noopener">
@@ -145,10 +148,7 @@
         <a href="http://instagram.com/incentivemusic" target="_blank" rel="noopener">
           <img src="images/icon_instagram.png" alt="" />
         </a>
-        <a href="https://www.reddit.com/user/incentive_music/" target="_blank" rel="noopener">
-          <img src="images/icon_reddit.png" alt="" />
-        </a>
-        <a href="https://www.threads.com/fediverse_profile/incentive@mastodon.circlewithadot.net" target="_blank" rel="noopener">
+        <a href="https://www.threads.net/@incentivemusic" target="_blank" rel="noopener">
           <img src="images/icon_threads.png" alt="" />
         </a>
         <a href="https://x.com/incentivemusic" target="_blank" rel="noopener">
@@ -167,6 +167,9 @@
         <a href="https://matrix.to/#/@incentive:matrix.circlewithadot.net" target="_blank" rel="noopener">
           <img src="images/icon_matrix.png" alt="" />
         </a>
+        <a href="https://mastodon.circlewithadot.net/@cwad" target="_blank" rel="me noopener">
+          <img src="images/icon_mastodon.png" alt="" />
+        </a>
       </div>
     </section>
   </div>
diff --git a/services/aprelay.html b/services/aprelay.html
index 1bbb935..447707a 100644
--- a/services/aprelay.html
+++ b/services/aprelay.html
@@ -6,7 +6,6 @@
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <link href="../style.css?v=20250831" rel="stylesheet" />
   <style>
-    /* Relay-only CSS */
     .relay-wrap {
       max-width: 860px;
       margin: 0 auto 60px;
@@ -30,7 +29,6 @@
         font-size: 18px;
       }
 
-    /* logo next to header */
     .relay-logo {
       display: block;
       width: 80px;
@@ -88,7 +86,6 @@
       font-size: 14px;
     }
 
-    /* Homepage-style icon box for updates */
     .updates-title {
       margin: 0 0 10px;
       font-size: 16px;
@@ -107,7 +104,6 @@
       line-height: 1.5;
     }
 
-    /* Policy box (make it match the rest of the page sizing) */
     .policy-card {
       font-size: 14px;
     }
@@ -203,7 +199,6 @@
       </noscript>
     </section>
 
-    <!-- Updates box -->
     <section class="relay-card updates-card" style="margin-top:16px;">
       <p class="updates-title"><strong>For relay updates, check here</strong></p>
       <div class="icon-row">
@@ -216,7 +211,6 @@
       </div>
     </section>
 
-    <!-- Covenant / policy box -->
     <section class="relay-card policy-card" style="margin-top:16px;">
       <p class="policy-title"><strong>Relay policy</strong></p>
 
@@ -242,6 +236,28 @@
       </div>
     </section>
 
+    <section class="relay-card instances-card" style="margin-top:16px;">
+      <p class="instances-title"><strong>Connected instances</strong></p>
+
+      <div class="instances-table" role="table" aria-label="Connected relay instances">
+        <div class="instances-header" role="row">
+          <span role="columnheader">Instance</span>
+          <span role="columnheader">Status</span>
+        </div>
+
+        <div id="instances-body" class="instances-body" role="rowgroup">
+          <div class="instances-row" role="row">
+            <span class="mono" role="cell">Loading…</span>
+            <span role="cell">–</span>
+          </div>
+        </div>
+      </div>
+
+      <div class="instances-meta">
+        Last check: <span id="instances-updated">–</span>
+      </div>
+    </section>
+
     <footer class="site-footer" role="contentinfo" style="margin-top:16px;">
       <div class="footer-inner">
         <div class="footer-left">
@@ -275,6 +291,7 @@
   </main>
 
   <a rel="me" href="https://mastodon.circlewithadot.net/@incentive" hidden>Mastodon</a>
+  <a rel="me" href="https://mastodon.circlewithadot.net/@cwad" hidden>Mastodon</a>
 </body>
 </html>
 
diff --git a/services/aprelay.js b/services/aprelay.js
index a5595f5..ae487b1 100644
--- a/services/aprelay.js
+++ b/services/aprelay.js
@@ -64,3 +64,37 @@ async function loadStats() {
 loadStats();
 setInterval(loadStats, 300000);
 
+async function loadInstanceStatuses() {
+  const bodyEl = document.getElementById("instances-body");
+  const updatedEl = document.getElementById("instances-updated");
+  if (!bodyEl || !updatedEl) return;
+
+  try {
+    const res = await fetch("aprelay_instances.json", { cache: "no-store" });
+    if (!res.ok) throw new Error(`HTTP ${res.status}`);
+
+    const data = await res.json();
+    const instances = Array.isArray(data.instances) ? data.instances : [];
+    updatedEl.textContent = data.generated_at || "–";
+
+    if (!instances.length) {
+      bodyEl.innerHTML = `<div class="instances-row"><span class="mono">No data</span><span>–</span></div>`;
+      return;
+    }
+
+    bodyEl.innerHTML = instances.map(x => `
+      <div class="instances-row" role="row">
+        <span class="mono" role="cell">${x.domain}</span>
+        <span role="cell">${x.status}</span>
+      </div>
+    `).join("");
+  } catch (e) {
+    bodyEl.innerHTML = `<div class="instances-row"><span class="mono">Error loading list</span><span>–</span></div>`;
+    updatedEl.textContent = "–";
+  }
+}
+
+document.addEventListener("DOMContentLoaded", () => {
+  loadInstanceStatuses();
+});
+
diff --git a/services/aprelay_instances.json b/services/aprelay_instances.json
new file mode 100644
index 0000000..560cb53
--- /dev/null
+++ b/services/aprelay_instances.json
@@ -0,0 +1,121 @@
+{
+  "generated_at": "2026-02-07 02:03:58 UTC",
+  "instances": [
+    {
+      "domain": "activitypub.space",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "ailbhean.co-shaoghal.net",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "bitforged.social",
+      "status": "dead",
+      "code": null
+    },
+    {
+      "domain": "clar.ke",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "cyangant.dedyn.io",
+      "status": "dead",
+      "code": null
+    },
+    {
+      "domain": "declin.eu",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "fed.fsub.de",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "fedifreu.de",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "fleacf.space",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "irlqt.net",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "kosen-agola-misskey.kouta2133.work",
+      "status": "dead",
+      "code": null
+    },
+    {
+      "domain": "mammut.gogreenit.net",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "mastodon.circlewithadot.net",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "misskey.jayhsustudio.com",
+      "status": "530",
+      "code": 530
+    },
+    {
+      "domain": "misskey.xstudiotw.net",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "mitchelltribe.rodeo",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "mstdn.canarylabs.eu",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "mstdn.catbyte.tech",
+      "status": "dead",
+      "code": null
+    },
+    {
+      "domain": "mstdn.fan",
+      "status": "dead",
+      "code": null
+    },
+    {
+      "domain": "okpeace.org",
+      "status": "dead",
+      "code": null
+    },
+    {
+      "domain": "pl.aelaraji.com",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "relay.fedi.buzz",
+      "status": "working",
+      "code": 200
+    },
+    {
+      "domain": "social.domaincrawler.com",
+      "status": "working",
+      "code": 200
+    }
+  ]
+}
+
diff --git a/style.css b/style.css
index 1ec48b1..a29575d 100644
--- a/style.css
+++ b/style.css
@@ -446,3 +446,56 @@ body {
       justify-self: center;
     }
 }
+
+.instances-title {
+  margin: 0 0 10px;
+  font-size: 16px;
+  color: #9aa0a6;
+}
+
+.instances-table {
+  border: 1px solid #26282a;
+  border-radius: 12px;
+  overflow: hidden;
+  background: #0f0f10;
+}
+
+.instances-header {
+  display: grid;
+  grid-template-columns: 1fr 140px;
+  gap: 12px;
+  padding: 10px 12px;
+  border-bottom: 1px solid #26282a;
+  color: #9aa0a6;
+  font-size: 14px;
+}
+
+.instances-body {
+  max-height: 240px;      /* scrolling area */
+  overflow: auto;
+}
+
+.instances-row {
+  display: grid;
+  grid-template-columns: 1fr 140px;
+  gap: 12px;
+  padding: 10px 12px;
+  border-bottom: 1px solid #1f2123;
+  font-size: 14px;
+}
+
+.instances-row:last-child {
+  border-bottom: 0;
+}
+
+.mono {
+  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
+  word-break: break-all;
+}
+
+.instances-meta {
+  margin-top: 10px;
+  color: #9aa0a6;
+  font-size: 14px;
+}
+