FiveMinutes Support Client

High-level TypeScript client library for FiveMinutes Support with built-in SignalR integration, automatic authentication, and support ticket management.

Installation

npm install @fiveminutes-io/support-client

This package also requires the contracts package:

npm install @fiveminutes-io/five-minute-chat-contracts

Quick Start

import { SupportClient } from "@fiveminutes-io/support-client";

// Initialize client
const client = new SupportClient({
  serverUrl: "https://signalr.fiveminutes.cloud/signalr",
  applicationId: "YOUR_APP_ID",
  applicationSecret: "YOUR_SECRET",
  username: "MyUsername",
});

// Setup event handlers
client.onConnected(() => console.log("Connected!"));
client.onDisconnected((error) => console.log("Disconnected", error));
client.onSupportMessageReceived((msg) => console.log(`${msg.sender}: ${msg.content}`));
client.onTicketCreated((ticketId) => console.log(`Ticket created: ${ticketId}`));
client.onError((error) => console.error("Error:", error));

// Connect
await client.connect();

// Create a support ticket
const ticketId = await client.createSupportTicket("Account Issue", "I can't log in");

// Send a message to the ticket
await client.sendSupportMessage(ticketId, "I've tried resetting my password");

// Get ticket details
const ticket = await client.getSupportTicket(ticketId);

// Cleanup
await client.disconnect();

Configuration

interface SupportClientConfig {
  /** SignalR hub URL */
  serverUrl: string;
  /** Application ID for authentication */
  applicationId: string;
  /** Application secret for authentication */
  applicationSecret: string;
  /** Username to use for support tickets */
  username: string;
  /** Optional: Unique device ID (auto-generated if not provided) */
  deviceId?: string;
  /** Optional: System language (defaults to navigator.language) */
  language?: string;
  /** Optional: Runtime platform (defaults to "Web") */
  platform?: string;
}

API

Methods

• connect(): Connect to the support server
• disconnect(): Disconnect from the support server
• createSupportTicket(topic, message): Create a new support ticket and return the ticket ID
• getSupportTicket(ticketId): Get details for an existing support ticket
• sendSupportMessage(ticketId, message): Send a message to a support ticket
• isConnectedToServer(): Check if currently connected
• getConnectionState(): Get the current connection state
• destroy(): Clean up all resources and prevent reconnection

Event Callbacks

• onConnected(callback): Called when connection is established
• onDisconnected(callback): Called when connection is lost
• onSupportMessageReceived(callback): Called when a message is received in a support ticket
• onTicketCreated(callback): Called when a support ticket is successfully created
• onError(callback): Called when an error occurs

Message Event

interface SupportMessageEvent {
  messageId: string;
  ticketId: string;
  content: string;
  sender: string;
  timestamp: Date;
}

Features

• Automatic Authentication: Handles the SignalR handshake automatically
• Support Ticket Management: Create, view, and manage support tickets
• Real-time Messaging: Send and receive messages in support tickets
• Event-Driven: Simple callback-based API for handling connections and messages
• Error Handling: Built-in error handling and reconnection support
• TypeScript Support: Fully typed for a great development experience
• Lightweight: Minimal dependencies, only requires @microsoft/signalr

Example: Complete Support Flow

import { SupportClient } from "@fiveminutes-io/support-client";

async function runSupportExample() {
  const client = new SupportClient({
    serverUrl: "https://signalr.fiveminutes.cloud/signalr",
    applicationId: "YOUR_APP_ID",
    applicationSecret: "YOUR_SECRET",
    username: "[email protected]",
  });

  // Setup handlers
  client.onConnected(() => {
    console.log("✓ Connected to support server");
  });

  client.onSupportMessageReceived((msg) => {
    console.log(`[${msg.sender}]: ${msg.content}`);
  });

  client.onTicketCreated((ticketId) => {
    console.log(`✓ Support ticket created: ${ticketId}`);
  });

  client.onError((error) => {
    console.error(`✗ Error: ${error}`);
  });

  // Connect
  await client.connect();

  // Create a support ticket
  const ticketId = await client.createSupportTicket(
    "Billing Question",
    "How do I upgrade my subscription?"
  );

  // Send follow-up messages
  await client.sendSupportMessage(ticketId, "Can you also explain the pricing?");

  // Keep connection open to receive responses
  // In a real app, you'd keep this running until user closes the ticket
  await new Promise((resolve) => setTimeout(resolve, 30000));

  // Cleanup
  await client.disconnect();
}

runSupportExample().catch(console.error);

Build & Test

To build the package locally:

npm run build

To develop with watch mode:

npm run dev