Merge pull request #1287 from wesbos/upgrade-dependencies

Upgrade dependencies

.node-version

@@ -0,0 +1 @@
+16.13.1

.npmrc

@@ -0,0 +1,3 @@
+fund=false
+audit=false
+legacy-peer-deps=true

gatsby-node.js

@@ -1,5 +1,5 @@
-import people from './src/data.js';
-import { tags, countries, devices, normalizeTag } from './src/util/stats';
+const { tags, countries, devices, normalizeTag } = require('./src/util/stats');
+const people = require('./src/data.js');
 
 function unique(arr) {
   return Array.from(new Set(arr));
@@ -14,12 +14,12 @@ function sourceNodes({ actions, createNodeId, createContentDigest }) {
   // Add People to the GraphQL API, we randomize the data on each build so no one gets their feelings hurt
   people
     .sort(() => Math.random() - 0.5)
-    .forEach(person => {
+    .forEach((person) => {
       const normalizedPerson = {
         ...person,
         // Clean out people that added basically the same tags twice
         tags: unique(
-          person.tags.map(tag => normalizedTagMap[normalizeTag(tag)] || tag)
+          person.tags.map((tag) => normalizedTagMap[normalizeTag(tag)] || tag)
         ),
       };
       const nodeMeta = {
@@ -38,7 +38,7 @@ function sourceNodes({ actions, createNodeId, createContentDigest }) {
     });
 
   // Add tags to GraphQL API
-  tags().forEach(tag => {
+  tags().forEach((tag) => {
     const nodeMeta = {
       id: createNodeId(`tag-${tag.name}`),
       parent: null,
@@ -55,7 +55,7 @@ function sourceNodes({ actions, createNodeId, createContentDigest }) {
   });
 
   // Add Countries to GraphQL API
-  countries().forEach(country => {
+  countries().forEach((country) => {
     const nodeMeta = {
       id: createNodeId(`country-${country.name}`),
       parent: null,
@@ -72,7 +72,7 @@ function sourceNodes({ actions, createNodeId, createContentDigest }) {
   });
 
   // Add Devices to GraphQL API
-  devices().forEach(device => {
+  devices().forEach((device) => {
     const nodeMeta = {
       id: createNodeId(`device-${device.name}`),
       parent: null,
@@ -88,4 +88,4 @@ function sourceNodes({ actions, createNodeId, createContentDigest }) {
   });
 }
 
-export { sourceNodes };
+exports.sourceNodes = sourceNodes;

package.json

@@ -15,49 +15,54 @@
     "@actions/core": "^1.2.1",
     "@actions/exec": "^1.0.3",
     "@actions/github": "^2.0.1",
-    "@hapi/joi": "^17.0.2",
-    "country-emoji": "^1.5.0",
-    "esm": "^3.2.25",
-    "gatsby": "^2.18.12",
-    "gatsby-image": "^2.2.34",
-    "gatsby-plugin-manifest": "^2.2.31",
-    "gatsby-plugin-offline": "^3.0.27",
-    "gatsby-plugin-react-helmet": "^3.1.16",
-    "gatsby-plugin-sharp": "^2.3.5",
-    "gatsby-plugin-styled-components": "^3.1.16",
+    "@babel/core": "^7.16.7",
+    "@babel/eslint-parser": "^7.16.5",
+    "@babel/preset-react": "^7.16.7",
+    "@types/node": "^16.11.19",
+    "@typescript-eslint/eslint-plugin": "^5.9.1",
+    "@typescript-eslint/parser": "^5.9.1",
+    "country-emoji": "^1.5.6",
+    "eslint-config-airbnb-typescript": "^16.1.0",
+    "gatsby": "^4.5.0",
+    "gatsby-image": "^3.11.0",
+    "gatsby-plugin-manifest": "^4.5.0",
+    "gatsby-plugin-offline": "^5.5.0",
+    "gatsby-plugin-react-helmet": "^5.5.0",
+    "gatsby-plugin-sharp": "^4.5.0",
+    "gatsby-plugin-styled-components": "^5.5.0",
     "gatsby-plugin-web-font-loader": "^1.0.4",
-    "gatsby-source-filesystem": "^2.1.40",
-    "gatsby-transformer-sharp": "^2.3.7",
+    "gatsby-source-filesystem": "^4.5.0",
+    "gatsby-transformer-sharp": "^4.5.0",
+    "joi": "^17.5.0",
     "normalize.css": "^8.0.1",
-    "prop-types": "^15.7.2",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0",
-    "react-helmet": "^5.2.1",
-    "styled-components": "5.0.0-rc.3"
+    "prop-types": "^15.8.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-helmet": "^6.1.0",
+    "styled-components": "5.3.3",
+    "typescript": "^4.5.4"
   },
   "scripts": {
-    "build": "npx --node-arg '-r esm' gatsby build",
-    "develop": "npx --node-arg '-r esm' gatsby develop",
+    "build": "gatsby build",
+    "develop": "gatsby develop",
     "start": "npm run develop",
-    "serve": "npx --node-arg '-r esm' gatsby serve",
+    "serve": "gatsby serve",
     "clean": "gatsby clean"
   },
   "devDependencies": {
-    "@architect/sandbox": "^1.6.0",
-    "babel-eslint": "^9.0.0",
-    "eslint": "^5.16.0",
-    "eslint-config-airbnb": "^17.1.1",
-    "eslint-config-prettier": "^4.3.0",
-    "eslint-config-wesbos": "0.0.19",
-    "eslint-plugin-html": "^5.0.5",
-    "eslint-plugin-import": "^2.19.1",
-    "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-prettier": "^3.1.2",
-    "eslint-plugin-react": "^7.17.0",
-    "eslint-plugin-react-hooks": "^1.7.0",
+    "eslint": "^8.6.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-config-wesbos": "^3.0.2",
+    "eslint-plugin-html": "^6.2.0",
+    "eslint-plugin-import": "^2.25.4",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.28.0",
+    "eslint-plugin-react-hooks": "^4.3.0",
     "husky": "^4.0.10",
     "lint-staged": "^9.5.0",
-    "prettier": "^1.19.1"
+    "prettier": "^2.5.1"
   },
   "husky": {
     "hooks": {

scripts/utils.js

@@ -1,7 +1,7 @@
 const exec = require('@actions/exec');
 const core = require('@actions/core');
 const github = require('@actions/github');
-const Joi = require('@hapi/joi');
+const Joi = require('joi');
 const http = require('http');
 const https = require('https');
 const flags = require('./flags.js');
@@ -13,8 +13,8 @@ async function getCurrentBranchName() {
   const options = {
     silent: true,
     listeners: {
-      stdout: data => (myOutput += data.toString()),
-      stderr: data => (myError += data.toString()),
+      stdout: (data) => (myOutput += data.toString()),
+      stderr: (data) => (myError += data.toString()),
     },
   };
 
@@ -23,7 +23,7 @@ async function getCurrentBranchName() {
 }
 
 /** on master branch will return an empty array */
-module.exports.getMasterData = async function() {
+module.exports.getMasterData = async function () {
   const options = { silent: true };
   const curentBranchName = await getCurrentBranchName();
   // when on a branch/PR different from master
@@ -63,11 +63,11 @@ module.exports.Schema = Joi.object({
   twitter: Joi.string().pattern(new RegExp(/^@?(\w){1,15}$/)),
   emoji: Joi.string().allow(''),
   computer: Joi.string().valid('apple', 'windows', 'linux', 'bsd'),
-  phone: Joi.string().valid('iphone', 'android', 'windowsphone','flipphone'),
+  phone: Joi.string().valid('iphone', 'android', 'windowsphone', 'flipphone'),
   tags: Joi.array().items(Joi.string()),
 });
 
-module.exports.getStatusCode = function(url) {
+module.exports.getStatusCode = function (url) {
   const client = url.startsWith('https') ? https : http;
   return new Promise((resolve, reject) => {
     const REQUEST_TIMEOUT = 10000;
@@ -78,17 +78,17 @@ module.exports.getStatusCode = function(url) {
     );
 
     client
-      .get(url, res => {
+      .get(url, (res) => {
         clearTimeout(timeoutId);
         resolve(res.statusCode);
       })
-      .on('error', err => reject(err));
+      .on('error', (err) => reject(err));
   });
 };
 
 // If there are errors, will fail the action & add a comment detailing the issues
 // If there are no errors, will leave an "all-clear" comment with relevant URLs (to ease a potential manual check)
-module.exports.communicateValidationOutcome = async function(
+module.exports.communicateValidationOutcome = async function (
   errors,
   failedUrls,
   changedData
@@ -99,8 +99,8 @@ module.exports.communicateValidationOutcome = async function(
 
     comment += [
       '🚨 We have detected the following issues, let us (contributors) know if you need support or clarifications:',
-      ...errors.map(e => `- ${e.message}`),
-      ...failedUrls.map(url => `- URL is invalid: ${url}`),
+      ...errors.map((e) => `- ${e.message}`),
+      ...failedUrls.map((url) => `- URL is invalid: ${url}`),
     ].join('\n');
   } else {
     comment += [

src/components/image.js

@@ -1,32 +0,0 @@
-import React from 'react';
-import { useStaticQuery, graphql } from 'gatsby';
-import Img from 'gatsby-image';
-
-/*
- * This component is built using `gatsby-image` to automatically serve optimized
- * images with lazy loading and reduced file sizes. The image is loaded using a
- * `useStaticQuery`, which allows us to load the image from directly within this
- * component, rather than having to pass the image data down from pages.
- *
- * For more information, see the docs:
- * - `gatsby-image`: https://gatsby.dev/gatsby-image
- * - `useStaticQuery`: https://www.gatsbyjs.org/docs/use-static-query/
- */
-
-const Image = () => {
-  const data = useStaticQuery(graphql`
-    query {
-      placeholderImage: file(relativePath: { eq: "gatsby-astronaut.png" }) {
-        childImageSharp {
-          fluid(maxWidth: 300) {
-            ...GatsbyImageSharpFluid
-          }
-        }
-      }
-    }
-  `);
-
-  return <Img fluid={data.placeholderImage.childImageSharp.fluid} />;
-};
-
-export default Image;

src/util/stats.js

@@ -1,8 +1,8 @@
-import { name } from 'country-emoji';
-import people from '../data.js';
+const { name } = require('country-emoji');
+const people = require('../data.js');
 
 function merge(prop) {
-  return function(acc, obj) {
+  return function (acc, obj) {
     // Remove duplicated values.
     const values = [...new Set(obj[prop])];
     return [...values, ...acc];
@@ -14,7 +14,7 @@ function countInstances(acc, tag) {
   return acc;
 }
 
-export function normalizeTag(tag) {
+function normalizeTag(tag) {
   return (
     tag
       // Common mispellings currently seen in the data
@@ -31,9 +31,9 @@ export function normalizeTag(tag) {
   );
 }
 
-export function countries() {
+function countries() {
   const data = people
-    .map(person => ({
+    .map((person) => ({
       name: name(person.country),
       emoji: person.country,
     }))
@@ -57,7 +57,7 @@ export function countries() {
   return sorted;
 }
 
-export function tags() {
+function tags() {
   const allTags = people.reduce(merge('tags'), []);
   const counts = allTags.reduce(countInstances, {});
   // sort and filter for any tags that only have 1
@@ -88,13 +88,18 @@ export function tags() {
   return [{ name: 'all', count: people.length }, ...normalizedTags];
 }
 
-export function devices() {
+function devices() {
   const all = [
-    ...people.map(person => person.computer),
-    ...people.map(person => person.phone),
+    ...people.map((person) => person.computer),
+    ...people.map((person) => person.phone),
   ];
 
   return Object.entries(all.reduce(countInstances, {}))
     .map(([device, count]) => ({ name: device, count }))
     .sort((a, b) => b.count - a.count);
 }
+
+exports.normalizeTag = normalizeTag;
+exports.countries = countries;
+exports.tags = tags;
+exports.devices = devices;