@kodaris/krubble-app-components 1.0.117 → 1.0.119

package/dist/krubble-app.umd.js

@@ -2484,8 +2484,7 @@
 
     .nav {
       width: 200px;
-      background: white;
-      border-right: 1px solid #e5e7eb;
+      background: #f3f7fcbf;
       display: flex;
       flex-direction: column;
       flex-shrink: 0;
@@ -5668,6 +5667,21 @@
           this._reader = null;
           this._decoder = new TextDecoder();
           this._buffer = '';
+          /**
+           * True once the current turn ended cleanly (a `finished:true` chunk arrived).
+           * Distinguishes a real completion from a dropped stream: if the SSE stream
+           * closes (`result.done`) while this is still false, the turn is NOT over — the
+           * connection dropped (5-min emitter timeout, tab was backgrounded, network
+           * blip) — so we reconnect instead of unlocking the composer. Reset per turn.
+           */
+          this._turnFinishedCleanly = false;
+          /**
+           * Consecutive failed reconnect attempts for the current drop. Bounds the retry
+           * loop so a genuinely dead turn (server gone) can't spin forever — after the
+           * cap we give up and finish the turn. Reset when a reconnect succeeds or a new
+           * turn starts.
+           */
+          this._reconnectAttempts = 0;
           this._userHasScrolledUp = false;
           this._isDragging = false;
           this._isResizing = false;
@@ -6127,6 +6141,20 @@
                               data,
                           });
                       }
+                      // Persisted reasoning row — the DB stores the model's thinking as its own
+                      // row with the text in `content` and type "reasoning". Live, reasoning
+                      // instead arrives as REASONING_PART deltas accumulated onto an assistant
+                      // bubble's `reasoning` property, which is the ONLY shape the render shows
+                      // (via msg.reasoning). Map the DB row into that same shape — an assistant
+                      // bubble carrying the text in `reasoning` — so reloaded/reconciled
+                      // reasoning renders identically to live instead of vanishing.
+                      if (msg.type === 'reasoning') {
+                          return Promise.resolve({
+                              type: 'assistant',
+                              content: '',
+                              reasoning: msg.content || '',
+                          });
+                      }
                       // A persisted approve/deny record — content is {outcome, tools:[...]}.
                       // Keep the type, parse content into `data`; the render reads msg.data.*.
                       if (msg.type === 'action_decision') {
@@ -6169,6 +6197,16 @@
               if (messages && messages.length) {
                   this.messages = messages;
               }
+              // A turn may still be running server-side for this conversation (the page was
+              // reloaded mid-turn, or opened on another device while a turn streams). After
+              // the transcript loads, try to attach to that live turn: _reconnectStream hits
+              // the read-only attach endpoint — 200 resumes streaming (locks the composer +
+              // shows the typing indicator so the user knows the AI is still working), 204
+              // means nothing is running (stays idle). Only meaningful with a pinned
+              // conversation and the built-in stream (a custom `send` owns its own turns).
+              if (this.conversationId && !this._isStreaming) {
+                  this._reconnectStream();
+              }
           }).catch(() => { });
           // Fetch the framework config on load (debugTelemetryEnabled, v2ChatEnabled,
           // registryServer). debugTelemetryEnabled gates the debug affordances and is
@@ -7208,6 +7246,10 @@
                   content: '',
               }];
           this._isStreaming = true;
+          // Fresh turn: not yet finished, no reconnects used. These gate the drop-vs-done
+          // decision in _readStreamChunk when the stream closes.
+          this._turnFinishedCleanly = false;
+          this._reconnectAttempts = 0;
           // Scroll user's message to the top (Gemini-style). The runway (min-height =
           // viewport) goes on the agent-turn WRAPPER, not an individual message — the
           // whole turn (reasoning, tool lines, text, decision) streams inside that one
@@ -7418,6 +7460,10 @@
           const btn = this._messagesEl?.querySelector(`.confirmation__btn[data-decision="${decision}"]`);
           btn?.showLoading();
           this._isStreaming = true;
