@positronic/cli 0.0.77 → 0.0.78

package/dist/src/components/watch-machine.js

@@ -1,10 +1,18 @@
 /**
- * State machine for the Watch component.
+ * State management for the Watch component.
  *
- * This machine handles UI navigation and async operations for the watch view.
- * The brain execution tracking (useBrainMachine) and EventSource connection
+ * Uses useReducer for UI navigation and async operations.
+ * Brain execution tracking (useBrainMachine) and EventSource connection
  * remain separate concerns.
- */ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+ */ function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
     try {
         var info = gen[key](arg);
         var value = info.value;
@@ -46,6 +54,33 @@ function _define_property(obj, key, value) {
     }
     return obj;
 }
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _non_iterable_rest() {
+    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 _object_spread(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
@@ -85,6 +120,17 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
 function _ts_generator(thisArg, body) {
     var f, y, t, _ = {
         label: 0,
@@ -176,138 +222,178 @@ function _ts_generator(thisArg, body) {
         };
     }
 }
-import { useMemo } from 'react';
-import * as robot3 from 'robot3';
-import { useMachine } from 'react-robot';
+import { useReducer, useCallback, useRef, useEffect } from 'react';
 import { apiClient } from '../commands/helpers.js';
-var createMachine = robot3.createMachine, state = robot3.state, transition = robot3.transition, reduce = robot3.reduce, invoke = robot3.invoke, immediate = robot3.immediate, guard = robot3.guard;
 // ============================================================================
-// Reducers
+// Reducer
 // ============================================================================
-var setStateForStateView = reduce(function(ctx, param) {
-    var stateSnapshot = param.stateSnapshot, stateTitle = param.stateTitle, fromView = param.fromView;
-    return _object_spread_props(_object_spread({}, ctx), {
-        stateSnapshot: stateSnapshot,
-        stateTitle: stateTitle,
-        stateScrollOffset: 0,
-        previousView: fromView
-    });
-});
-var clearStateSnapshot = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        stateSnapshot: null
-    });
-});
-var setAgentForChat = reduce(function(ctx, param) {
-    var selectedAgentId = param.selectedAgentId, fromView = param.fromView;
-    return _object_spread_props(_object_spread({}, ctx), {
-        selectedAgentId: selectedAgentId !== null && selectedAgentId !== void 0 ? selectedAgentId : null,
-        agentChatScrollOffset: 0,
-        previousView: fromView
-    });
-});
-var clearSelectedAgent = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        selectedAgentId: null
-    });
-});
-var setPreviousViewForMessage = reduce(function(ctx, param) {
-    var fromView = param.fromView;
-    return _object_spread_props(_object_spread({}, ctx), {
-        previousView: fromView
-    });
-});
-var setEventsSelectedIndex = reduce(function(ctx, param) {
-    var index = param.index;
-    return _object_spread_props(_object_spread({}, ctx), {
-        eventsSelectedIndex: index
-    });
-});
-var setStateScrollOffset = reduce(function(ctx, param) {
-    var offset = param.offset;
-    return _object_spread_props(_object_spread({}, ctx), {
-        stateScrollOffset: offset
-    });
-});
-var setAgentChatScrollOffset = reduce(function(ctx, param) {
-    var offset = param.offset;
-    return _object_spread_props(_object_spread({}, ctx), {
-        agentChatScrollOffset: offset
-    });
-});
-var selectAgentFromPicker = reduce(function(ctx, param) {
-    var agentId = param.agentId;
-    return _object_spread_props(_object_spread({}, ctx), {
-        selectedAgentId: agentId,
-        agentChatScrollOffset: 0
-    });
-});
-var markKilled = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        isKilled: true
-    });
-});
-var setKillError = reduce(function(ctx, param) {
-    var error = param.error;
-    return _object_spread_props(_object_spread({}, ctx), {
-        killError: error
-    });
-});
-var setPauseMessage = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        pauseResumeMessage: 'Pause signal sent'
-    });
-});
-var setResumeMessage = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        pauseResumeMessage: 'Resume signal sent'
-    });
-});
-var clearPauseResumeMessage = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        pauseResumeMessage: null
-    });
-});
-var setMessageText = reduce(function(ctx, param) {
-    var text = param.text;
-    return _object_spread_props(_object_spread({}, ctx), {
-        messageText: text
-    });
-});
-var clearMessageText = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        messageText: ''
-    });
-});
-var setMessageSuccess = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        messageFeedback: 'success',
-        messageText: ''
-    });
-});
-var setMessageError = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        messageFeedback: 'error'
-    });
-});
-var clearMessageFeedback = reduce(function(ctx) {
-    return _object_spread_props(_object_spread({}, ctx), {
-        messageFeedback: null
-    });
-});
-// ============================================================================
-// Guards
-// ============================================================================
-var previousViewIsProgress = guard(function(ctx) {
-    return ctx.previousView === 'progress';
-});
-var hasSelectedAgent = guard(function(ctx) {
-    return ctx.selectedAgentId !== null;
-});
+function watchReducer(state, action) {
+    switch(action.type){
+        case 'GO_TO_PROGRESS':
+            return _object_spread_props(_object_spread({}, state), {
+                viewMode: 'progress'
+            });
+        case 'GO_TO_EVENTS':
+            return _object_spread_props(_object_spread({}, state), {
+                viewMode: 'events'
+            });
+        case 'GO_TO_STATE':
+            return _object_spread_props(_object_spread({}, state), {
+                viewMode: 'state',
+                stateSnapshot: action.stateSnapshot,
+                stateTitle: action.stateTitle,
+                stateScrollOffset: 0,
+                previousView: action.fromView
+            });
+        case 'GO_TO_AGENTS':
+            var _action_selectedAgentId;
+            return _object_spread_props(_object_spread({}, state), {
+                viewMode: action.selectedAgentId ? 'agent-chat' : 'agent-picker',
+                selectedAgentId: (_action_selectedAgentId = action.selectedAgentId) !== null && _action_selectedAgentId !== void 0 ? _action_selectedAgentId : null,
+                agentChatScrollOffset: 0,
+                previousView: action.fromView
+            });
+        case 'GO_TO_MESSAGE_INPUT':
+            return _object_spread_props(_object_spread({}, state), {
+                viewMode: 'message-input',
+                previousView: action.fromView
+            });
+        case 'GO_BACK':
+            switch(state.viewMode){
+                case 'state':
+                    return _object_spread_props(_object_spread({}, state), {
+                        viewMode: state.previousView,
+                        stateSnapshot: null
+                    });
+                case 'agent-chat':
+                    return _object_spread_props(_object_spread({}, state), {
+                        viewMode: state.previousView,
+                        selectedAgentId: null
+                    });
+                case 'message-input':
+                    return _object_spread_props(_object_spread({}, state), {
+                        viewMode: state.previousView,
+                        messageText: '',
+                        messageFeedback: null,
+                        messageStatus: 'idle'
+                    });
+                default:
+                    return _object_spread_props(_object_spread({}, state), {
+                        viewMode: state.previousView
+                    });
+            }
+        case 'SET_STATE_SCROLL_OFFSET':
+            return _object_spread_props(_object_spread({}, state), {
+                stateScrollOffset: action.offset
+            });
+        case 'AGENT_SELECTED':
+            return _object_spread_props(_object_spread({}, state), {
+                viewMode: 'agent-chat',
+                selectedAgentId: action.agentId,
+                agentChatScrollOffset: 0
+            });
+        case 'SET_AGENT_CHAT_SCROLL_OFFSET':
+            return _object_spread_props(_object_spread({}, state), {
+                agentChatScrollOffset: action.offset
+            });
+        case 'SET_EVENTS_SELECTED_INDEX':
+            return _object_spread_props(_object_spread({}, state), {
+                eventsSelectedIndex: action.index
+            });
+        // Kill flow
+        case 'INITIATE_KILL':
+            return _object_spread_props(_object_spread({}, state), {
+                killStatus: 'confirming'
+            });
+        case 'CANCEL_KILL':
+            return _object_spread_props(_object_spread({}, state), {
+                killStatus: 'idle'
+            });
+        case 'KILL_STARTED':
+            return _object_spread_props(_object_spread({}, state), {
+                killStatus: 'killing',
+                killError: null
+            });
+        case 'KILL_SUCCESS':
+            return _object_spread_props(_object_spread({}, state), {
+                killStatus: 'killed'
+            });
+        case 'KILL_ERROR':
+            return _object_spread_props(_object_spread({}, state), {
+                killStatus: 'error',
+                killError: action.error
+            });
+        // Pause/Resume
+        case 'PAUSE_STARTED':
+            return _object_spread_props(_object_spread({}, state), {
+                pauseResumeStatus: 'pausing'
+            });
+        case 'PAUSE_SUCCESS':
+            return _object_spread_props(_object_spread({}, state), {
+                pauseResumeStatus: 'idle',
+                pauseResumeMessage: 'Pause signal sent'
+            });
+        case 'PAUSE_ERROR':
+            return _object_spread_props(_object_spread({}, state), {
+                pauseResumeStatus: 'idle'
+            });
+        case 'RESUME_STARTED':
+            return _object_spread_props(_object_spread({}, state), {
+                pauseResumeStatus: 'resuming'
+            });
+        case 'RESUME_SUCCESS':
+            return _object_spread_props(_object_spread({}, state), {
+                pauseResumeStatus: 'idle',
+                pauseResumeMessage: 'Resume signal sent'
+            });
+        case 'RESUME_ERROR':
+            return _object_spread_props(_object_spread({}, state), {
+                pauseResumeStatus: 'idle'
+            });
+        case 'CLEAR_PAUSE_RESUME_MESSAGE':
+            return _object_spread_props(_object_spread({}, state), {
+                pauseResumeMessage: null
+            });
+        // Message flow
+        case 'SET_MESSAGE_TEXT':
+            return _object_spread_props(_object_spread({}, state), {
+                messageText: action.text
+            });
+        case 'SEND_MESSAGE_STARTED':
+            return _object_spread_props(_object_spread({}, state), {
+                messageStatus: 'sending'
+            });
+        case 'MESSAGE_SUCCESS':
+            return _object_spread_props(_object_spread({}, state), {
+                messageText: '',
+                messageFeedback: 'success',
+                messageStatus: 'idle'
+            });
+        case 'MESSAGE_ERROR':
+            return _object_spread_props(_object_spread({}, state), {
+                messageFeedback: 'error',
+                messageStatus: 'idle'
+            });
+        case 'CLEAR_FEEDBACK':
+            if (state.messageFeedback === 'success') {
+                return _object_spread_props(_object_spread({}, state), {
+                    viewMode: state.previousView,
+                    messageFeedback: null
+                });
+            }
+            return _object_spread_props(_object_spread({}, state), {
+                messageFeedback: null
+            });
+        case 'RESET':
+            return createInitialState(action.viewMode);
+        default:
+            return state;
+    }
+}
 // ============================================================================
