mikkel/nexus
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Move routine title into header row, remove Automation label

Browse source 
The editable title now sits in the header alongside Run Now and
the active/paused toggle, replacing the old "Automation" subheading.
This removes the redundant label and gives the title top-level
prominence in the routine detail view.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
dotta 2026-03-20 06:38:45 -05:00
parent 8cc8540597
commit 4c6e8e6053
1 changed files with 53 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

124
ui/src/pages/RoutineDetail.tsx
View file

@ -625,46 +625,60 @@ export function RoutineDetail() {
return ( return (
<div className="max-w-2xl space-y-6"> <div className="max-w-2xl space-y-6">
{/* Header: status + actions */} {/* Header: editable title + actions */}
<div className="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between"> <div className="flex items-start gap-4">
<div className="space-y-1"> <textarea
{routine.activeIssue && ( ref={titleInputRef}
<Link className="flex-1 min-w-0 resize-none overflow-hidden bg-transparent text-xl font-bold outline-none placeholder:text-muted-foreground/50"
to={`/issues/${routine.activeIssue.identifier ?? routine.activeIssue.id}`} placeholder="Routine title"
className="inline-flex items-center gap-1 text-xs text-muted-foreground hover:underline" rows={1}
> value={editDraft.title}
<span>Current issue</span> onChange={(event) => {
<span>{routine.activeIssue.identifier ?? routine.activeIssue.id.slice(0, 8)}</span> setEditDraft((current) => ({ ...current, title: event.target.value }));
</Link> autoResizeTextarea(event.target);
)} }}
</div> onKeyDown={(event) => {
<div className="flex flex-wrap items-center gap-3"> if (event.key === "Enter" && !event.metaKey && !event.ctrlKey && !event.nativeEvent.isComposing) {
event.preventDefault();
descriptionEditorRef.current?.focus();
return;
}
if (event.key === "Tab" && !event.shiftKey) {
event.preventDefault();
if (editDraft.assigneeAgentId) {
if (editDraft.projectId) {
descriptionEditorRef.current?.focus();
} else {
projectSelectorRef.current?.focus();
}
} else {
assigneeSelectorRef.current?.focus();
}
}
}}
/>
<div className="flex shrink-0 items-center gap-3 pt-1">
<RunButton onClick={() => runRoutine.mutate()} disabled={runRoutine.isPending} /> <RunButton onClick={() => runRoutine.mutate()} disabled={runRoutine.isPending} />
<div className="flex items-center gap-2"> <button
<span className="text-xs font-medium uppercase tracking-[0.18em] text-muted-foreground">Automation</span> type="button"
<div className="flex items-center gap-3"> role="switch"
<button aria-checked={automationEnabled}
type="button" aria-label={automationEnabled ? "Pause automatic triggers" : "Enable automatic triggers"}
role="switch" disabled={automationToggleDisabled}
aria-checked={automationEnabled} className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${
aria-label={automationEnabled ? "Pause automatic triggers" : "Enable automatic triggers"} automationEnabled ? "bg-emerald-500" : "bg-muted"
disabled={automationToggleDisabled} } ${automationToggleDisabled ? "cursor-not-allowed opacity-50" : ""}`}
className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${ onClick={() => updateRoutineStatus.mutate(automationEnabled ? "paused" : "active")}
automationEnabled ? "bg-emerald-500" : "bg-muted" >
} ${automationToggleDisabled ? "cursor-not-allowed opacity-50" : ""}`} <span
onClick={() => updateRoutineStatus.mutate(automationEnabled ? "paused" : "active")} className={`inline-block h-5 w-5 rounded-full bg-background shadow-sm transition-transform ${
> automationEnabled ? "translate-x-5" : "translate-x-0.5"
<span }`}
className={`inline-block h-5 w-5 rounded-full bg-background shadow-sm transition-transform ${ />
automationEnabled ? "translate-x-5" : "translate-x-0.5" </button>
}`} <span className={`min-w-[3.75rem] text-sm font-medium ${automationLabelClassName}`}>
/> {automationLabel}
</button> </span>
<span className={`min-w-[3.75rem] text-sm font-medium ${automationLabelClassName}`}>
{automationLabel}
</span>
</div>
</div>
</div> </div>
</div> </div>
@ -694,38 +708,6 @@ export function RoutineDetail() {
</div> </div>
)} )}
{/* Title */}
<textarea
ref={titleInputRef}
className="w-full resize-none overflow-hidden bg-transparent text-xl font-bold outline-none placeholder:text-muted-foreground/50"
placeholder="Routine title"
rows={1}
value={editDraft.title}
onChange={(event) => {
setEditDraft((current) => ({ ...current, title: event.target.value }));
autoResizeTextarea(event.target);
}}
onKeyDown={(event) => {
if (event.key === "Enter" && !event.metaKey && !event.ctrlKey && !event.nativeEvent.isComposing) {
event.preventDefault();
descriptionEditorRef.current?.focus();
return;
}
if (event.key === "Tab" && !event.shiftKey) {
event.preventDefault();
if (editDraft.assigneeAgentId) {
if (editDraft.projectId) {
descriptionEditorRef.current?.focus();
} else {
projectSelectorRef.current?.focus();
}
} else {
assigneeSelectorRef.current?.focus();
}
}
}}
/>
{/* Assignment row */} {/* Assignment row */}
<div className="overflow-x-auto overscroll-x-contain"> <div className="overflow-x-auto overscroll-x-contain">
<div className="inline-flex min-w-full flex-wrap items-center gap-2 text-sm text-muted-foreground sm:min-w-max sm:flex-nowrap"> <div className="inline-flex min-w-full flex-wrap items-center gap-2 text-sm text-muted-foreground sm:min-w-max sm:flex-nowrap">