Primeiros passos

Visão geral

O Trustless Work React SDK é uma coleção de hooks e entidades tipadas.

Ele usa Axios para requisições HTTP.

Fluxos de escrita requerem uma chave de API (NEXT_PUBLIC_API_KEY). Chamadas somente de leitura podem funcionar sem uma.

Links rápidos

Título

Pacote NPM

Link

https://www.npmjs.com/package/@trustless-work/escrow

Título

Noções básicas da API (URLs base, Swagger, limites)

Link

Introdução

Título

Enviar transações assinadas (XDR)

Link

useSendTransaction

Configuração

1

Instalação

Instale o SDK.

npm

npm install "@trustless-work/escrow"

yarn

yarn add "@trustless-work/escrow"

2

Configure o provedor

Você irá configurar 2 coisas:

• baseURL: use development (testnet) ou mainNet (mainnet).

• apiKey: a partir do dApp BackOffice.

O SDK exporta TrustlessWorkConfig. Envolva seu app com ele para habilitar todos os hooks.

src/trustless-work-provider.tsx

"use client"; // certifique-se de que este é um componente cliente

import React from "react";
import {
  // ambiente de desenvolvimento = "https://dev.api.trustlesswork.com"
  development,

  // ambiente mainnet = "https://api.trustlesswork.com"
  mainNet,
  TrustlessWorkConfig,
} from "@trustless-work/escrow";

interface TrustlessWorkProviderProps {
  children: React.ReactNode;
}

export function TrustlessWorkProvider({
  children,
}: TrustlessWorkProviderProps) {
  const apiKey = process.env.NEXT_PUBLIC_API_KEY || "";

  return (
    <TrustlessWorkConfig baseURL={development} apiKey={apiKey}>
      {children}
    </TrustlessWorkConfig>
  );
}

Se você renderizar este provedor no servidor, os hooks irão quebrar. Mantenha-o em um componente cliente.

3

Envolva seu app

Escolha o trecho que corresponde à sua configuração.

Next.js (App Router)

app/layout.tsx

import { TrustlessWorkProvider } from "@/trustless-work-provider";
 
export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        <TrustlessWorkProvider>{children}</TrustlessWorkProvider>
      </body>
    </html>
  );
}

React (SPA)

src/app.tsx

import { TrustlessWorkProvider } from "./trustless-work-provider";
 
export function App() {
  return (
    <TrustlessWorkProvider>
      <YourApp />
    </TrustlessWorkProvider>
  );
}

4

Use hooks e entidades

Você agora pode chamar os hooks do SDK de qualquer componente sob o provedor.

Fluxo típico:

1. Chame um hook para obter um XDR não assinado.

2. Assine o XDR com a carteira do papel (role) correta.

3. Submeta-o com useSendTransaction.

Leitura: useSendTransaction.

Este SDK suporta single-release e multi-release escrows. Use o hook correto + tipo de payload para cada fluxo.