clay-server 2.27.1 → 2.28.0-beta.1

package/lib/public/index.html

@@ -1672,6 +1672,7 @@
     <div class="ralph-preview-tabs">
       <button class="ralph-tab active" data-tab="prompt">PROMPT.md</button>
       <button class="ralph-tab" data-tab="judge">JUDGE.md</button>
+      <button class="ralph-tab" data-tab="model">Model</button>
     </div>
     <div id="ralph-preview-body" class="ralph-preview-body"></div>
     <div class="ralph-preview-footer" id="ralph-preview-footer">
@@ -1899,8 +1900,6 @@
     <div class="sched-create-date-chips">
       <input type="date" class="sched-create-date-input" id="sched-create-date-picker" value="">
       <input type="time" class="sched-create-time-input" id="sched-create-time" value="09:00">
-      <button class="sched-create-recurrence-btn" id="sched-create-recurrence-btn" title="Recurrence"><i data-lucide="repeat"></i></button>
-      <button class="sched-create-interval-btn" id="sched-create-interval-btn" title="Interval"><i data-lucide="timer"></i></button>
     </div>
     <button class="sched-create-close-btn" id="sched-create-cancel" title="Close"><i data-lucide="x"></i></button>
   </div>
@@ -1925,7 +1924,7 @@
     </div>
     <input type="text" class="sched-create-title-input" id="sched-create-title" placeholder="Schedule Title" maxlength="80" spellcheck="false" autocomplete="off">
   </div>
-  <!-- Task (JS dropdown) -->
+  <!-- Task -->
   <div class="sched-create-row">
     <i data-lucide="list-todo" class="sched-create-row-icon"></i>
     <div class="sched-create-task-dropdown" id="sched-create-task-wrap">
@@ -1937,31 +1936,40 @@
       <div class="sched-create-task-list hidden" id="sched-create-task-list"></div>
     </div>
   </div>
-  <!-- Description -->
+  <!-- Review toggle -->
   <div class="sched-create-row">
+    <div class="sched-create-row-icon-spacer"></div>
+    <label class="sched-review-toggle">
+      <input type="checkbox" id="sched-review-check">
+      <span class="sched-review-label">Review multiple times</span>
+      <span class="sched-review-count hidden" id="sched-review-count">
+        <input type="number" id="sched-create-iterations" min="2" max="100" value="3" class="sched-create-iter-input">
+        <span class="sched-create-iter-hint">x</span>
+      </span>
+    </label>
+  </div>
+  <!-- Description (shown only when editing a record that has one) -->
+  <div class="sched-create-row hidden" id="sched-create-desc-row">
     <i data-lucide="align-left" class="sched-create-row-icon"></i>
-    <textarea class="sched-create-row-textarea" id="sched-create-desc" rows="3" placeholder="Description"></textarea>
+    <textarea class="sched-create-row-textarea" id="sched-create-desc" rows="2" placeholder="Description"></textarea>
   </div>
-  <!-- Bottom bar -->
-  <div class="sched-create-bottom">
-    <div class="sched-create-bottom-left">
-      <div class="sched-create-run-mode">
-        <button type="button" class="sched-run-mode-btn active" data-mode="single" title="Run once without iteration"><i data-lucide="play"></i> Single run</button>
-        <button type="button" class="sched-run-mode-btn" data-mode="multi" title="Run multiple iterations with a judge reviewing each round"><i data-lucide="repeat"></i> Multi-round</button>
-        <label class="sched-create-iter-label hidden" id="sched-create-iter-group">
-          <input type="number" id="sched-create-iterations" min="2" max="100" value="3" class="sched-create-iter-input">
-          <span class="sched-create-iter-hint">rounds</span>
-        </label>
+  <!-- Repeat accordion -->
+  <div class="sched-accordion" id="sched-accordion-repeat">
+    <div class="sched-accordion-divider"></div>
+    <button class="sched-accordion-header" id="sched-accordion-repeat-header" type="button">
+      <div class="sched-accordion-header-left">
+        <i data-lucide="repeat" class="sched-accordion-icon"></i>
+        <div class="sched-accordion-text">
+          <span class="sched-accordion-title">Repeat</span>
+          <span class="sched-accordion-subtitle" id="sched-accordion-repeat-subtitle">Which days to run</span>
+        </div>
       </div>
