diff --git a/package-lock.json b/package-lock.json index 4e35f59..3be6627 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,10 +13,13 @@ "@emotion/styled": "^11.10.5", "@types/react": "^17.0.52", "@types/react-dom": "^17.0.18", + "dayjs": "^1.11.7", "express": "^4.18.2", + "qrcode": "^1.5.1", "react": "^17.0.2", "react-dom": "^17.0.2", "react-helmet": "^6.1.0", + "react-router-dom": "^6.10.0", "socket.io-client": "^4.5.4", "typescript": "^4.9.3" }, @@ -2160,6 +2163,14 @@ "node": ">= 8" } }, + "node_modules/@remix-run/router": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.5.0.tgz", + "integrity": "sha512-bkUDCp8o1MvFO+qxkODcbhSqRa6P2GXgrGZVpt0dCXNW2HCSCqYI0ZoAqEOSAjRWmmlKcYgFvN4B4S+zo/f8kg==", + "engines": { + "node": ">=14" + } + }, "node_modules/@socket.io/component-emitter": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz", @@ -2602,7 +2613,6 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", - "dev": true, "engines": { "node": ">=8" } @@ -2611,7 +2621,6 @@ "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "dev": true, "dependencies": { "color-convert": "^2.0.1" }, @@ -2989,6 +2998,14 @@ "node": ">=6" } }, + "node_modules/camelcase": { + "version": "5.3.1", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz", + "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==", + "engines": { + "node": ">=6" + } + }, "node_modules/caniuse-lite": { "version": "1.0.30001434", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001434.tgz", @@ -3143,6 +3160,16 @@ "webpack": "*" } }, + "node_modules/cliui": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz", + "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==", + "dependencies": { + "string-width": "^4.2.0", + "strip-ansi": "^6.0.0", + "wrap-ansi": "^6.2.0" + } + }, "node_modules/clone-deep": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz", @@ -3174,7 +3201,6 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", - "dev": true, "dependencies": { "color-name": "~1.1.4" }, @@ -3185,8 +3211,7 @@ "node_modules/color-name": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", - "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", - "dev": true + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" }, "node_modules/colorette": { "version": "2.0.19", @@ -3438,6 +3463,11 @@ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz", "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==" }, + "node_modules/dayjs": { + "version": "1.11.7", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.7.tgz", + "integrity": "sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ==" + }, "node_modules/debug": { "version": "4.3.4", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", @@ -3454,6 +3484,14 @@ } } }, + "node_modules/decamelize": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz", + "integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/decode-uri-component": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz", @@ -3580,6 +3618,11 @@ "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==", "dev": true }, + "node_modules/dijkstrajs": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.3.tgz", + "integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==" + }, "node_modules/dir-glob": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", @@ -3614,6 +3657,11 @@ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.284.tgz", "integrity": "sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA==" }, + "node_modules/emoji-regex": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", + "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==" + }, "node_modules/emojis-list": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz", @@ -3623,6 +3671,11 @@ "node": ">= 4" } }, + "node_modules/encode-utf8": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/encode-utf8/-/encode-utf8-1.0.3.tgz", + "integrity": "sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw==" + }, "node_modules/encodeurl": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz", @@ -4291,7 +4344,6 @@ "version": "4.1.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==", - "dev": true, "dependencies": { "locate-path": "^5.0.0", "path-exists": "^4.0.0" @@ -4304,7 +4356,6 @@ "version": "5.0.0", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz", "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==", - "dev": true, "dependencies": { "p-locate": "^4.1.0" }, @@ -4316,7 +4367,6 @@ "version": "2.3.0", "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz", "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==", - "dev": true, "dependencies": { "p-try": "^2.0.0" }, @@ -4331,7 +4381,6 @@ "version": "4.1.0", "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz", "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==", - "dev": true, "dependencies": { "p-limit": "^2.2.0" }, @@ -4656,6 +4705,14 @@ "node": ">=6.9.0" } }, + "node_modules/get-caller-file": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz", + "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==", + "engines": { + "node": "6.* || 8.* || >= 10.*" + } + }, "node_modules/get-intrinsic": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.1.3.tgz", @@ -5224,6 +5281,14 @@ "node": ">=0.10.0" } }, + "node_modules/is-fullwidth-code-point": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", + "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==", + "engines": { + "node": ">=8" + } + }, "node_modules/is-glob": { "version": "4.0.3", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", @@ -6012,7 +6077,6 @@ "version": "2.2.0", "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz", "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==", - "dev": true, "engines": { "node": ">=6" } @@ -6066,7 +6130,6 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==", - "dev": true, "engines": { "node": ">=8" } @@ -6245,6 +6308,14 @@ "node": ">=4" } }, + "node_modules/pngjs": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz", + "integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==", + "engines": { + "node": ">=10.13.0" + } + }, "node_modules/posix-character-classes": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz", @@ -6409,6 +6480,23 @@ "node": ">=6" } }, + "node_modules/qrcode": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.1.tgz", + "integrity": "sha512-nS8NJ1Z3md8uTjKtP+SGGhfqmTCs5flU/xR623oI0JX+Wepz9R8UrRVCTBTJm3qGw3rH6jJ6MUHjkDx15cxSSg==", + "dependencies": { + "dijkstrajs": "^1.0.1", + "encode-utf8": "^1.0.3", + "pngjs": "^5.0.0", + "yargs": "^15.3.1" + }, + "bin": { + "qrcode": "bin/qrcode" + }, + "engines": { + "node": ">=10.13.0" + } + }, "node_modules/qs": { "version": "6.11.0", "resolved": "https://registry.npmjs.org/qs/-/qs-6.11.0.tgz", @@ -6809,6 +6897,36 @@ "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==", "dev": true }, + "node_modules/react-router": { + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.10.0.tgz", + "integrity": "sha512-Nrg0BWpQqrC3ZFFkyewrflCud9dio9ME3ojHCF/WLsprJVzkq3q3UeEhMCAW1dobjeGbWgjNn/PVF6m46ANxXQ==", + "dependencies": { + "@remix-run/router": "1.5.0" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, + "node_modules/react-router-dom": { + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.10.0.tgz", + "integrity": "sha512-E5dfxRPuXKJqzwSe/qGcqdwa18QiWC6f3H3cWXM24qj4N0/beCIf/CWTipop2xm7mR0RCS99NnaqPNjHtrAzCg==", + "dependencies": { + "@remix-run/router": "1.5.0", + "react-router": "6.10.0" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, "node_modules/react-side-effect": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.2.tgz", @@ -6972,6 +7090,19 @@ "node": ">=0.10" } }, + "node_modules/require-directory": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz", + "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/require-main-filename": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz", + "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==" + }, "node_modules/resolve": { "version": "1.22.1", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.1.tgz", @@ -7202,6 +7333,11 @@ "node": ">= 0.8.0" } }, + "node_modules/set-blocking": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz", + "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==" + }, "node_modules/set-value": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.1.tgz", @@ -7727,11 +7863,34 @@ "node": ">= 0.8" } }, + "node_modules/string-width": { + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", + "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", + "dependencies": { + "emoji-regex": "^8.0.0", + "is-fullwidth-code-point": "^3.0.0", + "strip-ansi": "^6.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/string-width/node_modules/strip-ansi": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "dependencies": { + "ansi-regex": "^5.0.1" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/strip-ansi": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz", "integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==", - "dev": true, "dependencies": { "ansi-regex": "^5.0.0" }, @@ -8527,6 +8686,11 @@ "node": ">= 8" } }, + "node_modules/which-module": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz", + "integrity": "sha512-B+enWhmw6cjfVC7kS8Pj9pCrKSc5txArRyaYGe088shv/FGWH+0Rjx/xPgtsWfsUtS27FkP697E4DDhgrgoc0Q==" + }, "node_modules/wildcard": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/wildcard/-/wildcard-2.0.0.tgz", @@ -8548,6 +8712,19 @@ "microevent.ts": "~0.1.1" } }, + "node_modules/wrap-ansi": { + "version": "6.2.0", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz", + "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==", + "dependencies": { + "ansi-styles": "^4.0.0", + "string-width": "^4.1.0", + "strip-ansi": "^6.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/wrappy": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", @@ -8582,6 +8759,11 @@ "node": ">=0.4.0" } }, + "node_modules/y18n": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz", + "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==" + }, "node_modules/yallist": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", @@ -8596,6 +8778,39 @@ "node": ">= 6" } }, + "node_modules/yargs": { + "version": "15.4.1", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz", + "integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==", + "dependencies": { + "cliui": "^6.0.0", + "decamelize": "^1.2.0", + "find-up": "^4.1.0", + "get-caller-file": "^2.0.1", + "require-directory": "^2.1.1", + "require-main-filename": "^2.0.0", + "set-blocking": "^2.0.0", + "string-width": "^4.2.0", + "which-module": "^2.0.0", + "y18n": "^4.0.0", + "yargs-parser": "^18.1.2" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/yargs-parser": { + "version": "18.1.3", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz", + "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==", + "dependencies": { + "camelcase": "^5.0.0", + "decamelize": "^1.2.0" + }, + "engines": { + "node": ">=6" + } + }, "node_modules/yocto-queue": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", @@ -10124,6 +10339,11 @@ "fastq": "^1.6.0" } }, + "@remix-run/router": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.5.0.tgz", + "integrity": "sha512-bkUDCp8o1MvFO+qxkODcbhSqRa6P2GXgrGZVpt0dCXNW2HCSCqYI0ZoAqEOSAjRWmmlKcYgFvN4B4S+zo/f8kg==" + }, "@socket.io/component-emitter": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz", @@ -10525,14 +10745,12 @@ "ansi-regex": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", - "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", - "dev": true + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==" }, "ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "dev": true, "requires": { "color-convert": "^2.0.1" } @@ -10811,6 +11029,11 @@ "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==" }, + "camelcase": { + "version": "5.3.1", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz", + "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==" + }, "caniuse-lite": { "version": "1.0.30001434", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001434.tgz", @@ -10922,6 +11145,16 @@ "del": "^4.1.1" } }, + "cliui": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz", + "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==", + "requires": { + "string-width": "^4.2.0", + "strip-ansi": "^6.0.0", + "wrap-ansi": "^6.2.0" + } + }, "clone-deep": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz", @@ -10947,7 +11180,6 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", - "dev": true, "requires": { "color-name": "~1.1.4" } @@ -10955,8 +11187,7 @@ "color-name": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", - "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", - "dev": true + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" }, "colorette": { "version": "2.0.19", @@ -11142,6 +11373,11 @@ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz", "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==" }, + "dayjs": { + "version": "1.11.7", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.7.tgz", + "integrity": "sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ==" + }, "debug": { "version": "4.3.4", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", @@ -11150,6 +11386,11 @@ "ms": "2.1.2" } }, + "decamelize": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz", + "integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==" + }, "decode-uri-component": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz", @@ -11250,6 +11491,11 @@ } } }, + "dijkstrajs": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.3.tgz", + "integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==" + }, "dir-glob": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", @@ -11281,12 +11527,22 @@ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.284.tgz", "integrity": "sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA==" }, + "emoji-regex": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", + "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==" + }, "emojis-list": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz", "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==", "dev": true }, + "encode-utf8": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/encode-utf8/-/encode-utf8-1.0.3.tgz", + "integrity": "sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw==" + }, "encodeurl": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz", @@ -11834,7 +12090,6 @@ "version": "4.1.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==", - "dev": true, "requires": { "locate-path": "^5.0.0", "path-exists": "^4.0.0" @@ -11844,7 +12099,6 @@ "version": "5.0.0", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz", "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==", - "dev": true, "requires": { "p-locate": "^4.1.0" } @@ -11853,7 +12107,6 @@ "version": "2.3.0", "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz", "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==", - "dev": true, "requires": { "p-try": "^2.0.0" } @@ -11862,7 +12115,6 @@ "version": "4.1.0", "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz", "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==", - "dev": true, "requires": { "p-limit": "^2.2.0" } @@ -12116,6 +12368,11 @@ "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz", "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==" }, + "get-caller-file": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz", + "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==" + }, "get-intrinsic": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.1.3.tgz", @@ -12547,6 +12804,11 @@ "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", "dev": true }, + "is-fullwidth-code-point": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", + "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==" + }, "is-glob": { "version": "4.0.3", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", @@ -13121,8 +13383,7 @@ "p-try": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz", - "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==", - "dev": true + "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==" }, "parent-module": { "version": "1.0.1", @@ -13157,8 +13418,7 @@ "path-exists": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", - "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==", - "dev": true + "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==" }, "path-is-absolute": { "version": "1.0.1", @@ -13288,6 +13548,11 @@ } } }, + "pngjs": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz", + "integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==" + }, "posix-character-classes": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz", @@ -13398,6 +13663,17 @@ "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==", "dev": true }, + "qrcode": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.1.tgz", + "integrity": "sha512-nS8NJ1Z3md8uTjKtP+SGGhfqmTCs5flU/xR623oI0JX+Wepz9R8UrRVCTBTJm3qGw3rH6jJ6MUHjkDx15cxSSg==", + "requires": { + "dijkstrajs": "^1.0.1", + "encode-utf8": "^1.0.3", + "pngjs": "^5.0.0", + "yargs": "^15.3.1" + } + }, "qs": { "version": "6.11.0", "resolved": "https://registry.npmjs.org/qs/-/qs-6.11.0.tgz", @@ -13699,6 +13975,23 @@ "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==", "dev": true }, + "react-router": { + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.10.0.tgz", + "integrity": "sha512-Nrg0BWpQqrC3ZFFkyewrflCud9dio9ME3ojHCF/WLsprJVzkq3q3UeEhMCAW1dobjeGbWgjNn/PVF6m46ANxXQ==", + "requires": { + "@remix-run/router": "1.5.0" + } + }, + "react-router-dom": { + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.10.0.tgz", + "integrity": "sha512-E5dfxRPuXKJqzwSe/qGcqdwa18QiWC6f3H3cWXM24qj4N0/beCIf/CWTipop2xm7mR0RCS99NnaqPNjHtrAzCg==", + "requires": { + "@remix-run/router": "1.5.0", + "react-router": "6.10.0" + } + }, "react-side-effect": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.2.tgz", @@ -13831,6 +14124,16 @@ "integrity": "sha512-PV0dzCYDNfRi1jCDbJzpW7jNNDRuCOG/jI5ctQcGKt/clZD+YcPS3yIlWuTJMmESC8aevCFmWJy5wjAFgNqN6w==", "dev": true }, + "require-directory": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz", + "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==" + }, + "require-main-filename": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz", + "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==" + }, "resolve": { "version": "1.22.1", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.1.tgz", @@ -13998,6 +14301,11 @@ "send": "0.18.0" } }, + "set-blocking": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz", + "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==" + }, "set-value": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.1.tgz", @@ -14425,11 +14733,30 @@ "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz", "integrity": "sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==" }, + "string-width": { + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", + "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", + "requires": { + "emoji-regex": "^8.0.0", + "is-fullwidth-code-point": "^3.0.0", + "strip-ansi": "^6.0.1" + }, + "dependencies": { + "strip-ansi": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "requires": { + "ansi-regex": "^5.0.1" + } + } + } + }, "strip-ansi": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz", "integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==", - "dev": true, "requires": { "ansi-regex": "^5.0.0" } @@ -14971,6 +15298,11 @@ "isexe": "^2.0.0" } }, + "which-module": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz", + "integrity": "sha512-B+enWhmw6cjfVC7kS8Pj9pCrKSc5txArRyaYGe088shv/FGWH+0Rjx/xPgtsWfsUtS27FkP697E4DDhgrgoc0Q==" + }, "wildcard": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/wildcard/-/wildcard-2.0.0.tgz", @@ -14992,6 +15324,16 @@ "microevent.ts": "~0.1.1" } }, + "wrap-ansi": { + "version": "6.2.0", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz", + "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==", + "requires": { + "ansi-styles": "^4.0.0", + "string-width": "^4.1.0", + "strip-ansi": "^6.0.0" + } + }, "wrappy": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", @@ -15009,6 +15351,11 @@ "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz", "integrity": "sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A==" }, + "y18n": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz", + "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==" + }, "yallist": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", @@ -15020,6 +15367,33 @@ "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz", "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==" }, + "yargs": { + "version": "15.4.1", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz", + "integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==", + "requires": { + "cliui": "^6.0.0", + "decamelize": "^1.2.0", + "find-up": "^4.1.0", + "get-caller-file": "^2.0.1", + "require-directory": "^2.1.1", + "require-main-filename": "^2.0.0", + "set-blocking": "^2.0.0", + "string-width": "^4.2.0", + "which-module": "^2.0.0", + "y18n": "^4.0.0", + "yargs-parser": "^18.1.2" + } + }, + "yargs-parser": { + "version": "18.1.3", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz", + "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==", + "requires": { + "camelcase": "^5.0.0", + "decamelize": "^1.2.0" + } + }, "yocto-queue": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", diff --git a/package.json b/package.json index 1d350c0..1e62d27 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "main": "./src/index.tsx", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", - "start": "ijl-cli --server --port=8099 --with-open-browser", + "start": "ijl-cli --server --port=8099", "build": "npm run clean && ijl-cli --build --dev", "build:prod": "npm run clean && ijl-cli --build", "clean": "rimraf dist" @@ -25,10 +25,13 @@ "@emotion/styled": "^11.10.5", "@types/react": "^17.0.52", "@types/react-dom": "^17.0.18", + "dayjs": "^1.11.7", "express": "^4.18.2", + "qrcode": "^1.5.1", "react": "^17.0.2", "react-dom": "^17.0.2", "react-helmet": "^6.1.0", + "react-router-dom": "^6.10.0", "socket.io-client": "^4.5.4", "typescript": "^4.9.3" } diff --git a/src/app.tsx b/src/app.tsx index 2c137eb..23ae77e 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -1,12 +1,17 @@ import React from 'react'; import { Helmet } from 'react-helmet'; import { Global, css } from '@emotion/react' +import { BrowserRouter } from 'react-router-dom'; +import ruLocale from 'dayjs/locale/ru'; +import dayjs from 'dayjs'; -import { MainPage } from './pages/main'; +import { Dashboard } from './dashboard'; + +dayjs.locale('ru', ruLocale); const App = () => { return( - <> + @@ -58,8 +63,8 @@ const App = () => { } `} /> - - + + ) } diff --git a/src/assets/503702d8-c8e2-4dd9-b05b-3c12e282d1cb.png b/src/assets/503702d8-c8e2-4dd9-b05b-3c12e282d1cb.png deleted file mode 100644 index c8e6d68..0000000 Binary files a/src/assets/503702d8-c8e2-4dd9-b05b-3c12e282d1cb.png and /dev/null differ diff --git a/src/assets/back.svg b/src/assets/back.svg deleted file mode 100644 index 6d6fc25..0000000 --- a/src/assets/back.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - - diff --git a/src/assets/fullscreen.svg b/src/assets/fullscreen.svg deleted file mode 100644 index 98641b3..0000000 --- a/src/assets/fullscreen.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/assets/logo-short.svg b/src/assets/logo-short.svg deleted file mode 100644 index 563c229..0000000 --- a/src/assets/logo-short.svg +++ /dev/null @@ -1,57 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/src/assets/logo-white.svg b/src/assets/logo-white.svg deleted file mode 100644 index 145bf6a..0000000 --- a/src/assets/logo-white.svg +++ /dev/null @@ -1,57 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/src/assets/logo.svg b/src/assets/logo.svg deleted file mode 100644 index 86ed112..0000000 --- a/src/assets/logo.svg +++ /dev/null @@ -1,57 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/src/components/keyboard.style.ts b/src/components/keyboard.style.ts deleted file mode 100644 index 0b37560..0000000 --- a/src/components/keyboard.style.ts +++ /dev/null @@ -1,66 +0,0 @@ -import styled from '@emotion/styled'; -import { keyframes } from '@emotion/react'; - -const reveal = keyframes` - from { - bottom: -600px; - } - to { - bottom: 0; - } -`; - -export const Wrapper = styled.div` - position: absolute; - bottom: 0; - left: auto; - right: auto; - padding: 12px; - background-color: #96e8c229; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - animation: ${reveal} .5s; - animation-timing-function: cubic-bezier(0, 0.39, 0.29, 1.02); - - @media screen and (max-width: 600px) { - padding: 6px; - } -`; - -export const KeyRow = styled.div` - display: flex; -`; - -export const BackspaceBtn = styled.img` - width: 60%; -`; - -export const Key = styled.button` - margin: 4px; - width: 8vw; - max-width: 100px; - height: 7vw; - max-height: 100px; - min-height: 40px; - font-size: 24px; - display: flex; - align-items: center; - justify-content: center; - color: #829cdb; - border-radius: 6px; - background-color: #fff; - border: none; - box-shadow: 1px 2px 6px #5c7cc9; - - @media screen and (max-width: 600px) { - margin: 2px; - } - - &:active { - background: #f5f5f5; - box-shadow: inset 1px 2px 6px #5c7cc9, - 0px 6px 16px #5c7cc9; - } -`; diff --git a/src/components/keyboard.tsx b/src/components/keyboard.tsx deleted file mode 100644 index b3792b5..0000000 --- a/src/components/keyboard.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import React from 'react'; -import back from '../assets/back.svg'; - -import { - Wrapper, - Key, - KeyRow, - BackspaceBtn, -} from './keyboard.style'; - -const rows = [ - ['q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p'], - ['a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l'], - ['z', 'x', 'c', 'v', 'b', 'n', 'm', ] -] - -export const Keyboard = ({ onChange }) => { - const handleClick = (key) => () => { - if (typeof key === 'string') { - onChange(v => v + key.toUpperCase()); - } else { - onChange(v => v.slice(0, -1)) - } - } - return ( - - {rows.map((row, index) => ( - - {row.map(key => ( - {key} - ))} - - ))} - - ) -} \ No newline at end of file diff --git a/src/dashboard.tsx b/src/dashboard.tsx new file mode 100644 index 0000000..08d85d4 --- /dev/null +++ b/src/dashboard.tsx @@ -0,0 +1,29 @@ +import React, { useEffect } from 'react'; +import { + Routes, + Route, + useNavigate +} from 'react-router-dom'; + +import { MainPage } from './pages/main'; +import { Lesson } from './pages/Lesson'; +import { UserPage } from './pages/UserPage'; + +const Redirect = ({ path }) => { + const navigate = useNavigate(); + + useEffect(() => { + navigate(path); + }, []); + + return null; +} + +export const Dashboard = () => ( + + } /> + } /> + } /> + } /> + +) diff --git a/src/pages/Journal.tsx b/src/pages/Journal.tsx new file mode 100644 index 0000000..f8d0a3d --- /dev/null +++ b/src/pages/Journal.tsx @@ -0,0 +1,78 @@ +import React, { useCallback, useEffect, useRef, useState } from 'react'; +import dayjs from 'dayjs'; +import { Link } from 'react-router-dom' + +import { + ArrowImg, + IconButton, + InputElement, + InputLabel, + InputWrapper, + StartWrapper, + LessonItem, + Lessonname, +} from './style'; + +import arrow from '../assets/36-arrow-right.svg'; +import { connect, getSocket } from "../socket"; + +export const Journal = () => { + const [lessons, setLessons] = useState(null); + + useEffect(() => { + connect(); + const socket = getSocket(); + socket.on('lessons', data => { + setLessons(data) + }) + }, []); + + const [value, setValue] = useState(''); + const handleChange = useCallback(event => { + setValue(event.target.value.toUpperCase()) + }, [setValue]); + const inputRef = useRef(null); + + const handleSubmit = useCallback((event) => { + event.preventDefault(); + + const socket = getSocket(); + socket.emit('create-lesson', { lessonName: value }); + setValue('') + }, [value]) + + return ( + +
+ + + Название новой лекции: + + + + + + +
+
    + {lessons?.map((lesson) => ( + + + {lesson.name} + {dayjs(lesson.ts).format('DD MMMM YYYYг.')} + + + ))} +
