Skip to content

Instantly share code, notes, and snippets.

@grahamd711
Created May 21, 2021 18:35
Show Gist options
  • Save grahamd711/28f62bc44b8abc82e856f14cc7b872df to your computer and use it in GitHub Desktop.
Save grahamd711/28f62bc44b8abc82e856f14cc7b872df to your computer and use it in GitHub Desktop.
import React, { Component } from 'react';
import { StaticQuery, graphql } from 'gatsby';
import PropTypes from 'prop-types';
import c from 'classnames';
import LatestGrid from 'components/latest-grid-nav';
import * as s from './LatestArticles.module.scss';
export default class LatestArticles extends Component {
static propTypes = {
count: PropTypes.number,
title: PropTypes.string,
};
static defaultProps = {
count: 3,
title: 'Latest from mParticle',
};
render() {
const { count, title, customArticles } = this.props;
return (
<StaticQuery
query={graphql`
{
allPrismicArticle(
filter: {
data: {
featured: { ne: "no" }
invisible: { ne: "yes" }
publish_date: { ne: null }
}
}
sort: { fields: first_publication_date, order: DESC }
limit: 3
) {
edges {
node {
uid
id
type
data {
article_type
featured
invisible
publish_date
author {
document {
... on PrismicPerson {
data {
name
title
}
}
}
}
intro_text
category {
document {
... on PrismicArticleCategory {
data {
name
}
}
}
}
publish_date
event_date
image {
alt
url
localFile {
childImageSharp {
gatsbyImageData
}
}
}
thumbnail {
alt
url
localFile {
childImageSharp {
gatsbyImageData
}
}
}
title
}
}
}
}
}
`}
render={({ allPrismicArticle }) => {
const defaultArticles = allPrismicArticle.edges.map(({ node }) => node);
const filteredCustomArticles = customArticles.filter((val) => {
if (!val) return false;
const {
data: { invisible, featured },
} = val;
return invisible !== 'yes' && featured !== 'no';
});
const articles = [...filteredCustomArticles, ...defaultArticles].slice(0, 3);
return (
<div className={c(s.container, `up-${count}`)}>
<p className={s.title}>{title}</p>
<LatestGrid articles={articles} />
</div>
);
}}
/>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment