@elice/material-runbox 1.260825.0-runboxusability.7 → 1.260825.0-runboxusability.8

package/cjs/components/material-runbox/MaterialRunboxContent.js

@@ -19,6 +19,7 @@ var MaterialRunboxHeader = require('./MaterialRunboxHeader.js');
 var MaterialRunboxContext = require('./contexts/MaterialRunboxContext.js');
 var MaterialRunboxApiContext = require('./contexts/MaterialRunboxApiContext.js');
 var MaterialRunboxCommandContext = require('./contexts/MaterialRunboxCommandContext.js');
+var MaterialRunboxControlContext = require('./contexts/MaterialRunboxControlContext.js');
 var MaterialRunboxDiskUsageAlert = require('./disk/MaterialRunboxDiskUsageAlert.js');
 var MaterialRunboxDiskUsageDialog = require('./disk/MaterialRunboxDiskUsageDialog.js');
 var useMaterialRunboxRunboxIdStarterGet = require('./hooks/useMaterialRunboxRunboxIdStarterGet.js');
@@ -277,28 +278,30 @@ var MaterialRunboxContent = function MaterialRunboxContent(_ref) {
       },
       onRunboxRefetchRequest: refetch,
       children: jsxRuntime.jsx(StyledRunboxContainer, {
-        children: jsxRuntime.jsxs(muiXSnackbar.SnackbarProvider, {
+        children: jsxRuntime.jsx(muiXSnackbar.SnackbarProvider, {
           domRoot: snackbarRoot !== null && snackbarRoot !== void 0 ? snackbarRoot : document.body,
           classes: {
             containerRoot: SNACKBAR_CONTAINER_CLASS
           },
-          children: [jsxRuntime.jsx(MaterialRunboxHeader.default, Object.assign({}, props, {
-            hideTimerPopover: hideTimerPopover
-          })), jsxRuntime.jsx(MaterialRunboxAlert.default, {
-            runbox: runbox,
-            courseId: courseId,
-            studentUserId: studentUserId,
-            userId: userId,
-            isTutoring: isTutoring
-          }), jsxRuntime.jsx(MaterialRunboxDiskUsageAlert.default, {
-            runtimeTemplateId: runtimeTemplate.id,
-            courseId: courseId,
-            userId: studentUserId
-          }), jsxRuntime.jsx(MaterialRunboxDiskUsageDialog.default, {
-            runboxId: runbox.id
-          }), jsxRuntime.jsx(MaterialRunboxBody.default, Object.assign({
-            setSnackbarRoot: setSnackbarRoot
-          }, props))]
+          children: jsxRuntime.jsxs(MaterialRunboxControlContext.default, Object.assign({}, props, {
+            children: [jsxRuntime.jsx(MaterialRunboxHeader.default, Object.assign({}, props, {
+              hideTimerPopover: hideTimerPopover
+            })), jsxRuntime.jsx(MaterialRunboxAlert.default, {
+              runbox: runbox,
+              courseId: courseId,
+              studentUserId: studentUserId,
+              userId: userId,
+              isTutoring: isTutoring
+            }), jsxRuntime.jsx(MaterialRunboxDiskUsageAlert.default, {
+              runtimeTemplateId: runtimeTemplate.id,
+              courseId: courseId,
+              userId: studentUserId
+            }), jsxRuntime.jsx(MaterialRunboxDiskUsageDialog.default, {
+              runboxId: runbox.id
+            }), jsxRuntime.jsx(MaterialRunboxBody.default, Object.assign({
+              setSnackbarRoot: setSnackbarRoot
+            }, props))]
+          }))
         })
       })
     })

package/cjs/components/material-runbox/MaterialRunboxHeader.js

@@ -23,7 +23,6 @@ var MaterialRunboxApiContext = require('./contexts/MaterialRunboxApiContext.js')
 var MaterialRunboxTimer = require('./timer/MaterialRunboxTimer.js');
 var MaterialRunboxStatusButton = require('./status/MaterialRunboxStatusButton.js');
 var useBreakpoint = require('../shared/hooks/useBreakpoint.js');