+ + ) +}; diff --git a/src/pages/Lesson.tsx b/src/pages/Lesson.tsx new file mode 100644 index 0000000..e8d93e6 --- /dev/null +++ b/src/pages/Lesson.tsx @@ -0,0 +1,44 @@ +import React, { useEffect, useState, useRef } from 'react'; +import { useParams } from 'react-router-dom'; +import dayjs from 'dayjs'; +import QRCode from 'qrcode'; + +import { connect, getSocket } from '../socket'; +import { MainWrapper, StartWrapper, QRCanvas, LessonItem, Lessonname } from './style'; + +export const Lesson = () => { + const { lessonId } = useParams(); + const canvRef = useRef(null); + const [lesson, setLesson] = useState(null); + useEffect(() => { + connect(); + const socket = getSocket(); + socket.on('lessons', data => { + setLesson(data.find(lesson => lesson.id === lessonId)); + }) + + QRCode.toCanvas(canvRef.current, `${location.origin}/journal/u/${lessonId}` , function (error) { + if (error) console.error(error) + console.log('success!'); + }) + }, []); + + return ( + + +

Lesson - {lesson?.name}

+ {dayjs(lesson?.ts).format('DD MMMM YYYYг.')} + + + +
    + {lesson?.padavans?.map((padavan, index) => ( + + {padavan.name} + + ))} +
+ + + ) +} diff --git a/src/pages/UserPage.tsx b/src/pages/UserPage.tsx new file mode 100644 index 0000000..ded37df --- /dev/null +++ b/src/pages/UserPage.tsx @@ -0,0 +1,72 @@ +import React, { useCallback, useEffect, useState } from 'react'; +import { useParams } from 'react-router-dom'; + +import { connect, getSocket } from '../socket'; +import { ArrowImg, IconButton, InputElement, InputLabel, InputWrapper, MainWrapper, StartWrapper } from './style'; +import arrow from '../assets/36-arrow-right.svg'; + +export const UserPage = () => { + const [socketId, setSocketId] = useState(null); + const { lessonId } = useParams(); + useEffect(() => { + connect(); + const socket = getSocket(); + socket.on('connect', () => { + const id = localStorage.getItem('socketId'); + if (!id) { + localStorage.setItem('socketId', socket.id); + setSocketId(socket.id); + } else { + setSocketId(id); + } + + const name = localStorage.getItem('name'); + if (name) { + const socket = getSocket(); + socket.emit('add', { socketId: id || socket.id, name, lessonid: lessonId }); + } + }) + socket.on('lessons', data => { + // setLessons(data) + }) + }, []); + + const [value, setValue] = useState(localStorage.getItem('name') || ''); + const handleChange = useCallback(event => { + setValue(event.target.value.toUpperCase()) + }, [setValue]); + + const handleSubmit = useCallback((event) => { + event.preventDefault(); + + const socket = getSocket(); + localStorage.setItem('name', value) + socket.emit('add', { socketId, name: value, lessonid: lessonId }); + }, [value]) + + return ( + + +
+ + + Как вас зовут: + + + + + + +
+ + + ) +} diff --git a/src/pages/main.tsx b/src/pages/main.tsx index 9251b1e..97d9ea5 100644 --- a/src/pages/main.tsx +++ b/src/pages/main.tsx @@ -1,41 +1,16 @@ -import React, {useState, useCallback, useRef, useMemo} from 'react'; -import { getFeatures } from '@ijl/cli'; +import React, {useState, useCallback, useRef, useEffect} from 'react'; -import logo from '../assets/logo.svg'; import arrow from '../assets/36-arrow-right.svg'; -import fullScreen from '../assets/fullscreen.svg'; -import logoShort from '../assets/logo-short.svg'; - -import { Keyboard } from '../components/keyboard'; import { MainWrapper, InputElement, InputLabel, InputWrapper, - LogoImg, ArrowImg, IconButton, - StartWrapper, - StartI, - StartInput, - StartLabel, - HalfLine, - HideGroup, - Circle, - LineSvg, - Svg, - CircleDiv, - FullScreenButton, - InputHolder, - Blow, - BigLogo, } from './style'; -import { socket } from "../socket"; - -const keyboardFeature = getFeatures('hub-video-start')?.keyboard; -const fullScreenFeature = getFeatures('hub-video-start')?.fullScreen; -const blowAnimFeature = getFeatures('hub-video-start')?.blowAnim; +import { Journal } from './Journal'; const Input = ({ onStart }) => { const [value, setValue] = useState(''); @@ -45,9 +20,18 @@ const Input = ({ onStart }) => { }, [setValue]); const inputRef = useRef(null); + useEffect(() => { + const pass = localStorage.getItem('pass') + + if (pass) { + onStart(); + } + }, []); + const handleSubmit = useCallback((event) => { event.preventDefault(); - if (value === 'SBER') { + localStorage.setItem('pass', 'true') + if (value === 'OYB0Y') { onStart() } }, [value]) @@ -59,219 +43,33 @@ const Input = ({ onStart }) => { - Ввод: + Введите пароль: setInfocuse(true)} ref={inputRef} - onClick={(event) => { - if (keyboardFeature) { - event.preventDefault(); - event.stopPropagation(); - inputRef.current.blur(); - } - }} id="input" + type="password" autoComplete="off" /> - {keyboardFeature && setInfocuse(true)} />} - {keyboardFeature && inFocuse && ( - - )} ) } -export const Line = ({ hide, reverse, speed, delay, radius, progress, width, color }) => ( - - - - - -) - -Line.defaultProps = { - reverse: false -} - -const Start = () => { - const [sended, setSend] = useState(false); - - const handleCheck = () => { - if (!sended) { - socket.emit('play') - setSend(true) - } - } - - return ( - - {sended && blowAnimFeature && ( - <> - - - - - - - - )} - {/* - - - - - - - - */} - - - - - - - - - - СТАРТ - - - - ) -} - export const MainPage = () => { - const [showStart, setShowStart] = useState(false); - const [isFull, setFull] = useState(false); - - const handleFullScreen = useCallback(() => { - const elem = document.documentElement; - if (elem.requestFullscreen) { - elem.requestFullscreen(); - } else if (elem.webkitRequestFullscreen) { /* Safari */ - elem.webkitRequestFullscreen(); - } else if (elem.msRequestFullscreen) { /* IE11 */ - elem.msRequestFullscreen(); - } - setFull(true); - }, []); + const [shoList, setShoList] = useState(false); return ( - {fullScreenFeature && !isFull && ( - - - - )} - - {/* */} - {!showStart && setShowStart(true)} />} - {showStart && } + {!shoList && setShoList(true)} />} + {shoList && } ); }; diff --git a/src/pages/style.ts b/src/pages/style.ts index 631c8d5..a3ef198 100644 --- a/src/pages/style.ts +++ b/src/pages/style.ts @@ -33,12 +33,6 @@ export const InputElement = styled.input` max-width: 90vw; `; -export const LogoImg = styled.img` - position: absolute; - top: 24px; - left: 24px; -`; - export const ArrowImg = styled.img` width: 48px; height: 48px; @@ -65,177 +59,12 @@ const reveal = keyframes` export const StartWrapper = styled.div` animation: ${reveal} 1s ease forwards; /* box-shadow: 0 -2px 5px rgba(255,255,255,0.05), 0 2px 5px rgba(255,255,255,0.1); */ - width: 350px; - height: 350px; + width: 650px; + height: calc(100vh - 300px); /* margin: 60px auto; */ position: relative; `; -export const StartLabel = styled.label` - display: block; - width: 100%; - height: 100%; - border-radius: 50%; - background: #b25244; - /* background: linear-gradient(#f7f2f6, #b2ac9e); */ - /* background: linear-gradient(#b52a2a, #e10ff1); */ - background: linear-gradient(rgb(255 251 251), rgb(140 219 35)); - position: relative; - color: #a5a39d; - font-size: 70px; - text-align: center; - line-height: 150px; - transition: all 0.3s ease-out; - text-shadow: 0 2px 1px rgba(0,0,0,0.25); - z-index: 1; - box-shadow: - inset 0 2px 3px rgba(255,255,255,0.13), - 0 5px 8px rgba(0,0,0,0.3), - 0 10px 10px 4px rgba(0,0,0,0.3); - -webkit-tap-highlight-color: transparent; - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - - &::after { - content: ""; - position: absolute; - left: -20px; - right: -20px; - top: -20px; - bottom: -20px; - z-index: -2; - border-radius: inherit; - box-shadow: - inset 0 1px 0 rgba(255,255,255,0.1), - 0 1px 2px rgba(0,0,0,0.3), - 0 0 10px rgba(0,0,0,0.15); - } - - &::before { - content: ""; - position: absolute; - left: -10px; - right: -10px; - top: -10px; - bottom: -10px; - z-index: -1; - border-radius: inherit; - box-shadow: inset 0 10px 10px rgba(0,0,0,0.13); - -webkit-filter:blur(1px); - filter: blur(1px); - } -`; - -export const StartInput = styled.input` - display: block; - width: 100%; - height: 100%; - opacity: 0; - z-index: 100; - position: absolute; - cursor: pointer; - -webkit-tap-highlight-color: transparent; - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - - &:checked ~ label { - box-shadow: - inset 0 2px 3px rgba(255,255,255,0.13), - 0 5px 8px rgba(0,0,0,0.35), - 0 3px 10px 4px rgba(0,0,0,0.2); - color: #9abb82; - } -`; - -export const StartI = styled.i` - content: ""; - display: flex; - position: absolute; - width: 70%; - height: 70%; - left: 50%; - top: 50%; - z-index: 1; - color: white; - margin: -35% 0 0 -35%; - border-radius: 50%; - background: linear-gradient(#22a037, #98e221); - box-shadow: - 0 -2px 5px rgba(255,255,255,0.05), - 0 2px 5px rgba(255,255,255,0.1); - -webkit-filter:blur(1px); - filter: blur(1px); - align-items: center; - justify-content: center; - font-style: normal; -`; - -// const LineRotation = keyframes -//` -// 0% { -// transform: translate(-50%, -100%) rotate(0); -// } - -// 100% { -// transform: translate(-50%, -100%) rotate(1turn); -// } -// `; - - -// type LineProps = { -// radius: number; -// width: number; - -// } - -// export const HalfLine = styled.div(({ -// radius, -// width, -// }) =>css` -// transform-origin: 50% 100%; -// animation: ${LineRotation} 3s linear infinite; -// width: ${radius * 2}px; -// height: ${radius}px; -// border-top-left-radius: ${radius}px; -// border-top-right-radius: ${radius}px; -// border: ${width}px solid gray; -// border-bottom: 0; -// position: absolute; -// top: 50%; -// left: 50%; -// transform: translate(-50%, -100%); -// `); - -const LineRotation = keyframes` - 0% { - transform: translate(-50%, -50%) rotate(0); - } - - 100% { - transform: translate(-50%, -50%) rotate(1turn); - } -`; - -const LineHideAnimation = keyframes` - 0% { - /* transform: scale(1); */ - opacity: 1; - } - - 100% { - /* transform: scale(0); */ - opacity: 0; - } -`; - export const Svg = styled.svg` position: absolute; top: 50%; @@ -245,120 +74,20 @@ export const Svg = styled.svg` /* stroke-dasharray: 600; */ `; -export const CircleDiv = styled.div` - width: 700px; - height: 700px; - position: absolute; - top: 50%; - left: 50%; - transform-origin: 50% 50%; - transform: translate(-50%, -50%) rotate(270deg); - border-radius: 50%; - background: radial-gradient( - farthest-side at bottom center, - rgba(35, 235, 4, 0.709), - rgba(255, 255, 255, 0) 65% - ), - radial-gradient( - farthest-corner at bottom left, - rgba(244, 244, 8, 0.9), - rgba(255, 255, 255, 0) 40% - ), - radial-gradient( - farthest-side at bottom right, - rgba(0, 195, 255, 0.648), - rgba(255, 255, 255, 0) 65% - ); +export const LessonItem = styled.li` + list-style: none; + background-color: #ffffff; + padding: 16px; + border-radius: 12px; + box-shadow: 2px 2px 6px #0000005c; + margin-bottom: 12px; `; -export const LineSvg = styled.svg<{ animationSpeed: number; delay: number; reverse: boolean }>` - animation: ${LineRotation} ${({ animationSpeed }) => animationSpeed}s linear infinite${({ reverse }) => reverse ? ' reverse' : ''}; - animation-delay: -${({ delay }) => delay}s; - position: absolute; - top: 50%; - left: 50%; - transform-origin: 50% 50%; - transform: translate(-50%, -50%); - z-index: 2; +export const Lessonname = styled.span` + display: inline-box; + margin-right: 12px; `; -export const HideGroup = styled.g<{ hide: boolean; delay: number; }>` - animation: ${({ hide }) => hide ? css`${LineHideAnimation} 3s ease-in forwards`: ''}; - transform-origin: 50% 50%; - animation-delay: ${({ delay }) => delay / 10}s; -`; -export const Circle = styled.circle<{ circumference: number; percent: number }>` - transition: 0.35s stroke-dashoffset; - transform: rotate(-90deg); - transform-origin: 50% 50%; - stroke-dasharray: ${({ circumference }) => `${circumference} ${circumference}`}; - stroke-dashoffset: ${({ circumference, percent }) => circumference - percent / 100 * circumference}; -`; - -export const FullScreenButton = styled.button` - padding: 12px; - position: absolute; - top: 50px; - right: 50px; - border: none; - background-color: rgba(0, 0, 0, .07); -`; - -export const InputHolder = styled.div` - background-color: rgba(0, 0, 0, .0); - width: calc(100% - 70px); - height: 60px; - right: 70px; - top: 12px; - left: 12px; - position: absolute; - - @media screen and (max-width: 600px) { - width: 100%; - } -`; - -const blowAnim = keyframes` - to { - width: 200vw; - height: 200vw; - } -`; - -type BlowProps = { - delay: number; - color: string; -} - -export const Blow = styled.div` - z-index: 10; - border-radius: 50%; - position: absolute; - left: 50%; - top: 50%; - width: 0; - height: 0%; - background-color: ${({ color }) => color}; - animation: ${blowAnim} 1s ease-out forwards; - animation-delay: ${({ delay }) => delay}s; - transform: translate(-50%, -50%); -`; - -const blowAnimShort = keyframes` - to { - width: 50vw; - height: 50vw; - } -`; - -export const BigLogo = styled.img` - z-index: 10; - position: absolute; - left: 50%; - top: 50%; - width: 0; - height: 0; - animation: ${blowAnimShort} 2s ease-out forwards; - animation-delay: .7s; - transform: translate(-50%, -50%); +export const QRCanvas = styled.canvas` + display: block; `; diff --git a/src/socket.ts b/src/socket.ts index 0166888..24bbd81 100644 --- a/src/socket.ts +++ b/src/socket.ts @@ -1,8 +1,17 @@ import { getConfigValue } from "@ijl/cli"; import { io } from "socket.io-client"; -export const socket = io(getConfigValue('journal.socket.url'), { path: getConfigValue('journal.socket.path')}); -socket.on("connect", () => { - console.log('Socket connected', socket.id) -}) +let socket = null; + +export const getSocket = () => socket; + +export const connect = () => { + socket = io(getConfigValue('journal.socket.url') + '/lessons', { path: getConfigValue('journal.socket.path')}); + socket.on("connect", () => { + console.log('Socket connected', socket.id) + }) + +} + +