generic-invoice.tsx

import * as React from "react";
import "./styles.css";
import useTest from "./hook";

interface Invoice {
  id: string
  amount: number
  url: string
}

export default function App() {
  const [getInvoice, errorMessage, invoice] = useTest<Invoice>();
  return (
    <div className="App">
      <h1>Simple API Hook Demo</h1>
      <button onClick={() => getInvoice("/invoice/123")}>Get Invoice</button>
      <div>
        {invoice ? (
          <div>
            <h5>{invoice.id}</h5>
            <h6>{invoice.amount}</h6>
            <h6>{invoice.url}</h6>
          </div>
        ) : (
          <h6 style={{ color: "red" }}>{errorMessage}</h6>
        )}
      </div>
    </div>
  );
}