feat: use latest wcb and status-indicator

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ayco/personal-website",
   "type": "module",
-  "version": "1.3.83",
+  "version": "1.3.98",
   "private": true,
   "scripts": {
     "astro": "astro",
@@ -21,7 +21,7 @@
     "build:deploy": "npm run build && npm run deploy",
     "copy:dist": "npm run build && cp -R dist ../ayco.io-flask/",
     "prepare": "husky",
-    "prep:now": "npx jiti ./commands/prep-now.js",
+    "prep:now": "npx jiti ./scripts/prep-now.js",
     "test": "vitest run ."
   },
   "devDependencies": {
@@ -70,9 +70,9 @@
       "prettier . --config prettier.config.mjs --write"
     ]
   },
-  "packageManager": "pnpm@11.5.2+sha512.71c631e382066efc25625d5cf029075de07b61b37f6e27350fbd84b1bda5864c8c1967adc280776b45c30a715c0359a3be08fef42d5bb09e2b99029979692916",
+  "packageManager": "pnpm@11.9.0+sha512.bd682d5d03fe525ef7c9fd6780c6884d1e756ac4c9c9fe00c538782824310dcf90e3ddc4f53835f06dfaebd5085e41855e0bcbb3b60de2ac5bbab89e5036f03b",
   "dependencies": {
-    "@ayo-run/status-indicator": "^2.1.2",
+    "@ayo-run/status-indicator": "^3.0.0",
-    "web-component-base": "^4.1.2"
+    "web-component-base": "^6.1.1"
   }
 }

pnpm-lock.yaml

@@ -9,11 +9,11 @@ importers:
   .:
     dependencies:
       '@ayo-run/status-indicator':
-        specifier: ^2.1.2
+        specifier: ^3.0.0
-        version: 2.1.2(web-component-base@4.1.2)
+        version: 3.0.0(web-component-base@6.1.1)
       web-component-base:
-        specifier: ^4.1.2
+        specifier: ^6.1.1
-        version: 4.1.2
+        version: 6.1.1
     devDependencies:
       '@astrojs/sitemap':
         specifier: ^3.7.2
@@ -161,10 +161,10 @@ packages:
     peerDependencies:
       astro: ^6
 
-  '@ayo-run/status-indicator@2.1.2':
+  '@ayo-run/status-indicator@3.0.0':
-    resolution: {integrity: sha512-eXWCXveQBq69Eotizvq5jHawO4gtuQK6ZALZTMysDPrcqUFURu8aIH1aJSxg/hIgxqlghsY/f/rxeCqSxp7hmA==}
+    resolution: {integrity: sha512-8HUZzw7heEtTmgUdbSiImgBFjYFWygefo/Z2PT+olPZgi1ekWrMERw/wYTwyg+PccBh/kQtRq9/TUYjqoZ3RQA==}
     peerDependencies:
-      web-component-base: ^4.1.2
+      web-component-base: ^6.1.1
 
   '@babel/helper-string-parser@7.27.1':
     resolution: {integrity: sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==}
@@ -2884,8 +2884,8 @@ packages:
       jsdom:
         optional: true
 
-  web-component-base@4.1.2:
+  web-component-base@6.1.1:
-    resolution: {integrity: sha512-Jti4FHgCcwtsFWJ+PPwFNhTm5AJVIHrTXDew0rk2Y3b8EChRIE5xr6fmUni43tOhc6w8HatvR3k+qnxjXr/7Mw==}
+    resolution: {integrity: sha512-zsonQI/eEdBGhg3Xoc/Y4d+G8ZSUpYbYKTSv8WiC1KMfWchAB4C+PuKbKtQDi+EHVtDG6LCbM0uYr8wo3mLXjg==}
 
   web-namespaces@2.0.1:
     resolution: {integrity: sha512-bKr1DkiNa2krS7qxNtdrtHAmzuYGFQLiQ13TsorsdT6ULTkPLKuu5+GsFpDlg6JFjUTwX2DyhMPG2be8uPrqsQ==}
@@ -3045,9 +3045,9 @@ snapshots:
       astro: 6.3.3(@types/node@25.8.0)(jiti@2.7.0)(rollup@4.60.4)(yaml@2.9.0)
       esbuild: 0.27.7
 
