Fix tag click 404: link TagBadge to /posts?tag= filter

- TagBadge now links to /posts?tag=<tag> instead of /tags/<tag>/
- SupabasePostsWithFilter reads ?tag query param for initial filter
- Wrap with Suspense for useSearchParams compatibility

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: Yushin-L

src/app/posts/page.tsx

@@ -1,10 +1,13 @@
+import { Suspense } from "react";
 import SupabasePostsWithFilter from "@/components/posts/SupabasePostsWithFilter";
 
 export default function AllPostsPage() {
   return (
     <>
       <h1 className="mb-8 text-2xl font-bold text-stone-900">전체 글</h1>
-      <SupabasePostsWithFilter />
+      <Suspense>
+        <SupabasePostsWithFilter />
+      </Suspense>
     </>
   );
 }

src/components/posts/SupabasePostsWithFilter.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useEffect, useState } from "react";
+import { useSearchParams } from "next/navigation";
 import { getPublishedPosts } from "@/lib/drafts/published";
 import type { Post } from "@/types/post";
 import type { PostDraft } from "@/lib/supabase/types";
@@ -28,9 +29,11 @@ function draftToPost(draft: PostDraft): Post {
 }
 
 export default function SupabasePostsWithFilter() {
+  const searchParams = useSearchParams();
+  const initialTag = searchParams.get("tag");
   const [posts, setPosts] = useState<Post[]>([]);
   const [loading, setLoading] = useState(true);
-  const [selectedTag, setSelectedTag] = useState<string | null>(null);
+  const [selectedTag, setSelectedTag] = useState<string | null>(initialTag);
 
   useEffect(() => {
     getPublishedPosts()

src/components/posts/TagBadge.tsx

@@ -7,7 +7,7 @@ interface TagBadgeProps {
 export default function TagBadge({ tag }: TagBadgeProps) {
   return (
     <Link
-      href={`/tags/${tag}/`}
+      href={`/posts?tag=${encodeURIComponent(tag)}`}
       className="inline-block rounded-full bg-indigo-50 px-3 py-1 text-xs font-medium text-indigo-600 transition-colors hover:bg-indigo-100"
     >
       {tag}