Run prettier

master
Edward Shen 2020-11-27 19:39:21 -05:00
parent e4df0010b5
commit f766bf3eaf
Signed by: edward
GPG Key ID: F350507060ED6C90
11 changed files with 133 additions and 105 deletions

View File

@ -1,14 +1,9 @@
module.exports = {
root: true,
parser: '@typescript-eslint/parser',
plugins: [
'@typescript-eslint',
],
plugins: ['@typescript-eslint'],
globals: {
__PATH_PREFIX__: true,
},
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
],
};
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
};

View File

@ -1,4 +1,4 @@
{
"arrowParens": "avoid",
"semi": false
"singleQuote": true,
"jsxSingleQuote": true,
}

View File

@ -41,7 +41,7 @@ module.exports = {
// you may use this to prevent Prism from re-processing syntax.
// This is an uncommon use-case though;
// If you're unsure, it's best to use the default value.
classPrefix: "language-",
classPrefix: 'language-',
// This is used to allow setting a language for inline code
// (i.e. single backticks) by creating a separator.
// This separator is a string and will do no white-space
@ -71,8 +71,8 @@ module.exports = {
// existing language" below.
languageExtensions: [
{
language: "superscript",
extend: "javascript",
language: 'superscript',
extend: 'javascript',
definition: {
superscript_types: /(SuperType)/,
},
@ -86,8 +86,8 @@ module.exports = {
// Customize the prompt used in shell output
// Values below are default
prompt: {
user: "root",
host: "localhost",
user: 'root',
host: 'localhost',
global: false,
},
// By default the HTML entities <>&'" are escaped.
@ -100,13 +100,13 @@ module.exports = {
resolve: 'gatsby-remark-smartypants',
options: {
dashes: 'oldschool',
}
},
},
]
}
],
},
},
{
resolve: 'gatsby-plugin-mdx-frontmatter'
resolve: 'gatsby-plugin-mdx-frontmatter',
},
],
};

View File