-  '@ayo-run/status-indicator@2.1.2(web-component-base@4.1.2)':
+  '@ayo-run/status-indicator@3.0.0(web-component-base@6.1.1)':
     dependencies:
-      web-component-base: 4.1.2
+      web-component-base: 6.1.1
 
   '@babel/helper-string-parser@7.27.1': {}
 
@@ -6203,7 +6203,7 @@ snapshots:
     transitivePeerDependencies:
       - msw
 
-  web-component-base@4.1.2: {}
+  web-component-base@6.1.1: {}
 
   web-namespaces@2.0.1: {}
 

pnpm-workspace.yaml

@@ -2,3 +2,6 @@ allowBuilds:
   esbuild: false
   sharp: false
   web-component-base: false
+minimumReleaseAgeExclude:
+  - '@ayo-run/status-indicator@3.0.0'
+  - web-component-base@6.1.1

src/components/Footer.astro

@@ -45,7 +45,7 @@ const year = new Date().getFullYear()
   <p>
     Copyright &#169; 2022-{year}
     <a href="/">Ayo Ayco</a>. This website <a
-      href="https://v1.ayos.blog/stopped-tracking-on-my-sites"
+      href="https://ayos.blog/stopped-tracking-on-my-sites"
       >does not track users</a
     >. See the <a href="https://git.ayo.run/ayo/ayco.io-astro">source code.</a>
   </p>

src/constants/bkup/2026-05-12.json

@@ -0,0 +1,7 @@
+{
+  "title": "Social Web & Web Components",
+  "description": "Getting into discussions about improving the social web & building components",
+  "publishDate": "2026-05-12",
+  "publishedOn": "",
+  "publishState": ""
+}

src/constants/bkup/2026-05-12.md

@@ -0,0 +1,13 @@
+I bought a pull-up bar, and in addition to a few barbells at home, I am starting to have a mini gym.
+
+Super happy that I am getting healthier as I build my workout routines.
+
+To keep my mind sharp, I find it helpful to have several hobby things I can get back to from time to time.
+
+I am in a few discussions for exploring some things in the open social web. Details can come later as they become more concrete.
+
+Soft launch of my own newsletter is up on the canary version of my blog: https://main.ayos.blog/subscribe -- because email is the first decentralized social platform. Let's explore that idea more in the coming months.
+
+I'm also back on my webcomponents main arc, after some side quests in self-hosting & machine learning.
+
+Links to come later. Cheers!

src/constants/links.ts

