Skip to main content

Number utility

Denominated number

To handle complexity around planck unit used in Polkadot, a utility class DenominatedNumber is provided by @reactive-dot/utils.

import { DenominatedNumber } from "@reactive-dot/utils";

// Denominated numbers are created with a planck value and a decimal places number

const numberFromPlanck = new DenominatedNumber(10_000_000_000n, 10);

console.log(numberFromPlanck.valueOf()); // 10

// Denominated number can also be created from number instead of planck

const numberFromNumber = DenominatedNumber.fromNumber(10, 10);

console.log(numberFromNumber.planck); // 10000000000n

// A string denomination can optionally be added for locale string conversion capability

const numberWithDenomination = DenominatedNumber.fromNumber(10, 10, "DOT");

console.log(numberWithDenomination.toLocaleString("en-NZ")); // DOT 10.00

console.log(numberWithDenomination.toLocaleString("de-DE")); // 10,00 DOT

// Arithmetics

let dotAmount = DenominatedNumber.fromNumber(10, 10, "DOT");

// Arithmetic operations can be performed using the number's planck value

dotAmount = dotAmount.mapFromPlanck((planck) => planck + 5_000_000_000n);

console.log(dotAmount.toLocaleString()); // DOT 10.50

// Arithmetic operations can also be carried out with the number value
// instead of planck if possible lost of precision is acceptable

dotAmount = dotAmount.mapFromNumber((number) => (number * 2) / 4);

console.log(dotAmount.toLocaleString()); // DOT 5.25

Native token

Two hooks useNativeTokenAmountFromPlanck & useNativeTokenAmountFromNumber are also provided for easy conversion from planck and/or number value to native token amount.

import {
useNativeTokenAmountFromNumber,
useNativeTokenAmountFromPlanck,
} from "@reactive-dot/react";

let amount = useNativeTokenAmountFromPlanck(10_000_000_000n);
// Or
amount = useNativeTokenAmountFromNumber(1);

console.log(amount.toLocaleString("en-NZ")); // DOT 1.00

// Partial application is also supported by omitting the planck/number value.
// Here, a conversion function will be returned instead.
const amountFromPlanck = useNativeTokenAmountFromPlanck();

[10_000_000_000n, 20_000_000_000n, 30_000_000_000n]
.map(amountFromPlanck)
.map((amount) => amount.toLocaleString("en-NZ"))
.forEach(console.log);
// DOT 1.00
// DOT 2.00
// DOT 3.00

Spendable balance

The useSpendableBalance hook can be used to get the spendable balance of an account(s).

import { useSpendableBalance } from "@reactive-dot/react";

const spendableBalance = useSpendableBalance(ACCOUNT_ADDRESS);

console.log(spendableBalance.toLocaleString("en-NZ")); // DOT 10.00

const spendableBalances = useSpendableBalance([
ACCOUNT_ADDRESS_1,
ACCOUNT_ADDRESS_2,
ACCOUNT_ADDRESS_3,
]);

console.log(
spendableBalances.map((balance) => balance.toLocaleString("en-NZ")),
); // ["DOT 10.00", "DOT 20.00", "DOT 30.00"]