calendar

app/(app)/calendar/[naddr]/layout.tsx

@@ -0,0 +1,51 @@
+import type { Metadata, ResolvingMetadata } from "next";
+import { get } from "@/lib/server-actions/events/cache";
+
+export async function generateMetadata(
+  { params }: { params: { naddr: string } },
+  parent: ResolvingMetadata,
+): Promise<Metadata> {
+  // read route params
+  const identifier = params.naddr;
+
+  // fetch data
+  const event = await get(identifier);
+
+  // optionally access and extend (rather than replace) parent metadata
+  const previousImages = (await parent).openGraph?.images || [];
+  if (!event) {
+    return {
+      title: "Flockstr Calendar",
+      openGraph: {
+        images: previousImages,
+      },
+    };
+  }
+  const title = `${event.name} | Flockstr`;
+  const images = event.image
+    ? [event.image, ...previousImages]
+    : previousImages;
+  return {
+    title: title,
+    description: event.description,
+    openGraph: {
+      title: title,
+      description: event.description,
+      images: images,
+    },
+    twitter: {
+      title: title,
+      description: event.description,
+      images: images,
+      card: "summary_large_image",
+    },
+  };
+}
+
+export default function metadataLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return <>{children}</>;
+}

app/(app)/calendar/[naddr]/page.tsx

@@ -1,5 +1,5 @@
 "use client";
-import { useState } from "react";
+import { useEffect } from "react";
 import Image from "next/image";
 import Link from "next/link";
 import { nip19 } from "nostr-tools";
@@ -14,6 +14,7 @@ import {
 import { type NDKKind } from "@nostr-dev-kit/ndk";
 import Header from "./_components/Header";
 import EventsFromCalendar from "@/containers/EventsTimeline/EventsFromCalendar";
+import { add } from "@/lib/server-actions/events/cache";
 
 export default function EventPage({
   params: { naddr },
@@ -36,6 +37,22 @@ export default function EventPage({
     },
   });
   const event = events[0];
+  useEffect(() => {
+    if (event) {
+      const { tags, content } = event;
+      const name = getTagValues("name", tags) ?? "Untitled";
+      const image =
+        getTagValues("image", tags) ??
+        getTagValues("picture", tags) ??
+        getTagValues("banner", tags);
+      add({
+        identifier: naddr,
+        name: name,
+        description: content,
+        image: image,
+      });
+    }
+  }, [event]);
 
   if (!event) {
     return (

app/(app)/event/[naddr]/layout.tsx

@@ -22,18 +22,21 @@ export async function generateMetadata(
     };
   }
   const title = `${event.name} | Flockstr`;
+  const images = event.image
+    ? [event.image, ...previousImages]
+    : previousImages;
   return {
     title: title,
     description: event.description,
     openGraph: {
       title: title,
       description: event.description,
-      images: [event.image, ...previousImages],
+      images: images,
     },
     twitter: {
       title: title,
       description: event.description,
-      images: [event.image],
+      images: images,
       card: "summary_large_image",
     },
   };