FuryBeeThemes

DashboardCustomer support helpdesk dashboard Coming soon

Relay

Customer support helpdesk with a three-pane shared inbox, live SLA timers, macros and a knowledge base.

Relay dashboard: real screenshot of the live demo home page
  • Relay: Three-pane inbox with live SLA timers
    Three-pane inbox with live SLA timers
  • Relay: Ticket with conversation, internal note and customer details
    Ticket with conversation, internal note and customer details
  • Relay: When / if / then automation builder
    When / if / then automation builder
  • Relay: Reports: backlog, percentiles and channel mix
    Reports: backlog, percentiles and channel mix

About Relay

A helpdesk dashboard for a customer support team: a three-pane shared inbox across email, chat, social and web form with saved views, bulk actions, internal notes, @mentions, a collision indicator and live SLA countdowns, macros with variables and live preview, a Markdown knowledge base, a when/if/then automation builder, editable SLA policies, team roster and coverage, CSAT and reports with CSV export. React 19, TypeScript and Tailwind CSS 4, 4 palettes, light and dark.

Best for helpdesk and customer-support SaaS, in-house support teams, e-commerce and hardware brands with a ticket queue, and the agencies that build their tools.

Features

  • Three-pane inbox

    Saved views, ticket list and conversation side by side, with bulk actions, internal notes, @mentions, attachments and a collision indicator when a colleague is viewing or replying.

  • Live SLA timers

    First-reply and resolution clocks per policy and priority, paused while pending, with at-risk and breached states shown in text and icon, not colour alone.

  • Macros with variables

    Macro editor with variables such as {{customer.first_name}} and {{ticket.id}}, a live preview in the composer, and status, priority and tag actions.

  • Knowledge base

    Articles with a Markdown editor and live preview, drafts, a "used in N replies" count and suggested articles on each ticket.

  • Automations

    When / if / then rule builder with plain-sentence summaries and a test against the last 7 days of tickets.

  • SLA policies

    Editable targets per policy and priority, compliance and tickets near breach; editing a policy recalculates every SLA pill.

  • Team and routing

    Agents, weekly roster, coverage by hour, skill matrix and a routing preview.

  • CSAT and reports

    Score distribution, weekly trend and comments; backlog, response percentiles, channel mix, topics, agent table and CSV export.

  • Keyboard first

    j/k, x, r, n, a, e and / in the inbox, Ctrl/Cmd+Enter to send, a command palette and a shortcut sheet on ?.

  • 4 palettes + dark mode

    Violet, Teal, Rose and Amber; SLA colours stay independent of the palette.

What's included

  • Overview
  • Inbox (views, list, conversation)
  • Ticket page
  • Customers list
  • Customer profile
  • Knowledge base with Markdown editor
  • Macros
  • Automations
  • SLA policies
  • Team and roster
  • CSAT
  • Reports
  • Settings (profile, team, notifications, channels, appearance)
  • Marketing landing page
  • Sign-in page
  • 404 page

Tech stack and fit

Built with

  • React 19
  • TypeScript
  • Vite 7
  • Tailwind CSS 4
  • Recharts 3
  • React Router 7

Who it's for

Helpdesk and customer-support SaaS, in-house support teams, e-commerce and hardware brands with a ticket queue, and the agencies that build their tools.

Tags

Relay FAQ

Does Relay connect to email, chat or social channels?

No. Channels are front-end only: about 1,230 fictional tickets across email, chat, social and web form are seeded in src/data/. All reads and writes go through SupportContext, where each action (assign, setStatus, reply, saveMacro, saveArticle...) can be replaced by a request to your backend.

How are SLA timers calculated?

src/lib/sla.ts runs a first-reply clock until the first agent message, then a resolution clock, from targets per policy and priority. Pending tickets are paused and a ticket is at risk when less than 25 percent (or 5 minutes) of its window remains. Editing a policy on the SLA page recalculates everything.

Which macro variables are available?

Customer first name, name and plan, order id, ticket id and subject, agent first name and company name. A new variable is added in variableValue (src/lib/macros.ts) and MACRO_VARIABLES (src/data/macros.ts).

Do the automations actually run?

The rule builder edits rules in local state and tests them against the last 7 days of seeded tickets, showing how many would match. Executing them on incoming tickets is the job of your backend.

Why does the demo clock show October 2026?

The clock in src/data/clock.ts is frozen at Oct 13, 2026, 2:20 PM and advances in real time so SLA countdowns move. Set NOW to new Date() and simNow to Date.now() for production.

Is Relay keyboard accessible?

Yes. Inbox shortcuts, a command palette and a shortcut sheet, visible focus rings, labelled controls, sortable tables with aria-sort, charts with text summaries and SLA state given in text and icon as well as colour.

When can I buy Relay?

Relay is coming soon. The live demo is complete; the template goes on sale at $39 shortly.

Can I use Relay for a client project?

Yes. The license covers personal and commercial projects, including client work. Reselling or redistributing the template itself is not allowed.

Close in purpose or features to Relay. Browse all 29 templates.

Relay is coming soon. The whole demo is already online.

Live preview