diff --git a/src/app/(routes)/blog/_components/posts.tsx b/src/app/(routes)/blog/_components/posts.tsx index ad6cefe..fc20f1c 100644 --- a/src/app/(routes)/blog/_components/posts.tsx +++ b/src/app/(routes)/blog/_components/posts.tsx @@ -1,64 +1,27 @@ import { Text } from "@/app/_components/text"; -import ArticleSnippetCard from "./article-snippet-card"; import ArticleFullCard from "./article-full-card"; -import { - BlogPostWithRelevantEntries, - retrieveContentfulPublishedSlugs, -} from "@/app/_lib/contentful"; +import { retrieveContentfulPublishedSlugs } from "@/app/_lib/contentful"; import { SearchParams } from "../page"; +import { useState } from "react"; -export async function Posts({ - getStartedSnippets, - recentArticleSlugs, - searchParams, -}: { - searchParams: SearchParams; - recentArticleSlugs: string[]; - getStartedSnippets: (BlogPostWithRelevantEntries | undefined)[]; -}) { +export async function Posts({ searchParams }: { searchParams: SearchParams }) { const search = searchParams["search"]; - if (!search) { - return ( - <> -
- - Get started with Across - -
-
- {getStartedSnippets.slice(0, 3).map((snippet) => ( -
- -
- ))} -
-
-
-
- - Most recent articles - - {recentArticleSlugs.map((slug) => ( - - ))} -
- - ); - } else { - const searchedSlugs = await retrieveContentfulPublishedSlugs({ - query: search, - }); - return searchedSlugs.length === 0 ? ( -

No results.

- ) : ( -
- - Search results - - {searchedSlugs.map((slug) => ( - - ))} -
- ); - } + const isSearch = Boolean(!!search); + const pageLength = 6; + const searchedSlugs = await retrieveContentfulPublishedSlugs({ + query: search ? decodeURI(search) : undefined, + sortByRecent: true, + limit: pageLength, + }); + + return ( +
+ + {isSearch ? "Search results" : "Most recent articles"} + + {searchedSlugs.map((slug) => ( + + ))} +
+ ); } diff --git a/src/app/(routes)/blog/page.tsx b/src/app/(routes)/blog/page.tsx index a7719ff..f0da4c7 100644 --- a/src/app/(routes)/blog/page.tsx +++ b/src/app/(routes)/blog/page.tsx @@ -4,10 +4,7 @@ import BackgroundBanner from "./_components/background-banner"; import Filter from "./_components/filter"; import { Suspense } from "react"; -import { - retrieveContentfulPublishedSlugs, - retrieveContentfulEntry, -} from "@/app/_lib/contentful"; +import { retrieveContentfulPublishedSlugs } from "@/app/_lib/contentful"; import { Posts } from "./_components/posts"; import { createCacheKey } from "@/app/_lib/cache"; @@ -18,23 +15,9 @@ type PageProps = { }; export default async function BlogHomePage({ searchParams }: PageProps) { - const recentArticleSlugs = await retrieveContentfulPublishedSlugs({ - limit: 6, - avoidTags: ["get-started"], - sortByRecent: true, - }); - const getStartedSlugs = await retrieveContentfulPublishedSlugs({ - limit: 3, - includeTags: ["get-started"], - }); - const getStartedSnippets = await Promise.all( - getStartedSlugs.map((s) => retrieveContentfulEntry(s)), - ); - const key = createCacheKey({ searchParams, }); - return ( <> @@ -51,11 +34,7 @@ export default async function BlogHomePage({ searchParams }: PageProps) {

Searching...

} > - + diff --git a/src/app/_lib/contentful.ts b/src/app/_lib/contentful.ts index 6f81e85..231a817 100644 --- a/src/app/_lib/contentful.ts +++ b/src/app/_lib/contentful.ts @@ -51,12 +51,14 @@ export async function retrieveContentfulPublishedSlugs({ avoidTags, includeTags, sortByRecent, + skip, }: { query?: string; limit?: number; avoidTags?: string[]; includeTags?: string[]; sortByRecent?: boolean; + skip?: number; } = {}): Promise { const client = getProductionClient(); const options = { @@ -69,6 +71,7 @@ export async function retrieveContentfulPublishedSlugs({ ...(avoidTags ? { "fields.tag[nin]": avoidTags.join(",").toLowerCase() } : {}), ...(includeTags ? { "fields.tag[in]": includeTags.join(",").toLowerCase() } : {}), ...(sortByRecent ? { order: "-fields.publishDate" } : {}), + ...(skip ? { skip } : {}), } as const; const entries = await client.withoutUnresolvableLinks.getEntries(options);