@jungjaehoon/mama-os 0.12.0 → 0.12.2

package/public/viewer/src/modules/chat.ts

@@ -151,7 +151,10 @@ export class ChatModule {
   rafPending = false;
   history: ChatHistoryMessage[] = [];
   historyPrefix = 'mama_chat_history_';
-  maxHistoryMessages = 50;
+  get historyStorageKey(): string {
+    return this.historyPrefix + 'viewer_mama_os_main';
+  }
+  maxHistoryMessages = 200;
   maxDomMessages = 100; // Limit DOM elements for performance
   historyExpiryMs = 24 * 60 * 60 * 1000;
   checkpointCooldown = false;
@@ -230,11 +233,11 @@ export class ChatModule {
     // Check for resumable session first
     await this.checkForResumableSession();
 
-    // Try to get last active server session first
+    // Always try to get the last active viewer session from server
+    // Use it regardless of isAlive — server history is the source of truth
     const lastActiveSession = await API.getLastActiveSession().catch(() => null);
-    if (lastActiveSession && lastActiveSession.id && lastActiveSession.isAlive) {
-      logger.info('Resuming last active session:', lastActiveSession.id);
-      this.addSystemMessage('Resuming previous session...');
+    if (lastActiveSession && lastActiveSession.id) {
+      logger.info('Using server session:', lastActiveSession.id);
       localStorage.setItem('mama_chat_session_id', lastActiveSession.id);
       this.initWebSocket(lastActiveSession.id);
       return;
@@ -1763,7 +1766,7 @@ export class ChatModule {
     }
 
     try {
-      const storageKey = this.historyPrefix + this.sessionId;
+      const storageKey = this.historyStorageKey;
       const storageData = {
         history: this.history,
         savedAt: Date.now(),
@@ -1777,9 +1780,9 @@ export class ChatModule {
   /**
    * Load history from localStorage
    */
-  loadHistory(sessionId: string): ChatHistoryMessage[] | null {
+  loadHistory(_sessionId: string): ChatHistoryMessage[] | null {
     try {
-      const storageKey = this.historyPrefix + sessionId;
+      const storageKey = this.historyStorageKey;
       const stored = localStorage.getItem(storageKey);
 
       if (!stored) {
@@ -1880,13 +1883,25 @@ export class ChatModule {
       return;
     }
 
+    // Merge: use server messages as base, append any local-only messages
+    // that are newer than the last server message
+    const serverTimestamp =
+      messages.length > 0 ? new Date(messages[messages.length - 1].timestamp || 0).getTime() : 0;
+
+    const localOnlyMessages = this.history.filter((msg) => {
+      const msgTime = new Date(msg.timestamp).getTime();
+      return msgTime > serverTimestamp && msg.role !== 'system';
+    });
+
+    const merged = [...messages, ...localOnlyMessages];
+    const boundedHistory = merged.slice(-this.maxHistoryMessages);
+
     container.innerHTML = '';
-    this.history = messages;
+    this.history = boundedHistory;
 
     // Use DocumentFragment for batch DOM insertion
     const fragment = document.createDocumentFragment();
-    // Limit to last N messages for DOM performance
-    const messagesToRender = messages.slice(-this.maxDomMessages);
+    const messagesToRender = boundedHistory.slice(-this.maxDomMessages);
 
     messagesToRender.forEach((msg) => {
       const msgEl = document.createElement('div');
@@ -1915,15 +1930,43 @@ export class ChatModule {
 
     container.appendChild(fragment);
     scrollToBottom(container);
-    logger.info('Displayed', messagesToRender.length, 'history messages');
+
+    // Save merged history to localStorage
+    this.saveCurrentHistory();
+
+    logger.info(
+      'Displayed',
+      messagesToRender.length,
+      'messages (server:',
+      messages.length,
+      '+ local:',
+      localOnlyMessages.length,
+      ')'
+    );
+  }
+
+  private saveCurrentHistory(): void {
+    if (!this.sessionId) {
+      return;
+    }
+    try {
+      const storageKey = this.historyStorageKey;
+      const storageData = {
+        history: this.history,
+        savedAt: Date.now(),
+      };
+      localStorage.setItem(storageKey, JSON.stringify(storageData));
+    } catch (e) {
+      logger.warn('Failed to save history:', e);
+    }
   }
 
   /**
    * Clear chat history
    */
-  clearHistory(sessionId: string | null = null): void {
+  clearHistory(_sessionId: string | null = null): void {
     try {
-      const storageKey = this.historyPrefix + (sessionId || this.sessionId);
+      const storageKey = this.historyStorageKey;
       localStorage.removeItem(storageKey);
       this.history = [];
     } catch (e) {

package/public/viewer/src/modules/dashboard.ts

@@ -12,7 +12,13 @@
 
 /* eslint-env browser */
 
-import { escapeAttr, escapeHtml, getElementByIdOrNull, getErrorMessage } from '../utils/dom.js';
+import {
+  escapeAttr,
+  escapeHtml,
+  getElementByIdOrNull,
+  getErrorMessage,
+  showToast,
+} from '../utils/dom.js';
 import { formatModelName } from '../utils/format.js';
 import {
   API,
@@ -168,6 +174,24 @@ export class DashboardModule {
         if (settingsTab) {
           settingsTab.click();
         }
+        return;
+      }
+
+      const restartBtn = target.closest<HTMLElement>('[data-action="restart-agent"]');
+      if (restartBtn) {
+        const agentId = restartBtn.getAttribute('data-agent-id');
+        if (agentId) {
+          this.restartAgent(agentId);
+        }
+        return;
+      }
+
+      const stopBtn = target.closest<HTMLElement>('[data-action="stop-agent"]');
+      if (stopBtn) {
+        const agentId = stopBtn.getAttribute('data-agent-id');
+        if (agentId) {
+          this.stopAgent(agentId);
+        }
       }
     };
     document.addEventListener('click', this.onCronClick);
@@ -717,6 +741,24 @@ export class DashboardModule {
                 ? `<p class="text-[10px] text-gray-400 mt-1">Last: ${this.formatRelativeTime(agent.lastActivity)}</p>`
                 : ''
             }
+            <div class="flex gap-1 mt-2 pt-2 border-t border-gray-100">
+              <button
+                data-action="restart-agent"
+                data-agent-id="${escapeAttr(agent.id)}"
+                class="text-[10px] px-2 py-0.5 rounded bg-blue-50 text-blue-600 hover:bg-blue-100 transition-colors"
+                title="Restart agent"
+              >🔄 Restart</button>
+              ${
+                agent.status === 'busy'
+                  ? `<button
+                      data-action="stop-agent"
+                      data-agent-id="${escapeAttr(agent.id)}"
+                      class="text-[10px] px-2 py-0.5 rounded bg-red-50 text-red-600 hover:bg-red-100 transition-colors"
+                      title="Stop agent"
+                    >⏹ Stop</button>`
+                  : ''
+              }
+            </div>
           </div>
         `;
       })
@@ -921,6 +963,28 @@ export class DashboardModule {
     }
   }
 
+  async restartAgent(agentId: string): Promise<void> {
+    try {
+      await API.restartAgent(agentId);
+      showToast(`Agent "${agentId}" restarted`);
+      await this.loadStatus();
+    } catch (e) {
+      logger.error('[Dashboard] Failed to restart agent:', e);
+      showToast(`Restart failed: ${getErrorMessage(e)}`);
+    }
+  }
+
+  async stopAgent(agentId: string): Promise<void> {
+    try {
+      await API.stopAgent(agentId);
+      showToast(`Agent "${agentId}" stopped`);
+      await this.loadStatus();
+    } catch (e) {
+      logger.error('[Dashboard] Failed to stop agent:', e);
+      showToast(`Stop failed: ${getErrorMessage(e)}`);
+    }
+  }
+
   /**
    * Render system health section
    */

package/public/viewer/src/modules/settings.ts

@@ -81,6 +81,14 @@ type SettingsPayload = {
     enabled: boolean;
     retention_days: number;
   };
+  timeouts: {
+    request_ms: number;
+    agent_ms: number;
+    session_ms: number;
+    workflow_step_ms: number;
+    workflow_max_ms: number;
+    ultrawork_ms: number;
+  };
 };
 
 // Model options by backend (single source of truth)
@@ -432,6 +440,9 @@ export class SettingsModule {
       Math.round((this.config.agent?.timeout || 300000) / 1000)
     );
 
+    // Timeouts
+    this.populateTimeouts();
+
     // Tool Mode
     this.populateToolMode();
 
@@ -450,6 +461,25 @@ export class SettingsModule {
     this.populateCronSection();
   }
 
+  /**
+   * Populate timeouts section from config
+   */
+  populateTimeouts(): void {
+    if (!this.config) {
+      return;
+    }
+    const t = this.config.timeouts;
+    if (!t) {
+      return;
+    }
+    this.setValue('settings-timeout-request', Math.round((t.request_ms ?? 120000) / 1000));
+    this.setValue('settings-timeout-agent', Math.round((t.agent_ms ?? 300000) / 1000));
+    this.setValue('settings-timeout-session', Math.round((t.session_ms ?? 1800000) / 60000));
+    this.setValue('settings-timeout-wf-step', Math.round((t.workflow_step_ms ?? 300000) / 1000));
+    this.setValue('settings-timeout-wf-max', Math.round((t.workflow_max_ms ?? 1800000) / 60000));
+    this.setValue('settings-timeout-ultrawork', Math.round((t.ultrawork_ms ?? 300000) / 1000));
+  }
+
   /**
    * Populate role permissions from config
    */
@@ -841,6 +871,14 @@ export class SettingsModule {
         enabled: this.getCheckbox('settings-metrics-enabled'),
         retention_days: this.parseIntegerInput('settings-metrics-retention', 1, 90, 7),
       },
+      timeouts: {
+        request_ms: this.parseIntegerInput('settings-timeout-request', 0, 600, 120) * 1000,
+        agent_ms: this.parseIntegerInput('settings-timeout-agent', 0, 3600, 300) * 1000,
+        session_ms: this.parseIntegerInput('settings-timeout-session', 0, 1440, 30) * 60000,
+        workflow_step_ms: this.parseIntegerInput('settings-timeout-wf-step', 0, 7200, 300) * 1000,
+        workflow_max_ms: this.parseIntegerInput('settings-timeout-wf-max', 0, 1440, 30) * 60000,
+        ultrawork_ms: this.parseIntegerInput('settings-timeout-ultrawork', 0, 7200, 300) * 1000,
+      },
     };
   }
 

package/public/viewer/src/utils/api.ts

@@ -91,6 +91,20 @@ export interface ApiMetricsConfig {
   retention_days?: number;
 }
 
+export interface ApiTimeoutsConfig {
+  request_ms?: number;
+  codex_request_ms?: number;
+  initialize_ms?: number;
+  session_ms?: number;
+  session_cleanup_ms?: number;
+  agent_ms?: number;
+  ultrawork_ms?: number;
+  workflow_step_ms?: number;
+  workflow_max_ms?: number;
+  busy_retry_ms?: number;
+  [key: string]: unknown;
+}
+
 export interface ApiConfigResponse {
   discord?: ApiGatewayConfig;
   slack?: ApiGatewayConfig;
@@ -101,6 +115,7 @@ export interface ApiConfigResponse {
   roles?: ApiRolesConfig;
   token_budget?: ApiTokenBudgetConfig;
   metrics?: ApiMetricsConfig;
+  timeouts?: ApiTimeoutsConfig;
   [key: string]: unknown;
 }
 
@@ -695,6 +710,18 @@ export class API {
     return this.put(`/api/skills/${encodeURIComponent(name)}/content`, { content, source });
   }
 
+  // =============================================
+  // Multi-Agent Control API
+  // =============================================
+
+  static async restartAgent(agentId: string): Promise<JsonRecord> {
+    return this.post(`/api/multi-agent/agents/${encodeURIComponent(agentId)}/restart`, {});
+  }
+
+  static async stopAgent(agentId: string): Promise<JsonRecord> {
+    return this.post(`/api/multi-agent/agents/${encodeURIComponent(agentId)}/stop`, {});
+  }
+
   // =============================================
   // Metrics / Health API
   // =============================================

package/public/viewer/viewer.html

@@ -658,6 +658,42 @@
                   </div>
                 </section>
 
+                <!-- Timeouts -->
+                <section>
+                  <h2 class="text-xs font-semibold text-gray-700 mb-1.5 flex items-center gap-1">⏱️ Timeouts</h2>
+                  <div class="bg-white border border-gray-200 rounded-lg p-2 shadow-sm">
+                    <div class="grid grid-cols-3 gap-1 mb-1">
+                      <div>
+                        <label class="block text-[9px] text-gray-500 mb-0.5">Request (s)</label>
+                        <input type="number" id="settings-timeout-request" value="120" min="10" max="600" class="w-full px-1.5 py-0.5 text-[10px] border border-gray-200 rounded bg-gray-50">
+                      </div>
+                      <div>
+                        <label class="block text-[9px] text-gray-500 mb-0.5">Agent (s)</label>
+                        <input type="number" id="settings-timeout-agent" value="300" min="30" max="3600" class="w-full px-1.5 py-0.5 text-[10px] border border-gray-200 rounded bg-gray-50">
+                      </div>
+                      <div>
+                        <label class="block text-[9px] text-gray-500 mb-0.5">Session (min)</label>
+                        <input type="number" id="settings-timeout-session" value="30" min="5" max="1440" class="w-full px-1.5 py-0.5 text-[10px] border border-gray-200 rounded bg-gray-50">
+                      </div>
+                    </div>
+                    <div class="grid grid-cols-3 gap-1 mb-1">
+                      <div>
+                        <label class="block text-[9px] text-gray-500 mb-0.5">WF Step (s)</label>
+                        <input type="number" id="settings-timeout-wf-step" value="300" min="0" max="7200" class="w-full px-1.5 py-0.5 text-[10px] border border-gray-200 rounded bg-gray-50" title="0 = unlimited">
+                      </div>
+                      <div>
+                        <label class="block text-[9px] text-gray-500 mb-0.5">WF Max (min)</label>
+                        <input type="number" id="settings-timeout-wf-max" value="30" min="0" max="1440" class="w-full px-1.5 py-0.5 text-[10px] border border-gray-200 rounded bg-gray-50" title="0 = unlimited">
+                      </div>
+                      <div>
+                        <label class="block text-[9px] text-gray-500 mb-0.5">UltraWork (s)</label>
+                        <input type="number" id="settings-timeout-ultrawork" value="300" min="0" max="7200" class="w-full px-1.5 py-0.5 text-[10px] border border-gray-200 rounded bg-gray-50" title="0 = unlimited">
+                      </div>
+                    </div>
+                    <p class="text-[8px] text-gray-400 mt-0.5">0 = unlimited (WF Step, WF Max, UltraWork)</p>
+                  </div>
+                </section>
+
                 <!-- Role Permissions -->
                 <section>
                   <h2 class="text-xs font-semibold text-gray-700 mb-1.5 flex items-center gap-1">🔐 Roles</h2>