useLoans

Hook for loading loans.

JavaScript

import { Loan, useLoans } from "@niftyapes/sdk";

Usage

This hook uses React Query for data fetching and returns the complete useQueryobject in the response.

TypeScript

import React from "react";
import { Loan, useLoans } from "@niftyapes/sdk";
import { formatEther } from "ethers/lib/utils";

const UseLoans: React.FC = () => {
  const { data, isFetched } = useLoans({
    buyer: "0x1d671d1B191323A38490972D58354971E5c1cd2A",
  });

  if (!isFetched) {
    return <div>Loading...</div>;
  }

  return (
    <div>
      <div>{data?.length} Loans</div>
      <div>
        {data?.map((loan: Loan, idx) => {
          return (
            <div key={`loan-${idx}`}>
              {loan.status}
              <span style={{ margin: "10px" }}>
                Total {`${formatEther(loan.offer.offer.price)} ETH`}
              </span>
              <span style={{ margin: "10px" }}>
                Payments {loan.paymentHistory.length}
              </span>
              <span style={{ margin: "10px" }}>
                Principal {`${formatEther(loan.loan.remainingPrincipal)} ETH`}
              </span>
            </div>
          );
        })}
      </div>
    </div>
  );
};

export default UseLoans;

Configuration

TypeScript

type IUseLoanConfig = {
  buyer?: Address;
  seller?: Address;
  collection?: Address;
  nftId?: string;
  onlyActive?: boolean;
};

buyer (optional)

Buyer address.

JavaScript

{
   buyer:'0x4298e663517593284Ad4FE199b21815BD48a9969'
}

seller (optional)

JavaScript

{
   seller:'0x4298e663517593284Ad4FE199b21815BD48a9969'
}