# Wait Time Handoff > A collapsible settings card for what an agent does when the customer goes quiet — a wait duration, a Team / Workflow handoff target, the handoff message, and a working-hours option. - Category: agents - Job: Oversee — Show progress and reasoning while the AI works, and let people approve, pause or stop it. - Slug: `wait-time-handoff` - HTML: https://ai-patterns.app/patterns/agents/wait-time-handoff - JSON: https://ai-patterns.app/api/patterns/agents/wait-time-handoff - Seen in: [Intercom](https://www.intercom.com/help/en/articles/7155449-customer-or-teammate-has-been-unresponsive) ## Summary A collapsible settings card that decides what an AI agent does when the person it is talking to stops replying. The builder sets a wait duration, chooses whether an unanswered conversation goes to a **Team** or a **Workflow**, picks the specific target, writes the message the requester sees at handoff, and optionally limits the timer to working hours. A one-line summary restates the rule in plain language so the configuration can be checked at a glance. ## When to use - Configuring an agent that asks someone a question — a missing detail, a screenshot, a confirmation — and must not leave the conversation open forever if they go quiet. - When there is more than one sensible fallback — route to people (a team like Maintainers) or to automation (a follow-up, issue, or close-out workflow). - As one section inside a larger agent or procedure settings page, where it can collapse to its summary. ## When not to use - Timeouts the end user controls (a session expiry, an upload timeout) — this is an operator-facing configuration, not a runtime prompt. - When the only outcome is "close the conversation" — a single duration field is enough; the Team/Workflow switch adds noise. - Complex inactivity logic with multiple reminders or escalation tiers — use a workflow or procedure builder where the steps are explicit. ## Anatomy - Header: timer icon, "Wait time" title, and a chevron that collapses the card. Collapsed, it shows a summary ("2 hours → Request a reference screenshot"). - Duration row: a compact numeric input and a unit select (seconds, minutes, hours), under the helper "Set how long [agent] waits for a response." - Handoff label: "If there's no response, hand off to:". - Segmented control with two options, Team and Workflow, each with an icon; the selected segment is a raised pill. - Target select: the list changes with the segment — teams or saved workflows. - Handoff message: a textarea prefilled with the target's default copy. - Working-hours checkbox with a helper line explaining what requesters see outside hours. - Live summary footer: "AI-Patterns waits **2 hours**, then hands off to **Request a reference screenshot**." ## Behavior - The duration is clamped on blur or Enter to a sane range per unit (1–59 seconds or minutes, 1–72 hours); switching unit re-clamps the current value instead of rejecting it. - Switching between Team and Workflow slides the selection pill across (spring, ~200 ms) and swaps the target select with a short fade, selecting the first option of the new list. - Choosing a target replaces the message with that target's default copy — but only until the builder edits the message. Once edited, their text is never overwritten by further target changes. - With "working hours only" on, the timer pauses outside working hours and the summary reads "2 hours of working hours". - The chevron rotates and the body collapses with a height + opacity transition; the collapsed header keeps the summary visible so the section is never a black box. - Every change emits the full value object (`amount`, `unit`, `kind`, `targetId`, `message`, `workingHoursOnly`) so the parent can save or validate it. ## Content guidelines - Name the agent in the helper ("Set how long AI-Patterns waits…") so it is clear whose patience is being configured. - Phrase the handoff label as the condition, not the action: "If there's no response, hand off to:". - Default messages should tell the requester what happens next, in one sentence, without blaming them for going quiet: "We'll need a screenshot of where this pattern ships before we can add it to the registry." - Name workflows by outcome ("Request a reference screenshot", "Open a pattern-request issue"), and teams by who they are ("Maintainers"), so the summary reads as a sentence. - Keep the summary literal — duration, condition, destination — no marketing copy. ## Accessibility - The header is a heading containing a disclosure `button` with `aria-expanded` and `aria-controls` pointing at the body region. - Duration and handoff groups are `fieldset`s whose `legend` is the visible helper text; the number input and unit select have their own accessible names. - The Team/Workflow switch is a `radiogroup` of `radio` buttons with roving `tabIndex`; Arrow keys move and select, matching native radio behavior. Icons are `aria-hidden`. - Selects are native ` onChange(e.target.value)} className="h-8 w-full cursor-pointer appearance-none rounded-full border bg-background py-0 pl-3 pr-8 text-xs font-medium outline-none transition-colors hover:bg-accent focus-visible:ring-2 focus-visible:ring-ring" > {options.map((o) => ( ))} ); } export function WaitTimeHandoff({ agentName = "AI-Patterns", teams = DEFAULT_TEAMS, workflows = DEFAULT_WORKFLOWS, defaultValue, defaultOpen = true, onChange, className, }: WaitTimeHandoffProps) { const id = React.useId(); const [open, setOpen] = React.useState(defaultOpen); const [value, setValue] = React.useState(() => { const kind = defaultValue?.kind ?? "workflow"; const list = kind === "team" ? teams : workflows; const target = list.find((o) => o.id === defaultValue?.targetId) ?? list[0]; return { amount: defaultValue?.amount ?? 1, unit: defaultValue?.unit ?? "minutes", kind, targetId: target?.id ?? "", message: defaultValue?.message ?? target?.message ?? "", workingHoursOnly: defaultValue?.workingHoursOnly ?? false, }; }); // Track whether the user has edited the message, so switching target only // replaces the default copy, never something they wrote. const [messageEdited, setMessageEdited] = React.useState(Boolean(defaultValue?.message)); const [draftAmount, setDraftAmount] = React.useState(String(value.amount)); const options = value.kind === "team" ? teams : workflows; const target = options.find((o) => o.id === value.targetId); const unitMax = UNITS.find((u) => u.value === value.unit)!.max; function update(patch: Partial) { setValue((prev) => { const next = { ...prev, ...patch }; onChange?.(next); return next; }); } function selectTarget(kind: HandoffKind, targetId?: string) { const list = kind === "team" ? teams : workflows; const next = list.find((o) => o.id === targetId) ?? list[0]; update({ kind, targetId: next?.id ?? "", ...(messageEdited ? {} : { message: next?.message ?? "" }), }); } function commitAmount(raw: string) { const n = Math.round(Number(raw)); const clamped = Number.isFinite(n) ? Math.min(Math.max(n, 1), unitMax) : value.amount; setDraftAmount(String(clamped)); if (clamped !== value.amount) update({ amount: clamped }); } function changeUnit(unit: WaitUnit) { const max = UNITS.find((u) => u.value === unit)!.max; const amount = Math.min(value.amount, max); setDraftAmount(String(amount)); update({ unit, amount }); } return (

{open && (
{/* Wait duration */}
Set how long {agentName} waits for a response.
setDraftAmount(e.target.value)} onBlur={(e) => commitAmount(e.target.value)} onKeyDown={(e) => e.key === "Enter" && commitAmount(e.currentTarget.value)} className="h-8 w-20 rounded-full border bg-background px-3 text-xs tabular-nums outline-none focus-visible:ring-2 focus-visible:ring-ring" /> selectTarget(value.kind, v)} options={options.map((o) => ({ value: o.id, label: o.label }))} className="mt-1" />
{/* Handoff message */}