From 45e4a0a4d332f3b13cf71ce684680dc6fc7f9a96 Mon Sep 17 00:00:00 2001
From: Chuck Dries <chuck@chuckdries.com>
Date: Sun, 13 Jun 2021 23:00:19 -0700
Subject: [PATCH] add eslint quotes rule
---
gatsby/.eslintrc.js | 24 ++++++---
gatsby/gatsby-config.js | 53 +++++++++++--------
gatsby/package-lock.json | 73 ++++++++++++++++++++++++++-
gatsby/package.json | 7 ++-
gatsby/src/pages/gallery.js | 10 ++--
gatsby/src/templates/gallery-image.js | 12 ++---
6 files changed, 137 insertions(+), 42 deletions(-)
diff --git a/gatsby/.eslintrc.js b/gatsby/.eslintrc.js
index d2597b1..9559d87 100644
--- a/gatsby/.eslintrc.js
+++ b/gatsby/.eslintrc.js
@@ -2,12 +2,22 @@ module.exports = {
globals: {
__PATH_PREFIX__: true,
},
- plugins: [
- "react"
+ 'parser': 'babel-eslint', // uses babel-eslint transforms
+ 'settings': {
+ 'react': {
+ 'version': 'detect' // detect react version
+ }
+ },
+ 'env': {
+ 'node': true // defines things like process.env when generating through node
+ },
+ 'extends': [
+ 'eslint:recommended', // use recommended configs
+ 'plugin:react/recommended',
+ 'plugin:react-hooks/recommended'
],
- extends: [
- `react-app`,
- "eslint:recommended",
- "plugin:react/recommended"
- ]
+ 'rules': {
+ 'react/prop-types': 0,
+ 'quotes': ['warn', 'single']
+ }
}
diff --git a/gatsby/gatsby-config.js b/gatsby/gatsby-config.js
index 3524806..5595fe7 100644
--- a/gatsby/gatsby-config.js
+++ b/gatsby/gatsby-config.js
@@ -1,44 +1,53 @@
module.exports = {
siteMetadata: {
- title: "Chuck Dries",
+ title: 'Chuck Dries',
},
plugins: [
- "gatsby-plugin-sass",
- "gatsby-plugin-image",
- "gatsby-plugin-react-helmet",
+ 'gatsby-plugin-sass',
+ 'gatsby-plugin-image',
+ 'gatsby-plugin-react-helmet',
{
- resolve: "gatsby-plugin-manifest",
+ resolve: 'gatsby-plugin-manifest',
options: {
- icon: "src/images/icon.png",
+ icon: 'src/images/icon.png',
},
},
- "gatsby-plugin-mdx",
- "gatsby-plugin-sharp",
- "gatsby-transformer-sharp",
- "gatsby-plugin-postcss",
+ 'gatsby-plugin-mdx',
+ 'gatsby-plugin-sharp',
+ 'gatsby-transformer-sharp',
+ 'gatsby-plugin-postcss',
{
- resolve: "gatsby-source-filesystem",
+ resolve: 'gatsby-source-filesystem',
options: {
- name: "images",
- path: "./src/images/",
+ name: 'images',
+ path: './src/images/',
},
- __key: "images",
+ __key: 'images',
},
{
- resolve: "gatsby-source-filesystem",
+ resolve: 'gatsby-source-filesystem',
options: {
- name: "gallery",
- path: "./data/gallery/",
+ name: 'gallery',
+ path: './data/gallery/',
},
- __key: "gallery",
+ __key: 'gallery',
},
{
- resolve: "gatsby-source-filesystem",
+ resolve: 'gatsby-source-filesystem',
options: {
- name: "pages",
- path: "./src/pages/",
+ name: 'pages',
+ path: './src/pages/',
},
- __key: "pages",
+ __key: 'pages',
+ },
+ {
+ resolve: 'gatsby-plugin-eslint',
+ options: {
+ stages: ['develop'],
+ extensions: ['js', 'jsx'],
+ exclude: ['node_modules', '.cache', 'public'],
+ // Any eslint-webpack-plugin options below
+ }
}
],
};
diff --git a/gatsby/package-lock.json b/gatsby/package-lock.json
index d4c185a..f39c444 100644
--- a/gatsby/package-lock.json
+++ b/gatsby/package-lock.json
@@ -35,8 +35,13 @@
"tailwindcss": "^2.1.2"
},
"devDependencies": {
+ "babel-eslint": "^10.1.0",
"eslint": "^7.28.0",
- "eslint-config-react-app": "^6.0.0"
+ "eslint-config-react-app": "^6.0.0",
+ "eslint-plugin-react": "^7.24.0",
+ "eslint-plugin-react-hooks": "^4.2.0",
+ "eslint-webpack-plugin": "^2.5.4",
+ "gatsby-plugin-eslint": "^3.0.0"
}
},
"node_modules/@ardatan/aggregate-error": {
@@ -4190,6 +4195,34 @@
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz",
"integrity": "sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA=="
},
+ "node_modules/babel-eslint": {
+ "version": "10.1.0",
+ "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
+ "integrity": "sha512-ifWaTHQ0ce+448CYop8AdrQiBsGrnC+bMgfyKFdi6EsPLTAWG+QfyDeM6OH+FmWnKvEq5NnBMLvlBUPKQZoDSg==",
+ "deprecated": "babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.",
+ "dependencies": {
+ "@babel/code-frame": "^7.0.0",
+ "@babel/parser": "^7.7.0",
+ "@babel/traverse": "^7.7.0",
+ "@babel/types": "^7.7.0",
+ "eslint-visitor-keys": "^1.0.0",
+ "resolve": "^1.12.0"
+ },
+ "engines": {
+ "node": ">=6"
+ },
+ "peerDependencies": {
+ "eslint": ">= 4.12.1"
+ }
+ },
+ "node_modules/babel-eslint/node_modules/eslint-visitor-keys": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz",
+ "integrity": "sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==",
+ "engines": {
+ "node": ">=4"
+ }
+ },
"node_modules/babel-jsx-utils": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/babel-jsx-utils/-/babel-jsx-utils-1.1.0.tgz",
@@ -11092,6 +11125,17 @@
"node": ">=12.13.0"
}
},
+ "node_modules/gatsby-plugin-eslint": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/gatsby-plugin-eslint/-/gatsby-plugin-eslint-3.0.0.tgz",
+ "integrity": "sha512-nvyLz067k8lmhWIalhgFCzlNIjHIabYPZXpARM0k4AGRJWOPgOxc5P0T+G/TjCvtSg4+jtKotbE5ranMbxIBiw==",
+ "dev": true,
+ "peerDependencies": {
+ "eslint": "^7.18.0",
+ "eslint-webpack-plugin": "^2.4.3",
+ "gatsby": ">=2"
+ }
+ },
"node_modules/gatsby-plugin-image": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/gatsby-plugin-image/-/gatsby-plugin-image-1.6.0.tgz",
@@ -28315,6 +28359,26 @@
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz",
"integrity": "sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA=="
},
+ "babel-eslint": {
+ "version": "10.1.0",
+ "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
+ "integrity": "sha512-ifWaTHQ0ce+448CYop8AdrQiBsGrnC+bMgfyKFdi6EsPLTAWG+QfyDeM6OH+FmWnKvEq5NnBMLvlBUPKQZoDSg==",
+ "requires": {
+ "@babel/code-frame": "^7.0.0",
+ "@babel/parser": "^7.7.0",
+ "@babel/traverse": "^7.7.0",
+ "@babel/types": "^7.7.0",
+ "eslint-visitor-keys": "^1.0.0",
+ "resolve": "^1.12.0"
+ },
+ "dependencies": {
+ "eslint-visitor-keys": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz",
+ "integrity": "sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ=="
+ }
+ }
+ },
"babel-jsx-utils": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/babel-jsx-utils/-/babel-jsx-utils-1.1.0.tgz",
@@ -33684,6 +33748,13 @@
"micromatch": "^4.0.2"
}
},
+ "gatsby-plugin-eslint": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/gatsby-plugin-eslint/-/gatsby-plugin-eslint-3.0.0.tgz",
+ "integrity": "sha512-nvyLz067k8lmhWIalhgFCzlNIjHIabYPZXpARM0k4AGRJWOPgOxc5P0T+G/TjCvtSg4+jtKotbE5ranMbxIBiw==",
+ "dev": true,
+ "requires": {}
+ },
"gatsby-plugin-image": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/gatsby-plugin-image/-/gatsby-plugin-image-1.6.0.tgz",
diff --git a/gatsby/package.json b/gatsby/package.json
index 19fcda3..f35e7e9 100644
--- a/gatsby/package.json
+++ b/gatsby/package.json
@@ -42,7 +42,12 @@
"tailwindcss": "^2.1.2"
},
"devDependencies": {
+ "babel-eslint": "^10.1.0",
"eslint": "^7.28.0",
- "eslint-config-react-app": "^6.0.0"
+ "eslint-config-react-app": "^6.0.0",
+ "eslint-plugin-react": "^7.24.0",
+ "eslint-plugin-react-hooks": "^4.2.0",
+ "eslint-webpack-plugin": "^2.5.4",
+ "gatsby-plugin-eslint": "^3.0.0"
}
}
diff --git a/gatsby/src/pages/gallery.js b/gatsby/src/pages/gallery.js
index a652346..3452852 100644
--- a/gatsby/src/pages/gallery.js
+++ b/gatsby/src/pages/gallery.js
@@ -1,10 +1,10 @@
-import * as React from "react"
+import * as React from 'react'
import { graphql, Link } from 'gatsby'
-import { GatsbyImage, getImage } from "gatsby-plugin-image"
-import { Helmet } from "react-helmet"
-import Masonry, { ResponsiveMasonry } from "react-responsive-masonry"
+import { GatsbyImage, getImage } from 'gatsby-plugin-image'
+import { Helmet } from 'react-helmet'
+import Masonry, { ResponsiveMasonry } from 'react-responsive-masonry'
-import { getMeta } from "../utils"
+import { getMeta } from '../utils'
const GalleryPage = ({ data }) => {
const images = React.useMemo(() =>
diff --git a/gatsby/src/templates/gallery-image.js b/gatsby/src/templates/gallery-image.js
index 01fd04c..b304f47 100644
--- a/gatsby/src/templates/gallery-image.js
+++ b/gatsby/src/templates/gallery-image.js
@@ -1,11 +1,11 @@
-import React from "react"
+import React from 'react'
import { graphql } from 'gatsby'
-import { getMeta, getName } from "../utils";
-import { GatsbyImage, getImage } from "gatsby-plugin-image"
-import { Helmet } from "react-helmet";
+import { getMeta, getName } from '../utils';
+import { GatsbyImage, getImage } from 'gatsby-plugin-image'
+import { Helmet } from 'react-helmet';
import classnames from 'classnames'
-const GalleryImage = ({ pageContext, data }) => {
+const GalleryImage = ({ data }) => {
const image = data.allFile.edges[0].node
const ar = image.childImageSharp.fluid.aspectRatio;
console.log(ar);
@@ -26,7 +26,7 @@ const GalleryImage = ({ pageContext, data }) => {
</Helmet>
<div className="min-h-screen flex flex-col justify-center">
{/* TODO: change layout by amount of empty space on side of page, not aspect ratio? */}
- <div style={{ margin: '0 5vw' }} className={classnames("flex mx-auto", ar > 1 ? 'flex-col' : 'flex-row-reverse')}>
+ <div style={{ margin: '0 5vw' }} className={classnames('flex mx-auto', ar > 1 ? 'flex-col' : 'flex-row-reverse')}>
<div className='flex-grow-0'>
<h1 className="text-2xl mt-2">{name}</h1>
<GatsbyImage