@elice/material-exercise 1.260514.0 → 1.260515.0

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoConnectionPreflightDialog.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { DialogProps } from '@mui/material';
+import type { ArduinoConnectionIntent } from './_context';
+interface ArduinoConnectionPreflightDialogProps extends DialogProps {
+    intent: ArduinoConnectionIntent;
+    onConfirm: () => void;
+    onSaveDontShowAgain?: () => void;
+}
+declare const ArduinoConnectionPreflightDialog: React.FC<ArduinoConnectionPreflightDialogProps>;
+export default ArduinoConnectionPreflightDialog;

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoConnectionPreflightDialog.js

@@ -0,0 +1,213 @@
+'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 ArrowUpwardIcon = require('@mui/icons-material/ArrowUpward');
+var Alert = require('@mui/material/Alert');
+var Button = require('@mui/material/Button');
+var Checkbox = require('@mui/material/Checkbox');
+var Dialog = require('@mui/material/Dialog');
+var DialogActions = require('@mui/material/DialogActions');
+var DialogContent = require('@mui/material/DialogContent');
+var DialogTitle = require('@mui/material/DialogTitle');
+var FormControlLabel = require('@mui/material/FormControlLabel');
+var Stack = require('@mui/material/Stack');
+var Typography = require('@mui/material/Typography');
+var ArduinoConnectionPreflightDialogNativeMock = require('./ArduinoConnectionPreflightDialogNativeMock.js');
+var ArduinoConnectionPreflightDialogSteps = require('./ArduinoConnectionPreflightDialogSteps.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var ArrowUpwardIcon__default = /*#__PURE__*/_interopDefaultCompat(ArrowUpwardIcon);
+var Alert__default = /*#__PURE__*/_interopDefaultCompat(Alert);
+var Button__default = /*#__PURE__*/_interopDefaultCompat(Button);
+var Checkbox__default = /*#__PURE__*/_interopDefaultCompat(Checkbox);
+var Dialog__default = /*#__PURE__*/_interopDefaultCompat(Dialog);
+var DialogActions__default = /*#__PURE__*/_interopDefaultCompat(DialogActions);
+var DialogContent__default = /*#__PURE__*/_interopDefaultCompat(DialogContent);
+var DialogTitle__default = /*#__PURE__*/_interopDefaultCompat(DialogTitle);
+var FormControlLabel__default = /*#__PURE__*/_interopDefaultCompat(FormControlLabel);
+var Stack__default = /*#__PURE__*/_interopDefaultCompat(Stack);
+var Typography__default = /*#__PURE__*/_interopDefaultCompat(Typography);
+
+//
+//
+//
+var ArduinoConnectionPreflightDialog = function ArduinoConnectionPreflightDialog(_ref) {
+  var open = _ref.open,
+    intent = _ref.intent,
+    onConfirm = _ref.onConfirm,
+    onSaveDontShowAgain = _ref.onSaveDontShowAgain,
+    onClose = _ref.onClose,
+    onTransitionExited = _ref.onTransitionExited;
+  var intl$1 = intl.useRawEliceIntl();
+  var _React$useState = React__default.default.useState(false),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    dontShowAgain = _React$useState2[0],
+    setDontShowAgain = _React$useState2[1];
+  var isUpload = intent === 'upload';
+  /**
+   *
+   */
+  var handleCancelClick = function handleCancelClick(e) {
+    onClose === null || onClose === void 0 ? void 0 : onClose(e, 'escapeKeyDown');
+  };
+  /**
+   *
+   */
+  var handleConfirmClick = function handleConfirmClick() {
+    if (dontShowAgain) {
+      onSaveDontShowAgain === null || onSaveDontShowAgain === void 0 ? void 0 : onSaveDontShowAgain();
+    }
+    onConfirm();
+  };
+  /**
+   *
+   */
+  var renderTitle = function renderTitle() {
+    return intl$1.formatMessage({
+      id: isUpload ? 'exerciseRunner.arduino.preflight.title.upload' : 'exerciseRunner.arduino.preflight.title.connect'
+    });
+  };
+  /**
+   *
+   */
+  var renderUploadNotice = function renderUploadNotice() {
+    if (!isUpload) {
+      return null;
+    }
+    return jsxRuntime.jsx(Alert__default.default, {
+      severity: "info",
+      children: intl$1.formatMessage({
+        id: 'exerciseRunner.arduino.preflight.upload.note'
+      })
+    });
+  };
+  /**
+   *
+   */
+  var renderPreview = function renderPreview() {
+    return jsxRuntime.jsxs(Stack__default.default, {
+      alignItems: "center",
+      spacing: 1.25,
+      sx: {
+        bgcolor: function bgcolor(theme) {
+          return theme.palette.background.paper;
+        },
+        border: function border(theme) {
+          return "1px solid ".concat(theme.palette.divider);
+        },
+        borderRadius: '10px',
+        p: '14px'
+      },
+      children: [jsxRuntime.jsxs(Stack__default.default, {
+        direction: "row",
+        spacing: 0.75,
+        alignItems: "center",
+        children: [jsxRuntime.jsx(ArrowUpwardIcon__default.default, {
+          sx: {
+            fontSize: 11
+          }
+        }), jsxRuntime.jsx(Typography__default.default, {
+          color: "primary.main",
+          sx: {
+            fontSize: 12,
+            fontWeight: 700,
+            letterSpacing: '-.01em'
+          },
+          children: intl$1.formatMessage({
+            id: 'exerciseRunner.arduino.preflight.preview.label'
+          })
+        })]
+      }), jsxRuntime.jsx(ArduinoConnectionPreflightDialogNativeMock.default, {})]
+    });
+  };
+  /**
+   *
+   */
+  var renderActionsDontShowAgain = function renderActionsDontShowAgain() {
+    return jsxRuntime.jsx(FormControlLabel__default.default, {
+      control: jsxRuntime.jsx(Checkbox__default.default, {
+        size: "small",
+        checked: dontShowAgain,
+        onChange: function onChange(e) {
+          return setDontShowAgain(e.target.checked);
+        }
+      }),
+      label: intl$1.formatMessage({
+        id: 'exerciseRunner.arduino.help.dontShowAgain'
+      })
+    });
+  };
+  /**
+   *
+   */
+  var renderActionsButtons = function renderActionsButtons() {
+    return jsxRuntime.jsxs(Stack__default.default, {
+      direction: "row",
+      spacing: 1,
+      children: [jsxRuntime.jsx(Button__default.default, {
+        color: "inherit",
+        onClick: handleCancelClick,
+        children: intl$1.formatMessage({
+          id: 'exerciseRunner.arduino.preflight.action.cancel'
+        })
+      }), jsxRuntime.jsx(Button__default.default, {
+        variant: "contained",
+        onClick: handleConfirmClick,
+        children: intl$1.formatMessage({
+          id: 'exerciseRunner.arduino.preflight.action.confirm'
+        })
+      })]
+    });
+  };
+  //
+  //
+  //
+  return jsxRuntime.jsxs(Dialog__default.default, {
+    fullWidth: true,
+    maxWidth: "sm",
+    open: open,
+    PaperProps: {
+      sx: {
+        maxHeight: 'calc(100vh - 32px)'
+      }
+    },
+    onClose: onClose,
+    onTransitionExited: onTransitionExited,
+    children: [jsxRuntime.jsx(DialogTitle__default.default, {
+      children: renderTitle()
+    }), jsxRuntime.jsx(DialogContent__default.default, {
+      children: jsxRuntime.jsxs(Stack__default.default, {
+        spacing: 2,
+        children: [renderUploadNotice(), jsxRuntime.jsx(Typography__default.default, {
+          variant: "body2",
+          color: "text.secondary",
+          children: intl$1.formatMessage({
+            id: 'exerciseRunner.arduino.preflight.body'
+          })
+        }), renderPreview(), jsxRuntime.jsx(ArduinoConnectionPreflightDialogSteps.default, {}), jsxRuntime.jsx(Typography__default.default, {
+          variant: "caption",
+          color: "text.secondary",
+          children: intl$1.formatMessage({
+            id: 'exerciseRunner.arduino.preflight.footer'
+          })
+        })]
+      })
+    }), jsxRuntime.jsxs(DialogActions__default.default, {
+      sx: {
+        justifyContent: 'space-between',
+        px: 3,
+        py: 2
+      },
+      children: [renderActionsDontShowAgain(), renderActionsButtons()]
+    })]
+  });
+};
+
+exports.default = ArduinoConnectionPreflightDialog;

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoConnectionPreflightDialogNativeMock.d.ts

@@ -0,0 +1,3 @@
+import type React from 'react';
+declare const ArduinoConnectionPreflightDialogNativeMock: React.VFC;
+export default ArduinoConnectionPreflightDialogNativeMock;

package/cjs/components/material-exercise/exercise-runner/arduino/{ArduinoConnectionGuideDialogNativeMock.js → ArduinoConnectionPreflightDialogNativeMock.js}

@@ -37,7 +37,7 @@ var SYSTEM_FONT = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-s
 //
 //
 //
-var ArduinoConnectionGuideDialogNativeMock = function ArduinoConnectionGuideDialogNativeMock() {
+var ArduinoConnectionPreflightDialogNativeMock = function ArduinoConnectionPreflightDialogNativeMock() {
   var intl$1 = intl.useRawEliceIntl();
   /**
    *
@@ -67,7 +67,7 @@ var ArduinoConnectionGuideDialogNativeMock = function ArduinoConnectionGuideDial
           color: MOCK_TEXT
         },
         children: intl$1.formatMessage({
-          id: 'exerciseRunner.arduino.connectGuide.preview.host'
+          id: 'exerciseRunner.arduino.preflight.preview.host'
         }, {
           host: window.location.host
         })
@@ -153,7 +153,7 @@ var ArduinoConnectionGuideDialogNativeMock = function ArduinoConnectionGuideDial
           bgcolor: 'transparent'
         }),
         children: intl$1.formatMessage({
-          id: 'exerciseRunner.arduino.connectGuide.preview.cancel'
+          id: 'exerciseRunner.arduino.preflight.preview.cancel'
         })
       }), jsxRuntime.jsx(Box__default.default, {
         sx: Object.assign(Object.assign({}, btnBaseSx), {
@@ -162,7 +162,7 @@ var ArduinoConnectionGuideDialogNativeMock = function ArduinoConnectionGuideDial
           color: MOCK_BTN_PRIMARY_TEXT
         }),
         children: intl$1.formatMessage({
-          id: 'exerciseRunner.arduino.connectGuide.preview.connect'
+          id: 'exerciseRunner.arduino.preflight.preview.connect'
         })
       })]
     });
@@ -185,4 +185,4 @@ var ArduinoConnectionGuideDialogNativeMock = function ArduinoConnectionGuideDial
   });
 };
 
-exports.default = ArduinoConnectionGuideDialogNativeMock;
+exports.default = ArduinoConnectionPreflightDialogNativeMock;

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoConnectionPreflightDialogSteps.d.ts

@@ -0,0 +1,3 @@
+import type React from 'react';
+declare const ArduinoConnectionPreflightDialogSteps: React.VFC;
+export default ArduinoConnectionPreflightDialogSteps;

package/cjs/components/material-exercise/exercise-runner/arduino/{ArduinoConnectionGuideDialogSteps.js → ArduinoConnectionPreflightDialogSteps.js}

@@ -21,7 +21,7 @@ var STEP_KEYS = [1, 2, 3];
 //
 //
 //
-var ArduinoConnectionGuideDialogSteps = function ArduinoConnectionGuideDialogSteps() {
+var ArduinoConnectionPreflightDialogSteps = function ArduinoConnectionPreflightDialogSteps() {
   var intl$1 = intl.useRawEliceIntl();
   /**
    *
@@ -104,15 +104,15 @@ var ArduinoConnectionGuideDialogSteps = function ArduinoConnectionGuideDialogSte
           whiteSpace: 'pre-line'
         },
         children: intl$1.formatMessage({
-          id: "exerciseRunner.arduino.connectGuide.steps.".concat(step)
+          id: "exerciseRunner.arduino.preflight.steps.".concat(step)
         }, {
           usbmodem: renderInlineCode('usbmodem'),
           usbserial: renderInlineCode('usbserial'),
           connect: renderStrong(intl$1.formatMessage({
-            id: 'exerciseRunner.arduino.connectGuide.preview.connect'
+            id: 'exerciseRunner.arduino.preflight.preview.connect'
           })),
           cancel: renderStrong(intl$1.formatMessage({
-            id: 'exerciseRunner.arduino.connectGuide.preview.cancel'
+            id: 'exerciseRunner.arduino.preflight.preview.cancel'
           }))
         })
       })]
@@ -129,4 +129,4 @@ var ArduinoConnectionGuideDialogSteps = function ArduinoConnectionGuideDialogSte
   });
 };
 
-exports.default = ArduinoConnectionGuideDialogSteps;
+exports.default = ArduinoConnectionPreflightDialogSteps;

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerActionUpload.js

@@ -26,22 +26,22 @@ var ArduinoControllerActionUpload = function ArduinoControllerActionUpload() {
     isDisabled = _useControllerActionR.isDisabled,
     run = _useControllerActionR.run;
   var _useConnection = mcuBridge.useConnection(),
-    status = _useConnection.status,
-    connect = _useConnection.connect;
+    status = _useConnection.status;
   var isBrowserSupported = mcuBridge.useIsBrowserSupported();
   var _useArduinoBridge = _context.useArduinoBridge(),
     setPendingIntent = _useArduinoBridge.setPendingIntent,
     isPending = _useArduinoBridge.isPending,
     isFlashing = _useArduinoBridge.isFlashing,
-    setConnectionIntent = _useArduinoBridge.setConnectionIntent;
+    openConnectionPreflight = _useArduinoBridge.openConnectionPreflight;
   var isUploadDisabled = isDisabled || isPending || isFlashing || !isBrowserSupported;
   var isUploadLoading = isPending || isFlashing;
   /**
    * Submit the Arduino sketch, then flash the compiled firmware to the board.
    */
   var upload = React__default.default.useCallback(/*#__PURE__*/_rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee() {
+    var granted;
     return _rollupPluginBabelHelpers.regenerator().w(function (_context) {
-      while (1) switch (_context.p = _context.n) {
+      while (1) switch (_context.n) {
         case 0:
           if (!isUploadDisabled) {
             _context.n = 1;
@@ -50,29 +50,27 @@ var ArduinoControllerActionUpload = function ArduinoControllerActionUpload() {
           return _context.a(2);
         case 1:
           if (!(status !== 'connected')) {
-            _context.n = 5;
+            _context.n = 3;
+            break;
+          }
+          _context.n = 2;
+          return openConnectionPreflight('upload');
+        case 2:
+          granted = _context.v;
+          if (granted) {
+            _context.n = 3;
             break;
           }
-          setConnectionIntent('upload');
-          _context.p = 2;
-          _context.n = 3;
-          return connect();
-        case 3:
-          _context.n = 5;
-          break;
-        case 4:
-          _context.p = 4;
-          _context.v;
           return _context.a(2);
-        case 5:
+        case 3:
           setPendingIntent('upload');
-          _context.n = 6;
+          _context.n = 4;
           return run();
-        case 6:
+        case 4:
           return _context.a(2);
       }
-    }, _callee, null, [[2, 4]]);
-  })), [isUploadDisabled, status, connect, setConnectionIntent, setPendingIntent, run]);
+    }, _callee);
+  })), [isUploadDisabled, status, openConnectionPreflight, setPendingIntent, run]);
   //
   //
   //

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerStatusMessage.js

