moadim 3.2.2

Loop engine for AI agents — routines over REST, MCP, and a built-in web UI
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

import { useEffect } from "react";
import { useRoutineLogs } from "../../api/hooks";
import { RefreshFreshness, refreshMs, useRefreshToken } from "../../components/RefreshControl";
import { LogViewer } from "./LogViewer";

export interface RoutineLogsProps {
  id: string;
  title: string;
  onBack: () => void;
}

/** Tail of the routine's most recent run's log, with optional auto-refresh (#357: the daemon
 * periodically reaps finished workbenches, so a stale tail should be able to clear itself). */
export function RoutineLogs({ id, title, onBack }: RoutineLogsProps) {
  const refreshToken = useRefreshToken();
  const logs = useRoutineLogs(id);

  useEffect(() => {
    const ms = refreshMs(refreshToken);
    if (ms === undefined) return;
    const timer = window.setInterval(() => void logs.refetch(), ms);
    return () => window.clearInterval(timer);
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [refreshToken, id]);


  return (
    <main className="logs-page">
      <div className="page-hd">
        <button type="button" className="btn btn-ghost btn-sm" onClick={onBack}>
          ← BACK
        </button>
        <div className="page-title">LOGS / {title}</div>
        <RefreshFreshness updatedAtMs={logs.dataUpdatedAt} />
        <button
          type="button"
          className="btn-refresh"
          title="Refresh"
          aria-label="Refresh"
          onClick={() => void logs.refetch()}
        >
          ↻
        </button>
      </div>
      <LogViewer
        content={logs.data}
        loading={logs.isLoading}
        err={logs.isError ? logs.error.message : undefined}
      />
    </main>
  );
}