mirror of
https://github.com/kremalicious/blog.git
synced 2024-06-28 16:48:00 +02:00
66 lines
1.8 KiB
Plaintext
66 lines
1.8 KiB
Plaintext
|
---
|
||
|
import type { CollectionEntry } from 'astro:content'
|
||
|
import Fuse from 'fuse.js'
|
||
|
import styles from './index.module.css'
|
||
|
import PhotoTeaser from '@components/PhotoTeaser.astro'
|
||
|
import PostTeaser from '@components/PostTeaser/index.astro'
|
||
|
import { getAllPostsForSearch } from '@lib/astro'
|
||
|
|
||
|
type Props = {
|
||
|
post: CollectionEntry<'articles' | 'photos' | 'links'>
|
||
|
isPhotos?: boolean
|
||
|
}
|
||
|
const { post, isPhotos } = Astro.props as Props
|
||
|
const allPosts = await getAllPostsForSearch()
|
||
|
|
||
|
// Configure fuse.js
|
||
|
// https://fusejs.io/api/options.html
|
||
|
const fuseOptions: Fuse.IFuseOptions<
|
||
|
CollectionEntry<'articles' | 'photos' | 'links'>
|
||
|
> = {
|
||
|
keys: ['data.tags', 'data.title', 'data.lead', 'collection'],
|
||
|
useExtendedSearch: true,
|
||
|
minMatchCharLength: 3,
|
||
|
threshold: 0.8
|
||
|
}
|
||
|
// TODO; figure out how to remove any
|
||
|
const allPostsWithoutCurrent = allPosts?.filter(
|
||
|
(post) => post.slug !== Astro.props.post.slug
|
||
|
)
|
||
|
const fuse = new Fuse(allPostsWithoutCurrent as any, fuseOptions)
|
||
|
const relatedPosts = fuse
|
||
|
// https://www.fusejs.io/examples.html#extended-search
|
||
|
.search(
|
||
|
`${post?.data?.tags?.join(' | ')} | ${post?.data?.title} | ${
|
||
|
(post?.data as any)?.lead
|
||
|
} | ${post?.collection}`
|
||
|
)
|
||
|
.map((result) => result.item)
|
||
|
.slice(0, 6)
|
||
|
---
|
||
|
|
||
|
<section class={styles.relatedPosts}>
|
||
|
<h1 class={styles.title}>
|
||
|
Related {isPhotos ? 'Photos' : 'Posts'}{' '}
|
||
|
<!-- <button class={styles.button} onClick={() => refreshPosts()}>
|
||
|
Refresh
|
||
|
</button> -->
|
||
|
</h1>
|
||
|
<ul>
|
||
|
{
|
||
|
relatedPosts?.map((post) => (
|
||
|
<li>
|
||
|
{isPhotos ? (
|
||
|
<PhotoTeaser post={post as CollectionEntry<'photos'>} />
|
||
|
) : (
|
||
|
<PostTeaser
|
||
|
post={post as CollectionEntry<'articles' | 'links'>}
|
||
|
hideDate
|
||
|
/>
|
||
|
)}
|
||
|
</li>
|
||
|
))
|
||
|
}
|
||
|
</ul>
|
||
|
</section>
|