feat(backend): og image and meta tags

2025-01-23 18:42:29 +01:00
parent 287230c996
commit 4806ad5499
6 changed files with 62 additions and 0 deletions
--- a/components/MetaTags.tsx
+++ b/components/MetaTags.tsx
@ -0,0 +1,54 @@
+import { GenericResource } from "@lib/types.ts";
+import { Head } from "$fresh/runtime.ts";
+
+function generateJsonLd(resource: GenericResource): string {
+  const baseSchema: Record<string, unknown> = {
+    "@context": "https://schema.org",
+    "@type": resource.type.charAt(0).toUpperCase() + resource.type.slice(1), // Converts type to PascalCase
+    name: resource.name,
+    description: resource.content || resource.meta?.average || "",
+    keywords: resource.tags?.join(", ") || "",
+    image: resource.meta?.image || "/images/og-image.jpg",
+  };
+
+  if (resource.meta?.author) {
+    baseSchema.author = {
+      "@type": "Person",
+      name: resource.meta.author,
+    };
+  }
+
+  if (resource.meta?.date) {
+    baseSchema.datePublished = new Date(resource.meta.date).toISOString();
+  }
+
+  if (resource.meta?.rating) {
+    baseSchema.aggregateRating = {
+      "@type": "AggregateRating",
+      ratingValue: resource.meta.rating,
+      bestRating: 10, // Assuming a scale of 1 to 10
+    };
+  }
+
+  return JSON.stringify(baseSchema, null, 2);
+}
+
+export function MetaTags({ resource }: { resource: GenericResource }) {
+  const jsonLd = generateJsonLd(resource);
+  return (
+    <>
+      <Head>
+        <meta property="og:title" content={resource.name} />
+        <meta property="og:type" content={resource.type} />
+        <meta
+          property="og:image"
+          content={resource.meta?.image || "/images/og-image.jpg"}
+        />
+        <script
+          type="application/ld+json"
+          dangerouslySetInnerHTML={{ __html: jsonLd }}
+        />
+      </Head>
+    </>
+  );
+}