DmitriyB/pixelstreamingv2
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

added loader-popup

Browse Source
This commit is contained in:
VyacheslavShtyrlin
2023-02-07 18:04:18 +05:00
parent 9f0de105d6
commit e7360919fe
15 changed files with 387 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+99 -66
View File
@@ -19,6 +19,7 @@
"@types/react-redux": "^7.1.24",
"@types/react-router": "^5.1.20",
"@types/socket.io": "^3.0.2",
"connected-react-router": "^6.9.3",
"framer-motion": "^7.4.0",
"i18next": "^22.4.6",
"i18next-browser-languagedetector": "^7.0.1",
@@ -5776,6 +5777,26 @@
"node": ">=0.8"
}
},
"node_modules/connected-react-router": {
"version": "6.9.3",
"resolved": "https://registry.npmjs.org/connected-react-router/-/connected-react-router-6.9.3.tgz",
"integrity": "sha512-4ThxysOiv/R2Dc4Cke1eJwjKwH1Y51VDwlOrOfs1LjpdYOVvCNjNkZDayo7+sx42EeGJPQUNchWkjAIJdXGIOQ==",
"dependencies": {
"lodash.isequalwith": "^4.4.0",
"prop-types": "^15.7.2"
},
"optionalDependencies": {
"immutable": "^3.8.1 || ^4.0.0",
"seamless-immutable": "^7.1.3"
},
"peerDependencies": {
"history": "^4.7.2",
"react": "^16.4.0 || ^17.0.0",
"react-redux": "^6.0.0 || ^7.1.0",
"react-router": "^4.3.1 || ^5.0.0",
"redux": "^3.6.0 || ^4.0.0"
}
},
"node_modules/content-disposition": {
"version": "0.5.4",
"resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
@@ -8962,6 +8983,12 @@
"url": "https://opencollective.com/immer"
}
},
"node_modules/immutable": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.2.4.tgz",
"integrity": "sha512-WDxL3Hheb1JkRN3sQkyujNlL/xRjAo3rJtaU5xeufUauG66JdMr32bLj4gF+vWl84DIA3Zxw7tiAjneYzRRw+w==",
"optional": true
},
"node_modules/import-fresh": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@@ -11683,6 +11710,11 @@
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
"integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow=="
},
"node_modules/lodash.isequalwith": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/lodash.isequalwith/-/lodash.isequalwith-4.4.0.tgz",
"integrity": "sha512-dcZON0IalGBpRmJBmMkaoV7d3I80R2O+FrzsZyHdNSFrANq/cgDqKQNmAHE8UEj4+QYWwwhkQOVdLHiAopzlsQ=="
},
"node_modules/lodash.memoize": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
@@ -15199,6 +15231,12 @@
"url": "https://opencollective.com/webpack"
}
},
"node_modules/seamless-immutable": {
"version": "7.1.4",
"resolved": "https://registry.npmjs.org/seamless-immutable/-/seamless-immutable-7.1.4.tgz",
"integrity": "sha512-XiUO1QP4ki4E2PHegiGAlu6r82o5A+6tRh7IkGGTVg/h+UoeX4nFBeCGPOhb4CYjvkqsfm/TUtvOMYC1xmV30A==",
"optional": true
},
"node_modules/select-hose": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
@@ -18846,14 +18884,12 @@
"@csstools/postcss-unset-value": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@csstools/postcss-unset-value/-/postcss-unset-value-1.0.2.tgz",
"integrity": "sha512-c8J4roPBILnelAsdLr4XOAR/GsTm0GJi4XpcfvoWk3U6KiTCqiFYc63KhRMQQX35jYMp4Ao8Ij9+IZRgMfJp1g==",
"requires": {}
"integrity": "sha512-c8J4roPBILnelAsdLr4XOAR/GsTm0GJi4XpcfvoWk3U6KiTCqiFYc63KhRMQQX35jYMp4Ao8Ij9+IZRgMfJp1g=="
},
"@csstools/selector-specificity": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-2.0.2.tgz",
"integrity": "sha512-IkpVW/ehM1hWKln4fCA3NzJU8KwD+kIOvPZA4cqxoJHtE21CCzjyp+Kxbu0i5I4tBNOlXPL9mjwnWlL0VEG4Fg==",
"requires": {}
"integrity": "sha512-IkpVW/ehM1hWKln4fCA3NzJU8KwD+kIOvPZA4cqxoJHtE21CCzjyp+Kxbu0i5I4tBNOlXPL9mjwnWlL0VEG4Fg=="
},
"@emotion/is-prop-valid": {
"version": "0.8.8",
@@ -20681,14 +20717,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",
@@ -20774,8 +20808,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",
@@ -21065,8 +21098,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.3",
@@ -21580,6 +21612,17 @@
"resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz",
"integrity": "sha512-U73+6lQFmfiNPrYbXqr6kZ1i1wiRqXnp2nhMsINseWXO8lDau0LGEffJ8kQi4EjLZympVgRdvqjAgiZ1tgzDDA=="
},
"connected-react-router": {
"version": "6.9.3",
"resolved": "https://registry.npmjs.org/connected-react-router/-/connected-react-router-6.9.3.tgz",
"integrity": "sha512-4ThxysOiv/R2Dc4Cke1eJwjKwH1Y51VDwlOrOfs1LjpdYOVvCNjNkZDayo7+sx42EeGJPQUNchWkjAIJdXGIOQ==",
"requires": {
"immutable": "^3.8.1 || ^4.0.0",
"lodash.isequalwith": "^4.4.0",
"prop-types": "^15.7.2",
"seamless-immutable": "^7.1.3"
}
},
"content-disposition": {
"version": "0.5.4",
"resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
@@ -21696,8 +21739,7 @@
"css-declaration-sorter": {
"version": "6.3.1",
"resolved": "https://registry.npmjs.org/css-declaration-sorter/-/css-declaration-sorter-6.3.1.tgz",
"integrity": "sha512-fBffmak0bPAnyqc/HO8C3n2sHrp9wcqQz6ES9koRF2/mLOVAx9zIQ3Y7R29sYCteTPqMCwns4WYQoCX91Xl3+w==",
"requires": {}
"integrity": "sha512-fBffmak0bPAnyqc/HO8C3n2sHrp9wcqQz6ES9koRF2/mLOVAx9zIQ3Y7R29sYCteTPqMCwns4WYQoCX91Xl3+w=="
},
"css-has-pseudo": {
"version": "3.0.4",
@@ -21780,8 +21822,7 @@
"css-prefers-color-scheme": {
"version": "6.0.3",
"resolved": "https://registry.npmjs.org/css-prefers-color-scheme/-/css-prefers-color-scheme-6.0.3.tgz",
"integrity": "sha512-4BqMbZksRkJQx2zAjrokiGMd07RqOa2IxIrrN10lyBe9xhn9DEvjUK79J6jkeiv9D9hQFXKb6g1jwU62jziJZA==",
"requires": {}
"integrity": "sha512-4BqMbZksRkJQx2zAjrokiGMd07RqOa2IxIrrN10lyBe9xhn9DEvjUK79J6jkeiv9D9hQFXKb6g1jwU62jziJZA=="
},
"css-select": {
"version": "4.3.0",
@@ -21885,8 +21926,7 @@
"cssnano-utils": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/cssnano-utils/-/cssnano-utils-3.1.0.tgz",
"integrity": "sha512-JQNR19/YZhz4psLX/rQ9M83e3z2Wf/HdJbryzte4a3NSuafyp9w/I4U+hx5C2S9g41qlstH7DEWnZaaj83OuEA==",
"requires": {}
"integrity": "sha512-JQNR19/YZhz4psLX/rQ9M83e3z2Wf/HdJbryzte4a3NSuafyp9w/I4U+hx5C2S9g41qlstH7DEWnZaaj83OuEA=="
},
"csso": {
"version": "4.2.0",
@@ -22277,8 +22317,7 @@
"ws": {
"version": "8.2.3",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.2.3.tgz",
"integrity": "sha512-wBuoj1BDpC6ZQ1B7DWQBYVLphPWkm8i9Y0/3YdHjHKHiohOJ1ws+3OccDWtH+PoC9DZD5WOTrJvNbWvjS6JWaA==",
"requires": {}
"integrity": "sha512-wBuoj1BDpC6ZQ1B7DWQBYVLphPWkm8i9Y0/3YdHjHKHiohOJ1ws+3OccDWtH+PoC9DZD5WOTrJvNbWvjS6JWaA=="
}
}
},
@@ -22761,8 +22800,7 @@
"eslint-plugin-react-hooks": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz",
"integrity": "sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g==",
"requires": {}
"integrity": "sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g=="
},
"eslint-plugin-testing-library": {
"version": "5.6.4",
@@ -23837,8 +23875,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": "7.1.0",
@@ -23863,6 +23900,12 @@
"resolved": "https://registry.npmjs.org/immer/-/immer-9.0.16.tgz",
"integrity": "sha512-qenGE7CstVm1NrHQbMh8YaSzTZTFNP3zPqr3YU0S0UY441j4bJTg4A2Hh5KAhwgaiU6ZZ1Ar6y/2f4TblnMReQ=="
},
"immutable": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.2.4.tgz",
"integrity": "sha512-WDxL3Hheb1JkRN3sQkyujNlL/xRjAo3rJtaU5xeufUauG66JdMr32bLj4gF+vWl84DIA3Zxw7tiAjneYzRRw+w==",
"optional": true
},
"import-fresh": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@@ -24870,8 +24913,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.5.1",
@@ -25826,6 +25868,11 @@
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
"integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow=="
},
"lodash.isequalwith": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/lodash.isequalwith/-/lodash.isequalwith-4.4.0.tgz",
"integrity": "sha512-dcZON0IalGBpRmJBmMkaoV7d3I80R2O+FrzsZyHdNSFrANq/cgDqKQNmAHE8UEj4+QYWwwhkQOVdLHiAopzlsQ=="
},
"lodash.memoize": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
@@ -26710,8 +26757,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.4",
@@ -26809,26 +26855,22 @@
"postcss-discard-comments": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-5.1.2.tgz",
"integrity": "sha512-+L8208OVbHVF2UQf1iDmRcbdjJkuBF6IS29yBDSiWUIzpYaAhtNl6JYnYm12FnkeCwQqF5LeklOu6rAqgfBZqQ==",
"requires": {}
"integrity": "sha512-+L8208OVbHVF2UQf1iDmRcbdjJkuBF6IS29yBDSiWUIzpYaAhtNl6JYnYm12FnkeCwQqF5LeklOu6rAqgfBZqQ=="
},
"postcss-discard-duplicates": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-5.1.0.tgz",
"integrity": "sha512-zmX3IoSI2aoenxHV6C7plngHWWhUOV3sP1T8y2ifzxzbtnuhk1EdPwm0S1bIUNaJ2eNbWeGLEwzw8huPD67aQw==",
"requires": {}
"integrity": "sha512-zmX3IoSI2aoenxHV6C7plngHWWhUOV3sP1T8y2ifzxzbtnuhk1EdPwm0S1bIUNaJ2eNbWeGLEwzw8huPD67aQw=="
},
"postcss-discard-empty": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-5.1.1.tgz",
"integrity": "sha512-zPz4WljiSuLWsI0ir4Mcnr4qQQ5e1Ukc3i7UfE2XcrwKK2LIPIqE5jxMRxO6GbI3cv//ztXDsXwEWT3BHOGh3A==",
"requires": {}
"integrity": "sha512-zPz4WljiSuLWsI0ir4Mcnr4qQQ5e1Ukc3i7UfE2XcrwKK2LIPIqE5jxMRxO6GbI3cv//ztXDsXwEWT3BHOGh3A=="
},
"postcss-discard-overridden": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-5.1.0.tgz",
"integrity": "sha512-21nOL7RqWR1kasIVdKs8HNqQJhFxLsyRfAnUDm4Fe4t4mCWL9OJiHvlHPjcd8zc5Myu89b/7wZDnOSjFgeWRtw==",
"requires": {}
"integrity": "sha512-21nOL7RqWR1kasIVdKs8HNqQJhFxLsyRfAnUDm4Fe4t4mCWL9OJiHvlHPjcd8zc5Myu89b/7wZDnOSjFgeWRtw=="
},
"postcss-double-position-gradients": {
"version": "3.1.2",
@@ -26850,8 +26892,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.4",
@@ -26872,14 +26913,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.5",
"resolved": "https://registry.npmjs.org/postcss-gap-properties/-/postcss-gap-properties-3.0.5.tgz",
"integrity": "sha512-IuE6gKSdoUNcvkGIqdtjtcMtZIFyXZhmFd5RUlg97iVEvp1BZKV5ngsAjCjrVy+14uhGBQl9tzmi1Qwq4kqVOg==",
"requires": {}
"integrity": "sha512-IuE6gKSdoUNcvkGIqdtjtcMtZIFyXZhmFd5RUlg97iVEvp1BZKV5ngsAjCjrVy+14uhGBQl9tzmi1Qwq4kqVOg=="
},
"postcss-image-set-function": {
"version": "4.0.7",
@@ -26902,8 +26941,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",
@@ -26944,14 +26982,12 @@
"postcss-logical": {
"version": "5.0.4",
"resolved": "https://registry.npmjs.org/postcss-logical/-/postcss-logical-5.0.4.tgz",
"integrity": "sha512-RHXxplCeLh9VjinvMrZONq7im4wjWGlRJAqmAVLXyZaXwfDWP73/oq4NdIp+OZwhQUMj0zjqDfM5Fj7qby+B4g==",
"requires": {}
"integrity": "sha512-RHXxplCeLh9VjinvMrZONq7im4wjWGlRJAqmAVLXyZaXwfDWP73/oq4NdIp+OZwhQUMj0zjqDfM5Fj7qby+B4g=="
},
"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.1.6",
@@ -27012,8 +27048,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",
@@ -27071,8 +27106,7 @@
"postcss-normalize-charset": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-5.1.0.tgz",
"integrity": "sha512-mSgUJ+pd/ldRGVx26p2wz9dNZ7ji6Pn8VWBajMXFf8jk7vUoSrZ2lt/wZR7DtlZYKesmZI680qjr2CeFF2fbUg==",
"requires": {}
"integrity": "sha512-mSgUJ+pd/ldRGVx26p2wz9dNZ7ji6Pn8VWBajMXFf8jk7vUoSrZ2lt/wZR7DtlZYKesmZI680qjr2CeFF2fbUg=="
},
"postcss-normalize-display-values": {
"version": "5.1.0",
@@ -27165,8 +27199,7 @@
"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.5",
@@ -27260,8 +27293,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": "6.0.1",
@@ -27858,8 +27890,7 @@
"redux-thunk": {
"version": "2.4.2",
"resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.4.2.tgz",
"integrity": "sha512-+P3TjtnP0k/FEjcBL5FZpoovtvrTNT/UXd4/sluaSyrURlSlhLSzEdfsTBW7WsKB6yPvgd7q/iZPICFjW4o57Q==",
"requires": {}
"integrity": "sha512-+P3TjtnP0k/FEjcBL5FZpoovtvrTNT/UXd4/sluaSyrURlSlhLSzEdfsTBW7WsKB6yPvgd7q/iZPICFjW4o57Q=="
},
"regenerate": {
"version": "1.4.2",
@@ -28181,6 +28212,12 @@
"ajv-keywords": "^3.5.2"
}
},
"seamless-immutable": {
"version": "7.1.4",
"resolved": "https://registry.npmjs.org/seamless-immutable/-/seamless-immutable-7.1.4.tgz",
"integrity": "sha512-XiUO1QP4ki4E2PHegiGAlu6r82o5A+6tRh7IkGGTVg/h+UoeX4nFBeCGPOhb4CYjvkqsfm/TUtvOMYC1xmV30A==",
"optional": true
},
"select-hose": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
@@ -28649,8 +28686,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=="
},
"style-value-types": {
"version": "5.1.2",
@@ -29158,8 +29194,7 @@
"use-sync-external-store": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz",
"integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==",
"requires": {}
"integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA=="
},
"util-deprecate": {
"version": "1.0.2",
@@ -29443,8 +29478,7 @@
"ws": {
"version": "8.8.1",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.8.1.tgz",
"integrity": "sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA==",
"requires": {}
"integrity": "sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA=="
}
}
},
@@ -29883,8 +29917,7 @@
"ws": {
"version": "7.5.9",
"resolved": "https://registry.npmjs.org/ws/-/ws-7.5.9.tgz",
"integrity": "sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==",
"requires": {}
"integrity": "sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q=="
},
"xml-name-validator": {
"version": "3.0.0",
package.json
+1
View File
@@ -14,6 +14,7 @@
"@types/react-redux": "^7.1.24",
"@types/react-router": "^5.1.20",
"@types/socket.io": "^3.0.2",
"connected-react-router": "^6.9.3",
"framer-motion": "^7.4.0",
"i18next": "^22.4.6",
"i18next-browser-languagedetector": "^7.0.1",
src/App.css
+5 -4
View File
@@ -13,11 +13,12 @@
}
.content__container {
display: flex;
justify-content: center;
position: absolute;
top: 25%;
width: 100%;
top: 50%; /* position the top edge of the element at the middle of the parent */
left: 50%; /* position the left edge of the element at the middle of the parent */
transform: translate(-50%, -50%); /* This is a shorthand of
}
.content__player {
src/App.tsx
+4 -7
View File
@@ -1,5 +1,5 @@
import "./App.css";
import { useEffect, useState } from "react";
import { useEffect } from "react";
import { Redirect, Route, Switch, useHistory } from "react-router-dom";
import { Header } from "./components/header/header";
@@ -15,11 +15,8 @@ import { ICards } from "./models/ICards";
import { useTranslation } from "react-i18next";
import cookies from "js-cookie";
const App: React.FC<any> = () => {
const [visible, setVisible] = useState({
popup1: true,
popup2: false,
});
const App: React.FC = () => {
const dispatch = useAppDispatch();
const history = useHistory();
@@ -66,7 +63,7 @@ const App: React.FC<any> = () => {
<div className="blur">
<Header></Header>
<div className="content__container">
<Main visible={visible} setVisible={setVisible}></Main>
<Main></Main>
</div>
</div>
</div>
src/components/LoadingPopup/LoadingPopup.css
+142
View File
@@ -0,0 +1,142 @@
.popup__content {
display: flex;
flex-direction: column;
gap: 24px;
}
.popup__title {
font-style: normal;
font-weight: 400;
font-size: 22px;
line-height: 130%;
/* identical to box height, or 29px */
margin: 0;
/* App/White */
color: #ffffff;
}
.logo__popup {
height: auto;
width: 100%;
margin-bottom: 48px;
object-fit: cover;
}
.logo__popup_ex {
display: none;
}
.popup__input {
padding: 5px 0px;
border-radius: 12px;
background: #404040;
height: 76px;
font-style: normal;
font-weight: 300;
font-size: 38px;
line-height: 46px;
/* identical to box height */
text-align: center;
letter-spacing: 0.3em;
/* App/White */
box-sizing: border-box;
border: none;
outline: none;
color: #ffffff;
}
@media screen and (max-width: 639px) {
.logo__popup {
margin-bottom: 40px;
}
.logo__popup_ex {
display: block;
height: auto;
width: 100%;
margin-bottom: 24px;
object-fit: cover;
}
.popup__input {
height: 48px;
font-size: 30px;
}
.popup__title {
font-size: 16px;
width: 78%;
}
.popup__content {
gap: 16px;
}
}
.loader-container {
width: 494px;
box-sizing: border-box;
background-color: #262626;
border: 1px solid #404040;
border-radius: 32px;
padding: 45px 0 51px 0;
display: flex;
flex-direction: column;
gap: 51px;
align-items: center;
}
.loading-caption {
font-style: normal;
font-weight: 400;
font-size: 22px;
line-height: 130%;
/* identical to box height, or 29px */
text-align: center;
/* Landing/White */
color: #ebebeb;
}
.loader {
width: 106px;
height: 106px;
border-radius: 50%;
display: inline-block;
position: relative;
background: conic-gradient(
from 135deg at 50% 50%,
rgba(255, 255, 255, 0) -6.26deg,
#ffffff 314.83deg,
rgba(255, 255, 255, 0) 353.74deg,
#ffffff 674.83deg
);
box-sizing: border-box;
animation: rotation 1s linear infinite;
}
.loader::after {
content: "";
box-sizing: border-box;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 100px;
height: 100px;
border-radius: 50%;
background: #262626;
}
@keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
src/components/LoadingPopup/LoadingPopup.tsx
+17
View File
@@ -0,0 +1,17 @@
import "../../styles/styles.css";
import "./LoadingPopup.css";
import loader from "./loader.svg";
import { useHistory } from "react-router-dom";
import { useTranslation } from "react-i18next";
export const LoadingPopup: React.FC<any> = ({}) => {
const history = useHistory();
const { t } = useTranslation();
return (
<div className="loader-container">
<span className="loading-caption">Пожалуйста подождите</span>
<span className="loader"></span>
</div>
);
};
src/components/LoadingPopup/loader.svg
+9
View File
@@ -0,0 +1,9 @@
<svg width="106" height="106" viewBox="0 0 106 106" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M103.35 53C104.814 53 106.007 51.8126 105.934 50.3509C105.354 38.7527 100.977 27.6378 93.4384 18.7402C85.328 9.16712 74.0844 2.78179 61.7081 0.720288C49.3319 -1.34121 36.6256 1.05484 25.85 7.48211C15.0745 13.9094 6.92854 23.951 2.86158 35.8204C-1.20539 47.6898 -0.929606 60.6171 3.63985 72.3022C8.2093 83.9873 16.7761 93.6725 27.8159 99.6343C38.8558 105.596 51.6527 107.448 63.9298 104.861C75.3406 102.456 85.6145 96.361 93.1857 87.5559C94.1399 86.4462 93.9256 84.7764 92.7696 83.8789V83.8789C91.6136 82.9813 89.9541 83.1964 88.9938 84.3008C82.1966 92.1174 73.0197 97.5286 62.8368 99.6747C51.7874 102.003 40.2702 100.337 30.3343 94.9709C20.3985 89.6052 12.6884 80.8886 8.57587 70.372C4.46336 59.8554 4.21516 48.2208 7.87542 37.5384C11.5357 26.8559 18.867 17.8184 28.565 12.0339C38.263 6.24936 49.6987 4.09292 60.8373 5.94826C71.976 7.80361 82.0952 13.5504 89.3946 22.1662C96.1215 30.1063 100.051 40.0084 100.626 50.3511C100.708 51.8124 101.886 53 103.35 53V53Z" fill="url(#paint0_angular_2745_13429)"/>
<defs>
<radialGradient id="paint0_angular_2745_13429" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(53 53) rotate(45) scale(52.4673)">
<stop offset="0.874517" stop-color="white"/>
<stop offset="0.982613" stop-color="white" stop-opacity="0"/>
</radialGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

src/components/Main/Main.tsx
+31 -31
View File
@@ -3,38 +3,45 @@ import { useEffect, useState } from "react";
import { motion, AnimatePresence } from "framer-motion";
import { PopupConnect } from "../popupConnect/popupConnect";
import { PopupConnectEx } from "../popupConnectEx/popupConnectEx";
import { LoadingPopup } from "../LoadingPopup/LoadingPopup";
import { popupAnimation } from "../../utils/animationProps";
import { useAppDispatch, useAppSelector } from "../../hooks/redux";
import {
createSession,
} from "../../store/reducers/ActionCreator";
import { createSession } from "../../store/reducers/ActionCreator";
import { sessionSlice } from "../../store/reducers/sessionSlice";
export const Main: React.FC<any> = ({ visible, setVisible }) => {
const [value, setValue] = useState<string>("");
export const Main: React.FC = () => {
const dispatch = useAppDispatch();
const { popup1, popup2 } = visible;
const { currentCard } = useAppSelector(
(state) => state.cardReducer
);
const { currentCard } = useAppSelector((state) => state.cardReducer);
const [visible, setVisible] = useState({
connectPopup: true,
loadingPopup: false,
});
const { isLoading } = useAppSelector((state) => state.sessionReducer)
const { cleanErrors } = sessionSlice.actions;
const { isLoading, error } = useAppSelector((state) => state.sessionReducer);
const { connectPopup, loadingPopup } = visible;
useEffect(() => {
if (isLoading) {
setVisible({ connectPopup: false, loadingPopup: true });
return;
} else if (error) {
setVisible({ connectPopup: false, loadingPopup: false });
return;
}
}, [isLoading, error]);
useEffect(() => {
return () => {
setVisible({
popup1: true,
popup2: false,
})
}
}, [])
dispatch(cleanErrors());
};
}, []);
return (
<AnimatePresence mode="wait">
{popup1 && (
{connectPopup && (
<motion.div
key={1}
variants={popupAnimation}
@@ -45,12 +52,11 @@ export const Main: React.FC<any> = ({ visible, setVisible }) => {
<PopupConnect
isLoading={isLoading}
logo={currentCard.image.logo}
onConnect={() => dispatch(createSession(currentCard.title))} visible={visible}
setVisible={setVisible}
onConnect={() => dispatch(createSession(currentCard.title))}
></PopupConnect>
</motion.div>
)}
{popup2 && (
{loadingPopup && (
<motion.div
key={2}
variants={popupAnimation}
@@ -58,13 +64,7 @@ export const Main: React.FC<any> = ({ visible, setVisible }) => {
animate={"show"}
exit={"hidden"}
>
<PopupConnectEx
value={value}
setValue={setValue}
logo={currentCard.image.logo}
visible={visible}
setVisible={setVisible}
></PopupConnectEx>
<LoadingPopup></LoadingPopup>
</motion.div>
)}
</AnimatePresence>
src/components/PopupShare/PopupShare.tsx
+46 -45
View File
@@ -1,52 +1,53 @@
import './sharePopup.css'
import { useState, useEffect } from 'react'
import { TSidebarPopup } from '../../utils/types'
import { useTranslation } from 'react-i18next'
import { useAppSelector } from '../../hooks/redux'
import "./sharePopup.css";
import { useState, useEffect } from "react";
import { useTranslation } from "react-i18next";
export const PopupShare: React.FC<any> = ({ setClose }) => {
const [copy, setCopy] = useState(false);
const { id } = useAppSelector((state) => state.sessionReducer);
function copyLink() {
navigator.clipboard.writeText(window.location.href);
setCopy((prev) => !prev);
}
const [copy, setCopy] = useState(false)
function closePopup() {
setClose();
setCopy(false);
}
useEffect(() => () => setCopy(false), []);
function copyLink() {
navigator.clipboard.writeText(window.location.href)
setCopy(prev => !prev)
}
const { t } = useTranslation();
function closePopup() {
setClose()
setCopy(false)
}
useEffect(() => () => setCopy(false), []);
const { t } = useTranslation();
return (
<div className='share-popup-container'>
<div className='mobile-users-part-header share-header-popup'>
<span className='mobile-users-part-header-title'>{t('popup-control-invite-title')}</span>
<button onClick={closePopup} className='mobile-users-part-header-close-button'></button>
</div>
<div className='share-popup-data-container'>
<span className='share-popup-data-title'>{t('popup-control-code')}</span>
<input className='share-popup-data-input share-popup-data-input code' value={id} readOnly></input>
</div>
<div className='border-line'></div>
<div className='share-popup-data-container'>
<span className='share-popup-data-title'>{t('popup-control-link')}</span>
<input className='share-popup-data-input href' value={window.location.href} readOnly></input>
</div>
<div className='share-popup-data-container'>
<button className='share-popup-copy-button '>
<span className='share-popup-copy-button-icon'></span>
<span onClick={copyLink} className='share-popup-copy-button-title'>{copy ? t('popup-control-btn-active') : t('popup-control-btn')}</span>
</button>
</div>
</div>
)
}
return (
<div className="share-popup-container">
<div className="mobile-users-part-header share-header-popup">
<span className="mobile-users-part-header-title">
{t("popup-control-invite-title")}
</span>
<button
onClick={closePopup}
className="mobile-users-part-header-close-button"
></button>
</div>
<div className="share-popup-data-container">
<span className="share-popup-data-title">
{t("popup-control-link")}
</span>
<input
className="share-popup-data-input href"
value={window.location.href}
readOnly
></input>
</div>
<div className="share-popup-data-container">
<button className="share-popup-copy-button ">
<span className="share-popup-copy-button-icon"></span>
<span onClick={copyLink} className="share-popup-copy-button-title">
{copy ? t("popup-control-btn-active") : t("popup-control-btn")}
</span>
</button>
</div>
</div>
);
};
src/components/PopupShare/sharePopup.css
+1 -2
View File
@@ -12,8 +12,7 @@
background-color: #333333;
color: #FFFFFF;
padding: 48px;
/* gap: 24px; */
justify-content: space-between;
gap: 24px;
}
.share-header-popup {
src/components/playerComponent/playerComponent.tsx
+13 -3
View File
@@ -1,9 +1,10 @@
import "./playerStyles.css";
import { useParams } from "react-router-dom";
import { useHistory, useParams } from "react-router-dom";
import React, { useEffect } from "react";
import { Sidebar } from "../sidebar/sidebar";
import { connectSession } from "../../store/reducers/ActionCreator";
import { useAppDispatch, useAppSelector } from "../../hooks/redux";
import { sessionSlice } from "../../store/reducers/sessionSlice";
type link = {
id: string;
@@ -12,14 +13,23 @@ type link = {
export const PlayerComponent: React.FC<any> = ({ closeStream }) => {
const { id } = useParams<link>();
const dispatch = useAppDispatch();
const { cleanErrors } = sessionSlice.actions;
const history = useHistory()
useEffect(() => {
dispatch(connectSession(id));
dispatch(connectSession(id)).then((res: any) => {
if (res.error) {
alert(res.payload);
history.push('/')
}
});
return () => {
dispatch(cleanErrors());
};
}, []);
const { url } = useAppSelector((state) => state.sessionReducer);
return (
<>
<iframe
src/components/popupConnect/popupConnect.tsx
+2 -19
View File
@@ -2,12 +2,7 @@ import { useHistory } from "react-router-dom";
import "../../styles/styles.css";
import { useTranslation } from "react-i18next";
export const PopupConnect: React.FC<any> = ({
setVisible,
onConnect,
logo,
isLoading,
}) => {
export const PopupConnect: React.FC<any> = ({ onConnect, logo, isLoading }) => {
const history = useHistory();
const { t } = useTranslation();
@@ -17,6 +12,7 @@ export const PopupConnect: React.FC<any> = ({
history.push(`/stream/${res.payload.session_id}`);
} else {
alert(res.payload);
history.push('/')
}
});
};
@@ -34,21 +30,8 @@ export const PopupConnect: React.FC<any> = ({
>
{t("popup-main-btn-start")}
</button>
<span className="line"></span>
</div>
<div className="button__container">
<p className="button__title">{t("popup-main-caption")} </p>
<button
className="button button__disabled"
onClick={() =>
setVisible({
popup1: false,
popup2: true,
})
}
>
{t("popup-main-btn-connect")}
</button>
<span className="line"></span>
<button onClick={() => history.goBack()} className="popup__caption">
{t("popup-main-select")}
src/components/popupConnectEx/popupConnect.css
-84
View File
@@ -1,84 +0,0 @@
.popup__content {
display: flex;
flex-direction: column;
gap: 24px;
}
.popup__title {
font-style: normal;
font-weight: 400;
font-size: 22px;
line-height: 130%;
/* identical to box height, or 29px */
margin: 0;
/* App/White */
color: #FFFFFF;
}
.logo__popup {
height: auto;
width: 100%;
margin-bottom: 48px;
object-fit: cover;
}
.logo__popup_ex {
display: none;
}
.popup__input {
padding: 5px 0px;
border-radius: 12px;
background: #404040;
height: 76px;
font-style: normal;
font-weight: 300;
font-size: 38px;
line-height: 46px;
/* identical to box height */
text-align: center;
letter-spacing: 0.3em;
/* App/White */
box-sizing: border-box;
border: none;
outline: none;
color: #FFFFFF;
}
@media screen and (max-width: 639px) {
.logo__popup {
margin-bottom: 40px;
}
.logo__popup_ex {
display: block;
height: auto;
width: 100%;
margin-bottom: 24px;
object-fit: cover;
}
.popup__input {
height: 48px;
font-size: 30px;
}
.popup__title {
font-size: 16px;
width: 78%;
}
.popup__content {
gap: 16px;
}
}
src/components/popupConnectEx/popupConnectEx.tsx
-54
View File
@@ -1,54 +0,0 @@
import "../../styles/styles.css";
import "./popupConnect.css";
import { useHistory } from "react-router-dom";
import { useTranslation } from "react-i18next";
export const PopupConnectEx: React.FC<any> = ({
setVisible,
logo,
setValue,
value,
}) => {
const history = useHistory();
const { t } = useTranslation();
const handleConnect = () => {
history.push(`/stream/${value}`);
};
return (
<div className="popup__container">
<div className="popup__content">
<img alt="logoRC" className="logo__popup_ex" src={logo}></img>
<p className="popup__title">{t("popup-connect-title")}</p>
<input
value={value}
onChange={(e) => setValue(e.target.value)}
className="popup__input"
></input>
<button
onClick={handleConnect}
disabled={!!!value}
type="submit"
className={
!!value ? "button" : "button button__disabled"
}
>
{t("popup-connect-btn-continue")}
</button>
<span className="line"></span>
<button
onClick={() =>
setVisible({
popup1: true,
popup2: false,
})
}
className="popup__caption"
>
{t("popup-connect-btn-mode")}
</button>
</div>
</div>
);
};
src/store/reducers/sessionSlice.ts
+17 -8
View File
@@ -20,16 +20,23 @@ interface CreateSessionResponseInterface {
const initialState: sessionState = {
isLoading: false,
error: "",
url: '',
id: ''
url: "",
id: "",
};
export const sessionSlice = createSlice({
name: "data",
initialState,
reducers: {},
reducers: {
cleanErrors(state) {
state.error = null;
},
},
extraReducers: {
[createSession.fulfilled.type]: (state, action: PayloadAction<CreateSessionResponseInterface>) => {
[createSession.fulfilled.type]: (
state,
action: PayloadAction<CreateSessionResponseInterface>
) => {
state.isLoading = false;
state.id = action.payload.session_id;
},
@@ -40,10 +47,13 @@ export const sessionSlice = createSlice({
[createSession.pending.type]: (state) => {
state.isLoading = true;
},
[connectSession.fulfilled.type]: (state, action: PayloadAction<ConnectSessionResponseInterface>) => {
[connectSession.fulfilled.type]: (
state,
action: PayloadAction<ConnectSessionResponseInterface>
) => {
state.isLoading = false;
const url = action.payload.websocket_url.replace('wss://', 'https://')
state.url = url
const url = action.payload.websocket_url.replace("wss://", "https://");
state.url = url;
},
[connectSession.rejected.type]: (state, action: PayloadAction<any>) => {
state.isLoading = false;
@@ -51,7 +61,6 @@ export const sessionSlice = createSlice({
},
[connectSession.pending.type]: (state, action) => {
state.isLoading = true;
},
},
});