-    </div>
-    <div class="sched-create-bottom-right">
-      <button class="sched-create-delete-btn hidden" id="sched-create-delete" title="Delete"><i data-lucide="trash-2"></i></button>
-      <button class="sched-create-save-btn" id="sched-create-submit">Save</button>
-    </div>
-  </div>
-  <!-- Recurrence dropdown -->
-  <div class="sched-create-recurrence-dropdown hidden" id="sched-create-recurrence-dropdown">
-    <div class="sched-custom-repeat-panel" id="sched-custom-repeat-panel">
+      <div class="sched-accordion-header-right">
+        <span class="sched-accordion-clear hidden" id="sched-accordion-repeat-clear" title="Clear"><i data-lucide="x"></i></span>
+        <i data-lucide="chevron-right" class="sched-accordion-chevron"></i>
+      </div>
+    </button>
+    <div class="sched-accordion-body hidden" id="sched-accordion-repeat-body">
       <div class="sched-custom-row">
         <span class="sched-custom-label">Every</span>
         <input type="number" class="sched-custom-interval" id="sched-custom-interval" value="1" min="1" max="99">
@@ -2006,7 +2014,6 @@
           <span class="sched-custom-end-after-suffix">times</span>
         </div>
       </div>
-      <!-- Inline calendar for "Until" date picking -->
       <div class="sched-custom-end-calendar hidden" id="sched-custom-end-calendar">
         <div class="sched-cal-header">
           <span class="sched-cal-title" id="sched-cal-title">April 2026</span>
@@ -2020,48 +2027,65 @@
         </div>
         <div class="sched-cal-grid" id="sched-cal-grid"></div>
       </div>
-      <div class="sched-custom-actions">
-        <button class="sched-btn sched-btn-cancel" id="sched-custom-cancel">Cancel</button>
-        <button class="sched-btn sched-btn-save" id="sched-custom-ok">OK</button>
-      </div>
     </div>
   </div>
-  <!-- Interval dropdown -->
-  <div class="sched-create-interval-dropdown hidden" id="sched-create-interval-dropdown">
-    <div class="sched-interval-custom-row">
-      <span class="sched-custom-label">Every</span>
-      <input type="number" class="sched-custom-interval" id="sched-interval-custom-value" value="10" min="1" max="999">
-      <div class="sched-interval-unit-toggle" id="sched-interval-custom-unit">
-        <button type="button" class="sched-interval-seg active" data-unit="minute">min</button><button type="button" class="sched-interval-seg" data-unit="hour">hrs</button>
+  <!-- Interval accordion -->
+  <div class="sched-accordion" id="sched-accordion-interval">
+    <div class="sched-accordion-divider"></div>
+    <button class="sched-accordion-header" id="sched-accordion-interval-header" type="button">
+      <div class="sched-accordion-header-left">
+        <i data-lucide="timer" class="sched-accordion-icon"></i>
+        <div class="sched-accordion-text">
+          <span class="sched-accordion-title">Interval</span>
+          <span class="sched-accordion-subtitle" id="sched-accordion-interval-subtitle">How often within each day</span>
+        </div>
       </div>
-    </div>
-    <div class="sched-interval-end-section hidden" id="sched-interval-end-section">
-      <div class="sched-interval-end-divider"></div>
-      <div class="sched-interval-end-options">
-        <button class="sched-interval-end-opt active" data-iend="allday">All day</button>
-        <button class="sched-interval-end-opt" data-iend="after">Stop after</button>
-        <button class="sched-interval-end-opt" data-iend="until">Stop at</button>
+      <div class="sched-accordion-header-right">
+        <span class="sched-accordion-clear hidden" id="sched-accordion-interval-clear" title="Clear"><i data-lucide="x"></i></span>
+        <i data-lucide="chevron-right" class="sched-accordion-chevron"></i>
       </div>
-      <div class="sched-interval-end-after hidden" id="sched-interval-end-after-row">
-        <input type="number" class="sched-interval-end-input" id="sched-interval-end-after" value="5" min="1" max="999">
-        <span class="sched-interval-end-label">runs</span>
+    </button>
+    <div class="sched-accordion-body hidden" id="sched-accordion-interval-body">
+      <div class="sched-interval-custom-row">
+        <span class="sched-custom-label">Every</span>
+        <input type="number" class="sched-custom-interval" id="sched-interval-custom-value" value="10" min="1" max="999">
+        <div class="sched-interval-unit-toggle" id="sched-interval-custom-unit">
+          <button type="button" class="sched-interval-seg active" data-unit="minute">min</button><button type="button" class="sched-interval-seg" data-unit="hour">hrs</button>
+        </div>
+      </div>
+      <div class="sched-interval-end-section hidden" id="sched-interval-end-section">
+        <div class="sched-interval-end-divider"></div>
+        <div class="sched-interval-end-options">
+          <button class="sched-interval-end-opt active" data-iend="allday">All day</button>
+          <button class="sched-interval-end-opt" data-iend="after">Stop after</button>
+          <button class="sched-interval-end-opt" data-iend="until">Stop at</button>
+        </div>
+        <div class="sched-interval-end-after hidden" id="sched-interval-end-after-row">
+          <input type="number" class="sched-interval-end-input" id="sched-interval-end-after" value="5" min="1" max="999">
+          <span class="sched-interval-end-label">runs</span>
+        </div>
+        <div class="sched-interval-end-until hidden" id="sched-interval-end-until-row">
+          <input type="time" class="sched-interval-end-time" id="sched-interval-end-time" value="18:00">
+        </div>
       </div>
