@elice/material-exercise 1.240718.0-trasncript.2 → 1.240718.2

package/es/components/material-exercise/exercise-file-tree/ExerciseFileTreeLazy.js

@@ -1,4 +1,3 @@
-import { jsx } from 'react/jsx-runtime';
 import React from 'react';
 import '../../shared/exercise-shimmer/ExerciseFileShimmer.js';
 import '../../shared/exercise-shimmer/ExerciseFileTabsShimmer.js';
@@ -7,11 +6,10 @@ import ExerciseFileTreeListShimmer from '../../shared/exercise-shimmer/ExerciseF
 import '../../shared/exercise-shimmer/ExerciseFileTreeListItemShimmer.js';
 import ExerciseFileTree from './ExerciseFileTree.js';
 
-var ExerciseFileTreeLazy = function ExerciseFileTreeLazy() {
-  return jsx(React.Suspense, {
-    fallback: jsx(ExerciseFileTreeListShimmer, {}),
-    children: jsx(ExerciseFileTree, {})
-  });
+const ExerciseFileTreeLazy = () => {
+  return React.createElement(React.Suspense, {
+    fallback: React.createElement(ExerciseFileTreeListShimmer, null)
+  }, React.createElement(ExerciseFileTree, null));
 };
 
 export { ExerciseFileTreeLazy as default };

package/es/components/material-exercise/exercise-file-viewer/ExerciseFileViewer.js

@@ -1,4 +1,3 @@
-import { jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { useRecoilValue } from 'recoil';
 import ExerciseFileShimmer from '../../shared/exercise-shimmer/ExerciseFileShimmer.js';
@@ -14,29 +13,31 @@ import '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 
-var ExerciseFileViewer = function ExerciseFileViewer() {
-  var _React$useContext = React.useContext(ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId,
-    exerciseRoomId = _React$useContext.exerciseRoomId,
-    locale = _React$useContext.locale;
-  var exercise = useRecoilValue(exerciseState(materialExerciseId));
-  var activeFilename = useRecoilValue(exerciseActiveFilenameState);
-  var activeFileUrl = useMaterialExerciseFileUrl({
+const ExerciseFileViewer = () => {
+  const {
+    materialExerciseId,
+    exerciseRoomId,
+    locale
+  } = React.useContext(ExerciseContext);
+  const exercise = useRecoilValue(exerciseState(materialExerciseId));
+  const activeFilename = useRecoilValue(exerciseActiveFilenameState);
+  const activeFileUrl = useMaterialExerciseFileUrl({
     filename: activeFilename,
-    exercise: exercise,
-    exerciseRoomId: exerciseRoomId
+    exercise,
+    exerciseRoomId
   });
   //
   //
   //
   if (!activeFilename) {
-    return jsx(ExerciseFileShimmer, {});
+    return React.createElement(ExerciseFileShimmer, null);
   }
-  return jsx(FileViewer, {
+  return React.createElement(FileViewer, {
+    key: activeFileUrl,
     filename: activeFilename,
     fileurl: activeFileUrl,
     locale: locale
-  }, activeFileUrl);
+  });
 };
 
 export { ExerciseFileViewer as default };

package/es/components/material-exercise/exercise-menu/ExerciseMenu.js

@@ -1,4 +1,3 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import React from 'react';
 import { base } from '@elice/design-tokens';
 import { IntlComponentBuilder, RawEliceIntlProvider } from '@elice/intl';
@@ -18,26 +17,23 @@ import ExerciseMenuStdioFileBrowser from './ExerciseMenuStdioFileBrowser.js';
 import messageEn from './locales/en.json.js';
 import messageKo from './locales/ko.json.js';
 
-var StyledExerciseMenuWrapper = styled.div.withConfig({
+const StyledExerciseMenuWrapper = styled.div.withConfig({
   componentId: "sc-1gf6m87-0"
 })(["display:flex;justify-content:center;align-items:center;padding:0 0.5rem 0 1rem;height:2.25rem;gap:0.5rem;background-color:", ";"], base.color.navy8);
-var ExerciseMenu = function ExerciseMenu(_ref) {
-  var __intl = _ref.__intl;
-  var _React$useContext = React.useContext(ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId;
-  var exercise = useRecoilValue(exerciseState(materialExerciseId));
-  var isArduinoExercise = (exercise === null || exercise === void 0 ? void 0 : exercise.envType) === enums.ExerciseEnvType.Arduino;
+const ExerciseMenu = ({
+  __intl
+}) => {
+  const {
+    materialExerciseId
+  } = React.useContext(ExerciseContext);
+  const exercise = useRecoilValue(exerciseState(materialExerciseId));
+  const isArduinoExercise = (exercise === null || exercise === void 0 ? void 0 : exercise.envType) === enums.ExerciseEnvType.Arduino;
   //
   //
   //
-  return jsx(RawEliceIntlProvider, {
-    value: __intl,
-    children: jsxs(StyledExerciseMenuWrapper, {
-      children: [isArduinoExercise ? jsxs(Fragment, {
-        children: [jsx(ExerciseMenuArduinoAgentModalButton, {}), jsx(ExerciseMenuArduinoSettings, {})]
-      }) : jsx(ExerciseMenuStdioFileBrowser, {}), jsx(ExerciseMenuReset, {}), jsx(ExerciseMenuDropdown, {})]
-    })
-  });
+  return React.createElement(RawEliceIntlProvider, {
+    value: __intl
+  }, React.createElement(StyledExerciseMenuWrapper, null, isArduinoExercise ? React.createElement(React.Fragment, null, React.createElement(ExerciseMenuArduinoAgentModalButton, null), React.createElement(ExerciseMenuArduinoSettings, null)) : React.createElement(ExerciseMenuStdioFileBrowser, null), React.createElement(ExerciseMenuReset, null), React.createElement(ExerciseMenuDropdown, null)));
 };
 var ExerciseMenu$1 = new IntlComponentBuilder(ExerciseMenu).add('en', messageEn).add('ko', messageKo).addAsync('th', import('./locales/th.json.js')).addAsync('ja', import('./locales/ja.json.js')).build();
 

package/es/components/material-exercise/exercise-menu/ExerciseMenuArduinoAgentModalButton.js

@@ -1,4 +1,4 @@
-import { jsx } from 'react/jsx-runtime';
+import React from 'react';
 import { Button, Icon } from '@elice/blocks';
 import { eilStatusDanger } from '@elice/icons';
 import { useRawEliceIntl } from '@elice/intl';
@@ -9,25 +9,24 @@ import '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 
-var ExerciseMenuArduinoAgentModalButton = function ExerciseMenuArduinoAgentModalButton() {
-  var setOpen = useSetRecoilState(exerciseArduinoAgentModalState);
-  var intl = useRawEliceIntl();
-  var handleClick = function handleClick() {
+const ExerciseMenuArduinoAgentModalButton = () => {
+  const setOpen = useSetRecoilState(exerciseArduinoAgentModalState);
+  const intl = useRawEliceIntl();
+  const handleClick = () => {
     setOpen(true);
   };
-  return jsx(Button, {
+  return React.createElement(Button, {
     size: "micro",
     role: "warning",
-    icon: jsx(Icon, {
+    icon: React.createElement(Icon, {
       icon: eilStatusDanger
     }),
     iconAlign: "left",
     border: false,
-    onClick: handleClick,
-    children: intl.formatMessage({
-      id: 'exerciseMenu.arduino.agent.button'
-    })
-  });
+    onClick: handleClick
+  }, intl.formatMessage({
+    id: 'exerciseMenu.arduino.agent.button'
+  }));
 };
 
 export { ExerciseMenuArduinoAgentModalButton as default };

package/es/components/material-exercise/exercise-menu/ExerciseMenuArduinoSettings.js

@@ -1,5 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { Popover, Text, Flex, IconButton } from '@elice/blocks';
 import { eilMaterialTypeArduino, eilMathsignMultiplyBasic } from '@elice/icons';
@@ -15,160 +13,123 @@ import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 import { StyledFilePopoverContent, StyledFilePopoverHeader, StyledFilePopoverBody, StyledFilePopoverBodyList, StyledPreferenceBodyItem, StyledSelect } from './ExerciseMenuStdioFileBrowser.styled.js';
 
-var ExerciseMenuArduinoSettings = function ExerciseMenuArduinoSettings() {
-  var intl = useRawEliceIntl();
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    open = _React$useState2[0],
-    setOpen = _React$useState2[1];
-  var anchorRef = React.useRef(null);
-  var ports = useRecoilValue(exerciseArduinoPortsState);
-  var _useRecoilState = useRecoilState(exerciseArduinoPreferenceState),
-    _useRecoilState2 = _slicedToArray(_useRecoilState, 2),
-    preference = _useRecoilState2[0],
-    setPreference = _useRecoilState2[1];
-  var openedPort = useRecoilValue(exerciseArduinoOpenedPortNameState);
-  var onSelectPort = useRecoilValue(exerciseArduinoOnSelectPortState);
+const ExerciseMenuArduinoSettings = () => {
+  const intl = useRawEliceIntl();
+  const [open, setOpen] = React.useState(false);
+  const anchorRef = React.useRef(null);
+  const ports = useRecoilValue(exerciseArduinoPortsState);
+  const [preference, setPreference] = useRecoilState(exerciseArduinoPreferenceState);
+  const openedPort = useRecoilValue(exerciseArduinoOpenedPortNameState);
+  const onSelectPort = useRecoilValue(exerciseArduinoOnSelectPortState);
   /**
    * List of stdio files.
    */
-  var renderStdioFileList = function renderStdioFileList() {
-    return jsxs(StyledFilePopoverBodyList, {
-      children: [jsxs(StyledPreferenceBodyItem, {
-        children: [jsx(Text, {
-          role: "gray3",
-          block: true,
-          size: "small",
-          children: intl.formatMessage({
-            id: 'exerciseMenu.arduino.transferSpeed'
-          })
-        }), jsx(StyledSelect, {
-          value: preference.baudRate,
-          size: "small",
-          width: "xsmall",
-          onChange: function onChange(value) {
-            setPreference(Object.assign(Object.assign({}, preference), {
-              baudRate: value
-            }));
-          },
-          children: ARDUINO_BAUD_RATES.map(function (baudRate) {
-            return jsx("option", {
-              value: baudRate,
-              children: baudRate
-            }, baudRate);
-          })
-        })]
-      }), jsxs(StyledPreferenceBodyItem, {
-        children: [jsx(Text, {
-          role: "gray3",
-          block: true,
-          size: "small",
-          children: intl.formatMessage({
-            id: 'exerciseMenu.arduino.setting.device'
-          })
-        }), jsxs(StyledSelect, {
-          value: openedPort !== null && openedPort !== void 0 ? openedPort : '',
-          size: "small",
-          width: "xsmall",
-          onChange: function onChange(value) {
-            onSelectPort(value);
-          },
-          children: [ports.length === 0 ? jsx("option", {
-            value: "",
-            disabled: true,
-            children: intl.formatMessage({
-              id: 'exerciseMenu.arduino.setting.noDevice'
-            })
-          }) : jsx("option", {
-            value: "",
-            disabled: true,
-            children: intl.formatMessage({
-              id: 'exerciseMenu.arduino.setting.selectDevice'
-            })
-          }), ports.map(function (port) {
-            return jsx("option", {
-              value: port.Name,
-              children: "".concat(getDisplayName(port), "@").concat(port.Name)
-            }, port.Name);
-          })]
-        })]
-      })]
-    });
+  const renderStdioFileList = () => {
+    return React.createElement(StyledFilePopoverBodyList, null, React.createElement(StyledPreferenceBodyItem, null, React.createElement(Text, {
+      role: "gray3",
+      block: true,
+      size: "small"
+    }, intl.formatMessage({
+      id: 'exerciseMenu.arduino.transferSpeed'
+    })), React.createElement(StyledSelect, {
+      value: preference.baudRate,
+      size: "small",
+      width: "xsmall",
+      onChange: value => {
+        setPreference(Object.assign(Object.assign({}, preference), {
+          baudRate: value
+        }));
+      }
+    }, ARDUINO_BAUD_RATES.map(baudRate => React.createElement("option", {
+      key: baudRate,
+      value: baudRate
+    }, baudRate)))), React.createElement(StyledPreferenceBodyItem, null, React.createElement(Text, {
+      role: "gray3",
+      block: true,
+      size: "small"
+    }, intl.formatMessage({
+      id: 'exerciseMenu.arduino.setting.device'
+    })), React.createElement(StyledSelect, {
+      value: openedPort !== null && openedPort !== void 0 ? openedPort : '',
+      size: "small",
+      width: "xsmall",
+      onChange: value => {
+        onSelectPort(value);
+      }
+    }, ports.length === 0 ? React.createElement("option", {
+      value: "",
+      disabled: true
+    }, intl.formatMessage({
+      id: 'exerciseMenu.arduino.setting.noDevice'
+    })) : React.createElement("option", {
+      value: "",
+      disabled: true
+    }, intl.formatMessage({
+      id: 'exerciseMenu.arduino.setting.selectDevice'
+    })), ports.map(port => React.createElement("option", {
+      key: port.Name,
+      value: port.Name
+    }, `${getDisplayName(port)}@${port.Name}`)))));
   };
   /**
    * Popover header.
    */
-  var renderStdioFilePopoverHeader = function renderStdioFilePopoverHeader() {
-    return jsxs(StyledFilePopoverHeader, {
-      children: [jsx(Text, {
-        role: "white",
-        bold: true,
-        children: jsx(Flex, {
-          align: "center",
-          children: intl.formatMessage({
-            id: 'exerciseMenu.arduino.setting'
-          })
-        })
-      }), jsx(IconButton, {
-        icon: eilMathsignMultiplyBasic,
-        role: "white",
-        size: "micro",
-        border: false,
-        transparent: true,
-        onClick: function onClick() {
-          return setOpen(false);
-        }
-      })]
-    });
+  const renderStdioFilePopoverHeader = () => {
+    return React.createElement(StyledFilePopoverHeader, null, React.createElement(Text, {
+      role: "white",
+      bold: true
+    }, React.createElement(Flex, {
+      align: "center"
+    }, intl.formatMessage({
+      id: 'exerciseMenu.arduino.setting'
+    }))), React.createElement(IconButton, {
+      icon: eilMathsignMultiplyBasic,
+      role: "white",
+      size: "micro",
+      border: false,
+      transparent: true,
+      onClick: () => setOpen(false)
+    }));
   };
   /**
    * Popover body.
    */
-  var renderStdioFilePopoverBody = function renderStdioFilePopoverBody() {
-    return jsx(StyledFilePopoverBody, {
+  const renderStdioFilePopoverBody = () => {
+    return React.createElement(StyledFilePopoverBody, {
       children: renderStdioFileList()
     });
   };
   /**
    * Popover.
    */
-  var renderStdioFilePopover = function renderStdioFilePopover() {
-    return jsx(Popover, {
+  const renderStdioFilePopover = () => {
+    return React.createElement(Popover, {
       open: open,
       anchorEl: anchorRef.current,
       placement: "bottom-end",
       style: {
         zIndex: 99
-      },
-      children: jsxs(StyledFilePopoverContent, {
-        children: [renderStdioFilePopoverHeader(), renderStdioFilePopoverBody()]
-      })
-    });
+      }
+    }, React.createElement(StyledFilePopoverContent, null, renderStdioFilePopoverHeader(), renderStdioFilePopoverBody()));
   };
   /**
    * Popover toggle button.
    */
-  var renderStdioFilePopoverToggleButton = function renderStdioFilePopoverToggleButton() {
-    return jsx(ExerciseMenuButton, {
+  const renderStdioFilePopoverToggleButton = () => {
+    return React.createElement(ExerciseMenuButton, {
       icon: eilMaterialTypeArduino,
       title: intl.formatMessage({
         id: 'exerciseMenu.arduino.setting'
       }),
       active: open,
-      onClick: function onClick() {
-        return setOpen(function (prev) {
-          return !prev;
-        });
-      },
+      onClick: () => setOpen(prev => !prev),
       ref: anchorRef
     });
   };
   //
   //
   //
-  return jsxs(Fragment, {
-    children: [renderStdioFilePopover(), renderStdioFilePopoverToggleButton()]
-  });
+  return React.createElement(React.Fragment, null, renderStdioFilePopover(), renderStdioFilePopoverToggleButton());
 };
 
 export { ExerciseMenuArduinoSettings as default };

package/es/components/material-exercise/exercise-menu/ExerciseMenuDropdown.js

@@ -1,5 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { ButtonMenu } from '@elice/blocks';
 import { eilMoreVertical } from '@elice/icons';
@@ -16,64 +14,52 @@ import ExerciseCodeHistory from '../exercise-code-history/ExerciseCodeHistory.js
 import ExerciseRoom from '../exercise-room/ExerciseRoom.js';
 import ExerciseSubmitHistory from '../exercise-submit-history/ExerciseSubmitHistory.js';
 
-var ExerciseMenuDropdown = function ExerciseMenuDropdown() {
-  var intl = useRawEliceIntl();
-  var _React$useContext = React.useContext(ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId;
-  var user = useRecoilValue(exerciseUserState);
-  var exercise = useRecoilValue(exerciseState(materialExerciseId));
-  var lecture = useRecoilValue(exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
-  var activeFilename = useRecoilValue(exerciseActiveFilenameState);
-  var setRightpaneActiveState = useSetRecoilState(exerciseRightpaneActiveState);
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isSubmitHistoryModalOpen = _React$useState2[0],
-    setIsSubmitHistoryModalOpen = _React$useState2[1];
-  var _React$useState3 = React.useState(false),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    isCodeHistoryModalOpen = _React$useState4[0],
-    setIsCodeHistoryModalOpen = _React$useState4[1];
-  var _React$useState5 = React.useState(false),
-    _React$useState6 = _slicedToArray(_React$useState5, 2),
-    isExerciseRoomModalOpen = _React$useState6[0],
-    setIsExerciseRoomModalOpen = _React$useState6[1];
-  var isLectureTestInProgress = typeof (lecture === null || lecture === void 0 ? void 0 : lecture.testAdmissionStatus) !== 'undefined' && lecture.testAdmissionStatus === enums.TestAdmissionStatus.InProgress;
+const ExerciseMenuDropdown = () => {
+  const intl = useRawEliceIntl();
+  const {
+    materialExerciseId
+  } = React.useContext(ExerciseContext);
+  const user = useRecoilValue(exerciseUserState);
+  const exercise = useRecoilValue(exerciseState(materialExerciseId));
+  const lecture = useRecoilValue(exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
+  const activeFilename = useRecoilValue(exerciseActiveFilenameState);
+  const setRightpaneActiveState = useSetRecoilState(exerciseRightpaneActiveState);
+  const [isSubmitHistoryModalOpen, setIsSubmitHistoryModalOpen] = React.useState(false);
+  const [isCodeHistoryModalOpen, setIsCodeHistoryModalOpen] = React.useState(false);
+  const [isExerciseRoomModalOpen, setIsExerciseRoomModalOpen] = React.useState(false);
+  const isLectureTestInProgress = typeof (lecture === null || lecture === void 0 ? void 0 : lecture.testAdmissionStatus) !== 'undefined' && lecture.testAdmissionStatus === enums.TestAdmissionStatus.InProgress;
   //
   // Runner Rooms Open Subscription
   //
-  React.useEffect(function () {
-    var runnerRoomsOpenSubscription = exerciseRunnerRoomsOpen$.subscribe(function () {
+  React.useEffect(() => {
+    const runnerRoomsOpenSubscription = exerciseRunnerRoomsOpen$.subscribe(() => {
       setIsExerciseRoomModalOpen(true);
     });
-    return function () {
+    return () => {
       runnerRoomsOpenSubscription.unsubscribe();
     };
   }, []);
   /**
    *
    */
-  var renderSumbitHistoryModal = function renderSumbitHistoryModal() {
+  const renderSumbitHistoryModal = () => {
     if (!isSubmitHistoryModalOpen) {
       return null;
     }
-    return jsx(ExerciseSubmitHistory, {
-      onHide: function onHide() {
-        return setIsSubmitHistoryModalOpen(false);
-      }
+    return React.createElement(ExerciseSubmitHistory, {
+      onHide: () => setIsSubmitHistoryModalOpen(false)
     });
   };
   /**
    *
    */
-  var renderCodeHistoryModal = function renderCodeHistoryModal() {
+  const renderCodeHistoryModal = () => {
     if (!isCodeHistoryModalOpen) {
       return null;
     }
-    return jsx(ExerciseCodeHistory, {
-      onHide: function onHide() {
-        return setIsCodeHistoryModalOpen(false);
-      },
-      onLoadVersionButtonClick: function onLoadVersionButtonClick(content) {
+    return React.createElement(ExerciseCodeHistory, {
+      onHide: () => setIsCodeHistoryModalOpen(false),
+      onLoadVersionButtonClick: content => {
         exerciseFileEditorContentChange$.next(content);
         setIsCodeHistoryModalOpen(false);
       }
@@ -82,72 +68,57 @@ var ExerciseMenuDropdown = function ExerciseMenuDropdown() {
   /**
    *
    */
-  var renderExerciseRoomModal = function renderExerciseRoomModal() {
+  const renderExerciseRoomModal = () => {
     if (!isExerciseRoomModalOpen) {
       return null;
     }
-    return jsx(ExerciseRoom, {
-      onHide: function onHide() {
-        return setIsExerciseRoomModalOpen(false);
-      }
+    return React.createElement(ExerciseRoom, {
+      onHide: () => setIsExerciseRoomModalOpen(false)
     });
   };
   //
   //
   //
-  return jsxs(Fragment, {
-    children: [jsx(ButtonMenu, {
-      menuItemProps: [{
-        label: intl.formatMessage({
-          id: 'exerciseMenu.dropdown.item.environment'
-        }),
-        onClick: function onClick() {
-          return setRightpaneActiveState('environment');
-        }
-      }, {
-        label: intl.formatMessage({
-          id: 'exerciseMenu.dropdown.item.preference'
-        }),
-        onClick: function onClick() {
-          return setRightpaneActiveState('preference');
-        }
-      }, {
-        label: intl.formatMessage({
-          id: 'exerciseMenu.dropdown.item.codeHistory'
-        }),
-        disabled: !user,
-        onClick: function onClick() {
-          return setIsCodeHistoryModalOpen(true);
-        }
-      }, {
-        label: intl.formatMessage({
-          id: 'exerciseMenu.dropdown.item.submitHistory'
-        }),
-        disabled: !user || !activeFilename,
-        onClick: function onClick() {
-          return setIsSubmitHistoryModalOpen(true);
-        }
-      }, {
-        label: intl.formatMessage({
-          id: 'exerciseMenu.dropdown.item.room'
-        }),
-        disabled: isLectureTestInProgress,
-        onClick: function onClick() {
-          return setIsExerciseRoomModalOpen(true);
-        }
-      }],
-      size: "xsmall",
-      placement: "bottom-end",
-      dark: true,
-      shadow: true,
-      children: jsx(ExerciseMenuButton, {
-        icon: eilMoreVertical,
-        title: intl.formatMessage({
-          id: 'exerciseMenu.dropdown.button.tooltip'
-        })
-      })
-    }), renderSumbitHistoryModal(), renderCodeHistoryModal(), renderExerciseRoomModal()]
-  });
+  return React.createElement(React.Fragment, null, React.createElement(ButtonMenu, {
+    menuItemProps: [{
+      label: intl.formatMessage({
+        id: 'exerciseMenu.dropdown.item.environment'
+      }),
+      onClick: () => setRightpaneActiveState('environment')
+    }, {
+      label: intl.formatMessage({
+        id: 'exerciseMenu.dropdown.item.preference'
+      }),
+      onClick: () => setRightpaneActiveState('preference')
+    }, {
+      label: intl.formatMessage({
+        id: 'exerciseMenu.dropdown.item.codeHistory'
+      }),
+      disabled: !user,
+      onClick: () => setIsCodeHistoryModalOpen(true)
+    }, {
+      label: intl.formatMessage({
+        id: 'exerciseMenu.dropdown.item.submitHistory'
+      }),
+      disabled: !user || !activeFilename,
+      onClick: () => setIsSubmitHistoryModalOpen(true)
+    }, {
+      label: intl.formatMessage({
+        id: 'exerciseMenu.dropdown.item.room'
+      }),
+      disabled: isLectureTestInProgress,
+      onClick: () => setIsExerciseRoomModalOpen(true)
+    }],
+    size: "xsmall",
+    placement: "bottom-end",
+    dark: true,
+    shadow: true
+  }, React.createElement(ExerciseMenuButton, {
+    icon: eilMoreVertical,
+    title: intl.formatMessage({
+      id: 'exerciseMenu.dropdown.button.tooltip'
+    })
+  })), renderSumbitHistoryModal(), renderCodeHistoryModal(), renderExerciseRoomModal());
 };
 
 export { ExerciseMenuDropdown as default };