palmier 0.7.8 → 0.7.9

package/palmier-server/pwa/src/components/PullToRefreshIndicator.tsx

@@ -0,0 +1,46 @@
+interface Props {
+  pullDistance: number;
+  refreshing: boolean;
+  threshold: number;
+}
+
+/**
+ * Fixed-position indicator parked just above the viewport that slides down as
+ * the user pulls. Opacity ramps up quickly so the badge peeks in immediately;
+ * the arrow flips upward once the pull has crossed the release threshold.
+ */
+export default function PullToRefreshIndicator({ pullDistance, refreshing, threshold }: Props) {
+  const visible = pullDistance > 0 || refreshing;
+  const ready = pullDistance >= threshold;
+  return (
+    <div
+      className="pull-to-refresh"
+      style={{
+        transform: `translateY(${pullDistance}px)`,
+        opacity: visible ? Math.min(1, pullDistance / 30) : 0,
+      }}
+      aria-hidden={!visible}
+    >
+      <div className="pull-to-refresh-badge">
+        {refreshing ? (
+          <div className="spinner" />
+        ) : (
+          <svg
+            width="18"
+            height="18"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            strokeWidth="2.25"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+            style={{ transform: ready ? "rotate(180deg)" : "rotate(0deg)", transition: "transform 0.15s" }}
+          >
+            <line x1="12" y1="5" x2="12" y2="19" />
+            <polyline points="19 12 12 19 5 12" />
+          </svg>
+        )}
+      </div>
+    </div>
+  );
+}

package/palmier-server/pwa/src/components/RunDetailView.tsx

@@ -30,8 +30,33 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
   const [followupText, setFollowupText] = useState("");
   const [sendingFollowup, setSendingFollowup] = useState(false);
   const threadRef = useRef<HTMLDivElement>(null);
+  const followupInputRef = useRef<HTMLInputElement>(null);
+  // Tracks which runId we've already scrolled-and-focused for, so new messages
+  // during the session don't steal focus back to the input.
+  const initialFocusForRunId = useRef<string | null>(null);
+
+  // Resolve the "latest" sentinel to an actual run_id. `undefined` = still
+  // resolving, `null` = task has no runs yet (empty state), otherwise the id
+  // to load.
+  const [resolvedRunId, setResolvedRunId] = useState<string | null | undefined>(
+    runId === "latest" ? undefined : runId,
+  );
+  const isLatestEmpty = runId === "latest" && resolvedRunId === null;
+
+  useEffect(() => {
+    if (runId !== "latest") {
+      setResolvedRunId(runId);
+      return;
+    }
+    if (!connected) return;
+    setResolvedRunId(undefined);
+    request<{ entries?: Array<{ run_id: string }> }>("taskrun.list", { task_id: taskId, limit: 1 })
+      .then((result) => setResolvedRunId(result.entries?.[0]?.run_id ?? null))
+      .catch(() => setResolvedRunId(null));
+  }, [runId, taskId, connected, request]);
 
   async function fetchData() {
+    if (!resolvedRunId) return;
     try {
       const result = await request<{
         messages?: ConversationMessage[];
@@ -40,7 +65,7 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
         running_state?: string;
         agent?: string;
         error?: string;
-      }>("task.result", { id: taskId, run_id: runId });
+      }>("task.result", { id: taskId, run_id: resolvedRunId });
 
       if (result.error) {
         console.error("No result:", result.error);
@@ -59,9 +84,10 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
   }
 
   async function openReport(file: string) {
+    if (!resolvedRunId) return;
     try {
       const result = await request<{ reports: Array<{ file: string; content?: string; data_url?: string }> }>(
-        "task.reports", { id: taskId, run_id: runId, report_files: [file] },
+        "task.reports", { id: taskId, run_id: resolvedRunId, report_files: [file] },
       );
       const report = result.reports?.[0];
       if (report?.data_url) {
@@ -74,30 +100,28 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
     }
   }
 
-  // Initial load
+  // Initial load once resolvedRunId becomes a concrete id.
   useEffect(() => {
-    if (connected) {
-      setLoading(true);
-      fetchData();
-    }
-  }, [connected, taskId, runId]);
+    if (!connected || !resolvedRunId) return;
+    setLoading(true);
+    fetchData();
+  }, [connected, taskId, resolvedRunId]);
 
   // Live-update when the viewed task's state changes
   useEffect(() => {
-    if (!connected || !hostId) return;
+    if (!connected || !hostId || !resolvedRunId) return;
     const unsubscribe = subscribeEvents(hostId, async (msg) => {
       try {
         const parsed = JSON.parse(new TextDecoder().decode(msg.data)) as { event_type?: string; run_id?: string };
         if (parsed.event_type !== "running-state" && parsed.event_type !== "result-updated") return;
         const eventTaskId = msg.subject.split(".").pop();
         if (eventTaskId !== taskId) return;
-        // result-updated events are scoped to a specific result file
-        if (parsed.event_type === "result-updated" && parsed.run_id && parsed.run_id !== runId) return;
+        if (parsed.event_type === "result-updated" && parsed.run_id && parsed.run_id !== resolvedRunId) return;
         fetchData();
       } catch { /* skip */ }
     });
     return unsubscribe;
-  }, [connected, hostId, taskId, subscribeEvents, request]);
+  }, [connected, hostId, taskId, resolvedRunId, subscribeEvents, request]);
 
   // Auto-scroll to bottom when messages change
   useEffect(() => {
@@ -106,6 +130,19 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
     }
   }, [messages]);
 