@@ -48,12 +48,11 @@ var ArduinoControllerStatusMessage = function ArduinoControllerStatusMessage() {
   var intl$1 = intl.useRawEliceIntl();
   var _useConnection = mcuBridge.useConnection(),
     status = _useConnection.status,
-    connect = _useConnection.connect,
     disconnect = _useConnection.disconnect;
   var session = mcuBridge.useSession();
   var _useArduinoBridge = _context.useArduinoBridge(),
     isFlashing = _useArduinoBridge.isFlashing,
-    setConnectionIntent = _useArduinoBridge.setConnectionIntent;
+    openConnectionPreflight = _useArduinoBridge.openConnectionPreflight;
   var isBrowserSupported = mcuBridge.useIsBrowserSupported();
   var deviceName = (_a = session === null || session === void 0 ? void 0 : session.driver.board.name) !== null && _a !== void 0 ? _a : null;
   var isConnected = status === 'connected';
@@ -64,7 +63,7 @@ var ArduinoControllerStatusMessage = function ArduinoControllerStatusMessage() {
   var handleClick = /*#__PURE__*/function () {
     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:
             if (!isConnected) {
               _context.n = 2;
@@ -75,20 +74,12 @@ var ArduinoControllerStatusMessage = function ArduinoControllerStatusMessage() {
           case 1:
             return _context.a(2);
           case 2:
-            setConnectionIntent('connect');
-            _context.p = 3;
-            _context.n = 4;
-            return connect();
-          case 4:
-            _context.n = 6;
-            break;
-          case 5:
-            _context.p = 5;
-            _context.v;
-          case 6:
+            _context.n = 3;
+            return openConnectionPreflight('connect');
+          case 3:
             return _context.a(2);
         }
-      }, _callee, null, [[3, 5]]);
+      }, _callee);
     }));
     return function handleClick() {
       return _ref.apply(this, arguments);

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoProvider.js

@@ -7,8 +7,9 @@ var tslib = require('tslib');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var mcuBridge = require('@elice/mcu-bridge');
+var overlayKit = require('overlay-kit');
 var _context = require('./_context.js');
-var ArduinoConnectionGuideDialog = require('./ArduinoConnectionGuideDialog.js');
+var ArduinoConnectionPreflightDialog = require('./ArduinoConnectionPreflightDialog.js');
 var ArduinoErrorDialog = require('./ArduinoErrorDialog.js');
 var ArduinoHelpDialog = require('./ArduinoHelpDialog.js');
 var ArduinoProviderApiBinder = require('./ArduinoProviderApiBinder.js');
@@ -20,6 +21,11 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
+//
+//
+//
+var PREFLIGHT_DISMISS_KEY = 'elice-material-exercise-arduino-preflight-dialog-dont-show-again';
+var PREFLIGHT_DISMISS_VALUE = 'true';
 //
 //
 //
@@ -29,36 +35,109 @@ var ArduinoBridgeProvider = function ArduinoBridgeProvider(_ref) {
     children = _ref.children;
   var _useFlash = mcuBridge.useFlash(),
     isFlashing = _useFlash.isFlashing;
+  var _useConnection = mcuBridge.useConnection(),
+    connect = _useConnection.connect;
   var _useArduinoRunIntent = useArduinoRunIntent.useArduinoRunIntent(),
     pendingIntent = _useArduinoRunIntent.pendingIntent,
     pendingIntentRef = _useArduinoRunIntent.pendingIntentRef,
     setRunIntent = _useArduinoRunIntent.setRunIntent,
     clearRunIntent = _useArduinoRunIntent.clearRunIntent;
-  var permissionPhase = mcuBridge.usePermissionPhase();
-  var _React$useState = React__default.default.useState(null),
+  var connectRef = React__default.default.useRef(connect);
+  connectRef.current = connect;
+  var _React$useState = React__default.default.useState(false),
     _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
-    connectionIntent = _React$useState2[0],
-    setConnectionIntent = _React$useState2[1];
-  var _React$useState3 = React__default.default.useState(false),
-    _React$useState4 = _rollupPluginBabelHelpers.slicedToArray(_React$useState3, 2),
-    isHelpDialogOpen = _React$useState4[0],
-    setHelpDialogOpen = _React$useState4[1];
+    isHelpDialogOpen = _React$useState2[0],
+    setHelpDialogOpen = _React$useState2[1];
+  /**
+   *
+   */
   var openHelpDialog = React__default.default.useCallback(function () {
     return setHelpDialogOpen(true);
   }, []);
+  /**
+   *
+   */
   var closeHelpDialog = React__default.default.useCallback(function () {
     return setHelpDialogOpen(false);
   }, []);
+  /**
+   *
+   */
+  var openConnectionPreflight = React__default.default.useCallback(/*#__PURE__*/function () {
+    var _ref2 = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee2(intent) {
+      var runConnect, confirmed;
+      return _rollupPluginBabelHelpers.regenerator().w(function (_context2) {
+        while (1) switch (_context2.n) {
+          case 0:
+            runConnect = /*#__PURE__*/function () {
+              var _ref3 = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee() {
+                return _rollupPluginBabelHelpers.regenerator().w(function (_context) {
+                  while (1) switch (_context.p = _context.n) {
+                    case 0:
+                      _context.p = 0;
+                      _context.n = 1;
+                      return connectRef.current();
+                    case 1:
+                      return _context.a(2, true);
+                    case 2:
+                      _context.p = 2;
+                      _context.v;
+                      return _context.a(2, false);
+                  }
+                }, _callee, null, [[0, 2]]);
+              }));
+              return function runConnect() {
+                return _ref3.apply(this, arguments);
+              };
+            }();
+            if (!(sessionStorage.getItem(PREFLIGHT_DISMISS_KEY) === PREFLIGHT_DISMISS_VALUE)) {
+              _context2.n = 1;
+              break;
+            }
+            return _context2.a(2, runConnect());
+          case 1:
+            _context2.n = 2;
+            return overlayKit.overlay.openAsync(function (_ref4) {
+              var isOpen = _ref4.isOpen,
+                close = _ref4.close,
+                unmount = _ref4.unmount;
+              return jsxRuntime.jsx(ArduinoConnectionPreflightDialog.default, {
+                open: isOpen,
+                intent: intent,
+                onClose: function onClose() {
+                  return close(false);
+                },
+                onConfirm: function onConfirm() {
+                  return close(true);
+                },
+                onTransitionExited: unmount,
+                onSaveDontShowAgain: function onSaveDontShowAgain() {
+                  sessionStorage.setItem(PREFLIGHT_DISMISS_KEY, PREFLIGHT_DISMISS_VALUE);
+                }
+              });
+            });
+          case 2:
+            confirmed = _context2.v;
+            if (confirmed) {
+              _context2.n = 3;
+              break;
+            }
+            return _context2.a(2, false);
+          case 3:
+            return _context2.a(2, runConnect());
+        }
+      }, _callee2);
+    }));
+    return function (_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }(), []);
+  //
+  // setup the MCU Bridge once on mount
+  //
   React.useEffect(function () {
     mcuBridge.setupMCUBridge([mcuBridge.ArduinoUnoDriver, mcuBridge.ArduinoMegaDriver]);
   }, []);
