upd
This commit is contained in:
@@ -14,6 +14,7 @@
|
|||||||
"@livekit/components-react": "^1.1.6",
|
"@livekit/components-react": "^1.1.6",
|
||||||
"@livekit/components-styles": "^1.0.6",
|
"@livekit/components-styles": "^1.0.6",
|
||||||
"@uidotdev/usehooks": "^2.0.1",
|
"@uidotdev/usehooks": "^2.0.1",
|
||||||
|
"ahooks": "^3.7.10",
|
||||||
"date-fns": "^2.30.0",
|
"date-fns": "^2.30.0",
|
||||||
"i18next": "^23.8.2",
|
"i18next": "^23.8.2",
|
||||||
"i18next-browser-languagedetector": "^7.2.0",
|
"i18next-browser-languagedetector": "^7.2.0",
|
||||||
@@ -24,6 +25,7 @@
|
|||||||
"react-countdown": "^2.3.5",
|
"react-countdown": "^2.3.5",
|
||||||
"react-device-detect": "^2.2.3",
|
"react-device-detect": "^2.2.3",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
|
"react-draggable": "^4.4.6",
|
||||||
"react-full-screen": "^1.1.1",
|
"react-full-screen": "^1.1.1",
|
||||||
"react-i18next": "^14.0.3",
|
"react-i18next": "^14.0.3",
|
||||||
"react-input-mask": "^2.0.4",
|
"react-input-mask": "^2.0.4",
|
||||||
|
|||||||
@@ -0,0 +1,3 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M17 6H6C4.89543 6 4 6.89543 4 8V15C4 16.1046 4.89543 17 6 17H11L14.3753 19.7002C15.0301 20.2241 16 19.7579 16 18.9194V17H17C18.1046 17 19 16.1046 19 15V8C19 6.89543 18.1046 6 17 6Z" stroke="#77828C" stroke-width="1.5"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 332 B |
@@ -0,0 +1,4 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12 12L17 7.00026M12 12L7.00009 7M12 12L16.9999 16.9999M12 12L7 17"
|
||||||
|
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 282 B |
@@ -0,0 +1,4 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<rect x="5" y="5" width="14" height="14" rx="3" stroke="#77828C" stroke-width="1.5"/>
|
||||||
|
<path d="M5 8C5 6.34315 6.34315 5 8 5H16C17.6569 5 19 6.34315 19 8V9H5V8Z" stroke="#77828C" stroke-width="1.5"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 302 B |
@@ -0,0 +1,4 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M4 20V14M4 20H10M4 20L10 14" stroke="#77828C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M20 4V10M20 4H14M20 4L14 10" stroke="#77828C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 349 B |
@@ -0,0 +1,4 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M9.59372 3.94C9.68372 3.398 10.1537 3 10.7037 3H13.2967C13.8467 3 14.3167 3.398 14.4067 3.94L14.6197 5.221C14.6827 5.595 14.9327 5.907 15.2647 6.091C15.3387 6.131 15.4117 6.174 15.4847 6.218C15.8087 6.414 16.2047 6.475 16.5597 6.342L17.7767 5.886C18.0261 5.79221 18.3007 5.78998 18.5516 5.87971C18.8025 5.96945 19.0134 6.14531 19.1467 6.376L20.4427 8.623C20.5758 8.8537 20.6227 9.12413 20.5751 9.38617C20.5275 9.6482 20.3884 9.88485 20.1827 10.054L19.1797 10.881C18.8867 11.121 18.7417 11.494 18.7487 11.873C18.7503 11.958 18.7503 12.043 18.7487 12.128C18.7417 12.506 18.8867 12.878 19.1787 13.118L20.1837 13.946C20.6077 14.296 20.7177 14.9 20.4437 15.376L19.1457 17.623C19.0126 17.8536 18.8019 18.0296 18.5512 18.1195C18.3005 18.2094 18.0261 18.2074 17.7767 18.114L16.5597 17.658C16.2047 17.525 15.8097 17.586 15.4837 17.782C15.4112 17.8261 15.3379 17.8688 15.2637 17.91C14.9327 18.093 14.6827 18.405 14.6197 18.779L14.4067 20.059C14.3167 20.602 13.8467 21 13.2967 21H10.7027C10.1527 21 9.68272 20.602 9.59272 20.06L9.37972 18.779C9.31772 18.405 9.06772 18.093 8.73572 17.909C8.66157 17.8681 8.58822 17.8258 8.51572 17.782C8.19072 17.586 7.79572 17.525 7.43972 17.658L6.22272 18.114C5.97345 18.2075 5.69908 18.2096 5.44842 18.1199C5.19775 18.0302 4.98703 17.8545 4.85372 17.624L3.55672 15.377C3.42366 15.1463 3.37676 14.8759 3.42437 14.6138C3.47198 14.3518 3.61101 14.1152 3.81672 13.946L4.82072 13.119C5.11272 12.879 5.25772 12.506 5.25072 12.127C5.24915 12.042 5.24915 11.957 5.25072 11.872C5.25772 11.494 5.11272 11.122 4.82072 10.882L3.81672 10.054C3.61126 9.88489 3.47239 9.64843 3.42479 9.38662C3.37719 9.12481 3.42393 8.8546 3.55672 8.624L4.85372 6.377C4.9869 6.14614 5.19773 5.97006 5.44863 5.88014C5.69953 5.79021 5.97421 5.79229 6.22372 5.886L7.43972 6.342C7.79572 6.475 8.19072 6.414 8.51572 6.218C8.58772 6.174 8.66172 6.131 8.73572 6.09C9.06772 5.907 9.31772 5.595 9.37972 5.221L9.59372 3.94Z" stroke="#77828C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M15 12C15 12.7956 14.6839 13.5587 14.1213 14.1213C13.5587 14.6839 12.7956 15 12 15C11.2044 15 10.4413 14.6839 9.87868 14.1213C9.31607 13.5587 9 12.7956 9 12C9 11.2044 9.31607 10.4413 9.87868 9.87868C10.4413 9.31607 11.2044 9 12 9C12.7956 9 13.5587 9.31607 14.1213 9.87868C14.6839 10.4413 15 11.2044 15 12Z" stroke="#77828C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.4 KiB |
@@ -0,0 +1,4 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.94623 10.036L6.94623 11.0664C6.86053 10.9733 6.76475 10.8815 6.65917 10.795C6.311 10.5096 5.81515 10.25 5.19622 10.25C4.42016 10.25 3.78099 10.6534 3.4629 11.2896C3.15373 11.9079 3.18704 12.6587 3.5254 13.3354C3.86225 14.0091 3.94622 14.7555 3.94622 15C3.94622 15.7954 4.02595 16.6446 4.41023 17.5209C4.78454 18.3745 5.42233 19.1971 6.44529 20.0173C7.62843 21.7031 9.86899 22.75 12.1962 22.75C14.6623 22.75 16.5105 21.9825 17.8256 20.9154L16.7567 19.8465C15.6985 20.6585 14.2107 21.25 12.1962 21.25C10.2298 21.25 8.46071 20.3389 7.62411 19.084C7.57994 19.0177 7.52549 18.9589 7.46282 18.9098C6.53695 18.1839 6.04978 17.5247 5.78396 16.9185C5.51701 16.3098 5.44622 15.6941 5.44622 15C5.44622 14.5778 5.3302 13.5909 4.86704 12.6646C4.7054 12.3413 4.73872 12.0921 4.80454 11.9604C4.86145 11.8466 4.97228 11.75 5.19622 11.75C5.37729 11.75 5.54812 11.8238 5.70829 11.955C5.87468 12.0914 5.98558 12.2557 6.02542 12.3354C6.03933 12.3632 6.05495 12.3902 6.0722 12.416C6.2188 12.6359 6.44796 13.0249 6.63742 13.4455C6.83709 13.8888 6.94624 14.267 6.94624 14.5L6.94622 15C6.94621 15.4142 7.28199 15.75 7.6962 15.75C8.11042 15.75 8.44621 15.4142 8.44622 15L8.44624 14.5L8.44623 11.536L6.94623 10.036ZM9.92865 6.83942C9.90627 6.72855 9.86136 6.60321 9.78757 6.50073C9.71504 6.39999 9.59703 6.29074 9.3483 6.25907L8.09533 5.0061C8.39969 4.84556 8.7663 4.75 9.19622 4.75C9.47222 4.75 9.72213 4.78938 9.94622 4.86006V4.5C9.94622 4.12998 10.0511 3.59165 10.3876 3.12427C10.7516 2.61865 11.3518 2.25 12.1962 2.25C13.0407 2.25 13.6408 2.61865 14.0049 3.12427C14.1824 3.3709 14.2955 3.63728 14.3627 3.88826C14.6077 3.79994 14.8854 3.75 15.1962 3.75C16.0407 3.75 16.6408 4.11865 17.0049 4.62427C17.3414 5.09165 17.4462 5.62998 17.4462 6V7.86006C17.6703 7.78938 17.9202 7.75 18.1962 7.75C19.0407 7.75 19.6408 8.11865 20.0049 8.62427C20.3414 9.09165 20.4462 9.62998 20.4462 10V16C20.4462 16.3593 20.3924 16.7637 20.2808 17.1915L18.9462 15.857V10C18.9462 9.87002 18.9011 9.65835 18.7876 9.50073C18.7016 9.38135 18.5518 9.25 18.1962 9.25C17.8407 9.25 17.6908 9.38135 17.6049 9.50073C17.4914 9.65835 17.4462 9.87002 17.4462 10V13C17.4462 13.3693 17.1792 13.6763 16.8277 13.7385L15.9462 12.857V10V6C15.9462 5.87002 15.9011 5.65835 15.7876 5.50073C15.7016 5.38135 15.5518 5.25 15.1962 5.25C14.8407 5.25 14.6908 5.38135 14.6049 5.50073C14.4914 5.65835 14.4462 5.87002 14.4462 6V11.357L12.9462 9.85699V6V4.5C12.9462 4.37002 12.9011 4.15835 12.7876 4.00073C12.7016 3.88135 12.5518 3.75 12.1962 3.75C11.8407 3.75 11.6908 3.88135 11.6049 4.00073C11.4914 4.15835 11.4462 4.37002 11.4462 4.5V7V8.35699L9.92865 6.83942Z" fill="#77828C"/>
|
||||||
|
<rect x="6.99756" y="5.5835" width="18.9738" height="2" rx="1" transform="rotate(45 6.99756 5.5835)" fill="#E94444"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.8 KiB |
@@ -0,0 +1,10 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_644_34553)">
|
||||||
|
<path d="M7.69615 15L7.69617 14.5M10.6962 7C10.6962 6.5 10.3962 5.5 9.19615 5.5C7.99615 5.5 7.69615 6.5 7.69615 7L7.69617 14.5M10.6962 7V12M10.6962 7V4.5C10.6962 4 10.9962 3 12.1962 3C13.3962 3 13.6962 4 13.6962 4.5V6M13.6962 12V6M13.6962 6C13.6962 5.5 13.9962 4.5 15.1962 4.5C16.3962 4.5 16.6962 5.5 16.6962 6V10M16.6962 13V10M16.6962 10C16.6962 9.5 16.9962 8.5 18.1962 8.5C19.3962 8.5 19.6962 9.5 19.6962 10V16C19.6962 18 17.6335 22 12.1962 22C10.0262 22 8 21 7 19.5C4.9972 17.9297 4.69615 16.4895 4.69615 15C4.69615 14.6667 4.59615 13.8 4.19615 13C3.69615 12 4.19615 11 5.19615 11C5.99615 11 6.5295 11.6667 6.69617 12C7.02951 12.5 7.69618 13.7 7.69617 14.5" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_644_34553">
|
||||||
|
<rect width="24" height="24" fill="white"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 993 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
@@ -0,0 +1,3 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12 17.7857C13.5913 17.7857 15.1174 17.2439 16.2426 16.2794C17.3679 15.3149 18 14.0068 18 12.6429V11.3571M12 17.7857C10.4087 17.7857 8.88258 17.2439 7.75736 16.2794C6.63214 15.3149 6 14.0068 6 12.6429V11.3571M12 17.7857V21M8.25 21H15.75M12 15.2143C11.2044 15.2143 10.4413 14.9434 9.87868 14.4611C9.31607 13.9789 9 13.3248 9 12.6429V5.57143C9 4.88944 9.31607 4.23539 9.87868 3.75315C10.4413 3.27092 11.2044 3 12 3C12.7956 3 13.5587 3.27092 14.1213 3.75315C14.6839 4.23539 15 4.88944 15 5.57143V12.6429C15 13.3248 14.6839 13.9789 14.1213 14.4611C13.5587 14.9434 12.7956 15.2143 12 15.2143Z" stroke="#77828C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 786 B |
@@ -0,0 +1,5 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<circle cx="5" cy="12" r="1.5" fill="#77828C"/>
|
||||||
|
<circle cx="12" cy="12" r="1.5" fill="#77828C"/>
|
||||||
|
<circle cx="19" cy="12" r="1.5" fill="#77828C"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 249 B |
@@ -0,0 +1,8 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path
|
||||||
|
d="M11.5504 8.63457C11.5504 10.6419 13.0948 12.7428 14.9999 12.7428C16.9051 12.7428 18.4495 10.6419 18.4495 8.63457C18.4495 6.62725 16.9051 5 14.9999 5C13.0948 5 11.5504 6.62725 11.5504 8.63457ZM11.5504 8.63457C11.5504 7.28973 12.2436 6.11548 13.2741 5.48689M11.5504 8.63457C11.5504 9.11955 11.6405 9.61 11.8041 10.075M15 14.9671C16.7818 14.9671 18.2309 13.0848 19.4873 14.416C19.9916 14.9503 20.1244 15.3012 20.4474 16.0591C20.6934 16.6363 20.9351 17.364 20.9944 18.0927C21.0379 18.6262 20.8272 19.1412 20.3999 19.4209C19.4866 20.0186 18.4171 19.9999 15 19.9999C11.5829 19.9999 10.5134 20.0186 9.6001 19.4209C9.17276 19.1412 8.96214 18.6262 9.0056 18.0927C9.06495 17.364 9.30658 16.6363 9.55259 16.0591M15 14.9671C13.2182 14.9671 11.7691 13.0848 10.5127 14.416M15 14.9671C14.2982 14.9671 13.6481 14.6751 13.041 14.4025C12.1066 13.9829 11.2743 13.6091 10.5127 14.416M15 14.9671C15.2552 14.9671 15.5035 14.9285 15.7455 14.8662M10.5127 14.416C10.0084 14.9503 9.87561 15.3012 9.55259 16.0591M10.5127 14.416C10.0364 14.9206 9.8915 15.2617 9.60474 15.9365L9.55259 16.0591M9.55259 16.0591C9.31704 16.6118 9.08551 17.3024 9.01414 17.9997M14.7595 12.7316C14.1418 12.6741 13.5688 12.3981 13.083 11.9823"
|
||||||
|
stroke="#77828C" stroke-width="1.5" stroke-linejoin="round" />
|
||||||
|
<path
|
||||||
|
d="M3.91278 7.66535C3.91278 9.13738 5.07109 10.6781 6.49994 10.6781C7.9288 10.6781 9.08712 9.13738 9.08712 7.66535C9.08712 6.19332 7.9288 5 6.49994 5C5.07109 5 3.91278 6.19332 3.91278 7.66535ZM3.91278 7.66535C3.91278 6.67914 4.43269 5.81802 5.20556 5.35705M3.91278 7.66535C3.91278 8.021 3.98039 8.38066 4.1031 8.72164M10.5856 14.11C10.3433 13.5542 10.2437 13.2969 9.86547 12.9051C8.92317 11.9288 7.83636 13.3092 6.5 13.3092M6.5 13.3092C5.16364 13.3092 4.07683 11.9288 3.13453 12.9051M6.5 13.3092C5.97368 13.3092 5.48607 13.0951 5.03075 12.8952C4.32998 12.5874 3.70571 12.3133 3.13453 12.9051M6.5 13.3092C6.69139 13.3092 6.87765 13.2809 7.05911 13.2353M3.13453 12.9051C2.75631 13.2969 2.65671 13.5542 2.41445 14.11M3.13453 12.9051C2.77732 13.2751 2.66862 13.5252 2.45355 14.0201L2.41445 14.11M2.41445 14.11C2.22993 14.5333 2.04871 15.067 2.0042 15.6013C1.9716 15.9925 2.12957 16.3702 2.45008 16.5753C3.13502 17.0137 3.9372 17 6.5 17C7.68428 17 8.4926 17.0029 9.08712 16.9628M2.41445 14.11C2.23778 14.5153 2.06413 15.0218 2.01061 15.5331M6.31964 10.6699C5.85634 10.6277 5.42659 10.4253 5.06226 10.1204"
|
||||||
|
stroke="#77828C" stroke-width="1.5" stroke-linejoin="round" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
@@ -0,0 +1,3 @@
|
|||||||
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M7.57375 11.305C7.36853 10.9357 7.04651 10.6451 6.65823 10.4786C6.26995 10.3122 5.83739 10.2794 5.42845 10.3854C5.01952 10.4914 4.65736 10.7302 4.39882 11.0643C4.14028 11.3984 4 11.8089 4 12.2313C4 12.6538 4.14028 13.0643 4.39882 13.3984C4.65736 13.7325 5.01952 13.9713 5.42845 14.0773C5.83739 14.1833 6.26995 14.1505 6.65823 13.984C7.04651 13.8176 7.36853 13.5269 7.57375 13.1577M7.57375 11.305C7.7263 11.5796 7.8136 11.8949 7.8136 12.2313C7.8136 12.5678 7.7263 12.8839 7.57375 13.1577M7.57375 11.305L15.6812 6.80124M7.57375 13.1577L15.6812 17.6614M15.6812 6.80124C15.8 7.0251 15.9624 7.22302 16.1586 7.38343C16.3549 7.54383 16.5811 7.6635 16.8242 7.73545C17.0672 7.80739 17.3221 7.83015 17.5741 7.80241C17.826 7.77468 18.0699 7.69699 18.2915 7.57389C18.5131 7.4508 18.7079 7.28477 18.8645 7.08551C19.0212 6.88625 19.1365 6.65776 19.2038 6.4134C19.2712 6.16903 19.2891 5.9137 19.2566 5.66233C19.2241 5.41096 19.1418 5.16859 19.0145 4.94939C18.7637 4.51745 18.3534 4.20115 17.8719 4.06849C17.3903 3.93583 16.8759 3.99741 16.4393 4.23998C16.0027 4.48255 15.6787 4.88675 15.5369 5.36569C15.3951 5.84464 15.4469 6.36009 15.6812 6.80124ZM15.6812 17.6614C15.5595 17.8804 15.4822 18.1212 15.4536 18.3701C15.425 18.6189 15.4457 18.871 15.5146 19.1119C15.5834 19.3527 15.699 19.5777 15.8547 19.7738C16.0105 19.97 16.2034 20.1336 16.4223 20.2553C16.6413 20.3769 16.8821 20.4543 17.131 20.4828C17.3798 20.5114 17.6319 20.4907 17.8728 20.4219C18.1136 20.3531 18.3386 20.2375 18.5348 20.0817C18.7309 19.926 18.8945 19.7331 19.0162 19.5141C19.2619 19.0719 19.3218 18.5501 19.1828 18.0637C19.0438 17.5773 18.7173 17.1659 18.275 16.9203C17.8328 16.6746 17.311 16.6146 16.8246 16.7536C16.3382 16.8926 15.9269 17.2192 15.6812 17.6614Z" stroke="#77828C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.9 KiB |
@@ -0,0 +1,18 @@
|
|||||||
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||||
|
import { useRouteError } from "react-router-dom";
|
||||||
|
|
||||||
|
function ErrorBoundary() {
|
||||||
|
const error: any = useRouteError();
|
||||||
|
console.error(error);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="h-screen flex items-center justify-center p-8 text-white">
|
||||||
|
<div className="flex items-center gap-4">
|
||||||
|
<p className="font-gilroy text-2xl">{error.status}</p>
|
||||||
|
<p>{error.statusText}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ErrorBoundary;
|
||||||
@@ -1,4 +1,6 @@
|
|||||||
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||||
/* eslint-disable react-hooks/exhaustive-deps */
|
/* eslint-disable react-hooks/exhaustive-deps */
|
||||||
|
/* eslint-disable no-empty */
|
||||||
// Copyright Epic Games, Inc. All Rights Reserved.
|
// Copyright Epic Games, Inc. All Rights Reserved.
|
||||||
|
|
||||||
import { useEffect, useRef, useState } from "react";
|
import { useEffect, useRef, useState } from "react";
|
||||||
@@ -6,16 +8,17 @@ import {
|
|||||||
Config,
|
Config,
|
||||||
AllSettings,
|
AllSettings,
|
||||||
PixelStreaming,
|
PixelStreaming,
|
||||||
|
LatencyTestResults,
|
||||||
} from "@epicgames-ps/lib-pixelstreamingfrontend-ue5.3";
|
} from "@epicgames-ps/lib-pixelstreamingfrontend-ue5.3";
|
||||||
import { Trans } from "react-i18next";
|
|
||||||
import LoaderIcon from "./icons/LoaderIcon";
|
|
||||||
|
|
||||||
export interface PixelStreamingWrapperProps {
|
export interface PixelStreamingWrapperProps {
|
||||||
initialSettings?: Partial<AllSettings>;
|
initialSettings?: Partial<AllSettings>;
|
||||||
|
onVideoInitialized?: () => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const PixelStreamingWrapper = ({
|
export const PixelStreamingWrapper = ({
|
||||||
initialSettings,
|
initialSettings,
|
||||||
|
onVideoInitialized,
|
||||||
}: PixelStreamingWrapperProps) => {
|
}: PixelStreamingWrapperProps) => {
|
||||||
// A reference to parent div element that the Pixel Streaming library attaches into:
|
// A reference to parent div element that the Pixel Streaming library attaches into:
|
||||||
const videoParent = useRef<HTMLDivElement>(null);
|
const videoParent = useRef<HTMLDivElement>(null);
|
||||||
@@ -24,10 +27,10 @@ export const PixelStreamingWrapper = ({
|
|||||||
const [pixelStreaming, setPixelStreaming] = useState<PixelStreaming>();
|
const [pixelStreaming, setPixelStreaming] = useState<PixelStreaming>();
|
||||||
|
|
||||||
// A boolean state variable that determines if the Click to play overlay is shown:
|
// A boolean state variable that determines if the Click to play overlay is shown:
|
||||||
const [clickToPlayVisible, setClickToPlayVisible] = useState<boolean>(false);
|
const [clickToPlayVisible, setClickToPlayVisible] = useState(false);
|
||||||
const [videoInitialized, setVideoInitialized] = useState<boolean>(false);
|
|
||||||
const videoInitializedRef = useRef<boolean>();
|
const [latencyTestResult, setLatencyTestResult] =
|
||||||
videoInitializedRef.current = videoInitialized;
|
useState<LatencyTestResults>();
|
||||||
|
|
||||||
// Run on component mount:
|
// Run on component mount:
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -38,132 +41,93 @@ export const PixelStreamingWrapper = ({
|
|||||||
videoElementParent: videoParent.current,
|
videoElementParent: videoParent.current,
|
||||||
});
|
});
|
||||||
|
|
||||||
streaming.addEventListener("videoInitialized", () => {
|
|
||||||
setVideoInitialized(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
// register a playStreamRejected handler to show Click to play overlay if needed:
|
// register a playStreamRejected handler to show Click to play overlay if needed:
|
||||||
streaming.addEventListener("playStreamRejected", () => {
|
streaming.addEventListener("playStreamRejected", () => {
|
||||||
setClickToPlayVisible(true);
|
setClickToPlayVisible(true);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
streaming.addEventListener("videoInitialized", () => {
|
||||||
|
onVideoInitialized && onVideoInitialized();
|
||||||
|
});
|
||||||
|
|
||||||
|
streaming.addEventListener("latencyTestResult", (e) => {
|
||||||
|
setLatencyTestResult(e.data.latencyTimings);
|
||||||
|
// console.log("Data", e.data.latencyTimings);
|
||||||
|
});
|
||||||
|
|
||||||
|
setInterval(() => {
|
||||||
|
streaming.requestLatencyTest();
|
||||||
|
}, 500);
|
||||||
|
|
||||||
// Save the library instance into component state so that it can be accessed later:
|
// Save the library instance into component state so that it can be accessed later:
|
||||||
setPixelStreaming(streaming);
|
setPixelStreaming(streaming);
|
||||||
|
|
||||||
document.getElementById("hiddenInput")?.remove();
|
|
||||||
document.getElementById("editTextButton")?.remove();
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
if (!videoInitializedRef.current) {
|
|
||||||
window.location.reload();
|
|
||||||
}
|
|
||||||
}, 10000);
|
|
||||||
|
|
||||||
// Clean up on component unmount:
|
// Clean up on component unmount:
|
||||||
return () => {
|
return () => {
|
||||||
try {
|
try {
|
||||||
streaming.disconnect();
|
streaming.disconnect();
|
||||||
} catch {
|
} catch {}
|
||||||
//
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="relative w-screen h-screen">
|
<div
|
||||||
<div className="w-full h-[100svh]" ref={videoParent} />
|
style={{
|
||||||
{!videoInitialized && (
|
width: "100%",
|
||||||
<div className="absolute top-0 left-0 w-full h-full flex justify-center items-center gap-4">
|
height: "100%",
|
||||||
<LoaderIcon className="animate-spin w-8 h-8" />
|
position: "relative",
|
||||||
<Trans i18nKey="streamBuffering">Буферизация потока</Trans>
|
}}
|
||||||
</div>
|
>
|
||||||
)}
|
<div
|
||||||
|
style={{
|
||||||
|
width: "100%",
|
||||||
|
height: "100%",
|
||||||
|
}}
|
||||||
|
ref={videoParent}
|
||||||
|
/>
|
||||||
{clickToPlayVisible && (
|
{clickToPlayVisible && (
|
||||||
<div className="absolute top-0 left-0 w-full h-full flex justify-center items-center z-10 bg-[#131317]">
|
<div
|
||||||
<div className="flex flex-col justify-center items-center w-[400px] p-10 space-y-10 rounded-lg">
|
style={{
|
||||||
<div className="space-y-4 text-center">
|
position: "absolute",
|
||||||
<p className="text-4xl font-gilroy">
|
top: 0,
|
||||||
<Trans i18nKey="demoStarted">Демонстрация начата</Trans>
|
left: 0,
|
||||||
</p>
|
width: "100%",
|
||||||
<p className="text-[#C5C7CE]">
|
height: "100%",
|
||||||
<Trans i18nKey="clickToContinue">
|
display: "flex",
|
||||||
Нажмите, чтобы продолжить
|
alignItems: "center",
|
||||||
</Trans>
|
justifyContent: "center",
|
||||||
</p>
|
cursor: "pointer",
|
||||||
</div>
|
color: "#fff",
|
||||||
|
}}
|
||||||
<button
|
onClick={() => {
|
||||||
onClick={() => {
|
pixelStreaming?.play();
|
||||||
pixelStreaming?.play();
|
setClickToPlayVisible(false);
|
||||||
setClickToPlayVisible(false);
|
}}
|
||||||
}}
|
>
|
||||||
>
|
<div>Click to play</div>
|
||||||
<svg
|
|
||||||
width="88"
|
|
||||||
height="88"
|
|
||||||
viewBox="0 0 88 88"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<g filter="url(#filter0_b_0_1121)">
|
|
||||||
<path
|
|
||||||
d="M55.6667 43.9999L34.6668 57.9999L34.6668 30L55.6667 43.9999Z"
|
|
||||||
fill="#F2F2F2"
|
|
||||||
stroke="#F2F2F2"
|
|
||||||
strokeLinecap="round"
|
|
||||||
strokeLinejoin="round"
|
|
||||||
/>
|
|
||||||
<rect
|
|
||||||
x="0.5"
|
|
||||||
y="0.5"
|
|
||||||
width="87"
|
|
||||||
height="87"
|
|
||||||
rx="43.5"
|
|
||||||
stroke="url(#paint0_linear_0_1121)"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
<defs>
|
|
||||||
<filter
|
|
||||||
id="filter0_b_0_1121"
|
|
||||||
x="-20"
|
|
||||||
y="-20"
|
|
||||||
width="128"
|
|
||||||
height="128"
|
|
||||||
filterUnits="userSpaceOnUse"
|
|
||||||
colorInterpolationFilters="sRGB"
|
|
||||||
>
|
|
||||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
|
||||||
<feGaussianBlur in="BackgroundImageFix" stdDeviation="10" />
|
|
||||||
<feComposite
|
|
||||||
in2="SourceAlpha"
|
|
||||||
operator="in"
|
|
||||||
result="effect1_backgroundBlur_0_1121"
|
|
||||||
/>
|
|
||||||
<feBlend
|
|
||||||
mode="normal"
|
|
||||||
in="SourceGraphic"
|
|
||||||
in2="effect1_backgroundBlur_0_1121"
|
|
||||||
result="shape"
|
|
||||||
/>
|
|
||||||
</filter>
|
|
||||||
<linearGradient
|
|
||||||
id="paint0_linear_0_1121"
|
|
||||||
x1="88"
|
|
||||||
y1="-2.6226e-06"
|
|
||||||
x2="2.6226e-06"
|
|
||||||
y2="88"
|
|
||||||
gradientUnits="userSpaceOnUse"
|
|
||||||
>
|
|
||||||
<stop stopColor="#BC75FF" />
|
|
||||||
<stop offset="1" stopColor="#798FFF" />
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
<div className="absolute bottom-0 left-0 p-4 text-white text-xs bg-black">
|
||||||
|
{latencyTestResult &&
|
||||||
|
Object.entries(latencyTestResult).map(([key, value], i) => {
|
||||||
|
if (
|
||||||
|
[
|
||||||
|
"EncodeMs",
|
||||||
|
"CaptureToSendMs",
|
||||||
|
"latencyExcludingDecode",
|
||||||
|
"networkLatency",
|
||||||
|
"testStartTimeMs",
|
||||||
|
].includes(key)
|
||||||
|
)
|
||||||
|
return (
|
||||||
|
<div key={i}>
|
||||||
|
{key}: {value}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -0,0 +1,27 @@
|
|||||||
|
function AttachIcon() {
|
||||||
|
return (
|
||||||
|
<svg
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M19 5V10M19 5H14M19 5L14 10"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M10.2502 5L8.00015 5C6.34331 5 5.00018 6.34312 5.00015 7.99996L5.00004 16C5.00002 17.6568 6.34317 19 8.00004 19H16C17.6569 19 19 17.6569 19 16V13.75"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default AttachIcon;
|
||||||
@@ -1,17 +1,17 @@
|
|||||||
interface IconProps {
|
function ChatIcon() {
|
||||||
className?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
function ChatIcon({ className }: IconProps) {
|
|
||||||
return (
|
return (
|
||||||
<svg
|
<svg
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
width="24"
|
||||||
|
height="24"
|
||||||
viewBox="0 0 24 24"
|
viewBox="0 0 24 24"
|
||||||
fill="currentColor"
|
fill="none"
|
||||||
className={className}
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
>
|
>
|
||||||
<path d="M4.913 2.658c2.075-.27 4.19-.408 6.337-.408 2.147 0 4.262.139 6.337.408 1.922.25 3.291 1.861 3.405 3.727a4.403 4.403 0 00-1.032-.211 50.89 50.89 0 00-8.42 0c-2.358.196-4.04 2.19-4.04 4.434v4.286a4.47 4.47 0 002.433 3.984L7.28 21.53A.75.75 0 016 21v-4.03a48.527 48.527 0 01-1.087-.128C2.905 16.58 1.5 14.833 1.5 12.862V6.638c0-1.97 1.405-3.718 3.413-3.979z" />
|
<path
|
||||||
<path d="M15.75 7.5c-1.376 0-2.739.057-4.086.169C10.124 7.797 9 9.103 9 10.609v4.285c0 1.507 1.128 2.814 2.67 2.94 1.243.102 2.5.157 3.768.165l2.782 2.781a.75.75 0 001.28-.53v-2.39l.33-.026c1.542-.125 2.67-1.433 2.67-2.94v-4.286c0-1.505-1.125-2.811-2.664-2.94A49.392 49.392 0 0015.75 7.5z" />
|
d="M17 6H6C4.89543 6 4 6.89543 4 8V15C4 16.1046 4.89543 17 6 17H11L14.3753 19.7002C15.0301 20.2241 16 19.7579 16 18.9194V17H17C18.1046 17 19 16.1046 19 15V8C19 6.89543 18.1046 6 17 6Z"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
/>
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,16 +7,13 @@ function CloseIcon() {
|
|||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
>
|
>
|
||||||
<g id="Icon/Close">
|
<path
|
||||||
<path
|
d="M12 12L17 7.00026M12 12L7.00009 7M12 12L16.9999 16.9999M12 12L7 17"
|
||||||
id="Vector 106"
|
stroke="currentColor"
|
||||||
d="M12.0002 11.9999L17.6572 6.34331M12.0002 11.9999L6.34337 6.34302M12.0002 11.9999L17.6571 17.6567M12.0002 11.9999L6.34326 17.6568"
|
stroke-width="1.5"
|
||||||
stroke="white"
|
stroke-linecap="round"
|
||||||
strokeWidth="2"
|
stroke-linejoin="round"
|
||||||
strokeLinecap="round"
|
/>
|
||||||
strokeLinejoin="round"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,28 @@
|
|||||||
|
function DetachIcon() {
|
||||||
|
return (
|
||||||
|
<svg
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<rect
|
||||||
|
x="5"
|
||||||
|
y="5"
|
||||||
|
width="14"
|
||||||
|
height="14"
|
||||||
|
rx="3"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M5 8C5 6.34315 6.34315 5 8 5H16C17.6569 5 19 6.34315 19 8V9H5V8Z"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default DetachIcon;
|
||||||
@@ -7,16 +7,20 @@ function FullscreenIcon() {
|
|||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
>
|
>
|
||||||
<g id="Icon/OpenFullscreen">
|
<path
|
||||||
<path
|
d="M4 20V14M4 20H10M4 20L10 14"
|
||||||
id="expand"
|
stroke="currentColor"
|
||||||
d="M9 20H4M4 20L4 15M4 20L9 15M15 9L20 4M19.997 9V4L15 4"
|
stroke-width="1.5"
|
||||||
stroke="#F2F2F2"
|
stroke-linecap="round"
|
||||||
strokeWidth="2"
|
stroke-linejoin="round"
|
||||||
strokeLinecap="round"
|
/>
|
||||||
strokeLinejoin="round"
|
<path
|
||||||
/>
|
d="M20 4V10M20 4H14M20 4L14 10"
|
||||||
</g>
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,28 @@
|
|||||||
|
function GearIcon() {
|
||||||
|
return (
|
||||||
|
<svg
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M9.59372 3.94C9.68372 3.398 10.1537 3 10.7037 3H13.2967C13.8467 3 14.3167 3.398 14.4067 3.94L14.6197 5.221C14.6827 5.595 14.9327 5.907 15.2647 6.091C15.3387 6.131 15.4117 6.174 15.4847 6.218C15.8087 6.414 16.2047 6.475 16.5597 6.342L17.7767 5.886C18.0261 5.79221 18.3007 5.78998 18.5516 5.87971C18.8025 5.96945 19.0134 6.14531 19.1467 6.376L20.4427 8.623C20.5758 8.8537 20.6227 9.12413 20.5751 9.38617C20.5275 9.6482 20.3884 9.88485 20.1827 10.054L19.1797 10.881C18.8867 11.121 18.7417 11.494 18.7487 11.873C18.7503 11.958 18.7503 12.043 18.7487 12.128C18.7417 12.506 18.8867 12.878 19.1787 13.118L20.1837 13.946C20.6077 14.296 20.7177 14.9 20.4437 15.376L19.1457 17.623C19.0126 17.8536 18.8019 18.0296 18.5512 18.1195C18.3005 18.2094 18.0261 18.2074 17.7767 18.114L16.5597 17.658C16.2047 17.525 15.8097 17.586 15.4837 17.782C15.4112 17.8261 15.3379 17.8688 15.2637 17.91C14.9327 18.093 14.6827 18.405 14.6197 18.779L14.4067 20.059C14.3167 20.602 13.8467 21 13.2967 21H10.7027C10.1527 21 9.68272 20.602 9.59272 20.06L9.37972 18.779C9.31772 18.405 9.06772 18.093 8.73572 17.909C8.66157 17.8681 8.58822 17.8258 8.51572 17.782C8.19072 17.586 7.79572 17.525 7.43972 17.658L6.22272 18.114C5.97345 18.2075 5.69908 18.2096 5.44842 18.1199C5.19775 18.0302 4.98703 17.8545 4.85372 17.624L3.55672 15.377C3.42366 15.1463 3.37676 14.8759 3.42437 14.6138C3.47198 14.3518 3.61101 14.1152 3.81672 13.946L4.82072 13.119C5.11272 12.879 5.25772 12.506 5.25072 12.127C5.24915 12.042 5.24915 11.957 5.25072 11.872C5.25772 11.494 5.11272 11.122 4.82072 10.882L3.81672 10.054C3.61126 9.88489 3.47239 9.64843 3.42479 9.38662C3.37719 9.12481 3.42393 8.8546 3.55672 8.624L4.85372 6.377C4.9869 6.14614 5.19773 5.97006 5.44863 5.88014C5.69953 5.79021 5.97421 5.79229 6.22372 5.886L7.43972 6.342C7.79572 6.475 8.19072 6.414 8.51572 6.218C8.58772 6.174 8.66172 6.131 8.73572 6.09C9.06772 5.907 9.31772 5.595 9.37972 5.221L9.59372 3.94Z"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M15 12C15 12.7956 14.6839 13.5587 14.1213 14.1213C13.5587 14.6839 12.7956 15 12 15C11.2044 15 10.4413 14.6839 9.87868 14.1213C9.31607 13.5587 9 12.7956 9 12C9 11.2044 9.31607 10.4413 9.87868 9.87868C10.4413 9.31607 11.2044 9 12 9C12.7956 9 13.5587 9.31607 14.1213 9.87868C14.6839 10.4413 15 11.2044 15 12Z"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default GearIcon;
|
||||||
File diff suppressed because one or more lines are too long
@@ -7,25 +7,21 @@ function MicroOffIcon() {
|
|||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
>
|
>
|
||||||
<g id="Icon/MicroOff">
|
<path
|
||||||
<path
|
fill-rule="evenodd"
|
||||||
id="Subtract"
|
clip-rule="evenodd"
|
||||||
fillRule="evenodd"
|
d="M8.25 11.3407V12.6429C8.25 13.5643 8.67801 14.4198 9.39059 15.0306C10.0996 15.6383 11.0396 15.9643 12 15.9643C12.2691 15.9643 12.5366 15.9387 12.7978 15.8885L11.2757 14.3664C10.9294 14.2701 10.6173 14.1064 10.3668 13.8917C10.0204 13.5948 9.821 13.2283 9.76584 12.8565L8.25 11.3407ZM14.25 11.16V5.57143C14.25 5.12894 14.0459 4.67629 13.6332 4.3226C13.217 3.96584 12.6309 3.75 12 3.75C11.3691 3.75 10.783 3.96584 10.3668 4.3226C9.95413 4.67629 9.75 5.12894 9.75 5.57143V6.65997L8.27524 5.18521C8.37666 4.41304 8.77871 3.70817 9.39059 3.18371C10.0996 2.576 11.0396 2.25 12 2.25C12.9604 2.25 13.9004 2.576 14.6094 3.18371C15.322 3.79449 15.75 4.64994 15.75 5.57143V12.6429C15.75 12.6485 15.75 12.6542 15.75 12.6599L14.25 11.16ZM13.7058 16.7965C13.1641 16.9528 12.5886 17.0357 12 17.0357C10.5735 17.0357 9.22428 16.549 8.24545 15.71C7.2702 14.874 6.75 13.7673 6.75 12.6429V11.3571C6.75 10.9429 6.41421 10.6071 6 10.6071C5.58579 10.6071 5.25 10.9429 5.25 11.3571V12.6429C5.25 14.2463 5.99408 15.7558 7.26927 16.8489C8.35879 17.7827 9.76505 18.3547 11.25 18.4993V20.25H8.25C7.83579 20.25 7.5 20.5858 7.5 21C7.5 21.4142 7.83579 21.75 8.25 21.75H12H15.75C16.1642 21.75 16.5 21.4142 16.5 21C16.5 20.5858 16.1642 20.25 15.75 20.25H12.75V18.4993C13.4901 18.4272 14.2106 18.249 14.8821 17.9728L13.7058 16.7965ZM18.1549 15.0648L17.0189 13.9289C17.1717 13.5127 17.25 13.0791 17.25 12.6429V11.3571C17.25 10.9429 17.5858 10.6071 18 10.6071C18.4142 10.6071 18.75 10.9429 18.75 11.3571V12.6429C18.75 13.4926 18.5411 14.3159 18.1549 15.0648Z"
|
||||||
clipRule="evenodd"
|
fill="currentColor"
|
||||||
d="M9 11.9387V12.4C9 13.2837 9.71634 14 10.6 14H11.0613L9 11.9387ZM13.0613 16H10C8.34315 16 7 14.6569 7 13V12C7 11.4477 6.55228 11 6 11C5.44772 11 5 11.4477 5 12V13C5 15.7614 7.23858 18 10 18H11V19.9998H9.6C9.04772 19.9998 8.6 20.4475 8.6 20.9998C8.6 21.5521 9.04772 21.9998 9.6 21.9998H14.4C14.9523 21.9998 15.4 21.5521 15.4 20.9998C15.4 20.4475 14.9523 19.9998 14.4 19.9998H13V18H14C14.3311 18 14.6547 17.9678 14.9678 17.9064L13.0613 16ZM18.37 15.4315L16.8568 13.9184C16.9498 13.6289 17 13.3203 17 13V12C17 11.4477 17.4477 11 18 11C18.5523 11 19 11.4477 19 12V13C19 13.8826 18.7713 14.7118 18.37 15.4315ZM15 12.0615L9 6.06152V4.1C9 3.21634 9.71634 2.5 10.6 2.5H13.4C14.2837 2.5 15 3.21634 15 4.1V12.0615Z"
|
/>
|
||||||
fill="#F2F2F2"
|
<rect
|
||||||
/>
|
x="6"
|
||||||
<rect
|
y="4.58618"
|
||||||
id="Rectangle 1100"
|
width="18.9662"
|
||||||
x="3.41406"
|
height="2"
|
||||||
y="2"
|
rx="1"
|
||||||
width="26.2811"
|
transform="rotate(45 6 4.58618)"
|
||||||
height="2"
|
fill="#E94444"
|
||||||
rx="1"
|
/>
|
||||||
transform="rotate(45 3.41406 2)"
|
|
||||||
fill="#E94444"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,18 +7,13 @@ function MicroOnIcon() {
|
|||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
>
|
>
|
||||||
<g id="Icon/MicroOn">
|
<path
|
||||||
<g id="Vector">
|
d="M12 17.7857C13.5913 17.7857 15.1174 17.2439 16.2426 16.2794C17.3679 15.3149 18 14.0068 18 12.6429V11.3571M12 17.7857C10.4087 17.7857 8.88258 17.2439 7.75736 16.2794C6.63214 15.3149 6 14.0068 6 12.6429V11.3571M12 17.7857V21M8.25 21H15.75M12 15.2143C11.2044 15.2143 10.4413 14.9434 9.87868 14.4611C9.31607 13.9789 9 13.3248 9 12.6429V5.57143C9 4.88944 9.31607 4.23539 9.87868 3.75315C10.4413 3.27092 11.2044 3 12 3C12.7956 3 13.5587 3.27092 14.1213 3.75315C14.6839 4.23539 15 4.88944 15 5.57143V12.6429C15 13.3248 14.6839 13.9789 14.1213 14.4611C13.5587 14.9434 12.7956 15.2143 12 15.2143Z"
|
||||||
<path
|
stroke="currentColor"
|
||||||
d="M10.6 2.5H13.4C14.2837 2.5 15 3.21634 15 4.1V12.4C15 13.2837 14.2837 14 13.4 14H10.6C9.71634 14 9 13.2837 9 12.4V4.1C9 3.21634 9.71634 2.5 10.6 2.5Z"
|
stroke-width="1.5"
|
||||||
fill="#F2F2F2"
|
stroke-linecap="round"
|
||||||
/>
|
stroke-linejoin="round"
|
||||||
<path
|
/>
|
||||||
d="M10 16C8.34315 16 7 14.6569 7 13V12C7 11.4477 6.55228 11 6 11C5.44772 11 5 11.4477 5 12V13C5 15.7614 7.23858 18 10 18H11V19.9998H9.6C9.04772 19.9998 8.6 20.4475 8.6 20.9998C8.6 21.5521 9.04772 21.9998 9.6 21.9998H14.4C14.9523 21.9998 15.4 21.5521 15.4 20.9998C15.4 20.4475 14.9523 19.9998 14.4 19.9998H13V18H14C16.7614 18 19 15.7614 19 13V12C19 11.4477 18.5523 11 18 11C17.4477 11 17 11.4477 17 12V13C17 14.6569 15.6569 16 14 16H10Z"
|
|
||||||
fill="#F2F2F2"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,17 @@
|
|||||||
|
function MoreIcon() {
|
||||||
|
return (
|
||||||
|
<svg
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<circle cx="5" cy="12" r="1.5" fill="currentColor" />
|
||||||
|
<circle cx="12" cy="12" r="1.5" fill="currentColor" />
|
||||||
|
<circle cx="19" cy="12" r="1.5" fill="currentColor" />
|
||||||
|
</svg>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default MoreIcon;
|
||||||
@@ -7,25 +7,18 @@ function PersonsIcon() {
|
|||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
>
|
>
|
||||||
<g id="Icon/Persons">
|
<path
|
||||||
<g id="user">
|
d="M11.5504 8.63457C11.5504 10.6419 13.0948 12.7428 14.9999 12.7428C16.9051 12.7428 18.4495 10.6419 18.4495 8.63457C18.4495 6.62725 16.9051 5 14.9999 5C13.0948 5 11.5504 6.62725 11.5504 8.63457ZM11.5504 8.63457C11.5504 7.28973 12.2436 6.11548 13.2741 5.48689M11.5504 8.63457C11.5504 9.11955 11.6405 9.61 11.8041 10.075M15 14.9671C16.7818 14.9671 18.2309 13.0848 19.4873 14.416C19.9916 14.9503 20.1244 15.3012 20.4474 16.0591C20.6934 16.6363 20.9351 17.364 20.9944 18.0927C21.0379 18.6262 20.8272 19.1412 20.3999 19.4209C19.4866 20.0186 18.4171 19.9999 15 19.9999C11.5829 19.9999 10.5134 20.0186 9.6001 19.4209C9.17276 19.1412 8.96214 18.6262 9.0056 18.0927C9.06495 17.364 9.30658 16.6363 9.55259 16.0591M15 14.9671C13.2182 14.9671 11.7691 13.0848 10.5127 14.416M15 14.9671C14.2982 14.9671 13.6481 14.6751 13.041 14.4025C12.1066 13.9829 11.2743 13.6091 10.5127 14.416M15 14.9671C15.2552 14.9671 15.5035 14.9285 15.7455 14.8662M10.5127 14.416C10.0084 14.9503 9.87561 15.3012 9.55259 16.0591M10.5127 14.416C10.0364 14.9206 9.8915 15.2617 9.60474 15.9365L9.55259 16.0591M9.55259 16.0591C9.31704 16.6118 9.08551 17.3024 9.01414 17.9997M14.7595 12.7316C14.1418 12.6741 13.5688 12.3981 13.083 11.9823"
|
||||||
<path
|
stroke="currentColor"
|
||||||
d="M17.4495 8.63457C17.4495 10.6419 15.9051 12.7428 13.9999 12.7428C12.0948 12.7428 10.5504 10.6419 10.5504 8.63457C10.5504 6.62725 12.0948 5 13.9999 5C15.9051 5 17.4495 6.62725 17.4495 8.63457Z"
|
stroke-width="1.5"
|
||||||
fill="#F2F2F2"
|
stroke-linejoin="round"
|
||||||
/>
|
/>
|
||||||
<path
|
<path
|
||||||
d="M14 19.9999C17.4171 19.9999 18.4866 20.0186 19.3999 19.4209C19.8272 19.1412 20.0379 18.6262 19.9944 18.0927C19.935 17.364 19.6934 16.6363 19.4474 16.0591C19.1244 15.3012 18.9916 14.9503 18.4873 14.416C17.2309 13.0848 15.7818 14.9671 14 14.9671C12.2182 14.9671 10.7691 13.0848 9.51271 14.416C9.00842 14.9503 8.87561 15.3012 8.55259 16.0591C8.30658 16.6363 8.06495 17.364 8.0056 18.0927C7.96214 18.6262 8.17276 19.1412 8.6001 19.4209C9.51336 20.0186 10.5829 19.9999 14 19.9999Z"
|
d="M3.91278 7.66535C3.91278 9.13738 5.07109 10.6781 6.49994 10.6781C7.9288 10.6781 9.08712 9.13738 9.08712 7.66535C9.08712 6.19332 7.9288 5 6.49994 5C5.07109 5 3.91278 6.19332 3.91278 7.66535ZM3.91278 7.66535C3.91278 6.67914 4.43269 5.81802 5.20556 5.35705M3.91278 7.66535C3.91278 8.021 3.98039 8.38066 4.1031 8.72164M10.5856 14.11C10.3433 13.5542 10.2437 13.2969 9.86547 12.9051C8.92317 11.9288 7.83636 13.3092 6.5 13.3092M6.5 13.3092C5.16364 13.3092 4.07683 11.9288 3.13453 12.9051M6.5 13.3092C5.97368 13.3092 5.48607 13.0951 5.03075 12.8952C4.32998 12.5874 3.70571 12.3133 3.13453 12.9051M6.5 13.3092C6.69139 13.3092 6.87765 13.2809 7.05911 13.2353M3.13453 12.9051C2.75631 13.2969 2.65671 13.5542 2.41445 14.11M3.13453 12.9051C2.77732 13.2751 2.66862 13.5252 2.45355 14.0201L2.41445 14.11M2.41445 14.11C2.22993 14.5333 2.04871 15.067 2.0042 15.6013C1.9716 15.9925 2.12957 16.3702 2.45008 16.5753C3.13502 17.0137 3.9372 17 6.5 17C7.68428 17 8.4926 17.0029 9.08712 16.9628M2.41445 14.11C2.23778 14.5153 2.06413 15.0218 2.01061 15.5331M6.31964 10.6699C5.85634 10.6277 5.42659 10.4253 5.06226 10.1204"
|
||||||
fill="#F2F2F2"
|
stroke="currentColor"
|
||||||
/>
|
stroke-width="1.5"
|
||||||
</g>
|
stroke-linejoin="round"
|
||||||
<path
|
/>
|
||||||
id="Subtract"
|
|
||||||
fillRule="evenodd"
|
|
||||||
clipRule="evenodd"
|
|
||||||
d="M10.8041 10.0751C11.7912 9.29544 12.4495 7.94506 12.4495 6.63457C12.4495 6.23357 12.3879 5.84773 12.274 5.48701C11.2435 6.11561 10.5503 7.28985 10.5503 8.63469C10.5503 9.11967 10.6405 9.61012 10.8041 10.0751ZM8.91837 10.7415C7.0509 10.6827 5.55037 8.61317 5.55037 6.63457C5.55037 4.62725 7.09478 3 8.99993 3C9.82378 3 10.5802 3.3043 11.1734 3.81204C9.57742 4.81661 8.55031 6.64022 8.55031 8.63469C8.55031 9.35547 8.68173 10.0702 8.91837 10.7415ZM6.0089 17.9735C4.79527 17.9257 4.16752 17.7923 3.6001 17.4209C3.17276 17.1412 2.96214 16.6262 3.0056 16.0927C3.06495 15.364 3.30658 14.6363 3.55259 14.0591L3.60475 13.9365C3.89151 13.2617 4.03642 12.9206 4.51271 12.416C5.27428 11.6091 6.10665 11.9829 7.041 12.4025C7.42296 12.574 7.82195 12.7532 8.24012 12.8625C8.17815 12.9202 8.11747 12.9805 8.05815 13.0434C7.33114 13.8137 7.06365 14.4459 6.77613 15.1255L6.71268 15.2751C6.42491 15.9502 6.09598 16.9012 6.01215 17.9304C6.01098 17.9447 6.0099 17.9591 6.0089 17.9735ZM14.7454 14.8664C14.8661 15.2559 14.9603 15.6741 14.9944 16.0927C15.0379 16.6262 14.8272 17.1412 14.3999 17.4209C13.5141 18.0007 12.4811 18.0005 9.30138 18L9 17.9999L8.69862 18C8.45849 18 8.2306 18 8.01409 17.9998C8.08546 17.3025 8.31698 16.6119 8.55254 16.0592L8.60469 15.9366C8.89145 15.2618 9.03637 14.9208 9.51265 14.4161C10.2742 13.6092 11.1066 13.983 12.0409 14.4026C12.648 14.6753 13.2982 14.9672 13.9999 14.9672C14.2551 14.9672 14.5035 14.9286 14.7454 14.8664ZM13.7595 12.7318C13.1417 12.6743 12.5687 12.3982 12.083 11.9825C12.579 11.877 13.0451 11.9475 13.4873 12.416C13.5925 12.5274 13.6815 12.6309 13.7595 12.7318Z"
|
|
||||||
fill="#F2F2F2"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,17 +7,13 @@ function ShareIcon() {
|
|||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
>
|
>
|
||||||
<g id="Icon/Share">
|
<path
|
||||||
<path
|
d="M7.57375 11.305C7.36853 10.9357 7.04651 10.6451 6.65823 10.4786C6.26995 10.3122 5.83739 10.2794 5.42845 10.3854C5.01952 10.4914 4.65736 10.7302 4.39882 11.0643C4.14028 11.3984 4 11.8089 4 12.2313C4 12.6538 4.14028 13.0643 4.39882 13.3984C4.65736 13.7325 5.01952 13.9713 5.42845 14.0773C5.83739 14.1833 6.26995 14.1505 6.65823 13.984C7.04651 13.8176 7.36853 13.5269 7.57375 13.1577M7.57375 11.305C7.7263 11.5796 7.8136 11.8949 7.8136 12.2313C7.8136 12.5678 7.7263 12.8839 7.57375 13.1577M7.57375 11.305L15.6812 6.80124M7.57375 13.1577L15.6812 17.6614M15.6812 6.80124C15.8 7.0251 15.9624 7.22302 16.1586 7.38343C16.3549 7.54383 16.5811 7.6635 16.8242 7.73545C17.0672 7.80739 17.3221 7.83015 17.5741 7.80241C17.826 7.77468 18.0699 7.69699 18.2915 7.57389C18.5131 7.4508 18.7079 7.28477 18.8645 7.08551C19.0212 6.88625 19.1365 6.65776 19.2038 6.4134C19.2712 6.16903 19.2891 5.9137 19.2566 5.66233C19.2241 5.41096 19.1418 5.16859 19.0145 4.94939C18.7637 4.51745 18.3534 4.20115 17.8719 4.06849C17.3903 3.93583 16.8759 3.99741 16.4393 4.23998C16.0027 4.48255 15.6787 4.88675 15.5369 5.36569C15.3951 5.84464 15.4469 6.36009 15.6812 6.80124ZM15.6812 17.6614C15.5595 17.8804 15.4822 18.1212 15.4536 18.3701C15.425 18.6189 15.4457 18.871 15.5146 19.1119C15.5834 19.3527 15.699 19.5777 15.8547 19.7738C16.0105 19.97 16.2034 20.1336 16.4223 20.2553C16.6413 20.3769 16.8821 20.4543 17.131 20.4828C17.3798 20.5114 17.6319 20.4907 17.8728 20.4219C18.1136 20.3531 18.3386 20.2375 18.5348 20.0817C18.7309 19.926 18.8945 19.7331 19.0162 19.5141C19.2619 19.0719 19.3218 18.5501 19.1828 18.0637C19.0438 17.5773 18.7173 17.1659 18.275 16.9203C17.8328 16.6746 17.311 16.6146 16.8246 16.7536C16.3382 16.8926 15.9269 17.2192 15.6812 17.6614Z"
|
||||||
id="Vector 1835"
|
stroke="currentColor"
|
||||||
d="M16 18L5 12L16 6"
|
stroke-width="1.5"
|
||||||
stroke="#F2F2F2"
|
stroke-linecap="round"
|
||||||
strokeWidth="2"
|
stroke-linejoin="round"
|
||||||
/>
|
/>
|
||||||
<circle id="Ellipse 226" cx="5" cy="12" r="3" fill="#F2F2F2" />
|
|
||||||
<circle id="Ellipse 227" cx="16" cy="6" r="3" fill="#F2F2F2" />
|
|
||||||
<circle id="Ellipse 228" cx="16" cy="18" r="3" fill="#F2F2F2" />
|
|
||||||
</g>
|
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,28 @@
|
|||||||
|
function WindowIcon() {
|
||||||
|
return (
|
||||||
|
<svg
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M10 14V20M10 14H4M10 14L4 20"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M14 10V4M14 10H20M14 10L20 4"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default WindowIcon;
|
||||||
@@ -0,0 +1,67 @@
|
|||||||
|
interface ButtonProps {
|
||||||
|
type?: "button" | "reset" | "submit";
|
||||||
|
variant?: "primary" | "secondary" | "tertiary";
|
||||||
|
fullWidth?: boolean;
|
||||||
|
large?: boolean;
|
||||||
|
icon?: JSX.Element;
|
||||||
|
onlyIcon?: boolean;
|
||||||
|
disabled?: boolean;
|
||||||
|
children?: React.ReactNode;
|
||||||
|
onClick?: () => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
function Button({
|
||||||
|
type = "button",
|
||||||
|
variant = "primary",
|
||||||
|
fullWidth,
|
||||||
|
large,
|
||||||
|
icon,
|
||||||
|
onlyIcon,
|
||||||
|
disabled,
|
||||||
|
children,
|
||||||
|
onClick,
|
||||||
|
}: ButtonProps) {
|
||||||
|
const variantClasses = [
|
||||||
|
{
|
||||||
|
name: "primary",
|
||||||
|
classes:
|
||||||
|
"enabled:bg-[#49A1F5] enabled:hover:bg-[#4190DB] enabled:text-white disabled:bg-[#F2F2F2] disabled:text-[#CCCCCC]",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "secondary",
|
||||||
|
classes:
|
||||||
|
"enabled:bg-[#F0F1F2] enabled:hover:bg-[#E6ECF2] enabled:text-[#77828C] disabled:bg-[#F2F2F2] disabled:text-[##CCCCCC]",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "tertiary",
|
||||||
|
classes:
|
||||||
|
"enabled:hover:bg-[#E6ECF2] enabled:text-[#77828C] disabled:text-[#CCCCCC]",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
disabled={disabled}
|
||||||
|
type={type}
|
||||||
|
className={`rounded-lg text-sm font-semibold transition-colors flex items-center justify-center gap-1 ${
|
||||||
|
variantClasses.find((item) => item.name === variant)?.classes
|
||||||
|
} ${fullWidth ? "w-full" : "w-fit"} ${
|
||||||
|
large
|
||||||
|
? `h-10 ${onlyIcon ? "p-2" : icon ? "pl-4 pr-6" : "px-4"}`
|
||||||
|
: `h-8 ${onlyIcon ? "p-1" : icon ? "pl-2 pr-4" : "px-6"}`
|
||||||
|
} `}
|
||||||
|
onClick={onClick}
|
||||||
|
>
|
||||||
|
{onlyIcon ? (
|
||||||
|
icon
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
{icon}
|
||||||
|
{children}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Button;
|
||||||
+4
-2
@@ -8,22 +8,24 @@ import {
|
|||||||
import "./index.css";
|
import "./index.css";
|
||||||
import "./i18n";
|
import "./i18n";
|
||||||
import App from "./App";
|
import App from "./App";
|
||||||
import StreamPage from "./StreamPage";
|
|
||||||
import HistoryPage from "./HistoryPage";
|
import HistoryPage from "./HistoryPage";
|
||||||
import ScheduledPage from "./ScheduledPage";
|
import ScheduledPage from "./ScheduledPage";
|
||||||
import CalendarPage from "./CalendarPage";
|
import CalendarPage from "./CalendarPage";
|
||||||
import useAuthStore from "./stores/useAuthStore";
|
import useAuthStore from "./stores/useAuthStore";
|
||||||
import PersonalAreaLoginPage from "./PersonalAreaLoginPage";
|
import PersonalAreaLoginPage from "./PersonalAreaLoginPage";
|
||||||
import PersonalAreaDashboardPage from "./PersonalAreaDashboardPage";
|
import PersonalAreaDashboardPage from "./PersonalAreaDashboardPage";
|
||||||
|
import StreamPage2 from "./pages/StreamPage2";
|
||||||
|
import ErrorBoundary from "./ErrorBoundary";
|
||||||
|
|
||||||
const router = createBrowserRouter([
|
const router = createBrowserRouter([
|
||||||
{
|
{
|
||||||
path: "/",
|
path: "/",
|
||||||
element: <App />,
|
element: <App />,
|
||||||
|
errorElement: <ErrorBoundary />,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/stream/:id",
|
path: "/stream/:id",
|
||||||
element: <StreamPage />,
|
element: <StreamPage2 />,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/history",
|
path: "/history",
|
||||||
|
|||||||
@@ -0,0 +1,15 @@
|
|||||||
|
.entering {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.entered {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.exiting {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.exited {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
@@ -0,0 +1,468 @@
|
|||||||
|
/* eslint-disable @typescript-eslint/no-non-null-assertion */
|
||||||
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||||
|
/* eslint-disable react-hooks/exhaustive-deps */
|
||||||
|
import "./StreamPage2.css";
|
||||||
|
import ky from "ky";
|
||||||
|
import { PixelStreamingWrapper } from "../components/PixelStreamingWrapper";
|
||||||
|
import { useParams } from "react-router-dom";
|
||||||
|
import { FormEvent, useEffect, useRef, useState } from "react";
|
||||||
|
import { Transition } from "react-transition-group";
|
||||||
|
import Button from "../components/ui/Button";
|
||||||
|
import CloseIcon from "../components/icons/CloseIcon";
|
||||||
|
import HandOffIcon from "../components/icons/HandOffIcon";
|
||||||
|
import MicroOffIcon from "../components/icons/MicroOffIcon";
|
||||||
|
import PersonsIcon from "../components/icons/PersonsIcon";
|
||||||
|
import MicroOnIcon from "../components/icons/MicroOnIcon";
|
||||||
|
import MoreIcon from "../components/icons/MoreIcon";
|
||||||
|
import FullscreenIcon from "../components/icons/FullscreenIcon";
|
||||||
|
import WindowIcon from "../components/icons/WindowIcon";
|
||||||
|
import ChatIcon from "../components/icons/ChatIcon";
|
||||||
|
import ShareIcon from "../components/icons/ShareIcon";
|
||||||
|
import GearIcon from "../components/icons/GearIcon";
|
||||||
|
import { useFullscreen } from "ahooks";
|
||||||
|
import AttachIcon from "../components/icons/AttachIcon";
|
||||||
|
import DetachIcon from "../components/icons/DetachIcon";
|
||||||
|
import Draggable from "react-draggable";
|
||||||
|
|
||||||
|
interface User {
|
||||||
|
id: string;
|
||||||
|
username: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
function StreamPage2() {
|
||||||
|
const params = useParams();
|
||||||
|
const [wsUrl, setWsUrl] = useState<string>();
|
||||||
|
const [username, setUsername] = useState<string>("");
|
||||||
|
const [step, setStep] = useState<number>(1);
|
||||||
|
const usernameRef = useRef<HTMLInputElement>(null!);
|
||||||
|
const [users, setUsers] = useState<User[]>([
|
||||||
|
{
|
||||||
|
id: "1",
|
||||||
|
username: "User 1",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2",
|
||||||
|
username: "User 2",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3",
|
||||||
|
username: "User 3",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4",
|
||||||
|
username: "User 3",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "1",
|
||||||
|
username: "User 1",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2",
|
||||||
|
username: "User 2",
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
const [isShowUsers, setIsShowUsers] = useState<boolean>(false);
|
||||||
|
const [isShowChat, setIsShowChat] = useState<boolean>(false);
|
||||||
|
const [isMicEnabled, setIsMicEnabled] = useState<boolean>(false);
|
||||||
|
const [isVideoInitialized, setIsVideoInitialized] = useState<boolean>(false);
|
||||||
|
const ref = useRef(null);
|
||||||
|
const [isFullscreen, { toggleFullscreen }] = useFullscreen(ref);
|
||||||
|
const [isUsersDetached, setIsUsersDetached] = useState<boolean>(false);
|
||||||
|
const [isChatDetached, setIsChatDetached] = useState<boolean>(false);
|
||||||
|
|
||||||
|
async function getWsUrl() {
|
||||||
|
const activeSession: any = await ky
|
||||||
|
.get(`${import.meta.env.VITE_COORD_URL}/active_sessions/${params.id}`)
|
||||||
|
.json();
|
||||||
|
|
||||||
|
setWsUrl(
|
||||||
|
`wss://${activeSession.location}.sess.stream.graff.tech/${activeSession.server}/${activeSession.cirrusPort}/`
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSetUsername(e: FormEvent) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
if (!username) {
|
||||||
|
usernameRef.current.focus();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
setStep(2);
|
||||||
|
}
|
||||||
|
|
||||||
|
function setUsernameGuest() {
|
||||||
|
setUsername("Гость");
|
||||||
|
setStep(2);
|
||||||
|
}
|
||||||
|
|
||||||
|
function allowMic() {
|
||||||
|
setStep(3);
|
||||||
|
}
|
||||||
|
|
||||||
|
function disallowMic() {
|
||||||
|
setStep(3);
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!username) return;
|
||||||
|
|
||||||
|
setUsername(() => username.trim());
|
||||||
|
}, [username]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (isChatDetached || isUsersDetached) {
|
||||||
|
document.body.classList.add("overflow-hidden");
|
||||||
|
} else {
|
||||||
|
document.body.classList.remove("overflow-hidden");
|
||||||
|
}
|
||||||
|
}, [isUsersDetached, isChatDetached]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
getWsUrl();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div ref={ref} className="">
|
||||||
|
<div className="h-screen flex flex-col">
|
||||||
|
<div className="h-12 bg-white px-6 py-3 flex items-center justify-between">
|
||||||
|
<div id="left" className="flex items-center gap-4">
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<div className="h-6 w-6 flex items-center justify-center bg-[#E6ECF2] font-semibold text-[10px] rounded-full">
|
||||||
|
{username && username[0].toUpperCase()}
|
||||||
|
</div>
|
||||||
|
<p className="text-xs">{username}</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<Button variant="secondary" icon={<HandOffIcon />} onlyIcon />
|
||||||
|
<Button
|
||||||
|
variant="secondary"
|
||||||
|
icon={isMicEnabled ? <MicroOnIcon /> : <MicroOffIcon />}
|
||||||
|
onlyIcon
|
||||||
|
onClick={() => setIsMicEnabled((prev) => !prev)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div id="divider" className="w-px h-4 bg-[#DAE0E5]"></div>
|
||||||
|
<div className="flex gap-6">
|
||||||
|
{users.map(
|
||||||
|
(user, index) =>
|
||||||
|
index < 3 && (
|
||||||
|
<div key={user.id} className="flex items-center gap-2">
|
||||||
|
<div className="h-6 w-6 flex items-center justify-center bg-[#E6ECF2] font-semibold text-[10px] rounded-full">
|
||||||
|
{user.username && user.username[0].toUpperCase()}
|
||||||
|
</div>
|
||||||
|
<p className="text-xs">{user.username}</p>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)}
|
||||||
|
|
||||||
|
{users.length > 3 && (
|
||||||
|
<Button
|
||||||
|
variant="secondary"
|
||||||
|
icon={<PersonsIcon />}
|
||||||
|
onlyIcon
|
||||||
|
onClick={() => setIsShowUsers((prev) => !prev)}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="right" className="flex items-center gap-4">
|
||||||
|
<div>
|
||||||
|
<Button
|
||||||
|
variant="secondary"
|
||||||
|
icon={<ChatIcon />}
|
||||||
|
onlyIcon
|
||||||
|
onClick={() => setIsShowChat((prev) => !prev)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div id="divider" className="w-px h-4 bg-[#DAE0E5]"></div>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<Button
|
||||||
|
variant="secondary"
|
||||||
|
icon={isFullscreen ? <WindowIcon /> : <FullscreenIcon />}
|
||||||
|
onlyIcon
|
||||||
|
onClick={toggleFullscreen}
|
||||||
|
/>
|
||||||
|
<Button variant="secondary" icon={<ShareIcon />} onlyIcon />
|
||||||
|
<Button variant="secondary" icon={<GearIcon />} onlyIcon />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex-1 flex">
|
||||||
|
<div className="w-full">
|
||||||
|
{wsUrl && (
|
||||||
|
<PixelStreamingWrapper
|
||||||
|
initialSettings={{
|
||||||
|
AutoPlayVideo: true,
|
||||||
|
AutoConnect: true,
|
||||||
|
ss: wsUrl,
|
||||||
|
StartVideoMuted: true,
|
||||||
|
HoveringMouse: true,
|
||||||
|
WaitForStreamer: true,
|
||||||
|
}}
|
||||||
|
onVideoInitialized={() => setIsVideoInitialized(true)}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col bg-white max-h-[calc(100vh-48px)]">
|
||||||
|
<Draggable
|
||||||
|
position={!isUsersDetached ? { x: 0, y: 0 } : undefined}
|
||||||
|
disabled={!isUsersDetached}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
id="modal-users"
|
||||||
|
className={`max-h-[calc(100vh-48px)] ${
|
||||||
|
isUsersDetached ? "absolute right-0 p-4" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`${
|
||||||
|
isUsersDetached ? "rounded-lg" : "h-full"
|
||||||
|
} bg-white flex flex-col ${
|
||||||
|
isShowUsers ? "w-[296px]" : "w-0 hidden"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`flex items-center justify-between p-2 pl-4 ${
|
||||||
|
isUsersDetached ? "border-b" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<p className="font-semibold">Участники</p>
|
||||||
|
<div className="flex">
|
||||||
|
<Button
|
||||||
|
variant="tertiary"
|
||||||
|
icon={isUsersDetached ? <AttachIcon /> : <DetachIcon />}
|
||||||
|
onlyIcon
|
||||||
|
onClick={() => setIsUsersDetached((prev) => !prev)}
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
variant="tertiary"
|
||||||
|
icon={<CloseIcon />}
|
||||||
|
onlyIcon
|
||||||
|
onClick={() => setIsShowUsers(false)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-2 p-4">
|
||||||
|
{users.map((user) => (
|
||||||
|
<div className="flex justify-between">
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<div className="w-8 h-8 bg-[#E6ECF2] rounded-full flex items-center justify-center">
|
||||||
|
<p className="font-medium text-[10px] select-none">
|
||||||
|
{user.username[0].toUpperCase()}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<p className="text-sm">{user.username}</p>
|
||||||
|
</div>
|
||||||
|
<div className="">
|
||||||
|
<Button
|
||||||
|
variant="tertiary"
|
||||||
|
icon={<MoreIcon />}
|
||||||
|
onlyIcon
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Draggable>
|
||||||
|
|
||||||
|
<Draggable
|
||||||
|
position={!isChatDetached ? { x: 0, y: 0 } : undefined}
|
||||||
|
disabled={!isChatDetached}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
id="modal-chat"
|
||||||
|
className={`max-h-[calc(100vh-48px)] ${
|
||||||
|
isChatDetached
|
||||||
|
? "absolute right-[346px] p-4 h-fit"
|
||||||
|
: "h-full"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`${
|
||||||
|
isChatDetached ? "rounded-lg" : "h-full"
|
||||||
|
} bg-white flex flex-col ${
|
||||||
|
isShowChat ? "w-[296px]" : "w-0 hidden"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`flex items-center justify-between p-2 pl-4 ${
|
||||||
|
isChatDetached ? "border-b" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<p className="font-semibold">Чат</p>
|
||||||
|
<div className="flex">
|
||||||
|
<Button
|
||||||
|
variant="tertiary"
|
||||||
|
icon={isChatDetached ? <AttachIcon /> : <DetachIcon />}
|
||||||
|
onlyIcon
|
||||||
|
onClick={() => setIsChatDetached((prev) => !prev)}
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
variant="tertiary"
|
||||||
|
icon={<CloseIcon />}
|
||||||
|
onlyIcon
|
||||||
|
onClick={() => setIsShowChat(false)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-2 p-4">//</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Draggable>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Transition
|
||||||
|
in={step !== 3 || !isVideoInitialized}
|
||||||
|
timeout={300}
|
||||||
|
mountOnEnter
|
||||||
|
unmountOnExit
|
||||||
|
>
|
||||||
|
{(state) => (
|
||||||
|
<div
|
||||||
|
className={`absolute top-0 left-0 w-full h-full flex items-center justify-center bg-[#14161F] transition-all ${state} ${
|
||||||
|
step !== 3 || !isVideoInitialized
|
||||||
|
? "bg-opacity-50 backdrop-blur-2xl"
|
||||||
|
: "bg-opacity-0 backdrop-blur-none"
|
||||||
|
} `}
|
||||||
|
>
|
||||||
|
<Transition
|
||||||
|
in={step === 1}
|
||||||
|
timeout={300}
|
||||||
|
mountOnEnter
|
||||||
|
unmountOnExit
|
||||||
|
>
|
||||||
|
{(state) => (
|
||||||
|
<form
|
||||||
|
className={`absolute bg-white rounded-lg p-12 w-[396px] transition-opacity ${state}`}
|
||||||
|
onSubmit={handleSetUsername}
|
||||||
|
>
|
||||||
|
<div className="mb-6">
|
||||||
|
<p className="text-2xl font-semibold">Здравствуйте!</p>
|
||||||
|
</div>
|
||||||
|
<div className="mb-6 flex flex-col gap-2">
|
||||||
|
<p className="font-semibold">Представьтесь, пожалуйста</p>
|
||||||
|
<p className="text-[#77828C] text-sm">
|
||||||
|
Так мы будем знать, как к вам обратиться
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="mb-10">
|
||||||
|
<div className="flex flex-col gap-1">
|
||||||
|
<label className="text-[#77828C] text-xs">Имя</label>
|
||||||
|
<input
|
||||||
|
ref={usernameRef}
|
||||||
|
type="text"
|
||||||
|
autoComplete="off"
|
||||||
|
autoFocus
|
||||||
|
className="rounded-lg px-2 py-2.5 bg-white border border-[#DAE0E5] hover:border-[#49A1F5] focus:border-[#49A1F5] outline-none transition-colors text-sm"
|
||||||
|
value={username}
|
||||||
|
onChange={(e) => setUsername(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<Button
|
||||||
|
type="button"
|
||||||
|
variant="secondary"
|
||||||
|
fullWidth
|
||||||
|
large
|
||||||
|
onClick={setUsernameGuest}
|
||||||
|
>
|
||||||
|
Не указывать
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
type="submit"
|
||||||
|
fullWidth
|
||||||
|
large
|
||||||
|
onClick={void handleSetUsername}
|
||||||
|
>
|
||||||
|
Продолжить
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
)}
|
||||||
|
</Transition>
|
||||||
|
|
||||||
|
<Transition
|
||||||
|
in={step === 2}
|
||||||
|
timeout={300}
|
||||||
|
mountOnEnter
|
||||||
|
unmountOnExit
|
||||||
|
>
|
||||||
|
{(state) => (
|
||||||
|
<div
|
||||||
|
className={`absolute bg-white rounded-lg p-12 w-[396px] transition-opacity ${state}`}
|
||||||
|
>
|
||||||
|
<div className="mb-6">
|
||||||
|
<p className="text-2xl font-semibold">
|
||||||
|
Хотите принять участие в обсуждении?
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="mb-6 flex gap-6">
|
||||||
|
<div className="border border-[#DAE0E5] text-[#49A1F5] p-2 rounded-full">
|
||||||
|
<MicroOnIcon />
|
||||||
|
</div>
|
||||||
|
<p className="text-sm">Разрешите использование микрофона</p>
|
||||||
|
</div>
|
||||||
|
<div className="mb-10">
|
||||||
|
<p className="text-[#77828C] text-xs">
|
||||||
|
Выключить микрофон можно в любой момент
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<Button
|
||||||
|
variant="secondary"
|
||||||
|
fullWidth
|
||||||
|
large
|
||||||
|
onClick={disallowMic}
|
||||||
|
>
|
||||||
|
Запретить
|
||||||
|
</Button>
|
||||||
|
<Button fullWidth large onClick={allowMic}>
|
||||||
|
Разрешить
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</Transition>
|
||||||
|
|
||||||
|
<Transition
|
||||||
|
in={step === 3 && !isVideoInitialized}
|
||||||
|
timeout={300}
|
||||||
|
mountOnEnter
|
||||||
|
unmountOnExit
|
||||||
|
>
|
||||||
|
{(state) => (
|
||||||
|
<div
|
||||||
|
className={`absolute bg-white rounded-lg p-12 w-[396px] transition-opacity ${state}`}
|
||||||
|
>
|
||||||
|
<div className="mb-6">
|
||||||
|
<p className="text-2xl font-semibold">
|
||||||
|
Пожалуйста, подождите
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<img
|
||||||
|
src="/icons/LoaderPrimary.png"
|
||||||
|
alt=""
|
||||||
|
className="w-8 h-8 animate-spin"
|
||||||
|
/>
|
||||||
|
<p className="font-semibold text-[#49A1F5]">Подключение</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</Transition>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</Transition>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default StreamPage2;
|
||||||
@@ -596,6 +596,20 @@ acorn@^8.9.0:
|
|||||||
resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.11.3.tgz#71e0b14e13a4ec160724b38fb7b0f233b1b81d7a"
|
resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.11.3.tgz#71e0b14e13a4ec160724b38fb7b0f233b1b81d7a"
|
||||||
integrity sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==
|
integrity sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==
|
||||||
|
|
||||||
|
ahooks@^3.7.10:
|
||||||
|
version "3.7.10"
|
||||||
|
resolved "https://registry.yarnpkg.com/ahooks/-/ahooks-3.7.10.tgz#6ac1dfbcedff8c673367c044ffef41ffae6da483"
|
||||||
|
integrity sha512-/HLYif7sFA/5qSuWKrwvjDbf3bq+sdaMrUWS7XGCDRWdC2FrG/i+u5LZdakMYc6UIgJTMQ7tGiJCV7sdU4kSIw==
|
||||||
|
dependencies:
|
||||||
|
"@babel/runtime" "^7.21.0"
|
||||||
|
dayjs "^1.9.1"
|
||||||
|
intersection-observer "^0.12.0"
|
||||||
|
js-cookie "^2.x.x"
|
||||||
|
lodash "^4.17.21"
|
||||||
|
resize-observer-polyfill "^1.5.1"
|
||||||
|
screenfull "^5.0.0"
|
||||||
|
tslib "^2.4.1"
|
||||||
|
|
||||||
ajv@^6.12.4:
|
ajv@^6.12.4:
|
||||||
version "6.12.6"
|
version "6.12.6"
|
||||||
resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4"
|
resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4"
|
||||||
@@ -828,6 +842,11 @@ date-fns@^2.30.0:
|
|||||||
dependencies:
|
dependencies:
|
||||||
"@babel/runtime" "^7.21.0"
|
"@babel/runtime" "^7.21.0"
|
||||||
|
|
||||||
|
dayjs@^1.9.1:
|
||||||
|
version "1.11.10"
|
||||||
|
resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.11.10.tgz#68acea85317a6e164457d6d6947564029a6a16a0"
|
||||||
|
integrity sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ==
|
||||||
|
|
||||||
debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2:
|
debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2:
|
||||||
version "4.3.4"
|
version "4.3.4"
|
||||||
resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
|
resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
|
||||||
@@ -1316,6 +1335,11 @@ inherits@2:
|
|||||||
resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
|
resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
|
||||||
integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
|
integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
|
||||||
|
|
||||||
|
intersection-observer@^0.12.0:
|
||||||
|
version "0.12.2"
|
||||||
|
resolved "https://registry.yarnpkg.com/intersection-observer/-/intersection-observer-0.12.2.tgz#4a45349cc0cd91916682b1f44c28d7ec737dc375"
|
||||||
|
integrity sha512-7m1vEcPCxXYI8HqnL8CKI6siDyD+eIWSwgB3DZA+ZTogxk9I4CDnj4wilt9x/+/QbHI4YG5YZNmC6458/e9Ktg==
|
||||||
|
|
||||||
invariant@^2.2.4:
|
invariant@^2.2.4:
|
||||||
version "2.2.4"
|
version "2.2.4"
|
||||||
resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
|
resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
|
||||||
@@ -1388,6 +1412,11 @@ jiti@^1.19.1:
|
|||||||
resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.0.tgz#7c97f8fe045724e136a397f7340475244156105d"
|
resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.0.tgz#7c97f8fe045724e136a397f7340475244156105d"
|
||||||
integrity sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==
|
integrity sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==
|
||||||
|
|
||||||
|
js-cookie@^2.x.x:
|
||||||
|
version "2.2.1"
|
||||||
|
resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.2.1.tgz#69e106dc5d5806894562902aa5baec3744e9b2b8"
|
||||||
|
integrity sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ==
|
||||||
|
|
||||||
"js-tokens@^3.0.0 || ^4.0.0":
|
"js-tokens@^3.0.0 || ^4.0.0":
|
||||||
version "4.0.0"
|
version "4.0.0"
|
||||||
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
|
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
|
||||||
@@ -1620,6 +1649,11 @@ lodash.merge@^4.6.2:
|
|||||||
resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
|
resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
|
||||||
integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
|
integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
|
||||||
|
|
||||||
|
lodash@^4.17.21:
|
||||||
|
version "4.17.21"
|
||||||
|
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
|
||||||
|
integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
|
||||||
|
|
||||||
loglevel@1.8.1:
|
loglevel@1.8.1:
|
||||||
version "1.8.1"
|
version "1.8.1"
|
||||||
resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.8.1.tgz#5c621f83d5b48c54ae93b6156353f555963377b4"
|
resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.8.1.tgz#5c621f83d5b48c54ae93b6156353f555963377b4"
|
||||||
@@ -1948,6 +1982,14 @@ react-dom@^18.2.0:
|
|||||||
loose-envify "^1.1.0"
|
loose-envify "^1.1.0"
|
||||||
scheduler "^0.23.0"
|
scheduler "^0.23.0"
|
||||||
|
|
||||||
|
react-draggable@^4.4.6:
|
||||||
|
version "4.4.6"
|
||||||
|
resolved "https://registry.yarnpkg.com/react-draggable/-/react-draggable-4.4.6.tgz#63343ee945770881ca1256a5b6fa5c9f5983fe1e"
|
||||||
|
integrity sha512-LtY5Xw1zTPqHkVmtM3X8MUOxNDOUhv/khTgBgrUvwaS064bwVvxT+q5El0uUFNx5IEPKXuRejr7UqLwBIg5pdw==
|
||||||
|
dependencies:
|
||||||
|
clsx "^1.1.1"
|
||||||
|
prop-types "^15.8.1"
|
||||||
|
|
||||||
react-full-screen@^1.1.1:
|
react-full-screen@^1.1.1:
|
||||||
version "1.1.1"
|
version "1.1.1"
|
||||||
resolved "https://registry.yarnpkg.com/react-full-screen/-/react-full-screen-1.1.1.tgz#b707d56891015a71c503a65dbab3086d75be97d7"
|
resolved "https://registry.yarnpkg.com/react-full-screen/-/react-full-screen-1.1.1.tgz#b707d56891015a71c503a65dbab3086d75be97d7"
|
||||||
@@ -2071,6 +2113,11 @@ regenerator-runtime@^0.14.0:
|
|||||||
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz#356ade10263f685dda125100cd862c1db895327f"
|
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz#356ade10263f685dda125100cd862c1db895327f"
|
||||||
integrity sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==
|
integrity sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==
|
||||||
|
|
||||||
|
resize-observer-polyfill@^1.5.1:
|
||||||
|
version "1.5.1"
|
||||||
|
resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz#0e9020dd3d21024458d4ebd27e23e40269810464"
|
||||||
|
integrity sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg==
|
||||||
|
|
||||||
resolve-from@^4.0.0:
|
resolve-from@^4.0.0:
|
||||||
version "4.0.0"
|
version "4.0.0"
|
||||||
resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
|
resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
|
||||||
@@ -2125,6 +2172,11 @@ scheduler@^0.23.0:
|
|||||||
dependencies:
|
dependencies:
|
||||||
loose-envify "^1.1.0"
|
loose-envify "^1.1.0"
|
||||||
|
|
||||||
|
screenfull@^5.0.0:
|
||||||
|
version "5.2.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/screenfull/-/screenfull-5.2.0.tgz#6533d524d30621fc1283b9692146f3f13a93d1ba"
|
||||||
|
integrity sha512-9BakfsO2aUQN2K9Fdbj87RJIEZ82Q9IGim7FqM5OsebfoFC6ZHXgDq/KvniuLTPdeM8wY2o6Dj3WQ7KeQCj3cA==
|
||||||
|
|
||||||
sdp-transform@^2.14.1:
|
sdp-transform@^2.14.1:
|
||||||
version "2.14.2"
|
version "2.14.2"
|
||||||
resolved "https://registry.yarnpkg.com/sdp-transform/-/sdp-transform-2.14.2.tgz#d2cee6a1f7abe44e6332ac6cbb94e8600f32d813"
|
resolved "https://registry.yarnpkg.com/sdp-transform/-/sdp-transform-2.14.2.tgz#d2cee6a1f7abe44e6332ac6cbb94e8600f32d813"
|
||||||
@@ -2339,7 +2391,7 @@ ts-interface-checker@^0.1.9:
|
|||||||
resolved "https://registry.yarnpkg.com/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz#784fd3d679722bc103b1b4b8030bcddb5db2a699"
|
resolved "https://registry.yarnpkg.com/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz#784fd3d679722bc103b1b4b8030bcddb5db2a699"
|
||||||
integrity sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==
|
integrity sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==
|
||||||
|
|
||||||
tslib@2.6.2, tslib@^2.1.0:
|
tslib@2.6.2, tslib@^2.1.0, tslib@^2.4.1:
|
||||||
version "2.6.2"
|
version "2.6.2"
|
||||||
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
|
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
|
||||||
integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
|
integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
|
||||||
|
|||||||
Reference in New Issue
Block a user