+  // On first load of a run, scroll the window to the bottom so the follow-up
+  // input is visible, and focus the input if it's rendered (agent not running).
+  useEffect(() => {
+    if (loading || isLatestEmpty || !resolvedRunId) return;
+    if (initialFocusForRunId.current === resolvedRunId) return;
+    initialFocusForRunId.current = resolvedRunId;
+    requestAnimationFrame(() => {
+      if (threadRef.current) threadRef.current.scrollTop = threadRef.current.scrollHeight;
+      window.scrollTo({ top: document.documentElement.scrollHeight, behavior: "auto" });
+      if (!isAgentGenerating) followupInputRef.current?.focus();
+    });
+  }, [loading, isLatestEmpty, resolvedRunId, isAgentGenerating]);
+
   function typeLabel(type?: string): string | undefined {
     if (type === "input") return "User Input";
     if (type === "permission") return "Permission";
@@ -133,7 +170,12 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
         Back
       </button>
 
-      {loading ? (
+      {isLatestEmpty ? (
+        <div className="empty-state">
+          <p className="empty-state-text">No runs yet</p>
+          <p className="empty-state-hint">This task hasn't been executed yet. Run it from the task menu or wait for its next trigger.</p>
+        </div>
+      ) : loading ? (
         <div style={{ display: "flex", flexDirection: "column", gap: "var(--space-sm)", padding: "var(--space-sm) 0" }}>
           <div className="skeleton-line" style={{ width: "40%" }} />
           <div className="skeleton-line" style={{ width: "55%" }} />
@@ -223,7 +265,7 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
                 onClick={async () => {
                   setAborting(true);
                   try {
-                    await request("task.stop_followup", { id: taskId, run_id: runId });
+                    await request("task.stop_followup", { id: taskId, run_id: resolvedRunId });
                   } catch (err) {
                     console.error("Stop failed:", err);
                   } finally {
@@ -243,7 +285,7 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
                 if (!msg || sendingFollowup) return;
                 setSendingFollowup(true);
                 try {
-                  await request("task.followup", { id: taskId, run_id: runId, message: msg });
+                  await request("task.followup", { id: taskId, run_id: resolvedRunId, message: msg });
                   setFollowupText("");
                 } catch (err) {
                   console.error("Follow-up failed:", err);
@@ -253,6 +295,7 @@ export default function RunDetailView({ connected, hostId, request, subscribeEve
               }}
             >
               <input
+                ref={followupInputRef}
                 className="chat-input"
                 type="text"
                 placeholder="Follow-up message"

package/palmier-server/pwa/src/components/SessionComposer.tsx

@@ -38,6 +38,14 @@ export default function SessionComposer({ agents, onStarted }: SessionComposerPr
     return () => setDraftMessage(null);
   }, [prompt]);
 
+  const selectedAgent = agents.find((a) => a.key === agent);
+  const agentSupportsYolo = !!selectedAgent?.supportsYolo;
+
+  // Force-disable yolo when the selected agent doesn't support it.
+  useEffect(() => {
+    if (!agentSupportsYolo && yoloMode) setYoloMode(false);
+  }, [agentSupportsYolo, yoloMode]);
+
   const canRun = !!prompt.trim() && !!agent && !running;
 
   function confirmYolo(): boolean {
@@ -104,15 +112,17 @@ export default function SessionComposer({ agents, onStarted }: SessionComposerPr
             ))}
           </select>
         </div>
-        <label className="session-composer-yolo">
-          <input
-            type="checkbox"
-            checked={yoloMode}
-            onChange={(e) => setYoloMode(e.target.checked)}
-            disabled={running}
-          />
-          Yolo
-        </label>
+        {agentSupportsYolo && (
+          <label className="session-composer-yolo">
+            <input
+              type="checkbox"
+              checked={yoloMode}
+              onChange={(e) => setYoloMode(e.target.checked)}
+              disabled={running}
+            />
+            Yolo
+          </label>
+        )}
         <button
           className="btn btn-primary chat-send-btn"
           onClick={handleRun}
@@ -127,7 +137,7 @@ export default function SessionComposer({ agents, onStarted }: SessionComposerPr
           )}
         </button>
       </div>
-      {yoloMode && (
+      {agentSupportsYolo && yoloMode && (
         <p className="command-help-text">
           The agent will auto-approve all tool calls without asking for permission.
         </p>

package/palmier-server/pwa/src/components/{RunsView.tsx → SessionsView.tsx}

@@ -3,9 +3,11 @@ import { useNavigate } from "react-router-dom";
 import { formatTime } from "../formatTime";
 import { confirmLeaveDraft } from "../draftGuard";
 import SessionComposer from "./SessionComposer";
+import PullToRefreshIndicator from "./PullToRefreshIndicator";
+import { usePullToRefresh } from "../hooks/usePullToRefresh";
 import type { AgentInfo, HistoryEntry } from "../types";
 
-interface RunsViewProps {
+interface SessionsViewProps {
   connected: boolean;
   hostId: string | null;
   request<T = unknown>(method: string, params?: unknown, opts?: { timeout?: number }): Promise<T>;
@@ -17,7 +19,7 @@ interface RunsViewProps {
 
 const PAGE_SIZE = 10;
 
-export default function RunsView({ connected, hostId, request, subscribeEvents, agents, filterTaskId, onClearFilter }: RunsViewProps) {
+export default function SessionsView({ connected, hostId, request, subscribeEvents, agents, filterTaskId, onClearFilter }: SessionsViewProps) {
   const [entries, setEntries] = useState<HistoryEntry[]>([]);
   const [total, setTotal] = useState(0);
   const [loading, setLoading] = useState(false);
@@ -76,6 +78,11 @@ export default function RunsView({ connected, hostId, request, subscribeEvents,
     }
   }, [connected, hostId, loadHistory, filterTaskId]);
 
+  const ptr = usePullToRefresh({
+    onRefresh: () => loadHistory(0, false),
+    enabled: connected,
+  });
+
   // Real-time: update entries on running-state events
   useEffect(() => {
     if (!connected || !hostId) return;
@@ -156,6 +163,17 @@ export default function RunsView({ connected, hostId, request, subscribeEvents,
       }}
     />
   );
+  const refreshIndicator = (
+    <PullToRefreshIndicator pullDistance={ptr.pullDistance} refreshing={ptr.refreshing} threshold={ptr.threshold} />
+  );
+  const filterChip = filterTaskId && onClearFilter && (
+    <div style={{ marginBottom: "var(--space-sm)" }}>
+      <span className="sessions-filter-chip">
+        Filtered by task
+        <button onClick={onClearFilter} aria-label="Clear filter">&times;</button>
+      </span>
+    </div>
+  );
 
   function stateColor(state?: string): string | undefined {
     if (state === "failed") return "var(--color-error)";
@@ -167,6 +185,7 @@ export default function RunsView({ connected, hostId, request, subscribeEvents,
   if (loading && entries.length === 0 && connected) {
     return (
       <>
+        {refreshIndicator}
         {composer}
         <div className="task-list">
           {[0, 1, 2].map((i) => (
@@ -190,8 +209,9 @@ export default function RunsView({ connected, hostId, request, subscribeEvents,
   if (!connected || (loading && entries.length === 0)) {
     return (
       <>
+        {refreshIndicator}
         {composer}
-        <div className="runs-view">
+        <div className="sessions-view">
           <div className="empty-state">
             <p className="empty-state-text">Sessions</p>
             <p className="empty-state-hint">Your sessions will appear here</p>
@@ -204,16 +224,10 @@ export default function RunsView({ connected, hostId, request, subscribeEvents,
   if (entries.length === 0) {
     return (
       <>
+        {refreshIndicator}
         {composer}
-        {filterTaskId && onClearFilter && (
-          <div style={{ marginBottom: "var(--space-sm)" }}>
-            <span className="runs-filter-chip">
-              Filtered by task
-              <button onClick={onClearFilter} aria-label="Clear filter">&times;</button>
-            </span>
-          </div>
-        )}
-        <div className="runs-view">
+        {filterChip}
+        <div className="sessions-view">
           <div className="empty-state">
             <p className="empty-state-text">No sessions yet</p>
             <p className="empty-state-hint">
@@ -229,25 +243,19 @@ export default function RunsView({ connected, hostId, request, subscribeEvents,
 
   return (
     <>
+      {refreshIndicator}
       {composer}
-      {filterTaskId && onClearFilter && (
-        <div style={{ marginBottom: "var(--space-sm)" }}>
-          <span className="runs-filter-chip">
-            Filtered by task
-            <button onClick={onClearFilter} aria-label="Clear filter">&times;</button>
-          </span>
-        </div>
-      )}
+      {filterChip}
       <div className="task-list">
         {entries.map((entry, i) => (
           <div
             key={`${entry.task_id}-${entry.run_id}-${i}`}
-            className="runs-card"
+            className="sessions-card"
             onClick={() => !entry.error && handleCardClick(entry.task_id, entry.run_id)}
           >
-            <div className="runs-card-body">
-              <h3 className="runs-card-name">{entry.task_name || entry.task_id}</h3>
-              <div className="runs-card-meta">
+            <div className="sessions-card-body">
+              <h3 className="sessions-card-name">{entry.task_name || entry.task_id}</h3>
+              <div className="sessions-card-meta">
                 <span style={{ color: stateColor(entry.running_state) }}>
                   {stateLabel[entry.running_state ?? ""] ?? entry.running_state}
                 </span>
@@ -262,7 +270,7 @@ export default function RunsView({ connected, hostId, request, subscribeEvents,
                 )}
               </div>
             </div>
-            <span className="runs-card-chevron">&#8250;</span>
+            <span className="sessions-card-chevron">&#8250;</span>
           </div>
         ))}
 

package/palmier-server/pwa/src/components/TaskCard.tsx

@@ -23,8 +23,9 @@ export default function TaskCard({ task, lastEvent, onEdit, onDelete, onViewRun
   const menuRef = useRef<HTMLDivElement>(null);
 
   const isRunning = lastEvent?.running_state === "started";
+  const scheduleActive = !!task.schedule_enabled && !!task.schedule_type && (task.schedule_values?.length ?? 0) > 0;
   const stateColor =
-    !task.triggers_enabled || task.triggers.length === 0
+    !scheduleActive
       ? "var(--color-text-secondary)"
       : isRunning
         ? "var(--color-success)"
@@ -99,34 +100,14 @@ export default function TaskCard({ task, lastEvent, onEdit, onDelete, onViewRun
   };
 
 
-  function formatTriggersGrouped(triggers: { type: string; value: string }[]): string {
-    if (triggers.length === 0) return "";
-    if (triggers.length === 1) return formatSingleTrigger(triggers[0]);
-
-    // Detect the shared schedule type
-    const classified = triggers.map(classifyTrigger);
-    const types = new Set(classified.map((c) => c.kind));
-
-    // If all the same type, group them
-    if (types.size === 1) {
-      const kind = classified[0].kind;
-      if (kind === "hourly") return "Every hour";
-      const details = classified.map((c) => c.detail);
-      return `${kind.charAt(0).toUpperCase() + kind.slice(1)}: ${details.join(", ")}`;
-    }
-
-    // Mixed types — fall back to listing each
-    return triggers.map(formatSingleTrigger).join(", ");
-  }
-
-  function classifyTrigger(t: { type: string; value: string }): { kind: string; detail: string } {
-    if (t.type === "once") {
-      const d = new Date(t.value);
-      const label = isNaN(d.getTime()) ? t.value : `${d.toLocaleDateString(undefined, { month: "short", day: "numeric", year: "numeric" })} at ${d.toLocaleTimeString(undefined, { hour: "numeric", minute: "2-digit" })}`;
-      return { kind: "once", detail: label };
+  function classifyValue(scheduleType: "crons" | "specific_times", value: string): { kind: string; detail: string } {
+    if (scheduleType === "specific_times") {
+      const d = new Date(value);
+      const label = isNaN(d.getTime()) ? value : `${d.toLocaleDateString(undefined, { month: "short", day: "numeric", year: "numeric" })} at ${d.toLocaleTimeString(undefined, { hour: "numeric", minute: "2-digit" })}`;
+      return { kind: "specific_times", detail: label };
     }
-    const parts = t.value.split(" ");
-    if (parts.length !== 5) return { kind: "unknown", detail: t.value };
+    const parts = value.split(" ");
+    if (parts.length !== 5) return { kind: "unknown", detail: value };
     const [min, hour, dom, , dow] = parts;
     const DAYS = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
     if (hour === "*") return { kind: "hourly", detail: "" };
@@ -138,14 +119,31 @@ export default function TaskCard({ task, lastEvent, onEdit, onDelete, onViewRun
     return { kind: "daily", detail: time };
   }
 
-  function formatSingleTrigger(t: { type: string; value: string }): string {
-    const c = classifyTrigger(t);
+  function formatSingleValue(scheduleType: "crons" | "specific_times", value: string): string {
+    const c = classifyValue(scheduleType, value);
     if (c.kind === "hourly") return "Every hour";
-    if (c.kind === "once") return `Once on ${c.detail}`;
+    if (c.kind === "specific_times") return `Once on ${c.detail}`;
     return `${c.kind.charAt(0).toUpperCase() + c.kind.slice(1)}: ${c.detail}`;
   }
 
-  const triggersText = formatTriggersGrouped(task.triggers);
+  function formatScheduleGrouped(scheduleType: "crons" | "specific_times" | undefined, values: string[] | undefined): string {
+    if (!scheduleType || !values || values.length === 0) return "";
+    if (values.length === 1) return formatSingleValue(scheduleType, values[0]);
+
+    const classified = values.map((v) => classifyValue(scheduleType, v));
+    const kinds = new Set(classified.map((c) => c.kind));
+
+    if (kinds.size === 1) {
+      const kind = classified[0].kind;
+      if (kind === "hourly") return "Every hour";
+      const details = classified.map((c) => c.detail);
+      return `${kind.charAt(0).toUpperCase() + kind.slice(1)}: ${details.join(", ")}`;
+    }
+
+    return values.map((v) => formatSingleValue(scheduleType, v)).join(", ");
+  }
+
+  const scheduleText = formatScheduleGrouped(task.schedule_type, task.schedule_values);
 
   const actionItems = (
     <>
@@ -174,7 +172,7 @@ export default function TaskCard({ task, lastEvent, onEdit, onDelete, onViewRun
 
   return (
     <>
-      <div className="task-card" onClick={() => isRunning ? onViewRun(task.id, "latest") : onViewRun(task.id)}>
+      <div className="task-card" onClick={() => onViewRun(task.id, "latest")}>
         <div className="task-card-header">
           <div className="task-card-title-row">
             {isRunning ? (
@@ -216,9 +214,9 @@ export default function TaskCard({ task, lastEvent, onEdit, onDelete, onViewRun
               {" "}{formatTime(lastEvent.time_stamp)}
             </span>
           )}
-          {task.triggers.length > 0 && (
+          {task.schedule_type && (task.schedule_values?.length ?? 0) > 0 && (
             <span className="task-card-triggers">
-              {task.triggers_enabled ? triggersText : "Triggers disabled"}
+              {task.schedule_enabled ? scheduleText : "Schedule disabled"}
             </span>
           )}
         </div>