Skip to content

thirdweb@5.76.0
Compare
Choose a tag to compare
@jnsdls jnsdls released this 10 Dec 02:40
· 1562 commits to main since this release
thirdweb@5.76.0
5158def
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode.

Minor Changes

  • #5533 43fbcac Thanks @kien-ngo! - The Connected-details button now shows USD value next to the token balance.

    Breaking change to the AccountBalance

    The formatFn props now takes in an object of type AccountBalanceInfo. The old formatFn was inflexible because it only allowed you to format the balance value.
    With this new version, you have access to both the balance and symbol.

    import { AccountBalance, type AccountBalanceInfo } from "thirdweb/react";

<AccountBalance
  // Show the symbol in lowercase, before the balance
  formatFn={(props: AccountBalanceInfo) =>
    `${props.symbol.toLowerCase()} ${props.balance}`
  }
/>;

    AccountBalance now supports showing the token balance in fiat value (only USD supported at the moment)

    <AccountBalance showBalanceInFiat="USD" />

    The formatFn prop now takes in an object of type AccountBalanceInfo and outputs a string

    import { AccountBalance, type AccountBalanceInfo } from "thirdweb/react";

<AccountBalance
  formatFn={(props: AccountBalanceInfo) =>
    `${props.balance}---${props.symbol.toLowerCase()}`
  }
/>;

// Result: 11.12---eth

    ConnectButton also supports displaying balance in fiat since it uses AccountBalance internally

    <ConnectButton
  // Show USD value on the button
  detailsButton={{
    showBalanceInFiat: "USD",
  }}
  // Show USD value on the modal
  detailsModal={{
    showBalanceInFiat: "USD",
  }}
/>

    Export utils functions:

    formatNumber: Round up a number to a certain decimal place

    import { formatNumber } from "thirdweb/utils";
const value = formatNumber(12.1214141, 1); // 12.1

    shortenLargeNumber: Shorten the string for large value. Mainly used for the AccountBalance's formatFn

    import { shortenLargeNumber } from "thirdweb/utils";
const numStr = shortenLargeNumber(1_000_000_000);

    Fix to ConnectButton

    The social image of the Details button now display correctly for non-square image.

    Massive test coverage improvement for the Connected-button components

  • #5655 f69d1aa Thanks @kien-ngo! - Improve NFT Components

    • Add custom resolver methods to NFTMedia, NFTName and NFTDescription
    • Add caching for the NFT-info-getter method to improve performance
    • Small fix to handle falsy values for NFT media src, name and description
    • Improve test coverage by extracting internal logics and testing them

Patch Changes

Assets 2
Loading