Merge pull request #1 from bertyuan/feat-introduce-payloadv1.0

Feat: introduce payload

43 files changed, 491 insertions, 311 deletions

diff --git a/src/app/(home)/posts/[slug]/page.tsx b/src/app/(home)/posts/[slug]/page.tsx
deleted file mode 100644
index 15a6bfd..0000000
--- a/src/app/(home)/posts/[slug]/page.tsx
+++ /dev/null
@@ -1,145 +0,0 @@
-import { PostComments, Share } from '@/app/(home)/posts/[slug]/page.client';
-import { PostJsonLd } from '@/components/json-ld';
-import { Section } from '@/components/section';
-import { TagCard } from '@/components/tags/tag-card';
-import { createMetadata } from '@/lib/metadata';
-import { metadataImage } from '@/lib/metadata-image';
-import { type Page as MDXPage, getPost, getPosts } from '@/lib/source';
-import { cn } from '@/lib/utils';
-import { File, Files, Folder } from 'fumadocs-ui/components/files';
-import { InlineTOC } from 'fumadocs-ui/components/inline-toc';
-import { Tab, Tabs } from 'fumadocs-ui/components/tabs';
-import defaultMdxComponents from 'fumadocs-ui/mdx';
-import type { Metadata } from 'next';
-import { notFound } from 'next/navigation';
-import Balancer from 'react-wrap-balancer';
-import { description as homeDescription } from 'src/app/layout.config';
-
-function Header(props: { page: MDXPage; tags?: string[] }) {
-  const { page, tags } = props;
-
-  return (
-    <Section className='p-4 lg:p-6'>
-      <div
-        className={cn(
-          'flex flex-col items-start justify-center gap-4 py-8 md:gap-6',
-          'sm:items-center sm:rounded-lg sm:border sm:bg-muted/70 sm:px-8 sm:py-20 sm:shadow-xs sm:dark:bg-muted',
-        )}
-      >
-        <div className='flex flex-col gap-2 sm:text-center md:gap-4'>
-          <h1 className='max-w-4xl font-bold text-3xl leading-tight tracking-tight sm:text-4xl sm:leading-tight md:text-5xl md:leading-tight'>
-            <Balancer>{page.data.title}</Balancer>
-          </h1>
-          <p className='mx-auto max-w-4xl'>
-            <Balancer>{page.data.description}</Balancer>
-          </p>
-        </div>
-        <div className='flex flex-wrap gap-2'>
-          {tags?.map((tag) => (
-            <TagCard name={tag} key={tag} className=' border border-border ' />
-          ))}
-        </div>
-      </div>
-    </Section>
-  );
-}
-
-export default async function Page(props: {
-  params: Promise<{ slug: string }>;
-}) {
-  const params = await props.params;
-  const page = getPost([params.slug]);
-
-  if (!page) notFound();
-  const { body: Mdx, toc, tags, lastModified } = page.data;
-
-  const lastUpdate = lastModified ? new Date(lastModified) : undefined;
-
-  return (
-    <>
-      <Header page={page} tags={tags} />
-
-      <Section className='h-full' sectionClassName='flex flex-1'>
-        <article className='flex min-h-full flex-col lg:flex-row'>
-          <div className='flex flex-1 flex-col gap-4'>
-            <InlineTOC
-              items={toc}
-              className='rounded-none border-0 border-border/70 border-b border-dashed dark:border-border'
-            />
-            <div className='prose min-w-0 flex-1 px-4'>
-              <Mdx
-                components={{
-                  ...defaultMdxComponents,
-                  File,
-                  Files,
-                  Folder,
-                  Tabs,
-                  Tab,
-                }}
-              />
-            </div>
-            <PostComments
-              slug={params.slug}
-              className='[&_form>div]:!rounded-none rounded-none border-0 border-border/70 border-t border-dashed dark:border-border'
-            />
-          </div>
-          <div className='flex flex-col gap-4 p-4 text-sm lg:sticky lg:top-[4rem] lg:h-[calc(100vh-4rem)] lg:w-[250px] lg:self-start lg:overflow-y-auto lg:border-border/70 lg:border-l lg:border-dashed lg:dark:border-border'>
-            <div>
-              <p className='mb-1 text-fd-muted-foreground'>Written by</p>
-              <p className='font-medium'>{page.data.author}</p>
-            </div>
-            <div>
-              <p className='mb-1 text-fd-muted-foreground text-sm'>
-                Created At
-              </p>
-              <p className='font-medium'>
-                {new Date(page.data.date ?? page.file.name).toDateString()}
-              </p>
-            </div>
-            {lastUpdate && (
-              <div>
-                <p className='mb-1 text-fd-muted-foreground text-sm'>
-                  Updated At
-                </p>
-                <p className='font-medium'>{lastUpdate.toDateString()}</p>
-              </div>
-            )}
-            <Share url={page.url} />
-          </div>
-        </article>
-      </Section>
-      <PostJsonLd page={page} />
-    </>
-  );
-}
-
-export async function generateMetadata(props: {
-  params: Promise<{ slug: string }>;
-}): Promise<Metadata> {
-  const params = await props.params;
-  const page = getPost([params.slug]);
-
-  if (!page) notFound();
-
-  const title = page.data.title;
-  const description = page.data.description ?? homeDescription;
-
-  return createMetadata(
-    metadataImage.withImage(page.slugs, {
-      title,
-      description,
-      openGraph: {
-        url: `/posts/${page.slugs.join('/')}`,
-      },
-      alternates: {
-        canonical: page.url,
-      },
-    }),
-  );
-}
-
-export function generateStaticParams(): { slug: string | undefined }[] {
-  return getPosts().map((page) => ({
-    slug: page.slugs[0],
-  }));
-}
diff --git a/src/app/(auth)/login/page.tsx b/src/app/(main)/(auth)/login/page.tsx
index 2469097..3ff59d3 100644
--- a/src/app/(auth)/login/page.tsx
+++ b/src/app/(main)/(auth)/login/page.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { baseOptions, linkItems } from '@/app/layout.config';
+import { baseOptions, linkItems } from '@/app/(main)/layout.config';
 import { Icons } from '@/components/icons/icons';
 import { Header } from '@/components/sections/header';
 import { Button } from '@/components/ui/button';