@ -1,4 +1,4 @@
const path = require("path");
const path = require('path');
exports.createPages = async ({ actions, graphql, reporter }) => {
const { createPage } = actions;
@ -28,15 +28,17 @@ exports.createPages = async ({ actions, graphql, reporter }) => {
return;
}
const posts = result.data.allMdx.edges.filter(({ node }) => !node.frontmatter.hidden);
const posts = result.data.allMdx.edges.filter(
({ node }) => !node.frontmatter.hidden
);
const postsPerPage = 10;
const numPages = Math.ceil(posts.length / postsPerPage);
const rootPath = "/notes";
const rootPath = '/notes';
Array.from({ length: numPages }).forEach((_, i) => {
createPage({
path: rootPath + (i === 0 ? '' : `/${i + 1}`),
component: path.resolve("./src/templates/notes.tsx"),
component: path.resolve('./src/templates/notes.tsx'),
context: {
limit: postsPerPage,
skip: i * postsPerPage,
@ -44,7 +46,7 @@ exports.createPages = async ({ actions, graphql, reporter }) => {
currentPage: i + 1,
rootPath,
},
})
});
});
// Must decouple to ensure hidden pages are still rendered, just excluded from
@ -58,7 +60,7 @@ exports.createPages = async ({ actions, graphql, reporter }) => {
},
});
});
}
};
exports.createSchemaCustomization = ({ actions: { createTypes } }) => {
createTypes(`
type Mdx implements Node {

View File

@ -1,10 +1,10 @@
import React from "react";
import style from "./item.module.css";
import { Link } from "gatsby";
import React from 'react';
import style from './item.module.css';
import { Link } from 'gatsby';
export default (props) => (
<Link to={props.to} className={style.projectItem}>
<h3 className={style.projectTitle}>{props.title}</h3>
<p className={style.projectSubtitle}>{props.subtitle}</p>
</Link>
);
);

View File

@ -1,20 +1,31 @@
import React from 'react';
import { Link } from "gatsby";
import { Link } from 'gatsby';
const ExactLink = (props) => <Link
to={props.to}
style={{ textDecoration: "none" }}
activeStyle={{ color: "red" }}
partiallyActive={!props.home}>
{props.children}
</Link >;
const ExactLink = (props) => (
<Link
to={props.to}
style={{ textDecoration: 'none' }}
activeStyle={{ color: 'red' }}
partiallyActive={!props.home}
>
{props.children}
</Link>
);
export default function Navbar() {
return (
<nav>
<h1><ExactLink to="/" home={true}>Edward Shen</ExactLink></h1>
<h3><ExactLink to="/projects">Projects</ExactLink></h3>
<h3><ExactLink to="/notes">Notes</ExactLink></h3>
</nav >
<h1>
<ExactLink to='/' home={true}>
Edward Shen
</ExactLink>
</h1>
<h3>
<ExactLink to='/projects'>Projects</ExactLink>
</h3>
<h3>
<ExactLink to='/notes'>Notes</ExactLink>
</h3>
</nav>
);
};
}

View File

@ -1,17 +1,22 @@
import { PageProps } from 'gatsby';
import React from 'react';
import Navbar from "../components/navbar";
import Navbar from '../components/navbar';
export default ({ location }: PageProps): JSX.Element => {
const messages = [
<p>
In your attempt to search for <code>{location.pathname}</code>, you seem to
have gotten lost instead. Fret not, for there is always a path <a href="/">home</a>.
In your attempt to search for <code>{location.pathname}</code>, you seem
to have gotten lost instead. Fret not, for there is always a path{' '}
<a href='/'>home</a>.
</p>,
<p>
Not all who wander are lost, but you seem to be. Go <a href='/'>home</a>?
</p>,
<p>Not all who wander are lost, but you seem to be. Go <a href="/">home</a>?</p>
];
return <>
<Navbar />
{messages[Math.floor(Math.random() * messages.length)]}
</>;
return (
<>
<Navbar />
{messages[Math.floor(Math.random() * messages.length)]}
</>
);
};

View File

@ -1,22 +1,12 @@
import React from "react";
import React from 'react';
import Navbar from '../../components/navbar';
import Item from "../../components/item";
import Item from '../../components/item';
export default (): JSX.Element => (
<>
<Navbar />
<Item
title="Shlink"
subtitle="subtitle"
to="test"
/>
<Item
title="hello world"
subtitle="subtitle"
/>
<Item
title="hello world"
subtitle="subtitle"
/>
<Item title='Shlink' subtitle='subtitle' to='test' />
<Item title='hello world' subtitle='subtitle' />
<Item title='hello world' subtitle='subtitle' />
</>
);

View File

@ -1,27 +1,30 @@
import React from "react";
import React from 'react';
import Navbar from '../components/navbar';
import { graphql } from "gatsby";
import { graphql } from 'gatsby';
import { MDXRenderer } from 'gatsby-plugin-mdx';
export default ({ data }) => {
const { frontmatter, body } = data.mdx;
return <>
<Navbar />
<main>
<h1>{frontmatter.title}</h1>
<MDXRenderer>{body}</MDXRenderer>
</main>
</>;
return (
<>
<Navbar />
<main>
<h1>{frontmatter.title}</h1>
<MDXRenderer>{body}</MDXRenderer>
</main>
</>
);
};
export const query = graphql`
query NotesIndexQuery($id: String!) {
mdx(id: {eq: $id}) {
frontmatter {
title
query NotesIndexQuery($id: String!) {
mdx(id: { eq: $id }) {
frontmatter {
title
}
tableOfContents
body
}
tableOfContents
body
}
}`;
`;

View File

@ -3,10 +3,10 @@
* See note.tsx for rendering a single note.
*/
import React from "react";
import Navbar from "../components/navbar";
import { graphql } from "gatsby";
import style from "./notes.module.css";
import React from 'react';
import Navbar from '../components/navbar';
import { graphql } from 'gatsby';
import style from './notes.module.css';
export default ({ data, pageContext }): JSX.Element => {
const posts = data.allMdx.edges;
@ -14,9 +14,20 @@ export default ({ data, pageContext }): JSX.Element => {
let prevPageLink = null;
if (currentPage === 2) {
prevPageLink = <a href={rootPath} className={style.prevPageLink}>&lt;&lt;</a>;
prevPageLink = (
<a href={rootPath} className={style.prevPageLink}>
&lt;&lt;
</a>
);
} else if (currentPage !== 1) {
prevPageLink = <a href={rootPath + '/' + (currentPage - 1)} className={style.prevPageLink}>&lt;&lt;</a>;
prevPageLink = (
<a
href={rootPath + '/' + (currentPage - 1)}
className={style.prevPageLink}
>
&lt;&lt;
</a>
);
}
const shouldDisplayNav = numPages !== 1;
@ -25,41 +36,47 @@ export default ({ data, pageContext }): JSX.Element => {
<>
<Navbar />
{posts.map(({ node }) => {
const frontmatter = node.frontmatter
const frontmatter = node.frontmatter;
return (
<article key={frontmatter.title}>
<div className={style.noteTitle}>
<h3>
<a href={`${rootPath + '/' + frontmatter.path}`}>{frontmatter.title}</a>
<a href={`${rootPath + '/' + frontmatter.path}`}>
{frontmatter.title}
</a>
</h3>
<time dateTime={frontmatter.date}>{frontmatter.date}</time>
</div>
<p>{node.excerpt}</p>
</article>
)
);
})}
{shouldDisplayNav &&
{shouldDisplayNav && (
<p className={style.paginationNav}>
{prevPageLink}
{currentPage}
{currentPage !== numPages &&
{currentPage !== numPages && (
<a
href={rootPath + '/' + (currentPage + 1)}
className={style.nextPageLink}>
className={style.nextPageLink}
>
&gt;&gt;
</a>
}
)}
</p>
}
)}
</>
)
}
);
};
export const query = graphql`
query IndexQuery($skip: Int!, $limit: Int!) {
allMdx(
sort: { order: DESC, fields: [frontmatter___date] }
filter: { fileAbsolutePath: { glob: "**/src/notes/*" }, frontmatter: {hidden: {ne: true}} }
filter: {
fileAbsolutePath: { glob: "**/src/notes/*" }
frontmatter: { hidden: { ne: true } }
}
limit: $limit
skip: $skip
) {
@ -76,4 +93,4 @@ export const query = graphql`
}
}
}
`
`;

View File

@ -1,20 +1,25 @@
import Typography from "typography";
import Typography from 'typography';
const typography = new Typography({
baseFontSize: '18px',
baseLineHeight: 1.666,
headerFontFamily: [
'M PLUS 1p', 'Helvetica Neue', 'Segoe UI', 'Helvetica', 'Arial', 'sans-serif'
'M PLUS 1p',
'Helvetica Neue',
'Segoe UI',
'Helvetica',
'Arial',
'sans-serif',
],
bodyFontFamily: ['Georgia', 'serif'],
googleFonts: [
{
name: "M PLUS 1p",
name: 'M PLUS 1p',
styles: ['100', '400'],
}
]
},
],
});
// Export helper functions
export const { scale, rhythm, options } = typography;
export default typography;
export default typography;