Toot embedding

Signed-off-by: Xe Iaso <me@xeiaso.net>

17 files changed, 130 insertions, 42 deletions

diff --git a/dhall/package.dhall b/dhall/package.dhall
index 558a7b5..33ff48c 100644
--- a/dhall/package.dhall
+++ b/dhall/package.dhall
@@ -13,7 +13,19 @@ in  Config::{
     , authors = authors.map
     , defaultAuthor = authors.default
     , clackSet =
-      [ "Ashlynn", "Terry Davis", "Dennis Ritchie", "Steven Hawking" ]
+      [ "Ashlynn"
+      , "Terry Davis"
+      , "Dennis Ritchie"
+      , "Steven Hawking"
+      , "John Conway"
+      , "Ruth Gader Ginsburg"
+      , "Bram Moolenaar"
+      , "Grant Imahara"
+      , "David Bowie"
+      , "Sir Terry Pratchett"
+      , "Satoru Iwata"
+      , "Kris Nóva"
+      ]
     , jobHistory = ./jobHistory.dhall
     , seriesDescriptions = desc.descriptions
     , seriesDescMap = desc.map
@@ -80,7 +92,10 @@ in  Config::{
       , Link::{ url = "https://pony.social/@cadey", title = "Fediverse" }
       , Link::{ url = "https://t.me/miamorecadenza", title = "Telegram" }
       , Link::{ url = "irc://irc.libera.chat/#xeserv", title = "IRC" }
-      , Link::{ url = "https://staging.bsky.app/profile/xeiaso.net", title = "Bluesky" }
+      , Link::{
+        , url = "https://staging.bsky.app/profile/xeiaso.net"
+        , title = "Bluesky"
+        }
       ]
     , pronouns = ./pronouns.dhall
     , characters = ./characters.dhall
diff --git a/lume/_config.ts b/lume/_config.ts
index bbb6609..a340f5f 100644
--- a/lume/_config.ts
+++ b/lume/_config.ts
@@ -16,6 +16,7 @@ import XeblogHero from "./src/_components/XeblogHero.tsx";
 import XeblogPicture from "./src/_components/XeblogPicture.tsx";
 import XeblogSlide from "./src/_components/XeblogSlide.tsx";
 import XeblogSticker from "./src/_components/XeblogSticker.tsx";
+import XeblogToot from "./src/_components/XeblogToot.tsx";
 import XeblogVideo from "./src/_components/XeblogVideo.tsx";
 
 import rehypePrism from "npm:rehype-prism-plus/all";
@@ -56,6 +57,7 @@ site.use(mdx({
     "XeblogPicture": XeblogPicture,
     "XeblogSlide": XeblogSlide,
     "XeblogSticker": XeblogSticker,
+    "XeblogToot": XeblogToot,
     "XeblogVideo": XeblogVideo,
   },
   rehypePlugins: [
diff --git a/lume/deno.lock b/lume/deno.lock
index 1f57ed0..0d89ce5 100644
--- a/lume/deno.lock
+++ b/lume/deno.lock
@@ -2059,6 +2059,9 @@
       }
     }
   },
+  "redirects": {
+    "https://denopkg.com/chiefbiiko/std-encoding/mod.ts": "https://denopkg.com/chiefbiiko/std-encoding@master/mod.ts"
+  },
   "remote": {
     "https://deno.land/std@0.139.0/_util/assert.ts": "e94f2eb37cebd7f199952e242c77654e43333c1ac4c5c700e929ea3aa5489f74",
     "https://deno.land/std@0.139.0/_util/os.ts": "49b92edea1e82ba295ec946de8ffd956ed123e2948d9bd1d3e901b04e4307617",
@@ -2208,6 +2211,9 @@
     "https://deno.land/std@0.200.0/yaml/schema/mod.ts": "4472e827bab5025e92bc2eb2eeefa70ecbefc64b2799b765c69af84822efef32",
     "https://deno.land/std@0.200.0/yaml/stringify.ts": "fffc09c65c68d3d63f8159e8cbaa3f489bc20a8e55b4fbb61a8c2e9f914d1d02",
     "https://deno.land/std@0.200.0/yaml/type.ts": "1aabb8e0a3f4229ce0a3526256f68826d9bdf65a36c8a3890ead8011fcba7670",
+    "https://deno.land/x/base64@v0.2.1/base.ts": "47dc8d68f07dc91524bdd6db36eccbe59cf4d935b5fc09f27357a3944bb3ff7b",
+    "https://deno.land/x/base64@v0.2.1/base64url.ts": "18bbf879b31f1f32cca8adaa2b6885ae325c2cec6a66c5817b684ca12c46ad5e",
+    "https://deno.land/x/base64@v0.2.1/mod.ts": "1cbdc4ba7229d3c6d1763fecdb9d46844777c7e153abb6dabea8b0dd01448db4",
     "https://deno.land/x/cliffy@v0.25.7/_utils/distance.ts": "02af166952c7c358ac83beae397aa2fbca4ad630aecfcd38d92edb1ea429f004",
     "https://deno.land/x/cliffy@v0.25.7/ansi/ansi.ts": "7f43d07d31dd7c24b721bb434c39cbb5132029fa4be3dd8938873065f65e5810",
     "https://deno.land/x/cliffy@v0.25.7/ansi/ansi_escapes.ts": "885f61f343223f27b8ec69cc138a54bea30542924eacd0f290cd84edcf691387",
@@ -2405,6 +2411,8 @@
     "https://deno.land/x/xml@2.1.1/utils/stream.ts": "056e2f368d47932d77e431bbc4a8292359171cc9ce881ea31ce0aae30d763e68",
     "https://deno.land/x/xml@2.1.1/utils/streamable.ts": "1603a5f10c859b95d4e9502365a0fba0b19d5d068356e20d5a6813cd37fee780",
     "https://deno.land/x/xml@2.1.1/utils/stringifier.ts": "c701b506835237c0c6c0a08fd94e0a012b644def3f4c819c64788daf2e649ea3",
-    "https://deno.land/x/xml@2.1.1/utils/types.ts": "ecaf7785e54a6f1da6f8e56da2bce9853407ceb7d5b3b70f0a60a0890151fe4c"
+    "https://deno.land/x/xml@2.1.1/utils/types.ts": "ecaf7785e54a6f1da6f8e56da2bce9853407ceb7d5b3b70f0a60a0890151fe4c",
+    "https://denopkg.com/chiefbiiko/sha256@v1.0.0/mod.ts": "eca3d13a2cd11839e451055737ccde0c7c6cdbd331fcd0a8f7e954ee857bb13a",
+    "https://denopkg.com/chiefbiiko/std-encoding@master/mod.ts": "e61017da4cef146863d614a961b4e61f1df14b72c906092bd02161f913e76522"
   }
 }
