apps/web/app/routes/workspace/agents/routines.tsx · flagon-io/g1t

.map((entry) => ({ id: entry.channel.id, label: entry.channel.kind === "channel" ? `#${entry.channel.name}` : `Your direct message with ${agent?.display_name ?? "it"}` }))

40

.sort((a, b) => Number(b.label.startsWith("#")) - Number(a.label.startsWith("#")) || a.label.localeCompare(b.label));

41

return { routines: listed?.routines ?? null, suggestions: listed?.suggestions ?? [], channels, isOwner };

42

}

43

44

/** A routine from the dialog's fields. */

45

function routineFrom(form: FormData): { ok: true; input: NewRoutine } | { ok: false; error: string } {

46

const every = String(form.get("every") ?? "none");

47

let schedule = null;

48

if (every !== "none") {

49

const time = every === "hour" ? `00:${String(Number(form.get("minute") ?? 0)).padStart(2, "0")}` : String(form.get("time") ?? "");

50

schedule = scheduleFrom(every, time, String(form.get("weekday") ?? ""));

51

if (!schedule) return { ok: false, error: "That schedule isn't one a routine can run on." };

52

}

53

const events = form.getAll("events").map(String) as RoutineEvent[];

54

const repos = reposFrom(String(form.get("repos") ?? ""));

55

if (!repos) return { ok: false, error: "Name repositories as workspace/name, separated by commas." };

return {

ok: true,

input: {

name: String(form.get("name") ?? ""),

60

instructions: String(form.get("instructions") ?? ""),

61

schedule,

62

events,

63

repos: events.length > 0 ? repos : [],

64

channel_id: String(form.get("channel") ?? ""),

65

enabled: form.get("enabled") !== "false",

},

};

}

export async function action({ params, context, request }: Route.ActionArgs): Promise<ActionResult> {

71

const { viewer, slug, form } = await agentsAction(request, context, params.owner);

72

const handle = params.handle.toLowerCase();

73

const intent = String(form.get("intent") ?? "");

74

const id = String(form.get("id") ?? "") || null;

75

if (intent === "save") {

76

const read = routineFrom(form);

77

if (!read.ok) return { ok: false, intent, error: read.error };

78

return answer(intent, workspaceAgents.saveRoutine(slug, handle, viewer, read.input, id));

79

}

80

if (intent === "toggle" && id) {

81

// Turning one on or off saves it as it is, with the switch changed.

82

const listed = await readOrNull(workspaceAgents.routines(slug, handle, viewer));

83

const routine = listed?.routines.find((r) => r.id === id);

84

if (!routine) return { ok: false, intent, error: "There is no such routine." };

85

const { name, instructions, schedule, events, repos, channel_id } = routine;

86

return answer(intent, workspaceAgents.saveRoutine(slug, handle, viewer, { name, instructions, schedule, events, repos, channel_id, enabled: form.get("enabled") === "true" }, id));

87

}

88

if (intent === "run" && id) return answer(intent, workspaceAgents.runRoutine(slug, handle, viewer, id));

89

if (intent === "delete" && id) return answer(intent, workspaceAgents.deleteRoutine(slug, handle, viewer, id));

90

return { ok: false, intent, error: "Unknown request." };

}

/**

* Work the agent does without being asked: on a schedule, when something

95

* happens, or both. Each run is a session in the routine's channel.

96

*/

97

export default function Routines({ loaderData, params }: Route.ComponentProps) {

98

const agent = useOutletContext<WorkspaceAgent>();

99

const { routines, suggestions, channels, isOwner } = loaderData;

100

if (!routines) return <Quiet title="Routines can't be shown right now">The agents service didn't answer. Reload in a moment.</Quiet>;

return (

Work {agent.display_name} does without being asked: on a schedule (UTC), when something happens, or both. Each run is a session posted in the

106

routine's channel, paid from {agent.display_name}'s budget, with the access of the owner who set it up.

</p>

{isOwner && (

<RoutineDialog

agentName={agent.display_name}

draft={{}}

channels={channels}

title="New routine"

trigger={

New routine

</Button>

}

/>

)}

</div>

{routines.length === 0 ? (

125

126

{isOwner ? `Add one, or start from a suggestion below.` : `An owner can give ${agent.display_name} work to do on a schedule or when something happens.`}

</Quiet>

) : (

<ul>

{routines.map((routine) => (

))}

</ul>

</Card>

)}

{isOwner && suggestions.length > 0 && <Suggestions agent={agent} suggestions={suggestions} channels={channels} />}

</div>

);

}