-      <div class="sched-interval-end-until hidden" id="sched-interval-end-until-row">
-        <input type="time" class="sched-interval-end-time" id="sched-interval-end-time" value="18:00">
+      <div class="sched-skip-running-row" id="sched-skip-running-row">
+        <label class="sched-switch-label" for="sched-skip-running">
+          <div class="sched-switch">
+            <input type="checkbox" id="sched-skip-running" checked>
+            <span class="sched-switch-slider"></span>
+          </div>
+          <span class="sched-switch-text">Skip if previous run still active</span>
+        </label>
       </div>
     </div>
-    <div class="sched-skip-running-row" id="sched-skip-running-row">
-      <label class="sched-switch-label" for="sched-skip-running">
-        <div class="sched-switch">
-          <input type="checkbox" id="sched-skip-running" checked>
-          <span class="sched-switch-slider"></span>
-        </div>
-        <span class="sched-switch-text">Skip if previous run still active</span>
-      </label>
+  </div>
+  <!-- Bottom bar -->
+  <div class="sched-create-bottom">
+    <div class="sched-create-bottom-left">
+      <button class="sched-create-delete-btn hidden" id="sched-create-delete" title="Delete"><i data-lucide="trash-2"></i></button>
     </div>
-    <div class="sched-custom-actions">
-      <button class="sched-btn sched-btn-cancel" id="sched-interval-cancel">Cancel</button>
-      <button class="sched-btn sched-btn-save" id="sched-interval-ok">OK</button>
+    <div class="sched-create-bottom-right">
+      <button class="sched-create-save-btn" id="sched-create-submit">Save</button>
     </div>
   </div>
 </div>

package/lib/public/modules/app-loop-ui.js

@@ -8,6 +8,7 @@ import { getWs } from './ws-ref.js';
 import { showConfirm } from './app-misc.js';
 import { openRalphWizard } from './app-loop-wizard.js';
 import { openSchedulerToTab } from './scheduler.js';
+import { renderModelList, renderModeList, renderEffortBar, renderThinkingBar } from './settings-defaults.js';
 import { showDebateSticky } from './app-debate-ui.js';
 
 // Execution modal: module-internal UI var (not in store)
