{"version":3,"file":"0a688f2c544f791b872462c0c3a46023abe19b8d-097c73997d797bca7608.js","mappings":"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","sources":["webpack://getform/./src/components/resources/hooks/use-latest-post.js","webpack://getform/./src/components/resources/post-link.js","webpack://getform/./src/components/resources/post-list.js"],"sourcesContent":["import { graphql, useStaticQuery } from 'gatsby'\n\nconst useLatestPost = resource => {\n  const {\n    allMdx: { posts },\n  } = useStaticQuery(graphql`\n    query {\n      allMdx(sort: { fields: [frontmatter___date], order: DESC }) {\n        posts: nodes {\n          ...postPreviewFragment\n        }\n      }\n    }\n  `)\n\n  return posts.filter(({ frontmatter }) => frontmatter.resource === resource)[0]\n}\n\nexport default useLatestPost\n","import React, { useMemo } from 'react'\nimport styled from '@emotion/styled'\nimport { GatsbyImage, getImage } from 'gatsby-plugin-image'\nimport { mediaQueries } from '../../theme'\nimport { H5 } from '../shared/type'\nimport BaseLink from '../shared/link'\nimport useLatestPost from './hooks/use-latest-post'\n\nconst MS_PER_DAY = 1000 * 60 * 60 * 24\n\nconst dateDiff = (a, b) => Math.floor(Math.abs(a - b) / MS_PER_DAY)\n\nconst useLabel = (post, maxAge = 30) => {\n  const {\n    frontmatter: { date, resource },\n    fields: { slug },\n  } = post\n  const latestPost = useLatestPost(resource)\n  return useMemo(() => {\n    const isLatest = slug === latestPost?.fields?.slug\n    const isNew = dateDiff(new Date(date), Date.now()) < maxAge\n\n    if (isLatest) return 'Latest'\n    if (isNew) return 'New'\n    return ''\n  }, [date, slug, latestPost, maxAge])\n}\n\nconst Title = styled(H5)`\n  grid-area: title;\n  align-self: flex-start;\n  margin: 0;\n  line-height: 1.5;\n  font-size: ${p => p.theme.fontSizes[2]};\n`\n\nconst Author = styled.span`\n  grid-area: author;\n  align-self: flex-end;\n`\n\nconst ReadTime = styled.span`\n  grid-area: read;\n`\n\nconst Label = styled.span`\n  grid-area: label;\n  align-self: center;\n  justify-self: flex-end;\n  font-size: ${p => p.theme.fontSizes[1]};\n  font-weight: ${p => p.theme.fontWeights.bold};\n`\n\nconst Link = styled(BaseLink)`\n  display: grid;\n  grid-template-areas: 'title title' 'author label' 'read label';\n  grid-template-rows: 6.875rem repeat(2, auto);\n  grid-template-columns: auto 3.875rem;\n  grid-column-gap: ${p => p.theme.space[1]};\n  padding: ${p => p.theme.space[5]};\n  font-size: ${p => p.theme.fontSizes[1]};\n  border: ${p => `2px solid ${p.theme.colors.black[0]}`};\n  box-shadow: ${p => `4px 4px 0 0 ${p.theme.colors.black[0]}`};\n  color: ${p => p.theme.colors.text};\n\n  ${mediaQueries.md} {\n    grid-column-gap: ${p => p.theme.space[4]};\n    grid-template-rows: 8.125rem repeat(2, auto);\n  }\n\n  ${mediaQueries.lg} {\n    grid-template-areas: 'title title title' 'avatar author label' 'avatar read label';\n    grid-template-columns: 3.5rem auto 2.875rem;\n    grid-template-rows: 6.25rem repeat(2, auto);\n\n    :hover {\n      ${Title} {\n        text-decoration: underline;\n      }\n    }\n  }\n`\n\nconst Avatar = styled(GatsbyImage)`\n  grid-area: avatar;\n  display: none;\n\n  ${mediaQueries.lg} {\n    display: block;\n  }\n`\n\nexport const PostLink = ({ post, className }) => {\n  const {\n    frontmatter: { title, author, read, avatar },\n    fields: { slug },\n  } = post\n  const label = useLabel(post)\n\n  return (\n    <Link className={className} to={slug}>\n      <Avatar image={getImage(avatar)} alt={author} loading=\"lazy\" />\n      <Title>{title}</Title>\n      <Author>{author}</Author>\n      <ReadTime>{read} min read </ReadTime>\n      {label && <Label>{label}</Label>}\n    </Link>\n  )\n}\n","import React from 'react'\nimport styled from '@emotion/styled'\nimport { mediaQueries } from '../../theme'\nimport { PostLink } from './post-link'\n\nconst Container = styled.div`\n  display: grid;\n  grid-template-columns: minmax(0, 1fr);\n  grid-gap: ${p => `${p.theme.space[10]} 0`};\n\n  ${mediaQueries.md} {\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    grid-gap: ${p => p.theme.space[3]};\n  }\n\n  ${mediaQueries.xl} {\n    grid-gap: ${p => p.theme.space[10]};\n  }\n`\n\nconst PostList = ({ className, posts }) => (\n  <Container className={className}>\n    {posts.map(post => (\n      <PostLink key={post.fields.slug} post={post} />\n    ))}\n  </Container>\n)\n\nexport default PostList\n"],"names":["resource","useStaticQuery","allMdx","posts","filter","frontmatter","useLabel","post","maxAge","date","slug","fields","latestPost","useLatestPost","useMemo","a","b","isLatest","isNew","Date","now","Math","floor","abs","Title","H5","p","theme","fontSizes","Author","ReadTime","Label","fontWeights","bold","Link","BaseLink","space","colors","black","text","mediaQueries","Avatar","GatsbyImage","PostLink","className","title","author","read","avatar","label","to","image","getImage","alt","loading","Container","map","key"],"sourceRoot":""}