Fix

Author: vtm9

services/app/apps/codebattle/assets/css/style.scss

@@ -2586,12 +2586,14 @@ a:hover {
 }
 
 .cb-stream-widget-header-img-left {
+  background-size: cover;
   width: 20%;
   background-image: url(../static/images/stream/back-stripes.svg);
   fill: #FAFF0F;
 }
 
 .cb-stream-widget-header-img-right {
+  background-size: cover;
   width: 20%;
   background-image: url(../static/images/stream/stripes.svg);
   fill: #FAFF0F;

services/app/apps/codebattle/assets/js/widgets/pages/stream/StreamEditorPanel.jsx

@@ -19,16 +19,23 @@ function StreamEditorPanel({
     theme: editorThemes.dark,
     mute: true,
     loading: false,
-    value: editor?.text,
+    value: editor?.text || '',
     fontSize,
-    lineNumbers: false,
+    lineNumbers: 'off',
     wordWrap: 'on',
+    // Add required props
+    onChange: () => {},
+    mode: 'default',
+    roomMode: 'spectator',
+    checkResult: () => {},
+    userType: 'spectator',
+    userId: 0,
   };
 
   return (
     <div
       className={`cb-stream-editor-panel p-4 cb-stream-editor-${orientation}`}
-    // style={{ width, maxWidth: width, minWidth: width }}
+      style={{ width, maxWidth: width, minWidth: width }}
     >
       <div className="d-flex flex-column flex-grow-1 position-relative cb-editor-height h-100">
         <ExtendedEditor {...editorParams} />

services/app/apps/codebattle/assets/js/widgets/pages/stream/StreamFullPanel.jsx

@@ -24,21 +24,35 @@ function StreamFullPanel({
     theme: editorThemes.dark,
     mute: true,
     loading: false,
-    value: leftEditor?.text,
+    value: leftEditor?.text || '',
     fontSize: codeFontSize,
     lineNumbers: false,
     wordWrap: 'on',
+    // Add required props
+    onChange: () => {},
+    mode: 'default',
+    roomMode: 'spectator',
+    checkResult: () => {},
+    userType: 'spectator',
+    userId: 0,
   };
   const editorRightParams = {
     editable: false,
     syntax: rightEditor?.currentLangSlug,
     theme: editorThemes.dark,
     mute: true,
     loading: false,
-    value: rightEditor?.text,
+    value: rightEditor?.text || '',
     fontSize: codeFontSize,
     lineNumbers: false,
     wordWrap: 'on',
+    // Add required props
+    onChange: () => {},
+    mode: 'default',
+    roomMode: 'spectator',
+    checkResult: () => {},
+    userType: 'spectator',
+    userId: 0,
   };
 
   return (

services/app/apps/codebattle/assets/js/widgets/pages/stream/StreamTaskInfoPanel.jsx

@@ -43,8 +43,8 @@ function StreamTaskInfoPanel({
         {/*   <span>3 / 8 Задача</span> */}
         {/* </div> */}
         <div className="d-flex flex-column align-items-center cb-stream-name cb-stream-widget-text">
-          {(player?.name || 'Фамилия Имя').split(' ').map(str => (
-            <div style={{ fontSize }}>{upperCase(str || 'Test')}</div>
+          {(player?.name || 'Фамилия Имя').split(' ').map((str, index) => (
+            <div key={index} style={{ fontSize }}>{upperCase(str || 'Test')}</div>
           ))}
         </div>
       </div>

services/app/apps/codebattle/assets/js/widgets/pages/stream/StreamWidget.jsx

@@ -49,7 +49,7 @@ function StreamWidget({
 
   useEffect(() => {
     dispatch(connectToStream());
-  }, []);
+  }, [dispatch]);
 
   useEffect(() => {
     if (!game.id) {
@@ -71,18 +71,18 @@ function StreamWidget({
   }, [game.id, mainService, waitingRoomService, dispatch]);
 
   if (!game.id) {
-    return <div className="vh-100 cb-stream-widget" />;
+    return <div className="vh-100 overflow-hidden cb-stream-widget" />;
   }
 
   return (
-    <div className="vh-100 p-2 cb-stream-widget">
+    <div className="vh-100 overflow-hidden cb-stream-widget">
       <div className="d-flex flex-column w-100 h-100">
-        <div className="cb-stream-widget-header cb-stream-widget-text" style={headerFontSize}>
-          <div className="cb-stream-widget-header-img-left" />
-          <div className="cb-stream-widget-header-title text-center p-4">Баттл Вузов</div>
-          <div className="cb-stream-widget-header-img-right" />
+        <div className="cb-stream-widget-header cb-stream-widget-text d-flex" style={{ fontSize: `${headerFontSize}px` }}>
+          <div className="cb-stream-widget-header-img-left"/>
+          <div className="cb-stream-widget-header-title text-center p-2 ">Баттл Вузов</div>
+          <div className="cb-stream-widget-header-img-right"/>
         </div>
-        <div className="p-2">
+        <div className="flex-grow-1 d-flex flex-column h-100">
           {orientations.NONE === orientation && (
             <StreamFullPanel
               game={game}
@@ -91,7 +91,7 @@ function StreamWidget({
               codeFontSize={codeFontSize}
             />
           )}
-          <div className="d-flex w-100 h-100" styles={{ fontSize }}>
+          <div className="d-flex w-100 flex-grow-1 h-100" style={{ fontSize: `${fontSize}px` }}>
             {orientations.LEFT === orientation && (
               <>
                 <StreamTaskInfoPanel