tinc blog

.github/workflows/ci.yml

@@ -70,6 +70,46 @@ jobs:
     permissions: *read-permissions
     secrets: inherit
 
+  preview:
+    if: ${{ github.event_name == 'pull_request' }}
+    name: Preview
+    needs: [build]
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      pull-requests: write
+    environment:
+      name: surge-preview
+      url: ${{ steps.deploy.outputs.preview-url }}
+    outputs:
+      preview-url: ${{ steps.deploy.outputs.preview-url }}
+    steps:
+      - name: Download build artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: website-build
+
+      - name: Extract artifact
+        run: |
+          set -eo pipefail
+          tar -xzf website.tar.gz
+
+      - name: Install Surge
+        run: npm install --global surge
+
+      - name: Deploy to Surge
+        id: deploy
+        run: |
+          surge ./dist --preview --domain ${{ vars.SURGE_DOMAIN }} --token ${{ secrets.SURGE_TOKEN }} | tee output.txt
+          PREVIEW_DOMAIN=$(grep "Live preview" output.txt | grep -oE '[0-9]+-[^[:space:]]+\.surge\.sh')
+          echo "preview-url=https://$PREVIEW_DOMAIN" >> "$GITHUB_OUTPUT"
+
+      - uses: marocchino/sticky-pull-request-comment@v3
+        name: Sticky pull request comment
+        with:
+          message: |
+            Release ${{ github.sha }} to <${{ steps.deploy.outputs.preview-url }}>
+
   status:
     name: Status
     runs-on: ubuntu-latest

Justfile

@@ -15,7 +15,7 @@ audit:
     pnpm audit
 
 dev:
-    pnpm dev
+    pnpm dev --force
 
 build:
     pnpm build

astro.config.mjs

@@ -1,37 +1,41 @@
 import mdx from "@astrojs/mdx";
 import svelte from "@astrojs/svelte";
-import {
-    transformerNotationDiff,
-    transformerNotationErrorLevel,
-    transformerNotationFocus,
-    transformerNotationHighlight,
-    transformerNotationWordHighlight,
-} from "@shikijs/transformers";
+import astroExpressiveCode from "astro-expressive-code";
 import pagefind from "astro-pagefind";
 import { defineConfig } from "astro/config";
+import expressiveConfig from "./plugins/expressive-code/config.ts";
 import { rehypeExternalLinks, rehypeHeadingAnchors } from "./plugins/rehype.mjs";
 import { remarkReadingTime } from "./plugins/remark.mjs";
-import { transformerCopyButton } from "./plugins/shiki.mjs";
+
+function restartOnEcPluginChange() {
+    return {
+        name: "restart-on-ec-plugin-change",
+        configureServer(server) {
+            server.watcher.add("./plugins/expressive-code/**");
+            server.watcher.on("change", (path) => {
+                if (path.includes("plugins/expressive-code")) {
+                    console.log(`\n[expressive-code] Plugin changed: ${path}, restarting...`);
+                    server.restart();
+                }
+            });
+        },
+    };
+}
 
 export default defineConfig({
     site: "https://troymoder.dev",
-    integrations: [mdx(), svelte(), pagefind()],
+    integrations: [
+        astroExpressiveCode(expressiveConfig),
+        mdx(),
+        svelte(),
+        pagefind(),
+    ],
     markdown: {
-        shikiConfig: {
-            theme: "github-light",
-            transformers: [
-                transformerNotationDiff(),
-                transformerNotationHighlight(),
-                transformerNotationFocus(),
-                transformerNotationWordHighlight(),
-                transformerNotationErrorLevel(),
-                transformerCopyButton(),
-            ],
-        },
         remarkPlugins: [remarkReadingTime],
         rehypePlugins: [rehypeHeadingAnchors, rehypeExternalLinks],
     },
     vite: {
+        plugins: [restartOnEcPluginChange()],
         server: {
             watch: {
                 ignored: ["**/.direnv/**"],

eslint.config.js

@@ -18,6 +18,14 @@ export default defineConfig([
             },
         },
     },
+    {
+        rules: {
+            "@typescript-eslint/no-unused-vars": [
+                "error",
+                { argsIgnorePattern: "^_", varsIgnorePattern: "^_" },
+            ],
+        },
+    },
     {
         files: ["**/*.svelte"],
         languageOptions: {

package.json

@@ -10,21 +10,23 @@
     },
     "devDependencies": {
         "@astrojs/check": "^0.9.0",
-        "@astrojs/mdx": "^4.0.0",
-        "@astrojs/rss": "^4.0.15",
-        "@astrojs/svelte": "^7.2.5",
+        "@astrojs/mdx": "^5.0.0",
+        "@astrojs/rss": "4.0.15-beta.4",
+        "@astrojs/svelte": "^8.0.0",
         "@eslint/js": "^10.0.1",
         "@fontsource/jetbrains-mono": "^5.2.8",
-        "@shikijs/transformers": "^4.0.1",
+        "@types/hast": "^3.0.4",
         "@types/markdown-it": "^14.1.2",
         "@types/node": "^25.3.5",
         "@types/sanitize-html": "^2.16.1",
-        "astro": "^5.0.0",
+        "astro": "^6.0.4",
+        "astro-expressive-code": "^0.41.7",
         "astro-pagefind": "^1.8.5",
         "eslint": "^10.0.3",
         "eslint-plugin-astro": "^1.3.1",
         "eslint-plugin-svelte": "^3.9.0",
         "globals": "^17.4.0",
+        "hast-util-from-html": "^2.0.3",
         "markdown-it": "^14.1.1",
         "mdast-util-to-string": "^4.0.0",
         "reading-time": "^1.5.0",
@@ -36,6 +38,7 @@
         "typescript": "^5.7.0",
         "typescript-eslint": "^8.34.0",
         "unist-util-visit": "^5.1.0",
-        "vfile": "^6.0.3"
+        "vfile": "^6.0.3",
+        "vite": "^8.0.0"
     }
 }