@@ -62,7 +62,7 @@ export const footerLinks: Link[] = [
   },
   {
     text: 'Bluesky',
-    url: 'http://bsky.app/profile/ayo.run',
+    url: 'http://mu.social/profile/ayo.run',
     icon: 'bluesky',
   },
   {

src/constants/now.json

@@ -1,7 +1,7 @@
 {
-  "title": "Social Web & Web Components",
+  "title": "Fam++, Crypto, ~AI, OSS",
-  "description": "Getting into discussions about improving the social web & building components",
+  "description": "Navigating changes in the family and the tech industry",
-  "publishDate": "2026-05-12",
+  "publishDate": "2026-06-18",
-  "publishedOn": "",
+  "publishedOn": "the 18th of June 2026",
-  "publishState": ""
+  "publishState": "in Amsterdam"
 }

src/constants/now.md

@@ -1,13 +1,21 @@
-I bought a pull-up bar, and in addition to a few barbells at home, I am starting to have a mini gym.
+## 2 vs 2 in the house
 
-Super happy that I am getting healthier as I build my workout routines.
+A new challenger is entering the game. It is safe to share now that we're expecting a new addition to the family: a baby girl is joining us later this year. I have been enjoying having a mini-me in the form of my lil kiddo, Kahel, and now it's time for Jen to have hers.
 
-To keep my mind sharp, I find it helpful to have several hobby things I can get back to from time to time.
+## Cryptography
 
-I am in a few discussions for exploring some things in the open social web. Details can come later as they become more concrete.
+The latest rabbit hole for my tech adventures is on [cryptography](https://elk.zone/m.webtoo.ls/@ayo@ayco.io/116667802537651710); particularly OpenPGP stuff and the implementation on signing & verifying emails. Check [my public key](/pgp) if you want to exchange encrypted messages :)
 
-Soft launch of my own newsletter is up on the canary version of my blog: https://main.ayos.blog/subscribe -- because email is the first decentralized social platform. Let's explore that idea more in the coming months.
+Technically this key-pair cryptography can be applied to any data exchange, so I naturally have been ruminating on how we can bring this to the decentralized social web.
 
-I'm also back on my webcomponents main arc, after some side quests in self-hosting & machine learning.
+## "AI"
 
-Links to come later. Cheers!
+I disassembled the eGPU setup I have for experimenting with local LLM inference and built a new PC. It is now a dedicated 24/7 "AI" computer at home that powers my [Open WebUI](https://ai.ayo.run) service. Additionally it runs [hermes](https://hermes-agent.nousresearch.com/) which is a "totally safe private local agentic AI" architecture -- and I got to say, it is the most successful one I've tried yet with local AI stuff.
+
+Where am I using this? I don't know yet. It's purely for understanding the "agentic" stuff
+
+## Open source
+
+- [Elk](https://elk.zone) - I try to help out reviewing PRs and will pick up coding work again
+- [Webtoo.ls](https://webtoo.ls/about) - I picked up administration work for this and have BIG dreams on bringing more Web ecosystem open source presence to the Fediverse
+- [others](https://git.ayo.run/ayo) - A lot of my other explorations are out in the open

src/layouts/Layout.astro

@@ -51,13 +51,28 @@ const ogFileType = 'image/png'
         font-size: var(--font-size-base);
         color: var(--text-color-dark);
         background-color: var(--text-color-light);
+
+        background-image: radial-gradient(
+          circle,
+          hsl(var(--dot-grid-light)) 1px,
+          transparent 1px
+        );
+        background-size: 24px 24px;
+        background-position: -24px -24px;
       }
+
       @media (prefers-color-scheme: dark) {
         html,
         body,
         * {
-          background: var(--bg-darker);
+          background-color: var(--bg-darker);
           color: var(--text-color-light);
+
+          background-image: radial-gradient(
+            circle,
+            hsl(var(--dot-grid-dark)) 1px,
+            transparent 1px
+          );
         }
       }
 

src/layouts/variables.css

@@ -26,4 +26,7 @@
   --bg-dark: #343a40;
   --bg-darker: #212529;
   --bg-darkest: #000;
+
+  --dot-grid-light: 214 32% 82%;
+  --dot-grid-dark: 215 25% 25%;
 }

src/pages/about.astro

@@ -36,9 +36,8 @@ import Footer from '../components/Footer.astro'
     <p>
       In my spare time, I find it fun building <a href="/showcase">projects</a>,
       running self-hosted services at <a href="https://ayo.run">ayo.run</a>, and
-      volunteering to <a
+      volunteering to <a href="https://ayos.blog/why-fediverse/" target="_blank"
-        href="https://v1.ayos.blog/why-fediverse/"
+        >Fediverse</a
-        target="_blank">Fediverse</a
       > projects like <a href="https://elk.zone">elk.zone</a>,
       <a href="https://m.webtoo.ls/public/local">webtoo.ls</a>, and <a
         href="https://m.webtoo.ls/@vitest">vitest's fedi presence</a

src/pages/index.astro

@@ -46,7 +46,7 @@ const avatarSize = 150
       </div>
     </div>
   </section>
-  <main>
+  <main class=".dot-grid">
     <section class="introduction-section">
       <p>
         I care about the <em>Web</em>, and I love to <em>create</em> stuff to <em
@@ -95,7 +95,6 @@ const avatarSize = 150
 
     &.primary {
       border: 1px solid rgba(255, 255, 255, 0.2);
-      border-style: dotted;
       border-radius: 40px;
     }
   }

src/pages/now/and-then/posts/2026-05-12.astro

@@ -0,0 +1,72 @@
+---
+import Layout from '../../../../layouts/Layout.astro'
+import Footer from '../../../../components/Footer.astro'
+
+const title = `Social Web & Web Components`
+const description = `Getting into discussions about improving the social web & building components`
+let publishedOn = ``
+const publishDate = `2026-05-12`
+const publishState = ``
+const content = `<p>I bought a pull-up bar, and in addition to a few barbells at home, I am starting to have a mini gym.</p>
+<p>Super happy that I am getting healthier as I build my workout routines.</p>
+<p>To keep my mind sharp, I find it helpful to have several hobby things I can get back to from time to time.</p>
+<p>I am in a few discussions for exploring some things in the open social web. Details can come later as they become more concrete.</p>
+<p>Soft launch of my own newsletter is up on the canary version of my blog: https://main.ayos.blog/subscribe -- because email is the first decentralized social platform. Let's explore that idea more in the coming months.</p>
+<p>I'm also back on my webcomponents main arc, after some side quests in self-hosting &#x26; machine learning.</p>
+<p>Links to come later. Cheers!</p>`
+
+publishedOn = publishedOn === '' ? publishDate : publishedOn
+---
+
+<Layout title={title} description={description}>
+  <main>
+    <h1><span class="text-gradient">{title}</span></h1>
+    <p>
+      <small>
+        Published on
+        <time datetime={publishDate}>
+          {publishedOn}
+        </time>
+        {publishState}
+      </small>
+    </p>
+
+    <Fragment set:html={content} />
+  </main>
+  <Footer />
+</Layout>
+
+<style>
+  .text-gradient {
+    font-weight: 900;
+    background-image: var(--ayo-gradient);
+    animation: pulse 4s ease-in-out infinite;
+    background-size: 500% 500%;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-size: 100% 200%;
+    background-position-y: 100%;
+    border-radius: 0.4rem;
+  }
+
+  .highlighted-content {
+    margin: 1rem 0;
+    background: #4f39fa;
+    padding: 1rem;
+    border-radius: 0.4rem;
+    color: var(--color-bg);
+  }
+
+  .highlighted-content code {
+    font-size: var(--font-size-base);
+    border: 0.1em solid var(--color-border);
+    border-radius: 4px;
+    padding: 0.15em 0.25em;
+  }
+
+  .link-card-grid {
+    display: grid;
+    gap: 1rem;
+    padding: 0;
+  }
+</style>

src/pages/showcase.astro

@@ -11,8 +11,8 @@ import Card from '../components/Card.astro'
   <main>
     <h1><span class="text-gradient">Hobby Projects</span></h1>
     <p>
-      See more of my previous projects at <a
+      See more of my previous projects at <a href="https://ayos.blog/projects"
-        href="https://v1.ayos.blog/projects">my blog</a
+        >my blog</a
       >.
     </p>
     <ul>

tests/prep-now.test.ts

@@ -5,7 +5,7 @@ import { dirname, resolve } from 'node:path'
 import { describe, it, expect, vi, beforeEach } from 'vitest'
 import { consola } from 'consola'
 
-import newNow from '../commands/prep-now'
+import newNow from '../scripts/prep-now'
 
 // Mock file system operations
 vi.mock('path', () => ({
@@ -27,7 +27,7 @@ vi.mock('consola', () => ({
 }))
 
 // Mock mdToHTML
-vi.mock('../command/md-to-html', () => ({
+vi.mock('../scripts/md-to-html', () => ({
   mdToHTML: vi.fn(),
 }))
 
@@ -56,7 +56,7 @@ describe('prep-now', () => {
 
   it('should create a new now page and clear the original files', async () => {
     // Mock the mdToHTML function
-    const { mdToHTML } = await import('../utils/md-to-html')
+    const { mdToHTML } = await import('../scripts/md-to-html')
     vi.mocked(mdToHTML).mockResolvedValue('<h1>Test Content</h1>')
 
     // Mock file paths
@@ -73,8 +73,8 @@ describe('prep-now', () => {
       .mockReturnValueOnce('# Test Content')
 
     // Mock file paths
-    const __filename = '/src/commands/prep-now.ts'
+    const __filename = '/src/scripts/prep-now.ts'
-    const __dirname = '/src/commands'
+    const __dirname = '/src/scripts'
     vi.mocked(fileURLToPath).mockReturnValue(__filename)
     vi.mocked(dirname).mockReturnValue(__dirname)