-// Async operation functions
+// Async operations
 // ============================================================================
-var sendKillRequest = function(ctx) {
+function killBrain(runId) {
     return _async_to_generator(function() {
         var response;
         return _ts_generator(this, function(_state) {
@@ -315,7 +401,7 @@ var sendKillRequest = function(ctx) {
                 case 0:
                     return [
                         4,
-                        apiClient.fetch("/brains/runs/".concat(ctx.runId), {
+                        apiClient.fetch("/brains/runs/".concat(runId), {
                             method: 'DELETE'
                         })
                     ];
@@ -325,14 +411,13 @@ var sendKillRequest = function(ctx) {
                         throw new Error("Failed to kill brain: ".concat(response.status));
                     }
                     return [
-                        2,
-                        response
+                        2
                     ];
             }
         });
     })();
-};
-var sendPauseSignal = function(ctx) {
+}
+function pauseBrain(runId) {
     return _async_to_generator(function() {
         var response;
         return _ts_generator(this, function(_state) {
@@ -340,7 +425,7 @@ var sendPauseSignal = function(ctx) {
                 case 0:
                     return [
                         4,
-                        apiClient.fetch("/brains/runs/".concat(ctx.runId, "/signals"), {
+                        apiClient.fetch("/brains/runs/".concat(runId, "/signals"), {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json'
@@ -356,14 +441,13 @@ var sendPauseSignal = function(ctx) {
                         throw new Error("Failed to pause: ".concat(response.status));
                     }
                     return [
-                        2,
-                        response
+                        2
                     ];
             }
         });
     })();
-};
-var sendResumeSignal = function(ctx) {
+}
+function resumeBrain(runId) {
     return _async_to_generator(function() {
         var response;
         return _ts_generator(this, function(_state) {
@@ -371,7 +455,7 @@ var sendResumeSignal = function(ctx) {
                 case 0:
                     return [
                         4,
-                        apiClient.fetch("/brains/runs/".concat(ctx.runId, "/signals"), {
+                        apiClient.fetch("/brains/runs/".concat(runId, "/signals"), {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json'
@@ -387,26 +471,21 @@ var sendResumeSignal = function(ctx) {
                         throw new Error("Failed to resume: ".concat(response.status));
                     }
                     return [
-                        2,
-                        response
+                        2
                     ];
             }
         });
     })();
-};
-var sendUserMessage = function(ctx) {
+}
+function sendUserMessage(runId, text) {
     return _async_to_generator(function() {
-        var text, response;
+        var response;
         return _ts_generator(this, function(_state) {
             switch(_state.label){
                 case 0:
-                    text = ctx.messageText.trim();
-                    if (!text) {
-                        throw new Error('Message is empty');
-                    }
                     return [
                         4,
-                        apiClient.fetch("/brains/runs/".concat(ctx.runId, "/signals"), {
+                        apiClient.fetch("/brains/runs/".concat(runId, "/signals"), {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json'
@@ -423,151 +502,130 @@ var sendUserMessage = function(ctx) {
                         throw new Error("Failed to send message: ".concat(response.status));
                     }
                     return [
-                        2,
-                        response
+                        2
                     ];
             }
         });
     })();
-};
-// ============================================================================
-// State Machine Definition
-// ============================================================================
-var createWatchMachine = function(runId) {
-    var startWithEvents = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
-    return createMachine(startWithEvents ? 'events' : 'progress', {
-        // Main view states
-        progress: state(transition('GO_TO_EVENTS', 'events'), transition('GO_TO_STATE', 'state', setStateForStateView), transition('GO_TO_AGENTS', 'route-agents', setAgentForChat), transition('GO_TO_MESSAGE_INPUT', 'message-input', setPreviousViewForMessage), transition('INITIATE_KILL', 'confirming-kill'), transition('PAUSE', 'pausing'), transition('RESUME', 'resuming')),
-        events: state(transition('GO_TO_PROGRESS', 'progress'), transition('GO_TO_STATE', 'state', setStateForStateView), transition('GO_TO_AGENTS', 'route-agents', setAgentForChat), transition('GO_TO_MESSAGE_INPUT', 'message-input', setPreviousViewForMessage), transition('INITIATE_KILL', 'confirming-kill'), transition('PAUSE', 'pausing'), transition('RESUME', 'resuming'), transition('SET_EVENTS_SELECTED_INDEX', 'events', setEventsSelectedIndex)),
-        state: state(transition('GO_BACK', 'route-back', clearStateSnapshot), transition('SET_STATE_SCROLL_OFFSET', 'state', setStateScrollOffset)),
-        // Routing state to determine where to go back
-        'route-back': state(immediate('progress', previousViewIsProgress), immediate('events')),
-        // Routing state to determine if we show picker or go directly to chat
-        'route-agents': state(immediate('agent-chat', hasSelectedAgent), immediate('agent-picker')),
-        'agent-picker': state(transition('GO_BACK', 'route-back'), transition('AGENT_SELECTED', 'agent-chat', selectAgentFromPicker)),
-        'agent-chat': state(transition('GO_BACK', 'route-back', clearSelectedAgent), transition('SET_AGENT_CHAT_SCROLL_OFFSET', 'agent-chat', setAgentChatScrollOffset)),
-        // Message input and sending
-        'message-input': state(transition('GO_BACK', 'route-back', clearMessageText), transition('SET_MESSAGE_TEXT', 'message-input', setMessageText), transition('SEND_MESSAGE', 'sending-message')),
-        'sending-message': invoke(sendUserMessage, transition('done', 'message-sent', setMessageSuccess), transition('error', 'message-error', setMessageError)),
-        'message-sent': state(transition('CLEAR_FEEDBACK', 'route-back', clearMessageFeedback)),
-        'message-error': state(transition('CLEAR_FEEDBACK', 'message-input', clearMessageFeedback), transition('GO_BACK', 'route-back', clearMessageText)),
-        // Kill flow
-        'confirming-kill': state(transition('CONFIRM_KILL', 'killing'), transition('CANCEL_KILL', 'progress')),
-        killing: invoke(sendKillRequest, transition('done', 'killed', markKilled), transition('error', 'kill-error', setKillError)),
-        killed: state(// Can still navigate after kill
-        transition('GO_TO_EVENTS', 'events'), transition('GO_TO_STATE', 'state', setStateForStateView), transition('GO_TO_AGENTS', 'route-agents', setAgentForChat)),
-        'kill-error': state(// Can retry kill or navigate
-        transition('INITIATE_KILL', 'confirming-kill'), transition('GO_TO_EVENTS', 'events'), transition('GO_TO_STATE', 'state', setStateForStateView), transition('GO_TO_AGENTS', 'route-agents', setAgentForChat)),
-        // Pause flow
-        pausing: invoke(sendPauseSignal, transition('done', 'pause-sent', setPauseMessage), transition('error', 'progress')),
-        'pause-sent': state(transition('CLEAR_PAUSE_RESUME_MESSAGE', 'progress', clearPauseResumeMessage), // Allow navigation while showing message
-        transition('GO_TO_EVENTS', 'events', clearPauseResumeMessage), transition('GO_TO_STATE', 'state', setStateForStateView), transition('GO_TO_AGENTS', 'route-agents', setAgentForChat)),
-        // Resume flow
-        resuming: invoke(sendResumeSignal, transition('done', 'resume-sent', setResumeMessage), transition('error', 'progress')),
-        'resume-sent': state(transition('CLEAR_PAUSE_RESUME_MESSAGE', 'progress', clearPauseResumeMessage), // Allow navigation while showing message
-        transition('GO_TO_EVENTS', 'events', clearPauseResumeMessage), transition('GO_TO_STATE', 'state', setStateForStateView), transition('GO_TO_AGENTS', 'route-agents', setAgentForChat))
-    }, function() {
-        return {
-            runId: runId,
-            previousView: 'progress',
-            stateSnapshot: null,
-            stateTitle: '',
-            stateScrollOffset: 0,
-            selectedAgentId: null,
-            agentChatScrollOffset: 0,
-            eventsSelectedIndex: null,
-            killError: null,
-            isKilled: false,
-            pauseResumeMessage: null,
-            messageText: '',
-            messageFeedback: null
-        };
-    });
-};
-// ============================================================================
-// Helper to map machine state to ViewMode
-// ============================================================================
-/**
- * Map machine state name to ViewMode for rendering.
- * The machine has routing/async states that need to be mapped to display views.
- */ export function machineStateToViewMode(stateName) {
-    switch(stateName){
-        case 'progress':
-        case 'confirming-kill':
-        case 'killing':
-        case 'killed':
-        case 'kill-error':
-        case 'pausing':
-        case 'pause-sent':
-        case 'resuming':
-        case 'resume-sent':
-            return 'progress';
-        case 'events':
-            return 'events';
-        case 'state':
-            return 'state';
-        case 'agent-picker':
-        case 'route-agents':
-            return 'agent-picker';
-        case 'agent-chat':
-            return 'agent-chat';
-        case 'message-input':
-        case 'sending-message':
-        case 'message-sent':
-        case 'message-error':
-            return 'message-input';
-        case 'route-back':
-            // Transient state, treat as progress
-            return 'progress';
-        default:
-            return 'progress';
-    }
-}
-/**
- * Check if the machine is in a "confirming kill" state.
- */ export function isConfirmingKill(stateName) {
-    return stateName === 'confirming-kill';
-}
-/**
- * Check if the machine is in a "killing" state.
- */ export function isKillingState(stateName) {
-    return stateName === 'killing';
-}
-/**
- * Check if the machine is in a "killed" state.
- */ export function isKilledState(stateName) {
-    return stateName === 'killed' || stateName === 'kill-error';
-}
-/**
- * Check if the machine is in a "pausing" state.
- */ export function isPausingState(stateName) {
-    return stateName === 'pausing';
-}
-/**
- * Check if the machine is in a "resuming" state.
- */ export function isResumingState(stateName) {
-    return stateName === 'resuming';
-}
-/**
- * Check if the machine is in a "sending message" state.
- */ export function isSendingMessageState(stateName) {
-    return stateName === 'sending-message';
 }
 // ============================================================================
 // React Hook
 // ============================================================================
+function createInitialState(viewMode) {
+    return {
+        viewMode: viewMode,
+        previousView: 'progress',
+        stateSnapshot: null,
+        stateTitle: '',
+        stateScrollOffset: 0,
+        selectedAgentId: null,
+        agentChatScrollOffset: 0,
+        eventsSelectedIndex: null,
+        killStatus: 'idle',
+        killError: null,
+        pauseResumeStatus: 'idle',
+        pauseResumeMessage: null,
+        messageText: '',
+        messageStatus: 'idle',
+        messageFeedback: null
+    };
+}
 /**
- * React hook for the watch UI state machine.
- * Creates a fresh machine when runId changes.
- */ export function useWatchMachine(runId) {
+ * React hook for the watch UI state.
+ * Manages view navigation, async operations (kill/pause/resume/message),
+ * and related UI state like scroll offsets and selections.
+ */ export function useWatchReducer(runId) {
     var startWithEvents = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
-    var machine = useMemo(function() {
-        return createWatchMachine(runId, startWithEvents);
+    var initialViewMode = startWithEvents ? 'events' : 'progress';
+    var _useReducer = _sliced_to_array(useReducer(watchReducer, initialViewMode, createInitialState), 2), state = _useReducer[0], dispatch = _useReducer[1];
+    // Reset when runId changes
+    var prevRunIdRef = useRef(runId);
+    useEffect(function() {
+        if (prevRunIdRef.current !== runId) {
+            prevRunIdRef.current = runId;
+            dispatch({
+                type: 'RESET',
+                viewMode: initialViewMode
+            });
+        }
     }, [
         runId,
-        startWithEvents
+        initialViewMode
+    ]);
+    // Ref for accessing latest state in async callbacks
+    var stateRef = useRef(state);
+    stateRef.current = state;
+    var send = useCallback(function(action) {
+        switch(action.type){
+            case 'CONFIRM_KILL':
+                dispatch({
+                    type: 'KILL_STARTED'
+                });
+                killBrain(runId).then(function() {
+                    return dispatch({
+                        type: 'KILL_SUCCESS'
+                    });
+                }, function(error) {
+                    return dispatch({
+                        type: 'KILL_ERROR',
+                        error: error
+                    });
+                });
+                break;
+            case 'PAUSE':
+                dispatch({
+                    type: 'PAUSE_STARTED'
+                });
+                pauseBrain(runId).then(function() {
+                    return dispatch({
+                        type: 'PAUSE_SUCCESS'
+                    });
+                }, function() {
+                    return dispatch({
+                        type: 'PAUSE_ERROR'
+                    });
+                });
+                break;
+            case 'RESUME':
+                dispatch({
+                    type: 'RESUME_STARTED'
+                });
+                resumeBrain(runId).then(function() {
+                    return dispatch({
+                        type: 'RESUME_SUCCESS'
+                    });
+                }, function() {
+                    return dispatch({
+                        type: 'RESUME_ERROR'
+                    });
+                });
+                break;
+            case 'SEND_MESSAGE':
+                {
+                    var text = stateRef.current.messageText.trim();
+                    if (!text) return;
+                    dispatch({
+                        type: 'SEND_MESSAGE_STARTED'
+                    });
+                    sendUserMessage(runId, text).then(function() {
+                        return dispatch({
+                            type: 'MESSAGE_SUCCESS'
+                        });
+                    }, function() {
+                        return dispatch({
+                            type: 'MESSAGE_ERROR'
+                        });
+                    });
+                    break;
+                }
+            default:
+                dispatch(action);
+        }
+    }, [
+        runId
     ]);
-    return useMachine(machine);
+    return [
+        state,
+        send
+    ];
 }
-// Export the machine creator for testing
-export { createWatchMachine };