Use collection config for slugs and correct locale for links

src/app/(app)/page.tsx

@@ -5,7 +5,7 @@ import Footer from '@/components/Footer'
 
 import { getPayloadHMR } from '@payloadcms/next/utilities'
 import configPromise from '@payload-config'
-import Posts from '@/components/Blocks/Posts'
+import PostList from '@/components/Blocks/PostList'
 
 interface Props {}
 
@@ -19,7 +19,7 @@ const Page = (props: Props) => {
         {`When you're ready to deploy the website on your own server, Nextload comes with a production environment that requires the use of Traefik as a reverse proxy. This setup provides a secure and scalable production environment for your website.`}
       </p>
       <section className="mt-4">
-        <Posts />
+        <PostList />
       </section>
     </>
   )

src/app/(app)/pages/[[...path]]/page.tsx

@@ -29,7 +29,7 @@ const Page = async ({ params }: PageArgs) => {
     depth: 3,
   })
   if (!page) notFound()
-  return <Blocks blocks={page?.blocks} locale="en" />
+  return <Blocks blocks={page?.blocks} locale="" />
 }
 
 export default Page

src/app/(app)/posts/[[...path]]/page.tsx

@@ -30,7 +30,7 @@ const Page = async ({ params }: PageArgs) => {
     depth: 3,
   })
   if (!post) notFound()
-  return <PostPage post={post} locale="en" />
+  return <PostPage post={post} locale="" />
 }
 
 export default Page

src/app/(payload)/collections/Authors.ts

@@ -1,9 +1,10 @@
 import { CollectionConfig } from 'payload/types'
 import { isEditor } from '@payload/access/isEditor'
 import { isUser } from '@payload/access/isUser'
+import { COLLECTION_SLUG_AUTHOR } from './config'
 
 const Authors: CollectionConfig = {
-  slug: 'authors',
+  slug: COLLECTION_SLUG_AUTHOR,
   admin: {
     defaultColumns: ['name'],
     useAsTitle: 'name',

src/app/(payload)/collections/Media.ts

@@ -1,8 +1,9 @@
 import { isUser } from '@payload/access/isUser'
 import { CollectionConfig } from 'payload/types'
+import { COLLECTION_SLUG_MEDIA } from './config'
 
 export const Media: CollectionConfig = {
-  slug: 'media',
+  slug: COLLECTION_SLUG_MEDIA,
   admin: {},
   access: {
     read: (): boolean => true,

src/app/(payload)/collections/Posts.ts

@@ -5,9 +5,10 @@ import { revalidateTag } from 'next/cache'
 import { generateDocumentCacheKey } from '@/utils/getDocument'
 import { slugField, pathField } from '@payload/fields/'
 import { blocksField } from '@payload/fields/blocks'
+import { COLLECTION_SLUG_POST } from './config'
 
 const Posts: CollectionConfig = {
-  slug: 'posts',
+  slug: COLLECTION_SLUG_POST,
   versions: {
     drafts: {
       autosave: false,

src/app/(payload)/collections/Users.ts

@@ -1,8 +1,9 @@
 import { CollectionConfig } from 'payload/types'
 import { isAdmin, isAdminOrSelf } from '@payload/access/isAdmin'
+import { COLLECTION_SLUG_USER } from './config'
 
 const Users: CollectionConfig = {
-  slug: 'users',
+  slug: COLLECTION_SLUG_USER,
   auth: true,
   admin: {
     defaultColumns: ['roles', 'email'],

src/app/(payload)/collections/config.ts

@@ -1,11 +1,5 @@
-/* export const COLLECTION_SLUG_USER = 'users' as const
+export const COLLECTION_SLUG_USER = 'users' as const
-export const COLLECTION_SLUG_SESSIONS = 'sessions' as const
-export const COLLECTION_SLUG_FORMS = 'forms' as const
-export const COLLECTION_SLUG_MEDIA = 'media' as const
- */
 export const COLLECTION_SLUG_PAGE = 'pages' as const
 export const COLLECTION_SLUG_POST = 'posts' as const
-
+export const COLLECTION_SLUG_MEDIA = 'media' as const
-/* export const COLLECTION_SLUG_PRODUCTS = 'products' as const
+export const COLLECTION_SLUG_AUTHOR = 'authors' as const
-export const COLLECTION_SLUG_PRICES = 'prices' as const
-export const COLLECTION_SLUG_SUBSCRIPTIONS = 'subscriptions' as const */

src/components/Blocks/PostList.tsx

@@ -3,6 +3,7 @@ import PostEntry from '@/components/PostEntry'
 import { getPayloadHMR } from '@payloadcms/next/utilities'
 import configPromise from '@payload-config'
 import { PaginatedDocs } from 'payload/database'
+import { COLLECTION_SLUG_POST } from '@payload/collections/config'
 
 type Props = {}
 
@@ -11,10 +12,10 @@ const payload = await getPayloadHMR({
 })
 
 const posts: PaginatedDocs<Post> = await payload.find({
-  collection: 'posts',
+  collection: COLLECTION_SLUG_POST,
 })
 
-export default function Posts(props: Props) {
+export default function PostList(props: Props) {
   return (
     <div className="flex flex-col">
       <h2 className="text-secondary mb-4">Posts</h2>

src/components/PostEntry.tsx

@@ -1,5 +1,6 @@
 import { Post } from 'types/payload-types'
 import Image from 'next/image'
+import { COLLECTION_SLUG_POST } from '@/app/(payload)/collections/config'
 
 interface Props {
   post: Post
@@ -9,7 +10,10 @@ export default function PostEntry(props: Props) {
   if (typeof props.post.thumbnail === 'string') return
 
   return (
-    <a className="py-4 border-secondary decoration-transparent" href={`/posts/${props.post.slug}`}>
+    <a
+      className="py-4 border-secondary decoration-transparent"
+      href={`/${COLLECTION_SLUG_POST}${props.post.path}`}
+    >
       <article className="flex px-5 py-3 gap-8">
         <Image
           src={props.post.thumbnail.url || ''}

src/components/PostPage.tsx

@@ -11,7 +11,7 @@ interface Props {
 export default function PostPage(props: Props) {
   return (
     <article className="leading-relaxed">
-      <Blocks blocks={props?.post.blocks} locale="en" />
+      <Blocks blocks={props?.post.blocks} locale="" />
       {props?.post.author && typeof props?.post.author !== 'string' && (
         <Author author={props?.post.author} />
       )}