add-channel-setup-guide

Creates a new chat channel's in-dashboard setup guide component for the Novu dashboard.

39.7k|4.4k|Updated Aug 26, 2021
One-click install
npx skills add https://github.com/novuhq/novu --skill add-channel-setup-guide
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: add-channel-setup-guide
Source: https://github.com/novuhq/novu/tree/main/.cursor/skills/add-channel-setup-guide
Command: npx skills add https://github.com/novuhq/novu --skill add-channel-setup-guide

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Adding a new chat channel (like Discord) to Novu's agent onboarding requires building a consistent in-dashboard setup guide — a numbered stepper that walks developers through creating the provider app, saving credentials, and verifying the connection. This Skill codifies the existing Slack, MS Teams, and Telegram patterns so a new channel guide is built correctly the first time.

Core Features & Use Cases

  • Setup Guide Component Generation: Creates <channel>-setup-guide.tsx in apps/dashboard/src/components/agents/ using shared primitives like SetupStepperRail, SetupStep, SetupButton, and IntegrationCredentialsSidebar.
  • Live Connection Detection: Wires ListeningStatus polling of listAgentIntegrations so the UI flips from "Listening…" to "Connected" only when the backend sets connectedAt, keeping credential-saved and connected states distinct.
  • Resolver Wiring: Registers the new guide in resolve-agent-integration-guide.tsx with the correct ChatProviderIdEnum case and display name.
  • Use Case: When adding Discord as an agent channel, use this Skill to scaffold the three-step guide (create bot → save token → send test message) modeled on the Telegram sibling, including the credential drawer and confetti-on-connect behavior.

Quick Start

Add a Discord setup guide for the agent integrations page following the existing Telegram setup guide pattern.

Frequently Asked Questions about add-channel-setup-guide

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add a new chat channel setup guide to the Novu dashboard?

Copy the closest sibling guide (Telegram for simple token flows, Slack for quick/manual modes, Teams for multi-credential flows), rename it for your channel, and register it in the setup switch of resolve-agent-integration-guide.tsx with the matching ChatProviderIdEnum case.

How does the Novu dashboard detect when a chat channel is connected?

The ListeningStatus component polls listAgentIntegrations every second and treats the channel as connected only when the backend sets connectedAt on the integration link after the first real inbound message. Saving credentials or completing OAuth does not count as connected.

What components are used to build a channel setup stepper in Novu?

Guides are composed from setup-guide-primitives.tsx: SetupStepperRail wraps numbered SetupStep items, SetupButton handles actions, IntegrationCredentialsSidebar saves provider credentials, and deriveStepStatus computes completed/current/upcoming states.

Can a channel setup guide support both quick and manual setup modes?

Yes, following the Slack guide pattern: add a SetupMode state with SetupModeToggle, typically gated by a feature flag, and render two step-column variants. A generated manifest can be shown via CodeBlock with escaped injected values.

Why does the setup guide not advance after saving credentials?

Credential-saved and connected are intentionally separate states. The final step only advances when connectedAt is set by the backend on first inbound message; check that local state resets on integrationId change and that TanStack Query invalidation uses getAgentIntegrationsQueryKey.