Open Source

Philosophy

We believe the best developer tools give you complete control over the experience while handling the hard infrastructure problems. That's why our client libraries are open source.

The architecture is simple: open source clients connect to our managed API. You get full control over the frontend while we handle the backend complexity—databases, email delivery, file storage, webhooks, and scaling.

TypeScript SDK

The official TypeScript SDK is the fastest way to integrate Dispatch Tickets into your application. It's fully typed, tree-shakeable, and works in Node.js, Deno, and edge runtimes.

npm install @dispatchtickets/sdk

import { DispatchTickets } from '@dispatchtickets/sdk';

const dispatch = new DispatchTickets({
  apiKey: process.env.DISPATCH_API_KEY!
});

// Create a ticket
const ticket = await dispatch.tickets.create('br_xxx', {
  title: 'Need help with my order',
  customerEmail: '[email protected]',
  customFields: {
    orderId: '12345'
  }
});

// List tickets with filtering
const { data: tickets } = await dispatch.tickets.list('br_xxx', {
  status: 'open',
  limit: 20
});

// Add a comment
await dispatch.tickets.addComment('br_xxx', ticket.id, {
  body: 'Thanks for reaching out! Looking into this now.',
  authorType: 'STAFF'
});

SDK Features

• Full TypeScript support with autocomplete and type checking
• Automatic retries with exponential backoff
• Webhook signature verification built-in
• Error handling with typed exceptions
• Pagination helpers for iterating large datasets
• File upload utilities for attachments

Customer Portal

The embeddable customer portal is also open source. Use it as-is, customize the styling, or fork it as a starting point for your own UI.

Default Portal

Drop in our pre-built portal with a single script tag. Customize colors, copy, and behavior via configuration.

<script
  src="https://cdn.dispatchtickets.com/portal.js"
  data-brand-id="br_xxx"
  data-theme="dark"
  data-accent-color="#6366f1"
></script>

React Component

For React apps, use our component library for deeper integration:

import { TicketPortal, TicketList, NewTicketForm } from '@dispatchtickets/react';

function SupportPage() {
  return (
    <TicketPortal
      brandId="br_xxx"
      customerEmail={user.email}
      customerName={user.name}
      theme="dark"
    >
      <NewTicketForm />
      <TicketList />
    </TicketPortal>
  );
}

Custom Portal

Fork our portal repository and build your own. The portal is a Next.js app that you can deploy anywhere.

# Clone the portal template
git clone https://github.com/Epic-Design-Labs/dispatchtickets-ui my-portal
cd my-portal

# Install dependencies
npm install

# Configure your brand
cp .env.example .env.local
# Edit .env.local with your brand ID and API key

# Start development
npm run dev

# Deploy anywhere (Vercel, Netlify, etc.)
npm run build

Examples

Browse our example implementations for different frameworks and use cases:

Contributing

We welcome contributions of all kinds—bug fixes, new features, documentation improvements, and example projects.

How to Contribute

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

Development Setup

# Clone the SDK
git clone https://github.com/Epic-Design-Labs/app-dispatchtickets-sdk
cd dispatchtickets-sdk

# Install dependencies
npm install

# Run tests
npm test

# Build
npm run build

# Link for local development
npm link

Report Issues

Found a bug or have a feature request? Open an issue on GitHub: