@elice/material-exercise 1.251120.1 → 1.260128.0-rc.0

package/es/components/material-exercise/exercise-room/ExerciseRoomDetail.js

@@ -1,32 +1,29 @@
-import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import _styled from '@emotion/styled/base';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import React from 'react';
 import { useCopyToClipboard, useDebounce, useUpdateEffect } from 'react-use';
 import { getOrgMaterialExerciseExerciseRoomGet, postOrgMaterialExerciseExerciseRoomEdit, postOrgMaterialExerciseExerciseRoomDefaultRoomSet, getOrgCourseUserList, postOrgMaterialExerciseExerciseRoomDelete, postOrgMaterialExerciseExerciseRoomUserDelete, postOrgMaterialExerciseExerciseRoomUserEdit } from '@elice/api-client';
-import { Modal, Flex, Icon, Text, Button, Dialog, Label, Vspace, Input, ProfileImage, Select, Notification } from '@elice/blocks';
+import { Modal, Dialog, Label, Vspace, Input, Flex, ProfileImage, Text, Select, Button, Notification, Icon } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
-import { eilArrowLeftwardsSingle, eisArrowDownwardsCircle, eilSearch } from '@elice/icons';
+import { eilArrowLeftwardsSingle, eilSearch, eisArrowDownwardsCircle } from '@elice/icons';
 import { useRawEliceIntl } from '@elice/intl';
 import { enums } from '@elice/types';
 import _ from 'lodash';
 import { useRecoilValue } from 'recoil';
-import styled from 'styled-components';
+import { StyledExerciseRoomTableWrapper, StyledExerciseRoomTable, StyledExerciseRoomThead, StyledExerciseRoomTr, StyledExerciseRoomTh, StyledExerciseRoomTbody, StyledExerciseRoomTd } from './ExerciseRoom.styled.js';
 import { exerciseState, exerciseUserState } from '../context/recoil.js';
-import { ExerciseContext } from '../context/context.js';
-import '../context/recoilTypes.js';
-import '../context/subjects.js';
-import '../context/ExerciseProvider.js';
 import { exerciseRoomPermissionStringConvertor } from './helpers/exerciseRoomPermissionStringConvertor.js';
-import { StyledExerciseRoomTableWrapper, StyledExerciseRoomTable, StyledExerciseRoomThead, StyledExerciseRoomTr, StyledExerciseRoomTh, StyledExerciseRoomTbody, StyledExerciseRoomTd } from './ExerciseRoom.styled.js';
+import { ExerciseContext } from '../context/context.js';
 
