fix: 合并服务器未推送改动并保留手动视频标签

app/page.tsx

@@ -1,9 +1,11 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import { VIDEO_CONTENT_TAGS, isVideoContentTag } from "@/lib/video-tags";
+import { getFileUrl } from "@/lib/minio";
 import { prisma } from "@/lib/prisma";
 import FeedMasonry from "./components/FeedMasonry";
 import SearchBox from "./components/SearchBox";
 import type { FeedItem } from "./types/feed";
-import type { Metadata } from "next";
-import { getFileUrl } from "@/lib/minio";
 
 export const dynamic = "force-dynamic";
 
@@ -12,18 +14,38 @@ export const metadata: Metadata = {
   description: "抖歪作品集，记录当下时代的精彩瞬间",
 };
 
-export default async function Home() {
+export default async function Home({
+  searchParams,
+}: {
+  searchParams?: { tag?: string };
+}) {
+  const requestedTag = searchParams?.tag?.trim() || "";
+  const selectedTag =
+    requestedTag && isVideoContentTag(requestedTag) ? requestedTag : null;
+
   const [videos, posts] = await Promise.all([
     prisma.video.findMany({
+      where: selectedTag
+        ? {
+            manual_content_tags: { has: selectedTag },
+          }
+        : undefined,
       orderBy: { created_at: "desc" },
       take: 60,
-      include: { author: true },
-    }),
-    prisma.imagePost.findMany({
-      orderBy: { created_at: "desc" },
-      take: 60,
-      include: { author: true, images: { orderBy: { order: "asc" }, take: 1 } },
+      include: {
+        author: true,
+      },
     }),
+    selectedTag
+      ? Promise.resolve([])
+      : prisma.imagePost.findMany({
+          orderBy: { created_at: "desc" },
+          take: 60,
+          include: {
+            author: true,
+            images: { orderBy: { order: "asc" }, take: 1 },
+          },
+        }),
   ]);
 
   const feed: FeedItem[] = [
@@ -42,22 +64,26 @@ export default async function Home() {
         sec_uid: v.author.sec_uid,
       },
       likes: Number(v.digg_count),
+      content_tags: v.manual_content_tags,
     })),
-    ...posts.map((p) => ({
-      type: "image" as const,
-      aweme_id: p.aweme_id,
-      created_at: p.created_at,
-      desc: p.desc,
-      cover_url: getFileUrl(p.images?.[0]?.url ?? null),
-      width: p.images?.[0]?.width ?? null,
-      height: p.images?.[0]?.height ?? null,
-      author: {
-        nickname: p.author.nickname,
-        avatar_url: getFileUrl(p.author.avatar_url ?? ""),
-        sec_uid: p.author.sec_uid,
-      },
-      likes: Number(p.digg_count),
-    })),
+    ...posts.map((p) => {
+      const coverPath = p.images?.[0]?.url;
+      return {
+        type: "image" as const,
+        aweme_id: p.aweme_id,
+        created_at: p.created_at,
+        desc: p.desc,
+        cover_url: coverPath ? getFileUrl(coverPath) : null,
+        width: p.images?.[0]?.width ?? null,
+        height: p.images?.[0]?.height ?? null,
+        author: {
+          nickname: p.author.nickname,
+          avatar_url: getFileUrl(p.author.avatar_url ?? ""),
+          sec_uid: p.author.sec_uid,
+        },
+        likes: Number(p.digg_count),
+      };
+    }),
   ]
     //.sort(() => Math.random() - 0.5)
     .sort((a, b) => +new Date(b.created_at) - +new Date(a.created_at));
@@ -75,20 +101,53 @@ export default async function Home() {
         </h1>
 
         <div className="w-full max-w-xl mb-12">
-          <SearchBox />
+          <SearchBox tag={selectedTag} />
+        </div>
+
+        <div className="mb-8 flex w-full max-w-4xl flex-wrap justify-center gap-2">
+          <Link
+            href="/"
+            className={`rounded-full border px-3 py-1.5 text-sm font-medium transition-colors ${
+              selectedTag
+                ? "border-zinc-200 bg-white/70 text-zinc-600 hover:border-zinc-300 dark:border-white/10 dark:bg-white/5 dark:text-zinc-300"
+                : "border-blue-500 bg-blue-600 text-white"
+            }`}
+          >
+            全部
+          </Link>
+          {VIDEO_CONTENT_TAGS.map((tag) => (
+            <Link
+              key={tag}
+              href={`/?tag=${encodeURIComponent(tag)}`}
+              className={`rounded-full border px-3 py-1.5 text-sm font-medium transition-colors ${
+                selectedTag === tag
+                  ? "border-blue-500 bg-blue-600 text-white"
+                  : "border-zinc-200 bg-white/70 text-zinc-600 hover:border-zinc-300 dark:border-white/10 dark:bg-white/5 dark:text-zinc-300 dark:hover:text-white"
+              }`}
+            >
+              {tag}
+            </Link>
+          ))}
         </div>
 
         <div className="w-full">
           {(() => {
             const initial = feed.slice(0, 24);
-            const cursor =
-              initial.length > 0
-                ? new Date(
-                    initial[initial.length - 1].created_at as any,
-                  ).toISOString()
-                : null;
+            const lastItem = initial.at(-1);
+            const cursor = lastItem
+              ? new Date(lastItem.created_at).toISOString()
+              : null;
             return (
-              <FeedMasonry initialItems={initial} initialCursor={cursor} />
+              <FeedMasonry
+                key={selectedTag ?? "all"}
+                initialItems={initial}
+                initialCursor={cursor}
+                fetchUrl={
+                  selectedTag
+                    ? `/api/feed?tag=${encodeURIComponent(selectedTag)}`
+                    : "/api/feed"
+                }
+              />
             );
           })()}
         </div>