-  // Clear the variant tag once the picker resolves so it can't bleed into
-  // an unrelated future connect flow.
-  React.useEffect(function () {
-    if (permissionPhase === 'granted') {
-      setConnectionIntent(null);
-    }
-  }, [permissionPhase]);
   //
   //
   //
@@ -67,8 +146,7 @@ var ArduinoBridgeProvider = function ArduinoBridgeProvider(_ref) {
       setPendingIntent: setRunIntent,
       isPending: pendingIntent !== null,
       isFlashing: isFlashing,
-      connectionIntent: connectionIntent,
-      setConnectionIntent: setConnectionIntent,
+      openConnectionPreflight: openConnectionPreflight,
       isHelpDialogOpen: isHelpDialogOpen,
       openHelpDialog: openHelpDialog,
       closeHelpDialog: closeHelpDialog
@@ -82,7 +160,7 @@ var ArduinoBridgeProvider = function ArduinoBridgeProvider(_ref) {
       xtermRef: xtermRef,
       pendingIntentRef: pendingIntentRef,
       clearRunIntent: clearRunIntent
-    }), jsxRuntime.jsx(ArduinoConnectionGuideDialog.default, {}), jsxRuntime.jsx(ArduinoHelpDialog.default, {}), jsxRuntime.jsx(ArduinoErrorDialog.default, {})]
+    }), jsxRuntime.jsx(ArduinoHelpDialog.default, {}), jsxRuntime.jsx(ArduinoErrorDialog.default, {})]
   });
 };
 //

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoProviderSessionWriter.js