-var StyledModal = styled(Modal).withConfig({
-  componentId: "sc-x9irqe-0"
-})(["& > div:first-child{.eb-button{color:", ";&:hover{color:", ";}}}& .eb-input[width='full']{*:not(button,button > *){background-color:", ";color:", ";}& > div{border:1px solid ", ";}}& .eb-select{*{background-color:", ";color:", ";}& > div{border:1px solid ", ";}& select{padding-top:6px;padding-bottom:6px;height:2rem;font-size:0.75rem;}}"], base.color.navy0, base.color.navy0, base.color.navy7, base.color.navy0, base.color.navy6, base.color.navy6, base.color.navy0, base.color.navy5);
+var StyledModal = /*#__PURE__*/_styled(Modal, {
+  target: "euc63q70"
+})("&>div:first-child{.eb-button{color:", base.color.navy0, ";&:hover{color:", base.color.navy0, ";}}}& .eb-input[width='full']{*:not(button, button > *){background-color:", base.color.navy7, ";color:", base.color.navy0, ";}&>div{border:1px solid ", base.color.navy6, ";}}& .eb-select{*{background-color:", base.color.navy6, ";color:", base.color.navy0, ";}&>div{border:1px solid ", base.color.navy5, ";}& select{padding-top:6px;padding-bottom:6px;height:2rem;font-size:0.75rem;}}");
 var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDetail(_ref) {
   var selectedExerciseRoomId = _ref.selectedExerciseRoomId,
     goToList = _ref.goToList,
     onHide = _ref.onHide;
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c, _d;
   var intl = useRawEliceIntl();
   var _React$useContext = React.useContext(ExerciseContext),
     materialExerciseId = _React$useContext.materialExerciseId,
@@ -50,24 +47,24 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
     search = _React$useState8[0],
     setSearch = _React$useState8[1];
   var _React$useState9 = React.useState(''),
-    _React$useState10 = _slicedToArray(_React$useState9, 2),
-    debouncedSearch = _React$useState10[0],
-    setDebouncedSearch = _React$useState10[1];
-  var _React$useState11 = React.useState([]),
+    _React$useState0 = _slicedToArray(_React$useState9, 2),
+    debouncedSearch = _React$useState0[0],
+    setDebouncedSearch = _React$useState0[1];
+  var _React$useState1 = React.useState([]),
+    _React$useState10 = _slicedToArray(_React$useState1, 2),
+    exerciseRoomUserList = _React$useState10[0],
+    setExerciseRoomUserList = _React$useState10[1];
+  var _React$useState11 = React.useState(false),
     _React$useState12 = _slicedToArray(_React$useState11, 2),
-    exerciseRoomUserList = _React$useState12[0],
-    setExerciseRoomUserList = _React$useState12[1];
+    isLeaveDialogOpen = _React$useState12[0],
+    setIsLeaveDialogOpen = _React$useState12[1];
   var _React$useState13 = React.useState(false),
     _React$useState14 = _slicedToArray(_React$useState13, 2),
-    isLeaveDialogOpen = _React$useState14[0],
-    setIsLeaveDialogOpen = _React$useState14[1];
-  var _React$useState15 = React.useState(false),
-    _React$useState16 = _slicedToArray(_React$useState15, 2),
-    isDeleting = _React$useState16[0],
-    setIsDeleting = _React$useState16[1];
-  var isThisChatRoomOwner = (_b = ((_a = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.roomUsers.find(function (roomUser) {
+    isDeleting = _React$useState14[0],
+    setIsDeleting = _React$useState14[1];
+  var isThisChatRoomOwner = ((_a = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.roomUsers.find(function (roomUser) {
     return roomUser.user.id === (user === null || user === void 0 ? void 0 : user.id);
-  })) === null || _a === void 0 ? void 0 : _a.permission) === enums.ExerciseRoomPermission.Owner) !== null && _b !== void 0 ? _b : false;
+  })) === null || _a === void 0 ? void 0 : _a.permission) === enums.ExerciseRoomPermission.Owner;
   var shareLink = materialExercise ? "https://".concat(window.location.host, "/courses/").concat(materialExercise._courseId, "/lectures/").concat(materialExercise === null || materialExercise === void 0 ? void 0 : materialExercise._lectureId, "/lecturepages/").concat(materialExercise === null || materialExercise === void 0 ? void 0 : materialExercise._lecturePageId, "/projects/").concat(selectedExerciseRoomId) : '';
   var _useCopyToClipboard = useCopyToClipboard(),
     _useCopyToClipboard2 = _slicedToArray(_useCopyToClipboard, 2),
@@ -93,7 +90,7 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
       setTitle(res.exerciseRoom.title);
       setDebouncedTitle(res.exerciseRoom.title);
       setExerciseRoomUserList(list);
-    }).catch(console.error);
+    })["catch"](console.error);
   }, [selectedExerciseRoomId]);
   var doPostOrgMaterialExerciseExerciseRoomEdit = React.useCallback(function (publicPermission) {
     if (exerciseRoom && materialExercise) {
@@ -104,7 +101,7 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
         exerciseRoomId: selectedExerciseRoomId
       }).then(function () {
         return doGetOrgMaterialExerciseExerciseRoomGet();
-      }).catch(console.error);
+      })["catch"](console.error);
     }
   }, [doGetOrgMaterialExerciseExerciseRoomGet, exerciseRoom, selectedExerciseRoomId, materialExercise]);
   var doPostOrgMaterialExerciseExerciseRoomDefaultRoomSet = React.useCallback(function () {
@@ -112,7 +109,7 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
       exerciseRoomId: selectedExerciseRoomId
     }).then(function () {
       return doGetOrgMaterialExerciseExerciseRoomGet();
-    }).catch(console.error);
+    })["catch"](console.error);
   }, [doGetOrgMaterialExerciseExerciseRoomGet, selectedExerciseRoomId]);
   useDebounce(function () {
     setDebouncedSearch(search);
@@ -145,18 +142,18 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
             }]
           }]
         }
