fix cards
This commit is contained in:
VITALY-VORON
parent
7d7658d38c
commit
88067edac3
153
.gitignore
vendored
153
.gitignore
vendored
@ -1,146 +1,23 @@
|
|||||||
# ---> VisualStudioCode
|
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||||
.vscode/*
|
|
||||||
!.vscode/settings.json
|
|
||||||
!.vscode/tasks.json
|
|
||||||
!.vscode/launch.json
|
|
||||||
!.vscode/extensions.json
|
|
||||||
!.vscode/*.code-snippets
|
|
||||||
|
|
||||||
# Local History for Visual Studio Code
|
# dependencies
|
||||||
.history/
|
/node_modules
|
||||||
|
/.pnp
|
||||||
|
.pnp.js
|
||||||
|
|
||||||
# Built Visual Studio Code Extensions
|
# testing
|
||||||
*.vsix
|
/coverage
|
||||||
|
|
||||||
# ---> Node
|
# production
|
||||||
# Logs
|
/build
|
||||||
logs
|
|
||||||
*.log
|
|
||||||
npm-debug.log*
|
|
||||||
yarn-debug.log*
|
|
||||||
yarn-error.log*
|
|
||||||
lerna-debug.log*
|
|
||||||
.pnpm-debug.log*
|
|
||||||
|
|
||||||
# Diagnostic reports (https://nodejs.org/api/report.html)
|
# misc
|
||||||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
.DS_Store
|
||||||
|
.env.local
|
||||||
# Runtime data
|
|
||||||
pids
|
|
||||||
*.pid
|
|
||||||
*.seed
|
|
||||||
*.pid.lock
|
|
||||||
|
|
||||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
|
||||||
lib-cov
|
|
||||||
|
|
||||||
# Coverage directory used by tools like istanbul
|
|
||||||
coverage
|
|
||||||
*.lcov
|
|
||||||
|
|
||||||
# nyc test coverage
|
|
||||||
.nyc_output
|
|
||||||
|
|
||||||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
|
||||||
.grunt
|
|
||||||
|
|
||||||
# Bower dependency directory (https://bower.io/)
|
|
||||||
bower_components
|
|
||||||
|
|
||||||
# node-waf configuration
|
|
||||||
.lock-wscript
|
|
||||||
|
|
||||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
|
||||||
build/Release
|
|
||||||
|
|
||||||
# Dependency directories
|
|
||||||
node_modules/
|
|
||||||
jspm_packages/
|
|
||||||
|
|
||||||
# Snowpack dependency directory (https://snowpack.dev/)
|
|
||||||
web_modules/
|
|
||||||
|
|
||||||
# TypeScript cache
|
|
||||||
*.tsbuildinfo
|
|
||||||
|
|
||||||
# Optional npm cache directory
|
|
||||||
.npm
|
|
||||||
|
|
||||||
# Optional eslint cache
|
|
||||||
.eslintcache
|
|
||||||
|
|
||||||
# Optional stylelint cache
|
|
||||||
.stylelintcache
|
|
||||||
|
|
||||||
# Microbundle cache
|
|
||||||
.rpt2_cache/
|
|
||||||
.rts2_cache_cjs/
|
|
||||||
.rts2_cache_es/
|
|
||||||
.rts2_cache_umd/
|
|
||||||
|
|
||||||
# Optional REPL history
|
|
||||||
.node_repl_history
|
|
||||||
|
|
||||||
# Output of 'npm pack'
|
|
||||||
*.tgz
|
|
||||||
|
|
||||||
# Yarn Integrity file
|
|
||||||
.yarn-integrity
|
|
||||||
|
|
||||||
# dotenv environment variable files
|
|
||||||
.env
|
|
||||||
.env.development.local
|
.env.development.local
|
||||||
.env.test.local
|
.env.test.local
|
||||||
.env.production.local
|
.env.production.local
|
||||||
.env.local
|
|
||||||
|
|
||||||
# parcel-bundler cache (https://parceljs.org/)
|
|
||||||
.cache
|
|
||||||
.parcel-cache
|
|
||||||
|
|
||||||
# Next.js build output
|
|
||||||
.next
|
|
||||||
out
|
|
||||||
|
|
||||||
# Nuxt.js build / generate output
|
|
||||||
.nuxt
|
|
||||||
dist
|
|
||||||
|
|
||||||
# Gatsby files
|
|
||||||
.cache/
|
|
||||||
# Comment in the public line in if your project uses Gatsby and not Next.js
|
|
||||||
# https://nextjs.org/blog/next-9-1#public-directory-support
|
|
||||||
# public
|
|
||||||
|
|
||||||
# vuepress build output
|
|
||||||
.vuepress/dist
|
|
||||||
|
|
||||||
# vuepress v2.x temp and cache directory
|
|
||||||
.temp
|
|
||||||
.cache
|
|
||||||
|
|
||||||
# Docusaurus cache and generated files
|
|
||||||
.docusaurus
|
|
||||||
|
|
||||||
# Serverless directories
|
|
||||||
.serverless/
|
|
||||||
|
|
||||||
# FuseBox cache
|
|
||||||
.fusebox/
|
|
||||||
|
|
||||||
# DynamoDB Local files
|
|
||||||
.dynamodb/
|
|
||||||
|
|
||||||
# TernJS port file
|
|
||||||
.tern-port
|
|
||||||
|
|
||||||
# Stores VSCode versions used for testing VSCode extensions
|
|
||||||
.vscode-test
|
|
||||||
|
|
||||||
# yarn v2
|
|
||||||
.yarn/cache
|
|
||||||
.yarn/unplugged
|
|
||||||
.yarn/build-state.yml
|
|
||||||
.yarn/install-state.gz
|
|
||||||
.pnp.*
|
|
||||||
|
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
|||||||
172
package-lock.json
generated
172
package-lock.json
generated
@ -12,9 +12,11 @@
|
|||||||
"@testing-library/jest-dom": "^5.17.0",
|
"@testing-library/jest-dom": "^5.17.0",
|
||||||
"@testing-library/react": "^13.4.0",
|
"@testing-library/react": "^13.4.0",
|
||||||
"@testing-library/user-event": "^13.5.0",
|
"@testing-library/user-event": "^13.5.0",
|
||||||
|
"framer": "^2.3.0",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"react-scripts": "5.0.1",
|
"react-scripts": "5.0.1",
|
||||||
|
"react-swipeable": "^7.0.1",
|
||||||
"react-tinder-card": "^1.6.2",
|
"react-tinder-card": "^1.6.2",
|
||||||
"web-vitals": "^2.1.4",
|
"web-vitals": "^2.1.4",
|
||||||
"workbox-background-sync": "^6.6.0",
|
"workbox-background-sync": "^6.6.0",
|
||||||
@ -2279,6 +2281,23 @@
|
|||||||
"postcss-selector-parser": "^6.0.10"
|
"postcss-selector-parser": "^6.0.10"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/@emotion/is-prop-valid": {
|
||||||
|
"version": "0.8.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
|
||||||
|
"integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
|
||||||
|
"optional": true,
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@emotion/memoize": "0.7.4"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@emotion/memoize": {
|
||||||
|
"version": "0.7.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
|
||||||
|
"integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==",
|
||||||
|
"optional": true,
|
||||||
|
"peer": true
|
||||||
|
},
|
||||||
"node_modules/@eslint-community/eslint-utils": {
|
"node_modules/@eslint-community/eslint-utils": {
|
||||||
"version": "4.4.0",
|
"version": "4.4.0",
|
||||||
"resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
|
"resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
|
||||||
@ -3136,11 +3155,80 @@
|
|||||||
"@jridgewell/sourcemap-codec": "^1.4.14"
|
"@jridgewell/sourcemap-codec": "^1.4.14"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/@juggle/resize-observer": {
|
||||||
|
"version": "3.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/@juggle/resize-observer/-/resize-observer-3.4.0.tgz",
|
||||||
|
"integrity": "sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA=="
|
||||||
|
},
|
||||||
"node_modules/@leichtgewicht/ip-codec": {
|
"node_modules/@leichtgewicht/ip-codec": {
|
||||||
"version": "2.0.4",
|
"version": "2.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz",
|
||||||
"integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A=="
|
"integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A=="
|
||||||
},
|
},
|
||||||
|
"node_modules/@motionone/animation": {
|
||||||
|
"version": "10.15.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@motionone/animation/-/animation-10.15.1.tgz",
|
||||||
|
"integrity": "sha512-mZcJxLjHor+bhcPuIFErMDNyrdb2vJur8lSfMCsuCB4UyV8ILZLvK+t+pg56erv8ud9xQGK/1OGPt10agPrCyQ==",
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@motionone/easing": "^10.15.1",
|
||||||
|
"@motionone/types": "^10.15.1",
|
||||||
|
"@motionone/utils": "^10.15.1",
|
||||||
|
"tslib": "^2.3.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@motionone/dom": {
|
||||||
|
"version": "10.16.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/@motionone/dom/-/dom-10.16.2.tgz",
|
||||||
|
"integrity": "sha512-bnuHdNbge1FutZXv+k7xub9oPWcF0hsu8y1HTH/qg6av58YI0VufZ3ngfC7p2xhMJMnoh0LXFma2EGTgPeCkeg==",
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@motionone/animation": "^10.15.1",
|
||||||
|
"@motionone/generators": "^10.15.1",
|
||||||
|
"@motionone/types": "^10.15.1",
|
||||||
|
"@motionone/utils": "^10.15.1",
|
||||||
|
"hey-listen": "^1.0.8",
|
||||||
|
"tslib": "^2.3.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@motionone/easing": {
|
||||||
|
"version": "10.15.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@motionone/easing/-/easing-10.15.1.tgz",
|
||||||
|
"integrity": "sha512-6hIHBSV+ZVehf9dcKZLT7p5PEKHGhDwky2k8RKkmOvUoYP3S+dXsKupyZpqx5apjd9f+php4vXk4LuS+ADsrWw==",
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@motionone/utils": "^10.15.1",
|
||||||
|
"tslib": "^2.3.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@motionone/generators": {
|
||||||
|
"version": "10.15.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@motionone/generators/-/generators-10.15.1.tgz",
|
||||||
|
"integrity": "sha512-67HLsvHJbw6cIbLA/o+gsm7h+6D4Sn7AUrB/GPxvujse1cGZ38F5H7DzoH7PhX+sjvtDnt2IhFYF2Zp1QTMKWQ==",
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@motionone/types": "^10.15.1",
|
||||||
|
"@motionone/utils": "^10.15.1",
|
||||||
|
"tslib": "^2.3.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@motionone/types": {
|
||||||
|
"version": "10.15.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@motionone/types/-/types-10.15.1.tgz",
|
||||||
|
"integrity": "sha512-iIUd/EgUsRZGrvW0jqdst8st7zKTzS9EsKkP+6c6n4MPZoQHwiHuVtTQLD6Kp0bsBLhNzKIBlHXponn/SDT4hA==",
|
||||||
|
"peer": true
|
||||||
|
},
|
||||||
|
"node_modules/@motionone/utils": {
|
||||||
|
"version": "10.15.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/@motionone/utils/-/utils-10.15.1.tgz",
|
||||||
|
"integrity": "sha512-p0YncgU+iklvYr/Dq4NobTRdAPv9PveRDUXabPEeOjBLSO/1FNB2phNTZxOxpi1/GZwYpAoECEa0Wam+nsmhSw==",
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@motionone/types": "^10.15.1",
|
||||||
|
"hey-listen": "^1.0.8",
|
||||||
|
"tslib": "^2.3.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/@nicolo-ribaudo/eslint-scope-5-internals": {
|
"node_modules/@nicolo-ribaudo/eslint-scope-5-internals": {
|
||||||
"version": "5.1.1-v1",
|
"version": "5.1.1-v1",
|
||||||
"resolved": "https://registry.npmjs.org/@nicolo-ribaudo/eslint-scope-5-internals/-/eslint-scope-5-internals-5.1.1-v1.tgz",
|
"resolved": "https://registry.npmjs.org/@nicolo-ribaudo/eslint-scope-5-internals/-/eslint-scope-5-internals-5.1.1-v1.tgz",
|
||||||
@ -8385,6 +8473,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/fontfaceobserver": {
|
||||||
|
"version": "2.3.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/fontfaceobserver/-/fontfaceobserver-2.3.0.tgz",
|
||||||
|
"integrity": "sha512-6FPvD/IVyT4ZlNe7Wcn5Fb/4ChigpucKYSvD6a+0iMoLn2inpo711eyIcKjmDtE5XNcgAkSH9uN/nfAeZzHEfg=="
|
||||||
|
},
|
||||||
"node_modules/for-each": {
|
"node_modules/for-each": {
|
||||||
"version": "0.3.3",
|
"version": "0.3.3",
|
||||||
"resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
|
"resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
|
||||||
@ -8582,6 +8675,53 @@
|
|||||||
"url": "https://www.patreon.com/infusion"
|
"url": "https://www.patreon.com/infusion"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/framer": {
|
||||||
|
"version": "2.3.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/framer/-/framer-2.3.0.tgz",
|
||||||
|
"integrity": "sha512-sVAwMEO3LEfHElJOueRjnlBEYN3X8ztbXwZ22RvBHUftOdDpBkrJfISdAds87O8FEWsn5T7Dp3sLfmrBKXXIaQ==",
|
||||||
|
"hasInstallScript": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@juggle/resize-observer": "^3.3.1",
|
||||||
|
"eventemitter3": "^3.1.0",
|
||||||
|
"fontfaceobserver": "^2.1.0",
|
||||||
|
"hoist-non-react-statics": "^3.3.2",
|
||||||
|
"hsluv": "^0.0.3"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"framer-motion": "^7.6.12",
|
||||||
|
"react": "^18.2.0",
|
||||||
|
"react-dom": "^18.2.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/framer-motion": {
|
||||||
|
"version": "7.10.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-7.10.3.tgz",
|
||||||
|
"integrity": "sha512-k2ccYeZNSpPg//HTaqrU+4pRq9f9ZpaaN7rr0+Rx5zA4wZLbk547wtDzge2db1sB+1mnJ6r59P4xb+aEIi/W+w==",
|
||||||
|
"peer": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@motionone/dom": "^10.15.3",
|
||||||
|
"hey-listen": "^1.0.8",
|
||||||
|
"tslib": "2.4.0"
|
||||||
|
},
|
||||||
|
"optionalDependencies": {
|
||||||
|
"@emotion/is-prop-valid": "^0.8.2"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "^18.0.0",
|
||||||
|
"react-dom": "^18.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/framer-motion/node_modules/tslib": {
|
||||||
|
"version": "2.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
|
||||||
|
"integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==",
|
||||||
|
"peer": true
|
||||||
|
},
|
||||||
|
"node_modules/framer/node_modules/eventemitter3": {
|
||||||
|
"version": "3.1.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-3.1.2.tgz",
|
||||||
|
"integrity": "sha512-tvtQIeLVHjDkJYnzf2dgVMxfuSGJeM/7UCG17TT4EumTfNtF+0nebF/4zWOIkCreAbtNqhGEboB6BWrwqNaw4Q=="
|
||||||
|
},
|
||||||
"node_modules/fresh": {
|
"node_modules/fresh": {
|
||||||
"version": "0.5.2",
|
"version": "0.5.2",
|
||||||
"resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
|
"resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
|
||||||
@ -8963,6 +9103,25 @@
|
|||||||
"he": "bin/he"
|
"he": "bin/he"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/hey-listen": {
|
||||||
|
"version": "1.0.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/hey-listen/-/hey-listen-1.0.8.tgz",
|
||||||
|
"integrity": "sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q==",
|
||||||
|
"peer": true
|
||||||
|
},
|
||||||
|
"node_modules/hoist-non-react-statics": {
|
||||||
|
"version": "3.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
|
||||||
|
"integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
|
||||||
|
"dependencies": {
|
||||||
|
"react-is": "^16.7.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/hoist-non-react-statics/node_modules/react-is": {
|
||||||
|
"version": "16.13.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||||
|
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
|
||||||
|
},
|
||||||
"node_modules/hoopy": {
|
"node_modules/hoopy": {
|
||||||
"version": "0.1.4",
|
"version": "0.1.4",
|
||||||
"resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz",
|
"resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz",
|
||||||
@ -9014,6 +9173,11 @@
|
|||||||
"safe-buffer": "~5.1.0"
|
"safe-buffer": "~5.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/hsluv": {
|
||||||
|
"version": "0.0.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/hsluv/-/hsluv-0.0.3.tgz",
|
||||||
|
"integrity": "sha512-08iL2VyCRbkQKBySkSh6m8zMUa3sADAxGVWs3Z1aPcUkTJeK0ETG4Fc27tEmQBGUAXZjIsXOZqBvacuVNSC/fQ=="
|
||||||
|
},
|
||||||
"node_modules/html-encoding-sniffer": {
|
"node_modules/html-encoding-sniffer": {
|
||||||
"version": "2.0.1",
|
"version": "2.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-2.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-2.0.1.tgz",
|
||||||
@ -14787,6 +14951,14 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/react-swipeable": {
|
||||||
|
"version": "7.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-swipeable/-/react-swipeable-7.0.1.tgz",
|
||||||
|
"integrity": "sha512-RKB17JdQzvECfnVj9yDZsiYn3vH0eyva/ZbrCZXZR0qp66PBRhtg4F9yJcJTWYT5Adadi+x4NoG53BxKHwIYLQ==",
|
||||||
|
"peerDependencies": {
|
||||||
|
"react": "^16.8.3 || ^17 || ^18"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/react-tinder-card": {
|
"node_modules/react-tinder-card": {
|
||||||
"version": "1.6.2",
|
"version": "1.6.2",
|
||||||
"resolved": "https://registry.npmjs.org/react-tinder-card/-/react-tinder-card-1.6.2.tgz",
|
"resolved": "https://registry.npmjs.org/react-tinder-card/-/react-tinder-card-1.6.2.tgz",
|
||||||
|
|||||||
10
package.json
10
package.json
@ -7,9 +7,11 @@
|
|||||||
"@testing-library/jest-dom": "^5.17.0",
|
"@testing-library/jest-dom": "^5.17.0",
|
||||||
"@testing-library/react": "^13.4.0",
|
"@testing-library/react": "^13.4.0",
|
||||||
"@testing-library/user-event": "^13.5.0",
|
"@testing-library/user-event": "^13.5.0",
|
||||||
|
"framer": "^2.3.0",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"react-scripts": "5.0.1",
|
"react-scripts": "5.0.1",
|
||||||
|
"react-swipeable": "^7.0.1",
|
||||||
"react-tinder-card": "^1.6.2",
|
"react-tinder-card": "^1.6.2",
|
||||||
"web-vitals": "^2.1.4",
|
"web-vitals": "^2.1.4",
|
||||||
"workbox-background-sync": "^6.6.0",
|
"workbox-background-sync": "^6.6.0",
|
||||||
@ -48,5 +50,11 @@
|
|||||||
"last 1 firefox version",
|
"last 1 firefox version",
|
||||||
"last 1 safari version"
|
"last 1 safari version"
|
||||||
]
|
]
|
||||||
}
|
},
|
||||||
|
"main": "index.js",
|
||||||
|
"devDependencies": {},
|
||||||
|
"keywords": [],
|
||||||
|
"author": "",
|
||||||
|
"license": "ISC",
|
||||||
|
"description": ""
|
||||||
}
|
}
|
||||||
|
|||||||
23
src/App.js
23
src/App.js
@ -1,43 +1,24 @@
|
|||||||
import React, {useState, useEffect} from 'react';
|
import React, {useState} from 'react';
|
||||||
import './App.css';
|
|
||||||
import Start from './components/Start/Start';
|
import Start from './components/Start/Start';
|
||||||
import Second from './components/Second/Second';
|
import Second from './components/Second/Second';
|
||||||
import Tinder from './components/Tinder/Tinder';
|
import Tinder from './components/Tinder/Tinder';
|
||||||
import Map from './components/Map/Map';
|
import Map from './components/Map/Map';
|
||||||
import axios from 'axios';
|
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
|
|
||||||
const options = {
|
|
||||||
method: 'GET',
|
|
||||||
url: 'https://easytravel.zetcraft.ru/v1/GetAllCards'
|
|
||||||
};
|
|
||||||
|
|
||||||
const [buttonValue, setButtonValue] = useState("");
|
const [buttonValue, setButtonValue] = useState("");
|
||||||
const [fetchData, setFetchData] = useState([]);
|
|
||||||
|
|
||||||
const handleButtonValue = (value) => {
|
const handleButtonValue = (value) => {
|
||||||
setButtonValue(value);
|
setButtonValue(value);
|
||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
axios.request(options).then(function (response) {
|
|
||||||
console.log(response.data);
|
|
||||||
fetchData.push(response.data);
|
|
||||||
console.log(fetchData);
|
|
||||||
}).catch(function (error) {
|
|
||||||
console.error(error);
|
|
||||||
return null;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
let content = null;
|
let content = null;
|
||||||
switch (buttonValue) {
|
switch (buttonValue) {
|
||||||
case '/':
|
case '/':
|
||||||
content = <Second getValue={handleButtonValue}/>
|
content = <Second getValue={handleButtonValue}/>
|
||||||
break;
|
break;
|
||||||
case '/tinder':
|
case '/tinder':
|
||||||
content = <Tinder getValue={handleButtonValue} cardData={fetchData}/>
|
content = <Tinder getValue={handleButtonValue}/>
|
||||||
break;
|
break;
|
||||||
case '/map':
|
case '/map':
|
||||||
content = <Map/>
|
content = <Map/>
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
const Map = () => {
|
const Map = () => {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
|
<span>Переход готов</span>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
122
src/components/Start/kek.css
Normal file
122
src/components/Start/kek.css
Normal file
@ -0,0 +1,122 @@
|
|||||||
|
@import url(https://fonts.googleapis.com/css?family=Pathway+Gothic+One);
|
||||||
|
|
||||||
|
@-webkit-keyframes rotate-right {
|
||||||
|
from {
|
||||||
|
-webkit-transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
-webkit-transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes rotate-left {
|
||||||
|
from {
|
||||||
|
-webkit-transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
-webkit-transform: rotate(-360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes hover {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: translateY(0%);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
-webkit-transform: translateY(5%);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: translateY(0%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes pull {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: scaleY(1);
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
-webkit-transform: scaleY(1.01);
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
-webkit-transform: scaleY(0.99);
|
||||||
|
}
|
||||||
|
80% {
|
||||||
|
-webkit-transform: scaleY(1.01);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: scaleY(0.99);
|
||||||
|
}
|
||||||
|
80% {
|
||||||
|
-webkit-transform: scaleY(1.01);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: scaleY(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
#airplane2, #airplane1 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 200px 200px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-right 60s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#countryObjects {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 200px 200px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-right 240s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#floatingGlobe {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 200px 200px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-left 360s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#globe {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: hover 0s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#windmill {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 331px 201px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-right 2s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#cloud1 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: hover 3s linear 1s infinite;
|
||||||
|
}
|
||||||
|
#cloud2 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: hover 3s linear 2s infinite;
|
||||||
|
}
|
||||||
|
#cloud3 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: hover 3s linear 3s infinite;
|
||||||
|
}
|
||||||
|
#circle1 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 200px 200px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-right 12s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#circle2 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 200px 200px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-left 24s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#circle3 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 200px 200px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-right 12s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#circle4 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 200px 200px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-left 24s linear 0s infinite;
|
||||||
|
}
|
||||||
|
#circle5 {
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-transform-origin: 200px 200px;
|
||||||
|
-webkit-transform: translate3d(0, 0, 0);
|
||||||
|
-webkit-animation: rotate-right 12s linear 0s infinite;
|
||||||
|
}
|
||||||
File diff suppressed because it is too large
Load Diff
@ -1,4 +1,4 @@
|
|||||||
.tinder-container {
|
.tinder-container {
|
||||||
margin-top: 30%;
|
margin-top: 30%;
|
||||||
height: 85vh;
|
height: 85vh;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -42,7 +42,7 @@
|
|||||||
|
|
||||||
.card {
|
.card {
|
||||||
height: 400px;
|
height: 400px;
|
||||||
width: 90%;
|
width: 100%;
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
max-height: 400px;
|
max-height: 400px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
@ -54,19 +54,19 @@
|
|||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
align-content: center;
|
align-content: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
padding: 16px;
|
|
||||||
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
|
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card-content {
|
.card-content {
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
padding: 8px;
|
/* padding: 8px; */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
width: 300px;
|
||||||
|
height: 400px;
|
||||||
background-color: rgba(255, 255, 255, 0.8);
|
background-color: rgba(255, 255, 255, 0.8);
|
||||||
}
|
}
|
||||||
|
|
||||||
.infoText {
|
.infoText {
|
||||||
margin-top: 16px;
|
margin-top: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -1,100 +1,80 @@
|
|||||||
import React, {useEffect, useState} from 'react';
|
import React, { useEffect, useState } from 'react';
|
||||||
import TinderCard from 'react-tinder-card';
|
import TinderCard from 'react-tinder-card';
|
||||||
import './Tinder.css';
|
import './Tinder.css';
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
const db = [
|
const Tinder = (props) => {
|
||||||
{
|
|
||||||
id: 1,
|
|
||||||
name: 'Richard Hendricks',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 2,
|
|
||||||
name: 'Erlich Bachman',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
name: 'Monica Hall',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
name: 'Jared Dunn',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 5,
|
|
||||||
name: 'Dinesh Chugtai',
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
const Tinder = (props) => {
|
|
||||||
|
|
||||||
const route = props.getValue;
|
const route = props.getValue;
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
console.log(characters[0])
|
|
||||||
});
|
|
||||||
|
|
||||||
const characters = props.cardData;
|
|
||||||
const [lastDirection, setLastDirection] = useState();
|
const [lastDirection, setLastDirection] = useState();
|
||||||
const [cardId, setCardId] = useState([]);
|
const [cardId, setCardId] = useState([]);
|
||||||
const [allIds, setAllIds] = useState([]);
|
const [allIds, setAllIds] = useState([]);
|
||||||
const [cardLenth, setCardLenth] = useState(false);
|
const [cardInfo, setCardInfo] = useState([]);
|
||||||
|
|
||||||
let uniqueTags = [...characters];
|
useEffect(() => {
|
||||||
let allTags = [];
|
const fetchData = () => {
|
||||||
|
axios.get('https://easytravel.zetcraft.ru/v1/GetAllCards')
|
||||||
|
.then(response => {
|
||||||
|
setCardInfo(response.data);
|
||||||
|
|
||||||
|
console.log(cardInfo.length);
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
console.error('Error fetching data:', error);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
fetchData();
|
||||||
|
}, []);
|
||||||
|
|
||||||
const swiped = (direction, id) => {
|
const swiped = (direction, id) => {
|
||||||
setLastDirection(direction);
|
setLastDirection(direction);
|
||||||
allIds.push(id);
|
allIds.push(id);
|
||||||
if (direction === 'right') {
|
console.log(allIds.length);
|
||||||
|
if (direction === 'right' || direction === 'up') {
|
||||||
cardId.push(id);
|
cardId.push(id);
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
const getId = () => {
|
|
||||||
|
|
||||||
// uniqueTags = cardId.filter(function(elem, pos) {
|
|
||||||
// return cardId.indexOf(elem) === pos;
|
|
||||||
// });
|
|
||||||
|
|
||||||
// allTags = allIds.filter(function(elem, pos){
|
|
||||||
// return allIds.indexOf(elem) === pos;
|
|
||||||
// });
|
|
||||||
|
|
||||||
// characters.length === allTags.length ? setCardLenth(true) : setCardLenth(false);
|
|
||||||
|
|
||||||
// if(cardLenth) {
|
|
||||||
// route('/map')
|
|
||||||
// }
|
|
||||||
console.log(uniqueTags);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='tinder-container'>
|
<div className='tinder-container'>
|
||||||
<h1>Card</h1>
|
<h1>Card</h1>
|
||||||
<div className='card-container'>
|
<div className='card-container'>
|
||||||
{characters.map((character) => (
|
{cardInfo.map((card) => (
|
||||||
<TinderCard
|
<TinderCard
|
||||||
className='swipe'
|
className='swipe'
|
||||||
key={character.id}
|
key={card.id}
|
||||||
onSwipe={(dir) => {
|
onSwipe={(dir) => {
|
||||||
swiped(dir, character.id);
|
swiped(dir, card.id);
|
||||||
getId();
|
var unique = [...new Set(cardId)]
|
||||||
// console.log(uniqueTags);
|
var uniqueIds = [...new Set(allIds)];
|
||||||
}}
|
if(uniqueIds.length === cardInfo.length) {
|
||||||
>
|
route('/map');
|
||||||
<div className='card'>
|
|
||||||
<div
|
console.log(unique);
|
||||||
className='card-content'
|
}
|
||||||
// style={{ backgroundImage: url(${character.url}) }}
|
}}
|
||||||
>
|
>
|
||||||
<h3>{props.character.question}</h3>
|
<div className='card'>
|
||||||
</div>
|
<div
|
||||||
</div>
|
className='card-content'
|
||||||
</TinderCard>
|
style={{
|
||||||
))}
|
backgroundImage: `url(${card.imageURL})`,
|
||||||
|
width: '300px',
|
||||||
|
height: '400px',
|
||||||
|
borderRadius: '10px',
|
||||||
|
backgroundRepeat: 'no-repeat',
|
||||||
|
backgroundPosition: 'center',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<h3>{card.question}</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</TinderCard>
|
||||||
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
}
|
||||||
|
|
||||||
export default Tinder;
|
export default Tinder;
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
* {
|
* {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
@ -7,9 +7,7 @@ import reportWebVitals from './reportWebVitals';
|
|||||||
|
|
||||||
const root = ReactDOM.createRoot(document.getElementById('root'));
|
const root = ReactDOM.createRoot(document.getElementById('root'));
|
||||||
root.render(
|
root.render(
|
||||||
<React.StrictMode>
|
|
||||||
<App />
|
<App />
|
||||||
</React.StrictMode>
|
|
||||||
);
|
);
|
||||||
|
|
||||||
serviceWorkerRegistration.unregister();
|
serviceWorkerRegistration.unregister();
|
||||||
|
|||||||
@ -1,13 +1,13 @@
|
|||||||
const reportWebVitals = (onPerfEntry) => {
|
const reportWebVitals = onPerfEntry => {
|
||||||
if (onPerfEntry && onPerfEntry instanceof Function) {
|
if (onPerfEntry && onPerfEntry instanceof Function) {
|
||||||
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
|
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
|
||||||
getCLS(onPerfEntry);
|
getCLS(onPerfEntry);
|
||||||
getFID(onPerfEntry);
|
getFID(onPerfEntry);
|
||||||
getFCP(onPerfEntry);
|
getFCP(onPerfEntry);
|
||||||
getLCP(onPerfEntry);
|
getLCP(onPerfEntry);
|
||||||
getTTFB(onPerfEntry);
|
getTTFB(onPerfEntry);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
export default reportWebVitals;
|
export default reportWebVitals;
|
||||||
@ -11,127 +11,127 @@
|
|||||||
// opt-in, read https://cra.link/PWA
|
// opt-in, read https://cra.link/PWA
|
||||||
|
|
||||||
const isLocalhost = Boolean(
|
const isLocalhost = Boolean(
|
||||||
window.location.hostname === 'localhost' ||
|
window.location.hostname === 'localhost' ||
|
||||||
// [::1] is the IPv6 localhost address.
|
// [::1] is the IPv6 localhost address.
|
||||||
window.location.hostname === '[::1]' ||
|
window.location.hostname === '[::1]' ||
|
||||||
// 127.0.0.0/8 are considered localhost for IPv4.
|
// 127.0.0.0/8 are considered localhost for IPv4.
|
||||||
window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)
|
window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)
|
||||||
);
|
);
|
||||||
|
|
||||||
export function register(config) {
|
export function register(config) {
|
||||||
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
|
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
|
||||||
// The URL constructor is available in all browsers that support SW.
|
// The URL constructor is available in all browsers that support SW.
|
||||||
const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
|
const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
|
||||||
if (publicUrl.origin !== window.location.origin) {
|
if (publicUrl.origin !== window.location.origin) {
|
||||||
// Our service worker won't work if PUBLIC_URL is on a different origin
|
// Our service worker won't work if PUBLIC_URL is on a different origin
|
||||||
// from what our page is served on. This might happen if a CDN is used to
|
// from what our page is served on. This might happen if a CDN is used to
|
||||||
// serve assets; see https://github.com/facebook/create-react-app/issues/2374
|
// serve assets; see https://github.com/facebook/create-react-app/issues/2374
|
||||||
return;
|
return;
|
||||||
}
|
|
||||||
|
|
||||||
window.addEventListener('load', () => {
|
|
||||||
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
|
|
||||||
|
|
||||||
if (isLocalhost) {
|
|
||||||
// This is running on localhost. Let's check if a service worker still exists or not.
|
|
||||||
checkValidServiceWorker(swUrl, config);
|
|
||||||
|
|
||||||
// Add some additional logging to localhost, pointing developers to the
|
|
||||||
// service worker/PWA documentation.
|
|
||||||
navigator.serviceWorker.ready.then(() => {
|
|
||||||
console.log(
|
|
||||||
'This web app is being served cache-first by a service ' +
|
|
||||||
'worker. To learn more, visit https://cra.link/PWA'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// Is not localhost. Just register service worker
|
|
||||||
registerValidSW(swUrl, config);
|
|
||||||
}
|
}
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function registerValidSW(swUrl, config) {
|
window.addEventListener('load', () => {
|
||||||
navigator.serviceWorker
|
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
|
||||||
.register(swUrl)
|
|
||||||
.then((registration) => {
|
if (isLocalhost) {
|
||||||
registration.onupdatefound = () => {
|
// This is running on localhost. Let's check if a service worker still exists or not.
|
||||||
const installingWorker = registration.installing;
|
checkValidServiceWorker(swUrl, config);
|
||||||
if (installingWorker == null) {
|
|
||||||
return;
|
// Add some additional logging to localhost, pointing developers to the
|
||||||
|
// service worker/PWA documentation.
|
||||||
|
navigator.serviceWorker.ready.then(() => {
|
||||||
|
console.log(
|
||||||
|
'This web app is being served cache-first by a service ' +
|
||||||
|
'worker. To learn more, visit https://cra.link/PWA'
|
||||||
|
);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
// Is not localhost. Just register service worker
|
||||||
|
registerValidSW(swUrl, config);
|
||||||
}
|
}
|
||||||
installingWorker.onstatechange = () => {
|
});
|
||||||
if (installingWorker.state === 'installed') {
|
}
|
||||||
if (navigator.serviceWorker.controller) {
|
}
|
||||||
// At this point, the updated precached content has been fetched,
|
|
||||||
// but the previous service worker will still serve the older
|
|
||||||
// content until all client tabs are closed.
|
|
||||||
console.log(
|
|
||||||
'New content is available and will be used when all ' +
|
|
||||||
'tabs for this page are closed. See https://cra.link/PWA.'
|
|
||||||
);
|
|
||||||
|
|
||||||
// Execute callback
|
function registerValidSW(swUrl, config) {
|
||||||
if (config && config.onUpdate) {
|
navigator.serviceWorker
|
||||||
config.onUpdate(registration);
|
.register(swUrl)
|
||||||
}
|
.then((registration) => {
|
||||||
} else {
|
registration.onupdatefound = () => {
|
||||||
// At this point, everything has been precached.
|
const installingWorker = registration.installing;
|
||||||
// It's the perfect time to display a
|
if (installingWorker == null) {
|
||||||
// "Content is cached for offline use." message.
|
return;
|
||||||
console.log('Content is cached for offline use.');
|
}
|
||||||
|
installingWorker.onstatechange = () => {
|
||||||
|
if (installingWorker.state === 'installed') {
|
||||||
|
if (navigator.serviceWorker.controller) {
|
||||||
|
// At this point, the updated precached content has been fetched,
|
||||||
|
// but the previous service worker will still serve the older
|
||||||
|
// content until all client tabs are closed.
|
||||||
|
console.log(
|
||||||
|
'New content is available and will be used when all ' +
|
||||||
|
'tabs for this page are closed. See https://cra.link/PWA.'
|
||||||
|
);
|
||||||
|
|
||||||
// Execute callback
|
// Execute callback
|
||||||
if (config && config.onSuccess) {
|
if (config && config.onUpdate) {
|
||||||
config.onSuccess(registration);
|
config.onUpdate(registration);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// At this point, everything has been precached.
|
||||||
|
// It's the perfect time to display a
|
||||||
|
// "Content is cached for offline use." message.
|
||||||
|
console.log('Content is cached for offline use.');
|
||||||
|
|
||||||
|
// Execute callback
|
||||||
|
if (config && config.onSuccess) {
|
||||||
|
config.onSuccess(registration);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
};
|
};
|
||||||
};
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
console.error('Error during service worker registration:', error);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function checkValidServiceWorker(swUrl, config) {
|
|
||||||
// Check if the service worker can be found. If it can't reload the page.
|
|
||||||
fetch(swUrl, {
|
|
||||||
headers: { 'Service-Worker': 'script' },
|
|
||||||
})
|
|
||||||
.then((response) => {
|
|
||||||
// Ensure service worker exists, and that we really are getting a JS file.
|
|
||||||
const contentType = response.headers.get('content-type');
|
|
||||||
if (
|
|
||||||
response.status === 404 ||
|
|
||||||
(contentType != null && contentType.indexOf('javascript') === -1)
|
|
||||||
) {
|
|
||||||
// No service worker found. Probably a different app. Reload the page.
|
|
||||||
navigator.serviceWorker.ready.then((registration) => {
|
|
||||||
registration.unregister().then(() => {
|
|
||||||
window.location.reload();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// Service worker found. Proceed as normal.
|
|
||||||
registerValidSW(swUrl, config);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
console.log('No internet connection found. App is running in offline mode.');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
export function unregister() {
|
|
||||||
if ('serviceWorker' in navigator) {
|
|
||||||
navigator.serviceWorker.ready
|
|
||||||
.then((registration) => {
|
|
||||||
registration.unregister();
|
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
console.error(error.message);
|
console.error('Error during service worker registration:', error);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
function checkValidServiceWorker(swUrl, config) {
|
||||||
|
// Check if the service worker can be found. If it can't reload the page.
|
||||||
|
fetch(swUrl, {
|
||||||
|
headers: { 'Service-Worker': 'script' },
|
||||||
|
})
|
||||||
|
.then((response) => {
|
||||||
|
// Ensure service worker exists, and that we really are getting a JS file.
|
||||||
|
const contentType = response.headers.get('content-type');
|
||||||
|
if (
|
||||||
|
response.status === 404 ||
|
||||||
|
(contentType != null && contentType.indexOf('javascript') === -1)
|
||||||
|
) {
|
||||||
|
// No service worker found. Probably a different app. Reload the page.
|
||||||
|
navigator.serviceWorker.ready.then((registration) => {
|
||||||
|
registration.unregister().then(() => {
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
// Service worker found. Proceed as normal.
|
||||||
|
registerValidSW(swUrl, config);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
console.log('No internet connection found. App is running in offline mode.');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function unregister() {
|
||||||
|
if ('serviceWorker' in navigator) {
|
||||||
|
navigator.serviceWorker.ready
|
||||||
|
.then((registration) => {
|
||||||
|
registration.unregister();
|
||||||
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
console.error(error.message);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user