function RoutineRow({ routine, agent, channels, isOwner, slug }: { routine: AgentRoutine; agent: WorkspaceAgent; channels: RoutineChannel[]; isOwner: boolean; slug: string }) {

144

const toggle = useFetcher<ActionResult>({ key: `toggle-${routine.id}` });

145

const run = useFetcher<ActionResult>({ key: `run-${routine.id}` });

146

const enabled = toggle.formData ? toggle.formData.get("enabled") === "true" : routine.enabled;

147

const failed = [toggle.data, run.data].find((d) => d && !d.ok) as Extract<ActionResult, { ok: false }> | undefined;

return (

<p className={`text-sm font-medium ${enabled ? "" : "text-muted"}`}>{routine.name}</p>

154

<p className="mt-0.5 text-xs text-muted">{routineInWords(routine, EVENT_LABELS)}</p>

155

156

<span>{routine.channel_name ? `#${routine.channel_name}` : "A direct message"}</span>

157

{routine.sponsor_username && <span>· runs as @{routine.sponsor_username}</span>}

158

{enabled && routine.next_run_at && <span suppressHydrationWarning>· next {untilLabel(routine.next_run_at)}</span>}

159

{routine.last_run_at && (

160

<span>

161

· last{" "}

162

{routine.last_session_id ? (

</Link>

) : (

)}

</span>

)}

<span>

· {routine.runs} {routine.runs === 1 ? "run" : "runs"}

173

</span>

174

</p>

175

{routine.paused_note && (

176

177

178

{routine.paused_note}

179

</p>

180

)}

181

{run.data?.ok && <p className="mt-2 text-xs text-success">Started. It shows on the Sessions tab and in #{routine.channel_name ?? "its channel"}.</p>}

182

{failed && <p className="mt-2 text-xs text-danger">{failed.error}</p>}

</div>

{isOwner ? (

<run.Form method="post">

</Button>

</Hint>

</run.Form>

<RoutineDialog

agentName={agent.display_name}

draft={routine}

channels={channels}

title="Edit routine"

trigger={

</Button>

}

/>

<Confirm

title={`Delete “${routine.name}”?`}

208

confirm="Delete routine"

209

fields={{ intent: "delete", id: routine.id }}

210

fetcherKey={`delete-${routine.id}`}

trigger={

</Button>

}

>

It stops running. The sessions it already ran stay, with what they cost.

218

</Confirm>

219

<toggle.Form method="post" className="ml-1.5 flex">

<Switch

checked={enabled}

aria-label={enabled ? "Turn off" : "Turn on"}

225

onCheckedChange={(on) => toggle.submit({ intent: "toggle", id: routine.id, enabled: String(on) }, { method: "post" })}

/>

</toggle.Form>

</div>

) : (

<span className={`shrink-0 text-xs ${enabled ? "text-success" : "text-faint"}`}>{enabled ? "On" : "Off"}</span>

)}

</div>

</li>

);

}

function Suggestions({ agent, suggestions, channels }: { agent: WorkspaceAgent; suggestions: RoutineSuggestion[]; channels: RoutineChannel[] }) {

return (

Suggested from {agent.display_name}'s responsibilities

243

</h2>

244

245

{suggestions.map((suggestion) => (

246

247

<li>

248

<p className="text-xs text-faint">“{suggestion.responsibility}”</p>

249

<p className="mt-2 text-sm font-medium">{suggestion.routine.name}</p>

250

<p className="mt-0.5 text-xs text-muted">{routineInWords({ schedule: suggestion.routine.schedule, events: suggestion.routine.events, repos: suggestion.routine.repos }, EVENT_LABELS)}</p>

251

252

<RoutineDialog

253

agentName={agent.display_name}

254

draft={suggestion.routine}

255

channels={channels}

256

title="Add routine"

257