SDK React

npm install @smartbills/sdk @smartbills/react-hooks-sdk @tanstack/react-query

npm install @smartbills/react-sdk

import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { SmartbillsClient } from "@smartbills/sdk";
import { SmartbillsProvider, useExpenses } from "@smartbills/react-hooks-sdk";

const queryClient = new QueryClient();
const client = new SmartbillsClient({ accessToken: "your-token", businessId: 42 });

function App() {
  return (
    <QueryClientProvider client={queryClient}>
      <SmartbillsProvider client={client} businessId={42}>
        <ExpenseList />
      </SmartbillsProvider>
    </QueryClientProvider>
  );
}

function ExpenseList() {
  const { data, fetchNextPage, hasNextPage, isLoading } = useExpenses({ limit: 25 });
  if (isLoading) return <div>Chargement...</div>;
  const expenses = data?.pages.flatMap((p) => p.data) ?? [];
  return (
    <ul>
      {expenses.map((e) => <li key={e.id}>{e.vendor?.name}</li>)}
      {hasNextPage && <button onClick={() => fetchNextPage()}>Charger plus</button>}
    </ul>
  );
}