Skip to main content
Specifically, we need to add two elements:
  • The form to create a ticket
  • A table showing the tickets

Create a ticket form

The form to create a ticket is a simple HTML and React form that can be added to your app. To create a ticket, we need to add the CreateTicket(specify as component) component.
<script async type="text/javascript" src="https://client.lexi.ai/create-ticket.ab.js"></script>
 
<ab-create-ticket ticketFormID="YOUR-TICKET-FORM-ID" userID="USER-ID">
  <button>Create ticket</button>
</ab-create-ticket>
You can find the Ticket Form ID in the Ticket Form settings under the Settings tab.

Display tickets ina table

To display the tickets in a table, we need to add the <ab-tickets-table></ab-tickets-table> element.
<script async type="text/javascript" src="https://client.lexi.ai/tickets-table.ab.js"></script>
 
<ab-tickets-table ticketFormID="YOUR-TICKET-FORM-ID" userID="USER-ID"></ab-tickets-table>
This will render a table showing the tickets for the user with the ID USER-ID. If you want to only display tickets with a specific status, you can include these statuses using the status attribute.
React
import { TicketsTable } from '@aidbase/tickets-table';
 
<TicketsTable
  ticketFormID="YOUR-TICKET-FORM-ID"
  userID="USER-ID"
  status="OPEN,ASSIGNED,NEED_MORE_INFO"
/>

Display a single ticket

To display a single ticket, we need to add the <ab-ticket></ab-ticket> element.
<script async type="text/javascript" src="https://client.aidbase.ai/ticket.ab.js"></script>
 
<ab-ticket ticketFormID="YOUR-TICKET-FORM-ID" ticketID="TICKET-ID">
  <button>Open ticket</button>
</ab-ticket>
The TICKET-ID should be the ID of the ticket you want to display. This ID can be found in on the Tickets page in the LEXI Dashboard for a given ticket. It can also be retrieved through the payload of a webhook.

Additional user information

In addition to the userID, you can also include username, email and profileImageURL. We recommend including as many of them as you have available.
<ab-tickets-table
  ticketFormID="YOUR-TICKET-FORM-ID"
  userID="USER-ID"
  username="John Doe"
  email="[email protected]"
  profileImageURL="https://example.com/profile-image.png"
></ab-tickets-table>