Rewrite it in Astro

.github/workflows/deploy.yml

@@ -0,0 +1,28 @@
+name: deploy
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+  schedule:
+    - cron: "30 5 * * *"
+
+jobs:
+  deploy:
+    runs-on: ubuntu-20.04
+    permissions:
+      contents: read
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+      - name: build and deploy
+        run: |
+          npm i && npm i -g wrangler
+          npm run build
+          npx wrangler pages deploy dist --project-name=${{ vars.CLOUDFLARE_PROJECT_NAME }} --branch=main
+        env:
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}

.gitignore

@@ -1,2 +1,5 @@
+.astro/
+dist/
 node_modules/
+
 package-lock.json

.prettierrc.json

@@ -0,0 +1,10 @@
+{
+  "plugins": ["prettier-plugin-astro"],
+  "printWidth": 120,
+  "overrides": [
+    {
+      "files": "*.astro",
+      "options": { "parser": "astro" }
+    }
+  ]
+}

README.md

@@ -4,17 +4,12 @@ A simple dashboard listing the interventions currently shipped inside `mozilla-c
 
 ## Differences to the deprecated AreWeHotfixingTheWebYet.com
 
-- No database, thus easier to run as a stateless app.
-- No cached data - if crawling and parsing fails, an error will be shown instead of potentially outdated data.
+- No database, no build, just an "easy" script that generates a static page via Astr.
 - Data is only loaded from `mozilla-central`, not other branches/repos, to simplify the code.
 
-## Why is this not on GitHub?
-
-Since I'm a bit tired of trying to squeeze things into Heroku, I deployed this dashboard on my personal infrastructure. To simplify my work, this deployment is based on Docker, and the images for this are built by GitLab CI and stored in my private container registry. I can mirror this repo to GitHub if needed, but since this is a private, internal thing only, this should be fine.
-
 ## How to run
 
-The `_deployment` folder contains Dockerfiles, as well as Compose defintions for a local development setup and a production setup with CI-built images. Since this is only meant as an internal thing, that's all the documentation there is right now.
+After an `npm install`, you can get a dev-server with `npm run dev`. To build for release, `npm run build` will generate a static built into the `dist/` folder, which you can then throw onto a server of your choice.
 
 ## License
 

astro.config.mjs

@@ -0,0 +1,2 @@
+import { defineConfig } from "astro/config";
+export default defineConfig({});

package.json

@@ -1,15 +1,22 @@
 {
-  "name": "interventions-dashboard",
-  "description": "Lists currently applied interventions from mozilla-central, without any caches or anything.",
+  "name": "webcompat-interventions-dashboard",
+  "type": "module",
   "version": "1.0.0",
   "private": true,
-  "type": "module",
   "scripts": {
-    "start": "node server.js"
+    "dev": "astro dev",
+    "start": "astro dev",
+    "build": "astro build",
+    "preview": "astro preview",
+    "astro": "astro",
+    "lint": "prettier --write './src/**/*.{astro,js,ts}'"
   },
-  "author": "Dennis Schubert <[email protected]>",
-  "license": "MPL-2.0",
   "dependencies": {
+    "astro": "4.15.12",
     "node-fetch": "3.3.2"
+  },
+  "devDependencies": {
+    "prettier": "3.3.3",
+    "prettier-plugin-astro": "0.14.1"
   }
 }

src/env.d.ts

@@ -0,0 +1 @@
+/// <reference path="../.astro/types.d.ts" />

src/pages/index.astro

@@ -0,0 +1,68 @@
+---
+import DataFormatters from "../lib/dataFormatters";
+import DataLoader from "../lib/dataLoader";
+
+const injections = await new DataLoader(
+  "https://hg.mozilla.org/mozilla-central/raw-file/tip/browser/extensions/webcompat/data/injections.js",
+).run();
+const uaOverrides = await new DataLoader(
+  "https://hg.mozilla.org/mozilla-central/raw-file/tip/browser/extensions/webcompat/data/ua_overrides.js",
+).run();
+
+const allInterventions = []
+  .concat(injections.map(DataFormatters.Injection), uaOverrides.map(DataFormatters.UaOverride))
+  .sort((a, b) => (parseInt(a.bug, 10) > parseInt(b.bug, 10) ? 1 : -1))
+---
+
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Currently active WebCompat Interventions</title>
+    <style>
+      #content,
+      p {
+        margin: 25px;
+      }
+
+      table {
+        border-collapse: collapse;
+        width: 100%;
+      }
+
+      td,
+      th {
+        border: 1px solid black;
+        padding: 5px 7px;
+        text-align: left;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="content">
+      <table>
+        <tr>
+          <th>Bugzilla Bug</th>
+          <th>Affected domain(s)</th>
+          <th>Type</th>
+          <th>Target platform</th>
+        </tr>
+        {
+          allInterventions.map((intervention) => (
+            <tr>
+              <td>
+                <a href={`https://bugzilla.mozilla.org/show_bug.cgi?id=${intervention.bug}`}>{intervention.bug}</a>
+              </td>
+              <td>{intervention.domain}</td>
+              <td>{intervention.type}</td>
+              <td>{intervention.platform}</td>
+            </tr>
+          ))
+        }
+      </table>
+    </div>
+    <p>
+      Showing all interventions currently shipping in mozilla-central. List generated on {new Date().toISOString()}.
+    </p>
+  </body>
+</html>

tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "astro/tsconfigs/base"
+}