diff --git a/package-lock.json b/package-lock.json index b5c3a66..cb33202 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20328,8 +20328,7 @@ "@material-ui/types": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", - "requires": {} + "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==" }, "@material-ui/utils": { "version": "4.11.2", @@ -21433,14 +21432,12 @@ "acorn-import-assertions": { "version": "1.8.0", "resolved": "https://registry.npmjs.org/acorn-import-assertions/-/acorn-import-assertions-1.8.0.tgz", - "integrity": "sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==", - "requires": {} + "integrity": "sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==" }, "acorn-jsx": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz", - "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==", - "requires": {} + "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==" }, "acorn-node": { "version": "1.8.2", @@ -21545,8 +21542,7 @@ "ajv-keywords": { "version": "3.5.2", "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz", - "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==", - "requires": {} + "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==" }, "ansi-escapes": { "version": "4.3.2", @@ -21903,8 +21899,7 @@ "babel-plugin-named-asset-import": { "version": "0.3.8", "resolved": "https://registry.npmjs.org/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.8.tgz", - "integrity": "sha512-WXiAc++qo7XcJ1ZnTYGtLxmBCVbddAml3CEXgWaBzNzLNoxtQ8AiGEFDMOhot9XjTCQbvP5E77Fj9Gk924f00Q==", - "requires": {} + "integrity": "sha512-WXiAc++qo7XcJ1ZnTYGtLxmBCVbddAml3CEXgWaBzNzLNoxtQ8AiGEFDMOhot9XjTCQbvP5E77Fj9Gk924f00Q==" }, "babel-plugin-polyfill-corejs2": { "version": "0.3.1", @@ -22122,8 +22117,7 @@ "bootstrap": { "version": "5.1.3", "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.1.3.tgz", - "integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==", - "requires": {} + "integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==" }, "brace-expansion": { "version": "1.1.11", @@ -22758,8 +22752,7 @@ "css-prefers-color-scheme": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/css-prefers-color-scheme/-/css-prefers-color-scheme-6.0.2.tgz", - "integrity": "sha512-gv0KQBEM+q/XdoKyznovq3KW7ocO7k+FhPP+hQR1MenJdu0uPGS6IZa9PzlbqBeS6XcZJNAoqoFxlAUW461CrA==", - "requires": {} + "integrity": "sha512-gv0KQBEM+q/XdoKyznovq3KW7ocO7k+FhPP+hQR1MenJdu0uPGS6IZa9PzlbqBeS6XcZJNAoqoFxlAUW461CrA==" }, "css-select": { "version": "4.2.1", @@ -22882,8 +22875,7 @@ "cssnano-utils": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/cssnano-utils/-/cssnano-utils-3.0.1.tgz", - "integrity": "sha512-VNCHL364lh++/ono+S3j9NlUK+d97KNkxI77NlqZU2W3xd2/qmyN61dsa47pTpb55zuU4G4lI7qFjAXZJH1OAQ==", - "requires": {} + "integrity": "sha512-VNCHL364lh++/ono+S3j9NlUK+d97KNkxI77NlqZU2W3xd2/qmyN61dsa47pTpb55zuU4G4lI7qFjAXZJH1OAQ==" }, "csso": { "version": "4.2.0", @@ -23846,8 +23838,7 @@ "eslint-plugin-react-hooks": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.3.0.tgz", - "integrity": "sha512-XslZy0LnMn+84NEG9jSGR6eGqaZB3133L8xewQo3fQagbQuGt7a63gf+P1NGKZavEYEC3UXaWEAA/AqDkuN6xA==", - "requires": {} + "integrity": "sha512-XslZy0LnMn+84NEG9jSGR6eGqaZB3133L8xewQo3fQagbQuGt7a63gf+P1NGKZavEYEC3UXaWEAA/AqDkuN6xA==" }, "eslint-plugin-testing-library": { "version": "5.0.4", @@ -24916,8 +24907,7 @@ "icss-utils": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz", - "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==", - "requires": {} + "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==" }, "idb": { "version": "6.1.5", @@ -25958,8 +25948,7 @@ "jest-pnp-resolver": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.2.tgz", - "integrity": "sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w==", - "requires": {} + "integrity": "sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w==" }, "jest-regex-util": { "version": "27.4.0", @@ -27923,8 +27912,7 @@ "postcss-browser-comments": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/postcss-browser-comments/-/postcss-browser-comments-4.0.0.tgz", - "integrity": "sha512-X9X9/WN3KIvY9+hNERUqX9gncsgBA25XaeR+jshHz2j8+sYyHktHw1JdKuMjeLpGktXidqDhA7b/qm1mrBDmgg==", - "requires": {} + "integrity": "sha512-X9X9/WN3KIvY9+hNERUqX9gncsgBA25XaeR+jshHz2j8+sYyHktHw1JdKuMjeLpGktXidqDhA7b/qm1mrBDmgg==" }, "postcss-calc": { "version": "8.2.2", @@ -27981,8 +27969,7 @@ "postcss-custom-media": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/postcss-custom-media/-/postcss-custom-media-8.0.0.tgz", - "integrity": "sha512-FvO2GzMUaTN0t1fBULDeIvxr5IvbDXcIatt6pnJghc736nqNgsGao5NT+5+WVLAQiTt6Cb3YUms0jiPaXhL//g==", - "requires": {} + "integrity": "sha512-FvO2GzMUaTN0t1fBULDeIvxr5IvbDXcIatt6pnJghc736nqNgsGao5NT+5+WVLAQiTt6Cb3YUms0jiPaXhL//g==" }, "postcss-custom-properties": { "version": "12.1.3", @@ -28011,26 +27998,22 @@ "postcss-discard-comments": { "version": "5.0.2", "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-5.0.2.tgz", - "integrity": "sha512-6VQ3pYTsJHEsN2Bic88Aa7J/Brn4Bv8j/rqaFQZkH+pcVkKYwxCIvoMQkykEW7fBjmofdTnQgcivt5CCBJhtrg==", - "requires": {} + "integrity": "sha512-6VQ3pYTsJHEsN2Bic88Aa7J/Brn4Bv8j/rqaFQZkH+pcVkKYwxCIvoMQkykEW7fBjmofdTnQgcivt5CCBJhtrg==" }, "postcss-discard-duplicates": { "version": "5.0.2", "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-5.0.2.tgz", - "integrity": "sha512-LKY81YjUjc78p6rbXIsnppsaFo8XzCoMZkXVILJU//sK0DgPkPSpuq/cZvHss3EtdKvWNYgWzQL+wiJFtEET4g==", - "requires": {} + "integrity": "sha512-LKY81YjUjc78p6rbXIsnppsaFo8XzCoMZkXVILJU//sK0DgPkPSpuq/cZvHss3EtdKvWNYgWzQL+wiJFtEET4g==" }, "postcss-discard-empty": { "version": "5.0.2", "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-5.0.2.tgz", - "integrity": "sha512-SxBsbTjlsKUvZLL+dMrdWauuNZU8TBq5IOL/DHa6jBUSXFEwmDqeXRfTIK/FQpPTa8MJMxEHjSV3UbiuyLARPQ==", - "requires": {} + "integrity": "sha512-SxBsbTjlsKUvZLL+dMrdWauuNZU8TBq5IOL/DHa6jBUSXFEwmDqeXRfTIK/FQpPTa8MJMxEHjSV3UbiuyLARPQ==" }, "postcss-discard-overridden": { "version": "5.0.3", "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-5.0.3.tgz", - "integrity": "sha512-yRTXknIZA4k8Yo4FiF1xbsLj/VBxfXEWxJNIrtIy6HC9KQ4xJxcPtoaaskh6QptCGrrcGnhKsTsENTRPZOBu4g==", - "requires": {} + "integrity": "sha512-yRTXknIZA4k8Yo4FiF1xbsLj/VBxfXEWxJNIrtIy6HC9KQ4xJxcPtoaaskh6QptCGrrcGnhKsTsENTRPZOBu4g==" }, "postcss-double-position-gradients": { "version": "3.0.4", @@ -28051,8 +28034,7 @@ "postcss-flexbugs-fixes": { "version": "5.0.2", "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-5.0.2.tgz", - "integrity": "sha512-18f9voByak7bTktR2QgDveglpn9DTbBWPUzSOe9g0N4WR/2eSt6Vrcbf0hmspvMI6YWGywz6B9f7jzpFNJJgnQ==", - "requires": {} + "integrity": "sha512-18f9voByak7bTktR2QgDveglpn9DTbBWPUzSOe9g0N4WR/2eSt6Vrcbf0hmspvMI6YWGywz6B9f7jzpFNJJgnQ==" }, "postcss-focus-visible": { "version": "6.0.3", @@ -28073,14 +28055,12 @@ "postcss-font-variant": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/postcss-font-variant/-/postcss-font-variant-5.0.0.tgz", - "integrity": "sha512-1fmkBaCALD72CK2a9i468mA/+tr9/1cBxRRMXOUaZqO43oWPR5imcyPjXwuv7PXbCid4ndlP5zWhidQVVa3hmA==", - "requires": {} + "integrity": "sha512-1fmkBaCALD72CK2a9i468mA/+tr9/1cBxRRMXOUaZqO43oWPR5imcyPjXwuv7PXbCid4ndlP5zWhidQVVa3hmA==" }, "postcss-gap-properties": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/postcss-gap-properties/-/postcss-gap-properties-3.0.2.tgz", - "integrity": "sha512-EaMy/pbxtQnKDsnbEjdqlkCkROTQZzolcLKgIE+3b7EuJfJydH55cZeHfm+MtIezXRqhR80VKgaztO/vHq94Fw==", - "requires": {} + "integrity": "sha512-EaMy/pbxtQnKDsnbEjdqlkCkROTQZzolcLKgIE+3b7EuJfJydH55cZeHfm+MtIezXRqhR80VKgaztO/vHq94Fw==" }, "postcss-image-set-function": { "version": "4.0.4", @@ -28093,8 +28073,7 @@ "postcss-initial": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/postcss-initial/-/postcss-initial-4.0.1.tgz", - "integrity": "sha512-0ueD7rPqX8Pn1xJIjay0AZeIuDoF+V+VvMt/uOnn+4ezUKhZM/NokDeP6DwMNyIoYByuN/94IQnt5FEkaN59xQ==", - "requires": {} + "integrity": "sha512-0ueD7rPqX8Pn1xJIjay0AZeIuDoF+V+VvMt/uOnn+4ezUKhZM/NokDeP6DwMNyIoYByuN/94IQnt5FEkaN59xQ==" }, "postcss-js": { "version": "4.0.0", @@ -28134,14 +28113,12 @@ "postcss-logical": { "version": "5.0.3", "resolved": "https://registry.npmjs.org/postcss-logical/-/postcss-logical-5.0.3.tgz", - "integrity": "sha512-P5NcHWYrif0vK8rgOy/T87vg0WRIj3HSknrvp1wzDbiBeoDPVmiVRmkown2eSQdpPveat/MC1ess5uhzZFVnqQ==", - "requires": {} + "integrity": "sha512-P5NcHWYrif0vK8rgOy/T87vg0WRIj3HSknrvp1wzDbiBeoDPVmiVRmkown2eSQdpPveat/MC1ess5uhzZFVnqQ==" }, "postcss-media-minmax": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/postcss-media-minmax/-/postcss-media-minmax-5.0.0.tgz", - "integrity": "sha512-yDUvFf9QdFZTuCUg0g0uNSHVlJ5X1lSzDZjPSFaiCWvjgsvu8vEVxtahPrLMinIDEEGnx6cBe6iqdx5YWz08wQ==", - "requires": {} + "integrity": "sha512-yDUvFf9QdFZTuCUg0g0uNSHVlJ5X1lSzDZjPSFaiCWvjgsvu8vEVxtahPrLMinIDEEGnx6cBe6iqdx5YWz08wQ==" }, "postcss-merge-longhand": { "version": "5.0.5", @@ -28202,8 +28179,7 @@ "postcss-modules-extract-imports": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz", - "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==", - "requires": {} + "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==" }, "postcss-modules-local-by-default": { "version": "4.0.0", @@ -28260,8 +28236,7 @@ "postcss-normalize-charset": { "version": "5.0.2", "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-5.0.2.tgz", - "integrity": "sha512-fEMhYXzO8My+gC009qDc/3bgnFP8Fv1Ic8uw4ec4YTlhIOw63tGPk1YFd7fk9bZUf1DAbkhiL/QPWs9JLqdF2g==", - "requires": {} + "integrity": "sha512-fEMhYXzO8My+gC009qDc/3bgnFP8Fv1Ic8uw4ec4YTlhIOw63tGPk1YFd7fk9bZUf1DAbkhiL/QPWs9JLqdF2g==" }, "postcss-normalize-display-values": { "version": "5.0.2", @@ -28341,14 +28316,12 @@ "postcss-overflow-shorthand": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/postcss-overflow-shorthand/-/postcss-overflow-shorthand-3.0.2.tgz", - "integrity": "sha512-odBMVt6PTX7jOE9UNvmnLrFzA9pXS44Jd5shFGGtSHY80QCuJF+14McSy0iavZggRZ9Oj//C9vOKQmexvyEJMg==", - "requires": {} + "integrity": "sha512-odBMVt6PTX7jOE9UNvmnLrFzA9pXS44Jd5shFGGtSHY80QCuJF+14McSy0iavZggRZ9Oj//C9vOKQmexvyEJMg==" }, "postcss-page-break": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/postcss-page-break/-/postcss-page-break-3.0.4.tgz", - "integrity": "sha512-1JGu8oCjVXLa9q9rFTo4MbeeA5FMe00/9C7lN4va606Rdb+HkxXtXsmEDrIraQ11fGz/WvKWa8gMuCKkrXpTsQ==", - "requires": {} + "integrity": "sha512-1JGu8oCjVXLa9q9rFTo4MbeeA5FMe00/9C7lN4va606Rdb+HkxXtXsmEDrIraQ11fGz/WvKWa8gMuCKkrXpTsQ==" }, "postcss-place": { "version": "7.0.3", @@ -28426,8 +28399,7 @@ "postcss-replace-overflow-wrap": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/postcss-replace-overflow-wrap/-/postcss-replace-overflow-wrap-4.0.0.tgz", - "integrity": "sha512-KmF7SBPphT4gPPcKZc7aDkweHiKEEO8cla/GjcBK+ckKxiZslIu3C4GCRW3DNfL0o7yW7kMQu9xlZ1kXRXLXtw==", - "requires": {} + "integrity": "sha512-KmF7SBPphT4gPPcKZc7aDkweHiKEEO8cla/GjcBK+ckKxiZslIu3C4GCRW3DNfL0o7yW7kMQu9xlZ1kXRXLXtw==" }, "postcss-selector-not": { "version": "5.0.0", @@ -28738,8 +28710,7 @@ "react-async": { "version": "10.0.1", "resolved": "https://registry.npmjs.org/react-async/-/react-async-10.0.1.tgz", - "integrity": "sha512-ORUz5ca0B57QgBIzEZM5SuhJ6xFjkvEEs0gylLNlWf06vuVcLZsjIw3wx58jJkZG38p+0nUAxRgFW2b7mnVZzA==", - "requires": {} + "integrity": "sha512-ORUz5ca0B57QgBIzEZM5SuhJ6xFjkvEEs0gylLNlWf06vuVcLZsjIw3wx58jJkZG38p+0nUAxRgFW2b7mnVZzA==" }, "react-bootstrap": { "version": "2.1.1", @@ -28906,8 +28877,7 @@ "react-icons": { "version": "4.3.1", "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.3.1.tgz", - "integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==", - "requires": {} + "integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==" }, "react-is": { "version": "17.0.2", @@ -28930,8 +28900,7 @@ "react-onclickoutside": { "version": "6.12.1", "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.12.1.tgz", - "integrity": "sha512-a5Q7CkWznBRUWPmocCvE8b6lEYw1s6+opp/60dCunhO+G6E4tDTO2Sd2jKE+leEnnrLAE2Wj5DlDHNqj5wPv1Q==", - "requires": {} + "integrity": "sha512-a5Q7CkWznBRUWPmocCvE8b6lEYw1s6+opp/60dCunhO+G6E4tDTO2Sd2jKE+leEnnrLAE2Wj5DlDHNqj5wPv1Q==" }, "react-popper": { "version": "2.2.5", @@ -30156,8 +30125,7 @@ "style-loader": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-3.3.1.tgz", - "integrity": "sha512-GPcQ+LDJbrcxHORTRes6Jy2sfvK2kS6hpSfI/fXhPt+spVzxF6LJ1dHLN9zIGmVaaP044YKaIatFaufENRiDoQ==", - "requires": {} + "integrity": "sha512-GPcQ+LDJbrcxHORTRes6Jy2sfvK2kS6hpSfI/fXhPt+spVzxF6LJ1dHLN9zIGmVaaP044YKaIatFaufENRiDoQ==" }, "styled-components": { "version": "5.3.3", @@ -31097,8 +31065,7 @@ "ws": { "version": "8.4.2", "resolved": "https://registry.npmjs.org/ws/-/ws-8.4.2.tgz", - "integrity": "sha512-Kbk4Nxyq7/ZWqr/tarI9yIt/+iNNFOjBXEWgTb4ydaNHBNGgvf2QHbS9fdfsndfjFlFwEd4Al+mw83YkaD10ZA==", - "requires": {} + "integrity": "sha512-Kbk4Nxyq7/ZWqr/tarI9yIt/+iNNFOjBXEWgTb4ydaNHBNGgvf2QHbS9fdfsndfjFlFwEd4Al+mw83YkaD10ZA==" } } }, @@ -31557,8 +31524,7 @@ "ws": { "version": "7.5.6", "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.6.tgz", - "integrity": "sha512-6GLgCqo2cy2A2rjCNFlxQS6ZljG/coZfZXclldI8FB/1G3CCI36Zd8xy2HrFVACi8tfk5XrgLQEk+P0Tnz9UcA==", - "requires": {} + "integrity": "sha512-6GLgCqo2cy2A2rjCNFlxQS6ZljG/coZfZXclldI8FB/1G3CCI36Zd8xy2HrFVACi8tfk5XrgLQEk+P0Tnz9UcA==" }, "xml-name-validator": { "version": "3.0.0", diff --git a/src/components/meetingroom/VideoRoomComponent copy.js b/src/components/meetingroom/VideoRoomComponent copy.js index 9ea5926..6e99748 100644 --- a/src/components/meetingroom/VideoRoomComponent copy.js +++ b/src/components/meetingroom/VideoRoomComponent copy.js @@ -1,655 +1,649 @@ -import React, { Component, useState } from 'react'; +import React, { Component } from 'react'; import axios from 'axios'; import './VideoRoomComponent.css'; import { OpenVidu } from 'openvidu-browser'; - - import StreamComponent from './stream/StreamComponent'; import DialogExtensionComponent from './dialog-extension/DialogExtension'; import ChatComponent from './chat/ChatComponent'; + import OpenViduLayout from '../../layout/openvidu-layout'; import UserModel from '../../models/user-model'; import ToolbarComponent from './toolbar/ToolbarComponent'; -import TimeComponent from './time/TimeComponent'; -import UserComponent from './user/userComponent'; var localUser = new UserModel(); +const token = localStorage.getItem('accessToken'); +var postData; +var Nickname; +class VideoRoomComponent extends Component { + constructor(props) { + super(props); + this.OPENVIDU_SERVER_URL = 'https://i6a301.p.ssafy.io:8080'; + // this.OPENVIDU_SERVER_SECRET = this.props.openviduSecret ? this.props.openviduSecret : 'MY_SECRET'; + this.hasBeenUpdated = false; + this.layout = new OpenViduLayout(); + let sessionName = this.props.sessionName ? this.props.sessionName : 'SessionA'; + let userName = this.props.user ? this.props.user : 'OpenVidu_User' + Math.floor(Math.random() * 100); + this.remotes = []; + this.localUserAccessAllowed = false; + this.state = { + mySessionId: sessionName, + myUserName: userName, + session: undefined, + localUser: undefined, + subscribers: [], + chatDisplay: 'none', + currentVideoDevice: undefined, + }; + + this.joinSession = this.joinSession.bind(this); + this.leaveSession = this.leaveSession.bind(this); + this.onbeforeunload = this.onbeforeunload.bind(this); + this.updateLayout = this.updateLayout.bind(this); + this.camStatusChanged = this.camStatusChanged.bind(this); + this.micStatusChanged = this.micStatusChanged.bind(this); + this.nicknameChanged = this.nicknameChanged.bind(this); + this.toggleFullscreen = this.toggleFullscreen.bind(this); + this.switchCamera = this.switchCamera.bind(this); + this.screenShare = this.screenShare.bind(this); + this.stopScreenShare = this.stopScreenShare.bind(this); + this.closeDialogExtension = this.closeDialogExtension.bind(this); + this.toggleChat = this.toggleChat.bind(this); + this.checkNotification = this.checkNotification.bind(this); + this.checkSize = this.checkSize.bind(this); + } -var sessionToken; -var meetingSeq; -var isHost; -var meetingTitle; -var meetingDesc; -var meetingCapacity; -var meetingHeadcount; -var meetingDate; -var meetingStartTime; -var userName; + componentDidMount() { + const openViduLayoutOptions = { + maxRatio: 3 / 2, // The narrowest ratio that will be used (default 2x3) + minRatio: 9 / 16, // The widest ratio that will be used (default 16x9) + fixedRatio: false, // If this is true then the aspect ratio of the video is maintained and minRatio and maxRatio are ignored (default false) + bigClass: 'OV_big', // The class to add to elements that should be sized bigger + bigPercentage: 0.8, // The maximum percentage of space the big ones should take up + bigFixedRatio: false, // fixedRatio for the big ones + bigMaxRatio: 3 / 2, // The narrowest ratio to use for the big elements (default 2x3) + bigMinRatio: 9 / 16, // The widest ratio to use for the big elements (default 16x9) + bigFirst: true, // Whether to place the big one in the top left (true) or bottom right + animate: true, // Whether you want to animate the transitions + }; + + this.layout.initLayoutContainer(document.getElementById('layout'), openViduLayoutOptions); + window.addEventListener('beforeunload', this.onbeforeunload); + window.addEventListener('resize', this.updateLayout); + window.addEventListener('resize', this.checkSize); + this.joinSession(); + } -class VideoRoomComponent extends Component { - constructor(props) { - super(props); - // this.OPENVIDU_SERVER_URL = this.props.openviduServerUrl - // ? this.props.openviduServerUrl - // : 'https://' + window.location.hostname + ':4443'; - this.OPENVIDU_SERVER_URL = 'http://localhost:8080'; - this.hasBeenUpdated = false; - this.layout = new OpenViduLayout(); - // let sessionName = this.props.sessionName ? this.props.sessionName : 'SessionA'; - let sessionName = meetingSeq; - this.remotes = []; - this.localUserAccessAllowed = false; - this.state = { - mySessionId: sessionName, - myUserName: userName, - session: undefined, - localUser: undefined, - subscribers: [], - chatDisplay: 'block', - currentVideoDevice: undefined, - time: undefined, - isPaused: undefined, - }; - this.joinSession = this.joinSession.bind(this); - this.leaveSession = this.leaveSession.bind(this); - this.onbeforeunload = this.onbeforeunload.bind(this); - this.updateLayout = this.updateLayout.bind(this); - this.camStatusChanged = - this.camStatusChanged.bind(this); - this.micStatusChanged = - this.micStatusChanged.bind(this); - this.nicknameChanged = this.nicknameChanged.bind(this); - this.toggleFullscreen = - this.toggleFullscreen.bind(this); - this.switchCamera = this.switchCamera.bind(this); - this.screenShare = this.screenShare.bind(this); - this.stopScreenShare = this.stopScreenShare.bind(this); - this.closeDialogExtension = - this.closeDialogExtension.bind(this); - this.toggleChat = this.toggleChat.bind(this); - this.checkNotification = - this.checkNotification.bind(this); - this.checkSize = this.checkSize.bind(this); - this.loginToken = this.loginToken.bind(this); - this.isHostfun = this.isHostfun.bind(this); - this.setTime = this.setTime.bind(this); - this.setPause = this.setPause.bind(this); - this.userlist = this.userlist.bind(this); - } - isHostfun() { - if (isHost === 0) { - return false; - } else if (isHost === 1) { - return true; + componentWillUnmount() { + window.removeEventListener('beforeunload', this.onbeforeunload); + window.removeEventListener('resize', this.updateLayout); + window.removeEventListener('resize', this.checkSize); + this.leaveSession(); } - } - loginToken() { - const token = localStorage.getItem('accessToken'); - console.log(token); - } - userlist(){ - console.log("local "+ this.localUser) - console.log("userlist: 유저가 없니이이잉" +this.state.subscribers) - } - componentDidMount() { - const openViduLayoutOptions = { - maxRatio: 3 / 2, // The narrowest ratio that will be used (default 2x3) - minRatio: 9 / 16, // The widest ratio that will be used (default 16x9) - fixedRatio: false, // If this is true then the aspect ratio of the video is maintained and minRatio and maxRatio are ignored (default false) - bigClass: 'OV_big', // The class to add to elements that should be sized bigger - bigPercentage: 0.8, // The maximum percentage of space the big ones should take up - bigFixedRatio: false, // fixedRatio for the big ones - bigMaxRatio: 3 / 2, // The narrowest ratio to use for the big elements (default 2x3) - bigMinRatio: 9 / 16, // The widest ratio to use for the big elements (default 16x9) - bigFirst: true, // Whether to place the big one in the top left (true) or bottom right - animate: true, // Whether you want to animate the transitions - }; - // sessionToken = null; - this.layout.initLayout( - document.getElementById('layout'), - openViduLayoutOptions - ); - window.addEventListener( - 'beforeunload', - this.onbeforeunload - ); - window.addEventListener('resize', this.updateLayout); - window.addEventListener('resize', this.checkSize); - this.joinSession(); - this.loginToken(); - } - - componentWillUnmount() { - window.removeEventListener( - 'beforeunload', - this.onbeforeunload - ); - window.removeEventListener('resize', this.updateLayout); - window.removeEventListener('resize', this.checkSize); - this.leaveSession(); - } - - onbeforeunload(event) { - this.leaveSession(); - } - - joinSession() { - this.OV = new OpenVidu(); - - this.setState( - { - session: this.OV.initSession(), - }, - () => { - this.subscribeToStreamCreated(); - this.connectToSession(); - } - ); - } - - async connectWebCam() { - var devices = await this.OV.getDevices(); - var videoDevices = devices.filter( - (device) => device.kind === 'videoinput' - ); - - let publisher = this.OV.initPublisher(undefined, { - audioSource: undefined, - videoSource: videoDevices[0].deviceId, - publishAudio: localUser.isAudioActive(), - publishVideo: localUser.isVideoActive(), - resolution: '640x480', - frameRate: 30, - insertMode: 'APPEND', - }); - if (this.state.session.capabilities.publish) { - publisher.on('accessAllowed', () => { - this.state.session.publish(publisher).then(() => { - this.updateSubscribers(); - this.localUserAccessAllowed = true; - if (this.props.joinSession) { - this.props.joinSession(); - } - }); - }); + onbeforeunload(event) { + this.leaveSession(); } - localUser.setNickname(this.state.nickname); - localUser.setConnectionId( - this.state.session.connection.connectionId - ); - localUser.setScreenShareActive(false); - localUser.setStreamManager(publisher); - this.subscribeToUserChanged(); - this.subscribeToStreamDestroyed(); - this.sendSignalUserChanged({ - isScreenShareActive: localUser.isScreenShareActive(), - }); - this.setState( - { - currentVideoDevice: videoDevices[0], - localUser: localUser, - }, - () => { - this.state.localUser - .getStreamManager() - .on('streamPlaying', (e) => { - this.updateLayout(); - publisher.videos[0].video.parentElement.classList.remove( - 'custom-class' - ); - }); - } - ); - } - - updateSubscribers() { - var subscribers = this.remotes; - this.setState( - { - subscribers: subscribers, - }, - () => { - if (this.state.localUser) { - this.sendSignalUserChanged({ - isAudioActive: - this.state.localUser.isAudioActive(), - isVideoActive: - this.state.localUser.isVideoActive(), - nickname: userName, - isScreenShareActive: - this.state.localUser.isScreenShareActive(), - }); - } - this.updateLayout(); - } - ); - } - - setTime(timeCom) { - this.state.time = timeCom; - } - setPause(isPausedCom) { - this.state.isPaused = isPausedCom; - } - leaveSession(sessionId) { - const mySession = this.state.session; - - this.userlist(); - - if (mySession) { - mySession.disconnect(); - // sessionToken = null; - // this.props.setIsPaused(true); + joinSession() { + this.OV = new OpenVidu(); + + this.setState( + { + session: this.OV.initSession(), + }, + () => { + this.subscribeToStreamCreated(); + this.connectToSession(); + }, + ); } - if (!this.state.isPaused) { - console.log(this.state.isPaused); + + connectToSession() { + if (this.props.token !== undefined) { + console.log('token received: ', this.props.token); + this.connect(this.props.token); + } else { + this.getToken().then((token) => { + console.log(token); + this.connect(token); + }).catch((error) => { + if(this.props.error){ + this.props.error({ error: error.error, messgae: error.message, code: error.code, status: error.status }); + } + console.log('There was an error getting the token:', error.code, error.message); + alert('There was an error getting the token:', error.message); + }); + } } - // Empty all properties... - this.OV = null; - this.setState({ - session: undefined, - subscribers: [], - mySessionId: 'SessionA', - myUserName: - 'OpenVidu_User' + Math.floor(Math.random() * 100), - localUser: undefined, - }); - if (this.props.leaveSession) { - this.props.leaveSession(); + + connect(token) { + this.state.session + .connect( + token, + { clientData: this.state.myUserName }, + ) + .then(() => { + this.connectWebCam(); + }) + .catch((error) => { + if(this.props.error){ + this.props.error({ error: error.error, messgae: error.message, code: error.code, status: error.status }); + } + alert('There was an error connecting to the session:', error.message); + console.log('There was an error connecting to the session:', error.code, error.message); + }); } - return new Promise((resolve, reject) => { - // var data = JSON.stringify({ - // sessionToken: sessionToken, - // logMeeting: '40', - // logStartTime: '06:58:40' - // }); - console.log('sessiontoken : ', sessionToken); - const token = localStorage.getItem('accessToken'); - axios - .delete('/meetings/1/room', { - data: { - sessionToken: sessionToken, - logMeeting: this.state.time / 60, //총공부한시간 - logStartTime: meetingStartTime, - }, - - headers: { - Authorization: 'Bearer ' + token, - 'Content-Type': 'application/json', - }, - }) - .then((response) => { - console.log('Leave', response); - resolve(response.data.token); - }) - .catch((error) => { - console.log('LEAVE ERROR : ' + error); - reject(error); + async connectWebCam() { + var devices = await this.OV.getDevices(); + var videoDevices = devices.filter(device => device.kind === 'videoinput'); + + let publisher = this.OV.initPublisher(undefined, { + audioSource: undefined, + videoSource: videoDevices[0].deviceId, + publishAudio: localUser.isAudioActive(), + publishVideo: localUser.isVideoActive(), + resolution: '640x480', + frameRate: 30, + insertMode: 'APPEND', + }); + + if (this.state.session.capabilities.publish) { + publisher.on('accessAllowed' , () => { + this.state.session.publish(publisher).then(() => { + this.updateSubscribers(); + this.localUserAccessAllowed = true; + if (this.props.joinSession) { + this.props.joinSession(); + } + }); + }); + + } + localUser.setNickname(this.state.myUserName); + localUser.setConnectionId(this.state.session.connection.connectionId); + localUser.setScreenShareActive(false); + localUser.setStreamManager(publisher); + this.subscribeToUserChanged(); + this.subscribeToStreamDestroyed(); + this.sendSignalUserChanged({ isScreenShareActive: localUser.isScreenShareActive() }); + + this.setState({ currentVideoDevice: videoDevices[0], localUser: localUser }, () => { + this.state.localUser.getStreamManager().on('streamPlaying', (e) => { + this.updateLayout(); + publisher.videos[0].video.parentElement.classList.remove('custom-class'); + }); }); - }); - - } - camStatusChanged() { - localUser.setVideoActive(!localUser.isVideoActive()); - localUser - .getStreamManager() - .publishVideo(localUser.isVideoActive()); - this.sendSignalUserChanged({ - isVideoActive: localUser.isVideoActive(), - }); - this.setState({ localUser: localUser }); - } - - micStatusChanged() { - localUser.setAudioActive(!localUser.isAudioActive()); - localUser - .getStreamManager() - .publishAudio(localUser.isAudioActive()); - this.sendSignalUserChanged({ - isAudioActive: localUser.isAudioActive(), - }); - this.setState({ localUser: localUser }); - } - - nicknameChanged(nickname) { - let localUser = this.state.localUser; - localUser.setNickname(nickname); - this.setState({ localUser: localUser }); - this.sendSignalUserChanged({ - nickname: this.state.localUser.getNickname(), - }); - } - - deleteSubscriber(stream) { - const remoteUsers = this.state.subscribers; - const userStream = remoteUsers.filter( - (user) => user.getStreamManager().stream === stream - )[0]; - let index = remoteUsers.indexOf(userStream, 0); - if (index > -1) { - remoteUsers.splice(index, 1); - this.setState({ - subscribers: remoteUsers, - }); } - } - subscribeToStreamCreated() { - this.state.session.on('streamCreated', (event) => { - const subscriber = this.state.session.subscribe( - event.stream, - undefined - ); - // var subscribers = this.state.subscribers; - subscriber.on('streamPlaying', (e) => { - this.checkSomeoneShareScreen(); - subscriber.videos[0].video.parentElement.classList.remove( - 'custom-class' + updateSubscribers() { + var subscribers = this.remotes; + this.setState( + { + subscribers: subscribers, + }, + () => { + if (this.state.localUser) { + this.sendSignalUserChanged({ + isAudioActive: this.state.localUser.isAudioActive(), + isVideoActive: this.state.localUser.isVideoActive(), + nickname: this.state.localUser.getNickname(), + isScreenShareActive: this.state.localUser.isScreenShareActive(), + }); + } + this.updateLayout(); + }, ); - }); - const newUser = new UserModel(); - newUser.setStreamManager(subscriber); - newUser.setConnectionId( - event.stream.connection.connectionId - ); - newUser.setType('remote'); - const nickname = - event.stream.connection.data.split('%')[0]; - newUser.setNickname(JSON.parse(nickname).clientData); - this.remotes.push(newUser); - if (this.localUserAccessAllowed) { - this.updateSubscribers(); - } - }); - } - - subscribeToStreamDestroyed() { - // On every Stream destroyed... - this.state.session.on('streamDestroyed', (event) => { - // Remove the stream from 'subscribers' array - this.deleteSubscriber(event.stream); - setTimeout(() => { - this.checkSomeoneShareScreen(); - }, 20); - event.preventDefault(); - this.updateLayout(); - }); - } + } - subscribeToUserChanged() { - this.state.session.on('signal:userChanged', (event) => { - let remoteUsers = this.state.subscribers; - remoteUsers.forEach((user) => { - if ( - user.getConnectionId() === event.from.connectionId - ) { - const data = JSON.parse(event.data); - console.log('EVENTO REMOTE: ', event.data); - if (data.isAudioActive !== undefined) { - user.setAudioActive(data.isAudioActive); - } - if (data.isVideoActive !== undefined) { - user.setVideoActive(data.isVideoActive); - } - if (data.nickname !== undefined) { - user.setNickname(data.nickname); - } - if (data.isScreenShareActive !== undefined) { - user.setScreenShareActive( - data.isScreenShareActive - ); - } + leaveSession() { + const mySession = this.state.session; + + if (mySession) { + mySession.disconnect(); + } + + // Empty all properties... + this.OV = null; + this.setState({ + session: undefined, + subscribers: [], + mySessionId: 'SessionA', + myUserName: 'OpenVidu_User' + Math.floor(Math.random() * 100), + localUser: undefined, + }); + if (this.props.leaveSession) { + this.props.leaveSession(); } - }); - this.setState( - { - subscribers: remoteUsers, - }, - () => this.checkSomeoneShareScreen() - ); - }); - } - - updateLayout() { - setTimeout(() => { - this.layout.updateLayout(); - }, 20); - } - - sendSignalUserChanged(data) { - const signalOptions = { - data: JSON.stringify(data), - type: 'userChanged', - }; - this.state.session.signal(signalOptions); - } - - toggleFullscreen() { - const document = window.document; - const fs = document.getElementById('container'); - if ( - !document.fullscreenElement && - !document.mozFullScreenElement && - !document.webkitFullscreenElement && - !document.msFullscreenElement - ) { - if (fs.requestFullscreen) { - fs.requestFullscreen(); - } else if (fs.msRequestFullscreen) { - fs.msRequestFullscreen(); - } else if (fs.mozRequestFullScreen) { - fs.mozRequestFullScreen(); - } else if (fs.webkitRequestFullscreen) { - fs.webkitRequestFullscreen(); - } - } else { - if (document.exitFullscreen) { - document.exitFullscreen(); - } else if (document.msExitFullscreen) { - document.msExitFullscreen(); - } else if (document.mozCancelFullScreen) { - document.mozCancelFullScreen(); - } else if (document.webkitExitFullscreen) { - document.webkitExitFullscreen(); - } } - } + camStatusChanged() { + localUser.setVideoActive(!localUser.isVideoActive()); + localUser.getStreamManager().publishVideo(localUser.isVideoActive()); + this.sendSignalUserChanged({ isVideoActive: localUser.isVideoActive() }); + this.setState({ localUser: localUser }); + } - async switchCamera() { - try { - const devices = await this.OV.getDevices(); - var videoDevices = devices.filter( - (device) => device.kind === 'videoinput' - ); + micStatusChanged() { + localUser.setAudioActive(!localUser.isAudioActive()); + localUser.getStreamManager().publishAudio(localUser.isAudioActive()); + this.sendSignalUserChanged({ isAudioActive: localUser.isAudioActive() }); + this.setState({ localUser: localUser }); + } - if (videoDevices && videoDevices.length > 1) { - var newVideoDevice = videoDevices.filter( - (device) => - device.deviceId !== - this.state.currentVideoDevice.deviceId - ); + nicknameChanged(nickname) { + let localUser = this.state.localUser; + localUser.setNickname(nickname); + this.setState({ localUser: localUser }); + this.sendSignalUserChanged({ nickname: this.state.localUser.getNickname() }); + } - if (newVideoDevice.length > 0) { - // Creating a new publisher with specific videoSource - // In mobile devices the default and first camera is the front one - var newPublisher = this.OV.initPublisher( - undefined, - { - audioSource: undefined, - videoSource: newVideoDevice[0].deviceId, - publishAudio: localUser.isAudioActive(), - publishVideo: localUser.isVideoActive(), - mirror: true, - } - ); - - //newPublisher.once("accessAllowed", () => { - await this.state.session.unpublish( - this.state.localUser.getStreamManager() - ); - await this.state.session.publish(newPublisher); - this.state.localUser.setStreamManager( - newPublisher - ); - this.setState({ - currentVideoDevice: newVideoDevice, - localUser: localUser, - }); + deleteSubscriber(stream) { + const remoteUsers = this.state.subscribers; + const userStream = remoteUsers.filter((user) => user.getStreamManager().stream === stream)[0]; + let index = remoteUsers.indexOf(userStream, 0); + if (index > -1) { + remoteUsers.splice(index, 1); + this.setState({ + subscribers: remoteUsers, + }); } - } - } catch (e) { - console.error(e); } - } - - screenShare() { - const videoSource = - navigator.userAgent.indexOf('Firefox') !== -1 - ? 'window' - : 'screen'; - const publisher = this.OV.initPublisher( - undefined, - { - videoSource: videoSource, - publishAudio: localUser.isAudioActive(), - publishVideo: localUser.isVideoActive(), - mirror: false, - }, - (error) => { + + subscribeToStreamCreated() { + this.state.session.on('streamCreated', (event) => { + const subscriber = this.state.session.subscribe(event.stream, undefined); + // var subscribers = this.state.subscribers; + subscriber.on('streamPlaying', (e) => { + this.checkSomeoneShareScreen(); + subscriber.videos[0].video.parentElement.classList.remove('custom-class'); + }); + const newUser = new UserModel(); + newUser.setStreamManager(subscriber); + newUser.setConnectionId(event.stream.connection.connectionId); + newUser.setType('remote'); + const nickname = event.stream.connection.data.split('%')[0]; + newUser.setNickname(JSON.parse(nickname).clientData); + this.remotes.push(newUser); + if(this.localUserAccessAllowed) { + this.updateSubscribers(); + } + }); + } + + subscribeToStreamDestroyed() { + // On every Stream destroyed... + this.state.session.on('streamDestroyed', (event) => { + // Remove the stream from 'subscribers' array + this.deleteSubscriber(event.stream); + setTimeout(() => { + this.checkSomeoneShareScreen(); + }, 20); + event.preventDefault(); + this.updateLayout(); + }); + } + + subscribeToUserChanged() { + this.state.session.on('signal:userChanged', (event) => { + let remoteUsers = this.state.subscribers; + remoteUsers.forEach((user) => { + if (user.getConnectionId() === event.from.connectionId) { + const data = JSON.parse(event.data); + console.log('EVENTO REMOTE: ', event.data); + if (data.isAudioActive !== undefined) { + user.setAudioActive(data.isAudioActive); + } + if (data.isVideoActive !== undefined) { + user.setVideoActive(data.isVideoActive); + } + if (data.nickname !== undefined) { + user.setNickname(data.nickname); + } + if (data.isScreenShareActive !== undefined) { + user.setScreenShareActive(data.isScreenShareActive); + } + } + }); + this.setState( + { + subscribers: remoteUsers, + }, + () => this.checkSomeoneShareScreen(), + ); + }); + } + + updateLayout() { + setTimeout(() => { + this.layout.updateLayout(); + }, 20); + } + + sendSignalUserChanged(data) { + const signalOptions = { + data: JSON.stringify(data), + type: 'userChanged', + }; + this.state.session.signal(signalOptions); + } + + toggleFullscreen() { + const document = window.document; + const fs = document.getElementById('container'); if ( - error && - error.name === 'SCREEN_EXTENSION_NOT_INSTALLED' - ) { - this.setState({ showExtensionDialog: true }); - } else if ( - error && - error.name === 'SCREEN_SHARING_NOT_SUPPORTED' - ) { - alert( - 'Your browser does not support screen sharing' - ); - } else if ( - error && - error.name === 'SCREEN_EXTENSION_DISABLED' - ) { - alert( - 'You need to enable screen sharing extension' - ); - } else if ( - error && - error.name === 'SCREEN_CAPTURE_DENIED' + !document.fullscreenElement && + !document.mozFullScreenElement && + !document.webkitFullscreenElement && + !document.msFullscreenElement ) { - alert( - 'You need to choose a window or application to share' - ); + if (fs.requestFullscreen) { + fs.requestFullscreen(); + } else if (fs.msRequestFullscreen) { + fs.msRequestFullscreen(); + } else if (fs.mozRequestFullScreen) { + fs.mozRequestFullScreen(); + } else if (fs.webkitRequestFullscreen) { + fs.webkitRequestFullscreen(); + } + } else { + if (document.exitFullscreen) { + document.exitFullscreen(); + } else if (document.msExitFullscreen) { + document.msExitFullscreen(); + } else if (document.mozCancelFullScreen) { + document.mozCancelFullScreen(); + } else if (document.webkitExitFullscreen) { + document.webkitExitFullscreen(); + } } - } - ); + } - publisher.once('accessAllowed', () => { - this.state.session.unpublish( - localUser.getStreamManager() - ); - localUser.setStreamManager(publisher); - this.state.session - .publish(localUser.getStreamManager()) - .then(() => { - localUser.setScreenShareActive(true); - this.setState({ localUser: localUser }, () => { - this.sendSignalUserChanged({ - isScreenShareActive: - localUser.isScreenShareActive(), + async switchCamera() { + try{ + const devices = await this.OV.getDevices() + var videoDevices = devices.filter(device => device.kind === 'videoinput'); + + if(videoDevices && videoDevices.length > 1) { + + var newVideoDevice = videoDevices.filter(device => device.deviceId !== this.state.currentVideoDevice.deviceId) + + if (newVideoDevice.length > 0) { + // Creating a new publisher with specific videoSource + // In mobile devices the default and first camera is the front one + var newPublisher = this.OV.initPublisher(undefined, { + audioSource: undefined, + videoSource: newVideoDevice[0].deviceId, + publishAudio: localUser.isAudioActive(), + publishVideo: localUser.isVideoActive(), + mirror: true + }); + + //newPublisher.once("accessAllowed", () => { + await this.state.session.unpublish(this.state.localUser.getStreamManager()); + await this.state.session.publish(newPublisher) + this.state.localUser.setStreamManager(newPublisher); + this.setState({ + currentVideoDevice: newVideoDevice, + localUser: localUser, + }); + } + } + } catch (e) { + console.error(e); + } + } + + screenShare() { + const videoSource = navigator.userAgent.indexOf('Firefox') !== -1 ? 'window' : 'screen'; + const publisher = this.OV.initPublisher( + undefined, + { + videoSource: videoSource, + publishAudio: localUser.isAudioActive(), + publishVideo: localUser.isVideoActive(), + mirror: false, + }, + (error) => { + if (error && error.name === 'SCREEN_EXTENSION_NOT_INSTALLED') { + this.setState({ showExtensionDialog: true }); + } else if (error && error.name === 'SCREEN_SHARING_NOT_SUPPORTED') { + alert('Your browser does not support screen sharing'); + } else if (error && error.name === 'SCREEN_EXTENSION_DISABLED') { + alert('You need to enable screen sharing extension'); + } else if (error && error.name === 'SCREEN_CAPTURE_DENIED') { + alert('You need to choose a window or application to share'); + } + }, + ); + + publisher.once('accessAllowed', () => { + this.state.session.unpublish(localUser.getStreamManager()); + localUser.setStreamManager(publisher); + this.state.session.publish(localUser.getStreamManager()).then(() => { + localUser.setScreenShareActive(true); + this.setState({ localUser: localUser }, () => { + this.sendSignalUserChanged({ isScreenShareActive: localUser.isScreenShareActive() }); + }); }); - }); }); - }); - publisher.on('streamPlaying', () => { - this.updateLayout(); - publisher.videos[0].video.parentElement.classList.remove( - 'custom-class' - ); - }); - } - - closeDialogExtension() { - this.setState({ showExtensionDialog: false }); - } - - stopScreenShare() { - this.state.session.unpublish( - localUser.getStreamManager() - ); - this.connectWebCam(); - } - - checkSomeoneShareScreen() { - let isScreenShared; - // return true if at least one passes the test - isScreenShared = - this.state.subscribers.some((user) => - user.isScreenShareActive() - ) || localUser.isScreenShareActive(); - const openviduLayoutOptions = { - maxRatio: 3 / 2, - minRatio: 9 / 16, - fixedRatio: isScreenShared, - bigClass: 'OV_big', - bigPercentage: 0.8, - bigFixedRatio: false, - bigMaxRatio: 3 / 2, - bigMinRatio: 9 / 16, - bigFirst: true, - animate: true, - }; - this.layout.setLayoutOptions(openviduLayoutOptions); - this.updateLayout(); - } - - toggleChat(property) { - let display = property; - - if (display === undefined) { - display = - this.state.chatDisplay === 'none' - ? 'block' - : 'none'; + publisher.on('streamPlaying', () => { + this.updateLayout(); + publisher.videos[0].video.parentElement.classList.remove('custom-class'); + }); } - if (display === 'block') { - this.setState({ - chatDisplay: display, - messageReceived: false, - }); - } else { - console.log('chat', display); - this.setState({ chatDisplay: display }); + + closeDialogExtension() { + this.setState({ showExtensionDialog: false }); } - this.updateLayout(); - } - checkNotification(event) { - this.setState({ - messageReceived: this.state.chatDisplay === 'none', - }); - } - checkSize() { - if ( - document.getElementById('layout').offsetWidth <= - 700 && - !this.hasBeenUpdated - ) { - this.toggleChat('none'); - this.hasBeenUpdated = true; + stopScreenShare() { + this.state.session.unpublish(localUser.getStreamManager()); + this.connectWebCam(); } - if ( - document.getElementById('layout').offsetWidth > 700 && - this.hasBeenUpdated - ) { - this.hasBeenUpdated = false; + + checkSomeoneShareScreen() { + let isScreenShared; + // return true if at least one passes the test + isScreenShared = this.state.subscribers.some((user) => user.isScreenShareActive()) || localUser.isScreenShareActive(); + const openviduLayoutOptions = { + maxRatio: 3 / 2, + minRatio: 9 / 16, + fixedRatio: isScreenShared, + bigClass: 'OV_big', + bigPercentage: 0.8, + bigFixedRatio: false, + bigMaxRatio: 3 / 2, + bigMinRatio: 9 / 16, + bigFirst: true, + animate: true, + }; + this.layout.setLayoutOptions(openviduLayoutOptions); + this.updateLayout(); } - } + toggleChat(property) { + let display = property; + + if (display === undefined) { + display = this.state.chatDisplay === 'none' ? 'block' : 'none'; + } + if (display === 'block') { + this.setState({ chatDisplay: display, messageReceived: false }); + } else { + console.log('chat', display); + this.setState({ chatDisplay: display }); + } + this.updateLayout(); + } + + checkNotification(event) { + this.setState({ + messageReceived: this.state.chatDisplay === 'none', + }); + } + checkSize() { + if (document.getElementById('layout').offsetWidth <= 700 && !this.hasBeenUpdated) { + this.toggleChat('none'); + this.hasBeenUpdated = true; + } + if (document.getElementById('layout').offsetWidth > 700 && this.hasBeenUpdated) { + this.hasBeenUpdated = false; + } + } + + render() { + const mySessionId = this.state.mySessionId; + const localUser = this.state.localUser; + var chatDisplay = { display: this.state.chatDisplay }; + + return ( +
+
+
+ + + + +
+ {/* publisher */} + {localUser !== undefined && localUser.getStreamManager() !== undefined && ( +
+ +
+ )} + {/* !host */} + {this.state.subscribers.map((sub, i) => ( +
+ +
+ ))} +
+
+
+ + +
+ ); + } + + /** + * -------------------------- + * SERVER-SIDE RESPONSIBILITY + * -------------------------- + * These methods retrieve the mandatory user token from OpenVidu Server. + * This behaviour MUST BE IN YOUR SERVER-SIDE IN PRODUCTION (by using + * the API REST, openvidu-java-client or openvidu-node-client): + * 1) Initialize a session in OpenVidu Server (POST /api/sessions) + * 2) Generate a token in OpenVidu Server (POST /api/tokens) + * 3) The token must be consumed in Session.connect() method + */ + + async getToken() { + const getToken = await this.createToken(this.state.mySessionId); + return getToken; + } + + // createSession(sessionId) { + // return new Promise((resolve, reject) => { + // var data = JSON.stringify({ customSessionId: sessionId }); + // axios + // .post(this.OPENVIDU_SERVER_URL + '/openvidu/api/sessions', data, { + // headers: { + // Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + this.OPENVIDU_SERVER_SECRET), + // 'Content-Type': 'application/json', + // }, + // }) + // .then((response) => { + // console.log('CREATE SESION', response); + // resolve(response.data.id); + // }) + // .catch((response) => { + // var error = Object.assign({}, response); + // if (error.response && error.response.status === 409) { + // resolve(sessionId); + // } else { + // console.log(error); + // console.warn( + // 'No connection to OpenVidu Server. This may be a certificate error at ' + this.OPENVIDU_SERVER_URL, + // ); + // if ( + // window.confirm( + // 'No connection to OpenVidu Server. This may be a certificate error at "' + + // this.OPENVIDU_SERVER_URL + + // '"\n\nClick OK to navigate and accept it. ' + + // 'If no certificate warning is shown, then check that your OpenVidu Server is up and running at "' + + // this.OPENVIDU_SERVER_URL + + // '"', + // ) + // ) { + // window.location.assign(this.OPENVIDU_SERVER_URL + '/accept-certificate'); + // } + // } + // }); + // }); + // } + + createToken(sessionId) { + return new Promise((resolve, reject) => { + var data = JSON.stringify({}); + axios + .all([ + axios.post(this.OPENVIDU_SERVER_URL+'/meetings/1/room', data, { + // .post(this.OPENVIDU_SERVER_URL + '/openvidu/api/sessions/' + sessionId + '/connection', data, { + headers: { + Authorization: 'Bearer ' + token, + 'Content-Type': 'application/json', + }, + }), + axios.get(this.OPENVIDU_SERVER_URL+'/users', { + // .post(this.OPENVIDU_SERVER_URL + '/openvidu/api/sessions/' + sessionId + '/connection', data, { + headers: { + Authorization: 'Bearer ' + token, + 'Content-Type': 'application/json', + }, + }), + ]) + .then( + axios.spread((resPost, resGet) => { + postData = resPost.data; + Nickname = resGet.data.user.userNickname; + + resolve(resPost.data.sessionToken); + + console.log('Nickname : ' + Nickname); + console.log('meetingSeq : ' + postData); + }) + ) + .catch((error) => reject(error)); + }); + } } export default VideoRoomComponent; diff --git a/src/index.js b/src/index.js index f19972e..5e40971 100644 --- a/src/index.js +++ b/src/index.js @@ -21,6 +21,7 @@ import HomeTodays from './pages/Home_todays'; import VideoRoomComponent from './components/meetingroom/VideoRoomComponent'; import MeetingroomVideo from './components/meetingroom/MeetingroomVideo'; import StudyRecruitCreate from './pages/studyRecruitCreate'; +import VideoRoomComponentCopy from './components/meetingroom/VideoRoomComponent copy' ReactDOM.render( @@ -74,6 +75,12 @@ ReactDOM.render( isLogin() ? : } /> + : + } + /> : } diff --git a/src/pages/Meetingrooms.js b/src/pages/Meetingrooms.js index 58775d2..4176109 100644 --- a/src/pages/Meetingrooms.js +++ b/src/pages/Meetingrooms.js @@ -35,6 +35,10 @@ export default function Meetingrooms() { {/* onClick={"window.location.reload();"} */} openvidu + + + copyfile +
diff --git a/yarn.lock b/yarn.lock index 53df952..d10c5c2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -23,7 +23,7 @@ "resolved" "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.16.8.tgz" "version" "7.16.8" -"@babel/core@^7.0.0", "@babel/core@^7.0.0-0", "@babel/core@^7.1.0", "@babel/core@^7.11.1", "@babel/core@^7.12.0", "@babel/core@^7.12.3", "@babel/core@^7.13.0", "@babel/core@^7.16.0", "@babel/core@^7.4.0-0", "@babel/core@^7.7.2", "@babel/core@^7.8.0", "@babel/core@>=7.11.0": +"@babel/core@^7.1.0", "@babel/core@^7.11.1", "@babel/core@^7.12.3", "@babel/core@^7.16.0", "@babel/core@^7.7.2", "@babel/core@^7.8.0": "integrity" "sha512-dK5PtG1uiN2ikk++5OzSYsitZKny4wOCD0nrO4TqnW4BVBTQ2NGS3NgilvT/TEyxTST7LNyWV/T4tXDoD3fOgg==" "resolved" "https://registry.npmjs.org/@babel/core/-/core-7.16.12.tgz" "version" "7.16.12" @@ -485,7 +485,7 @@ dependencies: "@babel/helper-plugin-utils" "^7.8.3" -"@babel/plugin-syntax-flow@^7.14.5", "@babel/plugin-syntax-flow@^7.16.7": +"@babel/plugin-syntax-flow@^7.16.7": "integrity" "sha512-UDo3YGQO0jH6ytzVwgSLv9i/CzMcUjbKenL67dTrAZPPv6GFAtDhe6jqnvmoKzC/7htNTohhos+onPtDMqJwaQ==" "resolved" "https://registry.npmjs.org/@babel/plugin-syntax-flow/-/plugin-syntax-flow-7.16.7.tgz" "version" "7.16.7" @@ -790,7 +790,7 @@ dependencies: "@babel/plugin-transform-react-jsx" "^7.16.7" -"@babel/plugin-transform-react-jsx@^7.14.9", "@babel/plugin-transform-react-jsx@^7.16.7": +"@babel/plugin-transform-react-jsx@^7.16.7": "integrity" "sha512-8D16ye66fxiE8m890w0BpPpngG9o9OVBBy0gH2E+2AR7qMR2ZpTYJEqLxAsoroenMId0p/wMW+Blc0meDgu0Ag==" "resolved" "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.16.7.tgz" "version" "7.16.7" @@ -1162,7 +1162,7 @@ "resolved" "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.36.tgz" "version" "0.2.36" -"@fortawesome/fontawesome-svg-core@^1.2.36", "@fortawesome/fontawesome-svg-core@~1 || >=1.3.0-beta1": +"@fortawesome/fontawesome-svg-core@^1.2.36": "integrity" "sha512-YUcsLQKYb6DmaJjIHdDWpBIGCcyE/W+p/LMGvjQem55Mm2XWVAP5kWTMKWLv9lwpCVjpLxPyOMOyUocP1GxrtA==" "resolved" "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.36.tgz" "version" "1.2.36" @@ -1418,7 +1418,7 @@ "@types/yargs" "^16.0.0" "chalk" "^4.0.0" -"@material-ui/core@^4.0.0", "@material-ui/core@4.9.10": +"@material-ui/core@4.9.10": "integrity" "sha512-CQuZU9Y10RkwSdxjn785kw2EPcXhv5GKauuVQufR9LlD37kjfn21Im1yvr6wsUzn81oLhEvVPz727UWC0gbqxg==" "resolved" "https://registry.npmjs.org/@material-ui/core/-/core-4.9.10.tgz" "version" "4.9.10" @@ -1541,7 +1541,7 @@ "schema-utils" "^3.0.0" "source-map" "^0.7.3" -"@popperjs/core@^2.0.0", "@popperjs/core@^2.10.1", "@popperjs/core@^2.10.2", "@popperjs/core@^2.9.2": +"@popperjs/core@^2.10.1", "@popperjs/core@^2.9.2": "integrity" "sha512-92FRmppjjqz29VMJ2dn+xdyXZBrMlE42AV6Kq6BwjWV7CNUW1hs2FtxSNLQE+gJhaZ6AAmYuO9y8dshhcBl7vA==" "resolved" "https://registry.npmjs.org/@popperjs/core/-/core-2.11.2.tgz" "version" "2.11.2" @@ -1745,7 +1745,7 @@ "@svgr/plugin-svgo" "^5.5.0" "loader-utils" "^2.0.0" -"@testing-library/dom@^8.0.0", "@testing-library/dom@>=7.21.4": +"@testing-library/dom@^8.0.0": "integrity" "sha512-idsS/cqbYudXcVWngc1PuWNmXs416oBy2g/7Q8QAUREt5Z3MUkAL2XJD7xazLJ6esDfqRDi/ZBxk+OPPXitHRw==" "resolved" "https://registry.npmjs.org/@testing-library/dom/-/dom-8.11.2.tgz" "version" "8.11.2" @@ -1804,7 +1804,7 @@ "resolved" "https://registry.npmjs.org/@types/aria-query/-/aria-query-4.2.2.tgz" "version" "4.2.2" -"@types/babel__core@^7.0.0", "@types/babel__core@^7.1.14", "@types/babel__core@^7.1.9": +"@types/babel__core@^7.0.0", "@types/babel__core@^7.1.14": "integrity" "sha512-S7unDjm/C7z2A2R9NzfKCK1I+BAALDtxEmsJBwlB3EzNfb929ykjL++1CK9LO++EIp2fQrC8O+BwjKvz6UeDyQ==" "resolved" "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.1.18.tgz" "version" "7.1.18" @@ -1902,7 +1902,7 @@ "@types/qs" "*" "@types/range-parser" "*" -"@types/express@*", "@types/express@^4.17.13": +"@types/express@*": "integrity" "sha512-6bSZTPaTIACxn48l50SR+axgrqm6qXFIxrdAKaG6PaJk3+zuUr35hBlgT7vOmJcum+OEaIBLtHV/qloEAFITeA==" "resolved" "https://registry.npmjs.org/@types/express/-/express-4.17.13.tgz" "version" "4.17.13" @@ -2030,7 +2030,7 @@ dependencies: "@types/react" "*" -"@types/react@*", "@types/react@^16.8.6", "@types/react@^16.8.6 || ^17.0.0", "@types/react@>=16.14.8", "@types/react@>=16.9.11": +"@types/react@*", "@types/react@>=16.14.8", "@types/react@>=16.9.11": "integrity" "sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ==" "resolved" "https://registry.npmjs.org/@types/react/-/react-17.0.38.tgz" "version" "17.0.38" @@ -2119,7 +2119,7 @@ dependencies: "@types/yargs-parser" "*" -"@typescript-eslint/eslint-plugin@^4.0.0 || ^5.0.0", "@typescript-eslint/eslint-plugin@^5.5.0": +"@typescript-eslint/eslint-plugin@^5.5.0": "integrity" "sha512-xN3CYqFlyE/qOcy978/L0xLR2HlcAGIyIK5sMOasxaaAPfQRj/MmMV6OC3I7NZO84oEUdWCOju34Z9W8E0pFDQ==" "resolved" "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.10.1.tgz" "version" "5.10.1" @@ -2141,7 +2141,7 @@ dependencies: "@typescript-eslint/utils" "5.10.1" -"@typescript-eslint/parser@^5.0.0", "@typescript-eslint/parser@^5.5.0": +"@typescript-eslint/parser@^5.5.0": "integrity" "sha512-GReo3tjNBwR5RnRO0K2wDIDN31cM3MmDtgyQ85oAxAmC5K3j/g85IjP+cDfcqDsDDBf1HNKQAD0WqOYL8jXqUA==" "resolved" "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.10.1.tgz" "version" "5.10.1" @@ -2387,11 +2387,6 @@ "resolved" "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz" "version" "7.2.0" -"acorn@^6.0.0 || ^7.0.0 || ^8.0.0", "acorn@^8", "acorn@^8.2.4", "acorn@^8.4.1", "acorn@^8.5.0", "acorn@^8.7.0": - "integrity" "sha512-V/LGr1APy+PXIwKebEWrkZPwoeoF+w1jiOBUmuxuiUIaOHtob8Qc9BTrYo7VuI5fR8tqsy+buA2WFooR5olqvQ==" - "resolved" "https://registry.npmjs.org/acorn/-/acorn-8.7.0.tgz" - "version" "8.7.0" - "acorn@^7.0.0": "integrity" "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==" "resolved" "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz" @@ -2402,6 +2397,11 @@ "resolved" "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz" "version" "7.4.1" +"acorn@^8.2.4", "acorn@^8.4.1", "acorn@^8.7.0": + "integrity" "sha512-V/LGr1APy+PXIwKebEWrkZPwoeoF+w1jiOBUmuxuiUIaOHtob8Qc9BTrYo7VuI5fR8tqsy+buA2WFooR5olqvQ==" + "resolved" "https://registry.npmjs.org/acorn/-/acorn-8.7.0.tgz" + "version" "8.7.0" + "address@^1.0.1", "address@^1.1.2": "integrity" "sha512-aT6camzM4xEA54YVJYSqxz1kv4IHnQZRtThJJHhUMRExaU5spC7jX5ugSwTaTgJliIgs4VhZOk7htClvQ/LmRA==" "resolved" "https://registry.npmjs.org/address/-/address-1.1.2.tgz" @@ -2458,7 +2458,7 @@ dependencies: "fast-deep-equal" "^3.1.3" -"ajv@^6.10.0", "ajv@^6.12.2", "ajv@^6.12.3", "ajv@^6.12.4", "ajv@^6.12.5", "ajv@^6.9.1": +"ajv@^6.10.0", "ajv@^6.12.2", "ajv@^6.12.3", "ajv@^6.12.4", "ajv@^6.12.5": "integrity" "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==" "resolved" "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz" "version" "6.12.6" @@ -2478,7 +2478,7 @@ "require-from-string" "^2.0.2" "uri-js" "^4.2.2" -"ajv@^8.6.0", "ajv@>=8": +"ajv@^8.6.0": "integrity" "sha512-qOKJyNj/h+OWx7s5DePL6Zu1KeM9jPZhwBqs+7DzP6bGOvqzVCSf0xueYmVuaC/oQ/VtS2zLMLHdQFbkka+XDQ==" "resolved" "https://registry.npmjs.org/ajv/-/ajv-8.9.0.tgz" "version" "8.9.0" @@ -2488,7 +2488,7 @@ "require-from-string" "^2.0.2" "uri-js" "^4.2.2" -"ajv@^8.8.0", "ajv@^8.8.2": +"ajv@^8.8.0": "integrity" "sha512-qOKJyNj/h+OWx7s5DePL6Zu1KeM9jPZhwBqs+7DzP6bGOvqzVCSf0xueYmVuaC/oQ/VtS2zLMLHdQFbkka+XDQ==" "resolved" "https://registry.npmjs.org/ajv/-/ajv-8.9.0.tgz" "version" "8.9.0" @@ -2700,7 +2700,7 @@ "resolved" "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz" "version" "2.1.2" -"autoprefixer@^10.0.2", "autoprefixer@^10.4.2": +"autoprefixer@^10.4.2": "integrity" "sha512-9fOPpHKuDW1w/0EKfRmVnxTDt8166MAnLI3mgZ1JCnhNtYWxcJ6Ud5CO/AVOZi/AvFa8DY9RTy3h3+tFBlrrdQ==" "resolved" "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.2.tgz" "version" "10.4.2" @@ -2997,7 +2997,7 @@ "resolved" "https://registry.npmjs.org/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz" "version" "1.0.0" -"browserslist@^4.0.0", "browserslist@^4.14.5", "browserslist@^4.16.6", "browserslist@^4.17.5", "browserslist@^4.18.1", "browserslist@^4.19.1", "browserslist@>= 4", "browserslist@>=4": +"browserslist@^4.0.0", "browserslist@^4.14.5", "browserslist@^4.16.6", "browserslist@^4.17.5", "browserslist@^4.18.1", "browserslist@^4.19.1": "integrity" "sha512-u2tbbG5PdKRTUoctO3NBD8FQ5HdPh1ZXPHzp1rwaa5jTc+RV9/+RlWiAIKmjRPQF+xbGM9Kklj5bZQFa2s/38A==" "resolved" "https://registry.npmjs.org/browserslist/-/browserslist-4.19.1.tgz" "version" "4.19.1" @@ -3751,7 +3751,7 @@ "whatwg-mimetype" "^2.3.0" "whatwg-url" "^8.0.0" -"date-fns@^2.24.0", "date-fns@^2.28.0", "date-fns@2.0.0-alpha.7 || >=2.0.0": +"date-fns@^2.24.0", "date-fns@^2.28.0": "integrity" "sha512-8d35hViGYx/QH0icHYCeLmsLmMUheMmTyV9Fcm6gvNwdw31yXXH+O85sOBJ+OLnLQMKZowvpKb6FgMIQjcpvQw==" "resolved" "https://registry.npmjs.org/date-fns/-/date-fns-2.28.0.tgz" "version" "2.28.0" @@ -4443,7 +4443,7 @@ "normalize-path" "^3.0.0" "schema-utils" "^3.1.1" -"eslint@*", "eslint@^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8", "eslint@^3 || ^4 || ^5 || ^6 || ^7 || ^8", "eslint@^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0", "eslint@^6.0.0 || ^7.0.0 || ^8.0.0", "eslint@^7.0.0 || ^8.0.0", "eslint@^7.5.0 || ^8.0.0", "eslint@^8.0.0", "eslint@^8.1.0", "eslint@^8.3.0", "eslint@>= 6", "eslint@>=5": +"eslint@^8.3.0": "integrity" "sha512-ifHYzkBGrzS2iDU7KjhCAVMGCvF6M3Xfs8X8b37cgrUlDt6bWRTpRh6T/gtSXv1HJ/BUGgmjvNvOEGu85Iif7w==" "resolved" "https://registry.npmjs.org/eslint/-/eslint-8.7.0.tgz" "version" "8.7.0" @@ -6024,7 +6024,7 @@ "jest-regex-util" "^27.4.0" "jest-snapshot" "^27.4.6" -"jest-resolve@*", "jest-resolve@^27.4.2", "jest-resolve@^27.4.6": +"jest-resolve@^27.4.2", "jest-resolve@^27.4.6": "integrity" "sha512-SFfITVApqtirbITKFAO7jOVN45UgFzcRdQanOFzjnbd+CACDoyeX7206JyU92l4cRr73+Qy/TlW51+4vHGt+zw==" "resolved" "https://registry.npmjs.org/jest-resolve/-/jest-resolve-27.4.6.tgz" "version" "27.4.6" @@ -6200,7 +6200,7 @@ "merge-stream" "^2.0.0" "supports-color" "^8.0.0" -"jest@^27.0.0", "jest@^27.4.3": +"jest@^27.4.3": "integrity" "sha512-8heYvsx7nV/m8m24Vk26Y87g73Ba6ueUd0MWed/NXMhSZIm62U/llVbS0PJe1SHunbyXjJ/BqG1z9bFjGUIvTg==" "resolved" "https://registry.npmjs.org/jest/-/jest-27.4.7.tgz" "version" "27.4.7" @@ -6964,7 +6964,7 @@ "resolved" "https://registry.npmjs.org/node-releases/-/node-releases-2.0.1.tgz" "version" "2.0.1" -"node-sass@^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0", "node-sass@^7.0.1": +"node-sass@^7.0.1": "integrity" "sha512-uMy+Xt29NlqKCFdFRZyXKOTqGt+QaKHexv9STj2WeLottnlqZEEWx6Bj0MXNthmFRRdM/YwyNo/8Tr46TOM0jQ==" "resolved" "https://registry.npmjs.org/node-sass/-/node-sass-7.0.1.tgz" "version" "7.0.1" @@ -7948,15 +7948,6 @@ "resolved" "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz" "version" "4.2.0" -"postcss@^7.0.0 || ^8.0.1", "postcss@^8", "postcss@^8.0.0", "postcss@^8.0.2", "postcss@^8.0.3", "postcss@^8.0.9", "postcss@^8.1.0", "postcss@^8.1.2", "postcss@^8.1.4", "postcss@^8.2.14", "postcss@^8.2.15", "postcss@^8.2.2", "postcss@^8.3", "postcss@^8.3.3", "postcss@^8.3.5", "postcss@^8.4", "postcss@^8.4.4", "postcss@>= 8", "postcss@>=8": - "integrity" "sha512-jBDboWM8qpaqwkMwItqTQTiFikhs/67OYVvblFFTM7MrZjt6yMKd6r2kgXizEbTTljacm4NldIlZnhbjr84QYg==" - "resolved" "https://registry.npmjs.org/postcss/-/postcss-8.4.5.tgz" - "version" "8.4.5" - dependencies: - "nanoid" "^3.1.30" - "picocolors" "^1.0.0" - "source-map-js" "^1.0.1" - "postcss@^7.0.35": "integrity" "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==" "resolved" "https://registry.npmjs.org/postcss/-/postcss-7.0.39.tgz" @@ -7965,6 +7956,15 @@ "picocolors" "^0.2.1" "source-map" "^0.6.1" +"postcss@^8.2.15", "postcss@^8.3.5", "postcss@^8.4.4": + "integrity" "sha512-jBDboWM8qpaqwkMwItqTQTiFikhs/67OYVvblFFTM7MrZjt6yMKd6r2kgXizEbTTljacm4NldIlZnhbjr84QYg==" + "resolved" "https://registry.npmjs.org/postcss/-/postcss-8.4.5.tgz" + "version" "8.4.5" + dependencies: + "nanoid" "^3.1.30" + "picocolors" "^1.0.0" + "source-map-js" "^1.0.1" + "prelude-ls@^1.2.1": "integrity" "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==" "resolved" "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz" @@ -8223,7 +8223,7 @@ "strip-ansi" "^6.0.1" "text-table" "^0.2.0" -"react-dom@*", "react-dom@^15.5.x || ^16.x || ^17.x", "react-dom@^16.7.0 || ^17", "react-dom@^16.8.0", "react-dom@^16.8.0 || ^17.0.0", "react-dom@^16.9.0 || ^17", "react-dom@^17.0.2", "react-dom@>= 16.8.0", "react-dom@>=16.0.0", "react-dom@>=16.14.0", "react-dom@>=16.6.0", "react-dom@>=16.8": +"react-dom@^17.0.2": "integrity" "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==" "resolved" "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz" "version" "17.0.2" @@ -8262,7 +8262,7 @@ "resolved" "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz" "version" "16.13.1" -"react-is@^16.8.0 || ^17.0.0", "react-is@^17.0.1", "react-is@>= 16.8.0": +"react-is@^16.8.0 || ^17.0.0", "react-is@^17.0.1": "integrity" "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" "resolved" "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz" "version" "17.0.2" @@ -8297,7 +8297,7 @@ "react-fast-compare" "^3.0.1" "warning" "^4.0.2" -"react-refresh@^0.11.0", "react-refresh@>=0.10.0 <1.0.0": +"react-refresh@^0.11.0": "integrity" "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==" "resolved" "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz" "version" "0.11.0" @@ -8403,7 +8403,7 @@ "loose-envify" "^1.4.0" "prop-types" "^15.6.2" -"react@*", "react@^0.14 || ^15.0.0-rc || >=15.0", "react@^0.14.0 || ^15.0.0 || ^16.0.0", "react@^15.5.x || ^16.x || ^17.x", "react@^16.7.0 || ^17", "react@^16.8.0", "react@^16.8.0 || ^17", "react@^16.8.0 || ^17.0.0", "react@^16.8.0 || ^17.0.0-rc.1", "react@^16.9.0 || ^17", "react@^17.0.2", "react@>= 16", "react@>= 16.8.0", "react@>=0.14.0", "react@>=15.0.0", "react@>=16.0.0", "react@>=16.14.0", "react@>=16.3.1", "react@>=16.6.0", "react@>=16.8", "react@>=16.8.0", "react@>=16.x", "react@0.14 || 15 || 16 || 17", "react@17.0.2": +"react@^17.0.2": "integrity" "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==" "resolved" "https://registry.npmjs.org/react/-/react-17.0.2.tgz" "version" "17.0.2" @@ -8679,7 +8679,7 @@ "serialize-javascript" "^4.0.0" "terser" "^5.0.0" -"rollup@^1.20.0 || ^2.0.0", "rollup@^1.20.0||^2.0.0", "rollup@^2.0.0", "rollup@^2.43.1": +"rollup@^2.43.1": "integrity" "sha512-L6mKOkdyP8HK5kKJXaiWG7KZDumPJjuo1P+cfyHOJPNNTK3Moe7zCH5+fy7v8pVmHXtlxorzaBjvkBMB23s98g==" "resolved" "https://registry.npmjs.org/rollup/-/rollup-2.66.0.tgz" "version" "2.66.0" @@ -9346,7 +9346,7 @@ "resolved" "https://registry.npmjs.org/style-loader/-/style-loader-3.3.1.tgz" "version" "3.3.1" -"styled-components@^5.3.3", "styled-components@>= 2": +"styled-components@^5.3.3": "integrity" "sha512-++4iHwBM7ZN+x6DtPPWkCI4vdtwumQ+inA/DdAsqYd4SVgUKJie5vXyzotA00ttcFdQkCng7zc6grwlfIfw+lw==" "resolved" "https://registry.npmjs.org/styled-components/-/styled-components-5.3.3.tgz" "version" "5.3.3" @@ -9726,7 +9726,7 @@ "resolved" "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz" "version" "0.20.2" -"type-fest@^0.21.3", "type-fest@>=0.17.0 <3.0.0": +"type-fest@^0.21.3": "integrity" "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==" "resolved" "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz" "version" "0.21.3" @@ -10002,7 +10002,7 @@ "range-parser" "^1.2.1" "schema-utils" "^4.0.0" -"webpack-dev-server@^4.6.0", "webpack-dev-server@3.x || 4.x": +"webpack-dev-server@^4.6.0": "integrity" "sha512-mlxq2AsIw2ag016nixkzUkdyOE8ST2GTy34uKSABp1c4nhjZvH90D5ZRR+UOLSsG4Z3TFahAi72a3ymRtfRm+Q==" "resolved" "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.7.3.tgz" "version" "4.7.3" @@ -10066,7 +10066,7 @@ "resolved" "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz" "version" "3.2.3" -"webpack@^4.0.0 || ^5.0.0", "webpack@^4.37.0 || ^5.0.0", "webpack@^4.4.0 || ^5.9.0", "webpack@^4.44.2 || ^5.47.0", "webpack@^5.0.0", "webpack@^5.1.0", "webpack@^5.20.0", "webpack@^5.64.4", "webpack@>= 4", "webpack@>=2", "webpack@>=4.43.0 <6.0.0": +"webpack@^5.64.4": "integrity" "sha512-LjFbfMh89xBDpUMgA1W9Ur6Rn/gnr2Cq1jjHFPo4v6a79/ypznSYbAyPgGhwsxBtMIaEmDD1oJoA7BEYw/Fbrw==" "resolved" "https://registry.npmjs.org/webpack/-/webpack-5.67.0.tgz" "version" "5.67.0"