@elice/material-runbox 1.260825.0-runboxusability.2 → 1.260825.0-runboxusability.4

package/cjs/_virtual/_rollupPluginBabelHelpers.js

@@ -8,6 +8,9 @@ function _arrayLikeToArray(r, a) {
 function _arrayWithHoles(r) {
   if (Array.isArray(r)) return r;
 }
+function _arrayWithoutHoles(r) {
+  if (Array.isArray(r)) return _arrayLikeToArray(r);
+}
 function asyncGeneratorStep(n, t, e, r, o, a, c) {
   try {
     var i = n[a](c),
@@ -41,6 +44,9 @@ function _defineProperty(e, r, t) {
     writable: true
   }) : e[r] = t, e;
 }
+function _iterableToArray(r) {
+  if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
+}
 function _iterableToArrayLimit(r, l) {
   var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
   if (null != t) {
@@ -71,6 +77,9 @@ function _iterableToArrayLimit(r, l) {
 function _nonIterableRest() {
   throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
 function _regenerator() {
   /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
   var e,
@@ -189,6 +198,9 @@ function _taggedTemplateLiteral(e, t) {
     }
   }));
 }
+function _toConsumableArray(r) {
+  return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
+}
 function _toPrimitive(t, r) {
   if ("object" != typeof t || !t) return t;
   var e = t[Symbol.toPrimitive];
@@ -213,14 +225,18 @@ function _unsupportedIterableToArray(r, a) {
 
 exports.arrayLikeToArray = _arrayLikeToArray;
 exports.arrayWithHoles = _arrayWithHoles;
+exports.arrayWithoutHoles = _arrayWithoutHoles;
 exports.asyncToGenerator = _asyncToGenerator;
 exports.defineProperty = _defineProperty;
+exports.iterableToArray = _iterableToArray;
 exports.iterableToArrayLimit = _iterableToArrayLimit;
 exports.nonIterableRest = _nonIterableRest;
+exports.nonIterableSpread = _nonIterableSpread;
 exports.regenerator = _regenerator;
 exports.regeneratorDefine = _regeneratorDefine;
 exports.slicedToArray = _slicedToArray;
 exports.taggedTemplateLiteral = _taggedTemplateLiteral;
+exports.toConsumableArray = _toConsumableArray;
 exports.toPrimitive = _toPrimitive;
 exports.toPropertyKey = _toPropertyKey;
 exports.unsupportedIterableToArray = _unsupportedIterableToArray;

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

@@ -19,6 +19,8 @@ var MaterialRunboxHeader = require('./MaterialRunboxHeader.js');
 var MaterialRunboxContext = require('./contexts/MaterialRunboxContext.js');
 var MaterialRunboxApiContext = require('./contexts/MaterialRunboxApiContext.js');
 var MaterialRunboxCommandContext = require('./contexts/MaterialRunboxCommandContext.js');
+var MaterialRunboxDiskUsageAlert = require('./disk/MaterialRunboxDiskUsageAlert.js');
+var MaterialRunboxDiskUsageDialog = require('./disk/MaterialRunboxDiskUsageDialog.js');
 var useMaterialRunboxRunboxIdStarterGet = require('./hooks/useMaterialRunboxRunboxIdStarterGet.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -288,6 +290,12 @@ var MaterialRunboxContent = function MaterialRunboxContent(_ref) {
             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

@@ -22,7 +22,6 @@ var MaterialRunboxContext = require('./contexts/MaterialRunboxContext.js');
 var MaterialRunboxApiContext = require('./contexts/MaterialRunboxApiContext.js');
 var MaterialRunboxTimer = require('./timer/MaterialRunboxTimer.js');
 var MaterialRunboxStatusButton = require('./status/MaterialRunboxStatusButton.js');
-var MaterialRunboxDiskAlmostFullSnackbar = require('./disk/MaterialRunboxDiskAlmostFullSnackbar.js');
 var useRunboxControl = require('./hooks/useRunboxControl.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -35,25 +34,28 @@ var StyledHeader = /*#__PURE__*/_styled__default.default("div", {
 })("position:relative;flex:0 0 3rem;display:flex;justify-content:flex-start;align-items:center;gap:1rem;padding:0 1rem;width:100%;border-bottom:1px solid ", function (_ref) {
   var theme = _ref.theme;
   return theme.palette.divider;
-}, ";overflow:hidden;background-color:", function (_ref2) {
+}, ";overflow:hidden;color:", function (_ref2) {
   var theme = _ref2.theme;
+  return theme.palette.text.primary;
+}, ";background-color:", function (_ref3) {
+  var theme = _ref3.theme;
   return theme.palette.background.paper;
 }, ";");
 //
 //
 //
-var MaterialRunboxHeader = function MaterialRunboxHeader(_ref3) {
-  var runbox = _ref3.runbox,
-    runtime = _ref3.runtime,
-    runtimeTemplate = _ref3.runtimeTemplate,
-    courseId = _ref3.courseId,
-    userId = _ref3.userId,
-    studentUserId = _ref3.studentUserId,
-    isTutoring = _ref3.isTutoring,
-    refetch = _ref3.refetch,
-    getAchievementColor = _ref3.getAchievementColor,
-    _ref3$hideTimerPopove = _ref3.hideTimerPopover,
-    hideTimerPopover = _ref3$hideTimerPopove === void 0 ? false : _ref3$hideTimerPopove;
+var MaterialRunboxHeader = function MaterialRunboxHeader(_ref4) {
+  var runbox = _ref4.runbox,
+    runtime = _ref4.runtime,
+    runtimeTemplate = _ref4.runtimeTemplate,
+    courseId = _ref4.courseId,
+    userId = _ref4.userId,
+    studentUserId = _ref4.studentUserId,
+    isTutoring = _ref4.isTutoring,
+    refetch = _ref4.refetch,
+    getAchievementColor = _ref4.getAchievementColor,
+    _ref4$hideTimerPopove = _ref4.hideTimerPopover,
+    hideTimerPopover = _ref4$hideTimerPopove === void 0 ? false : _ref4$hideTimerPopove;
   var intl$1 = intl.useRawEliceIntl();
   var _useMaterialRunboxCon = MaterialRunboxContext.useMaterialRunboxContext(),
     enableAutoShutdownToggle = _useMaterialRunboxCon.enableAutoShutdownToggle;
@@ -104,8 +106,8 @@ var MaterialRunboxHeader = function MaterialRunboxHeader(_ref3) {
         courseId: courseId,
         runtime: runtime
       }],
-      queryFn: function queryFn(_ref4) {
-        var signal = _ref4.signal;
+      queryFn: function queryFn(_ref5) {
+        var signal = _ref5.signal;
         return materialRunboxApi.runbox.runboxRunboxIdSubmitInfoGet({
           eliceCourseId: courseId,
           runboxId: runtime === null || runtime === void 0 ? void 0 : runtime.runboxId
@@ -226,8 +228,10 @@ var MaterialRunboxHeader = function MaterialRunboxHeader(_ref3) {
       stopRuntime: stopRuntime,
       hideTimerPopover: hideTimerPopover,
       isTutoring: isTutoring
-    }) : null, jsxRuntime.jsx(MaterialRunboxStatusButton.default, {}), jsxRuntime.jsx(MaterialRunboxDiskAlmostFullSnackbar.default, {
-      runboxId: runbox.id
+    }) : null, jsxRuntime.jsx(MaterialRunboxStatusButton.default, {
+      runtimeTemplateId: runtimeTemplate.id,
+      courseId: courseId,
+      userId: studentUserId
     }), jsxRuntime.jsxs(material.Stack, {
       direction: "row",
       alignItems: "center",

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

@@ -0,0 +1,13 @@
+import type React from 'react';
+export interface MaterialRunboxDiskUsageAlertProps {
+    runtimeTemplateId: string;
+    courseId: number;
+    /** User ID for tutoring. */
+    userId?: number;
+}
+/**
+ * Persistent bar under the header once disk usage passes 80%. Unlike the notice
+ * dialog it stays put, because it carries the only way out — the reset CTA.
+ */
+declare const MaterialRunboxDiskUsageAlert: React.FC<MaterialRunboxDiskUsageAlertProps>;
+export default MaterialRunboxDiskUsageAlert;

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

@@ -0,0 +1,71 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var intl = require('@elice/intl');
+var muiElements = require('@elice/mui-elements');
+var proSolidSvgIcons = require('@fortawesome/pro-solid-svg-icons');
+var material = require('@mui/material');
+var MaterialRunboxEnvResetButton = require('./MaterialRunboxEnvResetButton.js');
+var useRunboxDiskUsage = require('../hooks/useRunboxDiskUsage.js');
+
+//
+//
+//
+/**
+ * Persistent bar under the header once disk usage passes 80%. Unlike the notice
+ * dialog it stays put, because it carries the only way out — the reset CTA.
+ */
+var MaterialRunboxDiskUsageAlert = function MaterialRunboxDiskUsageAlert(_ref) {
+  var runtimeTemplateId = _ref.runtimeTemplateId,
+    courseId = _ref.courseId,
+    userId = _ref.userId;
+  var intl$1 = intl.useRawEliceIntl();
+  var _useRunboxDiskUsage = useRunboxDiskUsage.useRunboxDiskUsage(),
+    severity = _useRunboxDiskUsage.severity,
+    diskCurrent = _useRunboxDiskUsage.diskCurrent,
+    diskTotal = _useRunboxDiskUsage.diskTotal;
+  if (!severity) {
+    return null;
+  }
+  //
+  //
+  //
+  return jsxRuntime.jsx(material.Alert, {
+    severity: severity,
+    sx: {
+      width: '100%',
+      borderRadius: '0',
+      alignItems: 'center'
+    },
+    action: jsxRuntime.jsx(MaterialRunboxEnvResetButton.default, {
+      variant: "text",
+      size: "small",
+      color: "inherit",
+      startIcon: jsxRuntime.jsx(muiElements.EliceIcon, {
+        icon: proSolidSvgIcons.faArrowsRotate
+      }),
+      runtimeTemplateId: runtimeTemplateId,
+      courseId: courseId,
+      userId: userId
+    }),
+    children: jsxRuntime.jsx(material.Typography, {
+      variant: "body2",
+      children: intl$1.formatMessage({
+        id: "runbox.disk.usage.alert.".concat(severity)
+      }, {
+        used: intl$1.formatDataSize(diskCurrent, {
+          unitSystem: 'iec',
+          maximumFractionDigits: 2
+        }),
+        total: intl$1.formatDataSize(diskTotal, {
+          unitSystem: 'iec',
+          maximumFractionDigits: 2
+        })
+      })
+    })
+  });
+};
+
+exports.default = MaterialRunboxDiskUsageAlert;

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

@@ -0,0 +1,10 @@
+import type React from 'react';
+export interface MaterialRunboxDiskUsageDialogProps {
+    runboxId: string;
+}
+/**
+ * Notice shown once per severity per runbox for the browser session. The reset
+ * CTA lives in the alert bar, so this only has to be acknowledged.
+ */
+declare const MaterialRunboxDiskUsageDialog: React.FC<MaterialRunboxDiskUsageDialogProps>;
+export default MaterialRunboxDiskUsageDialog;

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

@@ -0,0 +1,98 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var jsxRuntime = require('react/jsx-runtime');
+var reactUse = require('react-use');
+var intl = require('@elice/intl');
+var muiElements = require('@elice/mui-elements');
+var proSolidSvgIcons = require('@fortawesome/pro-solid-svg-icons');
+var material = require('@mui/material');
+var useRunboxDiskUsage = require('../hooks/useRunboxDiskUsage.js');
+
+//
+//
+//
+var SEEN_STORAGE_KEY = 'MaterialRunboxDiskUsage.seenNotice';
+//
+//
+//
+/**
+ * Notice shown once per severity per runbox for the browser session. The reset
+ * CTA lives in the alert bar, so this only has to be acknowledged.
+ */
+var MaterialRunboxDiskUsageDialog = function MaterialRunboxDiskUsageDialog(_ref) {
+  var runboxId = _ref.runboxId;
+  var _a;
+  var intl$1 = intl.useRawEliceIntl();
+  var _useRunboxDiskUsage = useRunboxDiskUsage.useRunboxDiskUsage(),
+    severity = _useRunboxDiskUsage.severity,
+    diskCurrent = _useRunboxDiskUsage.diskCurrent,
+    diskTotal = _useRunboxDiskUsage.diskTotal;
+  var _useSessionStorage = reactUse.useSessionStorage(SEEN_STORAGE_KEY, {}),
+    _useSessionStorage2 = _rollupPluginBabelHelpers.slicedToArray(_useSessionStorage, 2),
+    seen = _useSessionStorage2[0],
+    setSeen = _useSessionStorage2[1];
+  var seenSeverities = (_a = seen === null || seen === void 0 ? void 0 : seen[runboxId]) !== null && _a !== void 0 ? _a : [];
+  /**
+   *
+   */
+  var handleClose = function handleClose() {
+    if (!severity) {
+      return;
+    }
+    setSeen(Object.assign(Object.assign({}, seen), _rollupPluginBabelHelpers.defineProperty({}, runboxId, [].concat(_rollupPluginBabelHelpers.toConsumableArray(seenSeverities), [severity]))));
+  };
+  //
+  //
+  //
+  if (!severity) {
+    return null;
+  }
+  return jsxRuntime.jsxs(material.Dialog, {
+    fullWidth: true,
+    open: !seenSeverities.includes(severity),
+    maxWidth: "xs",
+    onClose: handleClose,
+    children: [jsxRuntime.jsx(material.DialogTitle, {
+      children: jsxRuntime.jsxs(material.Stack, {
+        direction: "row",
+        alignItems: "center",
+        gap: "0.5rem",
+        children: [jsxRuntime.jsx(muiElements.EliceIcon, {
+          icon: severity === 'error' ? proSolidSvgIcons.faCircleExclamation : proSolidSvgIcons.faTriangleExclamation,
+          color: severity
+        }), intl$1.formatMessage({
+          id: 'runbox.disk.usage.dialog.title'
+        })]
+      })
+    }), jsxRuntime.jsx(material.DialogContent, {
+      children: jsxRuntime.jsx(material.DialogContentText, {
+        whiteSpace: "pre-line",
+        children: intl$1.formatMessage({
+          id: "runbox.disk.usage.dialog.description.".concat(severity)
+        }, {
+          used: intl$1.formatDataSize(diskCurrent, {
+            unitSystem: 'iec',
+            maximumFractionDigits: 2
+          }),
+          total: intl$1.formatDataSize(diskTotal, {
+            unitSystem: 'iec',
+            maximumFractionDigits: 2
+          })
+        })
+      })
+    }), jsxRuntime.jsx(material.DialogActions, {
+      children: jsxRuntime.jsx(material.Button, {
+        color: "inherit",
+        onClick: handleClose,
+        children: intl$1.formatMessage({
+          id: 'runbox.disk.usage.dialog.actions.close'
+        })
+      })
+    })]
+  });
+};
+
+exports.default = MaterialRunboxDiskUsageDialog;

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

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { ButtonProps } from '@mui/material';
+export interface MaterialRunboxEnvResetButtonProps extends Omit<ButtonProps, 'onClick'> {
+    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

@@ -0,0 +1,68 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var intl = require('@elice/intl');
+var material = require('@mui/material');
+var MaterialRunboxEnvResetDialog = require('./MaterialRunboxEnvResetDialog.js');
+var useRunboxEnvReset = require('../hooks/useRunboxEnvReset.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+//
+//
+//
+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"]);
+  var intl$1 = intl.useRawEliceIntl();
+  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;
+  //
+  //
+  //
+  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [jsxRuntime.jsx(material.Button, Object.assign({}, props, {
+      onClick: function onClick() {
+        return setDialogOpened(true);
+      },
+      children: intl$1.formatMessage({
+        id: 'runbox.disk.env_reset.title'
+      })
+    })), jsxRuntime.jsx(MaterialRunboxEnvResetDialog.default, {
+      open: isDialogOpened,
+      isResetting: isResetting,
+      onClose: function onClose() {
+        return setDialogOpened(false);
+      },
+      onConfirm: function onConfirm() {
+        return void reset({
+          runtimeTemplateId: runtimeTemplateId,
+          courseId: courseId,
+          userId: userId
+        });
+      }
+    })]
+  });
+};
+
+exports.default = MaterialRunboxEnvResetButton;

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

@@ -0,0 +1,14 @@
+import React from 'react';
+export interface MaterialRunboxEnvResetDialogProps {
+    open: boolean;
+    isResetting?: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+}
+/**
+ * Confirms clearing the practice environment. The checkbox is the explicit
+ * acknowledgement `[R-3]` asks for: the delete action stays disabled until it
+ * is ticked.
+ */
+declare const MaterialRunboxEnvResetDialog: React.FC<MaterialRunboxEnvResetDialogProps>;
+export default MaterialRunboxEnvResetDialog;

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

@@ -0,0 +1,103 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var intl = require('@elice/intl');
+var muiElements = require('@elice/mui-elements');
+var proSolidSvgIcons = require('@fortawesome/pro-solid-svg-icons');
+var lab = require('@mui/lab');
+var material = require('@mui/material');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+//
+//
+//
+/**
+ * Confirms clearing the practice environment. The checkbox is the explicit
+ * acknowledgement `[R-3]` asks for: the delete action stays disabled until it
+ * is ticked.
+ */
+var MaterialRunboxEnvResetDialog = function MaterialRunboxEnvResetDialog(_ref) {
+  var open = _ref.open,
+    _ref$isResetting = _ref.isResetting,
+    isResetting = _ref$isResetting === void 0 ? false : _ref$isResetting,
+    onClose = _ref.onClose,
+    onConfirm = _ref.onConfirm;
+  var intl$1 = intl.useRawEliceIntl();
+  var _React$useState = React__default.default.useState(false),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    isAcknowledged = _React$useState2[0],
+    setAcknowledged = _React$useState2[1];
+  React__default.default.useEffect(function () {
+    if (!open) {
+      setAcknowledged(false);
+    }
+  }, [open]);
+  //
+  //
+  //
+  return jsxRuntime.jsxs(material.Dialog, {
+    fullWidth: true,
+    open: open,
+    maxWidth: "xs",
+    onClose: onClose,
+    children: [jsxRuntime.jsx(material.DialogTitle, {
+      children: jsxRuntime.jsxs(material.Stack, {
+        direction: "row",
+        alignItems: "center",
+        gap: "0.5rem",
+        children: [jsxRuntime.jsx(muiElements.EliceIcon, {
+          icon: proSolidSvgIcons.faCircleExclamation,
+          color: "error"
+        }), intl$1.formatMessage({
+          id: 'runbox.disk.env_reset.dialog.title'
+        })]
+      })
+    }), jsxRuntime.jsxs(material.DialogContent, {
+      children: [jsxRuntime.jsx(material.DialogContentText, {
+        whiteSpace: "pre-line",
+        children: intl$1.formatMessage({
+          id: 'runbox.disk.env_reset.dialog.description'
+        })
+      }), jsxRuntime.jsx(material.FormControlLabel, {
+        sx: {
+          marginTop: '1rem'
+        },
+        control: jsxRuntime.jsx(material.Checkbox, {
+          checked: isAcknowledged,
+          onChange: function onChange(e) {
+            return setAcknowledged(e.target.checked);
+          }
+        }),
+        label: intl$1.formatMessage({
+          id: 'runbox.disk.env_reset.dialog.acknowledge'
+        })
+      })]
+    }), jsxRuntime.jsxs(material.DialogActions, {
+      children: [jsxRuntime.jsx(material.Button, {
+        color: "inherit",
+        disabled: isResetting,
+        onClick: onClose,
+        children: intl$1.formatMessage({
+          id: 'runbox.disk.env_reset.dialog.actions.cancel'
+        })
+      }), jsxRuntime.jsx(lab.LoadingButton, {
+        color: "error",
+        loading: isResetting,
+        disabled: !isAcknowledged,
+        onClick: onConfirm,
+        children: intl$1.formatMessage({
+          id: 'runbox.disk.env_reset.dialog.actions.confirm'
+        })
+      })]
+    })]
+  });
+};
+
+exports.default = MaterialRunboxEnvResetDialog;

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

@@ -1 +1,8 @@
-export { default as MaterialRunboxDiskAlmostFullSnackbar } from './MaterialRunboxDiskAlmostFullSnackbar';
+export { default as MaterialRunboxDiskUsageAlert } from './MaterialRunboxDiskUsageAlert';
+export { default as MaterialRunboxDiskUsageDialog } from './MaterialRunboxDiskUsageDialog';
+export { default as MaterialRunboxEnvResetButton } from './MaterialRunboxEnvResetButton';
+export { default as MaterialRunboxEnvResetDialog } from './MaterialRunboxEnvResetDialog';
+export type { MaterialRunboxDiskUsageAlertProps } from './MaterialRunboxDiskUsageAlert';
+export type { MaterialRunboxDiskUsageDialogProps } from './MaterialRunboxDiskUsageDialog';
+export type { MaterialRunboxEnvResetButtonProps } from './MaterialRunboxEnvResetButton';
+export type { MaterialRunboxEnvResetDialogProps } from './MaterialRunboxEnvResetDialog';

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

@@ -1,7 +1,13 @@
 'use strict';
 
-var MaterialRunboxDiskAlmostFullSnackbar = require('./MaterialRunboxDiskAlmostFullSnackbar.js');
+var MaterialRunboxDiskUsageAlert = require('./MaterialRunboxDiskUsageAlert.js');
+var MaterialRunboxDiskUsageDialog = require('./MaterialRunboxDiskUsageDialog.js');
+var MaterialRunboxEnvResetButton = require('./MaterialRunboxEnvResetButton.js');
+var MaterialRunboxEnvResetDialog = require('./MaterialRunboxEnvResetDialog.js');
 
 
 
-exports.MaterialRunboxDiskAlmostFullSnackbar = MaterialRunboxDiskAlmostFullSnackbar.default;
+exports.MaterialRunboxDiskUsageAlert = MaterialRunboxDiskUsageAlert.default;
+exports.MaterialRunboxDiskUsageDialog = MaterialRunboxDiskUsageDialog.default;
+exports.MaterialRunboxEnvResetButton = MaterialRunboxEnvResetButton.default;
+exports.MaterialRunboxEnvResetDialog = MaterialRunboxEnvResetDialog.default;

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

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

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

@@ -6,6 +6,8 @@ var useRunboxTimer = require('./useRunboxTimer.js');
 var useInfiniteRunboxRunboxIdGrade = require('./useInfiniteRunboxRunboxIdGrade.js');
 var useMaterialRunboxRunboxIdStarterGet = require('./useMaterialRunboxRunboxIdStarterGet.js');
 var useRunboxNetworkStatus = require('./useRunboxNetworkStatus.js');
+var useRunboxDiskUsage = require('./useRunboxDiskUsage.js');
+var useRunboxEnvReset = require('./useRunboxEnvReset.js');
 
 
 
@@ -25,3 +27,7 @@ Object.defineProperty(exports, "RunboxNetworkStatus", {
 	get: function () { return useRunboxNetworkStatus.RunboxNetworkStatus; }
 });
 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/useRunboxDiskUsage.d.ts

@@ -0,0 +1,16 @@
+/** Matches MUI's `Alert` severity, which is where this value ends up. */
+export type RunboxDiskUsageSeverity = 'warning' | 'error';
+interface UseRunboxDiskUsageReturn {
+    /** `null` below the first threshold, or while the container reports no stats. */
+    severity: RunboxDiskUsageSeverity | null;
+    diskCurrent: number;
+    diskTotal: number;
+}
+export declare const DISK_USAGE_WARNING_RATIO = 0.8;
+export declare const DISK_USAGE_ERROR_RATIO = 0.9;
+/**
+ * Disk usage against the 80% / 90% thresholds. The numbers come from the
+ * container stats stream, so they are only available while the runtime is up.
+ */
+export declare const useRunboxDiskUsage: () => UseRunboxDiskUsageReturn;
+export {};

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

@@ -0,0 +1,50 @@
+'use strict';
+
+var React = require('react');
+var runboxClient = require('@elice/runbox-client');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+//
+//
+//
+var DISK_USAGE_WARNING_RATIO = 0.8;
+var DISK_USAGE_ERROR_RATIO = 0.9;
+//
+//
+//
+/**
+ * Disk usage against the 80% / 90% thresholds. The numbers come from the
+ * container stats stream, so they are only available while the runtime is up.
+ */
+var useRunboxDiskUsage = function useRunboxDiskUsage() {
+  var _a, _b;
+  var contStats = runboxClient.useEliceRunboxContainerStats();
+  var stats = contStats ? contStats[contStats.length - 1] : null;
+  var diskCurrent = (_a = stats === null || stats === void 0 ? void 0 : stats.diskCurrent) !== null && _a !== void 0 ? _a : 0;
+  var diskTotal = (_b = stats === null || stats === void 0 ? void 0 : stats.diskTotal) !== null && _b !== void 0 ? _b : 0;
+  var severity = React__default.default.useMemo(function () {
+    if (!stats || diskTotal <= 0) {
+      return null;
+    }
+    var ratio = diskCurrent / diskTotal;
+    if (ratio >= DISK_USAGE_ERROR_RATIO) {
+      return 'error';
+    }
+    if (ratio >= DISK_USAGE_WARNING_RATIO) {
+      return 'warning';
+    }
+    return null;
+  }, [stats, diskCurrent, diskTotal]);
+  return {
+    severity: severity,
+    diskCurrent: diskCurrent,
+    diskTotal: diskTotal
+  };
+};
+
+exports.DISK_USAGE_ERROR_RATIO = DISK_USAGE_ERROR_RATIO;
+exports.DISK_USAGE_WARNING_RATIO = DISK_USAGE_WARNING_RATIO;
+exports.useRunboxDiskUsage = useRunboxDiskUsage;