singleTagTemplate.js (2344B)
1 import React from 'react'; 2 import { Link } from 'gatsby'; 3 import Layout from '../components/layout'; 4 import SEO from '../components/seo'; 5 import { siteMetadata } from '../../gatsby-config'; 6 7 const { repo } = siteMetadata; 8 9 function SingleTagTemplate({ pageContext }) { 10 const { posts, tag } = pageContext; 11 return ( 12 <Layout 13 heading={`Tag: ${tag} (${posts.length})`} 14 link={`/${repo}/tags`} 15 slug="tag" 16 > 17 <SEO title={`Tag: ${tag}`} /> 18 <div className="list-container"> 19 <ul className="list"> 20 {posts.map(post => { 21 const { 22 attributed, 23 author, 24 misattributed, 25 path, 26 title, 27 unverified, 28 } = post.frontmatter; 29 return ( 30 <li key={path} className="list-item"> 31 <article> 32 <div className="meta"> 33 <span> 34 <span className="screen-reader">Quote by </span> 35 <span> 36 <Link to={`/${repo}/authors/${author}`}>{author}</Link> 37 {attributed ? ( 38 <span> 39 <sup> 40 <em>!</em> 41 </sup> 42 </span> 43 ) : null} 44 {misattributed ? ( 45 <span> 46 <sup> 47 <em>?</em> 48 </sup> 49 </span> 50 ) : null} 51 {unverified ? ( 52 <span> 53 <sup> 54 <em>#</em> 55 </sup> 56 </span> 57 ) : null} 58 </span> 59 </span> 60 </div> 61 <header className="list-item-header"> 62 <h3 className="list-item-title"> 63 <Link to={`/${repo}/quote${path}`}>{title}</Link> 64 </h3> 65 </header> 66 </article> 67 </li> 68 ); 69 })} 70 </ul> 71 </div> 72 </Layout> 73 ); 74 } 75 76 export default SingleTagTemplate;