m/blog
1
0
Fork 0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-22 01:46:51 +01:00
Code

related posts tweaks

Browse Source
This commit is contained in:
Matthias Kretschmann 2022-11-19 22:00:38 +00:00
parent ca151a6452
commit 66219cd4b0
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 272 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

236
.jest/__fixtures__/posts.json
View File

File diff suppressed because one or more lines are too long

70
src/components/molecules/RelatedPosts.tsx
View File

@ -6,7 +6,21 @@ import { PhotoThumb } from '../templates/Photos'
const query = graphql`
query RelatedPosts {
allMarkdownRemark(sort: { fields: { date: DESC } }) {
allArticles: allMarkdownRemark(
sort: { fields: { date: DESC } }
filter: { fields: { type: { regex: "/(article|link)/" } } }
) {
edges {
node {
...PostTeaser
}
}
}
allPhotos: allMarkdownRemark(
sort: { fields: { date: DESC } }
filter: { fields: { type: { eq: "photo" } } }
) {
edges {
node {
...PostTeaser
@ -17,42 +31,30 @@ const query = graphql`
`
function postsWithDataFilter(
posts: Queries.RelatedPostsQuery['allMarkdownRemark']['edges'],
posts:
| Queries.RelatedPostsQuery['allArticles']['edges']
| Queries.RelatedPostsQuery['allPhotos']['edges'],
key: keyof Queries.MarkdownRemarkFrontmatter,
valuesToFind: string[]
) {
const newArray = posts
.filter(({ node }) => {
const frontmatterKey = node.frontmatter[key] as []
let filtered = posts.filter(({ node }) => {
const frontmatterKey = node.frontmatter[key]
if (
frontmatterKey !== null &&
frontmatterKey.some((r: string) => valuesToFind.includes(r))
) {
return node
}
})
.sort(() => 0.5 - Math.random())
.slice(0, 6)
if (
frontmatterKey !== null &&
frontmatterKey.some((r: string) => valuesToFind?.includes(r))
) {
return node
}
})
return newArray
}
if (!filtered?.length) {
filtered = posts.filter(({ node }) => node)
}
function photosWithDataFilter(
posts: Queries.RelatedPostsQuery['allMarkdownRemark']['edges']
) {
const newArray = posts
.filter((post) => {
const { fileAbsolutePath } = post.node
filtered = filtered.sort(() => 0.5 - Math.random()).slice(0, 6)
if (fileAbsolutePath.includes('content/photos')) {
return post
}
})
.sort(() => 0.5 - Math.random())
.slice(0, 6)
return newArray
return filtered
}
export default function RelatedPosts({
@ -63,12 +65,12 @@ export default function RelatedPosts({
isPhotos?: boolean
}): ReactElement {
const data = useStaticQuery<Queries.RelatedPostsQuery>(query)
const posts = data.allMarkdownRemark.edges
function getPosts() {
return isPhotos
? photosWithDataFilter(posts)
: tags && postsWithDataFilter(posts, 'tags', tags)
const dataByType = isPhotos ? data.allPhotos.edges : data.allArticles.edges
const posts = postsWithDataFilter(dataByType, 'tags', tags)
return posts
}
const [filteredPosts, setFilteredPosts] = useState(getPosts())