diff --git a/src/app/(home)/(mdx)/about/page.mdx b/src/app/(main)/(home)/(mdx)/about/page.mdx
index 675f3a8..675f3a8 100644
--- a/src/app/(home)/(mdx)/about/page.mdx
+++ b/src/app/(main)/(home)/(mdx)/about/page.mdx
diff --git a/src/app/(home)/_components/call-to-action.tsx b/src/app/(main)/(home)/_components/call-to-action.tsx
index b75298e..b75298e 100644
--- a/src/app/(home)/_components/call-to-action.tsx
+++ b/src/app/(main)/(home)/_components/call-to-action.tsx
diff --git a/src/app/(home)/_components/hero.tsx b/src/app/(main)/(home)/_components/hero.tsx
index 8ac251b..04371ca 100644
--- a/src/app/(home)/_components/hero.tsx
+++ b/src/app/(main)/(home)/_components/hero.tsx
@@ -1,4 +1,4 @@
-import { baseOptions, linkItems } from '@/app/layout.config';
+import { baseOptions, linkItems } from '@/app/(main)/layout.config';
 import { Icons } from '@/components/icons/icons';
 import { Section } from '@/components/section';
 import { buttonVariants } from '@/components/ui/button';
@@ -8,7 +8,7 @@ import * as motion from 'motion/react-client';
 import Image from 'next/image';
 import Link from 'next/link';
 import Balancer from 'react-wrap-balancer';
