Attempt fixing social previews on WhatsApp (#334)

Author: alexp-sssup

packages/astro-theme/layouts/BlogPost.astro

@@ -12,7 +12,7 @@ import BlogPostCardSet from "../components/BlogPostCardSet.astro";
 import { resolveAuthors } from "../lib/blog";
 import LinkButton from "../components/LinkButton.astro";
 import { DISCORD_URL } from "../consts";
-import { Image } from "astro:assets";
+import { Image, getImage } from "astro:assets";
 import { productFromUrl } from "../lib/products";
 import ProductNav from "../components/nav/product/Nav.astro";
 
@@ -33,9 +33,20 @@ let titleAndSubtitle = title;
 if (subtitle) {
 	titleAndSubtitle += `: ${subtitle}`;
 }
+
+// Generate optimized social preview image using the same optimization as the hero image
+const socialImage = heroImage
+	? await getImage({
+			src: heroImage,
+			width: 1232,
+			height: 480,
+			quality: "max",
+			format: "jpg",
+		})
+	: undefined;
 ---
 
-<Shell title={titleAndSubtitle} {description} image={heroImage?.src}>
+<Shell title={titleAndSubtitle} {description} image={socialImage?.src}>
 	{product && <ProductNav {product} />}
 	<main class="px-6 py-10 w-full max-w-screen-xl mx-auto">
 		<a