-      }).then( /*#__PURE__*/function () {
-        var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(res) {
+      }).then(/*#__PURE__*/function () {
+        var _ref3 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(res) {
           var _yield$getOrgMaterial, exerciseRoom, list;
-          return _regeneratorRuntime().wrap(function _callee$(_context) {
-            while (1) switch (_context.prev = _context.next) {
+          return _regenerator().w(function (_context) {
+            while (1) switch (_context.n) {
               case 0:
-                _context.next = 2;
+                _context.n = 1;
                 return getOrgMaterialExerciseExerciseRoomGet({
                   exerciseRoomId: selectedExerciseRoomId
                 });
-              case 2:
-                _yield$getOrgMaterial = _context.sent;
+              case 1:
+                _yield$getOrgMaterial = _context.v;
                 exerciseRoom = _yield$getOrgMaterial.exerciseRoom;
                 list = _.map(res.users, function (_ref4) {
                   var id = _ref4.id,
@@ -173,16 +170,15 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
                   };
                 });
                 setExerciseRoomUserList(list);
-              case 6:
-              case "end":
-                return _context.stop();
+              case 2:
+                return _context.a(2);
             }
           }, _callee);
         }));
         return function (_x) {
           return _ref3.apply(this, arguments);
         };
-      }()).catch(console.error);
+      }())["catch"](console.error);
     }
   }, [debouncedSearch, materialExercise, selectedExerciseRoomId]);
   React.useEffect(function () {
@@ -204,15 +200,13 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
         exerciseRoomId: selectedExerciseRoomId
       }).then(function () {
         return doGetOrgMaterialExerciseExerciseRoomGet();
-      }).catch(console.error);
+      })["catch"](console.error);
     }
   }, [debouncedTitle]);
   return jsxs(StyledModal, {
-    theme: "dark",
-    onHide: onHide,
-    title: (_c = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.title) !== null && _c !== void 0 ? _c : '',
+    theme: 'dark',
+    title: (_b = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.title) !== null && _b !== void 0 ? _b : '',
     headerIcon: eilArrowLeftwardsSingle,
-    onHeaderIconClick: goToList,
     footerChild: exerciseRoom ? exerciseRoom.isDefaultRoom ? jsxs(Flex, {
       justify: "flex-end",
       align: "center",
@@ -234,8 +228,8 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
       align: "center",
       children: jsx(Button, {
         transparent: true,
-        role: "lightpurple",
         underline: true,
+        role: "lightpurple",
         border: false,
         onClick: doPostOrgMaterialExerciseExerciseRoomDefaultRoomSet,
         children: intl.formatMessage({
@@ -259,12 +253,14 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
       label: intl.formatMessage({
         id: 'materialExerciseExerciseRoom.leave'
       }),
-      disabled: (_d = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.isDefaultRoom) !== null && _d !== void 0 ? _d : false,
+      disabled: (_c = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.isDefaultRoom) !== null && _c !== void 0 ? _c : false,
       role: 'gray6',
       onClick: function onClick() {
         setIsLeaveDialogOpen(true);
       }
     }],
+    onHide: onHide,
+    onHeaderIconClick: goToList,
     children: [isLeaveDialogOpen ? jsxs(Dialog, {
       type: "warning",
       title: intl.formatMessage({
@@ -285,7 +281,7 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
               exerciseRoomId: selectedExerciseRoomId
             }).then(function () {
               goToList();
-            }).catch(console.error).finally(function () {
+            })["catch"](console.error)["finally"](function () {
               setIsDeleting(false);
             });
           } else {
@@ -294,7 +290,7 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
               exerciseRoomId: selectedExerciseRoomId
             }).then(function () {
               goToList();
-            }).catch(console.error).finally(function () {
+            })["catch"](console.error)["finally"](function () {
               setIsDeleting(false);
             });
           }
@@ -319,12 +315,12 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
         size: "small",
         width: "full",
         value: title,
-        onChange: function onChange(e) {
-          return setTitle(e.target.value);
-        },
         placeholder: intl.formatMessage({
           id: 'materialExerciseExerciseRoom.detail.title.placeholder'
-        })
+        }),
+        onChange: function onChange(e) {
+          return setTitle(e.target.value);
+        }
       }), jsx(Vspace, {
         height: 1.25
       })]
@@ -342,12 +338,12 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
         size: "small",
         width: "full",
         value: search,
-        onChange: function onChange(e) {
-          return setSearch(e.target.value);
-        },
         placeholder: intl.formatMessage({
           id: 'materialExerciseExerciseRoom.detail.addUsers.placeholder'
-        })
+        }),
+        onChange: function onChange(e) {
+          return setSearch(e.target.value);
+        }
       }), jsx(Vspace, {
         height: 1.25
       })]
