Skip to main content

useTickets

Reactive list of the identified customer's tickets. Loading, error, and refetch baked in. Calls the chat client under the hood — the customer must be identified.

Usage

MyTickets.tsx
import { useTickets } from '@cstar.help/react';

export function MyTickets() {
  const { tickets, isLoading, error, create, refetch } = useTickets({
    status: 'open',
    limit: 20
  });

  if (isLoading) return <p>Loading...</p>;
  if (error) return <p>Couldn't load — try again?</p>;

  return (
    <div>
      <button onClick={async () => {
        await create({ title: 'New question' });
        // Hook auto-refetches; calling refetch() yourself works too
      }}>
        New ticket
      </button>
      <ul>
        {tickets.map((t) => (
          <li key={t.id}>{t.title}</li>
        ))}
      </ul>
    </div>
  );
}

What it returns

  • tickets — array. Empty until the first fetch resolves.
  • isLoading — boolean. True during the initial fetch and refetches.
  • error — Error | null.
  • create(params) — Promise. Refetches the list on success.
  • refetch() — Promise. Bypass the auto-refresh cadence.

Next up