Update prettier (#22520)

* Update prettier to latest version

* Run 'yarn format' from root of project

* Remove prettier-ignore for nested markdown

* Fix starters

* Fix benchmarks

* Fix examples

* Fix integration-tests

* Update eslint-config-prettier & eslint-plugin-prettier

* Fix linting

* Update all .prettierrc

* Run Prettier on full codebase

* Remove unnecessary .prettierrc & .prettierignore files

* Update Prettier script

* Update snapshots

* Revert snapshot

* Revert "Update Prettier script"

This reverts commit 008eb99

* Update snapshot

* Update docs/blog/2018-08-09-swag-store/index.md

Co-Authored-By: Dima An <dmitriym44@gmail.com>

Co-authored-by: Dima An <dmitriym44@gmail.com>

.github/actions/high-priority-prs/src/filter.js

@@ -13,9 +13,7 @@ const filter = (queues, team) => {
         .map(node => {
           if (node.requestedReviewer) {
             tools.log.info(
-              `Review request for team ${node.requestedReviewer.name} on PR: ${
-                pr.title
-              }`
+              `Review request for team ${node.requestedReviewer.name} on PR: ${pr.title}`
             )
             return node.requestedReviewer.id
           }

.github/actions/high-priority-prs/src/index.js

@@ -17,7 +17,7 @@ const teams = [
   },
 ]
 
-const start = async function() {
+const start = async function () {
   const data = await fetch()
   if (data) {
     const queues = processData(data)

.prettierrc.js

@@ -1,9 +1,6 @@
 module.exports = {
-  endOfLine: "lf",
+  arrowParens: "avoid",
   semi: false,
-  singleQuote: false,
-  tabWidth: 2,
-  trailingComma: "es5",
   overrides: [
     {
       // This file uses semicolons. It's needed here because `documentation`
@@ -16,10 +13,10 @@ module.exports = {
       },
     },
     {
-      "files": "docs/**/*.md",
-      "options": {
-        "parser": "mdx"
-      }
+      files: "docs/**/*.md",
+      options: {
+        parser: "mdx",
+      },
     },
   ],
 }

benchmarks/create-pages/gatsby-config.js

@@ -4,7 +4,5 @@ module.exports = {
     description: `The createPages benchmark`,
     author: `@gatsbyjs`,
   },
-  plugins: [
-    `gatsby-plugin-benchmark-reporting`,
-  ],
+  plugins: [`gatsby-plugin-benchmark-reporting`],
 }

benchmarks/markdown_id/md.tpl.js

@@ -8,10 +8,7 @@ module.exports = index => `${matter
     title: faker.lorem.sentence(),
     description: faker.lorem.sentence(),
     path: `/${faker.helpers.slugify(faker.lorem.sentence())}`,
-    date: faker.date
-      .recent(1000)
-      .toISOString()
-      .slice(0, 10),
+    date: faker.date.recent(1000).toISOString().slice(0, 10),
     tags: `[${faker.random
       .words(3)
       .split(` `)

benchmarks/markdown_slug/md.tpl.js

@@ -8,10 +8,7 @@ module.exports = index => `${matter
     title: faker.lorem.sentence(),
     description: faker.lorem.sentence(),
     path: `/${faker.helpers.slugify(faker.lorem.sentence())}`,
-    date: faker.date
-      .recent(1000)
-      .toISOString()
-      .slice(0, 10),
+    date: faker.date.recent(1000).toISOString().slice(0, 10),
     tags: `[${faker.random
       .words(3)
       .split(` `)

benchmarks/mdx/gatsby-browser.js

@@ -1 +1 @@
-import "./styles.css"
+import "./styles.css"

benchmarks/mdx/package.json

@@ -35,7 +35,7 @@
   "devDependencies": {
     "cross-env": "^7.0.0",
     "gatsby-plugin-benchmark-reporting": "*",
-    "prettier": "^1.19.1",
+    "prettier": "2.0.4",
     "willit": "*"
   },
   "repository": {

benchmarks/mdx/src/pages/index.js

@@ -7,7 +7,7 @@ const Index = ({ data }) => {
     <Layout>
       {data.site.siteMetadata.siteTitle}
       <ul>
-        {data?.articles?.nodes.map(article => (
+        {data?.articles?.nodes.map((article) => (
           <li>
             <Link to={article.fields.path}>{article.frontmatter.title}</Link>
           </li>

benchmarks/plugin-manifest/index.js

@@ -67,9 +67,10 @@ async function runTest() {
   )
 
   console.info(
-    `\nRange execution time (hr): ${(Math.max(...results.nanoseconds) -
-      Math.min(...results.nanoseconds)) /
-      1000000}ms`
+    `\nRange execution time (hr): ${
+      (Math.max(...results.nanoseconds) - Math.min(...results.nanoseconds)) /
+      1000000
+    }ms`
   )
 }
 

benchmarks/source-contentful/package.json

@@ -32,7 +32,7 @@
     "chalk": "^2.4.2",
     "cross-env": "^7.0.0",
     "gatsby-plugin-benchmark-reporting": "*",
-    "prettier": "^1.19.1",
+    "prettier": "2.0.4",
     "yargs": "^15.3.1"
   },
   "repository": {

benchmarks/source-datocms/package.json

@@ -27,7 +27,7 @@
   "devDependencies": {
     "cross-env": "^7.0.0",
     "gatsby-plugin-benchmark-reporting": "*",
-    "prettier": "^1.19.1"
+    "prettier": "2.0.4"
   },
   "repository": {
     "type": "git",

benchmarks/source-datocms/src/templates/article.js

@@ -23,8 +23,8 @@ const Article = ({ data }) => {
 export default Article
 
 export const query = graphql`
-  query($id: String!){
-    article: datoCmsArticle(id: {eq: $id }) {
+  query($id: String!) {
+    article: datoCmsArticle(id: { eq: $id }) {
       title
       body
       image {

benchmarks/source-drupal/gatsby-browser.js

@@ -1 +1 @@
-import "./styles.css"
+import "./styles.css"

benchmarks/source-drupal/gatsby-node.js

@@ -3,7 +3,7 @@ const kebabCase = require(`lodash.kebabcase`)
 exports.onCreateNode = ({ actions, node }) => {
   const { createNodeField } = actions
 
-  if (node.internal.type === 'node__article') {
+  if (node.internal.type === "node__article") {
     createNodeField({ node, name: "slug", value: kebabCase(node.title) })
   }
 }
@@ -33,7 +33,7 @@ exports.createPages = async ({ actions, graphql, reporter }) => {
       component: require.resolve(`./src/templates/article.js`),
       context: {
         slug: article.fields.slug,
-      }
+      },
     })
   })
-}
+}

benchmarks/source-drupal/package.json

@@ -27,7 +27,7 @@
   "devDependencies": {
     "cross-env": "^7.0.0",
     "gatsby-plugin-benchmark-reporting": "*",
-    "prettier": "^1.19.1"
+    "prettier": "2.0.4"
   },
   "repository": {
     "type": "git",

benchmarks/source-drupal/src/templates/article.js

@@ -10,11 +10,18 @@ const Article = ({ data }) => {
       <div>
         <h2>{data.article.title}</h2>
         {data.article.relationships.field_image.localFile.childImageSharp ? (
-          <Img fluid={data.article.relationships.field_image.localFile.childImageSharp.fluid} />
+          <Img
+            fluid={
+              data.article.relationships.field_image.localFile.childImageSharp
+                .fluid
+            }
+          />
         ) : (
           <div>Image can't be displayed</div>
         )}
-        <div dangerouslySetInnerHTML={{ __html: data.article.body.processed }} />
+        <div
+          dangerouslySetInnerHTML={{ __html: data.article.body.processed }}
+        />
       </div>
     </Layout>
   )
@@ -23,8 +30,8 @@ const Article = ({ data }) => {
 export default Article
 
 export const query = graphql`
-  query($slug: String!){
-    article: nodeArticle(fields: {slug: {eq: $slug }}) {
+  query($slug: String!) {
+    article: nodeArticle(fields: { slug: { eq: $slug } }) {
       title
       body {
         processed
@@ -42,4 +49,4 @@ export const query = graphql`
       }
     }
   }
-`
+`

benchmarks/source-wordpress/gatsby-browser.js

@@ -1 +1 @@
-import "./styles.css"
+import "./styles.css"

benchmarks/source-wordpress/gatsby-node.js

@@ -22,7 +22,7 @@ exports.createPages = async ({ actions, graphql, reporter }) => {
       component: require.resolve(`./src/templates/article.js`),
       context: {
         id: article.id,
-      }
+      },
     })
   })
-}
+}

benchmarks/source-wordpress/package.json

@@ -26,7 +26,7 @@
   "devDependencies": {
     "cross-env": "^7.0.0",
     "gatsby-plugin-benchmark-reporting": "*",
-    "prettier": "^1.19.1"
+    "prettier": "2.0.4"
   },
   "repository": {
     "type": "git",

benchmarks/source-wordpress/src/templates/article.js

@@ -22,18 +22,18 @@ export default Article
 
 export const query = graphql`
   query($id: String!) {
-  article: wpPost(id: { eq: $id } ) {
+    article: wpPost(id: { eq: $id }) {
       title
-			content
-			featuredImage {
+      content
+      featuredImage {
         remoteFile {
-            childImageSharp {
-              fluid(maxWidth: 960, quality: 90) {
-                ...GatsbyImageSharpFluid_withWebp_tracedSVG
-              }
+          childImageSharp {
+            fluid(maxWidth: 960, quality: 90) {
+              ...GatsbyImageSharpFluid_withWebp_tracedSVG
             }
+          }
         }
       }
+    }
   }
-}
-`
+`

docs/blog/2018-08-09-swag-store/index.md

@@ -18,16 +18,12 @@ We’ve spent the last couple weeks working the kinks out, and we couldn’t be
     src="./images/gatsby-swag-twitter.jpg"
   />
   <figcaption>
-    {/* prettier-ignore */}
-    Tweets from <a href="https://twitter.com/DeaNHtiD99/status/1023204484183416832">
-      Dean
-    </a>, <a href="https://twitter.com/ARebelBelle/status/1020044426712735744">
-      Elle
-    </a>, <a href="https://twitter.com/chaseadamsio/status/1021896138503245824">
-      Chase
-    </a>, and <a href="https://twitter.com/kato_katherine/status/1021967765400211456">
-      Katherine
-    </a> showing off their new Gatsby swag.
+    Tweets from
+    [Dean](https://twitter.com/DeaNHtiD99/status/1023204484183416832),
+    [Elle](https://twitter.com/ARebelBelle/status/1020044426712735744),
+    [Chase](https://twitter.com/chaseadamsio/status/1021896138503245824), and
+    [Katherine](https://twitter.com/kato_katherine/status/1021967765400211456)
+    showing off their new Gatsby swag.
   </figcaption>
 </figure>
 

docs/blog/2018-12-17-turning-the-static-dynamic/index.md

@@ -243,8 +243,9 @@ export default () => {
   const content = { message: "", login: true }
   const user = getUser()
   if (isLoggedIn()) {
-    content.message = `Hello, ${user.user_metadata &&
-      user.user_metadata.full_name}`
+    content.message = `Hello, ${
+      user.user_metadata && user.user_metadata.full_name
+    }`
   } else {
     content.message = "You are not logged in"
   }

docs/blog/2019-04-02-behind-the-scenes-what-makes-gatsby-great/index.md

@@ -179,10 +179,7 @@ export default function Contact() {
         initialValues={{ email: ``, name: ``, message: `` }}
         onSubmit={handleSubmit}
         validationSchema={yup.object().shape({
-          email: yup
-            .string()
-            .email()
-            .required(),
+          email: yup.string().email().required(),
           name: yup.string().required(),
           message: yup.string().required(),
         })}

docs/blog/2019-04-30-how-to-build-a-blog-with-wordpress-and-gatsby-part-2/index.md

@@ -82,7 +82,7 @@ These files will be present in all Gatsby starters you use, so it's worth your t
     "react-helmet": "^5.2.0"
   },
   "devDependencies": {
-    "prettier": "^1.16.4"
+    "prettier": "2.0.4"
   },
   "keywords": ["gatsby"],
   "license": "MIT",
@@ -196,7 +196,7 @@ module.exports = {
           "**/users",
         ],
         excludedRoutes: [],
-        normalizer: function({ entities }) {
+        normalizer: function ({ entities }) {
           return entities
         },
       },

docs/blog/2019-05-02-how-to-build-a-blog-with-wordpress-and-gatsby-part-3/index.md

@@ -470,7 +470,7 @@ module.exports = {
           "**/*/*/menu-locations", // <== Menu api endpoint
         ],
         excludedRoutes: [],
-        normalizer: function({ entities }) {
+        normalizer: function ({ entities }) {
           return entities
         },
       },

docs/blog/2019-07-23-google-sheets-gatsby-acroyoga-video-explorer/index.md

@@ -144,7 +144,7 @@ Here's my new array of objects with the properties matching the first row.
 Next, I'd like for my comma-separated strings of tags (column I) to be arrays of tags (so I can `.map` over them in my React UI). This code allows me to do that:
 
 ```javascript
-let itemsArrayWithTagsArray = rows.map(function(item) {
+let itemsArrayWithTagsArray = rows.map(function (item) {
   item.tags = item.tags.split(",").map(item => item.trim())
   item = { ...item }
   return item