@@ -379,10 +375,10 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
               if ((user === null || user === void 0 ? void 0 : user.id) === chatroomUser.id || !isThisChatRoomOwner) {
                 return jsx(Text, {
                   bold: true,
-                  role: "gray0",
-                  size: "tiny",
                   preWrap: true,
                   ellipsis: true,
+                  role: "gray0",
+                  size: "tiny",
                   customStyles: {
                     maxWidth: '100px',
                     marginRight: '0.5rem'
@@ -396,10 +392,10 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
                   align: "center",
                   children: [jsx(Text, {
                     bold: true,
-                    role: "gray0",
-                    size: "tiny",
                     preWrap: true,
                     ellipsis: true,
+                    role: "gray0",
+                    size: "tiny",
                     customStyles: {
                       maxWidth: '100px',
                       marginRight: '0.5rem'
@@ -412,34 +408,34 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
                     role: "lightpurple",
                     loading: false,
                     onClick: function () {
-                      var _onClick = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-                        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-                          while (1) switch (_context2.prev = _context2.next) {
+                      var _onClick = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
+                        var _t;
+                        return _regenerator().w(function (_context2) {
+                          while (1) switch (_context2.p = _context2.n) {
                             case 0:
-                              _context2.prev = 0;
-                              _context2.next = 3;
+                              _context2.p = 0;
+                              _context2.n = 1;
                               return postOrgMaterialExerciseExerciseRoomUserEdit({
                                 exerciseRoomId: selectedExerciseRoomId,
                                 permission: enums.ExerciseRoomPermission.Read,
                                 userId: chatroomUser.id
                               });
-                            case 3:
+                            case 1:
                               if (debouncedSearch) {
                                 void doGetOrgCourseUserList();
                               } else {
                                 void doGetOrgMaterialExerciseExerciseRoomGet();
                               }
-                              _context2.next = 9;
+                              _context2.n = 3;
                               break;
-                            case 6:
-                              _context2.prev = 6;
-                              _context2.t0 = _context2["catch"](0);
-                              console.error(_context2.t0);
-                            case 9:
-                            case "end":
-                              return _context2.stop();
+                            case 2:
+                              _context2.p = 2;
+                              _t = _context2.v;
+                              console.error(_t);
+                            case 3:
+                              return _context2.a(2);
                           }
-                        }, _callee2, null, [[0, 6]]);
+                        }, _callee2, null, [[0, 2]]);
                       }));
                       function onClick() {
                         return _onClick.apply(this, arguments);
@@ -456,63 +452,62 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
                   size: "small",
                   width: "small",
                   value: chatroomUser.permission,
+                  disabled: !isThisChatRoomOwner,
                   onChange: function () {
-                    var _onChange = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(value) {
-                      var permission;
-                      return _regeneratorRuntime().wrap(function _callee3$(_context3) {
-                        while (1) switch (_context3.prev = _context3.next) {
+                    var _onChange = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(value) {
+                      var permission, _t2;
+                      return _regenerator().w(function (_context3) {
+                        while (1) switch (_context3.p = _context3.n) {
                           case 0:
-                            _context3.prev = 0;
+                            _context3.p = 0;
                             permission = Number(value);
                             if (!(permission === enums.ExerciseRoomPermission.Nothing)) {
-                              _context3.next = 8;
+                              _context3.n = 2;
                               break;
                             }
-                            _context3.next = 5;
+                            _context3.n = 1;
                             return postOrgMaterialExerciseExerciseRoomUserDelete({
                               exerciseRoomId: selectedExerciseRoomId,
                               userId: chatroomUser.id
                             });
-                          case 5:
+                          case 1:
                             if (debouncedSearch) {
                               void doGetOrgCourseUserList();
                             } else {
                               void doGetOrgMaterialExerciseExerciseRoomGet();
                             }
-                            _context3.next = 11;
+                            _context3.n = 4;
                             break;
-                          case 8:
-                            _context3.next = 10;
+                          case 2:
+                            _context3.n = 3;
                             return postOrgMaterialExerciseExerciseRoomUserEdit({
                               exerciseRoomId: selectedExerciseRoomId,
                               permission: permission,
                               userId: chatroomUser.id
                             });
-                          case 10:
+                          case 3:
                             if (debouncedSearch) {
                               void doGetOrgCourseUserList();
                             } else {
                               void doGetOrgMaterialExerciseExerciseRoomGet();
                             }
-                          case 11:
-                            _context3.next = 16;
+                          case 4:
+                            _context3.n = 6;
                             break;
-                          case 13:
-                            _context3.prev = 13;
-                            _context3.t0 = _context3["catch"](0);
-                            console.error(_context3.t0);
-                          case 16:
-                          case "end":
-                            return _context3.stop();
+                          case 5:
+                            _context3.p = 5;
+                            _t2 = _context3.v;
+                            console.error(_t2);
+                          case 6:
+                            return _context3.a(2);
                         }
-                      }, _callee3, null, [[0, 13]]);
+                      }, _callee3, null, [[0, 5]]);
                     }));
                     function onChange(_x2) {
                       return _onChange.apply(this, arguments);
                     }
                     return onChange;
                   }(),
-                  disabled: !isThisChatRoomOwner,
                   children: [jsx("option", {
                     value: enums.ExerciseRoomPermission.Nothing,
                     children: intl.formatMessage({
@@ -543,10 +538,10 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
                     height: "1.5rem"
                   }), jsx(Text, {
                     bold: true,
-                    size: "small",
-                    role: "white",
                     preWrap: true,
                     ellipsis: true,
+                    size: "small",
+                    role: "white",
                     customStyles: {
                       marginLeft: '0.5rem'
                     },
@@ -574,11 +569,11 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
       children: [jsxs(Select, {
         size: "small",
         width: "small",
-        value: (_e = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.publicPermission) !== null && _e !== void 0 ? _e : enums.ExerciseRoomPermission.Nothing,
+        value: (_d = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.publicPermission) !== null && _d !== void 0 ? _d : enums.ExerciseRoomPermission.Nothing,
+        disabled: false,
         onChange: function onChange(value) {
           doPostOrgMaterialExerciseExerciseRoomEdit(value);
         },
-        disabled: false,
         children: [jsx("option", {
           value: enums.ExerciseRoomPermission.Nothing,
           children: intl.formatMessage({
@@ -618,12 +613,12 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
         })
       }),
       value: materialExercise ? shareLink : '',
-      onChange: function onChange(e) {
-        return setSearch(e.target.value);
-      },
       placeholder: intl.formatMessage({
         id: 'materialExerciseExerciseRoom.detail.addUsers.placeholder'
-      })
+      }),
+      onChange: function onChange(e) {
+        return setSearch(e.target.value);
+      }
     })]
   });
 };

package/es/components/material-exercise/exercise-room/ExerciseRoomList.js

@@ -1,25 +1,22 @@
-import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import _styled from '@emotion/styled/base';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 import { getOrgMaterialExerciseExerciseRoomList, postOrgMaterialExerciseExerciseRoomEdit } from '@elice/api-client';
-import { Modal, Flex, Text, Icon, ProfileImageGroup, ProfileImage, Notification } from '@elice/blocks';
+import { Modal, Flex, Icon, Text, ProfileImageGroup, ProfileImage, Notification } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
 import { eisArrowDownwardsCircle } from '@elice/icons';
 import { useRawEliceIntl } from '@elice/intl';
 import { enums } from '@elice/types';
 import { useRecoilValue } from 'recoil';
-import styled from 'styled-components';
-import { exerciseState, exerciseUserState } from '../context/recoil.js';
-import { ExerciseContext } from '../context/context.js';
-import '../context/recoilTypes.js';
-import '../context/subjects.js';
-import '../context/ExerciseProvider.js';
-import { exerciseRoomPermissionStringConvertor } from './helpers/exerciseRoomPermissionStringConvertor.js';
 import { StyledExerciseRoomTableWrapper, StyledExerciseRoomTable, StyledExerciseRoomThead, StyledExerciseRoomTr, StyledExerciseRoomTh, StyledExerciseRoomTbody, StyledExerciseRoomTd } from './ExerciseRoom.styled.js';
+import { exerciseRoomPermissionStringConvertor } from './helpers/exerciseRoomPermissionStringConvertor.js';
+import { ExerciseContext } from '../context/context.js';
+import { exerciseState, exerciseUserState } from '../context/recoil.js';
 
-var StyledModal = styled(Modal).withConfig({
-  componentId: "sc-1ydn3lf-0"
-})(["& > div:first-child{.eb-button{color:", ";&:hover{color:", ";}}}"], base.color.navy0, base.color.navy0);
+var StyledModal = /*#__PURE__*/_styled(Modal, {
+  target: "e13d1s2i0"
+})("&>div:first-child{.eb-button{color:", base.color.navy0, ";&:hover{color:", base.color.navy0, ";}}}");
 var MaterialExerciseExerciseRoomList = function MaterialExerciseExerciseRoomList(_ref) {
   var onExerciseRoomClick = _ref.onExerciseRoomClick,
     onHide = _ref.onHide;
@@ -45,7 +42,7 @@ var MaterialExerciseExerciseRoomList = function MaterialExerciseExerciseRoomList
       userId: userId
     }).then(function (res) {
       return setExerciseRooms(res.exerciseRooms);
-    }).catch(console.error);
+    })["catch"](console.error);
   }, []);
   React.useEffect(function () {
     if (materialExercise && user) {
@@ -56,16 +53,16 @@ var MaterialExerciseExerciseRoomList = function MaterialExerciseExerciseRoomList
       });
     }
   }, [doGetOrgMaterialExerciseExerciseRoomList, materialExercise, user]);