diff --git a/lume/src/_components/XeblogToot.tsx b/lume/src/_components/XeblogToot.tsx
new file mode 100644
index 0000000..3fd1f46
--- /dev/null
+++ b/lume/src/_components/XeblogToot.tsx
@@ -0,0 +1,63 @@
+import { sha256 } from "https://denopkg.com/chiefbiiko/sha256@v1.0.0/mod.ts";
+
+export interface XeblogTootProps {
+  url: string;
+}
+
+export default function XeblogToot({ url }: XeblogTootProps) {
+  const tootHash = sha256(url + ".json", "utf8", "hex");
+  const tootJSON = (new TextDecoder("utf-8")).decode(
+    Deno.readFileSync(`./src/_data/toots/${tootHash}.json`),
+  );
+  const toot = JSON.parse(tootJSON);
+
+  const userHash = sha256(toot.attributedTo + ".json", "utf8", "hex");
+  const userJSON = (new TextDecoder("utf-8")).decode(
+    Deno.readFileSync(`./src/_data/users/${userHash}.json`),
+  );
+  const user = JSON.parse(userJSON);
+
+  return (
+    <>
+      <div class="bg-bg-soft dark:bg-bgDark-soft rounded-xl m-2 shadow-md max-w-lg">
+        <div class="items-center flex flex-row text-xl px-4 font-bold max-h-[4rem]">
+          <img class="rounded-full w-8 h-8" src={user.icon.url} />
+          <span class="pl-2">{user.name}</span>
+        </div>
+        <div class="flex flex-row items-center px-4 py-2">
+          <div class="flex flex-wrap px-5">
+            <div class="px-2 py-1 m-1 bg-bg-2 dark:bg-bgDark-2 rounded-lg">
+              {toot.published}
+              <div
+                dangerouslySetInnerHTML={{ __html: toot.content }}
+              >
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class={`grid grid-cols-${toot.attachment.length > 1 ? 2 : 1} px-4`}>
+          {toot.attachment.map((attachment) => {
+            if (attachment.mediaType.startsWith("image/")) {
+              return (
+                <div class="flex flex-row items-center justify-center m-1 max-w-xs">
+                  <a href={attachment.url} target="_blank">
+                    <img src={attachment.url} />
+                  </a>
+                </div>
+              );
+            } else {
+              return (
+                <div class="flex flex-row items-center justify-center m-1 max-w-xs">
+                  <a href={attachment.url}>
+                    {attachment.name}
+                  </a>
+                </div>
+              );
+            }
+          })}
+        </div>
+        <a href={toot.url} className="pb-4 px-4" target="_blank">Link</a>
+      </div>
+    </>
+  );
+}
diff --git a/lume/src/_components/XeblogVideo.tsx b/lume/src/_components/XeblogVideo.tsx
index 7805ee7..01d271c 100644
--- a/lume/src/_components/XeblogVideo.tsx
+++ b/lume/src/_components/XeblogVideo.tsx
@@ -18,7 +18,7 @@ export default function Video({ path }: VideoProps) {
     `https://cdn.xeiaso.net/file/christine-static/${path}/index.m3u8`;
   const id = uuidv4();
   const video = (
-      <video autoplay="false" id={id} className="not-prose" style="width:100%" controls>
+      <video id={id} className="not-prose" style="width:100%" controls>
         <source src={streamURL} type="application/vnd.apple.mpegurl" />
         <source
           src="https://cdn.xeiaso.net/file/christine-static/blog/HLSBROKE.mp4"
diff --git a/lume/src/blog/2022-media.mdx b/lume/src/blog/2022-media.mdx
index 866ba35..1eea348 100644
--- a/lume/src/blog/2022-media.mdx
+++ b/lume/src/blog/2022-media.mdx
@@ -20,7 +20,7 @@ Originally I wanted to try and come up with some summary to what I think my
 that have either come out or come into my greasy mitts that I don't think I can
 summarize the entire year into a single game like I have previously.
 
-<xeblog-toot url="https://pony.social/@cadey/109586858299858972"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109586858299858972"></XeblogToot>
 
 ### Pokémon Legends Arceus
 
@@ -31,7 +31,7 @@ series has been a very stagnant affair. It really hasn't evolved very much over
 the years and the mainline Pokémon games are just further attempts at refining
 the vision they set out to meet in Red and Blue.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109583600146489858"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109583600146489858"></XeblogToot>
 
 Arceus is different. Arceus took a huge risk and actually _innovated_ on the
 core formula. You aren't some kid that was selected by the professor or
@@ -103,7 +103,7 @@ they were bad, Kirby games are always highly polished and _fun to play_; it just
 gets a bit samey to do the same thing over and over with different universal
 threats.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109587225045508785"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109587225045508785"></XeblogToot>
 
 Kirby and the Forgotten Land innovates on the Kirby formula by properly throwing
 Kirby into the third dimension. Instead of being 3d models on a 2d plane,
@@ -127,7 +127,7 @@ collectathon gameplay in a new way that is lovely to play through.
 It's a 10/10 game. I'd say it's one of the best games I've played this year. It
 looks gorgeous. Kirby has never controlled better.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109587224845384370"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109587224845384370"></XeblogToot>
 
 ### Forza Horizon 5
 
@@ -168,7 +168,7 @@ games Monolith Soft has ever put out. I'm going to be mostly focusing on the
 gameplay aspects and avoid talking about the story to avoid spoilers. All story
 content I talk about was in one of the first trailers for the games.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109583569501728880"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109583569501728880"></XeblogToot>
 
 You play as a bunch of weirdos that follow the former enemies now friends trope
 and set off across the world after they get labeled as targets to everyone for
@@ -177,7 +177,7 @@ rings tank, DPS healer, ranged tactical healer, meathead tank, and giant hammer
 user) and they all complement eachother perfectly. I could easily see that team
 balance lasting the entire game without the game being horrible.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109583599804802439"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109583599804802439"></XeblogToot>
 
 However Monolith didn't stop there. They kept going. Every character can get
 proficiency in every other character's class. When you meet hero characters in
@@ -187,7 +187,7 @@ hilariously tactical. The combat system is both more simple and more deep than
 the one in Xenoblade 2, and I can easily see people finding ways to make it even
 more elaborate as more DLC is released and discoveries are made.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109583569759228928"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109583569759228928"></XeblogToot>
 
 Other than that it's your standard jRPG. Fetch bread, slay archons. It's a 10/10
 game, but I still think that Xenoblade Chronicles 2 is my favorite game in the
@@ -214,7 +214,7 @@ There's a huge varity of weapons to choose from and I'm pretty sure there's a
 near infinite skill ceiling. I love Splatoon and Splatoon 3 does more of what
 works with the the squid kids.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109583557980648763"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109583557980648763"></XeblogToot>
 
 One of the side modes in Splatoon is Salmon Run, a PvE mode where a team of 4
 fights off hordes of Salmonids similar to CoD Zombies. One of the big things
@@ -423,7 +423,7 @@ game entirely.
 
 This was a mistake.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109371225744806341"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109371225744806341"></XeblogToot>
 
 Pokémon Sword reminded me of all the thigns I love about the more "classic"
 Pokémon formula. You are some kid who gets battle monsters and is told to go
@@ -432,7 +432,7 @@ Everything feels internally coherent and it runs _so well_ on the Switch. It
 makes me forget that the Tegra X1 chip is almost a decade old as I immerse
 myself into the world of Pokémon.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109388278313080789"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109388278313080789"></XeblogToot>
 
 One of the major weaknesses of the game was that it didn't bring much new to the
 table. It mostly was an incremental evolution of the core Pokémon games on the
@@ -481,14 +481,14 @@ let you get a _guaranteed catch_ for the Pokémon you are fighting. This can hel
 you clean out the remainders of your Pokédex that you just can't find in the
 open world.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109390898064213862"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109390898064213862"></XeblogToot>
 
 Every Pokémon game has a gimmick, and this one lets you _change the type of your
 Pokémon mid-battle_. This adds an entirely new layer to the Pokémon metagame and
 I can't wait to see how people abuse that for fun and profit. I'm already
 starting to plan out a competitive team.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109365757807939518"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109365757807939518"></XeblogToot>
 
 Violet is also a lot more refined than past Pokémon games. Items that you need
 to train your Pokémon to competitive status are all in one store for fairly
@@ -504,7 +504,7 @@ memory leak that means you need to restart the game every few hours to avoid the
 game chugging down to 15 FPS or worse. Some of the late game cutscenes can run
 at slideshow paces.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109368310013234498"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109368310013234498"></XeblogToot>
 
 It really makes me wonder what Pokémon games could look like if they targeted
 the PS5, PC, or Xbox consoles instead. The Tegra X1 that powers the Nintendo
@@ -512,7 +512,7 @@ Switch is a very capable and versatile chip, but you need a lot of care and
 optimization put into development to really make it shine. Pokémon Violet
 doesn't have that level of polish and it sadly shows.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109371148337126374"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109371148337126374"></XeblogToot>
 
 Personally I wish there were more outfit options than school uniforms, but that
 may have been a compromise made in development to make the deadline.
@@ -540,7 +540,7 @@ home. After finally getting my hands on a PS5 after trying for a year, it's
 now...the tool that my husband and I use to watch YouTube with while eating
 dinner at home.
 
-<xeblog-toot url="https://pony.social/@withinscreenshots/109564109317450120"></xeblog-toot>
+<XeblogToot url="https://pony.social/@withinscreenshots/109564109317450120"></XeblogToot>
 
 One of the Youtubers I follow named Pyrocynical has gotten a lot of flak since
 the PS5's release by saying that the PS5 has no games. Honestly, I have to agree
diff --git a/lume/src/blog/carcinization-golang.mdx b/lume/src/blog/carcinization-golang.mdx
index ada26a6..2df1d6c 100644
--- a/lume/src/blog/carcinization-golang.mdx
+++ b/lume/src/blog/carcinization-golang.mdx
@@ -56,7 +56,7 @@ Especially if your goal is to send toots to a Slack webhook.
 
 When you look at a toot such as this in the API:
 
-<xeblog-toot url="https://pony.social/@cadey/109388957068451434"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109388957068451434"></XeblogToot>
 
 Its content looks something like this:
 
diff --git a/lume/src/blog/deck-yuzu-syncthing.mdx b/lume/src/blog/deck-yuzu-syncthing.mdx
index bd8cbb7..8c364d3 100644
--- a/lume/src/blog/deck-yuzu-syncthing.mdx
+++ b/lume/src/blog/deck-yuzu-syncthing.mdx
@@ -40,7 +40,7 @@ For this example I'm going to focus on the following games:
 I own these two games on cartridge and I have dumped my copy of them
 from cartridge using a hackable Switch.
 
-<xeblog-toot url="https://pony.social/@cadey/110434991652438811"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/110434991652438811"></XeblogToot>
 
 Here's the other things you will need:
 
diff --git a/lume/src/blog/idk-about-email.mdx b/lume/src/blog/idk-about-email.mdx
index 9844e6b..4d47a4b 100644
--- a/lume/src/blog/idk-about-email.mdx
+++ b/lume/src/blog/idk-about-email.mdx
@@ -152,4 +152,4 @@ project to my astral sigil. You can find it in the upper left hand
 corner of the website. There's a villa in the northwest corner of the
 island. I'll be waiting there.
 
-<xeblog-toot url="https://pony.social/@cadey/110715083282612029"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/110715083282612029"></XeblogToot>
diff --git a/lume/src/blog/more-coso-bypasses.mdx b/lume/src/blog/more-coso-bypasses.mdx
index 5f6d5c3..2a25d1d 100644
--- a/lume/src/blog/more-coso-bypasses.mdx
+++ b/lume/src/blog/more-coso-bypasses.mdx
@@ -102,7 +102,7 @@ blocked on Twitter too.
 Amusingly my home IP address is listed as a "rogue state actor", which my
 friends at the pretend CIA have to disagree with:
 
-<xeblog-toot url="https://national-defence.network/notice/AQKqw3MT6vRE6MF2O0"></xeblog-toot>
+<XeblogToot url="https://national-defence.network/notice/AQKqw3MT6vRE6MF2O0"></XeblogToot>
 
 <XeblogConv name="Cadey" mood="enby">
   Honestly this is one of the highlights of my career as a technical
diff --git a/lume/src/blog/openssl-alarm-fatigue.mdx b/lume/src/blog/openssl-alarm-fatigue.mdx
index 5bd1b92..3c338f4 100644
--- a/lume/src/blog/openssl-alarm-fatigue.mdx
+++ b/lume/src/blog/openssl-alarm-fatigue.mdx
@@ -201,4 +201,4 @@ anyone really noticing its presence.
 
 <xeblog-sticker name="Cadey" mood="coffee"></xeblog-sticker>
 
-<xeblog-toot url="https://pony.social/@cadey/109270702249158842"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109270702249158842"></XeblogToot>
diff --git a/lume/src/blog/returnal.mdx b/lume/src/blog/returnal.mdx
index b8451ae..1d59cce 100644
--- a/lume/src/blog/returnal.mdx
+++ b/lume/src/blog/returnal.mdx
@@ -88,4 +88,4 @@ time.
   interesting to you.
 </XeblogConv>
 
-<xeblog-toot url="https://pony.social/@cadey/110234374591597923"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/110234374591597923"></XeblogToot>
diff --git a/lume/src/blog/rip-twitter.mdx b/lume/src/blog/rip-twitter.mdx
index 3d632f3..ce90e28 100644
--- a/lume/src/blog/rip-twitter.mdx
+++ b/lume/src/blog/rip-twitter.mdx
@@ -58,7 +58,7 @@ out. However, just pick something at random. [You can move your account
 later](https://docs.joinmastodon.org/user/moving/#migration) if you want to. It
 is not hard to do. Trust me.
 
-<xeblog-toot url="https://mastodon.sdf.org/@Ricardus/109322650979345324"></xeblog-toot>
+<XeblogToot url="https://mastodon.sdf.org/@Ricardus/109322650979345324"></XeblogToot>
 
 For a while I was running a crossposter between [my Fediverse
 profile](https://pony.social/@cadey) and Twitter. I have turned that off. The
@@ -91,7 +91,7 @@ getting better at public speaking and healing from my past. If you choose to
 follow this account, please keep in mind that I am _committed to the bit_ and I
 will be posting _entirely_ in [Lojban](https://lojban.pw/welcome/).
 
-<xeblog-toot url="https://vt.social/@xe/109308323411835557"></xeblog-toot>
+<XeblogToot url="https://vt.social/@xe/109308323411835557"></XeblogToot>
 
 [@cwebber@octodon.social](https://octodon.social/@cwebber) is one of the
 co-authors of the ActivityPub specification. She has done incredible work in
@@ -104,7 +104,7 @@ is a Bored Ape NFT. He's actually quite vocally anti-NFT and cryptocurrency in
 general. He has that Bored Ape because he randomly got a _pirated ape_ shoved
 into his Ethereum wallet and now uses it out of pure irony.
 
-<xeblog-toot url="https://fediverse.ghuntley.com/@ghuntley/109329174967503675"></xeblog-toot>
+<XeblogToot url="https://fediverse.ghuntley.com/@ghuntley/109329174967503675"></XeblogToot>
 
 [@LunaFoxgirlVT@vt.social](https://vt.social/@LunaFoxgirlVT) is the creator of
 [Inochi2D](https://inochi2d.com/), an open-source vtubing application for
@@ -123,7 +123,7 @@ eachother.
 rustaceans I know. Gankra fearlessly helps make Rust easier to use and is
 adept at posting. Here's an example of a Gankra post:
 
-<xeblog-toot url="https://toot.cat/@Gankra/109320427252456972"></xeblog-toot>
+<XeblogToot url="https://toot.cat/@Gankra/109320427252456972"></XeblogToot>
 
 [@cult@pony.social](https://pony.social/@cult) is the person that runs the
 Mastodon server that I post on. He's worth following because he has a true
diff --git a/lume/src/blog/site-update-mastodon-quoting.mdx b/lume/src/blog/site-update-mastodon-quoting.mdx
index af67f02..d561f62 100644
--- a/lume/src/blog/site-update-mastodon-quoting.mdx
+++ b/lume/src/blog/site-update-mastodon-quoting.mdx
@@ -34,7 +34,7 @@ Calendar](https://www.google.com/calendar/render?action=TEMPLATE&text=Xe%20strea
 This is my first time pre-announcing a stream like this and I hope that this
 will be worth it.
 
-<xeblog-toot url="https://pony.social/@cadey/109259252694255124"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109259252694255124"></XeblogToot>
 
 ## Mastodon quoting
 
@@ -54,11 +54,11 @@ things look like this:
 However, I think I can do it better. I wrote some code to serialize the mastodon
 post information to JSON on the disk and then I can render out toots like this:
 
-<xeblog-toot url="https://pony.social/@cadey/109242201983408404"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109242201983408404"></XeblogToot>
 
 It also works with embedded videos:
 
-<xeblog-toot url="https://pony.social/@cadey/109258440953407431"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109258440953407431"></XeblogToot>
 
 I think this looks much cleaner. It also puts a lot less load on the Mastodon
 server that I use, which will certainly make Cult Pony happier.
@@ -68,7 +68,7 @@ with both my site's git repo and the runtime closure of my website binary. When
 the HTML parser sees one of these tags:
 
 ```
-<xeblog-toot url="https://pony.social/@cadey/109258440953407431"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109258440953407431"></XeblogToot>
 ```
 
 It looks up that toot's information on the disk and then renders that into
@@ -124,11 +124,11 @@ To use Robocadey 2, all you need to do is mention
 [@robocadey@pony.social](https://pony.social/@robocadey) with a set of tags. For
 example, this input:
 
-<xeblog-toot url="https://pony.social/@cadey/109259064905977430"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109259064905977430"></XeblogToot>
 
 Will get you this output:
 
-<xeblog-toot url="https://pony.social/@robocadey/109259067844671412"></xeblog-toot>
+<XeblogToot url="https://pony.social/@robocadey/109259067844671412"></XeblogToot>
 
 Please do feel free to experiment with this. Keep in mind that it can only
 process one image at a time (the poor 2060 in `ontos` only has enough vram to do
@@ -137,7 +137,7 @@ one image at a time), so depending on load you may have to wait your turn.
 I'm not sure if this is a _bug_ or a _feature_, but if you reply to the bot,
 it'll also take that as input to generate new images:
 
-<xeblog-toot url="https://pony.social/@robocadey/109259173707928134"></xeblog-toot>
+<XeblogToot url="https://pony.social/@robocadey/109259173707928134"></XeblogToot>
 
 You can find the source code
 [here](https://github.com/Xe/x/tree/master/mastodon/robocadey2). This is not in
diff --git a/lume/src/blog/sonic-frontiers.mdx b/lume/src/blog/sonic-frontiers.mdx
index 2700c82..aa1c4da 100644
--- a/lume/src/blog/sonic-frontiers.mdx
+++ b/lume/src/blog/sonic-frontiers.mdx
@@ -198,7 +198,7 @@ Sonic can climb walls, fight enemies (with an _actual combat system_ that has
 _real mechanical depth_), recover Chaos Emeralds to take out Titans, and even go
 fishing with Big the Cat.
 
-<xeblog-toot url="https://pony.social/@cadey/109309523632526075"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109309523632526075"></XeblogToot>
 
 I'm not kidding. There's a fishing minigame with Big the Cat and it _breaks the
 game in half_ in the later parts. You can use fishing to skip the Cyberspace
diff --git a/lume/src/blog/video-compression.mdx b/lume/src/blog/video-compression.mdx
index 477a2f8..3adbd14 100644
--- a/lume/src/blog/video-compression.mdx
+++ b/lume/src/blog/video-compression.mdx
@@ -178,7 +178,7 @@ to and used by the masses. It's why we have Netflix.
   correlating keyframes as an artistic effect. Consider this meme:
 </XeblogConv>
 
-<xeblog-toot url="https://pony.social/@cadey/109813678329119959"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109813678329119959"></XeblogToot>
 
 ## VTubing and compression
 
diff --git a/lume/src/blog/xess-css-variables.mdx b/lume/src/blog/xess-css-variables.mdx
index c7a0b86..974dce4 100644
--- a/lume/src/blog/xess-css-variables.mdx
+++ b/lume/src/blog/xess-css-variables.mdx
@@ -37,7 +37,7 @@ repetitive. Everything looks _the same_. This is getting boring to me. I've been
 considering various ways to fix this, but I recently had a golden moment of
 inspiration when I saw one of my favorite Fediverse bots come across my feed:
 
-<xeblog-toot url="https://botsin.space/@randomColorContrasts/109212579424662451"></xeblog-toot>
+<XeblogToot url="https://botsin.space/@randomColorContrasts/109212579424662451"></XeblogToot>
 
 I've been following
 [@randomColorContrasts@botsin.space](https://botsin.space/@randomColorContrasts)
@@ -73,7 +73,7 @@ announce Xess 2.0.
 
 Here are some screenshots of one of the themes I created for this: cherry
 
-<xeblog-toot url="https://pony.social/@cadey/109298544735230581" />
+<XeblogToot url="https://pony.social/@cadey/109298544735230581" />
 
 My favorite part about all of this is how easy it is to customize a Xess theme.
 You only need to change _three_ variables to recolor the page: one for the
@@ -101,9 +101,9 @@ your heart's content.
 
 Here are some other themes I've cooked up:
 
-<xeblog-toot url="https://pony.social/@cadey/109298533570134274"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109298533570134274"></XeblogToot>
 
-<xeblog-toot url="https://pony.social/@cadey/109298538717562125"></xeblog-toot>
+<XeblogToot url="https://pony.social/@cadey/109298538717562125"></XeblogToot>
 
 I could easily see this being used with some kind of dynamic generation of theme
 colors based on user settings or even dynamically generated at a per-user level.