+          // Fresh turn (confirmation decision runs a model turn too): reset the
+          // drop-vs-done gates used by _readStreamChunk.
+          this._turnFinishedCleanly = false;
+          this._reconnectAttempts = 0;
           this._userHasScrolledUp = false;
           this.send({
               message: '',
@@ -7720,11 +7766,18 @@
           }
           this._reader.read().then((result) => {
               if (result.done) {
-                  // Fallback unlock: the stream closed without a `finished:true` chunk
-                  // (network drop, server crash, the 5-min emitter timeout). Treat it as
-                  // the turn ending so a dropped stream never wedges the composer — the
-                  // server self-heals its turn lock and bounces any premature send.
-                  this._finishStream();
+                  // The stream closed. Two very different cases:
+                  // 1. A `finished:true` chunk already arrived (_turnFinishedCleanly) — the
+                  //    turn is genuinely over; finishing was already handled below. Nothing to do.
+                  // 2. No finished chunk yet — the connection DROPPED mid-turn (5-min emitter
+                  //    timeout, tab backgrounded, network blip) but the server-side turn is
+                  //    still running. Do NOT unlock the composer (that's the old bug that made
+                  //    the input look ready while the AI was still working). Reconnect to the
+                  //    live stream and keep receiving events.
+                  if (this._turnFinishedCleanly) {
+                      return;
+                  }
+                  this._reconnectStream();
                   return;
               }
               this._buffer = this._buffer + this._decoder.decode(result.value, { stream: true });
@@ -7877,7 +7930,9 @@
                       }
                       if (data.finished) {
                           // Primary unlock signal: the turn is over and the server released
-                          // the turn lock. The SSE stream closes right after this chunk.
+                          // the turn lock. The SSE stream closes right after this chunk. Mark
+                          // it clean so the imminent `result.done` doesn't trigger a reconnect.
+                          this._turnFinishedCleanly = true;
                           this._finishStream();
                       }
                   }
@@ -7889,9 +7944,110 @@
               }
               this._readStreamChunk();
           }).catch((err) => {
-              if (err.name !== 'AbortError') {
-                  this._handleStreamError(err.message);
+              if (err.name === 'AbortError') {
+                  return;
+              }
+              // A read error mid-turn is a drop, not a completion — reconnect (same as a
+              // clean `done` without a finished chunk) unless the turn already finished.
+              if (!this._turnFinishedCleanly) {
+                  this._reconnectStream();
+                  return;
+              }
+              this._handleStreamError(err.message);
+          });
+      }
+      /**
+       * Reconnect to an in-flight turn after the SSE stream dropped without finishing
+       * (5-min emitter timeout, tab backgrounded, network blip). Hits the read-only
+       * `/stream/attach/{conversationID}` endpoint, which re-attaches a fresh SSE
+       * connection to the still-running server-side turn without starting anything new.
+       *
+       * - 200 with a body → resume reading; the turn's events keep flowing (events
+       *   emitted during the gap are not replayed, so the live text may jump forward —
+       *   the full transcript reconciles from the DB when the turn ends).
+       * - 204 → no live turn: it already finished server-side while we were
+       *   disconnected. Reload the transcript so the final answer appears, then unlock.
+       * - failure / retry cap hit → give up and finish so the composer never wedges.
+       *
+       * The composer stays locked (`_isStreaming` untouched) throughout, so the input
+       * never looks ready while the AI is still working.
+       */
+      _reconnectStream() {
+          // Without a pinned conversation there's nothing to re-attach to (a custom
+          // `send` owns its own targeting). Fall back to finishing.
+          if (!this.conversationId) {
+              this._finishStream();
+              return;
+          }
+          // Bound the retries so a genuinely dead turn can't loop forever.
+          if (this._reconnectAttempts >= 5) {
+              this._handleStreamError('Lost connection to the assistant. Please reload the conversation.');
+              return;
+          }
+          this._reconnectAttempts = this._reconnectAttempts + 1;
+          krubbleHttp.Http.fetch({
+              url: `/api/system/integration/aws/bedrock/stream/attach/${this.conversationId}`,
+              method: 'GET',
+              headers: { Accept: 'text/event-stream' },
+          }).then((response) => {
+              // 204 No Content: the turn finished server-side during the gap. Pull the
+              // final transcript from the DB (via the same `load` callback the component
+              // initializes with) so the answer that streamed during the disconnect
+              // appears, then unlock.
+              if (response.status === 204) {
+                  this._reconnectAttempts = 0;
+                  if (this.load) {
+                      this.load().then((messages) => {
+                          this.messages = messages;
+                          this.requestUpdate();
+                      }).catch(() => {
+                          // Reload failed — leave the transcript as-is; the user can refresh manually.
+                      });
+                  }
+                  this._finishStream();
+                  return;
+              }
+              if (!response.ok || !response.body) {
+                  // Transient failure — back off and try again on the same drop.
+                  setTimeout(() => this._reconnectStream(), 1000);
+                  return;
+              }
+              // Re-attached to the live turn: reset the retry counter and resume reading
+              // into the same buffer/decoder from the fresh stream. Mark streaming so the
+              // composer locks and the typing indicator shows — load-triggered attaches (a
+              // page reloaded mid-turn) start with _isStreaming false, so this is what
+              // surfaces "the AI is still working"; on a mid-session drop it's already true
+              // (a no-op).
+              this._reconnectAttempts = 0;
+              this._isStreaming = true;
+              this._reader = response.body.getReader();
+              this._decoder = new TextDecoder();
+              this._buffer = '';
+              // Close the gap: events the turn emitted between the drop and this re-attach
+              // aren't replayed on the live stream. Every COMPLETED iteration during the
+              // gap was persisted (assistant text, tool_use/tool_result rows), so reload the
+              // transcript from the DB to backfill them, THEN start reading live. Ordering
+              // matters — the reader buffers incoming bytes until _readStreamChunk runs, so
+              // starting live only after the async reload resolves prevents the reload from
+              // clobbering freshly-streamed chunks. Only the current in-flight iteration's
+              // partial text is missing from the reload; it streams live from here.
+              if (this.load) {
+                  this.load().then((messages) => {
+                      this.messages = messages;
+                      this.requestUpdate();
+                      this._readStreamChunk();
+                  }).catch(() => {
+                      // Reload failed — go live anyway; the gap's completed iterations just
+                      // won't show until the next full reload, but the turn keeps streaming.
+                      this._readStreamChunk();
+                  });
+              }
+              else {
+                  this._readStreamChunk();
               }
+          }).catch(() => {
+              // Network error reaching the attach endpoint — back off and retry.
+              setTimeout(() => this._reconnectStream(), 1000);
           });
       }
       /**