quotes

My favourite quotes. (gatsbyjs)
git clone http://git.hanabi.in/repos/quotes.git
Log | Files | Refs | README | LICENSE

allTagsTemplate.js (1376B)


      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 AllTagsTemplate({ pageContext }) {
     10   const { postsByTag, tags } = pageContext;
     11   const count = Object.values(postsByTag).map(el => el.length);
     12   const [max, min] = [Math.max(...count), Math.min(...count)];
     13   tags.sort(function(str1, str2) {
     14     return str1.toLowerCase().localeCompare(str2.toLowerCase());
     15   });
     16   return (
     17     <Layout heading="Tags" slug="tags">
     18       <SEO title="Tags" />
     19       <div className="term-cloud-container">
     20         <ul className="term-cloud">
     21           {tags.map(tag => {
     22             const numerator = postsByTag[tag].length - min;
     23             const denominator = max - min;
     24             const num = denominator ? numerator / denominator : 1;
     25             const weight = 100 * Math.round((2 * numerator) / denominator + 3);
     26             return (
     27               <li key={tag}>
     28                 <Link
     29                   to={`/${repo}/tags/${tag}`}
     30                   style={{ fontSize: `${1 + num}em`, fontWeight: `${weight}` }}
     31                 >
     32                   {tag}
     33                 </Link>
     34               </li>
     35             );
     36           })}
     37         </ul>
     38       </div>
     39     </Layout>
     40   );
     41 }
     42 
     43 export default AllTagsTemplate;