Next.js Server Actions

"use server";

import { AssembledTransaction } from "@stellar/stellar-sdk/contract";
import { fetchContractSpec } from "@sorokit/contract";
import { resolveSorokitConfig } from "@sorokit/core";
import { QueryClient } from "@tanstack/react-query";

export async function prepareMintAction(address: string) {
  const config = resolveSorokitConfig({ network: "TESTNET" });
  const queryClient = new QueryClient();

  const spec = await fetchContractSpec("C...", config, queryClient);

  const tx = await AssembledTransaction.build({
    contractId: "C...",
    method: "mint",
    args: spec.funcArgsToScVals("mint", { to: address }),
    networkPassphrase: config.networkPassphrase,
    rpcUrl: config.rpcUrl,
  });

  return tx.toJson();
}

"use client";

import { useWallet } from "@sorokit/wallet-adapter";
import { prepareMintAction } from "./actions";

export function MintButton() {
  const { signTransaction } = useWallet();

  const handleAction = async () => {
    // Fetch the prepared transaction from the server
    const json = await prepareMintAction();

    // Reconstruct and sign
    const tx = AssembledTransaction.fromJson({...}, JSON.parse(json));
    await tx.signAndSend({ signTransaction });
  };

  return <button onClick={handleAction}>Server-Side Mint</button>;
}