Merge pull request #2224 from hexlet-codebattle/add_copy_btn

add_copy_btn

Author: ReDBrother

services/app/apps/codebattle/assets/js/widgets/pages/game/CopyEditorButton.jsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import copy from 'copy-to-clipboard';
+
+import i18n from '../../../i18n';
+
+const CopyEditorButton = ({ editor }) => {
+  const className = 'btn btn-sm btn-secondary cb-btn-secondary cb-rounded mx-1';
+  const text = i18n.t('Copy');
+
+  const handleCopyClick = () => {
+    copy(editor.value);
+  };
+
+  return (
+    <button
+      type="button"
+      className={className}
+      onClick={handleCopyClick}
+      title={text}
+    >
+      {text}
+    </button>
+  );
+};
+
+export default CopyEditorButton;

services/app/apps/codebattle/assets/js/widgets/pages/game/EditorToolbar.jsx

@@ -6,6 +6,7 @@ import GameRoomModes from '../../config/gameModes';
 import Placements from '../../config/placements';
 
 // import DarkModeButton from './DarkModeButton';
+import CopyEditorButton from './CopyEditorButton';
 import EditorResultIcon from './EditorResultIcon';
 import GameActionButtons from './GameActionButtons';
 import GameBanPlayerButton from './GameBanPlayerButton';
@@ -66,22 +67,27 @@ const EditorToolbar = ({
           {showControlBtns && !isHistory && editorState !== 'banned' && (
             <GameActionButtons {...actionBtnsProps} />
           )}
-          <div
-            className="btn-group btn-group-sm py-2 mx-2"
-            role="group"
-            aria-label="Report actions"
-          >
-            {!showControlBtns && (
+          {!showControlBtns && (
+            <div
+              className="py-2"
+              role="group"
+              aria-label="Report actions"
+            >
               <GameReportButton userId={player.id} gameId={gameId} />
-            )}
-            {isAdmin && !showControlBtns && (
-              <GameBanPlayerButton
-                userId={player.id}
-                status={status}
-                tournamentId={tournamentId}
-              />
-            )}
-          </div>
+              {isAdmin && (
+                <>
+                  <GameBanPlayerButton
+                    userId={player.id}
+                    status={status}
+                    tournamentId={tournamentId}
+                  />
+                  <CopyEditorButton
+                    editor={editor}
+                  />
+                </>
+              )}
+            </div>
+          )}
           <div
             className={userInfoClassNames}
             role="group"

services/app/apps/codebattle/assets/js/widgets/pages/game/GameActionButtons.jsx

@@ -188,7 +188,7 @@ function GameActionButtons({
 
   return (
     <div
-      className="d-flex py-2 mr-2"
+      className="d-flex py-2"
       role="group"
       aria-label="Game actions"
     >

services/app/apps/codebattle/assets/js/widgets/pages/game/InfoPanel.jsx

@@ -24,7 +24,7 @@ const InfoPanel = ({
   return (
     <>
       <div className="col-12 col-lg-6 p-1 cb-height-info">
-        <div className="d-flex shadow-sm flex-column h-100 cb-bg-panel">
+        <div className="d-flex shadow-sm flex-column h-100 cb-bg-panel cb-rounded">
           <nav>
             <div
               className="nav nav-tabs cb-border-color text-uppercase font-weight-bold text-center"