fix: remove missing PageClient import from posts pagination page
This commit is contained in:
parent
ed4062aef0
commit
0b7303e97f
@ -6,106 +6,70 @@ import type { Post, Media } from '@/payload-types'
|
|||||||
import { FDImage } from '@/components/FDImage'
|
import { FDImage } from '@/components/FDImage'
|
||||||
import { formatDateTime } from '@/utilities/formatDateTime'
|
import { formatDateTime } from '@/utilities/formatDateTime'
|
||||||
import { Pagination } from '@/components/Pagination'
|
import { Pagination } from '@/components/Pagination'
|
||||||
import PageClient from './page.client'
|
|
||||||
|
|
||||||
export const dynamic = 'force-dynamic'
|
export const dynamic = 'force-dynamic'
|
||||||
|
|
||||||
export default async function Page() {
|
export default async function Page({ params }: { params: Promise<{ pageNumber: string }> }) {
|
||||||
|
const { pageNumber } = await params
|
||||||
const payload = await getPayload({ config: configPromise })
|
const payload = await getPayload({ config: configPromise })
|
||||||
|
|
||||||
const posts = await payload.find({
|
const posts = await payload.find({
|
||||||
collection: 'posts',
|
collection: 'posts',
|
||||||
depth: 1,
|
depth: 1,
|
||||||
limit: 12,
|
limit: 12,
|
||||||
|
page: parseInt(pageNumber, 10),
|
||||||
overrideAccess: false,
|
overrideAccess: false,
|
||||||
select: {
|
select: {
|
||||||
title: true,
|
title: true,
|
||||||
slug: true,
|
slug: true,
|
||||||
heroImage: true,
|
heroImage: true,
|
||||||
categories: true,
|
|
||||||
meta: true,
|
meta: true,
|
||||||
publishedAt: true,
|
publishedAt: true,
|
||||||
populatedAuthors: true,
|
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-white">
|
<div className="min-h-screen bg-white">
|
||||||
<PageClient />
|
<div className="max-w-[1200px] mx-auto px-6 md:px-8 pt-12 md:pt-16 pb-16 md:pb-24">
|
||||||
|
<h1 className="font-joey-heavy text-4xl md:text-5xl lg:text-[3.25rem] text-fd-navy mb-10 md:mb-14">
|
||||||
{/* ── Page header ── */}
|
Nyheter!
|
||||||
<div className="max-w-[1200px] mx-auto px-6 md:px-8 pt-12 md:pt-16 pb-8 md:pb-12">
|
|
||||||
<h1 className="font-joey-heavy text-4xl md:text-5xl text-fd-navy">
|
|
||||||
Nyheter
|
|
||||||
</h1>
|
</h1>
|
||||||
<p className="font-joey text-fd-body-lg text-fd-navy/60 mt-3">
|
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-12">
|
||||||
{posts.totalDocs} {posts.totalDocs === 1 ? 'artikel' : 'artiklar'}
|
{posts.docs.map((post) => {
|
||||||
</p>
|
const p = post as Post
|
||||||
</div>
|
const heroImage = p.heroImage as Media | undefined
|
||||||
|
return (
|
||||||
{/* ── Card grid ── */}
|
<a key={p.id} href={`/posts/${p.slug}`} className="group flex flex-col">
|
||||||
<div className="max-w-[1200px] mx-auto px-6 md:px-8 pb-16 md:pb-24">
|
<h2 className="font-joey-bold text-fd-navy text-xl md:text-[1.375rem] leading-snug mb-2 group-hover:text-fd-navy/70 transition-colors line-clamp-2">
|
||||||
{posts.docs.length === 0 ? (
|
{p.title}
|
||||||
<p className="font-joey text-fd-navy/50 py-16">Inga inlägg hittades.</p>
|
</h2>
|
||||||
) : (
|
{p.publishedAt && (
|
||||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 md:gap-8">
|
<p className="font-joey text-sm text-fd-navy/50 mb-4">
|
||||||
{posts.docs.map((post) => {
|
{formatDateTime(p.publishedAt)}
|
||||||
const p = post as Post
|
</p>
|
||||||
const heroImage = p.heroImage as Media | undefined
|
)}
|
||||||
const summary = p.meta?.description ?? null
|
<div className="relative aspect-[4/3] rounded-[20px] overflow-hidden bg-fd-navy/5">
|
||||||
|
{heroImage?.url ? (
|
||||||
return (
|
<FDImage
|
||||||
<a
|
media={heroImage}
|
||||||
key={p.id}
|
size="medium"
|
||||||
href={`/posts/${p.slug}`}
|
fill
|
||||||
className="group flex flex-col bg-white rounded-[20px] border border-fd-navy/10 overflow-hidden hover:border-fd-navy/20 hover:shadow-lg transition-all duration-300"
|
className="object-cover group-hover:scale-[1.03] transition-transform duration-500"
|
||||||
>
|
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw"
|
||||||
{/* Image */}
|
fallbackAlt={p.title}
|
||||||
<div className="relative aspect-[16/9] bg-fd-navy/5 overflow-hidden">
|
/>
|
||||||
{heroImage?.url ? (
|
) : (
|
||||||
<FDImage
|
<div className="w-full h-full flex items-center justify-center">
|
||||||
media={heroImage}
|
<span className="font-joey text-fd-navy/30 text-sm">Ingen bild</span>
|
||||||
size="medium"
|
</div>
|
||||||
fill
|
)}
|
||||||
className="object-cover group-hover:scale-[1.03] transition-transform duration-500"
|
</div>
|
||||||
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw"
|
</a>
|
||||||
fallbackAlt={p.title}
|
)
|
||||||
/>
|
})}
|
||||||
) : (
|
</div>
|
||||||
<div className="w-full h-full flex items-center justify-center bg-fd-navy/5">
|
|
||||||
<span className="font-joey text-fd-navy/30 text-sm">Ingen bild</span>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Content */}
|
|
||||||
<div className="flex flex-col flex-1 p-5 md:p-6">
|
|
||||||
<h2 className="font-joey-bold text-fd-navy text-lg md:text-xl leading-snug mb-2 group-hover:text-fd-navy/80 transition-colors">
|
|
||||||
{p.title}
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
{summary && (
|
|
||||||
<p className="font-joey text-sm text-fd-navy/60 leading-relaxed line-clamp-3 mb-4">
|
|
||||||
{summary}
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* Date */}
|
|
||||||
{p.publishedAt && (
|
|
||||||
<p className="font-joey text-xs text-fd-navy/40 mt-auto pt-3 border-t border-fd-navy/8">
|
|
||||||
{formatDateTime(p.publishedAt)}
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* Pagination */}
|
|
||||||
{posts.totalPages > 1 && posts.page && (
|
{posts.totalPages > 1 && posts.page && (
|
||||||
<div className="mt-12">
|
<div className="mt-16">
|
||||||
<Pagination page={posts.page} totalPages={posts.totalPages} />
|
<Pagination page={posts.page} totalPages={posts.totalPages} />
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
@ -117,6 +81,5 @@ export default async function Page() {
|
|||||||
export function generateMetadata(): Metadata {
|
export function generateMetadata(): Metadata {
|
||||||
return {
|
return {
|
||||||
title: 'Nyheter | Fiber Direkt',
|
title: 'Nyheter | Fiber Direkt',
|
||||||
description: 'Senaste nytt från Fiber Direkt',
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user