@@ -128,7 +129,11 @@ function startLoopFromUi() {
 function sendLoopStart() {
   var ws = getWs();
   if (ws && ws.readyState === 1) {
-    ws.send(JSON.stringify({ type: "loop_start", maxIterations: pendingIterations }));
+    var msg = { type: "loop_start", maxIterations: pendingIterations };
+    if (Object.keys(_previewLoopSettings).length > 0) {
+      msg.settings = _previewLoopSettings;
+    }
+    ws.send(JSON.stringify(msg));
   }
 }
 
@@ -526,10 +531,14 @@ export function updateExecModalStatus() {
 }
 
 export function openRalphPreviewModal() {
+  // Only show for loop (ralph) source, not scheduled tasks
+  var st = store.getState();
+  if (st.ralphCraftingSource !== "ralph") return;
+
   var modal = document.getElementById("ralph-preview-modal");
   if (!modal) return;
 
-  var wizData = store.getState().wizardData || {};
+  var wizData = st.wizardData || {};
   var isSimple = wizData.loopMode === "simple";
 
   // Set defaults if not yet set
@@ -557,6 +566,7 @@ export function openRalphPreviewModal() {
   var runBtn = document.getElementById("ralph-preview-run");
   if (runBtn) runBtn.disabled = !store.getState().ralphFilesReady.bothReady;
 
+  _previewLoopSettings = {};
   showRalphPreviewTab("prompt");
   modal.classList.remove("hidden");
   refreshIcons();
@@ -568,6 +578,11 @@ function closeRalphPreviewModal() {
   if (modal) modal.classList.add("hidden");
 }
 
+// Pending loop settings for the preview modal (saved to LOOP.json on launch)
+var _previewLoopSettings = {};
+
+function getPreviewLoopSettings() { return _previewLoopSettings; }
+
 function showRalphPreviewTab(tab) {
   var tabs = document.querySelectorAll("#ralph-preview-modal .ralph-tab");
   for (var i = 0; i < tabs.length; i++) {
@@ -579,6 +594,12 @@ function showRalphPreviewTab(tab) {
   }
   var body = document.getElementById("ralph-preview-body");
   if (!body) return;
+
+  if (tab === "model") {
+    renderPreviewModelTab(body);
+    return;
+  }
+
   var _rpc = store.getState().ralphPreviewContent;
   var content = tab === "prompt" ? _rpc.prompt : _rpc.judge;
   if (typeof marked !== "undefined" && marked.parse) {
@@ -587,3 +608,65 @@ function showRalphPreviewTab(tab) {
     body.textContent = content;
   }
 }
+
+function renderPreviewModelTab(bodyEl) {
+  var s = store.getState();
+
+  bodyEl.innerHTML =
+    '<div class="scheduler-model-settings">' +
+      '<div class="settings-card"><div class="settings-field">' +
+        '<label class="settings-label">Model</label>' +
+        '<div class="settings-hint">Choose the Claude model for this loop.</div>' +
+        '<div id="rp-model-list" class="settings-model-list"></div>' +
+      '</div></div>' +
+      '<div class="settings-card"><div class="settings-field">' +
+        '<label class="settings-label">Mode</label>' +
+        '<div class="settings-hint">Controls how Claude handles tool use and file edits.</div>' +
+        '<div id="rp-mode-list" class="settings-model-list"></div>' +
+      '</div></div>' +
+      '<div class="settings-card"><div class="settings-field">' +
+        '<label class="settings-label">Effort</label>' +
+        '<div class="settings-hint">Controls how much thinking effort Claude puts into responses.</div>' +
+        '<div class="settings-btn-group" id="rp-effort-bar"></div>' +
+      '</div></div>' +
+      '<div class="settings-card"><div class="settings-field">' +
+        '<label class="settings-label">Thinking</label>' +
+        '<div class="settings-hint">Controls whether Claude shows its reasoning process.</div>' +
+        '<div class="settings-btn-group" id="rp-thinking-bar"></div>' +
+        '<div id="rp-thinking-budget-row" class="settings-budget-row" style="display:none">' +
+          '<label class="settings-budget-label">Budget tokens</label>' +
+          '<input id="rp-thinking-budget" type="number" class="settings-budget-input" min="1024" max="128000" step="1024" value="10000">' +
+        '</div>' +
+      '</div></div>' +
+    '</div>';
+
+  function savePreviewSetting(key, value) {
+    _previewLoopSettings[key] = value;
+  }
+
+  var opts = {
+    models: s.currentModels || [],
+    currentModel: _previewLoopSettings.model || "",
+    currentMode: _previewLoopSettings.permissionMode || "default",
+    currentEffort: _previewLoopSettings.effort || "medium",
+    currentThinking: _previewLoopSettings.thinking || "adaptive",
+    currentThinkingBudget: _previewLoopSettings.thinkingBudget || 10000,
+    sendMsg: function (msgType, data) {
+      if (msgType === "rp_set_model") savePreviewSetting("model", data.model);
+      else if (msgType === "rp_set_mode") savePreviewSetting("permissionMode", data.mode);
+      else if (msgType === "rp_set_effort") savePreviewSetting("effort", data.effort);
+      else if (msgType === "set_thinking") {
+        savePreviewSetting("thinking", data.thinking);
+        if (data.budgetTokens) savePreviewSetting("thinkingBudget", data.budgetTokens);
+      }
+    },
+    modelMsgType: "rp_set_model",
+    modeMsgType: "rp_set_mode",
+    effortMsgType: "rp_set_effort",
+  };
+
+  renderModelList("rp", opts);
+  renderModeList("rp", opts);
+  renderEffortBar("rp", opts);
+  renderThinkingBar("rp", opts);
+}

package/lib/public/modules/app-messages.js

@@ -1467,6 +1467,7 @@ export function processMessage(msg) {
         showLoopBanner(false);
         updateLoopButton();
         enableMainInput();
+        updateLoopInputVisibility(null);
         var loopLabel = _lfbn || "Loop";
         var finishMsg = msg.reason === "pass"
           ? loopLabel + " completed successfully after " + msg.iterations + " iteration(s)."