@chrysb/alphaclaw 0.4.6-beta.6 → 0.4.6-beta.8

package/lib/public/js/components/agent-send-modal.js

@@ -0,0 +1,142 @@
+import { h } from "https://esm.sh/preact";
+import { useEffect, useState } from "https://esm.sh/preact/hooks";
+import htm from "https://esm.sh/htm";
+import { ModalShell } from "./modal-shell.js";
+import { ActionButton } from "./action-button.js";
+import { PageHeader } from "./page-header.js";
+import { CloseIcon } from "./icons.js";
+import { useAgentSessions } from "../hooks/useAgentSessions.js";
+
+const html = htm.bind(h);
+
+export const AgentSendModal = ({
+  visible = false,
+  title = "Send to agent",
+  messageLabel = "Message",
+  messageRows = 8,
+  initialMessage = "",
+  resetKey = "",
+  submitLabel = "Send message",
+  loadingLabel = "Sending...",
+  cancelLabel = "Cancel",
+  onClose = () => {},
+  onSubmit = async () => true,
+  sessionFilter = undefined,
+}) => {
+  const {
+    sessions,
+    selectedSessionKey,
+    setSelectedSessionKey,
+    selectedSession,
+    loading: loadingSessions,
+    error: loadError,
+  } = useAgentSessions({ enabled: visible, filter: sessionFilter });
+  const [messageText, setMessageText] = useState("");
+  const [sending, setSending] = useState(false);
+
+  useEffect(() => {
+    if (!visible) return;
+    setMessageText(String(initialMessage || ""));
+  }, [visible, initialMessage, resetKey]);
+
+  const handleSend = async () => {
+    if (!selectedSession || sending) return;
+    const trimmedMessage = String(messageText || "").trim();
+    if (!trimmedMessage) return;
+    setSending(true);
+    try {
+      const shouldClose = await onSubmit({
+        selectedSession,
+        selectedSessionKey,
+        message: trimmedMessage,
+      });
+      if (shouldClose !== false) {
+        onClose();
+      }
+    } finally {
+      setSending(false);
+    }
+  };
+
+  return html`
+    <${ModalShell}
+      visible=${visible}
+      onClose=${() => {
+        if (sending) return;
+        onClose();
+      }}
+      panelClassName="bg-modal border border-border rounded-xl p-5 max-w-lg w-full space-y-4"
+    >
+      <${PageHeader}
+        title=${title}
+        actions=${html`
+          <button
+            type="button"
+            onclick=${() => {
+              if (sending) return;
+              onClose();
+            }}
+            class="h-8 w-8 inline-flex items-center justify-center rounded-lg ac-btn-secondary"
+            aria-label="Close modal"
+          >
+            <${CloseIcon} className="w-3.5 h-3.5 text-gray-300" />
+          </button>
+        `}
+      />
+      <div class="space-y-2">
+        <label class="text-xs text-gray-500">Send to session</label>
+        <select
+          value=${selectedSessionKey}
+          onChange=${(event) =>
+            setSelectedSessionKey(String(event.currentTarget?.value || ""))}
+          disabled=${loadingSessions || sending}
+          class="w-full bg-black/30 border border-border rounded-lg px-3 py-2 text-xs text-gray-200 focus:border-gray-500"
+        >
+          ${sessions.length === 0
+            ? html`<option value="">No sessions available</option>`
+            : null}
+          ${sessions.map(
+            (sessionRow) => html`
+              <option value=${String(sessionRow?.key || "")}>
+                ${String(sessionRow?.label || sessionRow?.key || "Session")}
+              </option>
+            `,
+          )}
+        </select>
+        ${loadingSessions
+          ? html`<div class="text-xs text-gray-500">Loading sessions...</div>`
+          : null}
+        ${loadError ? html`<div class="text-xs text-red-400">${loadError}</div>` : null}
+      </div>
+      <div class="space-y-2">
+        <label class="text-xs text-gray-500">${messageLabel}</label>
+        <textarea
+          value=${messageText}
+          onInput=${(event) =>
+            setMessageText(String(event.currentTarget?.value || ""))}
+          disabled=${sending}
+          rows=${messageRows}
+          class="w-full bg-black/30 border border-border rounded-lg px-3 py-2 text-xs text-gray-200 focus:border-gray-500 font-mono leading-5"
+        ></textarea>
+      </div>
+      <div class="flex items-center justify-end gap-2">
+        <${ActionButton}
+          onClick=${onClose}
+          disabled=${sending}
+          tone="secondary"
+          size="md"
+          idleLabel=${cancelLabel}
+        />
+        <${ActionButton}
+          onClick=${handleSend}
+          disabled=${!selectedSession || loadingSessions || !!loadError || !String(messageText || "").trim()}
+          loading=${sending}
+          tone="primary"
+          size="md"
+          idleLabel=${submitLabel}
+          loadingLabel=${loadingLabel}
+        />
+      </div>
+    </${ModalShell}>
+  `;
+};