-  var doPostOrgMaterialExerciseExerciseRoomEdit = React.useCallback( /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref3) {
-      var materialExerciseId, userId;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
+  var doPostOrgMaterialExerciseExerciseRoomEdit = React.useCallback(/*#__PURE__*/function () {
+    var _ref4 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(_ref3) {
+      var materialExerciseId, userId, _t;
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.p = _context.n) {
           case 0:
             materialExerciseId = _ref3.materialExerciseId, userId = _ref3.userId;
-            _context.prev = 1;
+            _context.p = 1;
             setCreateStatus('pending');
-            _context.next = 5;
+            _context.n = 2;
             return postOrgMaterialExerciseExerciseRoomEdit({
               title: intl.formatMessage({
                 id: 'materialExerciseExerciseRoom.exerciseRoom.defaultName'
@@ -75,7 +72,7 @@ var MaterialExerciseExerciseRoomList = function MaterialExerciseExerciseRoomList
               materialExerciseId: materialExerciseId,
               publicPermission: enums.ExerciseRoomPermission.Nothing
             });
-          case 5:
+          case 2:
             doGetOrgMaterialExerciseExerciseRoomList({
               materialExerciseId: materialExerciseId,
               userId: userId
@@ -84,29 +81,27 @@ var MaterialExerciseExerciseRoomList = function MaterialExerciseExerciseRoomList
             Notification.success(intl.formatMessage({
               id: 'materialExerciseExerciseRoom.create.success'
             }));
-            _context.next = 15;
+            _context.n = 4;
             break;
-          case 10:
-            _context.prev = 10;
-            _context.t0 = _context["catch"](1);
-            console.error(_context.t0);
+          case 3:
+            _context.p = 3;
+            _t = _context.v;
+            console.error(_t);
             Notification.error(intl.formatMessage({
               id: 'materialExerciseExerciseRoom.create.failure'
             }));
             setCreateStatus('rejected');
-          case 15:
-          case "end":
-            return _context.stop();
+          case 4:
+            return _context.a(2);
         }
-      }, _callee, null, [[1, 10]]);
+      }, _callee, null, [[1, 3]]);
     }));
     return function (_x) {
       return _ref4.apply(this, arguments);
     };
   }(), [doGetOrgMaterialExerciseExerciseRoomList, intl]);
   return jsx(StyledModal, {
-    theme: "dark",
-    onHide: onHide,
+    theme: 'dark',
     title: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.title'
     }),
