Tickets Hooks

import { useEditUserTicket } from '@meaple/react-query'
 
function EditTicketForm({ ticketId }) {
  const editTicket = useEditUserTicket()
 
  const handleUpdate = async (data) => {
    await editTicket.mutateAsync({
      ticketId,
      name: data.name,
      email: data.email
    })
  }
 
  return (
    <form onSubmit={handleSubmit(handleUpdate)}>
      <input name="name" placeholder="Name" />
      <input name="email" type="email" placeholder="Email" />
 
      <button type="submit" disabled={editTicket.isPending}>
        {editTicket.isPending ? 'Saving...' : 'Update Ticket'}
      </button>
 
      {editTicket.isSuccess && (
        <div>Ticket updated successfully!</div>
      )}
    </form>
  )
}

import { useTransferTicket } from '@meaple/react-query'
 
function TransferTicketButton({ ticketId }) {
  const transferTicket = useTransferTicket()
 
  const handleTransfer = async (recipientEmail) => {
    try {
      await transferTicket.mutateAsync({
        ticketId,
        recipientEmail
      })
 
      alert('Ticket transferred successfully!')
    } catch (error) {
      alert(`Transfer failed: ${error.message}`)
    }
  }
 
  return (
    <button
      onClick={() => {
        const email = prompt('Enter recipient email:')
        if (email) handleTransfer(email)
      }}
      disabled={transferTicket.isPending}
    >
      Transfer Ticket
    </button>
  )
}

interface EditTicketData {
  ticketId: string;
  name?: string;
  email?: string;
  phone?: string;
  metadata?: Record<string, any>;
}
 
interface TransferTicketData {
  ticketId: string;
  recipientEmail: string;
  message?: string;
}

function TicketActions({ ticketId }) {
  const editTicket = useEditUserTicket()
  const transferTicket = useTransferTicket()
 
  const isLoading = editTicket.isPending || transferTicket.isPending
 
  return (
    <div>
      <button
        onClick={() => editTicket.mutate({ ticketId, name: 'New Name' })}
        disabled={isLoading}
      >
        Edit
      </button>
 
      <button
        onClick={() => transferTicket.mutate({
          ticketId,
          recipientEmail: 'user@example.com'
        })}
        disabled={isLoading}
      >
        Transfer
      </button>
 
      {isLoading && <span>Processing...</span>}
    </div>
  )
}

const editTicket = useEditUserTicket({
  onSuccess: () => {
    queryClient.invalidateQueries({ queryKey: ['userTickets'] });
    queryClient.invalidateQueries({ queryKey: ['eventTickets'] });
  },
});
 
const transferTicket = useTransferTicket({
  onSuccess: () => {
    queryClient.invalidateQueries({ queryKey: ['userTickets'] });
  },
});