feat: update to Next.js 15.6.0-canary.27 and enhance HomePage metadata

- Upgraded Next.js version in package.json and pnpm-lock.yaml to 15.6.0-canary.27.
- Added metadata to HomePage for improved SEO and social sharing, including Open Graph and Twitter card data.
- Implemented a new API route for managing likes, including GET and POST methods for fetching and incrementing like counts.
- Updated LikeWrapper component to fetch initial likes from the new API and handle like increments through API calls.
- Added a new image for Open Graph sharing.

Author: Kan-A-Pesh

demo/app/api/likes/route.ts

@@ -0,0 +1,39 @@
+import { NextResponse } from 'next/server'
+
+import { getRedis } from '@/lib/redis'
+import { getServerRealtime } from '@/lib/realtime/server'
+
+export const dynamic = 'force-dynamic'
+
+export async function GET() {
+  try {
+    const redis = getRedis()
+    const count = await redis.get('demo:likes')
+    return NextResponse.json({ count: count ? Number(count) : 0 })
+  } catch (error) {
+    console.error('Failed to get likes:', error)
+    return NextResponse.json(
+      { status: 'error', message: 'Internal server error' },
+      { status: 500 }
+    )
+  }
+}
+
+export async function POST() {
+  try {
+    const redis = getRedis()
+
+    const newCount = await redis.incr('demo:likes')
+
+    const realtime = getServerRealtime()
+    await realtime.push('demo:likes:updated', { count: newCount })
+
+    return NextResponse.json({ count: newCount })
+  } catch (error) {
+    console.error('Failed to increment likes:', error)
+    return NextResponse.json(
+      { status: 'error', message: 'Internal server error' },
+      { status: 500 }
+    )
+  }
+}

demo/app/page.tsx

@@ -1,3 +1,4 @@
+import type { Metadata } from "next";
 import {
   codeExampleToJsx,
   dockerCommand,
@@ -22,6 +23,48 @@ import { RiDiscordFill, RiGithubFill } from "@remixicon/react";
 import Link from "next/link";
 import LikeWrapper from "@/components/like-wrapper";
 
+export const metadata: Metadata = {
+  title: "Type-safe live updates in minutes | Impulse Realtime",
+  description: "Zero-config SSE. Shared types. Simple client & server helpers.",
+  keywords: [
+    "Impulse Realtime",
+    "type-safe live updates",
+    "SSE",
+    "real-time API",
+    "shared types",
+  ],
+  alternates: {
+    canonical: "https://realtime.impulselab.ai",
+  },
+  openGraph: {
+    title: "Type-safe live updates in minutes | Impulse Realtime",
+    description:
+      "Zero-config SSE. Shared types. Simple client & server helpers.",
+    url: "https://realtime.impulselab.ai",
+    images: [
+      {
+        url: "/realtime-og.png",
+        width: 1200,
+        height: 630,
+        alt: "Type-safe live updates in minutes",
+      },
+    ],
+  },
+  twitter: {
+    title: "Type-safe live updates in minutes | Impulse Realtime",
+    description:
+      "Zero-config SSE. Shared types. Simple client & server helpers.",
+    images: [
+      {
+        url: "/realtime-og.png",
+        width: 1200,
+        height: 630,
+        alt: "Type-safe live updates in minutes",
+      },
+    ],
+  },
+};
+
 export default async function HomePage() {
   return (
     <main className="border-x border-gray-700 min-h-screen mx-auto w-[90vw] max-w-4xl pt-[10vh]">

demo/components/like-wrapper.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { useEffect, useState } from "react";
-import { getInitialLikes, incrementLikesAction } from "@/app/actions";
 import LikeButton from "./like-button";
 
 export default function LikeWrapper() {
@@ -11,7 +10,11 @@ export default function LikeWrapper() {
   useEffect(() => {
     const fetchInitialLikes = async () => {
       try {
-        const count = await getInitialLikes();
+        const response = await fetch('/api/likes');
+        if (!response.ok) {
+          throw new Error(`HTTP error! status: ${response.status}`);
+        }
+        const { count } = await response.json();
         setInitialCount(count);
       } catch (error) {
         console.error("Failed to fetch initial likes:", error);
@@ -24,13 +27,26 @@ export default function LikeWrapper() {
     fetchInitialLikes();
   }, []);
 
+  const handleLike = async () => {
+    try {
+      const response = await fetch('/api/likes', {
+        method: 'POST',
+      });
+      if (!response.ok) {
+        throw new Error(`HTTP error! status: ${response.status}`);
+      }
+    } catch (error) {
+      console.error("Failed to increment likes:", error);
+    }
+  };
+
   if (!isLoaded) {
     return (
-      <LikeButton initialCount={0} onLike={incrementLikesAction} />
+      <LikeButton initialCount={0} onLike={handleLike} />
     );
   }
 
   return (
-    <LikeButton initialCount={initialCount} onLike={incrementLikesAction} />
+    <LikeButton initialCount={initialCount} onLike={handleLike} />
   );
 }

demo/package.json

@@ -16,7 +16,7 @@
     "ioredis": "^5.7.0",
     "lucide-react": "^0.544.0",
     "motion": "^12.23.19",
-    "next": "15.5.3",
+    "next": "15.6.0-canary.27",
     "postcss": "^8.5.6",
     "react": "19.1.0",
     "react-dom": "19.1.0",