@@ -145,6 +140,7 @@ var MaterialExerciseExerciseRoomList = function MaterialExerciseExerciseRoomList
       role: 'gray6',
       onClick: onHide
     }],
+    onHide: onHide,
     children: jsx(StyledExerciseRoomTableWrapper, {
       children: jsxs(StyledExerciseRoomTable, {
         children: [jsxs("colgroup", {
@@ -193,10 +189,10 @@ var MaterialExerciseExerciseRoomList = function MaterialExerciseExerciseRoomList
                     }
                   }) : null, jsx(Text, {
                     bold: true,
-                    size: "small",
-                    role: exerciseRoom.isDefaultRoom ? 'lightpurple' : 'gray0',
                     preWrap: true,
                     ellipsis: true,
+                    size: "small",
+                    role: exerciseRoom.isDefaultRoom ? 'lightpurple' : 'gray0',
                     customStyles: {
                       maxWidth: '300px'
                     },
@@ -215,10 +211,10 @@ var MaterialExerciseExerciseRoomList = function MaterialExerciseExerciseRoomList
               }), jsx(StyledExerciseRoomTd, {
                 children: jsx(Text, {
                   bold: true,
-                  role: "gray0",
-                  size: "tiny",
                   preWrap: true,
                   ellipsis: true,
+                  role: "gray0",
+                  size: "tiny",
                   customStyles: {
                     maxWidth: '100px'
                   },