mirror of
https://github.com/kremalicious/portfolio.git
synced 2024-12-22 17:23:22 +01:00
migrate to new Giphy SDK
This commit is contained in:
parent
3f88de176a
commit
32bdbfffbc
GPG Key ID:
606EEEF3C479A91F
251
package-lock.json
generated
251
package-lock.json
generated
@ -9,6 +9,7 @@
|
||||
"version": "0.1.0",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@giphy/js-fetch-api": "^2.1.0",
|
||||
"@loadable/component": "^5.14.1",
|
||||
"axios": "^0.21.1",
|
||||
"file-saver": "^2.0.5",
|
||||
@ -28,7 +29,6 @@
|
||||
"gatsby-transformer-json": "^2.10.0",
|
||||
"gatsby-transformer-sharp": "^2.11.0",
|
||||
"gatsby-transformer-yaml": "^2.10.0",
|
||||
"giphy-js-sdk-core": "^1.0.6",
|
||||
"intersection-observer": "^0.12.0",
|
||||
"react": "^17.0.1",
|
||||
"react-dom": "^17.0.1",
|
||||
@ -1589,6 +1589,50 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/@giphy/js-fetch-api": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@giphy/js-fetch-api/-/js-fetch-api-2.1.0.tgz",
|
||||
"integrity": "sha512-I2xXeJrzScawxev1rSk4+zMkVGmjrKiGcY90otXh2Hb3zBjnsZZGanHFJuF3dyUnE2wYgmWa812z2u86i/cpGw==",
|
||||
"dependencies": {
|
||||
"@giphy/js-types": "^3.0.0",
|
||||
"@giphy/js-util": "^2.1.0",
|
||||
"qs": "^6.9.4"
|
||||
}
|
||||
},
|
||||
"node_modules/@giphy/js-fetch-api/node_modules/qs": {
|
||||
"version": "6.9.6",
|
||||
"resolved": "https://registry.npmjs.org/qs/-/qs-6.9.6.tgz",
|
||||
"integrity": "sha512-TIRk4aqYLNoJUbd+g2lEdz5kLWIuTMRagAXxl78Q0RiVjAOugHmeKNGdd3cwo/ktpf9aL9epCfFqWDEKysUlLQ==",
|
||||
"engines": {
|
||||
"node": ">=0.6"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/@giphy/js-types": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@giphy/js-types/-/js-types-3.0.0.tgz",
|
||||
"integrity": "sha512-o0e/0eyT7xxqU1el7rc5xL7K1ibWxiRSzqJcUDB9Zy/YGrAYx01YZNji84gNnR83w/rC3Zmw+TN3fm7WHA4dKA=="
|
||||
},
|
||||
"node_modules/@giphy/js-util": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@giphy/js-util/-/js-util-2.1.0.tgz",
|
||||
"integrity": "sha512-MY75RHk4rhSYqZ7y87RB/xhDeIHrzHsaeJSfpi7HALs5TZp4HTkAoO8Hh0KeCwVDK/9dP52AMqbjDgrIYp7xDw==",
|
||||
"dependencies": {
|
||||
"@giphy/js-types": "^3.0.0",
|
||||
"dompurify": "^2.2.2",
|
||||
"uuid": "^8.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@giphy/js-util/node_modules/uuid": {
|
||||
"version": "8.3.2",
|
||||
"resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
|
||||
"integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
|
||||
"bin": {
|
||||
"uuid": "dist/bin/uuid"
|
||||
}
|
||||
},
|
||||
"node_modules/@graphql-tools/batch-execute": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@graphql-tools/batch-execute/-/batch-execute-7.0.0.tgz",
|
||||
@ -4686,11 +4730,6 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/asap": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
|
||||
"integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
|
||||
},
|
||||
"node_modules/asn1": {
|
||||
"version": "0.2.4",
|
||||
"resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.4.tgz",
|
||||
@ -9350,6 +9389,11 @@
|
||||
"url": "https://github.com/fb55/domhandler?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/dompurify": {
|
||||
"version": "2.2.6",
|
||||
"resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.2.6.tgz",
|
||||
"integrity": "sha512-7b7ZArhhH0SP6W2R9cqK6RjaU82FZ2UPM7RO8qN1b1wyvC/NY1FNWcX1Pu00fFOAnzEORtwXe4bPaClg6pUybQ=="
|
||||
},
|
||||
"node_modules/domutils": {
|
||||
"version": "2.4.4",
|
||||
"resolved": "https://registry.npmjs.org/domutils/-/domutils-2.4.4.tgz",
|
||||
@ -9606,25 +9650,6 @@
|
||||
"node": ">= 0.8"
|
||||
}
|
||||
},
|
||||
"node_modules/encoding": {
|
||||
"version": "0.1.13",
|
||||
"resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz",
|
||||
"integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==",
|
||||
"dependencies": {
|
||||
"iconv-lite": "^0.6.2"
|
||||
}
|
||||
},
|
||||
"node_modules/encoding/node_modules/iconv-lite": {
|
||||
"version": "0.6.2",
|
||||
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.2.tgz",
|
||||
"integrity": "sha512-2y91h5OpQlolefMPmUlivelittSWy0rP+oYVpn6A7GwVHNE8AWzoYOBNmlwks3LobaJxgHCYZAnyNo2GgpNRNQ==",
|
||||
"dependencies": {
|
||||
"safer-buffer": ">= 2.1.2 < 3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/end-of-stream": {
|
||||
"version": "1.4.4",
|
||||
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
|
||||
@ -9887,11 +9912,6 @@
|
||||
"es6-symbol": "^3.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/es6-promise": {
|
||||
"version": "4.2.8",
|
||||
"resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.8.tgz",
|
||||
"integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w=="
|
||||
},
|
||||
"node_modules/es6-symbol": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.3.tgz",
|
||||
@ -14373,17 +14393,6 @@
|
||||
"omggif": "^1.0.10"
|
||||
}
|
||||
},
|
||||
"node_modules/giphy-js-sdk-core": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/giphy-js-sdk-core/-/giphy-js-sdk-core-1.0.6.tgz",
|
||||
"integrity": "sha512-WaOm2ZEMSyPzlM+XbiVSDPZiSNfNfCItIeLh9QNglqiSl5fqewjTl7TY9wJT41Q/ORyOekV5rJDe4EIkjLDLFw==",
|
||||
"dependencies": {
|
||||
"es6-promise": "^4.1.0",
|
||||
"isomorphic-fetch": "^2.2.1",
|
||||
"lodash": "^4.17.4",
|
||||
"promise": "^7.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/git-up": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/git-up/-/git-up-4.0.2.tgz",
|
||||
@ -16910,32 +16919,6 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/isomorphic-fetch": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
|
||||
"integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
|
||||
"dependencies": {
|
||||
"node-fetch": "^1.0.1",
|
||||
"whatwg-fetch": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/isomorphic-fetch/node_modules/is-stream": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
|
||||
"integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ=",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/isomorphic-fetch/node_modules/node-fetch": {
|
||||
"version": "1.7.3",
|
||||
"resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
|
||||
"integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
|
||||
"dependencies": {
|
||||
"encoding": "^0.1.11",
|
||||
"is-stream": "^1.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/isomorphic-form-data": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/isomorphic-form-data/-/isomorphic-form-data-2.0.0.tgz",
|
||||
@ -23517,14 +23500,6 @@
|
||||
"node": ">=0.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/promise": {
|
||||
"version": "7.3.1",
|
||||
"resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
|
||||
"integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
|
||||
"dependencies": {
|
||||
"asap": "~2.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/promise-inflight": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/promise-inflight/-/promise-inflight-1.0.1.tgz",
|
||||
@ -31674,11 +31649,6 @@
|
||||
"iconv-lite": "0.4.24"
|
||||
}
|
||||
},
|
||||
"node_modules/whatwg-fetch": {
|
||||
"version": "3.5.0",
|
||||
"resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.5.0.tgz",
|
||||
"integrity": "sha512-jXkLtsR42xhXg7akoDKvKWE40eJeI+2KZqcp2h3NsOrRnDvtWX36KcKl30dy+hxECivdk2BVUHVNrPtoMBUx6A=="
|
||||
},
|
||||
"node_modules/whatwg-mimetype": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz",
|
||||
@ -33787,6 +33757,45 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"@giphy/js-fetch-api": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@giphy/js-fetch-api/-/js-fetch-api-2.1.0.tgz",
|
||||
"integrity": "sha512-I2xXeJrzScawxev1rSk4+zMkVGmjrKiGcY90otXh2Hb3zBjnsZZGanHFJuF3dyUnE2wYgmWa812z2u86i/cpGw==",
|
||||
"requires": {
|
||||
"@giphy/js-types": "^3.0.0",
|
||||
"@giphy/js-util": "^2.1.0",
|
||||
"qs": "^6.9.4"
|
||||
},
|
||||
"dependencies": {
|
||||
"qs": {
|
||||
"version": "6.9.6",
|
||||
"resolved": "https://registry.npmjs.org/qs/-/qs-6.9.6.tgz",
|
||||
"integrity": "sha512-TIRk4aqYLNoJUbd+g2lEdz5kLWIuTMRagAXxl78Q0RiVjAOugHmeKNGdd3cwo/ktpf9aL9epCfFqWDEKysUlLQ=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@giphy/js-types": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@giphy/js-types/-/js-types-3.0.0.tgz",
|
||||
"integrity": "sha512-o0e/0eyT7xxqU1el7rc5xL7K1ibWxiRSzqJcUDB9Zy/YGrAYx01YZNji84gNnR83w/rC3Zmw+TN3fm7WHA4dKA=="
|
||||
},
|
||||
"@giphy/js-util": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@giphy/js-util/-/js-util-2.1.0.tgz",
|
||||
"integrity": "sha512-MY75RHk4rhSYqZ7y87RB/xhDeIHrzHsaeJSfpi7HALs5TZp4HTkAoO8Hh0KeCwVDK/9dP52AMqbjDgrIYp7xDw==",
|
||||
"requires": {
|
||||
"@giphy/js-types": "^3.0.0",
|
||||
"dompurify": "^2.2.2",
|
||||
"uuid": "^8.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"uuid": {
|
||||
"version": "8.3.2",
|
||||
"resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
|
||||
"integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@graphql-tools/batch-execute": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@graphql-tools/batch-execute/-/batch-execute-7.0.0.tgz",
|
||||
@ -36200,11 +36209,6 @@
|
||||
"integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=",
|
||||
"dev": true
|
||||
},
|
||||
"asap": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
|
||||
"integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
|
||||
},
|
||||
"asn1": {
|
||||
"version": "0.2.4",
|
||||
"resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.4.tgz",
|
||||
@ -39906,6 +39910,11 @@
|
||||
"domelementtype": "^2.1.0"
|
||||
}
|
||||
},
|
||||
"dompurify": {
|
||||
"version": "2.2.6",
|
||||
"resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.2.6.tgz",
|
||||
"integrity": "sha512-7b7ZArhhH0SP6W2R9cqK6RjaU82FZ2UPM7RO8qN1b1wyvC/NY1FNWcX1Pu00fFOAnzEORtwXe4bPaClg6pUybQ=="
|
||||
},
|
||||
"domutils": {
|
||||
"version": "2.4.4",
|
||||
"resolved": "https://registry.npmjs.org/domutils/-/domutils-2.4.4.tgz",
|
||||
@ -40112,24 +40121,6 @@
|
||||
"resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
|
||||
"integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k="
|
||||
},
|
||||
"encoding": {
|
||||
"version": "0.1.13",
|
||||
"resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz",
|
||||
"integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==",
|
||||
"requires": {
|
||||
"iconv-lite": "^0.6.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"iconv-lite": {
|
||||
"version": "0.6.2",
|
||||
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.2.tgz",
|
||||
"integrity": "sha512-2y91h5OpQlolefMPmUlivelittSWy0rP+oYVpn6A7GwVHNE8AWzoYOBNmlwks3LobaJxgHCYZAnyNo2GgpNRNQ==",
|
||||
"requires": {
|
||||
"safer-buffer": ">= 2.1.2 < 3.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"end-of-stream": {
|
||||
"version": "1.4.4",
|
||||
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
|
||||
@ -40360,11 +40351,6 @@
|
||||
"es6-symbol": "^3.1.1"
|
||||
}
|
||||
},
|
||||
"es6-promise": {
|
||||
"version": "4.2.8",
|
||||
"resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.8.tgz",
|
||||
"integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w=="
|
||||
},
|
||||
"es6-symbol": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.3.tgz",
|
||||
@ -43834,17 +43820,6 @@
|
||||
"omggif": "^1.0.10"
|
||||
}
|
||||
},
|
||||
"giphy-js-sdk-core": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/giphy-js-sdk-core/-/giphy-js-sdk-core-1.0.6.tgz",
|
||||
"integrity": "sha512-WaOm2ZEMSyPzlM+XbiVSDPZiSNfNfCItIeLh9QNglqiSl5fqewjTl7TY9wJT41Q/ORyOekV5rJDe4EIkjLDLFw==",
|
||||
"requires": {
|
||||
"es6-promise": "^4.1.0",
|
||||
"isomorphic-fetch": "^2.2.1",
|
||||
"lodash": "^4.17.4",
|
||||
"promise": "^7.1.1"
|
||||
}
|
||||
},
|
||||
"git-up": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/git-up/-/git-up-4.0.2.tgz",
|
||||
@ -45755,31 +45730,6 @@
|
||||
"resolved": "https://registry.npmjs.org/isobject/-/isobject-4.0.0.tgz",
|
||||
"integrity": "sha512-S/2fF5wH8SJA/kmwr6HYhK/RI/OkhD84k8ntalo0iJjZikgq1XFvR5M8NPT1x5F7fBwCG3qHfnzeP/Vh/ZxCUA=="
|
||||
},
|
||||
"isomorphic-fetch": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
|
||||
"integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
|
||||
"requires": {
|
||||
"node-fetch": "^1.0.1",
|
||||
"whatwg-fetch": ">=0.10.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"is-stream": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
|
||||
"integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
|
||||
},
|
||||
"node-fetch": {
|
||||
"version": "1.7.3",
|
||||
"resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
|
||||
"integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
|
||||
"requires": {
|
||||
"encoding": "^0.1.11",
|
||||
"is-stream": "^1.0.1"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"isomorphic-form-data": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/isomorphic-form-data/-/isomorphic-form-data-2.0.0.tgz",
|
||||
@ -51091,14 +51041,6 @@
|
||||
"resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
|
||||
"integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA=="
|
||||
},
|
||||
"promise": {
|
||||
"version": "7.3.1",
|
||||
"resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
|
||||
"integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
|
||||
"requires": {
|
||||
"asap": "~2.0.3"
|
||||
}
|
||||
},
|
||||
"promise-inflight": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/promise-inflight/-/promise-inflight-1.0.1.tgz",
|
||||
@ -57580,11 +57522,6 @@
|
||||
"iconv-lite": "0.4.24"
|
||||
}
|
||||
},
|
||||
"whatwg-fetch": {
|
||||
"version": "3.5.0",
|
||||
"resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.5.0.tgz",
|
||||
"integrity": "sha512-jXkLtsR42xhXg7akoDKvKWE40eJeI+2KZqcp2h3NsOrRnDvtWX36KcKl30dy+hxECivdk2BVUHVNrPtoMBUx6A=="
|
||||
},
|
||||
"whatwg-mimetype": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz",
|
||||
|
||||
@ -20,6 +20,7 @@
|
||||
"new": "babel-node ./scripts/new.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"@giphy/js-fetch-api": "^2.1.0",
|
||||
"@loadable/component": "^5.14.1",
|
||||
"axios": "^0.21.1",
|
||||
"file-saver": "^2.0.5",
|
||||
@ -39,7 +40,6 @@
|
||||
"gatsby-transformer-json": "^2.10.0",
|
||||
"gatsby-transformer-sharp": "^2.11.0",
|
||||
"gatsby-transformer-yaml": "^2.10.0",
|
||||
"giphy-js-sdk-core": "^1.0.6",
|
||||
"intersection-observer": "^0.12.0",
|
||||
"react": "^17.0.1",
|
||||
"react-dom": "^17.0.1",
|
||||
|
||||
@ -1,64 +1,55 @@
|
||||
import React, { Component } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import { Link } from 'gatsby'
|
||||
import giphyAPI from 'giphy-js-sdk-core'
|
||||
import { GiphyFetch } from '@giphy/js-fetch-api'
|
||||
import SEO from '../components/atoms/SEO'
|
||||
import Button from '../components/atoms/Button'
|
||||
import styles from './404.module.css'
|
||||
|
||||
// Famous last words:
|
||||
// "It's just the 404 page so why not expose the dev API key"
|
||||
const giphyClient = giphyAPI('LfXRwufRyt6PK414G2kKJBv3L8NdnxyR')
|
||||
const tag = 'fail-cat'
|
||||
const giphyClient = new GiphyFetch('LfXRwufRyt6PK414G2kKJBv3L8NdnxyR')
|
||||
const tag = 'cat'
|
||||
|
||||
export default class NotFound extends Component {
|
||||
state = { gif: '' }
|
||||
export default function NotFound() {
|
||||
const [gif, setGif] = useState('')
|
||||
|
||||
static propTypes = {
|
||||
location: PropTypes.object
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.getRandomGif()
|
||||
}
|
||||
|
||||
async getRandomGif() {
|
||||
async function getRandomGif() {
|
||||
try {
|
||||
let response = await giphyClient.random('gifs', { tag })
|
||||
let response = await giphyClient.random({ tag })
|
||||
const gif = response.data.images.original.mp4
|
||||
this.setState({ gif })
|
||||
setGif(gif)
|
||||
} catch (error) {
|
||||
return error
|
||||
console.error(error.message)
|
||||
}
|
||||
}
|
||||
|
||||
handleClick = (e) => {
|
||||
async function handleClick(e) {
|
||||
e.preventDefault()
|
||||
this.getRandomGif()
|
||||
await getRandomGif()
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
<SEO />
|
||||
useEffect(() => {
|
||||
getRandomGif()
|
||||
}, [])
|
||||
|
||||
<article className={styles.content}>
|
||||
<h1>Shenanigans, page not found.</h1>
|
||||
<p>
|
||||
You might want to check the url, or{' '}
|
||||
<Link to={'/'}>go back to the homepage</Link>. Or just check out
|
||||
some {tag} gifs, entirely your choice.
|
||||
</p>
|
||||
return (
|
||||
<>
|
||||
<SEO />
|
||||
|
||||
<video className="gif" src={this.state.gif} autoPlay loop />
|
||||
<article className={styles.content}>
|
||||
<h1>Shenanigans, page not found.</h1>
|
||||
<p>
|
||||
You might want to check the url, or{' '}
|
||||
<Link to={'/'}>go back to the homepage</Link>. Or just check out some{' '}
|
||||
{tag} gifs, entirely your choice.
|
||||
</p>
|
||||
|
||||
<div>
|
||||
<Button
|
||||
onClick={this.handleClick}
|
||||
>{`Get another '${tag}' gif`}</Button>
|
||||
</div>
|
||||
</article>
|
||||
</>
|
||||
)
|
||||
}
|
||||
<video className="gif" src={gif} autoPlay loop />
|
||||
|
||||
<div>
|
||||
<Button onClick={handleClick}>{`Get another '${tag}' gif`}</Button>
|
||||
</div>
|
||||
</article>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user