@elice/material-exercise 1.231212.0 → 1.231228.0

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

@@ -2,7 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var reactIntl = require('react-intl');
 var reactUse = require('react-use');
@@ -22,111 +21,75 @@ require('../context/ExerciseProvider.js');
 var exerciseRoomPermissionStringConvertor = require('./helpers/exerciseRoomPermissionStringConvertor.js');
 var ExerciseRoom_styled = require('./ExerciseRoom.styled.js');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-var StyledModal = styled__default["default"](blocks.Modal).withConfig({
+const StyledModal = styled(blocks.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;}}"], designTokens.base.color.navy0, designTokens.base.color.navy0, designTokens.base.color.navy7, designTokens.base.color.navy0, designTokens.base.color.navy6, designTokens.base.color.navy6, designTokens.base.color.navy0, designTokens.base.color.navy5);
-var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDetail(_ref) {
-  var selectedExerciseRoomId = _ref.selectedExerciseRoomId,
-    goToList = _ref.goToList,
-    onHide = _ref.onHide;
+const MaterialExerciseExerciseRoomDetail = ({
+  selectedExerciseRoomId,
+  goToList,
+  onHide
+}) => {
   var _a, _b, _c, _d, _e;
-  var intl = reactIntl.useIntl();
-  var _React$useContext = React__default["default"].useContext(context.ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId,
-    onExerciseRoomIdChange = _React$useContext.onExerciseRoomIdChange;
-  var materialExercise = recoil.useRecoilValue(recoil$1.exerciseState(materialExerciseId));
-  var user = recoil.useRecoilValue(recoil$1.exerciseUserState);
-  var _React$useState = React__default["default"].useState(),
-    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
-    exerciseRoom = _React$useState2[0],
-    setExerciseRoom = _React$useState2[1];
-  var _React$useState3 = React__default["default"].useState(''),
-    _React$useState4 = _rollupPluginBabelHelpers.slicedToArray(_React$useState3, 2),
-    title = _React$useState4[0],
-    setTitle = _React$useState4[1];
-  var _React$useState5 = React__default["default"].useState(''),
-    _React$useState6 = _rollupPluginBabelHelpers.slicedToArray(_React$useState5, 2),
-    debouncedTitle = _React$useState6[0],
-    setDebouncedTitle = _React$useState6[1];
-  var _React$useState7 = React__default["default"].useState(''),
-    _React$useState8 = _rollupPluginBabelHelpers.slicedToArray(_React$useState7, 2),
-    search = _React$useState8[0],
-    setSearch = _React$useState8[1];
-  var _React$useState9 = React__default["default"].useState(''),
-    _React$useState10 = _rollupPluginBabelHelpers.slicedToArray(_React$useState9, 2),
-    debouncedSearch = _React$useState10[0],
-    setDebouncedSearch = _React$useState10[1];
-  var _React$useState11 = React__default["default"].useState([]),
-    _React$useState12 = _rollupPluginBabelHelpers.slicedToArray(_React$useState11, 2),
-    exerciseRoomUserList = _React$useState12[0],
-    setExerciseRoomUserList = _React$useState12[1];
-  var _React$useState13 = React__default["default"].useState(false),
-    _React$useState14 = _rollupPluginBabelHelpers.slicedToArray(_React$useState13, 2),
-    isLeaveDialogOpen = _React$useState14[0],
-    setIsLeaveDialogOpen = _React$useState14[1];
-  var _React$useState15 = React__default["default"].useState(false),
-    _React$useState16 = _rollupPluginBabelHelpers.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) {
-    return roomUser.user.id === (user === null || user === void 0 ? void 0 : user.id);
-  })) === null || _a === void 0 ? void 0 : _a.permission) === types.enums.ExerciseRoomPermission.Owner) !== null && _b !== void 0 ? _b : false;
-  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 = reactUse.useCopyToClipboard(),
-    _useCopyToClipboard2 = _rollupPluginBabelHelpers.slicedToArray(_useCopyToClipboard, 2),
-    copyToClipboard = _useCopyToClipboard2[1];
-  var doGetOrgMaterialExerciseExerciseRoomGet = React__default["default"].useCallback(function () {
+  const intl = reactIntl.useIntl();
+  const {
+    materialExerciseId,
+    onExerciseRoomIdChange
+  } = React.useContext(context.ExerciseContext);
+  const materialExercise = recoil.useRecoilValue(recoil$1.exerciseState(materialExerciseId));
+  const user = recoil.useRecoilValue(recoil$1.exerciseUserState);
+  const [exerciseRoom, setExerciseRoom] = React.useState();
+  const [title, setTitle] = React.useState('');
+  const [debouncedTitle, setDebouncedTitle] = React.useState('');
+  const [search, setSearch] = React.useState('');
+  const [debouncedSearch, setDebouncedSearch] = React.useState('');
+  const [exerciseRoomUserList, setExerciseRoomUserList] = React.useState([]);
+  const [isLeaveDialogOpen, setIsLeaveDialogOpen] = React.useState(false);
+  const [isDeleting, setIsDeleting] = React.useState(false);
+  const isThisChatRoomOwner = (_b = ((_a = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.roomUsers.find(roomUser => roomUser.user.id === (user === null || user === void 0 ? void 0 : user.id))) === null || _a === void 0 ? void 0 : _a.permission) === types.enums.ExerciseRoomPermission.Owner) !== null && _b !== void 0 ? _b : false;
+  const shareLink = materialExercise ? `https://${window.location.host}/courses/${materialExercise._courseId}/lectures/${materialExercise === null || materialExercise === void 0 ? void 0 : materialExercise._lectureId}/lecturepages/${materialExercise === null || materialExercise === void 0 ? void 0 : materialExercise._lecturePageId}/projects/${selectedExerciseRoomId}` : '';
+  const [, copyToClipboard] = reactUse.useCopyToClipboard();
+  const doGetOrgMaterialExerciseExerciseRoomGet = React.useCallback(() => {
     return apiClient.getOrgMaterialExerciseExerciseRoomGet({
       exerciseRoomId: selectedExerciseRoomId
-    }).then(function (res) {
+    }).then(res => {
       setExerciseRoom(res.exerciseRoom);
-      var list = ___default["default"].map(res.exerciseRoom.roomUsers, function (_ref2) {
-        var _ref2$user = _ref2.user,
-          id = _ref2$user.id,
-          profileUrl = _ref2$user.profileUrl,
-          fullname = _ref2$user.fullname,
-          permission = _ref2.permission;
-        return {
-          id: id,
-          profileUrl: profileUrl,
-          fullname: fullname,
-          permission: permission
-        };
-      });
+      const list = _.map(res.exerciseRoom.roomUsers, ({
+        user: {
+          id,
+          profileUrl,
+          fullname
+        },
+        permission
+      }) => ({
+        id,
+        profileUrl,
+        fullname,
+        permission
+      }));
       setTitle(res.exerciseRoom.title);
       setDebouncedTitle(res.exerciseRoom.title);
       setExerciseRoomUserList(list);
     }).catch(console.error);
   }, [selectedExerciseRoomId]);
-  var doPostOrgMaterialExerciseExerciseRoomEdit = React__default["default"].useCallback(function (publicPermission) {
+  const doPostOrgMaterialExerciseExerciseRoomEdit = React.useCallback(publicPermission => {
     if (exerciseRoom && materialExercise) {
       apiClient.postOrgMaterialExerciseExerciseRoomEdit({
         materialExerciseId: materialExercise.id,
-        publicPermission: publicPermission,
+        publicPermission,
         title: exerciseRoom.title,
         exerciseRoomId: selectedExerciseRoomId
-      }).then(function () {
-        return doGetOrgMaterialExerciseExerciseRoomGet();
-      }).catch(console.error);
+      }).then(() => doGetOrgMaterialExerciseExerciseRoomGet()).catch(console.error);
     }
   }, [doGetOrgMaterialExerciseExerciseRoomGet, exerciseRoom, selectedExerciseRoomId, materialExercise]);
-  var doPostOrgMaterialExerciseExerciseRoomDefaultRoomSet = React__default["default"].useCallback(function () {
+  const doPostOrgMaterialExerciseExerciseRoomDefaultRoomSet = React.useCallback(() => {
     apiClient.postOrgMaterialExerciseExerciseRoomDefaultRoomSet({
       exerciseRoomId: selectedExerciseRoomId
-    }).then(function () {
-      return doGetOrgMaterialExerciseExerciseRoomGet();
-    }).catch(console.error);
+    }).then(() => doGetOrgMaterialExerciseExerciseRoomGet()).catch(console.error);
   }, [doGetOrgMaterialExerciseExerciseRoomGet, selectedExerciseRoomId]);
-  reactUse.useDebounce(function () {
+  reactUse.useDebounce(() => {
     setDebouncedSearch(search);
   }, 300, [search]);
-  var doGetOrgCourseUserList = React__default["default"].useCallback(function () {
+  const doGetOrgCourseUserList = React.useCallback(() => {
     if (materialExercise) {
       return apiClient.getOrgCourseUserList({
         courseId: materialExercise._courseId,
@@ -136,9 +99,9 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
         filterConditions: {
           $and: [{
             $or: [{
-              name: "%".concat(debouncedSearch, "%")
+              name: `%${debouncedSearch}%`
             }, {
-              email: "%".concat(debouncedSearch, "%")
+              email: `%${debouncedSearch}%`
             }]
           }, {
             $or: [{
@@ -154,105 +117,86 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
             }]
           }]
         }
-      }).then( /*#__PURE__*/function () {
-        var _ref3 = _rollupPluginBabelHelpers.asyncToGenerator( /*#__PURE__*/_rollupPluginBabelHelpers.regeneratorRuntime().mark(function _callee(res) {
-          var _yield$getOrgMaterial, exerciseRoom, list;
-          return _rollupPluginBabelHelpers.regeneratorRuntime().wrap(function _callee$(_context) {
-            while (1) switch (_context.prev = _context.next) {
-              case 0:
-                _context.next = 2;
-                return apiClient.getOrgMaterialExerciseExerciseRoomGet({
-                  exerciseRoomId: selectedExerciseRoomId
-                });
-              case 2:
-                _yield$getOrgMaterial = _context.sent;
-                exerciseRoom = _yield$getOrgMaterial.exerciseRoom;
-                list = ___default["default"].map(res.users, function (_ref4) {
-                  var id = _ref4.id,
-                    profileUrl = _ref4.profileUrl,
-                    fullname = _ref4.fullname;
-                  var _a, _b;
-                  return {
-                    id: id,
-                    profileUrl: profileUrl,
-                    fullname: fullname,
-                    permission: (_b = (_a = ___default["default"].find(exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.roomUsers, function (roomUser) {
-                      return roomUser.user.id === id;
-                    })) === null || _a === void 0 ? void 0 : _a.permission) !== null && _b !== void 0 ? _b : types.enums.ExerciseRoomPermission.Nothing
-                  };
-                });
-                setExerciseRoomUserList(list);
-              case 6:
-              case "end":
-                return _context.stop();
-            }
-          }, _callee);
-        }));
-        return function (_x) {
-          return _ref3.apply(this, arguments);
-        };
-      }()).catch(console.error);
+      }).then(async res => {
+        const {
+          exerciseRoom
+        } = await apiClient.getOrgMaterialExerciseExerciseRoomGet({
+          exerciseRoomId: selectedExerciseRoomId
+        });
+        const list = _.map(res.users, ({
+          id,
+          profileUrl,
+          fullname
+        }) => {
+          var _a, _b;
+          return {
+            id,
+            profileUrl,
+            fullname,
+            permission: (_b = (_a = _.find(exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.roomUsers, roomUser => roomUser.user.id === id)) === null || _a === void 0 ? void 0 : _a.permission) !== null && _b !== void 0 ? _b : types.enums.ExerciseRoomPermission.Nothing
+          };
+        });
+        setExerciseRoomUserList(list);
+      }).catch(console.error);
     }
   }, [debouncedSearch, materialExercise, selectedExerciseRoomId]);
-  React__default["default"].useEffect(function () {
+  React.useEffect(() => {
     if (debouncedSearch) {
       void doGetOrgCourseUserList();
     } else {
       void doGetOrgMaterialExerciseExerciseRoomGet();
     }
   }, [debouncedSearch, doGetOrgCourseUserList, doGetOrgMaterialExerciseExerciseRoomGet]);
-  reactUse.useDebounce(function () {
+  reactUse.useDebounce(() => {
     setDebouncedTitle(title);
   }, 300, [title]);
-  reactUse.useUpdateEffect(function () {
+  reactUse.useUpdateEffect(() => {
     if (debouncedTitle.length > 0 && materialExercise && exerciseRoom && exerciseRoom.title !== debouncedTitle) {
       apiClient.postOrgMaterialExerciseExerciseRoomEdit({
         materialExerciseId: materialExercise.id,
         publicPermission: exerciseRoom.publicPermission,
         title: debouncedTitle,
         exerciseRoomId: selectedExerciseRoomId
-      }).then(function () {
-        return doGetOrgMaterialExerciseExerciseRoomGet();
-      }).catch(console.error);
+      }).then(() => doGetOrgMaterialExerciseExerciseRoomGet()).catch(console.error);
     }
   }, [debouncedTitle]);
-  return React__default["default"].createElement(StyledModal, {
+  return React.createElement(StyledModal, {
     theme: "dark",
     onHide: onHide,
     title: (_c = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.title) !== null && _c !== void 0 ? _c : '',
     headerIcon: icons.eilArrowLeftwardsSingle,
     onHeaderIconClick: goToList,
-    footerChild: exerciseRoom ? exerciseRoom.isDefaultRoom ? React__default["default"].createElement(blocks.Flex, {
+    footerChild: exerciseRoom ? exerciseRoom.isDefaultRoom ? React.createElement(blocks.Flex, {
       justify: "flex-end",
       align: "center"
-    }, React__default["default"].createElement(blocks.Icon, {
+    }, React.createElement(blocks.Icon, {
       icon: icons.eisArrowDownwardsCircle,
       color: designTokens.base.color.primary3,
       style: {
         marginRight: '0.5rem'
       }
-    }), React__default["default"].createElement(blocks.Text, {
+    }), React.createElement(blocks.Text, {
       role: "lightpurple",
       size: "tiny"
     }, intl.formatMessage({
       id: 'materialExerciseExerciseRoom.defaultExerciseRoomDescription'
-    }))) : React__default["default"].createElement(blocks.Flex, {
+    }))) : React.createElement(blocks.Flex, {
       justify: "flex-end",
       align: "center"
-    }, React__default["default"].createElement(blocks.Button, {
+    }, React.createElement(blocks.Button, {
       transparent: true,
       role: "lightpurple",
       underline: true,
       border: false,
       onClick: doPostOrgMaterialExerciseExerciseRoomDefaultRoomSet
-    }, React__default["default"].createElement(reactIntl.FormattedMessage, {
+    }, React.createElement(reactIntl.FormattedMessage, {
       id: "materialExerciseExerciseRoom.setDefaultExerciseRoom"
     }))) : undefined,
     footerButtons: [{
       label: intl.formatMessage({
         id: 'materialExerciseExerciseRoom.open'
       }),
-      onClick: function onClick() {
+      onClick: () => {
         if (exerciseRoom && typeof onExerciseRoomIdChange === 'function') {
           onExerciseRoomIdChange(exerciseRoom.id);
           onHide();
@@ -266,11 +210,11 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
       }),
       disabled: (_d = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.isDefaultRoom) !== null && _d !== void 0 ? _d : false,
       role: 'gray6',
-      onClick: function onClick() {
+      onClick: () => {
         setIsLeaveDialogOpen(true);
       }
     }]
-  }, isLeaveDialogOpen ? React__default["default"].createElement(blocks.Dialog, {
+  }, isLeaveDialogOpen ? React.createElement(blocks.Dialog, {
     type: "warning",
     title: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.leave.dialog.title'
@@ -278,89 +222,85 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
     body: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.leave.dialog.body'
     }),
-    onHide: function onHide() {
+    onHide: () => {
       setIsLeaveDialogOpen(false);
     }
-  }, React__default["default"].createElement(blocks.Dialog.ActionButton, {
+  }, React.createElement(blocks.Dialog.ActionButton, {
     loading: isDeleting,
-    onClick: function onClick() {
+    onClick: () => {
       if (isThisChatRoomOwner) {
         setIsDeleting(true);
         apiClient.postOrgMaterialExerciseExerciseRoomDelete({
           exerciseRoomId: selectedExerciseRoomId
-        }).then(function () {
+        }).then(() => {
           goToList();
-        }).catch(console.error).finally(function () {
+        }).catch(console.error).finally(() => {
           setIsDeleting(false);
         });
       } else {
         setIsDeleting(true);
         apiClient.postOrgMaterialExerciseExerciseRoomUserDelete({
           exerciseRoomId: selectedExerciseRoomId
-        }).then(function () {
+        }).then(() => {
           goToList();
-        }).catch(console.error).finally(function () {
+        }).catch(console.error).finally(() => {
           setIsDeleting(false);
         });
       }
     }
-  }, '확인'), React__default["default"].createElement(blocks.Dialog.CloseButton, {
-    onClick: function onClick() {
+  }, '확인'), React.createElement(blocks.Dialog.CloseButton, {
+    onClick: () => {
       setIsLeaveDialogOpen(false);
     }
-  }, '취소')) : null, isThisChatRoomOwner ? React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(blocks.Label, {
+  }, '취소')) : null, isThisChatRoomOwner ? React.createElement(React.Fragment, null, React.createElement(blocks.Label, {
     role: "white",
     size: "tiny"
   }, intl.formatMessage({
     id: 'materialExerciseExerciseRoom.detail.title.label'
-  })), React__default["default"].createElement(blocks.Vspace, {
+  })), React.createElement(blocks.Vspace, {
     height: 0.5
-  }), React__default["default"].createElement(blocks.Input, {
+  }), React.createElement(blocks.Input, {
     size: "small",
     width: "full",
     value: title,
-    onChange: function onChange(e) {
-      return setTitle(e.target.value);
-    },
+    onChange: e => setTitle(e.target.value),
     placeholder: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.detail.title.placeholder'
     })
-  }), React__default["default"].createElement(blocks.Vspace, {
+  }), React.createElement(blocks.Vspace, {
     height: 1.25
-  })) : null, isThisChatRoomOwner ? React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(blocks.Label, {
+  })) : null, isThisChatRoomOwner ? React.createElement(React.Fragment, null, React.createElement(blocks.Label, {
     role: "white",
     size: "tiny"
   }, intl.formatMessage({
     id: 'materialExerciseExerciseRoom.detail.addUsers.label'
-  })), React__default["default"].createElement(blocks.Vspace, {
+  })), React.createElement(blocks.Vspace, {
     height: 0.5
-  }), React__default["default"].createElement(blocks.Input, {
+  }), React.createElement(blocks.Input, {
     prefix: icons.eilSearch,
     size: "small",
     width: "full",
     value: search,
-    onChange: function onChange(e) {
-      return setSearch(e.target.value);
-    },
+    onChange: e => setSearch(e.target.value),
     placeholder: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.detail.addUsers.placeholder'
     })
-  }), React__default["default"].createElement(blocks.Vspace, {
+  }), React.createElement(blocks.Vspace, {
     height: 1.25
-  })) : null, React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTableWrapper, null, React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTable, null, React__default["default"].createElement("colgroup", null, React__default["default"].createElement("col", {
+  })) : null, React.createElement(ExerciseRoom_styled.StyledExerciseRoomTableWrapper, null, React.createElement(ExerciseRoom_styled.StyledExerciseRoomTable, null, React.createElement("colgroup", null, React.createElement("col", {
     span: 1,
     width: "70%"
-  }), React__default["default"].createElement("col", {
+  }), React.createElement("col", {
     span: 1,
     width: "30%"
-  })), React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomThead, null, React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTr, null, React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTh, null, intl.formatMessage({
+  })), React.createElement(ExerciseRoom_styled.StyledExerciseRoomThead, null, React.createElement(ExerciseRoom_styled.StyledExerciseRoomTr, null, React.createElement(ExerciseRoom_styled.StyledExerciseRoomTh, null, intl.formatMessage({
     id: 'materialExerciseExerciseRoom.detail.table.head.users'
-  })), React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTh, null, intl.formatMessage({
+  })), React.createElement(ExerciseRoom_styled.StyledExerciseRoomTh, null, intl.formatMessage({
     id: 'materialExerciseExerciseRoom.detail.table.head.permission'
-  })))), React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTbody, null, exerciseRoomUserList.map(function (chatroomUser) {
-    var renderUserPermission = function renderUserPermission() {
+  })))), React.createElement(ExerciseRoom_styled.StyledExerciseRoomTbody, null, exerciseRoomUserList.map(chatroomUser => {
+    const renderUserPermission = () => {
       if ((user === null || user === void 0 ? void 0 : user.id) === chatroomUser.id || !isThisChatRoomOwner) {
-        return React__default["default"].createElement(blocks.Text, {
+        return React.createElement(blocks.Text, {
           bold: true,
           role: "gray0",
           size: "tiny",
@@ -371,12 +311,12 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
             marginRight: '0.5rem'
           }
         }, intl.formatMessage({
-          id: "materialExerciseExerciseRoom.exerciseRoom.publicPermission.".concat(exerciseRoomPermissionStringConvertor.exerciseRoomPermissionStringConvertor(chatroomUser.permission))
+          id: `materialExerciseExerciseRoom.exerciseRoom.publicPermission.${exerciseRoomPermissionStringConvertor.exerciseRoomPermissionStringConvertor(chatroomUser.permission)}`
         }));
       } else if (chatroomUser.permission === types.enums.ExerciseRoomPermission.Nothing) {
-        return React__default["default"].createElement(blocks.Flex, {
+        return React.createElement(blocks.Flex, {
           align: "center"
-        }, React__default["default"].createElement(blocks.Text, {
+        }, React.createElement(blocks.Text, {
           bold: true,
           role: "gray0",
           size: "tiny",
@@ -387,122 +327,76 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
             marginRight: '0.5rem'
           }
         }, intl.formatMessage({
-          id: "materialExerciseExerciseRoom.exerciseRoom.publicPermission.".concat(exerciseRoomPermissionStringConvertor.exerciseRoomPermissionStringConvertor(chatroomUser.permission))
-        })), React__default["default"].createElement(blocks.Button, {
+          id: `materialExerciseExerciseRoom.exerciseRoom.publicPermission.${exerciseRoomPermissionStringConvertor.exerciseRoomPermissionStringConvertor(chatroomUser.permission)}`
+        })), React.createElement(blocks.Button, {
           size: "micro",
           role: "lightpurple",
           loading: false,
-          onClick: function () {
-            var _onClick = _rollupPluginBabelHelpers.asyncToGenerator( /*#__PURE__*/_rollupPluginBabelHelpers.regeneratorRuntime().mark(function _callee2() {
-              return _rollupPluginBabelHelpers.regeneratorRuntime().wrap(function _callee2$(_context2) {
-                while (1) switch (_context2.prev = _context2.next) {
-                  case 0:
-                    _context2.prev = 0;
-                    _context2.next = 3;
-                    return apiClient.postOrgMaterialExerciseExerciseRoomUserEdit({
-                      exerciseRoomId: selectedExerciseRoomId,
-                      permission: types.enums.ExerciseRoomPermission.Read,
-                      userId: chatroomUser.id
-                    });
-                  case 3:
-                    if (debouncedSearch) {
-                      void doGetOrgCourseUserList();
-                    } else {
-                      void doGetOrgMaterialExerciseExerciseRoomGet();
-                    }
-                    _context2.next = 9;
-                    break;
-                  case 6:
-                    _context2.prev = 6;
-                    _context2.t0 = _context2["catch"](0);
-                    console.error(_context2.t0);
-                  case 9:
-                  case "end":
-                    return _context2.stop();
-                }
-              }, _callee2, null, [[0, 6]]);
-            }));
-            function onClick() {
-              return _onClick.apply(this, arguments);
+          onClick: async () => {
+            try {
+              await apiClient.postOrgMaterialExerciseExerciseRoomUserEdit({
+                exerciseRoomId: selectedExerciseRoomId,
+                permission: types.enums.ExerciseRoomPermission.Read,
+                userId: chatroomUser.id
+              });
+              if (debouncedSearch) {
+                void doGetOrgCourseUserList();
+              } else {
+                void doGetOrgMaterialExerciseExerciseRoomGet();
+              }
+            } catch (error) {
+              console.error(error);
             }
-            return onClick;
-          }()
+          }
         }, intl.formatMessage({
           id: 'materialExerciseExerciseRoom.detail.table.body.add'
         })));
       } else {
-        return React__default["default"].createElement(blocks.Select, {
+        return React.createElement(blocks.Select, {
           size: "small",
           width: "small",
           value: chatroomUser.permission,
-          onChange: function () {
-            var _onChange = _rollupPluginBabelHelpers.asyncToGenerator( /*#__PURE__*/_rollupPluginBabelHelpers.regeneratorRuntime().mark(function _callee3(value) {
-              var permission;
-              return _rollupPluginBabelHelpers.regeneratorRuntime().wrap(function _callee3$(_context3) {
-                while (1) switch (_context3.prev = _context3.next) {
-                  case 0:
-                    _context3.prev = 0;
-                    permission = Number(value);
-                    if (!(permission === types.enums.ExerciseRoomPermission.Nothing)) {
-                      _context3.next = 8;
-                      break;
-                    }
-                    _context3.next = 5;
-                    return apiClient.postOrgMaterialExerciseExerciseRoomUserDelete({
-                      exerciseRoomId: selectedExerciseRoomId,
-                      userId: chatroomUser.id
-                    });
-                  case 5:
-                    if (debouncedSearch) {
-                      void doGetOrgCourseUserList();
-                    } else {
-                      void doGetOrgMaterialExerciseExerciseRoomGet();
-                    }
-                    _context3.next = 11;
-                    break;
-                  case 8:
-                    _context3.next = 10;
-                    return apiClient.postOrgMaterialExerciseExerciseRoomUserEdit({
-                      exerciseRoomId: selectedExerciseRoomId,
-                      permission: permission,
-                      userId: chatroomUser.id
-                    });
-                  case 10:
-                    if (debouncedSearch) {
-                      void doGetOrgCourseUserList();
-                    } else {
-                      void doGetOrgMaterialExerciseExerciseRoomGet();
-                    }
-                  case 11:
-                    _context3.next = 16;
-                    break;
-                  case 13:
-                    _context3.prev = 13;
-                    _context3.t0 = _context3["catch"](0);
-                    console.error(_context3.t0);
-                  case 16:
-                  case "end":
-                    return _context3.stop();
+          onChange: async value => {
+            try {
+              const permission = Number(value);
+              if (permission === types.enums.ExerciseRoomPermission.Nothing) {
+                await apiClient.postOrgMaterialExerciseExerciseRoomUserDelete({
+                  exerciseRoomId: selectedExerciseRoomId,
+                  userId: chatroomUser.id
+                });
+                if (debouncedSearch) {
+                  void doGetOrgCourseUserList();
+                } else {
+                  void doGetOrgMaterialExerciseExerciseRoomGet();
                 }
-              }, _callee3, null, [[0, 13]]);
-            }));
-            function onChange(_x2) {
-              return _onChange.apply(this, arguments);
+              } else {
+                await apiClient.postOrgMaterialExerciseExerciseRoomUserEdit({
+                  exerciseRoomId: selectedExerciseRoomId,
+                  permission,
+                  userId: chatroomUser.id
+                });
+                if (debouncedSearch) {
+                  void doGetOrgCourseUserList();
+                } else {
+                  void doGetOrgMaterialExerciseExerciseRoomGet();
+                }
+              }
+            } catch (error) {
+              console.error(error);
             }
-            return onChange;
-          }(),
+          },
           disabled: !isThisChatRoomOwner
-        }, React__default["default"].createElement("option", {
+        }, React.createElement("option", {
           value: types.enums.ExerciseRoomPermission.Nothing,
           children: intl.formatMessage({
             id: 'materialExerciseExerciseRoom.exerciseRoom.publicPermission.nothing'
           })
-        }), React__default["default"].createElement("option", {
+        }), React.createElement("option", {
           value: types.enums.ExerciseRoomPermission.Read,
           children: intl.formatMessage({
             id: 'materialExerciseExerciseRoom.exerciseRoom.publicPermission.read'
           })
-        }), React__default["default"].createElement("option", {
+        }), React.createElement("option", {
           value: types.enums.ExerciseRoomPermission.ReadWrite,
           children: intl.formatMessage({
             id: 'materialExerciseExerciseRoom.exerciseRoom.publicPermission.readWrite'
@@ -510,16 +404,16 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
         }));
       }
     };
-    return React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTr, {
+    return React.createElement(ExerciseRoom_styled.StyledExerciseRoomTr, {
       key: chatroomUser.id
-    }, React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTd, null, React__default["default"].createElement(blocks.Flex, {
+    }, React.createElement(ExerciseRoom_styled.StyledExerciseRoomTd, null, React.createElement(blocks.Flex, {
       align: "center"
-    }, React__default["default"].createElement(blocks.ProfileImage, {
+    }, React.createElement(blocks.ProfileImage, {
       src: chatroomUser.profileUrl || '',
       hasBorder: false,
       width: "1.5rem",
       height: "1.5rem"
-    }), React__default["default"].createElement(blocks.Text, {
+    }), React.createElement(blocks.Text, {
       bold: true,
       size: "small",
       role: "white",
@@ -528,51 +422,51 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
       customStyles: {
         marginLeft: '0.5rem'
       }
-    }, chatroomUser.fullname))), React__default["default"].createElement(ExerciseRoom_styled.StyledExerciseRoomTd, null, renderUserPermission()));
-  })))), React__default["default"].createElement(blocks.Vspace, {
+    }, chatroomUser.fullname))), React.createElement(ExerciseRoom_styled.StyledExerciseRoomTd, null, renderUserPermission()));
+  })))), React.createElement(blocks.Vspace, {
     height: 1.25
-  }), React__default["default"].createElement(blocks.Label, {
+  }), React.createElement(blocks.Label, {
     role: "white",
     size: "tiny"
   }, intl.formatMessage({
     id: 'materialExerciseExerciseRoom.detail.sharelink.label'
-  })), React__default["default"].createElement(blocks.Vspace, {
+  })), React.createElement(blocks.Vspace, {
     height: 0.5
-  }), isThisChatRoomOwner ? React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(blocks.Select, {
+  }), isThisChatRoomOwner ? React.createElement(React.Fragment, null, React.createElement(blocks.Select, {
     size: "small",
     width: "small",
     value: (_e = exerciseRoom === null || exerciseRoom === void 0 ? void 0 : exerciseRoom.publicPermission) !== null && _e !== void 0 ? _e : types.enums.ExerciseRoomPermission.Nothing,
-    onChange: function onChange(value) {
+    onChange: value => {
       doPostOrgMaterialExerciseExerciseRoomEdit(value);
     },
     disabled: false
-  }, React__default["default"].createElement("option", {
+  }, React.createElement("option", {
     value: types.enums.ExerciseRoomPermission.Nothing,
     children: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.exerciseRoom.publicPermission.nothing'
     })
-  }), React__default["default"].createElement("option", {
+  }), React.createElement("option", {
     value: types.enums.ExerciseRoomPermission.Read,
     children: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.exerciseRoom.publicPermission.read'
     })
-  }), React__default["default"].createElement("option", {
+  }), React.createElement("option", {
     value: types.enums.ExerciseRoomPermission.ReadWrite,
     children: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.exerciseRoom.publicPermission.readWrite'
     })
-  })), React__default["default"].createElement(blocks.Vspace, {
+  })), React.createElement(blocks.Vspace, {
     height: 0.75
-  })) : null, React__default["default"].createElement(blocks.Input, {
+  })) : null, React.createElement(blocks.Input, {
     size: "small",
     width: "full",
-    suffix: React__default["default"].createElement(blocks.Button, {
+    suffix: React.createElement(blocks.Button, {
       size: "micro",
       role: "lightpurple",
       style: {
-        backgroundColor: "".concat(designTokens.base.color.red6, " !important")
+        backgroundColor: `${designTokens.base.color.red6} !important`
       },
-      onClick: function onClick() {
+      onClick: () => {
         blocks.Notification.info(intl.formatMessage({
           id: 'materialExerciseExerciseRoom.detail.copy.success'
         }));
@@ -582,13 +476,11 @@ var MaterialExerciseExerciseRoomDetail = function MaterialExerciseExerciseRoomDe
       id: 'materialExerciseExerciseRoom.detail.copy'
     })),
     value: materialExercise ? shareLink : '',
-    onChange: function onChange(e) {
-      return setSearch(e.target.value);
-    },
+    onChange: e => setSearch(e.target.value),
     placeholder: intl.formatMessage({
       id: 'materialExerciseExerciseRoom.detail.addUsers.placeholder'
     })
   }));
 };
 
-exports["default"] = MaterialExerciseExerciseRoomDetail;
+exports.default = MaterialExerciseExerciseRoomDetail;