-var useRunboxControl = require('./hooks/useRunboxControl.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -71,16 +70,6 @@ var MaterialRunboxHeader = function MaterialRunboxHeader(_ref4) {
   var _useEliceRunboxRunnin = runboxClient.useEliceRunboxRunning(),
     status = _useEliceRunboxRunnin.status;
   var isRunboxRunning = status === 'running';
-  var _useRunboxControl = useRunboxControl.useRunboxControl({
-      runbox: runbox,
-      runtime: runtime,
-      courseId: courseId,
-      refetch: refetch,
-      userId: userId,
-      studentUserId: studentUserId,
-      isTutoring: isTutoring
-    }),
-    stopRuntime = _useRunboxControl.stop;
   //
   var _useQuery = reactQuery.useQuery({
       queryKey: ['getGlobalOrganizationGet', orgNameShort],
@@ -211,7 +200,6 @@ var MaterialRunboxHeader = function MaterialRunboxHeader(_ref4) {
         studentUserId: studentUserId,
         isTutoring: isTutoring,
         enableAutoShutdown: enableAutoShutdown,
-        stopRuntime: stopRuntime,
         menuAnchorEl: menuAnchorEl,
         refetch: refetch,
         handleMenuClose: handleMenuClose,
@@ -226,9 +214,7 @@ var MaterialRunboxHeader = function MaterialRunboxHeader(_ref4) {
     if (isTutoring) {
       return null;
     }
-    return jsxRuntime.jsx(MaterialRunboxActionDisconnect.default, {
-      stopRuntime: stopRuntime
-    });
+    return jsxRuntime.jsx(MaterialRunboxActionDisconnect.default, {});
   };
   //
   //
@@ -239,7 +225,6 @@ var MaterialRunboxHeader = function MaterialRunboxHeader(_ref4) {
       runboxId: runbox.id,
       userId: userId,
       headerElement: headerRef.current,
-      stopRuntime: stopRuntime,
       hideTimerPopover: hideTimerPopover,
       isTutoring: isTutoring
     }) : null, jsxRuntime.jsx(MaterialRunboxStatusButton.default, {

package/cjs/components/material-runbox/actions/MaterialRunboxActionDisconnect.d.ts

@@ -1,6 +1,3 @@
 import React from 'react';
-interface MaterialRunboxActionDisconnectProps {
-    stopRuntime: () => Promise<void>;
-}
-declare const MaterialRunboxActionDisconnect: React.FC<MaterialRunboxActionDisconnectProps>;
+declare const MaterialRunboxActionDisconnect: React.FC;
 export default MaterialRunboxActionDisconnect;

package/cjs/components/material-runbox/actions/MaterialRunboxActionDisconnect.js

@@ -12,6 +12,7 @@ var proSolidSvgIcons = require('@fortawesome/pro-solid-svg-icons');
 var material = require('@mui/material');
 var MaterialRunboxActionDisconnectDialog = require('./MaterialRunboxActionDisconnectDialog.js');
 var useBreakpoint = require('../../shared/hooks/useBreakpoint.js');
+var MaterialRunboxControlContext = require('../contexts/MaterialRunboxControlContext.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -20,14 +21,15 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 //
 //
 //
-var MaterialRunboxActionDisconnect = function MaterialRunboxActionDisconnect(_ref) {
-  var stopRuntime = _ref.stopRuntime;
+var MaterialRunboxActionDisconnect = function MaterialRunboxActionDisconnect() {
   var intl$1 = intl.useRawEliceIntl();
   var isSmallTabletOrSmaller = useBreakpoint.useBreakpoint('md', 'down');
   var isMobileOrSmaller = useBreakpoint.useBreakpoint('sm', 'down');
   var _useEliceRunboxRunnin = runboxClient.useEliceRunboxRunning(),
     status = _useEliceRunboxRunnin.status;
   var isRunboxTerminated = status === 'terminated';
+  var _useMaterialRunboxCon = MaterialRunboxControlContext.useMaterialRunboxControlContext(),
+    stopRuntime = _useMaterialRunboxCon.stop;
   var _React$useState = React__default.default.useState(false),
     _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
     isDisconnectDialogOpen = _React$useState2[0],

package/cjs/components/material-runbox/actions/MaterialRunboxActionDisconnectMenuItem.d.ts

@@ -1,6 +1,3 @@
 import React from 'react';
-interface MaterialRunboxActionDisconnectMenuItemProps {
-    stopRuntime: () => Promise<void>;
-}
-declare const MaterialRunboxActionDisconnectMenuItem: React.FC<MaterialRunboxActionDisconnectMenuItemProps>;
+declare const MaterialRunboxActionDisconnectMenuItem: React.FC;
 export default MaterialRunboxActionDisconnectMenuItem;

package/cjs/components/material-runbox/actions/MaterialRunboxActionDisconnectMenuItem.js

@@ -12,6 +12,7 @@ var proSolidSvgIcons = require('@fortawesome/pro-solid-svg-icons');
 var lab = require('@mui/lab');
 var material = require('@mui/material');
 var MaterialRunboxActionDisconnectDialog = require('./MaterialRunboxActionDisconnectDialog.js');
+var MaterialRunboxControlContext = require('../contexts/MaterialRunboxControlContext.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -20,44 +21,36 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 //
 //
 //
-var MaterialRunboxActionDisconnectMenuItem = function MaterialRunboxActionDisconnectMenuItem(_ref) {
-  var stopRuntime = _ref.stopRuntime;
+var MaterialRunboxActionDisconnectMenuItem = function MaterialRunboxActionDisconnectMenuItem() {
   var intl$1 = intl.useRawEliceIntl();
   var _useEliceRunboxRunnin = runboxClient.useEliceRunboxRunning(),
     status = _useEliceRunboxRunnin.status;
   var isRunboxTerminated = status === 'terminated';
+  var _useMaterialRunboxCon = MaterialRunboxControlContext.useMaterialRunboxControlContext(),
+    stopRuntime = _useMaterialRunboxCon.stop,
+    isStopping = _useMaterialRunboxCon.isStopping;
   var _React$useState = React__default.default.useState(false),
     _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
     isDisconnectDialogOpen = _React$useState2[0],
     setDisconnectDialogOpen = _React$useState2[1];
-  var _React$useState3 = React__default.default.useState(false),
-    _React$useState4 = _rollupPluginBabelHelpers.slicedToArray(_React$useState3, 2),
-    isStopRuntimeLoading = _React$useState4[0],
-    setStopRuntimeLoading = _React$useState4[1];
   /**
    *
    */
   var handleConfirmDisconnect = /*#__PURE__*/function () {
-    var _ref2 = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee() {
+    var _ref = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee() {
       return _rollupPluginBabelHelpers.regenerator().w(function (_context) {
-        while (1) switch (_context.p = _context.n) {
+        while (1) switch (_context.n) {
           case 0:
             setDisconnectDialogOpen(false);
-            setStopRuntimeLoading(true);
-            _context.p = 1;
-            _context.n = 2;
+            _context.n = 1;
             return stopRuntime();
-          case 2:
-            _context.p = 2;
-            setStopRuntimeLoading(false);
-            return _context.f(2);
-          case 3:
+          case 1:
             return _context.a(2);
         }
-      }, _callee, null, [[1,, 2, 3]]);
+      }, _callee);
     }));
     return function handleConfirmDisconnect() {
-      return _ref2.apply(this, arguments);
+      return _ref.apply(this, arguments);
     };
   }();
   //
@@ -65,9 +58,10 @@ var MaterialRunboxActionDisconnectMenuItem = function MaterialRunboxActionDiscon
   //
   return jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [jsxRuntime.jsxs(material.MenuItem, {
+      fullWidth: true,
       component: lab.LoadingButton,
       color: "inherit",
-      loading: isStopRuntimeLoading,
+      loading: isStopping,
       disabled: isRunboxTerminated,
       onClick: function onClick() {
         return setDisconnectDialogOpen(true);

package/cjs/components/material-runbox/actions/MaterialRunboxActionMenu.d.ts

@@ -4,7 +4,6 @@ type MaterialRunboxActionMenuProps = Pick<RuntimeProps, 'runbox' | 'runtime' | '
     menuAnchorEl: null | HTMLButtonElement;
     /** Whether the auto-shutdown toggle is available. Decided by the header. */
     enableAutoShutdown?: boolean;
-    stopRuntime: () => Promise<void>;
     handleMenuClose: () => void;
 };
 declare const MaterialRunboxActionMenu: React.FC<MaterialRunboxActionMenuProps>;

package/cjs/components/material-runbox/actions/MaterialRunboxActionMenu.js

@@ -34,7 +34,6 @@ var MaterialRunboxActionMenu = function MaterialRunboxActionMenu(_ref) {
     isTutoring = _ref.isTutoring,
     _ref$enableAutoShutdo = _ref.enableAutoShutdown,
     enableAutoShutdown = _ref$enableAutoShutdo === void 0 ? false : _ref$enableAutoShutdo,
-    stopRuntime = _ref.stopRuntime,
     menuAnchorEl = _ref.menuAnchorEl,
     refetch = _ref.refetch,
     getAchievementColor = _ref.getAchievementColor,
@@ -116,12 +115,7 @@ var MaterialRunboxActionMenu = function MaterialRunboxActionMenu(_ref) {
     }) : null, jsxRuntime.jsx(MaterialRunboxActionShare.default, {
       handleMenuClose: handleMenuClose
     }), jsxRuntime.jsx(MaterialRunboxActionRestart.default, {
-      runbox: runbox,
-      runtime: runtime,
-      courseId: courseId,
       envMode: envMode,
-      studentUserId: studentUserId,
-      refetch: refetch,
       handleMenuClose: handleMenuClose
     }), isTutoring && studentUserId ? jsxRuntime.jsx(MaterialRunboxActionSubmitLog.default, {
       runboxId: runbox === null || runbox === void 0 ? void 0 : runbox.id,
@@ -134,9 +128,7 @@ var MaterialRunboxActionMenu = function MaterialRunboxActionMenu(_ref) {
       courseId: courseId,
       envMode: envMode,
       handleMenuClose: handleMenuClose
-    }), isMobileOrSmaller && !isTutoring ? jsxRuntime.jsx(MaterialRunboxActionDisconnectMenuItem.default, {
-      stopRuntime: stopRuntime
-    }) : null]
+    }), isMobileOrSmaller && !isTutoring ? jsxRuntime.jsx(MaterialRunboxActionDisconnectMenuItem.default, {}) : null]
   });
 };
 

package/cjs/components/material-runbox/actions/MaterialRunboxActionRestart.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { enums } from '@elice/types';
-import type { RuntimeProps } from '../runtime/Runtime';
-type MaterialRunboxActionRestartProps = Pick<RuntimeProps, 'runbox' | 'runtime' | 'courseId' | 'refetch' | 'studentUserId'> & {
+type MaterialRunboxActionRestartProps = {
     envMode: enums.LeaderboardEnvModeType;
     handleMenuClose: () => void;
 };

package/cjs/components/material-runbox/actions/MaterialRunboxActionRestart.js

@@ -11,7 +11,7 @@ var types = require('@elice/types');
 var proSolidSvgIcons = require('@fortawesome/pro-solid-svg-icons');
 var lab = require('@mui/lab');
 var material = require('@mui/material');
-var useRunboxControl = require('../hooks/useRunboxControl.js');
+var MaterialRunboxControlContext = require('../contexts/MaterialRunboxControlContext.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -21,31 +21,16 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 //
 //
 var MaterialRunboxActionRestart = function MaterialRunboxActionRestart(_ref) {
-  var runbox = _ref.runbox,
-    runtime = _ref.runtime,
-    courseId = _ref.courseId,
-    refetch = _ref.refetch,
-    studentUserId = _ref.studentUserId,
-    envMode = _ref.envMode,
+  var envMode = _ref.envMode,
     handleMenuClose = _ref.handleMenuClose;
   var intl$1 = intl.useRawEliceIntl();
   var _React$useState = React__default.default.useState(false),
     _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
-    isLoading = _React$useState2[0],
-    setIsLoading = _React$useState2[1];
-  var _React$useState3 = React__default.default.useState(false),
-    _React$useState4 = _rollupPluginBabelHelpers.slicedToArray(_React$useState3, 2),
-    isDialogOpened = _React$useState4[0],
-    setDialogOpened = _React$useState4[1];
-  // restart
-  var _useRunboxControl = useRunboxControl.useRunboxControl({
-      runbox: runbox,
-      runtime: runtime,
-      courseId: courseId,
-      refetch: refetch,
-      userId: studentUserId
-    }),
-    start = _useRunboxControl.start;
+    isDialogOpened = _React$useState2[0],
+    setDialogOpened = _React$useState2[1];
+  var _useMaterialRunboxCon = MaterialRunboxControlContext.useMaterialRunboxControlContext(),
+    start = _useMaterialRunboxCon.start,
+    isStarting = _useMaterialRunboxCon.isStarting;
   /**
    *
    */
@@ -56,7 +41,6 @@ var MaterialRunboxActionRestart = function MaterialRunboxActionRestart(_ref) {
    *
    */
   var handleRestartAction = function handleRestartAction() {
-    setIsLoading(true);
     start({
       force: true
     })["catch"](function () {
@@ -64,7 +48,6 @@ var MaterialRunboxActionRestart = function MaterialRunboxActionRestart(_ref) {
     })["finally"](function () {
       handleDialogClose();
       handleMenuClose();
-      setIsLoading(false);
     });
   };
   /**
@@ -116,7 +99,7 @@ var MaterialRunboxActionRestart = function MaterialRunboxActionRestart(_ref) {
       }), jsxRuntime.jsxs(material.DialogActions, {
         children: [jsxRuntime.jsx(material.Button, {
           color: "inherit",
-          disabled: isLoading,
+          disabled: isStarting,
           onClick: handleDialogClose,
           children: intl$1.formatMessage({
             id: 'runbox.common.close'
@@ -124,7 +107,7 @@ var MaterialRunboxActionRestart = function MaterialRunboxActionRestart(_ref) {
         }), jsxRuntime.jsx(lab.LoadingButton, {
           variant: "contained",
           color: "warning",
-          loading: isLoading,
+          loading: isStarting,
           onClick: handleRestartAction,
           children: intl$1.formatMessage({
             id: 'runbox.action.restart.dialog.actions.confirm'

package/cjs/components/material-runbox/contexts/MaterialRunboxControlContext.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { UseRunboxControlProps, UseRunboxControlReturn } from '../hooks/useRunboxControl';
+export type MaterialRunboxControlContextValue = UseRunboxControlReturn;
+export interface MaterialRunboxControlContextProps extends UseRunboxControlProps {
+    children?: React.ReactNode;
+}
+export declare const MaterialRunboxControlContext: React.Context<UseRunboxControlReturn>;
+export declare const useMaterialRunboxControlContext: () => UseRunboxControlReturn;
+/**
+ * Owns the single `useRunboxControl` instance for one runbox, so every consumer
+ * shares one abort controller and one pre-check result.
+ */
+declare const MaterialRunboxControlContextProvider: React.FC<MaterialRunboxControlContextProps>;
+export default MaterialRunboxControlContextProvider;

package/cjs/components/material-runbox/contexts/MaterialRunboxControlContext.js

@@ -0,0 +1,56 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var useRunboxControl = require('../hooks/useRunboxControl.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+//
+//
+//
+var MaterialRunboxControlContext = React__default.default.createContext({});
+var useMaterialRunboxControlContext = function useMaterialRunboxControlContext() {
+  return React__default.default.useContext(MaterialRunboxControlContext);
+};
+//
+//
+//
+/**
+ * Owns the single `useRunboxControl` instance for one runbox, so every consumer
+ * shares one abort controller and one pre-check result.
+ */
+var MaterialRunboxControlContextProvider = function MaterialRunboxControlContextProvider(_a) {
+  var children = _a.children,
+    props = tslib.__rest(_a, ["children"]);
+  var _useRunboxControl = useRunboxControl.useRunboxControl(props),
+    start = _useRunboxControl.start,
+    stop = _useRunboxControl.stop,
+    isStarting = _useRunboxControl.isStarting,
+    isStopping = _useRunboxControl.isStopping,
+    preCheckStatus = _useRunboxControl.preCheckStatus;
+  // The hook hands back one mutated ref, so a stable value would leave
+  // consumers reading stale fields once anything below here is memoized.
+  var value = React__default.default.useMemo(function () {
+    return {
+      start: start,
+      stop: stop,
+      isStarting: isStarting,
+      isStopping: isStopping,
+      preCheckStatus: preCheckStatus
+    };
+  }, [start, stop, isStarting, isStopping, preCheckStatus]);
+  return jsxRuntime.jsx(MaterialRunboxControlContext.Provider, {
+    children: children,
+    value: value
+  });
+};
+
+exports.MaterialRunboxControlContext = MaterialRunboxControlContext;
+exports.default = MaterialRunboxControlContextProvider;
+exports.useMaterialRunboxControlContext = useMaterialRunboxControlContext;

package/cjs/components/material-runbox/contexts/index.d.ts

@@ -1,6 +1,8 @@
 export { default as MaterialRunboxApiContextProvider, MaterialRunboxApiContext, useMaterialRunboxApiContext, } from './MaterialRunboxApiContext';
 export { default as MaterialRunboxCommandContextProvider, MaterialRunboxCommandContext, useMaterialRunboxCommandContext, } from './MaterialRunboxCommandContext';
+export { default as MaterialRunboxControlContextProvider, MaterialRunboxControlContext, useMaterialRunboxControlContext, } from './MaterialRunboxControlContext';
 export { default as MaterialRunboxContextProvider, MaterialRunboxContext, useMaterialRunboxContext, } from './MaterialRunboxContext';
 export type { MaterialRunboxApiContextProps, MaterialRunboxApiContextValue, } from './MaterialRunboxApiContext';
 export type { MaterialRunboxCommandContextProps, MaterialRunboxCommandContextValue, } from './MaterialRunboxCommandContext';
 export type { MaterialRunboxContextProps, MaterialRunboxContextValue, } from './MaterialRunboxContext';
+export type { MaterialRunboxControlContextProps, MaterialRunboxControlContextValue, } from './MaterialRunboxControlContext';

package/cjs/components/material-runbox/contexts/index.js

@@ -2,6 +2,7 @@
 
 var MaterialRunboxApiContext = require('./MaterialRunboxApiContext.js');
 var MaterialRunboxCommandContext = require('./MaterialRunboxCommandContext.js');
+var MaterialRunboxControlContext = require('./MaterialRunboxControlContext.js');
 var MaterialRunboxContext = require('./MaterialRunboxContext.js');
 
 
@@ -12,6 +13,9 @@ exports.useMaterialRunboxApiContext = MaterialRunboxApiContext.useMaterialRunbox
 exports.MaterialRunboxCommandContext = MaterialRunboxCommandContext.MaterialRunboxCommandContext;
 exports.MaterialRunboxCommandContextProvider = MaterialRunboxCommandContext.default;
 exports.useMaterialRunboxCommandContext = MaterialRunboxCommandContext.useMaterialRunboxCommandContext;
+exports.MaterialRunboxControlContext = MaterialRunboxControlContext.MaterialRunboxControlContext;
+exports.MaterialRunboxControlContextProvider = MaterialRunboxControlContext.default;
+exports.useMaterialRunboxControlContext = MaterialRunboxControlContext.useMaterialRunboxControlContext;
 exports.MaterialRunboxContext = MaterialRunboxContext.MaterialRunboxContext;
 exports.MaterialRunboxContextProvider = MaterialRunboxContext.default;
 exports.useMaterialRunboxContext = MaterialRunboxContext.useMaterialRunboxContext;

package/cjs/components/material-runbox/disk/MaterialRunboxEnvResetButton.d.ts

@@ -4,7 +4,6 @@ export interface MaterialRunboxEnvResetButtonProps extends Omit<ButtonProps, 'on
     runtimeTemplateId: string;
     courseId: number;
     userId?: number;
-    onSuccess?: () => void;
 }
 declare const MaterialRunboxEnvResetButton: React.FC<MaterialRunboxEnvResetButtonProps>;
 export default MaterialRunboxEnvResetButton;

package/cjs/components/material-runbox/disk/MaterialRunboxEnvResetButton.js

@@ -7,9 +7,11 @@ var tslib = require('tslib');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var intl = require('@elice/intl');
+var muiXSnackbar = require('@elice/mui-x-snackbar');
 var material = require('@mui/material');
 var MaterialRunboxEnvResetDialog = require('./MaterialRunboxEnvResetDialog.js');
-var useRunboxEnvReset = require('../hooks/useRunboxEnvReset.js');
+var MaterialRunboxApiContext = require('../contexts/MaterialRunboxApiContext.js');
+var MaterialRunboxControlContext = require('../contexts/MaterialRunboxControlContext.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -22,21 +24,99 @@ var MaterialRunboxEnvResetButton = function MaterialRunboxEnvResetButton(_a) {
   var runtimeTemplateId = _a.runtimeTemplateId,
     courseId = _a.courseId,
     userId = _a.userId,
-    _onSuccess = _a.onSuccess,
-    props = tslib.__rest(_a, ["runtimeTemplateId", "courseId", "userId", "onSuccess"]);
+    props = tslib.__rest(_a, ["runtimeTemplateId", "courseId", "userId"]);
   var intl$1 = intl.useRawEliceIntl();
+  var _useSnackbar = muiXSnackbar.useSnackbar(),
+    enqueueSnackbar = _useSnackbar.enqueueSnackbar;
+  var materialRunboxApi = MaterialRunboxApiContext.useMaterialRunboxApiContext();
+  var _useMaterialRunboxCon = MaterialRunboxControlContext.useMaterialRunboxControlContext(),
+    startRuntime = _useMaterialRunboxCon.start;
   var _React$useState = React__default.default.useState(false),
     _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
     isDialogOpened = _React$useState2[0],
     setDialogOpened = _React$useState2[1];
-  var _useRunboxEnvReset = useRunboxEnvReset.useRunboxEnvReset({
-      onSuccess: function onSuccess() {
-        setDialogOpened(false);
-        _onSuccess === null || _onSuccess === void 0 ? void 0 : _onSuccess();
-      }
-    }),
-    reset = _useRunboxEnvReset.reset,
-    isResetting = _useRunboxEnvReset.isResetting;
+  var _React$useState3 = React__default.default.useState(false),
+    _React$useState4 = _rollupPluginBabelHelpers.slicedToArray(_React$useState3, 2),
+    isResetting = _React$useState4[0],
+    setResetting = _React$useState4[1];
+  /**
+   *
+   */
+  var handleConfirm = /*#__PURE__*/function () {
+    var _ref = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee() {
+      var _yield$materialRunbox, _yield$materialRunbox2, runtime;
+      return _rollupPluginBabelHelpers.regenerator().w(function (_context) {
+        while (1) switch (_context.p = _context.n) {
+          case 0:
+            setResetting(true);
+            _context.p = 1;
+            _context.n = 2;
+            return materialRunboxApi.runtime.runtimeGet({
+              filterRuntimeTemplateId: runtimeTemplateId,
+              skip: 0,
+              count: 1,
+              userId: userId,
+              eliceCourseId: courseId
+            });
+          case 2:
+            _yield$materialRunbox = _context.v;
+            _yield$materialRunbox2 = _rollupPluginBabelHelpers.slicedToArray(_yield$materialRunbox, 1);
+            runtime = _yield$materialRunbox2[0];
+            if (runtime) {
+              _context.n = 3;
+              break;
+            }
+            enqueueSnackbar(intl$1.formatMessage({
+              id: 'runbox.disk.env_reset.noti.no_runtime'
+            }), {
+              variant: 'error'
+            });
+            return _context.a(2);
+          case 3:
+            _context.n = 4;
+            return materialRunboxApi.runtime.runtimeRuntimeIdDiskResetPost({
+              runtimeId: runtime.id,
+              eliceCourseId: courseId
+            });
+          case 4:
+            setDialogOpened(false);
+            enqueueSnackbar(intl$1.formatMessage({
+              id: 'runbox.disk.env_reset.noti.success'
+            }), {
+              variant: 'success'
+            });
+            // The reset replaces the disk, which the server can only do with the
+            // runtime detached, so the session is always gone by now. Start it back
+            // up so the learner lands on the practice screen instead of a dead one.
+            _context.n = 5;
+            return startRuntime({
+              force: true,
+              runPreCheck: false
+            });
+          case 5:
+            _context.n = 7;
+            break;
+          case 6:
+            _context.p = 6;
+            _context.v;
+            enqueueSnackbar(intl$1.formatMessage({
+              id: 'runbox.disk.env_reset.noti.error'
+            }), {
+              variant: 'error'
+            });
+          case 7:
+            _context.p = 7;
+            setResetting(false);
+            return _context.f(7);
+          case 8:
+            return _context.a(2);
+        }
+      }, _callee, null, [[1, 6, 7, 8]]);
+    }));
+    return function handleConfirm() {
+      return _ref.apply(this, arguments);
+    };
+  }();
   //
   //
   //
@@ -55,11 +135,7 @@ var MaterialRunboxEnvResetButton = function MaterialRunboxEnvResetButton(_a) {
         return setDialogOpened(false);
       },
       onConfirm: function onConfirm() {
-        return void reset({
-          runtimeTemplateId: runtimeTemplateId,
-          courseId: courseId,
-          userId: userId
-        });
+        return void handleConfirm();
       }
     })]
   });

package/cjs/components/material-runbox/hooks/index.d.ts

@@ -5,4 +5,3 @@ export * from './useInfiniteRunboxRunboxIdGrade';
 export * from './useMaterialRunboxRunboxIdStarterGet';
 export * from './useRunboxNetworkStatus';
 export * from './useRunboxDiskUsage';
-export * from './useRunboxEnvReset';

package/cjs/components/material-runbox/hooks/index.js

@@ -7,7 +7,6 @@ var useInfiniteRunboxRunboxIdGrade = require('./useInfiniteRunboxRunboxIdGrade.j
 var useMaterialRunboxRunboxIdStarterGet = require('./useMaterialRunboxRunboxIdStarterGet.js');
 var useRunboxNetworkStatus = require('./useRunboxNetworkStatus.js');
 var useRunboxDiskUsage = require('./useRunboxDiskUsage.js');
-var useRunboxEnvReset = require('./useRunboxEnvReset.js');
 
 
 
@@ -30,4 +29,3 @@ exports.useRunboxNetworkStatus = useRunboxNetworkStatus.useRunboxNetworkStatus;
 exports.DISK_USAGE_ERROR_RATIO = useRunboxDiskUsage.DISK_USAGE_ERROR_RATIO;
 exports.DISK_USAGE_WARNING_RATIO = useRunboxDiskUsage.DISK_USAGE_WARNING_RATIO;
 exports.useRunboxDiskUsage = useRunboxDiskUsage.useRunboxDiskUsage;
-exports.useRunboxEnvReset = useRunboxEnvReset.useRunboxEnvReset;

package/cjs/components/material-runbox/hooks/useRunboxControl.d.ts

@@ -10,17 +10,18 @@ export type RunboxPreCheckResult = {
     type: RunboxPreCheckResultType.RuntimeRunningOnOtherRunbox;
     runningRunbox: RunningRunbox;
 };
-type UseRunboxControlProps = Pick<RuntimeProps, 'runbox' | 'runtime' | 'courseId' | 'refetch' | 'userId' | 'studentUserId' | 'isTutoring'>;
-interface UseRunboxControlReturn {
+export type UseRunboxControlProps = Pick<RuntimeProps, 'runbox' | 'runtime' | 'courseId' | 'refetch' | 'userId' | 'studentUserId' | 'isTutoring'>;
+export interface UseRunboxControlReturn {
     start: (args?: {
         force?: boolean;
         runPreCheck?: boolean;
     }) => Promise<void>;
     stop: () => Promise<void>;
+    isStarting: boolean;
+    isStopping: boolean;
     preCheckStatus: RunboxPreCheckResult | null;
 }
 /**
  * Hook for runbox control and status.
  */
 export declare const useRunboxControl: (props: UseRunboxControlProps) => UseRunboxControlReturn;
-export {};