mirror of
https://github.com/kremalicious/portfolio.git
synced 2024-06-26 11:16:40 +02:00
code splitting & test tweaks
This commit is contained in:
parent
3f6adde51c
commit
61637f07fd
|
@ -77,5 +77,6 @@ module.exports = {
|
||||||
'gatsby-plugin-sitemap',
|
'gatsby-plugin-sitemap',
|
||||||
'gatsby-plugin-offline',
|
'gatsby-plugin-offline',
|
||||||
'gatsby-plugin-webpack-size'
|
'gatsby-plugin-webpack-size'
|
||||||
|
// 'gatsby-plugin-webpack-bundle-analyser-v2'
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
110
jest/__fixtures__/project.json
Normal file
110
jest/__fixtures__/project.json
Normal file
|
@ -0,0 +1,110 @@
|
||||||
|
{
|
||||||
|
"projectsYaml": {
|
||||||
|
"title": "Ocean Protocol",
|
||||||
|
"slug": "/oceanprotocol/",
|
||||||
|
"fields": {
|
||||||
|
"descriptionHtml": "<p>Since 2017 I'm leading the UI design & development of Ocean Protocol, iterating on a components-based UI design system spanning all of Ocean Protocol's web properties. Additionally, I conceptualize, execute and iterate on the creative and visual direction of the Ocean Protocol brand.</p>\n<p>Most web interfaces are single-page JavaScript applications built with React, pulling their data from JSON files and various micro services. All design & development is embedded in a continuous deployment process via GitHub & Travis.</p>\n<p>Initial website in collaboration with <a href=\"https://balance.io/\">Balance</a>. Key visuals in collaboration with <a href=\"https://twitter.com/wojciechhupert\">Wojciech Hupert</a>.</p>\n",
|
||||||
|
"excerpt": "Since 2017 I'm leading the UI design & development of Ocean Protocol, iterating on a components-based UI design system spanning all of Ocean Protocol's web properties. Additionally, I conceptualize, execute and iterate on the creative and visual direction of the Ocean Protocol brand.\nMost web interfaces are..."
|
||||||
|
},
|
||||||
|
"links": [
|
||||||
|
{
|
||||||
|
"title": "oceanprotocol.com",
|
||||||
|
"url": "https://oceanprotocol.com",
|
||||||
|
"icon": "Compass"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Styleguide",
|
||||||
|
"url": "https://oceanprotocol.com/art",
|
||||||
|
"icon": null
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "docs.oceanprotocol.com",
|
||||||
|
"url": "https://docs.oceanprotocol.com",
|
||||||
|
"icon": "Compass"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "commons.oceanprotocol.com",
|
||||||
|
"url": "https://commons.oceanprotocol.com",
|
||||||
|
"icon": "Compass"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "@oceanprotocol/art",
|
||||||
|
"url": "https://github.com/oceanprotocol/art",
|
||||||
|
"icon": "GitHub"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "@oceanprotocol/docs",
|
||||||
|
"url": "https://github.com/oceanprotocol/docs",
|
||||||
|
"icon": "GitHub"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "@oceanprotocol/commons",
|
||||||
|
"url": "https://github.com/oceanprotocol/commons",
|
||||||
|
"icon": "GitHub"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"techstack": [
|
||||||
|
"Sketch",
|
||||||
|
"Affinity Designer",
|
||||||
|
"React",
|
||||||
|
"Gatsby",
|
||||||
|
"HTML",
|
||||||
|
"SCSS",
|
||||||
|
"JavaScript",
|
||||||
|
"TypeScript",
|
||||||
|
"Travis",
|
||||||
|
"AWS S3",
|
||||||
|
"Cloudflare",
|
||||||
|
"Ethereum",
|
||||||
|
"Docker",
|
||||||
|
"Kubernetes",
|
||||||
|
"Cypress",
|
||||||
|
"IPFS"
|
||||||
|
],
|
||||||
|
"img": {
|
||||||
|
"childImageSharp": {
|
||||||
|
"twitterImage": {
|
||||||
|
"src": "/static/674f679841915ed59da7394e937f8f8f/c7e19/oceanprotocol-01.png"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"projectImages": {
|
||||||
|
"edges": [
|
||||||
|
{
|
||||||
|
"node": {
|
||||||
|
"id": "790521d3-05e7-5ab7-a499-86687637475b",
|
||||||
|
"fluid": {
|
||||||
|
"aspectRatio": 1.8,
|
||||||
|
"src": "/static/674f679841915ed59da7394e937f8f8f/af144/oceanprotocol-01.png",
|
||||||
|
"srcSet": "/static/674f679841915ed59da7394e937f8f8f/7c0ed/oceanprotocol-01.png 200w,\n/static/674f679841915ed59da7394e937f8f8f/647de/oceanprotocol-01.png 400w,\n/static/674f679841915ed59da7394e937f8f8f/af144/oceanprotocol-01.png 800w,\n/static/674f679841915ed59da7394e937f8f8f/ba299/oceanprotocol-01.png 1200w,\n/static/674f679841915ed59da7394e937f8f8f/9ecf6/oceanprotocol-01.png 1600w,\n/static/674f679841915ed59da7394e937f8f8f/7347c/oceanprotocol-01.png 2880w",
|
||||||
|
"srcWebp": "/static/674f679841915ed59da7394e937f8f8f/c6096/oceanprotocol-01.webp",
|
||||||
|
"srcSetWebp": "/static/674f679841915ed59da7394e937f8f8f/1932c/oceanprotocol-01.webp 200w,\n/static/674f679841915ed59da7394e937f8f8f/f4957/oceanprotocol-01.webp 400w,\n/static/674f679841915ed59da7394e937f8f8f/c6096/oceanprotocol-01.webp 800w,\n/static/674f679841915ed59da7394e937f8f8f/b6424/oceanprotocol-01.webp 1200w,\n/static/674f679841915ed59da7394e937f8f8f/7a72d/oceanprotocol-01.webp 1600w,\n/static/674f679841915ed59da7394e937f8f8f/b5fcc/oceanprotocol-01.webp 2880w",
|
||||||
|
"sizes": "(max-width: 800px) 100vw, 800px",
|
||||||
|
"originalImg": "/static/674f679841915ed59da7394e937f8f8f/7347c/oceanprotocol-01.png",
|
||||||
|
"originalName": "oceanprotocol-01.png",
|
||||||
|
"presentationWidth": 800,
|
||||||
|
"presentationHeight": 444
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"node": {
|
||||||
|
"id": "f49d52dd-60b9-5833-95ad-4428d4032e76",
|
||||||
|
"fluid": {
|
||||||
|
"aspectRatio": 1.8,
|
||||||
|
"src": "/static/32988a616cc5bc2354e02d16149dbcd6/af144/oceanprotocol-02.png",
|
||||||
|
"srcSet": "/static/32988a616cc5bc2354e02d16149dbcd6/7c0ed/oceanprotocol-02.png 200w,\n/static/32988a616cc5bc2354e02d16149dbcd6/647de/oceanprotocol-02.png 400w,\n/static/32988a616cc5bc2354e02d16149dbcd6/af144/oceanprotocol-02.png 800w,\n/static/32988a616cc5bc2354e02d16149dbcd6/ba299/oceanprotocol-02.png 1200w,\n/static/32988a616cc5bc2354e02d16149dbcd6/9ecf6/oceanprotocol-02.png 1600w,\n/static/32988a616cc5bc2354e02d16149dbcd6/7347c/oceanprotocol-02.png 2880w",
|
||||||
|
"srcWebp": "/static/32988a616cc5bc2354e02d16149dbcd6/c6096/oceanprotocol-02.webp",
|
||||||
|
"srcSetWebp": "/static/32988a616cc5bc2354e02d16149dbcd6/1932c/oceanprotocol-02.webp 200w,\n/static/32988a616cc5bc2354e02d16149dbcd6/f4957/oceanprotocol-02.webp 400w,\n/static/32988a616cc5bc2354e02d16149dbcd6/c6096/oceanprotocol-02.webp 800w,\n/static/32988a616cc5bc2354e02d16149dbcd6/b6424/oceanprotocol-02.webp 1200w,\n/static/32988a616cc5bc2354e02d16149dbcd6/7a72d/oceanprotocol-02.webp 1600w,\n/static/32988a616cc5bc2354e02d16149dbcd6/b5fcc/oceanprotocol-02.webp 2880w",
|
||||||
|
"sizes": "(max-width: 800px) 100vw, 800px",
|
||||||
|
"originalImg": "/static/32988a616cc5bc2354e02d16149dbcd6/7347c/oceanprotocol-02.png",
|
||||||
|
"originalName": "oceanprotocol-02.png",
|
||||||
|
"presentationWidth": 800,
|
||||||
|
"presentationHeight": 444
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
|
@ -4,6 +4,7 @@ import { StaticQuery, useStaticQuery } from 'gatsby'
|
||||||
|
|
||||||
import meta from './__fixtures__/meta.json'
|
import meta from './__fixtures__/meta.json'
|
||||||
import resume from './__fixtures__/resume.json'
|
import resume from './__fixtures__/resume.json'
|
||||||
|
import projects from './__fixtures__/projects.json'
|
||||||
|
|
||||||
beforeAll(() => {
|
beforeAll(() => {
|
||||||
const photoSrc = resume.contentJson.basics.picture.childImageSharp.fixed.src
|
const photoSrc = resume.contentJson.basics.picture.childImageSharp.fixed.src
|
||||||
|
@ -11,11 +12,10 @@ beforeAll(() => {
|
||||||
...meta,
|
...meta,
|
||||||
...resume,
|
...resume,
|
||||||
photoSrc,
|
photoSrc,
|
||||||
portfolioJson: { bugs: '' }
|
portfolioJson: { bugs: '' },
|
||||||
|
...projects
|
||||||
}
|
}
|
||||||
|
|
||||||
StaticQuery.mockImplementation(({ render }) => render({ ...dataMock }))
|
StaticQuery.mockImplementation(({ render }) => render({ ...dataMock }))
|
||||||
useStaticQuery.mockImplementation(() => {
|
useStaticQuery.mockImplementation(() => ({ ...dataMock }))
|
||||||
return { ...dataMock }
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
|
159
package-lock.json
generated
159
package-lock.json
generated
|
@ -3098,6 +3098,25 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"@loadable/component": {
|
||||||
|
"version": "5.10.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/@loadable/component/-/component-5.10.3.tgz",
|
||||||
|
"integrity": "sha512-/aSO+tXw4vFMwZ6fgLaNQgLuEa7bgTpoBE4PxNzf08/ewAjymrCS3J7v3SbGE7IjGmmKL6vVwkpb7S3cYrk+ag==",
|
||||||
|
"requires": {
|
||||||
|
"@babel/runtime": "^7.6.0",
|
||||||
|
"hoist-non-react-statics": "^3.3.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/runtime": {
|
||||||
|
"version": "7.7.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.7.4.tgz",
|
||||||
|
"integrity": "sha512-r24eVUUr0QqNZa+qrImUk8fn5SPhHq+IfYvIoIMg0do3GdK9sMdiLKP3GYVVaxpPKORgm8KRKaNTEhAjgIpLMw==",
|
||||||
|
"requires": {
|
||||||
|
"regenerator-runtime": "^0.13.2"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"@mapbox/hast-util-table-cell-style": {
|
"@mapbox/hast-util-table-cell-style": {
|
||||||
"version": "0.1.3",
|
"version": "0.1.3",
|
||||||
"resolved": "https://registry.npmjs.org/@mapbox/hast-util-table-cell-style/-/hast-util-table-cell-style-0.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/@mapbox/hast-util-table-cell-style/-/hast-util-table-cell-style-0.1.3.tgz",
|
||||||
|
@ -5118,6 +5137,18 @@
|
||||||
"resolved": "https://registry.npmjs.org/better-queue-memory/-/better-queue-memory-1.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/better-queue-memory/-/better-queue-memory-1.0.4.tgz",
|
||||||
"integrity": "sha512-SWg5wFIShYffEmJpI6LgbL8/3Dqhku7xI1oEiy6FroP9DbcZlG0ZDjxvPdP9t7hTGW40IpIcC6zVoGT1oxjOuA=="
|
"integrity": "sha512-SWg5wFIShYffEmJpI6LgbL8/3Dqhku7xI1oEiy6FroP9DbcZlG0ZDjxvPdP9t7hTGW40IpIcC6zVoGT1oxjOuA=="
|
||||||
},
|
},
|
||||||
|
"bfj": {
|
||||||
|
"version": "6.1.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/bfj/-/bfj-6.1.2.tgz",
|
||||||
|
"integrity": "sha512-BmBJa4Lip6BPRINSZ0BPEIfB1wUY/9rwbwvIHQA1KjX9om29B6id0wnWXq7m3bn5JrUVjeOTnVuhPT1FiHwPGw==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"bluebird": "^3.5.5",
|
||||||
|
"check-types": "^8.0.3",
|
||||||
|
"hoopy": "^0.1.4",
|
||||||
|
"tryer": "^1.0.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"big.js": {
|
"big.js": {
|
||||||
"version": "5.2.2",
|
"version": "5.2.2",
|
||||||
"resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
|
"resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
|
||||||
|
@ -6014,6 +6045,12 @@
|
||||||
"resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
|
||||||
"integrity": "sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc="
|
"integrity": "sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc="
|
||||||
},
|
},
|
||||||
|
"check-types": {
|
||||||
|
"version": "8.0.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz",
|
||||||
|
"integrity": "sha512-YpeKZngUmG65rLudJ4taU7VLkOCTMhNl/u4ctNC56LQS/zJTyNH0Lrtwm1tfTsbLlwvlfsA2d1c8vCf/Kh2KwQ==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"cheerio": {
|
"cheerio": {
|
||||||
"version": "1.0.0-rc.3",
|
"version": "1.0.0-rc.3",
|
||||||
"resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.3.tgz",
|
"resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.3.tgz",
|
||||||
|
@ -8368,6 +8405,12 @@
|
||||||
"resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
|
||||||
"integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
|
"integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
|
||||||
},
|
},
|
||||||
|
"ejs": {
|
||||||
|
"version": "2.7.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/ejs/-/ejs-2.7.4.tgz",
|
||||||
|
"integrity": "sha512-7vmuyh5+kuUyJKePhQfRQBhXV5Ce+RnaeeQArKu1EAMpL3WbgMt5WG6uQZpEVvYSSsxMXRKOewtDk9RaTKXRlA==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"electron-to-chromium": {
|
"electron-to-chromium": {
|
||||||
"version": "1.3.191",
|
"version": "1.3.191",
|
||||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.191.tgz",
|
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.191.tgz",
|
||||||
|
@ -11911,6 +11954,27 @@
|
||||||
"resolved": "https://registry.npmjs.org/gatsby-plugin-svgr/-/gatsby-plugin-svgr-2.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/gatsby-plugin-svgr/-/gatsby-plugin-svgr-2.0.2.tgz",
|
||||||
"integrity": "sha512-54REIMe79qFBAwpcnWHBkvEE9CKoEVkefF9rDXai0k642r91SZ4UeWFuAmsegPG+sPVub7tHfHu/2LVXK1I9kg=="
|
"integrity": "sha512-54REIMe79qFBAwpcnWHBkvEE9CKoEVkefF9rDXai0k642r91SZ4UeWFuAmsegPG+sPVub7tHfHu/2LVXK1I9kg=="
|
||||||
},
|
},
|
||||||
|
"gatsby-plugin-webpack-bundle-analyser-v2": {
|
||||||
|
"version": "1.1.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/gatsby-plugin-webpack-bundle-analyser-v2/-/gatsby-plugin-webpack-bundle-analyser-v2-1.1.8.tgz",
|
||||||
|
"integrity": "sha512-xVC6JYP1n1CaLml9VTBqdrmBEkCUgcAk5jW8hpJVH9gAn3dVQYyOgUxAavi88ZBLN7Ff6M7uZ80COMRWtdlpbA==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"@babel/runtime": "^7.7.2",
|
||||||
|
"webpack-bundle-analyzer": "^3.6.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/runtime": {
|
||||||
|
"version": "7.7.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.7.4.tgz",
|
||||||
|
"integrity": "sha512-r24eVUUr0QqNZa+qrImUk8fn5SPhHq+IfYvIoIMg0do3GdK9sMdiLKP3GYVVaxpPKORgm8KRKaNTEhAjgIpLMw==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"regenerator-runtime": "^0.13.2"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"gatsby-plugin-webpack-size": {
|
"gatsby-plugin-webpack-size": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/gatsby-plugin-webpack-size/-/gatsby-plugin-webpack-size-1.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/gatsby-plugin-webpack-size/-/gatsby-plugin-webpack-size-1.0.0.tgz",
|
||||||
|
@ -12951,6 +13015,12 @@
|
||||||
"parse-passwd": "^1.0.0"
|
"parse-passwd": "^1.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"hoopy": {
|
||||||
|
"version": "0.1.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz",
|
||||||
|
"integrity": "sha512-HRcs+2mr52W0K+x8RzcLzuPPmVIKMSv97RGHy0Ea9y/mpcaK+xTrjICA04KAHi4GRzxliNqNJEFYWHghy3rSfQ==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"hosted-git-info": {
|
"hosted-git-info": {
|
||||||
"version": "2.7.1",
|
"version": "2.7.1",
|
||||||
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.7.1.tgz",
|
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.7.1.tgz",
|
||||||
|
@ -17433,6 +17503,12 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"opener": {
|
||||||
|
"version": "1.5.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/opener/-/opener-1.5.1.tgz",
|
||||||
|
"integrity": "sha512-goYSy5c2UXE4Ra1xixabeVh1guIX/ZV/YokJksb6q2lubWu6UbvPQ20p542/sFIll1nl8JnCyK9oBaOcCWXwvA==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"opentracing": {
|
"opentracing": {
|
||||||
"version": "0.14.4",
|
"version": "0.14.4",
|
||||||
"resolved": "https://registry.npmjs.org/opentracing/-/opentracing-0.14.4.tgz",
|
"resolved": "https://registry.npmjs.org/opentracing/-/opentracing-0.14.4.tgz",
|
||||||
|
@ -25396,6 +25472,12 @@
|
||||||
"resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-2.2.1.tgz",
|
"resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-2.2.1.tgz",
|
||||||
"integrity": "sha512-0z3j8R7MCjy10kc/g+qg7Ln3alJTodw9aDuVWZa3uiWqfuBMKeAeP2ocWcxoyM3D73yz3Jt/Pu4qPr4wHSdB/Q=="
|
"integrity": "sha512-0z3j8R7MCjy10kc/g+qg7Ln3alJTodw9aDuVWZa3uiWqfuBMKeAeP2ocWcxoyM3D73yz3Jt/Pu4qPr4wHSdB/Q=="
|
||||||
},
|
},
|
||||||
|
"tryer": {
|
||||||
|
"version": "1.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/tryer/-/tryer-1.0.1.tgz",
|
||||||
|
"integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"ts-essentials": {
|
"ts-essentials": {
|
||||||
"version": "1.0.4",
|
"version": "1.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-1.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-1.0.4.tgz",
|
||||||
|
@ -26270,6 +26352,83 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"webpack-bundle-analyzer": {
|
||||||
|
"version": "3.6.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-3.6.0.tgz",
|
||||||
|
"integrity": "sha512-orUfvVYEfBMDXgEKAKVvab5iQ2wXneIEorGNsyuOyVYpjYrI7CUOhhXNDd3huMwQ3vNNWWlGP+hzflMFYNzi2g==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"acorn": "^6.0.7",
|
||||||
|
"acorn-walk": "^6.1.1",
|
||||||
|
"bfj": "^6.1.1",
|
||||||
|
"chalk": "^2.4.1",
|
||||||
|
"commander": "^2.18.0",
|
||||||
|
"ejs": "^2.6.1",
|
||||||
|
"express": "^4.16.3",
|
||||||
|
"filesize": "^3.6.1",
|
||||||
|
"gzip-size": "^5.0.0",
|
||||||
|
"lodash": "^4.17.15",
|
||||||
|
"mkdirp": "^0.5.1",
|
||||||
|
"opener": "^1.5.1",
|
||||||
|
"ws": "^6.0.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"acorn": {
|
||||||
|
"version": "6.3.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/acorn/-/acorn-6.3.0.tgz",
|
||||||
|
"integrity": "sha512-/czfa8BwS88b9gWQVhc8eknunSA2DoJpJyTQkhheIf5E48u1N0R4q/YxxsAeqRrmK9TQ/uYfgLDfZo91UlANIA==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"chalk": {
|
||||||
|
"version": "2.4.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
|
||||||
|
"integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"ansi-styles": "^3.2.1",
|
||||||
|
"escape-string-regexp": "^1.0.5",
|
||||||
|
"supports-color": "^5.3.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"filesize": {
|
||||||
|
"version": "3.6.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz",
|
||||||
|
"integrity": "sha512-7KjR1vv6qnicaPMi1iiTcI85CyYwRO/PSFCu6SvqL8jN2Wjt/NIYQTFtFs7fSDCYOstUkEWIQGFUg5YZQfjlcg==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"gzip-size": {
|
||||||
|
"version": "5.1.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz",
|
||||||
|
"integrity": "sha512-FNHi6mmoHvs1mxZAds4PpdCS6QG8B4C1krxJsMutgxl5t3+GlRTzzI3NEkifXx2pVsOvJdOGSmIgDhQ55FwdPA==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"duplexer": "^0.1.1",
|
||||||
|
"pify": "^4.0.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"lodash": {
|
||||||
|
"version": "4.17.15",
|
||||||
|
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
|
||||||
|
"integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"pify": {
|
||||||
|
"version": "4.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
|
||||||
|
"integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"ws": {
|
||||||
|
"version": "6.2.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/ws/-/ws-6.2.1.tgz",
|
||||||
|
"integrity": "sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"async-limiter": "~1.0.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"webpack-dev-middleware": {
|
"webpack-dev-middleware": {
|
||||||
"version": "3.7.2",
|
"version": "3.7.2",
|
||||||
"resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-3.7.2.tgz",
|
"resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-3.7.2.tgz",
|
||||||
|
|
|
@ -23,6 +23,7 @@
|
||||||
"lh": "lighthousebot --pwa=90 --perf=90 --a11y=90 --bp=90 --seo 90 --runner=wpt"
|
"lh": "lighthousebot --pwa=90 --perf=90 --a11y=90 --bp=90 --seo 90 --runner=wpt"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@loadable/component": "^5.10.3",
|
||||||
"axios": "^0.19.0",
|
"axios": "^0.19.0",
|
||||||
"file-saver": "^2.0.2",
|
"file-saver": "^2.0.2",
|
||||||
"gatsby": "^2.18.3",
|
"gatsby": "^2.18.3",
|
||||||
|
@ -76,6 +77,7 @@
|
||||||
"eslint-plugin-prettier": "^3.1.1",
|
"eslint-plugin-prettier": "^3.1.1",
|
||||||
"eslint-plugin-react": "^7.16.0",
|
"eslint-plugin-react": "^7.16.0",
|
||||||
"eslint-plugin-react-hooks": "^2.3.0",
|
"eslint-plugin-react-hooks": "^2.3.0",
|
||||||
|
"gatsby-plugin-webpack-bundle-analyser-v2": "^1.1.8",
|
||||||
"identity-obj-proxy": "^3.0.0",
|
"identity-obj-proxy": "^3.0.0",
|
||||||
"jest": "^24.9.0",
|
"jest": "^24.9.0",
|
||||||
"jest-canvas-mock": "^2.2.0",
|
"jest-canvas-mock": "^2.2.0",
|
||||||
|
|
|
@ -7,7 +7,7 @@ import { useResume } from '../../hooks/use-resume'
|
||||||
import styles from './Networks.module.scss'
|
import styles from './Networks.module.scss'
|
||||||
|
|
||||||
const linkClasses = key =>
|
const linkClasses = key =>
|
||||||
key === 'Email' ? `u-email ${styles.link}` : `u-url ${styles.link}`
|
key === 'Mail' ? `u-email ${styles.link}` : `u-url ${styles.link}`
|
||||||
|
|
||||||
const NetworkLink = ({ name, url }) => (
|
const NetworkLink = ({ name, url }) => (
|
||||||
<a
|
<a
|
||||||
|
|
|
@ -2,6 +2,7 @@ import React, { PureComponent } from 'react'
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
import { Link, graphql, StaticQuery } from 'gatsby'
|
import { Link, graphql, StaticQuery } from 'gatsby'
|
||||||
import Img from 'gatsby-image'
|
import Img from 'gatsby-image'
|
||||||
|
import shortid from 'shortid'
|
||||||
import styles from './ProjectNav.module.scss'
|
import styles from './ProjectNav.module.scss'
|
||||||
|
|
||||||
const query = graphql`
|
const query = graphql`
|
||||||
|
@ -24,6 +25,24 @@ const query = graphql`
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|
||||||
|
const Project = ({ node, refCurrentItem }) => (
|
||||||
|
<div className={styles.item} ref={refCurrentItem}>
|
||||||
|
<Link className={styles.link} to={node.slug}>
|
||||||
|
<Img
|
||||||
|
className={styles.image}
|
||||||
|
fluid={node.img.childImageSharp.fluid}
|
||||||
|
alt={node.title}
|
||||||
|
/>
|
||||||
|
<h1 className={styles.title}>{node.title}</h1>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
|
||||||
|
Project.propTypes = {
|
||||||
|
node: PropTypes.any.isRequired,
|
||||||
|
refCurrentItem: PropTypes.any
|
||||||
|
}
|
||||||
|
|
||||||
export default class ProjectNav extends PureComponent {
|
export default class ProjectNav extends PureComponent {
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
currentSlug: PropTypes.string.isRequired
|
currentSlug: PropTypes.string.isRequired
|
||||||
|
@ -48,32 +67,18 @@ export default class ProjectNav extends PureComponent {
|
||||||
const scrollContainer = this.scrollContainer.current
|
const scrollContainer = this.scrollContainer.current
|
||||||
const activeItem = this.currentItem.current
|
const activeItem = this.currentItem.current
|
||||||
const scrollRect = scrollContainer.getBoundingClientRect()
|
const scrollRect = scrollContainer.getBoundingClientRect()
|
||||||
const activeRect = activeItem.getBoundingClientRect()
|
const activeRect = activeItem && activeItem.getBoundingClientRect()
|
||||||
const scrollLeftPosition =
|
const scrollLeftPosition =
|
||||||
|
activeRect &&
|
||||||
activeRect.left -
|
activeRect.left -
|
||||||
scrollRect.left -
|
scrollRect.left -
|
||||||
scrollRect.width / 2 +
|
scrollRect.width / 2 +
|
||||||
activeRect.width / 2
|
activeRect.width / 2
|
||||||
|
|
||||||
scrollContainer.scrollLeft += this.state.scrollLeftPosition
|
scrollContainer.scrollLeft += this.state.scrollLeftPosition
|
||||||
this.setState({ scrollLeftPosition })
|
this.setState({ scrollLeftPosition })
|
||||||
}
|
}
|
||||||
|
|
||||||
Project({ node, refCurrentItem }) {
|
|
||||||
return (
|
|
||||||
<div className={styles.item} ref={refCurrentItem}>
|
|
||||||
<Link className={styles.link} to={node.slug}>
|
|
||||||
<Img
|
|
||||||
className={styles.image}
|
|
||||||
fluid={node.img.childImageSharp.fluid}
|
|
||||||
alt={node.title}
|
|
||||||
/>
|
|
||||||
<h1 className={styles.title}>{node.title}</h1>
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { currentSlug } = this.props
|
const { currentSlug } = this.props
|
||||||
return (
|
return (
|
||||||
|
@ -88,8 +93,8 @@ export default class ProjectNav extends PureComponent {
|
||||||
const isCurrent = node.slug === currentSlug
|
const isCurrent = node.slug === currentSlug
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<this.Project
|
<Project
|
||||||
key={node.slug}
|
key={shortid.generate()}
|
||||||
node={node}
|
node={node}
|
||||||
refCurrentItem={isCurrent ? this.currentItem : null}
|
refCurrentItem={isCurrent ? this.currentItem : null}
|
||||||
/>
|
/>
|
||||||
|
|
10
src/components/molecules/ProjectNav.test.jsx
Normal file
10
src/components/molecules/ProjectNav.test.jsx
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
import React from 'react'
|
||||||
|
import { render } from '@testing-library/react'
|
||||||
|
import ProjectNav from './ProjectNav'
|
||||||
|
|
||||||
|
describe('ProjectNav', () => {
|
||||||
|
it('renders correctly', () => {
|
||||||
|
const { container } = render(<ProjectNav currentSlug="oceanprotocol" />)
|
||||||
|
expect(container.firstChild).toBeInTheDocument()
|
||||||
|
})
|
||||||
|
})
|
|
@ -1,12 +1,14 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
import { graphql, useStaticQuery } from 'gatsby'
|
import { graphql, useStaticQuery } from 'gatsby'
|
||||||
import Vcard from '../atoms/Vcard'
|
import loadable from '@loadable/component'
|
||||||
import LogoUnit from '../molecules/LogoUnit'
|
import LogoUnit from '../molecules/LogoUnit'
|
||||||
import Networks from '../molecules/Networks'
|
import Networks from '../molecules/Networks'
|
||||||
import styles from './Footer.module.scss'
|
import styles from './Footer.module.scss'
|
||||||
import { useMeta } from '../../hooks/use-meta'
|
import { useMeta } from '../../hooks/use-meta'
|
||||||
|
|
||||||
|
const LazyVcard = loadable(() => import('../atoms/Vcard'))
|
||||||
|
|
||||||
const query = graphql`
|
const query = graphql`
|
||||||
query {
|
query {
|
||||||
# the package.json file
|
# the package.json file
|
||||||
|
@ -22,7 +24,7 @@ const FooterMarkup = ({ pkg, meta, year }) => (
|
||||||
<Networks small />
|
<Networks small />
|
||||||
|
|
||||||
<p className={styles.actions}>
|
<p className={styles.actions}>
|
||||||
<Vcard />
|
<LazyVcard />
|
||||||
<a className="u-key" href={meta.gpg}>
|
<a className="u-key" href={meta.gpg}>
|
||||||
PGP/GPG key
|
PGP/GPG key
|
||||||
</a>
|
</a>
|
||||||
|
|
16
src/templates/Project.test.jsx
Normal file
16
src/templates/Project.test.jsx
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
import React from 'react'
|
||||||
|
import { render } from '@testing-library/react'
|
||||||
|
import { createHistory, createMemorySource } from '@reach/router'
|
||||||
|
import Project from './Project'
|
||||||
|
import project from '../../jest/__fixtures__/project.json'
|
||||||
|
|
||||||
|
describe('Project', () => {
|
||||||
|
const history = createHistory(createMemorySource('/oceanprotocol'))
|
||||||
|
|
||||||
|
it('renders correctly from data file values', async () => {
|
||||||
|
const { container } = render(
|
||||||
|
<Project data={project} location={history.location} />
|
||||||
|
)
|
||||||
|
expect(container.firstChild).toBeInTheDocument()
|
||||||
|
})
|
||||||
|
})
|
Loading…
Reference in New Issue
Block a user