package/lib/public/js/components/doctor/fix-card-modal.js

@@ -1,11 +1,8 @@
 import { h } from "https://esm.sh/preact";
-import { useEffect, useState } from "https://esm.sh/preact/hooks";
 import htm from "https://esm.sh/htm";
-import { ModalShell } from "../modal-shell.js";
-import { ActionButton } from "../action-button.js";
 import { sendDoctorCardFix, updateDoctorCardStatus } from "../../lib/api.js";
 import { showToast } from "../toast.js";
-import { useAgentSessions } from "../../hooks/useAgentSessions.js";
+import { AgentSendModal } from "../agent-send-modal.js";
 
 const html = htm.bind(h);
 
@@ -15,33 +12,15 @@ export const DoctorFixCardModal = ({
   onClose = () => {},
   onComplete = () => {},
 }) => {
-  const {
-    sessions,
-    selectedSessionKey,
-    setSelectedSessionKey,
-    selectedSession,
-    loading: loadingSessions,
-    error: loadError,
-  } = useAgentSessions({ enabled: visible });
-
-  const [sending, setSending] = useState(false);
-  const [promptText, setPromptText] = useState("");
-
-  useEffect(() => {
-    if (!visible) return;
-    setPromptText(String(card?.fixPrompt || ""));
-  }, [visible, card?.fixPrompt, card?.id]);
-
-  const handleSend = async () => {
-    if (!card?.id || sending) return;
+  const handleSend = async ({ selectedSession, message }) => {
+    if (!card?.id) return false;
     try {
-      setSending(true);
       await sendDoctorCardFix({
         cardId: card.id,
         sessionId: selectedSession?.sessionId || "",
         replyChannel: selectedSession?.replyChannel || "",
         replyTo: selectedSession?.replyTo || "",
-        prompt: promptText,
+        prompt: message,
       });
       try {
         await updateDoctorCardStatus({ cardId: card.id, status: "fixed" });
@@ -57,77 +36,24 @@ export const DoctorFixCardModal = ({
         );
       }
       await onComplete();
-      onClose();
+      return true;
     } catch (error) {
       showToast(error.message || "Could not send Doctor fix request", "error");
-    } finally {
-      setSending(false);
+      return false;
     }
   };
 
   return html`
-    <${ModalShell}
+    <${AgentSendModal}
       visible=${visible}
+      title="Ask agent to fix"
+      messageLabel="Instructions"
+      initialMessage=${String(card?.fixPrompt || "")}
+      resetKey=${String(card?.id || "")}
+      submitLabel="Send fix request"
+      loadingLabel="Sending..."
       onClose=${onClose}
-      panelClassName="bg-modal border border-border rounded-xl p-5 max-w-lg w-full space-y-4"
-    >
-      <div class="space-y-1">
-        <h2 class="text-base font-semibold">Ask agent to fix</h2>
-        <p class="text-xs text-gray-400">
-          Send this Doctor finding to one of your agent sessions as a focused fix request.
-        </p>
-      </div>
-      <div class="space-y-2">
-        <label class="text-xs text-gray-500">Send to session</label>
-        <select
-          value=${selectedSessionKey}
-          onChange=${(event) => setSelectedSessionKey(String(event.currentTarget?.value || ""))}
-          disabled=${loadingSessions || sending}
-          class="w-full bg-black/30 border border-border rounded-lg px-3 py-2 text-xs text-gray-200 focus:border-gray-500"
-        >
-          ${sessions.map(
-            (sessionRow) => html`
-              <option value=${String(sessionRow?.key || "")}>
-                ${String(sessionRow?.label || sessionRow?.key || "Session")}
-              </option>
-            `,
-          )}
-        </select>
-        ${
-          loadingSessions
-            ? html`<div class="text-xs text-gray-500">Loading sessions...</div>`
-            : null
-        }
-        ${loadError ? html`<div class="text-xs text-red-400">${loadError}</div>` : null}
-      </div>
-      <div class="space-y-2">
-        <label class="text-xs text-gray-500">Instructions</label>
-        <textarea
-          value=${promptText}
-          onInput=${(event) => setPromptText(String(event.currentTarget?.value || ""))}
-          disabled=${sending}
-          rows="8"
-          class="w-full bg-black/30 border border-border rounded-lg px-3 py-2 text-xs text-gray-200 focus:border-gray-500 font-mono leading-5"
-        ></textarea>
-      </div>
-      <div class="flex items-center justify-end gap-2">
-        <${ActionButton}
-          onClick=${onClose}
-          disabled=${sending}
-          tone="secondary"
-          size="md"
-          idleLabel="Cancel"
-        />
-        <${ActionButton}
-          onClick=${handleSend}
-          disabled=${!selectedSession || loadingSessions || !!loadError || !String(promptText || "").trim()}
-          loading=${sending}
-          tone="primary"
-          size="md"
-          idleLabel="Send fix request"
-          loadingLabel="Sending..."
-        />
-      </div>
-    </${ModalShell}>
+      onSubmit=${handleSend}
+    />
   `;
 };

package/lib/public/js/components/doctor/helpers.js

@@ -1,12 +1,16 @@
 export const getDoctorPriorityTone = (priority = "") => {
-  const normalized = String(priority || "").trim().toUpperCase();
+  const normalized = String(priority || "")
+    .trim()
+    .toUpperCase();
   if (normalized === "P0") return "danger";
   if (normalized === "P1") return "warning";
   return "neutral";
 };
 
 export const getDoctorStatusTone = (status = "") => {
-  const normalized = String(status || "").trim().toLowerCase();
+  const normalized = String(status || "")
+    .trim()
+    .toLowerCase();
   if (normalized === "fixed") return "success";
   if (normalized === "dismissed") return "neutral";
   return "warning";
@@ -35,7 +39,9 @@ export const formatDoctorCategory = (category = "") => {
 export const buildDoctorPriorityCounts = (cards = []) =>
   cards.reduce(
     (totals, card) => {
-      const priority = String(card?.priority || "").trim().toUpperCase();
+      const priority = String(card?.priority || "")
+        .trim()
+        .toUpperCase();
       if (priority === "P0" || priority === "P1" || priority === "P2") {
         totals[priority] += 1;
       }
@@ -47,7 +53,9 @@ export const buildDoctorPriorityCounts = (cards = []) =>
 export const groupDoctorCardsByStatus = (cards = []) =>
   cards.reduce(
     (groups, card) => {
-      const status = String(card?.status || "open").trim().toLowerCase();
+      const status = String(card?.status || "open")
+        .trim()
+        .toLowerCase();
       if (status === "fixed") {
         groups.fixed.push(card);
         return groups;
@@ -74,13 +82,71 @@ export const shouldShowDoctorWarning = (
 
 export const getDoctorWarningMessage = (doctorStatus = null) => {
   if (!doctorStatus) return "";
-  const changedFilesCount = Number(doctorStatus.changeSummary?.changedFilesCount || 0);
+  const changedFilesCount = Number(
+    doctorStatus.changeSummary?.changedFilesCount || 0,
+  );
   if (changedFilesCount > 0) {
     return `Drift Doctor has not been run in the last week and ${changedFilesCount} file${changedFilesCount === 1 ? "" : "s"} changed since the last review.`;
   }
   return "Doctor has not been run in the last week.";
 };
 
+export const formatDoctorCharCount = (value = 0) =>
+  `${Number(value || 0).toLocaleString()} chars`;
+
+const isManagedBootstrapContextPath = (filePath = "") =>
+  String(filePath || "").startsWith("hooks/bootstrap/");
+
+export const getDoctorBootstrapTruncationItems = (doctorStatus = null) => {
+  const bootstrapContext = doctorStatus?.bootstrapContext;
+  const truncatedFiles = (bootstrapContext?.activeTruncatedFiles || []).filter(
+    (file) => !isManagedBootstrapContextPath(file?.path),
+  );
+  const nearLimitFiles = (bootstrapContext?.activeNearLimitFiles || []).filter(
+    (file) => !isManagedBootstrapContextPath(file?.path),
+  );
+  return [
+    ...truncatedFiles.map((file) => ({
+      path: file.path,
+      size: formatDoctorCharCount(file.rawChars),
+      statusText: `-${Number(
+        Math.max(
+          0,
+          Number(file.rawChars || 0) - Number(file.injectedChars || 0),
+        ),
+      ).toLocaleString()} cut`,
+      statusTone: "danger",
+    })),
+    ...nearLimitFiles.map((file) => ({
+      path: file.path,
+      size: formatDoctorCharCount(file.rawChars),
+      statusText: "Near limit",
+      statusTone: "warning",
+    })),
+  ];
+};
+
+export const hasDoctorBootstrapWarnings = (doctorStatus = null) =>
+  getDoctorBootstrapTruncationItems(doctorStatus).length > 0;
+
+export const getDoctorBootstrapWarningTitle = (doctorStatus = null) => {
+  const items = getDoctorBootstrapTruncationItems(doctorStatus);
+  if (!items.length) return "";
+  const hasTruncatedItems = items.some((item) => item.statusTone === "danger");
+  const hasNearLimitItems = items.some((item) => item.statusTone === "warning");
+  if (hasTruncatedItems && hasNearLimitItems) {
+    return "Some of your main files are being truncated or nearing the limit:";
+  }
+  if (hasNearLimitItems) {
+    return items.length === 1
+      ? "One of your main files is nearing the limit:"
+      : "Some of your main files are nearing the limit:";
+  }
+  return items.length === 1
+    ? "One of your main files is being truncated:"
+    : "Some of your main files are being truncated:";
+};
+
 export const getDoctorChangeLabel = (changeSummary = null) => {
   const changedFilesCount = Number(changeSummary?.changedFilesCount || 0);
   if (changedFilesCount === 0) return "No changes since last run";

package/lib/public/js/components/doctor/index.js

@@ -20,8 +20,11 @@ import { DoctorFixCardModal } from "./fix-card-modal.js";
 import {
   buildDoctorRunMarkers,
   buildDoctorStatusFilterOptions,
+  getDoctorBootstrapTruncationItems,
+  getDoctorBootstrapWarningTitle,
   getDoctorChangeLabel,
   getDoctorRunPillDetail,
+  hasDoctorBootstrapWarnings,
   shouldShowDoctorWarning,
 } from "./helpers.js";
 
@@ -182,6 +185,18 @@ export const DoctorTab = ({ isActive = false, onOpenFile = () => {} }) => {
     () => shouldShowDoctorWarning(doctorStatus, 0),
     [doctorStatus],
   );
+  const showBootstrapTruncationBanner = useMemo(
+    () => hasDoctorBootstrapWarnings(doctorStatus),
+    [doctorStatus],
+  );
+  const bootstrapTruncationMessage = useMemo(
+    () => getDoctorBootstrapWarningTitle(doctorStatus),
+    [doctorStatus],
+  );
+  const bootstrapTruncationItems = useMemo(
+    () => getDoctorBootstrapTruncationItems(doctorStatus),
+    [doctorStatus],
+  );
   const hasCompletedDoctorRun = !!doctorStatus?.lastRunAt;
   const hasRuns = runs.length > 0;
   const hasLoadedRuns = runsPoll.data !== null || runsPoll.error !== null;
@@ -312,29 +327,76 @@ export const DoctorTab = ({ isActive = false, onOpenFile = () => {} }) => {
         : null}
       ${!showInitialLoadingState && hasRuns
         ? html`
-            <${DoctorSummaryCards} cards=${openCards} />
-            <div class="space-y-2">
-              ${hasCompletedDoctorRun
-                ? html`
-                    <div
-                      class="bg-surface border border-border rounded-xl p-4 flex flex-wrap items-center justify-between gap-3"
-                    >
-                      <span class="text-xs text-gray-500">
-                        Last run ·${" "}
-                        <span class="text-gray-300">
-                          ${formatLocaleDateTime(doctorStatus?.lastRunAt, {
-                            fallback: "Never",
-                          })}
+            <div class="space-y-3">
+              <${DoctorSummaryCards} cards=${openCards} />
+              <div class="space-y-3">
+                ${hasCompletedDoctorRun
+                  ? html`
+                      <div
+                        class="bg-surface border border-border rounded-xl p-4 flex flex-wrap items-center justify-between gap-3"
+                      >
+                        <span class="text-xs text-gray-500">
+                          Last run ·${" "}
+                          <span class="text-gray-300">
+                            ${formatLocaleDateTime(doctorStatus?.lastRunAt, {
+                              fallback: "Never",
+                            })}
+                          </span>
                         </span>
-                      </span>
-                      <span class="text-xs text-gray-500">
-                        ${changeLabel}
-                      </span>
-                    </div>
-                  `
-                : null}
-              ${
-                showDoctorStaleBanner
+                        <span class="text-xs text-gray-500">
+                          ${changeLabel}
+                        </span>
+                      </div>
+                      ${showBootstrapTruncationBanner
+                        ? html`
+                            <div
+                              class="bg-surface border border-border rounded-xl p-4 space-y-3"
+                            >
+                              <div class="text-xs text-gray-400">
+                                ⚠️ ${bootstrapTruncationMessage}
+                              </div>
+                              <div class="space-y-2">
+                                ${bootstrapTruncationItems.map(
+                                  (item) => html`
+                                    <div
+                                      class="flex items-center justify-between gap-3 text-xs"
+                                    >
+                                      <button
+                                        type="button"
+                                        class="font-mono text-gray-200 ac-tip-link hover:underline text-left cursor-pointer"
+                                        onClick=${() => onOpenFile(String(item.path || ""))}
+                                      >
+                                        ${item.path}
+                                      </button>
+                                      <span
+                                        class="flex items-center gap-3 whitespace-nowrap"
+                                      >
+                                        <span class="text-gray-500">
+                                          ${item.size}
+                                        </span>
+                                        <span
+                                          class=${item.statusTone === "warning"
+                                            ? "text-yellow-300"
+                                            : "text-red-300"}
+                                        >
+                                          ${item.statusText}
+                                        </span>
+                                      </span>
+                                    </div>
+                                  `,
+                                )}
+                              </div>
+                              <div class="border-t border-border"></div>
+                              <p class="text-xs text-gray-500 leading-5">
+                                Truncated files become partially hidden from
+                                your agent and could cause drift.
+                              </p>
+                            </div>
+                          `
+                        : null}
+                    `
+                  : null}
+                ${showDoctorStaleBanner
                   ? html`
                       <div
                         class="text-xs text-yellow-300 bg-yellow-500/10 border border-yellow-500/35 rounded-lg px-3 py-2"
@@ -344,8 +406,8 @@ export const DoctorTab = ({ isActive = false, onOpenFile = () => {} }) => {
                         changed.
                       </div>
                     `
-                  : null
-              }
+                  : null}
+              </div>
             </div>
           `
         : null}
@@ -461,9 +523,7 @@ export const DoctorTab = ({ isActive = false, onOpenFile = () => {} }) => {
               ${selectedRunIsInProgress
                 ? html`
                     <div class="ac-surface-inset rounded-xl p-4">
-                      <div
-                        class="text-xs leading-5 text-gray-400"
-                      >
+                      <div class="text-xs leading-5 text-gray-400">
                         <span
                           >Run in progress. Findings will appear when analysis
                           completes.</span
@@ -479,7 +539,8 @@ export const DoctorTab = ({ isActive = false, onOpenFile = () => {} }) => {
                   onAskAgentFix=${setFixCard}
                   onUpdateStatus=${handleUpdateStatus}
                   onOpenFile=${onOpenFile}
-                  changedPaths=${doctorStatus?.changeSummary?.changedPaths || []}
+                  changedPaths=${doctorStatus?.changeSummary?.changedPaths ||
+                  []}
                   showRunMeta=${selectedRunFilter === "all"}
                   hideEmptyState=${selectedRunIsInProgress}
                 />

package/lib/public/js/components/gateway.js

@@ -326,6 +326,7 @@ export const Gateway = ({
   const showInspectButton = watchdogHealth === "degraded" && !!onOpenWatchdog;
   const showRepairButton =
     isRepairInProgress ||
+    (watchdogStatus?.health === "degraded" && !onOpenWatchdog) ||
     watchdogStatus?.lifecycle === "crash_loop" ||
     watchdogStatus?.health === "unhealthy" ||
     watchdogStatus?.health === "crashed";

package/lib/public/js/components/google/gmail-setup-wizard.js

@@ -81,6 +81,7 @@ export const GmailSetupWizard = ({
 }) => {
   const [step, setStep] = useState(0);
   const [projectIdInput, setProjectIdInput] = useState("");
+  const [editingProjectId, setEditingProjectId] = useState(false);
   const [localError, setLocalError] = useState("");
   const [projectIdResolved, setProjectIdResolved] = useState(false);
   const [watchEnabled, setWatchEnabled] = useState(false);
@@ -100,6 +101,7 @@ export const GmailSetupWizard = ({
     setStep(0);
     setLocalError("");
     setProjectIdInput("");
+    setEditingProjectId(false);
     setProjectIdResolved(false);
     setWatchEnabled(false);
     setSendingToAgent(false);
@@ -110,10 +112,11 @@ export const GmailSetupWizard = ({
   const hasProjectIdFromConfig = Boolean(
     String(clientConfig?.projectId || "").trim() || commands,
   );
-  const needsProjectId = !hasProjectIdFromConfig && !projectIdResolved;
+  const needsProjectId =
+    editingProjectId || (!hasProjectIdFromConfig && !projectIdResolved);
   const detectedProjectId =
-    String(clientConfig?.projectId || "").trim() ||
     String(projectIdInput || "").trim() ||
+    String(clientConfig?.projectId || "").trim() ||
     "<project-id>";
   const client =
     String(account?.client || clientConfig?.client || "default").trim() ||
@@ -135,6 +138,13 @@ export const GmailSetupWizard = ({
     showToast("Could not copy text", "error");
   }, []);
 
+  const handleChangeProjectId = useCallback(() => {
+    setLocalError("");
+    setProjectIdInput(String(clientConfig?.projectId || "").trim());
+    setProjectIdResolved(false);
+    setEditingProjectId(true);
+  }, [clientConfig?.projectId]);
+
   const handleFinish = async () => {
     try {
       setLocalError("");
@@ -159,6 +169,7 @@ export const GmailSetupWizard = ({
           client,
           projectId: String(projectIdInput || "").trim(),
         });
+        setEditingProjectId(false);
         setProjectIdResolved(true);
       } catch (err) {
         setLocalError(err.message || "Could not save project id");
@@ -230,7 +241,9 @@ export const GmailSetupWizard = ({
               <div
                 class="rounded-lg border border-border bg-black/20 p-3 space-y-2"
               >
-                <div class="text-sm">Project ID required</div>
+                <div class="text-sm">
+                  ${editingProjectId ? "Change project ID" : "Project ID required"}
+                </div>
                 <div class="text-xs text-gray-500">
                   Find it in the${" "}
                   <a
@@ -257,6 +270,9 @@ export const GmailSetupWizard = ({
         !needsProjectId && step === 0
           ? html`
               <div class="space-y-1">
+                <div class="text-xs text-gray-500">
+                  Using project <code>${detectedProjectId}</code>.
+                </div>
                 <div class="text-xs text-gray-500">
                   If <code>gcloud</code> is not installed on your computer,
                   follow the official install guide:${" "}
@@ -372,7 +388,15 @@ export const GmailSetupWizard = ({
       }
       <div class="grid grid-cols-2 gap-2 pt-2">
         ${step === 0
-          ? html`<div></div>`
+          ? html`${!needsProjectId
+              ? html`<button
+                  type="button"
+                  onclick=${handleChangeProjectId}
+                  class="justify-self-start text-xs px-2 py-1 rounded-lg ac-btn-ghost"
+                >
+                  Change project ID
+                </button>`
+              : html`<div></div>`}`
           : html`<${ActionButton}
               onClick=${() => setStep((prev) => Math.max(prev - 1, 0))}
               disabled=${saving}