jblu/jonbio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: restore search for blog page

Browse Source
This commit is contained in:
Timothy Lin
2021-05-29 16:08:22 +08:00
parent 847f2537c3
commit 88096a536b
3 changed files with 32 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
layouts/ListLayout.js
View File

@ -6,13 +6,17 @@ import Pagination from '@/components/Pagination'
const postDateTemplate = { year: 'numeric', month: 'long', day: 'numeric' }
export default function ListLayout({ posts, title, pagination }) {
export default function ListLayout({ posts, title, initialDisplayPosts = [], pagination }) {
const [searchValue, setSearchValue] = useState('')
const filteredBlogPosts = posts.filter((frontMatter) => {
const searchContent = frontMatter.title + frontMatter.summary + frontMatter.tags.join(' ')
return searchContent.toLowerCase().includes(searchValue.toLowerCase())
})
// If initialDisplayPosts exist, display it if no searchValue is specified
const displayPosts =
initialDisplayPosts.length > 0 && !searchValue ? initialDisplayPosts : filteredBlogPosts
return (
<>
<div className="divide-y">
@ -46,7 +50,7 @@ export default function ListLayout({ posts, title, pagination }) {
</div>
<ul>
{!filteredBlogPosts.length && 'No posts found.'}
{filteredBlogPosts.map((frontMatter) => {
{displayPosts.map((frontMatter) => {
const { slug, date, title, summary, tags } = frontMatter
return (
<li key={slug} className="py-4">
@ -82,7 +86,7 @@ export default function ListLayout({ posts, title, pagination }) {
})}
</ul>
</div>
{pagination && (
{pagination && !searchValue && (
<Pagination currentPage={pagination.currentPage} totalPages={pagination.totalPages} />
)}
</>