Use mutations in Gatsby Admin

.circleci/config.yml

@@ -205,12 +205,16 @@ jobs:
 
   unit_tests_node10:
     executor: node
+    environment:
+      FORCE_COLOR: 0
     <<: *test_template
 
   unit_tests_node12:
     executor:
       name: node
       image: "12"
+    environment:
+      FORCE_COLOR: 0
     <<: *test_template
 
   unit_tests_www:

benchmarks/markdown_id/package.json

@@ -28,8 +28,10 @@
     "react-dom": "^16.12.0",
     "react-helmet": "^5.2.1",
     "react-typography": "^0.16.19",
+    "ts-node": "^8.9.0",
     "typeface-merriweather": "0.0.72",
     "typeface-montserrat": "0.0.75",
+    "typescript": "^3.8.3",
     "typography": "^0.16.19",
     "typography-theme-wordpress-2016": "^0.16.19"
   },
@@ -46,6 +48,7 @@
     "bench": "rm -r markdown-pages; NUM_PAGES=${NUM_PAGES:-2000} node md.generate.js; gatsby clean; node --max_old_space_size=2000 node_modules/.bin/gatsby build",
     "benchnb": "gatsby clean; node --max_old_space_size=2000 node_modules/.bin/gatsby build",
     "build": "gatsby build",
+    "data-update": "ts-node scripts/data-update.ts",
     "develop": "gatsby develop",
     "start": "npm run develop",
     "serve": "gatsby serve",

benchmarks/markdown_id/scripts/data-update.ts

@@ -0,0 +1 @@
+// noop for now, but will be created later.

benchmarks/markdown_slug/package.json

@@ -28,8 +28,10 @@
     "react-dom": "^16.12.0",
     "react-helmet": "^5.2.1",
     "react-typography": "^0.16.19",
+    "ts-node": "^8.9.0",
     "typeface-merriweather": "0.0.72",
     "typeface-montserrat": "0.0.75",
+    "typescript": "^3.8.3",
     "typography": "^0.16.19",
     "typography-theme-wordpress-2016": "^0.16.19"
   },
@@ -46,6 +48,7 @@
     "bench": "rm -r markdown-pages; NUM_PAGES=${NUM_PAGES:-2000} node md.generate.js; gatsby clean; node --max_old_space_size=2000 node_modules/.bin/gatsby build",
     "benchnb": "gatsby clean; node --max_old_space_size=2000 node_modules/.bin/gatsby build",
     "build": "gatsby build",
+    "data-update": "ts-node scripts/data-update.ts",
     "develop": "gatsby develop",
     "start": "npm run develop",
     "serve": "gatsby serve",

benchmarks/markdown_slug/scripts/data-update.ts

@@ -0,0 +1 @@
+// noop for now, but will be created later.

benchmarks/markdown_table/package.json

@@ -6,13 +6,16 @@
     "bench": "set -x; gatsby clean; NUM_PAGES=${NUM_PAGES:-2000} gatsby build",
     "develop": "gatsby develop",
     "build": "gatsby build",
