mirror of
https://github.com/BradNut/awesome-uses
synced 2025-09-08 17:40:31 +00:00
upgrade to Gatsby 4
This commit is contained in:
Wes Bos
parent
c4c8f32204
commit
4b10f62df7
5 changed files with 6811 additions and 21273 deletions
|
|
@ -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;
|
||||
|
|
|
|||
27981
package-lock.json
generated
27981
package-lock.json
generated
File diff suppressed because it is too large
Load diff
30
package.json
30
package.json
|
|
@ -21,26 +21,26 @@
|
|||
"@types/node": "^16.11.19",
|
||||
"@typescript-eslint/eslint-plugin": "^5.9.1",
|
||||
"@typescript-eslint/parser": "^5.9.1",
|
||||
"country-emoji": "^1.5.0",
|
||||
"country-emoji": "^1.5.6",
|
||||
"eslint-config-airbnb-typescript": "^16.1.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",
|
||||
"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": {
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
@ -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;
|
||||
|
|
|
|||
Loading…
Reference in a new issue