@@ -27,15 +27,7 @@ var ArduinoProviderSessionWriter = function ArduinoProviderSessionWriter(_ref) {
   //
   // Pipe board serial output into xterm.
   //
-  React__default.default.useEffect(function () {
-    if (!session) {
-      return;
-    }
-    var decoder = new TextDecoder();
-    return session.events.on('serial', function (chunk) {
-      write(decoder.decode(chunk));
-    });
-  }, [session, write]);
+  mcuBridge.useSerialStream(write);
   //
   // Print board attach/detach lifecycle messages.
   //

package/cjs/components/material-exercise/exercise-runner/arduino/_context.d.ts

@@ -16,11 +16,13 @@ interface ArduinoBridgeContextValue {
     /** Readback for the button group to know when a flash is in flight. */
     isFlashing: boolean;
     /**
-     * Picks the connection-guide dialog's copy variant. The guide's open state
-     * is derived from `permissionStore.phase`; this only chooses the wording.
+     * Show the preflight guide dialog, then trigger the native port picker after
+     * the student confirms. Resolves `true` once the picker grants a port,
+     * `false` if the student cancels or the picker fails. When the
+     * "don't show again" flag is set in sessionStorage, the dialog is skipped
+     * and the picker fires immediately.
      */
-    connectionIntent: ArduinoConnectionIntent | null;
-    setConnectionIntent: (intent: ArduinoConnectionIntent | null) => void;
+    openConnectionPreflight: (intent: ArduinoConnectionIntent) => Promise<boolean>;
     /**
      * Help dialog opened by the controller-area help button (and auto-opened
      * once on first visit). Only the open flag lives here — the dialog owns