DemoBuy

Automation Screens

Last updated on 2026-05-31

The Help Desk Kit includes 3 automation screens for building workflow rules, managing SLA policies, and configuring escalation paths. All screens live under the /automations/ route within the (app) route group.

Automation Rules

Route: /automations

Workflow automation builder with trigger-condition-action rules and execution logging.

  • Rules list -- each rule displays:
    • Name and description
    • Trigger event badge (ticket created, ticket updated, SLA approaching, customer reply, etc.)
    • Conditions count
    • Actions count
    • Status toggle (active/inactive) with Switch component
    • Run count (last 30 days)
    • Last triggered date
  • Rule editor -- click to edit with a visual rule builder containing three sections:
    • When (trigger): ticket created, ticket updated, SLA approaching, customer reply, agent reply, status change, etc.
    • If (conditions): priority is X, category is Y, requester is VIP, SLA status is at-risk, etc. with AND/OR logic between conditions
    • Then (actions): assign to agent/team, change priority, add tag, send notification, send auto-reply, escalate, create task, etc.
  • Multiple actions -- each rule supports multiple actions executed in sequence
  • Execution log -- bottom section showing recent trigger events with pass/fail status, timestamp, and affected ticket
  • Drag reorder -- drag rules to change priority order (rules execute in order)

Example Automation Rule

WHEN: Ticket Created
IF:   Priority = "Urgent" AND Category = "Billing"
THEN: Assign to "Billing Team"
      Change SLA Policy to "Enterprise"
      Send Notification to #billing-alerts

Key Components

import { AutomationRulesList } from "@/components/automations/automation-rules-list"

Data Sources

Data Source Location
Automation rules automationRules data/seed.ts
Triggers automationTriggers data/seed.ts
Conditions automationConditions data/seed.ts
Actions automationActions data/seed.ts

SLA Policies

Route: /automations/sla

SLA policy management with priority-based targets, business hours configuration, and escalation rules.

  • Policy card grid -- each SLA policy card shows:
    • Policy name and description
    • Target metrics (first response time, next response time, resolution time)
    • Priority-based targets table showing different targets for urgent/high/medium/low priority tickets
    • Business hours indicator (which calendar the SLA follows)
    • Associated customer segments
    • Active ticket count under this SLA
  • Policy editor -- click to edit with:
    • Policy name and description fields
    • Business hours selector (which business calendar to use)
    • Target times by priority (editable table with columns for priority, first response, next response, and resolution)
    • Escalation rules per stage (breach approaching = notify agent, breached = notify supervisor, severely breached = page on-call, etc.)
  • Create Policy wizard -- step-by-step flow through naming, setting targets, defining business hours, and configuring escalations
  • Escalation timeline -- visual timeline showing escalation stages with delays and actions

SLA Target Example

Priority First Response Next Response Resolution
Urgent 15 minutes 30 minutes 2 hours
High 1 hour 2 hours 8 hours
Medium 4 hours 8 hours 24 hours
Low 8 hours 24 hours 72 hours

Key Components

import { SlaPoliciesGrid } from "@/components/automations/sla-policies-grid"

Data Sources

Data Source Location
SLA policies slaPolicies data/seed.ts
SLA targets slaTargets data/seed.ts
Escalation rules escalationRules data/seed.ts

Escalation Paths

Route: /automations/escalations

Configure multi-stage escalation workflows with visual flowcharts and testing capabilities.

  • Escalation flowchart -- visual flowchart showing escalation stages connected in sequence
  • Stage configuration -- each stage includes:
    • Trigger condition (SLA percentage reached, priority level, customer segment, time elapsed)
    • Action (notify via email/Slack/in-app, reassign to team/supervisor, change priority, create incident)
    • Delay between stages (e.g., wait 15 minutes before next stage)
    • Notification targets (specific agents, teams, or roles)
  • Drag-and-drop -- reorder escalation stages via drag-and-drop
  • Path settings -- name, applicable ticket types, active/inactive toggle for each escalation path
  • Escalation history -- table of recent escalations showing ticket ID, trigger reason, actions taken, and resolution status
  • Test Path -- button to simulate an escalation with a mock ticket, showing each stage as it would execute
  • Multiple paths -- support for separate paths per priority level or customer segment

Example Escalation Path

Stage 1: SLA at 80% → Notify assigned agent (email + in-app)
    ↓ wait 15 minutes
Stage 2: SLA at 100% → Notify supervisor (email + Slack)
                        Reassign to senior agent
    ↓ wait 30 minutes
Stage 3: SLA breached by 30 min → Page on-call manager
                                   Change priority to Urgent
                                   Create incident ticket

Key Components

import { EscalationPaths } from "@/components/automations/escalation-paths"

Next Steps

Previous

Team Screens

Next

Settings Screens