-import heroImage from '../../../../public/images/gradient-noise-purple-azure-light.png';
+import heroImage from '../../../../../public/images/gradient-noise-purple-azure-light.png';
 
 const Hero = () => {
   const links = getLinks(linkItems, baseOptions.githubUrl);
diff --git a/src/app/(home)/_components/posts.tsx b/src/app/(main)/(home)/_components/posts.tsx
index 8c8dc33..0eacce1 100644
--- a/src/app/(home)/_components/posts.tsx
+++ b/src/app/(main)/(home)/_components/posts.tsx
@@ -2,28 +2,29 @@ import { Icons } from '@/components/icons/icons';
 import { PostCard } from '@/components/posts/post-card';
 import { Section } from '@/components/section';
 import { buttonVariants } from '@/components/ui/button';
-import type { Page } from '@/lib/source';
+import type { BlogPost } from '@/lib/payload-posts';
 import Link from 'next/link';
 
-export default function Posts({ posts }: { posts: Page[] }) {
+interface PostsProps {
+  posts: BlogPost[];
+}
+
+export default function Posts({ posts }: PostsProps) {
   return (
     <Section>
       <div className='grid divide-y divide-dashed divide-border/70 text-left dark:divide-border'>
-        {posts.map((post) => {
-          const date = new Date(post.data.date).toDateString();
-          return (
-            <PostCard
-              title={post.data.title}
-              description={post.data.description ?? ''}
-              image={post.data.image}
-              url={post.url}
-              date={date}
-              key={post.url}
-              author={post.data.author}
-              tags={post.data.tags}
-            />
-          );
-        })}
+        {posts.map((post) => (
+          <PostCard
+            title={post.title}
+            description={post.description}
+            image={post.image}
+            url={post.url}
+            date={post.date.toDateString()}
+            key={post.id}
+            author={post.author}
+            tags={post.tags}
+          />
+        ))}
         <Link
           href='/posts'
           className={buttonVariants({
diff --git a/src/app/(home)/actions.ts b/src/app/(main)/(home)/actions.ts
index fdb16ca..5b0c456 100644
--- a/src/app/(home)/actions.ts
+++ b/src/app/(main)/(home)/actions.ts
@@ -1,8 +1,7 @@
 'use server';
 
-import { getContact, sendWelcomeEmail, updateContact } from '@/lib/resend';
+import { getContact, updateContact } from '@/lib/resend';
 import { ActionError, actionClient } from '@/lib/safe-action';
-import { getSortedByDatePosts } from '@/lib/source';
 import { NewsletterSchema } from '@/lib/validators';
 import { getSession } from '@/server/auth';
 import { Resend } from 'resend';
@@ -59,12 +58,12 @@ export const subscribeUser = actionClient
         );
       }
 
-      const posts = getSortedByDatePosts();
-      await sendWelcomeEmail({
-        posts,
-        to: email,
-        firstName: firstName || 'there',
-      });
+      // const posts = getSortedByDatePosts();
+      // await sendWelcomeEmail({
+      //   posts,
+      //   to: email,
+      //   firstName: firstName || 'there',
+      // });
 
       return {
         success: true,
diff --git a/src/app/(home)/layout.tsx b/src/app/(main)/(home)/layout.tsx
index bd641df..bd641df 100644
--- a/src/app/(home)/layout.tsx
+++ b/src/app/(main)/(home)/layout.tsx
diff --git a/src/app/(home)/page.tsx b/src/app/(main)/(home)/page.tsx
index da7da0f..0718da9 100644
--- a/src/app/(home)/page.tsx
+++ b/src/app/(main)/(home)/page.tsx
@@ -1,13 +1,13 @@
-import Hero from '@/app/(home)/_components/hero';
-import Posts from '@/app/(home)/_components/posts';
+import Hero from '@/app/(main)/(home)/_components/hero';
+import Posts from '@/app/(main)/(home)/_components/posts';
 import { Icons } from '@/components/icons/icons';
 import { Section } from '@/components/section';
 import Separator from '@/components/separator';
-import { getSortedByDatePosts } from '@/lib/source';
+import { getPublishedPosts } from '@/lib/payload-posts';
 import { CTA } from './_components/call-to-action';
 
-export default function Home() {
-  const posts = getSortedByDatePosts().slice(0, 3);
+export default async function Home() {
+  const { posts } = await getPublishedPosts({ limit: 3 });
 
   return (
     <>
@@ -15,7 +15,7 @@ export default function Home() {
       <Section className='py-8 sm:py-16'>
         <h2 className='text-center font-semibold text-2xl sm:text-3xl md:text-4xl lg:text-5xl'>
           <span className='inline-flex items-center gap-3'>
-            Posts{' '}
+            Posts
             <Icons.posts className='size-10 fill-fd-primary/30 text-fd-primary transition-transform hover:rotate-12 hover:scale-125' />
           </span>
         </h2>
diff --git a/src/app/(home)/posts/[slug]/page.client.tsx b/src/app/(main)/(home)/posts/[slug]/page.client.tsx
index 7a97f56..7a97f56 100644
--- a/src/app/(home)/posts/[slug]/page.client.tsx
+++ b/src/app/(main)/(home)/posts/[slug]/page.client.tsx
diff --git a/src/app/(main)/(home)/posts/[slug]/page.tsx b/src/app/(main)/(home)/posts/[slug]/page.tsx
new file mode 100644
index 0000000..5960f06
--- /dev/null
+++ b/src/app/(main)/(home)/posts/[slug]/page.tsx
@@ -0,0 +1,129 @@
+import {
+  PostComments,
+  Share,
+} from '@/app/(main)/(home)/posts/[slug]/page.client';
+import { PostJsonLd } from '@/components/json-ld';
+import { RichText } from '@/components/rich-text';
+import { Section } from '@/components/section';
+import { TagCard } from '@/components/tags/tag-card';
+import { createMetadata } from '@/lib/metadata';
+import {
+  getPostBySlug,
+  getAllPostSlugs,
+  type BlogPost,
+} from '@/lib/payload-posts';
+import { cn } from '@/lib/utils';
+import type { Metadata } from 'next';
+import { notFound } from 'next/navigation';
+import Balancer from 'react-wrap-balancer';
+import { description as homeDescription } from '@/app/(main)/layout.config';
+
+function PostHeader(props: { post: BlogPost }) {
+  const { post } = props;
+
+  return (
+    <Section className="p-4 lg:p-6">
+      <div
+        className={cn(
+          'flex flex-col items-start justify-center gap-4 py-8 md:gap-6',
+          'sm:items-center sm:rounded-lg sm:border sm:bg-muted/70 sm:px-8 sm:py-20 sm:shadow-xs sm:dark:bg-muted'
+        )}
+      >
+        <div className="flex flex-col gap-2 sm:text-center md:gap-4">
+          <h1 className="max-w-4xl font-bold text-3xl leading-tight tracking-tight sm:text-4xl sm:leading-tight md:text-5xl md:leading-tight">
+            <Balancer>{post.title}</Balancer>
+          </h1>
+          <p className="mx-auto max-w-4xl">
+            <Balancer>{post.description}</Balancer>
+          </p>
+        </div>
+        <div className="flex flex-wrap gap-2">
+          {post.tags?.map((tag) => (
+            <TagCard name={tag} key={tag} className=" border border-border " />
+          ))}
+        </div>
+      </div>
+    </Section>
+  );
+}
+
+function PostContent({ post }: { post: BlogPost }) {
+  return (
+    <>
+      <PostHeader post={post} />
+
+      <Section className="h-full" sectionClassName="flex flex-1">
+        <article className="flex min-h-full flex-col lg:flex-row">
+          <div className="flex flex-1 flex-col gap-4">
+            <RichText
+              content={post.content as Record<string, unknown>}
+              className="flex-1 px-4"
+              enableProse={true}
+            />
+            <PostComments
+              slug={post.slug}
+              className="[&_form>div]:!rounded-none rounded-none border-0 border-border/70 border-t border-dashed dark:border-border"
+            />
+          </div>
+          <div className="flex flex-col gap-4 p-4 text-sm lg:sticky lg:top-[4rem] lg:h-[calc(100vh-4rem)] lg:w-[250px] lg:self-start lg:overflow-y-auto lg:border-border/70 lg:border-l lg:border-dashed lg:dark:border-border">
+            <div>
+              <p className="mb-1 text-fd-muted-foreground">Written by</p>
+              <p className="font-medium">{post.author}</p>
+            </div>
+            <div>
+              <p className="mb-1 text-fd-muted-foreground text-sm">Created At</p>
+              <p className="font-medium">{post.date.toDateString()}</p>
+            </div>
+            <div>
+              <p className="mb-1 text-fd-muted-foreground text-sm">Updated At</p>
+              <p className="font-medium">{post.updatedAt.toDateString()}</p>
+            </div>
+            <Share url={post.url} />
+          </div>
+        </article>
+      </Section>
+      <PostJsonLd post={post} />
+    </>
+  );
+}
+
+export default async function Page(props: {
+  params: Promise<{ slug: string }>;
+}) {
+  const params = await props.params;
+  const post = await getPostBySlug(params.slug);
+
+  if (!post) {
+    notFound();
+  }
+
+  return <PostContent post={post} />;
+}
+
+export async function generateMetadata(props: {
+  params: Promise<{ slug: string }>;
+}): Promise<Metadata> {
+  const params = await props.params;
+  const post = await getPostBySlug(params.slug);
+
+  if (!post) {
+    return {};
+  }
+
+  return createMetadata({
+    title: post.title,
+    description: post.description || homeDescription,
+    openGraph: {
+      url: `/posts/${post.slug}`,
+      images: post.image ? [{ url: post.image }] : undefined,
+    },
+    alternates: {
+      canonical: `/posts/${post.slug}`,
+    },
+  });
+}
+
+export async function generateStaticParams(): Promise<{ slug: string }[]> {
+  const slugs = await getAllPostSlugs();
+  return slugs.map((slug) => ({ slug }));
+}
diff --git a/src/app/(home)/posts/page.tsx b/src/app/(main)/(home)/posts/page.tsx
index fd0f912..40ebcda 100644
--- a/src/app/(home)/posts/page.tsx
+++ b/src/app/(main)/(home)/posts/page.tsx
@@ -1,23 +1,20 @@
-import { postsPerPage } from '@/app/layout.config';
+import { postsPerPage } from '@/app/(main)/layout.config';
 import { NumberedPagination } from '@/components/numbered-pagination';
 import { PostCard } from '@/components/posts/post-card';
 import { Section } from '@/components/section';
 import { createMetadata } from '@/lib/metadata';
-import { getSortedByDatePosts } from '@/lib/source';
+import { getPublishedPosts } from '@/lib/payload-posts';
 import type { Metadata, ResolvingMetadata } from 'next';
 import { notFound, redirect } from 'next/navigation';
 
-export const dynamicParams = false;
-
-const totalPosts = getSortedByDatePosts().length;
-const pageCount = Math.ceil(totalPosts / postsPerPage);
-
 const CurrentPostsCount = ({
   startIndex,
   endIndex,
+  totalPosts,
 }: {
   startIndex: number;
   endIndex: number;
+  totalPosts: number;
 }) => {
   const start = startIndex + 1;
   const end = endIndex < totalPosts ? endIndex : totalPosts;
@@ -29,7 +26,13 @@ const CurrentPostsCount = ({
   );
 };
 
-const Pagination = ({ pageIndex }: { pageIndex: number }) => {
+const Pagination = ({
+  pageIndex,
+  pageCount,
+}: {
+  pageIndex: number;
+  pageCount: number;
+}) => {
   const handlePageChange = async (page: number) => {
     'use server';
     redirect(`/posts?page=${page}`);
@@ -51,55 +54,63 @@ export default async function Page(props: {
   searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
 }) {
   const searchParams = await props.searchParams;
+
   const pageIndex = searchParams.page
-    ? Number.parseInt(searchParams.page[0] ?? '', 10) - 1
+    ? Number.parseInt(
+        Array.isArray(searchParams.page)
+          ? searchParams.page[0] ?? ''
+          : searchParams.page,
+        10
+      ) - 1
     : 0;
-  if (pageIndex < 0 || pageIndex >= pageCount) notFound();
+
+  // 获取文章（带分页）
+  const { posts, totalDocs, totalPages } = await getPublishedPosts({
+    limit: postsPerPage,
+    page: pageIndex + 1,
+  });
+
+  if (pageIndex < 0 || (totalPages > 0 && pageIndex >= totalPages)) notFound();
 
   const startIndex = pageIndex * postsPerPage;
-  const endIndex = startIndex + postsPerPage;
-  const posts = getSortedByDatePosts().slice(startIndex, endIndex);
+  const endIndex = startIndex + posts.length;
 
   return (
     <>
       <Section className='p-4 lg:p-6'>
         <h1 className='font-bold text-3xl leading-tight tracking-tighter md:text-4xl'>
-          All {totalPosts} Posts{' '}
-          <CurrentPostsCount startIndex={startIndex} endIndex={endIndex} />
+          All {totalDocs} Posts{' '}
+          <CurrentPostsCount
+            startIndex={startIndex}
+            endIndex={endIndex}
+            totalPosts={totalDocs}
+          />
         </h1>
       </Section>
       <Section className='h-full' sectionClassName='flex flex-1'>
         <div className='grid divide-y divide-dashed divide-border/70 text-left dark:divide-border'>
           {posts.map((post) => {
-            const date = new Date(post.data.date).toDateString();
+            const date = post.date.toDateString();
             return (
               <PostCard
-                title={post.data.title}
-                description={post.data.description ?? ''}
-                image={post.data.image}
+                title={post.title}
+                description={post.description}
+                image={post.image}
                 url={post.url}
                 date={date}
-                key={post.url}
-                author={post.data.author}
-                tags={post.data.tags}
+                key={post.id}
+                author={post.author}
+                tags={post.tags}
               />
             );
           })}
         </div>
       </Section>
-      {pageCount > 1 && <Pagination pageIndex={pageIndex} />}
+      {totalPages > 1 && <Pagination pageIndex={pageIndex} pageCount={totalPages} />}
     </>
   );
 }
 
-export const generateStaticParams = () => {
-  const slugs = Array.from({ length: pageCount }, (_, index) => ({
-    slug: [(index + 1).toString()],
-  }));
-
-  return [{ slug: [] }, ...slugs];
-};
-
 type Props = {
   params: Promise<{ slug: string[] }>;
   searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
@@ -107,9 +118,8 @@ type Props = {
 
 export async function generateMetadata(
   props: Props,
-  parent: ResolvingMetadata,
+  parent: ResolvingMetadata
 ): Promise<Metadata> {
-  const params = await props.params;
   const searchParams = await props.searchParams;
 
   const pageIndex = searchParams.page
diff --git a/src/app/(home)/tags/[...slug]/page.tsx b/src/app/(main)/(home)/tags/[...slug]/page.tsx
index 9479705..71615cb 100644
--- a/src/app/(home)/tags/[...slug]/page.tsx
+++ b/src/app/(main)/(home)/tags/[...slug]/page.tsx
@@ -1,32 +1,25 @@
-import { postsPerPage } from '@/app/layout.config';
+import { postsPerPage } from '@/app/(main)/layout.config';
 import { Icons } from '@/components/icons/icons';
 import { TagJsonLd } from '@/components/json-ld';
 import { NumberedPagination } from '@/components/numbered-pagination';
 import { PostCard } from '@/components/posts/post-card';
 import { Section } from '@/components/section';
 import { createMetadata } from '@/lib/metadata';
-import { getPostsByTag, getTags } from '@/lib/source';
+import { getPostsByTag, getAllTags } from '@/lib/payload-posts';
 import type { Metadata, ResolvingMetadata } from 'next';
 import { notFound, redirect } from 'next/navigation';
 
-export const dynamicParams = false;
-
-const totalPosts = (title: string) => getPostsByTag(title).length;
-const pageCount = (title: string) =>
-  Math.ceil(totalPosts(title) / postsPerPage);
-
 const CurrentPostsCount = ({
   startIndex,
   endIndex,
-  tag,
+  totalPosts,
 }: {
   startIndex: number;
   endIndex: number;
-  tag: string;
+  totalPosts: number;
 }) => {
-  const total = totalPosts(tag);
   const start = startIndex + 1;
-  const end = endIndex < total ? endIndex : total;
+  const end = endIndex < totalPosts ? endIndex : totalPosts;
   if (start === end) return <span>({start})</span>;
   return (
     <span>
@@ -39,10 +32,12 @@ const Header = ({
   tag,
   startIndex,
   endIndex,
+  totalPosts,
 }: {
   tag: string;
   startIndex: number;
   endIndex: number;
+  totalPosts: number;
 }) => (
   <Section className='p-4 lg:p-6'>
     <div className='flex items-center gap-2'>
@@ -55,14 +50,14 @@ const Header = ({
         <CurrentPostsCount
           startIndex={startIndex}
           endIndex={endIndex}
-          tag={tag}
+          totalPosts={totalPosts}
         />
       </h1>
     </div>
   </Section>
 );
 
-const Pagination = ({ pageIndex, tag }: { pageIndex: number; tag: string }) => {
+const Pagination = ({ pageIndex, tag, totalPages }: { pageIndex: number; tag: string; totalPages: number }) => {
   const handlePageChange = async (page: number) => {
     'use server';
     redirect(`/tags/${tag}?page=${page}`);
@@ -72,7 +67,7 @@ const Pagination = ({ pageIndex, tag }: { pageIndex: number; tag: string }) => {
     <Section className='bg-dashed'>
       <NumberedPagination
         currentPage={pageIndex + 1}
-        totalPages={pageCount(tag)}
+        totalPages={totalPages}
         paginationItemsToDisplay={5}
         onPageChange={handlePageChange}
       />
@@ -91,54 +86,56 @@ export default async function Page(props: {
   if (!tag) return notFound();
 
   const pageIndex = searchParams.page
-    ? Number.parseInt(searchParams.page[0] ?? '', 10) - 1
+    ? Number.parseInt(
+        Array.isArray(searchParams.page)
+          ? searchParams.page[0] ?? ''
+          : searchParams.page,
+        10
+      ) - 1
     : 0;
 
-  if (pageIndex < 0 || pageIndex >= pageCount(tag)) notFound();
+  const { posts, totalDocs, totalPages } = await getPostsByTag(tag, {
+    limit: postsPerPage,
+    page: pageIndex + 1,
+  });
+
+  if (pageIndex < 0 || (totalPages > 0 && pageIndex >= totalPages)) notFound();
 
   const startIndex = pageIndex * postsPerPage;
-  const endIndex = startIndex + postsPerPage;
-  const posts = getPostsByTag(tag).slice(startIndex, endIndex);
+  const endIndex = startIndex + posts.length;
 
   return (
     <>
-      <Header tag={tag} startIndex={startIndex} endIndex={endIndex} />
+      <Header tag={tag} startIndex={startIndex} endIndex={endIndex} totalPosts={totalDocs} />
       <Section className='h-full' sectionClassName='flex flex-1'>
         <div className='grid divide-y divide-dashed divide-border/70 text-left dark:divide-border'>
           {posts.map((post) => {
-            const date = new Date(post.data.date).toDateString();
+            const date = post.date.toDateString();
             return (
               <PostCard
-                title={post.data.title}
-                description={post.data.description ?? ''}
-                image={post.data.image}
+                title={post.title}
+                description={post.description}
+                image={post.image}
                 url={post.url}
                 date={date}
-                key={post.url}
-                author={post.data.author}
-                tags={post.data.tags}
+                key={post.id}
+                author={post.author}
+                tags={post.tags}
               />
             );
           })}
         </div>
       </Section>
-      {pageCount(tag) > 1 && <Pagination pageIndex={pageIndex} tag={tag} />}
+      {totalPages > 1 && <Pagination pageIndex={pageIndex} tag={tag} totalPages={totalPages} />}
       <TagJsonLd tag={tag} />
     </>
   );
 }
 
-export const generateStaticParams = () => {
-  const tags = getTags();
-  return [
-    ...tags.map((tag) => ({ slug: [tag] })),
-    ...tags.flatMap((tag) =>
-      Array.from({ length: pageCount(tag) }, (_, index) => ({
-        slug: [tag, (index + 1).toString()],
-      })),
-    ),
-  ];
-};
+export async function generateStaticParams() {
+  const tags = await getAllTags();
+  return tags.map((item) => ({ slug: [item.tag] }));
+}
 
 type Props = {
   params: Promise<{ slug: string[] }>;
@@ -154,7 +151,12 @@ export async function generateMetadata(
 
   const tag = params.slug[0];
   const pageIndex = searchParams.page
-    ? Number.parseInt(searchParams.page.toString(), 10)
+    ? Number.parseInt(
+        Array.isArray(searchParams.page)
+          ? searchParams.page[0] ?? ''
+          : searchParams.page,
+        10
+      )
     : 1;
 
   const isFirstPage = pageIndex === 1 || !searchParams.page;
diff --git a/src/app/(home)/tags/page.tsx b/src/app/(main)/(home)/tags/page.tsx
index 54fb423..6db13fc 100644
--- a/src/app/(home)/tags/page.tsx
+++ b/src/app/(main)/(home)/tags/page.tsx
@@ -1,13 +1,13 @@
-import { title as homeTitle } from '@/app/layout.config';
+import { title as homeTitle } from '@/app/(main)/layout.config';
 import { Section } from '@/components/section';
 import { TagCard } from '@/components/tags/tag-card';
 import { createMetadata } from '@/lib/metadata';
-import { getTags } from '@/lib/source';
+import { getAllTags } from '@/lib/payload-posts';
 import { cn } from '@/lib/utils';
 import type { Metadata } from 'next';
 
-export default function Page() {
-  const tags = getTags();
+export default async function Page() {
+  const tags = await getAllTags();
 
   return (
     <>
@@ -18,11 +18,12 @@ export default function Page() {
       </Section>
       <Section className='h-full' sectionClassName='flex flex-1'>
         <div className='grid grid-cols-1 divide-y divide-dashed divide-border/70 sm:grid-cols-2 lg:grid-cols-4 dark:divide-border'>
-          {tags.map((tag, index) => (
+          {tags.map((item, index) => (
             <TagCard
-              key={tag}
+              key={item.tag}
               displayCount={true}
-              name={tag}
+              name={item.tag}
+              count={item.count}
               className={cn(
                 'items-center justify-start gap-2 rounded-none border-r-0 bg-card/50 p-6 last:border-border/70 last:border-b last:border-dashed hover:bg-card/80 last:dark:border-border',
                 tags.at(index - 1) && 'border-l',
diff --git a/src/app/api/auth/[...all]/route.ts b/src/app/(main)/api/auth/[...all]/route.ts
index 677b24c..677b24c 100644
--- a/src/app/api/auth/[...all]/route.ts
+++ b/src/app/(main)/api/auth/[...all]/route.ts
diff --git a/src/app/api/comments/[...comment]/route.ts b/src/app/(main)/api/comments/[...comment]/route.ts
index 1da87db..1da87db 100644
--- a/src/app/api/comments/[...comment]/route.ts
+++ b/src/app/(main)/api/comments/[...comment]/route.ts
diff --git a/src/app/(main)/api/search/route.ts b/src/app/(main)/api/search/route.ts
new file mode 100644
index 0000000..cc2a1c8
--- /dev/null
+++ b/src/app/(main)/api/search/route.ts
@@ -0,0 +1,20 @@
+import { getPublishedPosts } from '@/lib/payload-posts';
+import { createSearchAPI } from 'fumadocs-core/search/server';
+
+// 动态生成搜索索引
+export async function GET(request: Request) {
+  const { posts } = await getPublishedPosts({ limit: 1000 });
+
+  const indexes = posts.map((post) => ({
+    title: post.title,
+    description: post.description,
+    id: post.url,
+    url: post.url,
+  }));
+
+  const searchAPI = createSearchAPI('advanced', {
+    indexes,
+  });
+
+  return searchAPI.GET(request);
+}
diff --git a/src/app/banner.png/fonts/geist-regular-otf.json b/src/app/(main)/banner.png/fonts/geist-regular-otf.json
index f220c87..f220c87 100644
--- a/src/app/banner.png/fonts/geist-regular-otf.json
+++ b/src/app/(main)/banner.png/fonts/geist-regular-otf.json
diff --git a/src/app/banner.png/fonts/geist-semibold-otf.json b/src/app/(main)/banner.png/fonts/geist-semibold-otf.json
index c119360..c119360 100644
--- a/src/app/banner.png/fonts/geist-semibold-otf.json
+++ b/src/app/(main)/banner.png/fonts/geist-semibold-otf.json
diff --git a/src/app/banner.png/fonts/geistmono-regular-otf.json b/src/app/(main)/banner.png/fonts/geistmono-regular-otf.json
index f4200df..f4200df 100644
--- a/src/app/banner.png/fonts/geistmono-regular-otf.json
+++ b/src/app/(main)/banner.png/fonts/geistmono-regular-otf.json
diff --git a/src/app/banner.png/og.tsx b/src/app/(main)/banner.png/og.tsx
index 1a520c0..1a520c0 100644
--- a/src/app/banner.png/og.tsx
+++ b/src/app/(main)/banner.png/og.tsx
diff --git a/src/app/banner.png/route.tsx b/src/app/(main)/banner.png/route.tsx
index 1cd53ac..d3bfdc8 100644
--- a/src/app/banner.png/route.tsx
+++ b/src/app/(main)/banner.png/route.tsx
@@ -1,4 +1,4 @@
-import { generateOGImage } from '@/app/banner.png/og';
+import { generateOGImage } from '@/app/(main)/banner.png/og';
 
 async function loadAssets(): Promise<
   { name: string; data: Buffer; weight: 400 | 600; style: 'normal' }[]
diff --git a/src/app/layout.client.tsx b/src/app/(main)/layout.client.tsx
index 35726ba..35726ba 100644
--- a/src/app/layout.client.tsx
+++ b/src/app/(main)/layout.client.tsx
diff --git a/src/app/layout.config.tsx b/src/app/(main)/layout.config.tsx
index f9efebb..f9efebb 100644
--- a/src/app/layout.config.tsx
+++ b/src/app/(main)/layout.config.tsx
diff --git a/src/app/layout.tsx b/src/app/(main)/layout.tsx
index c7d2aaf..c9e7dee 100644
--- a/src/app/layout.tsx
+++ b/src/app/(main)/layout.tsx
@@ -5,9 +5,9 @@ import type { ReactNode } from 'react';
 import '@/styles/globals.css';
 import 'katex/dist/katex.css';
 import { baseUrl } from '@/lib/constants';
-import { Body } from './layout.client';
-import { description as homeDescription } from './layout.config';
-import { Provider } from './provider';
+import { Body } from '@/app/(main)/layout.client';
+import { description as homeDescription } from '@/app/(main)/layout.config';
+import { Provider } from '@/app/(main)/provider';
 
 const geistSans = Geist({
   variable: '--font-geist-sans',
diff --git a/src/app/not-found.tsx b/src/app/(main)/not-found.tsx
index ecec57a..ecec57a 100644
--- a/src/app/not-found.tsx
+++ b/src/app/(main)/not-found.tsx
diff --git a/src/app/og/[...slug]/fonts/geist-regular-otf.json b/src/app/(main)/og/[...slug]/fonts/geist-regular-otf.json
index f220c87..f220c87 100644
--- a/src/app/og/[...slug]/fonts/geist-regular-otf.json
+++ b/src/app/(main)/og/[...slug]/fonts/geist-regular-otf.json
diff --git a/src/app/og/[...slug]/fonts/geist-semibold-otf.json b/src/app/(main)/og/[...slug]/fonts/geist-semibold-otf.json
index c119360..c119360 100644
--- a/src/app/og/[...slug]/fonts/geist-semibold-otf.json
+++ b/src/app/(main)/og/[...slug]/fonts/geist-semibold-otf.json
diff --git a/src/app/og/[...slug]/fonts/geistmono-regular-otf.json b/src/app/(main)/og/[...slug]/fonts/geistmono-regular-otf.json
index f4200df..f4200df 100644
--- a/src/app/og/[...slug]/fonts/geistmono-regular-otf.json
+++ b/src/app/(main)/og/[...slug]/fonts/geistmono-regular-otf.json
diff --git a/src/app/og/[...slug]/og.tsx b/src/app/(main)/og/[...slug]/og.tsx
index 5754e96..5754e96 100644
--- a/src/app/og/[...slug]/og.tsx
+++ b/src/app/(main)/og/[...slug]/og.tsx
diff --git a/src/app/og/[...slug]/route.tsx b/src/app/(main)/og/[...slug]/route.tsx
index 8738616..77ae7f8 100644
--- a/src/app/og/[...slug]/route.tsx
+++ b/src/app/(main)/og/[...slug]/route.tsx
@@ -1,6 +1,7 @@
-import { generateOGImage } from '@/app/og/[...slug]/og';
-import { metadataImage } from '@/lib/metadata-image';
+import { generateOGImage } from '@/app/(main)/og/[...slug]/og';
+import { getPostBySlug, getAllPostSlugs } from '@/lib/payload-posts';
 import type { ImageResponse } from 'next/og';
+import { notFound } from 'next/navigation';
 
 async function loadAssets(): Promise<
   { name: string; data: Buffer; weight: 400 | 600; style: 'normal' }[]
@@ -39,20 +40,33 @@ async function loadAssets(): Promise<
   ];
 }
 
-export const GET = metadataImage.createAPI(
-  async (page): Promise<ImageResponse> => {
-    const [fonts] = await Promise.all([loadAssets()]);
-
-    return generateOGImage({
-      title: page.data.title,
-      description: page.data.description,
-      fonts,
-    });
-  },
-);
-
-export function generateStaticParams(): {
-  slug: string[];
-}[] {
-  return metadataImage.generateParams();
+export async function GET(
+  request: Request,
+  { params }: { params: Promise<{ slug: string[] }> }
+): Promise<ImageResponse> {
+  const { slug } = await params;
+  const postSlug = slug[0];
+
+  if (!postSlug) {
+    notFound();
+  }
+
+  const post = await getPostBySlug(postSlug);
+
+  if (!post) {
+    notFound();
+  }
+
+  const fonts = await loadAssets();
+
+  return generateOGImage({
+    title: post.title,
+    description: post.description,
+    fonts,
+  });
+}
+
+export async function generateStaticParams(): Promise<{ slug: string[] }[]> {
+  const slugs = await getAllPostSlugs();
+  return slugs.map((slug) => ({ slug: [slug, 'image.png'] }));
 }
diff --git a/src/app/provider.tsx b/src/app/(main)/provider.tsx
index 085bf50..085bf50 100644
--- a/src/app/provider.tsx
+++ b/src/app/(main)/provider.tsx
diff --git a/src/app/rss.xml/route.ts b/src/app/(main)/rss.xml/route.ts
index 6a3acf6..3507948 100644
--- a/src/app/rss.xml/route.ts
+++ b/src/app/(main)/rss.xml/route.ts
@@ -1,10 +1,10 @@
-import { description, title } from '@/app/layout.config';
-import { owner } from '@/app/layout.config';
+import { description, title } from '@/app/(main)/layout.config';
+import { owner } from '@/app/(main)/layout.config';
 import { baseUrl } from '@/lib/constants';
-import { getPosts } from '@/lib/source';
+import { getPublishedPosts } from '@/lib/payload-posts';
 import { Feed } from 'feed';
 
-export const dynamic = 'force-static';
+export const dynamic = 'force-dynamic';
 
 const escapeForXML = (str: string) => {
   return str
@@ -15,8 +15,8 @@ const escapeForXML = (str: string) => {
     .replace(/'/g, '&apos;');
 };
 
-export const GET = () => {
-  const feed = createFeed();
+export const GET = async () => {
+  const feed = await createFeed();
 
   return new Response(feed.atom1(), {
     headers: {
@@ -25,7 +25,7 @@ export const GET = () => {
   });
 };
 
-function createFeed(): Feed {
+async function createFeed(): Promise<Feed> {
   const feed = new Feed({
     title,
     description,
@@ -39,24 +39,24 @@ function createFeed(): Feed {
     updated: new Date(),
   });
 
-  const posts = getPosts();
+  const { posts } = await getPublishedPosts({ limit: 1000 });
+
   for (const post of posts) {
     feed.addItem({
-      title: post.data.title,
-      description: post.data.description,
+      title: post.title,
+      description: post.description,
       link: new URL(post.url, baseUrl).href,
-      image: {
-        title: post.data.title,
-        type: 'image/png',
-        url: escapeForXML(
-          new URL(`/og/${post.slugs.join('/')}/image.png`, baseUrl.href).href,
-        ),
-      },
-      date: post.data.date,
+      image: post.image
+        ? {
+            title: post.title,
+            type: 'image/png',
+            url: escapeForXML(new URL(post.image, baseUrl.href).href),
+          }
+        : undefined,
+      date: post.date,
       author: [
         {
-          name: post.data.author,
-          // link: new URL('/about', baseUrl).href,
+          name: post.author,
         },
       ],
     });
diff --git a/src/app/(payload)/admin/[[...segments]]/not-found.tsx b/src/app/(payload)/admin/[[...segments]]/not-found.tsx
new file mode 100644
index 0000000..b28df09
--- /dev/null
+++ b/src/app/(payload)/admin/[[...segments]]/not-found.tsx
@@ -0,0 +1,24 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import type { Metadata } from 'next';
+
+import config from '@payload-config';
+import { NotFoundPage, generatePageMetadata } from '@payloadcms/next/views';
+import { importMap } from '../importMap';
+
+type Args = {
+  params: Promise<{
+    segments: string[];
+  }>;
+  searchParams: Promise<{
+    [key: string]: string | string[];
+  }>;
+};
+
+export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>
+  generatePageMetadata({ config, params, searchParams });
+
+const NotFound = ({ params, searchParams }: Args) =>
+  NotFoundPage({ config, importMap, params, searchParams });
+
+export default NotFound;
diff --git a/src/app/(payload)/admin/[[...segments]]/page.tsx b/src/app/(payload)/admin/[[...segments]]/page.tsx
new file mode 100644
index 0000000..f04f258
--- /dev/null
+++ b/src/app/(payload)/admin/[[...segments]]/page.tsx
@@ -0,0 +1,24 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import type { Metadata } from 'next';
+
+import config from '@payload-config';
+import { RootPage, generatePageMetadata } from '@payloadcms/next/views';
+import { importMap } from '../importMap';
+
+type Args = {
+  params: Promise<{
+    segments: string[];
+  }>;
+  searchParams: Promise<{
+    [key: string]: string | string[];
+  }>;
+};
+
+export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>
+  generatePageMetadata({ config, params, searchParams });
+
+const Page = ({ params, searchParams }: Args) =>
+  RootPage({ config, params, searchParams, importMap });
+
+export default Page;
diff --git a/src/app/(payload)/admin/importMap.js b/src/app/(payload)/admin/importMap.js
new file mode 100644
index 0000000..5bc8ec3
--- /dev/null
+++ b/src/app/(payload)/admin/importMap.js
@@ -0,0 +1,49 @@
+import { RscEntryLexicalCell as RscEntryLexicalCell_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
+import { RscEntryLexicalField as RscEntryLexicalField_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
+import { LexicalDiffComponent as LexicalDiffComponent_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
+import { InlineToolbarFeatureClient as InlineToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { HorizontalRuleFeatureClient as HorizontalRuleFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { UploadFeatureClient as UploadFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { BlockquoteFeatureClient as BlockquoteFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { RelationshipFeatureClient as RelationshipFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { LinkFeatureClient as LinkFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { ChecklistFeatureClient as ChecklistFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { OrderedListFeatureClient as OrderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { UnorderedListFeatureClient as UnorderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { IndentFeatureClient as IndentFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { AlignFeatureClient as AlignFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { HeadingFeatureClient as HeadingFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { ParagraphFeatureClient as ParagraphFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { InlineCodeFeatureClient as InlineCodeFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { SuperscriptFeatureClient as SuperscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { SubscriptFeatureClient as SubscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { StrikethroughFeatureClient as StrikethroughFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { UnderlineFeatureClient as UnderlineFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { BoldFeatureClient as BoldFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+import { ItalicFeatureClient as ItalicFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
+
+export const importMap = {
+  "@payloadcms/richtext-lexical/rsc#RscEntryLexicalCell": RscEntryLexicalCell_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/rsc#RscEntryLexicalField": RscEntryLexicalField_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/rsc#LexicalDiffComponent": LexicalDiffComponent_44fe37237e0ebf4470c9990d8cb7b07e,
+  "@payloadcms/richtext-lexical/client#InlineToolbarFeatureClient": InlineToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#HorizontalRuleFeatureClient": HorizontalRuleFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UploadFeatureClient": UploadFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#BlockquoteFeatureClient": BlockquoteFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#RelationshipFeatureClient": RelationshipFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#LinkFeatureClient": LinkFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ChecklistFeatureClient": ChecklistFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#OrderedListFeatureClient": OrderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UnorderedListFeatureClient": UnorderedListFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#IndentFeatureClient": IndentFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#AlignFeatureClient": AlignFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#HeadingFeatureClient": HeadingFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ParagraphFeatureClient": ParagraphFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#InlineCodeFeatureClient": InlineCodeFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#SuperscriptFeatureClient": SuperscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#SubscriptFeatureClient": SubscriptFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#StrikethroughFeatureClient": StrikethroughFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#UnderlineFeatureClient": UnderlineFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#BoldFeatureClient": BoldFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
+  "@payloadcms/richtext-lexical/client#ItalicFeatureClient": ItalicFeatureClient_e70f5e05f09f93e00b997edb1ef0c864
+}
diff --git a/src/app/(payload)/api/[...slug]/route.ts b/src/app/(payload)/api/[...slug]/route.ts
new file mode 100644
index 0000000..c3de612
--- /dev/null
+++ b/src/app/(payload)/api/[...slug]/route.ts
@@ -0,0 +1,20 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from '@payload-config'
+import '@payloadcms/next/css'
+import {
+  REST_DELETE,
+  REST_GET,
+  REST_OPTIONS,
+  REST_PATCH,
+  REST_POST,
+  REST_PUT,
+} from '@payloadcms/next/routes'
+
+export const GET = REST_GET(config)
+export const POST = REST_POST(config)
+export const DELETE = REST_DELETE(config)
+export const PATCH = REST_PATCH(config)
+
+export const PUT = REST_PUT(config)
+export const OPTIONS = REST_OPTIONS(config)
diff --git a/src/app/(payload)/api/graphql-playground/route.ts b/src/app/(payload)/api/graphql-playground/route.ts
new file mode 100644
index 0000000..c14156d
--- /dev/null
+++ b/src/app/(payload)/api/graphql-playground/route.ts
@@ -0,0 +1,6 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from '@payload-config';
+import { GRAPHQL_PLAYGROUND_GET } from '@payloadcms/next/routes';
+
+export const GET = GRAPHQL_PLAYGROUND_GET(config);
diff --git a/src/app/(payload)/api/graphql/route.ts b/src/app/(payload)/api/graphql/route.ts
new file mode 100644
index 0000000..65fcf23
--- /dev/null
+++ b/src/app/(payload)/api/graphql/route.ts
@@ -0,0 +1,6 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from '@payload-config';
+import { GRAPHQL_POST } from '@payloadcms/next/routes';
+
+export const POST = GRAPHQL_POST(config);
diff --git a/src/app/(payload)/custom.scss b/src/app/(payload)/custom.scss
new file mode 100644
index 0000000..f38c2f0
--- /dev/null
+++ b/src/app/(payload)/custom.scss
@@ -0,0 +1 @@
+/* Add custom Payload admin styles here */
diff --git a/src/app/(payload)/layout.tsx b/src/app/(payload)/layout.tsx
new file mode 100644
index 0000000..f14247a
--- /dev/null
+++ b/src/app/(payload)/layout.tsx
@@ -0,0 +1,30 @@
+/* THIS FILE WAS GENERATED AUTOMATICALLY BY PAYLOAD. */
+/* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
+import config from '@payload-config';
+import '@payloadcms/next/css';
+import type { ServerFunctionClient } from 'payload';
+import { handleServerFunctions, RootLayout } from '@payloadcms/next/layouts';
+import React from 'react';
+import { importMap } from './admin/importMap.js';
+import './custom.scss';
+
+type Args = {
+  children: React.ReactNode;
+};
+
+const serverFunction: ServerFunctionClient = async function (args) {
+  'use server';
+  return handleServerFunctions({
+    ...args,
+    config,
+    importMap,
+  });
+};
+
+const Layout = ({ children }: Args) => (
+  <RootLayout config={config} importMap={importMap} serverFunction={serverFunction}>
+    {children}
+  </RootLayout>
+);
+
+export default Layout;
diff --git a/src/app/api/search/route.ts b/src/app/api/search/route.ts
deleted file mode 100644
index 3c99f5c..0000000
--- a/src/app/api/search/route.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { getPosts } from '@/lib/source';
-import { createSearchAPI } from 'fumadocs-core/search/server';
-
-export const { GET } = createSearchAPI('advanced', {
-  indexes: getPosts().map((page) => ({
-    title: page.data.title,
-    structuredData: page.data.structuredData,
-    id: page.url,
-    url: page.url,
-  })),
-});
diff --git a/src/app/icon.png b/src/app/icon.png
deleted file mode 100644
index 7532d9b..0000000
--- a/src/app/icon.png
+++ /dev/null