+    "data-update": "ts-node scripts/data-update.ts",
     "serve": "gatsby serve"
   },
   "dependencies": {
     "gatsby": "^2.19.5",
     "gatsby-transformer-remark": "^2.6.48",
     "react": "^16.12.0",
-    "react-dom": "^16.12.0"
+    "react-dom": "^16.12.0",
+    "ts-node": "^8.9.0",
+    "typescript": "^3.8.3"
   },
   "devDependencies": {
     "faker": "^4.1.0",

benchmarks/markdown_table/scripts/data-update.ts

@@ -0,0 +1 @@
+// noop for now, but will be created later.

benchmarks/mdx/package.json

@@ -7,6 +7,7 @@
   "scripts": {
     "build": "gatsby build",
     "build:send": "cross-env BENCHMARK_REPORTING_URL=true gatsby build",
+    "data-update": "ts-node scripts/data-update.ts",
     "develop": "gatsby develop",
     "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
     "postinstall": "del-cli src/articles && gatsby clean && willit --use-pregenerated-data --type=mdx --num-pages=${NUM_PAGES:-512}",
@@ -27,7 +28,9 @@
     "gatsby-source-filesystem": "^2.2.3",
     "gatsby-transformer-sharp": "^2.4.5",
     "react": "^16.12.0",
-    "react-dom": "^16.12.0"
+    "react-dom": "^16.12.0",
+    "ts-node": "^8.9.0",
+    "typescript": "^3.8.3"
   },
   "devDependencies": {
     "cross-env": "^7.0.0",

benchmarks/mdx/scripts/data-update.ts

@@ -0,0 +1 @@
+// noop for now, but will be created later.

benchmarks/source-contentful/package.json

@@ -7,6 +7,7 @@
   "scripts": {
     "clean": "gatsby clean",
     "build": "gatsby build",
+    "data-update": "ts-node scripts/data-update.ts",
     "develop": "gatsby develop",
     "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
     "serve": "gatsby serve",
@@ -26,7 +27,9 @@
     "gatsby-source-filesystem": "^2.1.48",
     "gatsby-transformer-sharp": "^2.3.14",
     "react": "^16.12.0",
-    "react-dom": "^16.12.0"
+    "react-dom": "^16.12.0",
+    "ts-node": "^8.9.0",
+    "typescript": "^3.8.3"
   },
   "devDependencies": {
     "chalk": "^2.4.2",

benchmarks/source-contentful/scripts/data-update.ts

@@ -0,0 +1 @@
+// noop for now, but will be created later.

benchmarks/source-datocms/package.json

@@ -7,6 +7,7 @@
   "scripts": {
     "build": "gatsby build",
     "build:send": "cross-env BENCHMARK_REPORTING_URL=true gatsby build",
+    "data-update": "ts-node scripts/data-update.ts",
     "develop": "gatsby develop",
     "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
     "serve": "gatsby serve",
@@ -22,7 +23,9 @@
     "gatsby-transformer-sharp": "^2.3.14",
     "lodash.kebabcase": "^4.1.1",
     "react": "^16.12.0",
-    "react-dom": "^16.12.0"
+    "react-dom": "^16.12.0",
+    "ts-node": "^8.9.0",
+    "typescript": "^3.8.3"
   },
   "devDependencies": {
     "cross-env": "^7.0.0",

benchmarks/source-datocms/scripts/data-update.ts

@@ -0,0 +1 @@
+// noop for now, but will be created later.

benchmarks/source-drupal/.env.example

@@ -1 +1,3 @@
 BENCHMARK_DRUPAL_BASE_URL=
+BENCHMARK_DRUPAL_USERNAME=
+BENCHMARK_DRUPAL_PASSWORD=

benchmarks/source-drupal/package.json

@@ -7,22 +7,27 @@
   "scripts": {
     "build": "gatsby build",
     "build:send": "cross-env BENCHMARK_REPORTING_URL=true gatsby build",
+    "data-update": "ts-node scripts/data-update.ts",
     "develop": "gatsby develop",
     "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
     "start": "npm run develop",
     "serve": "gatsby serve"
   },
   "dependencies": {
     "dotenv": "^8.2.0",
+    "faker": "^4.1.0",
     "gatsby": "^2.19.7",
     "gatsby-image": "^2.2.40",
     "gatsby-plugin-sharp": "^2.4.5",
     "gatsby-source-drupal": "^3.3.18",
     "gatsby-source-filesystem": "^2.1.48",
     "gatsby-transformer-sharp": "^2.3.14",
     "lodash.kebabcase": "^4.1.1",
+    "node-fetch": "^2.6.0",
     "react": "^16.12.0",
-    "react-dom": "^16.12.0"
+    "react-dom": "^16.12.0",
+    "ts-node": "^8.6.2",
+    "typescript": "^3.8.3"
   },
   "devDependencies": {
     "cross-env": "^7.0.0",

benchmarks/source-drupal/scripts/data-update.ts

@@ -0,0 +1,13 @@
+#!/usr/bin/env node
+
+import { update } from "./updater"
+
+require("dotenv").config({
+  path: `.env.${process.env.NODE_ENV}`,
+})
+
+const username = process.env.BENCHMARK_DRUPAL_USERNAME
+const password = process.env.BENCHMARK_DRUPAL_PASSWORD
+const server = process.env.BENCHMARK_DRUPAL_BASE_URL
+
+update(username, password, server)

benchmarks/source-drupal/scripts/updater.ts

@@ -0,0 +1,62 @@
+import fetch from "node-fetch"
+import faker from "faker"
+
+interface IArticle {
+  id: string
+  attributes: {
+    title: string
+  }
+}
+
+// Remove last word of title and replace it with a random word.
+const updateTitle = (title: string): string =>
+  `${title.substring(0, title.lastIndexOf(` `))} ${faker.lorem.word()}`
+
+const patchArticle = async (
+  username: string,
+  password: string,
+  server: string,
+  article: IArticle
+): Promise<void> => {
+  const url = `${server}/jsonapi/node/article/${article.id}`
+
+  const response = await fetch(url, {
+    method: `PATCH`,
+    headers: {
+      "Content-Type": `application/vnd.api+json`,
+      Authorization: `Basic ${Buffer.from(`${username}:${password}`).toString(
+        `base64`
+      )}`,
+    },
+    body: JSON.stringify({
+      data: {
+        type: `node--article`,
+        id: article.id,
+        attributes: {
+          title: updateTitle(article.attributes.title),
+        },
+      },
+    }),
+  })
+}
+
+const getFirstArticle = async (server: string): Promise<IArticle> => {
+  const url = `${server}/jsonapi/node/article?page[limit]=1&sort=created`
+  const response = await fetch(url)
+  const body = await response.json()
+  return body.data[0]
+}
+
+export const update = async (
+  username?: string,
+  password?: string,
+  server?: string
+): Promise<void> => {
+  if (!username || !password || !server) {
+    console.error(`You must pass username, password and server`)
+    return
+  }
+
+  const article = await getFirstArticle(server)
+  await patchArticle(username, password, server, article)
+}

benchmarks/source-drupal/tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "typeRoots": ["./node_modules/@types", "./typings"],
+    "target": "ES2018" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */,
+    "module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */,
+    "strict": true /* Enable all strict type-checking options. */,
+    "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */,
+    "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */,
+    "noImplicitAny": false
+  }
+}

benchmarks/source-wordpress/package.json

@@ -7,6 +7,7 @@
   "scripts": {
     "build": "gatsby build",
     "build:send": "cross-env BENCHMARK_REPORTING_URL=true gatsby build",
+    "data-update": "ts-node scripts/data-update.ts",
     "develop": "gatsby develop",
     "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
     "serve": "gatsby serve",
@@ -21,7 +22,9 @@
     "gatsby-source-wordpress-experimental": "^0.0.31",
     "gatsby-transformer-sharp": "^2.3.14",
     "react": "^16.12.0",
-    "react-dom": "^16.12.0"
+    "react-dom": "^16.12.0",
+    "ts-node": "^8.9.0",
+    "typescript": "^3.8.3"
   },
   "devDependencies": {
     "cross-env": "^7.0.0",

benchmarks/source-wordpress/scripts/data-update.ts

@@ -0,0 +1 @@
+// noop for now, but will be created later.

docs/blog/2020-04-02-community-qa-with-kyle-mathews/index.md

@@ -11,7 +11,7 @@ The [full video is on YouTube](https://www.youtube.com/watch?v=mGyUJvKjzXQ&featu
 
 ## In 2018 you blogged about "a new version of Gatsby" with incremental and parallelizing builds—what's the status & roadmap for incremental builds with Gatsby?
 
-I’m guessing this question is referring to [my blog post on the launch of our company in 2018](https://www.gatsbyjs.org/blog/2018-05-24-launching-new-gatsby-company/) and that supporting very fast deployments for everyone is our top goal as a company.
+I’m guessing this question is referring to [my blog post on the launch of our company in 2018](/blog/2018-05-24-launching-new-gatsby-company/) and that supporting very fast deployments for everyone is our top goal as a company.
 
 This has always been my goal with Gatsby. The Gatsby v1 architecture was designed specifically to support this. Here’s the original tweet announcing when the basic support for incremental builds was added to the framework in a 1.0 alpha:
 
@@ -21,7 +21,7 @@ Gatsby has always used “incremental building” to drive developing on sites.
 
 The Gatsby cache, if saved between builds, also substantially increases the speed of builds by avoiding much of the rework.
 
-As most of you know, [we recently launched our own continuous deployment product on Gatsby Cloud](https://www.gatsbyjs.org/blog/2020-01-27-announcing-gatsby-builds-and-reports/). Included in that was initial support for parallelizing parts of the build process — images to start with, and more to come.
+As most of you know, [we recently launched our own continuous deployment product on Gatsby Cloud](/blog/2020-01-27-announcing-gatsby-builds-and-reports/). Included in that was initial support for parallelizing parts of the build process — images to start with, and more to come.
 
 That drove some impressive improvements to build speeds:
 
@@ -55,29 +55,29 @@ We’re razor focused right now on solving these two problems (see the last answ
 
 There are still two remaining valid reasons for run-time SSR that we plan to support. One is personalization where the page needs to be customized for the visitor based on a variety of factors. The other is A/B testing. Both of those require that you can render custom versions of pages on the fly. We will not only support this but also solve it in a way that doesn’t sacrifice the speed and simplicity Gatsby is known for.
 
-## What's a realistic availability timeline for incremental builds using Wordpress with WPGraphQL?
+## What's a realistic availability timeline for incremental builds using WordPress with WPGraphQL?
 
 A bit of back history for everyone: last year we hired [Jason Bahl](https://twitter.com/jasonbahl), the creator of [WPGraphQL](https://www.wpgraphql.com/), to continue his work. We want to fully support WordPress + Gatsby, meaning content authors can see real-time previews and content changes deploy in less than 10 seconds. This is the great experience that CMSs provide for content authors. Replicating it is a hard requirement for most people considering moving to a headless WordPress + Gatsby stack.
 
 We choose WPGraphQL as the way forward as Jason’s done an amazing job making incremental querying incredibly fast—as well as adding GraphQL subscription support, which will drive both preview & incremental builds.
 
-Last fall [Tyler Barnes](https://github.com/TylerBarnes) — a long-time Gatsby/WP developer — joined the team to work on a new version of gatsby-source-wordpress that leverages WPGraphQL to drive preview/10 second deploys.
+Last fall [Tyler Barnes](https://github.com/TylerBarnes) — a long-time Gatsby/WordPress developer — joined the team to work on a new version of gatsby-source-wordpress that leverages WPGraphQL to drive preview/10 second deploys.
 
 They’ve been making incredible progress. Check out [the umbrella issue for the epic](https://github.com/gatsbyjs/gatsby/issues/19292). A number of people are experimenting with the alphas and even shipping sites! If you’re interested in this space, please dive in.
 
-What’s amazing about this work is that **you’ll soon be able to seamlessly swap out the WordPress presentation layer for Gatsby **without** anyone working in the WordPress CMS noticing**. As a developer, you’ll be able to deliver way faster sites, enjoy far simpler hosting, put WordPress behind a firewall (maybe even skip some of those security updates! 😅🤪), and enjoy all the advantages of working in the world of modern React/JS tooling.
+What’s amazing about this work is that **you’ll soon be able to seamlessly swap out the WordPress presentation layer for Gatsby **without** anyone working in the WordPress CMS noticing**. As a developer, you’ll be able to deliver way faster sites, enjoy far simpler hosting, put WordPress behind a firewall (maybe even skip some of those security updates! 😅🤪), and enjoy all the advantages of working in the world of modern React/JavaScript tooling.
 
 ## Working with images is a pain, and the distinction between page and static query seems a wrong API. The [issue #10482](https://github.com/gatsbyjs/gatsby/issues/10482) seems to fix both. What's the plan?
 
 We’ve worked on a number of ideas/prototypes for solving this but haven’t yet arrived at something we feel is a genuine improvement. There are more ideas floating around for better APIs, so stay tuned. We’d love to pair with anyone who has ideas for improving things as well.
 
-## Is there going to be a WP integration with Gatsby Cloud?
+## Is there going to be a WordPress integration with Gatsby Cloud?
 
 Yup! Once the new gatsby-source-wordpress version is ready, Preview & Incremental builds will work out-of-the-box on Gatsby Cloud.
 
 ## Are there going to be any big Gatsby core releases coming up?
 
-We ship releases multiple times a week. Most are incremental improvements and bug releases. We periodically write blog posts summarizing improvements. You can catch up with them at [https://www.gatsbyjs.org/blog/tags/gazette/](https://www.gatsbyjs.org/blog/tags/gazette/)
+We ship releases multiple times a week. Most are incremental improvements and bug releases. We periodically write blog posts summarizing improvements. You can catch up with them at [https://www.gatsbyjs.org/blog/tags/gazette/](/blog/tags/gazette/)
 
 We put up a couple of RFCs recently for “[Recipes](https://github.com/gatsbyjs/gatsby/pull/22610)” and a “[Gatsby Admin](https://github.com/gatsbyjs/gatsby/pull/22713)” experience you can go read. They’re going to push the Gatsby experience forward a lot.
 
@@ -99,7 +99,7 @@ We’re also investigating better patterns for building themes to ensure they’
 
 ## Is there a limit on the size of a website generated with Gatsby? At what point does the build time become unmanageable?
 
-That’s a constantly moving target as we improve the Gatsby build process. Our open source team is now 15 people strong and many of them are working on the build process from different angles from improving source plugins to core parts of the build process. [Peter van der Zee](https://twitter.com/kuvos) joined the team as a build performance specialist last fall from Facebook where he was a JS Infrastructure Engineer and [has a long string of PRs improving the build process over the past months](https://github.com/gatsbyjs/gatsby/commits?author=pvdz).
+That’s a constantly moving target as we improve the Gatsby build process. Our open source team is now 15 people strong and many of them are working on the build process from different angles from improving source plugins to core parts of the build process. [Peter van der Zee](https://twitter.com/kuvos) joined the team as a build performance specialist last fall from Facebook where he was a JavaScript Infrastructure Engineer and [has a long string of PRs improving the build process over the past months](https://github.com/gatsbyjs/gatsby/commits?author=pvdz).
 
 We’re also working on adding benchmark sites that’ll show more clearly when a site is a good fit for Gatsby.
 
@@ -111,14 +111,14 @@ Awww thanks! I don’t know there’s anything magic other than just caring enou
 
 Yes! This is something we’re pretty excited about shipping. If you’re interested in learning more or helping out, check out this issue [Sidhartha Chatterjee](https://github.com/sidharthachatterjee) put together — [https://github.com/gatsbyjs/gatsby/issues/18983](https://github.com/gatsbyjs/gatsby/issues/18983)
 
-[Blaine Kasten](https://twitter.com/blainekasten) has also been leading the effort to convert the entire codebase to Typescript which has been a massive effort by dozens of people — [https://github.com/gatsbyjs/gatsby/issues/21995](https://github.com/gatsbyjs/gatsby/issues/21995)
+[Blaine Kasten](https://twitter.com/blainekasten) has also been leading the effort to convert the entire codebase to TypeScript which has been a massive effort by dozens of people — [https://github.com/gatsbyjs/gatsby/issues/21995](https://github.com/gatsbyjs/gatsby/issues/21995)
 
-## Are you guys trying to catch up to Next.js's smaller JS bundle size?
+## Are you guys trying to catch up to Next.js's smaller JavaScript bundle size?
 
 A team at Chrome has been doing a lot of investigation into how frameworks like Next.js & Gatsby can optimize how we ship JavaScript. Next.js implemented that a few months ago and last week [Ward Peeters](https://twitter.com/wardpeet) shipped [a PR implementing the same new webpack bundling algorithm](https://github.com/gatsbyjs/gatsby/pull/22253) for Gatsby—so bundle sizes are now identical to Next.js. Very exciting improvement!
 
 ## Are you continuing to work on even more good accessibility defaults for Gatsby in the future? How important is accessibility overall within Gatsby?
 
-We care a lot about accessibility. We think that’s part and parcel of building a great framework. We moved to @reach/router as part of Gatsby v2 to take advantage of Ryan Florence’s work on JS router accessibility, and Marcy Sutton has done a lot of testing on how to solve some lingering issues. We hired [Madalyn Rose](https://twitter.com/madalynrose) last fall as a full-time specialist for accessibility engineering in Gatsby.
+We care a lot about accessibility. We think that’s part and parcel of building a great framework. We moved to @reach/router as part of Gatsby v2 to take advantage of Ryan Florence’s work on JavaScript router accessibility, and Marcy Sutton has done a lot of testing on how to solve some lingering issues. We hired [Madalyn Rose](https://twitter.com/madalynrose) last fall as a full-time specialist for accessibility engineering in Gatsby.
 
-Check out our blog posts tagged with accessibility: [https://www.gatsbyjs.org/blog/tags/accessibility](https://www.gatsbyjs.org/blog/tags/accessibility)
+Check out our blog posts tagged with accessibility: [https://www.gatsbyjs.org/blog/tags/accessibility](/blog/tags/accessibility)