Show # of messages in the task queue

CHANGES.md

@@ -15,6 +15,7 @@ To be released.
  -  Renamed the *Data* menu from the administration dashboard to *Federation*.
 
      -  Now posts also can be force-refreshed.
+     -  Now the number of messages in the task queue is shown.
 
  -  Added support for reporting remote accounts and posts.
     [[#41] by Emelia Smith]

package.json

@@ -16,7 +16,7 @@
     "@fedify/fedify": "^1.2.2",
     "@fedify/markdown-it-hashtag": "0.2.0",
     "@fedify/markdown-it-mention": "^0.1.1",
-    "@fedify/postgres": "0.1.0",
+    "@fedify/postgres": "^0.2.1",
     "@hexagon/base64": "^2.0.4",
     "@hono/zod-validator": "^0.2.1",
     "@js-temporal/polyfill": "^0.4.4",
@@ -31,7 +31,7 @@
     "markdown-it-replace-link": "^1.2.1",
     "open-graph-scraper": "^6.5.1",
     "otpauth": "^9.3.4",
-    "postgres": "^3.4.4",
+    "postgres": "^3.4.5",
     "qrcode": "^1.5.4",
     "semver": "^7.6.3",
     "sharp": "^0.33.4",

src/pages/federation.tsx

@@ -1,4 +1,5 @@
 import { isActor } from "@fedify/fedify";
+import { count, sql } from "drizzle-orm";
 import { Hono } from "hono";
 import { DashboardLayout } from "../components/DashboardLayout";
 import db from "../db";
@@ -11,10 +12,19 @@ const data = new Hono();
 
 data.use(loginRequired);
 
-data.get("/", (c) => {
+data.get("/", async (c) => {
   const done = c.req.query("done");
   const error = c.req.query("error");
 
+  const queueMessages = await db
+    .select({
+      type: sql`fedify_message_v2.message ->> 'type'`,
+      number: count(),
+    })
+    .from(sql`fedify_message_v2`)
+    .groupBy(sql`fedify_message_v2.message ->> 'type'`)
+    .execute();
+
   return c.html(
     <DashboardLayout title="Hollo: Federation" selectedMenu="federation">
       <hgroup>
@@ -71,6 +81,49 @@ data.get("/", (c) => {
           )}
         </form>
       </article>
+
+      <article>
+        <header>
+          <hgroup>
+            <h2>Task queue messages</h2>
+            <p>The number of messages in the task queue.</p>
+          </hgroup>
+        </header>
+        <table>
+          <thead>
+            <tr>
+              <th>Type</th>
+              <th style="text-align: right">Number of messages</th>
+            </tr>
+          </thead>
+          <tbody>
+            {queueMessages.map((queueMessage) => (
+              <tr>
+                <td>{queueMessage.type}</td>
+                <td style="text-align: right">
+                  {queueMessage.number.toLocaleString("en")}
+                </td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </article>
+
+      <article>
+        <header>
+          <hgroup>
+            <h2>How to shut down your instance</h2>
+            <p>
+              So-called <q>self-destruct</q> your instance.
+            </p>
+          </hgroup>
+        </header>
+        <p>
+          Hollo does not provide so-called <q>self-destruct</q> feature.
+          However, you can achieve the same effect by deleting all{" "}
+          <a href="/accounts">your accounts</a>.
+        </p>
+      </article>
     </DashboardLayout>,
   );
 });