Blocos dependentes

Alguns blocos dependem de módulos compartilhados (providers, helpers, query, etc).

Instale as dependências primeiro.

Se você pular dependências, encontrará erros de contexto ausente em tempo de execução.

Diagrama de dependências

Use o diagrama de dependências interativo para confirmar do que um bloco precisa.

Trustless Work Blocks | React Components for Blockchain EscrowsTrustless Work Blocks

Dependências por grupo de blocos

Listagens (Escrows por Signatário / Escrows por Função)

Aplica-se a:

Escrows por Signatário: Tabela, Cartões
Escrows por Função: Tabela, Cartões

Módulos necessários:

wallet-kit
providers
handle-errors
helpers
tanstack
escrows/single-release ou escrows/multi-release ou escrows/single-multi-release (depende de quais ações você quer habilitar)

Incluir todos providers para listagens.

As listagens abrem diálogos de detalhes e precisam dos contextos dialog + amount.

CLI (exemplos)

# Core
npx trustless-work add wallet-kit
npx trustless-work add tanstack
npx trustless-work add providers

# Actions (escolha o que você precisa)
npx trustless-work add escrows/single-release
# npx trustless-work add escrows/multi-release
# npx trustless-work add escrows/single-multi-release

# Módulos utilitários opcionais
npx trustless-work add handle-errors
npx trustless-work add helpers

Ações (single-release / multi-release)

Todas as ações single-release e multi-release (Inicializar Escrow, Financiar Escrow, Alterar Status do Marco, Aprovar Marco, Liberar, Disputar, Resolver, Atualizar Escrow) requerem:

wallet-kit
providers
handle-errors
tanstack
helpers

CLI (mínimo para ações)

npx trustless-work add wallet-kit
npx trustless-work add tanstack
npx trustless-work add providers

npx trustless-work add handle-errors
npx trustless-work add helpers

Encapsulamento de providers (a ordem importa)

Encapsule seu app com esses providers, nesta ordem exata.

Incluir EscrowDialogsProvider e EscrowAmountProvider quando você usa diálogos ou o contexto de amount.

Não reordene os providers.

A maioria dos problemas de “hooks não funcionando” vem da ordem dos providers.

app/layout.tsx

import { ReactQueryClientProvider } from "@/components/tw-blocks/providers/ReactQueryClientProvider";
import { TrustlessWorkProvider } from "@/components/tw-blocks/providers/TrustlessWork";
import { WalletProvider } from "@/components/tw-blocks/wallet-kit/WalletProvider";
import { EscrowProvider } from "@/components/tw-blocks/providers/EscrowProvider";
import { EscrowDialogsProvider } from "@/components/tw-blocks/providers/EscrowDialogsProvider";
import { EscrowAmountProvider } from "@/components/tw-blocks/providers/EscrowAmountProvider";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        <ReactQueryClientProvider>
          <TrustlessWorkProvider>
            <WalletProvider>
              <EscrowProvider>
                <EscrowDialogsProvider>
                  <EscrowAmountProvider>
                    {children}
                  </EscrowAmountProvider>
                </EscrowDialogsProvider>
              </EscrowProvider>
            </WalletProvider>
          </TrustlessWorkProvider>
        </ReactQueryClientProvider>
      </body>
    </html>
  );
}

AnteriorCiclo de vida de liberação única PróximoKit de carteira

Atualizado há 4 meses