1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-26 12:29:06 +01:00
metamask-extension/ui/hooks/useTokenDisplayValue.js
Mark Stacey 3732c5f71e
Add JSDoc ESLint rules (#12112)
ESLint rules have been added to enforce our JSDoc conventions. These
rules were introduced by updating `@metamask/eslint-config` to v9.

Some of the rules have been disabled because the effort to fix all lint
errors was too high. It might be easiest to enable these rules one
directory at a time, or one rule at a time.

Most of the changes in this PR were a result of running
`yarn lint:fix`. There were a handful of manual changes that seemed
obvious and simple to make. Anything beyond that and the rule was left
disabled.
2022-01-07 12:27:33 -03:30

59 lines
2.3 KiB
JavaScript

import { useMemo } from 'react';
import {
getTokenValueParam,
calcTokenAmount,
} from '../helpers/utils/token-util';
import { useTokenData } from './useTokenData';
/**
* Defines the shape for the Token input parameter for useTokenDisplayValue
*
* @typedef {Object} Token
* @property {string} symbol - The string to use as a suffix for the token (eg. DAI)
* @property {number} decimals - The number of decimals to show when displaying this type of token
*/
/**
* useTokenDisplayValue
* Given the data string from txParams and a token object with symbol and decimals, return
* a displayValue that represents a string representing that token amount as a string. Also
* return a tokenData object for downstream usage and the suffix for the token to use as props
* for other hooks and/or components
*
* @param {string} [transactionData] - Raw data string from token transaction
* @param {Token} [token] - The token associated with this transaction
* @param {boolean} [isTokenTransaction] - Due to the nature of hooks, it isn't possible
* to conditionally call this hook. This flag will
* force this hook to return null if it set as false
* which indicates the transaction is not associated
* with a token.
* @returns {string} The computed displayValue of the provided transactionData and token
*/
export function useTokenDisplayValue(
transactionData,
token,
isTokenTransaction = true,
) {
const tokenData = useTokenData(transactionData, isTokenTransaction);
const shouldCalculateTokenValue = Boolean(
// If we are currently processing a token transaction
isTokenTransaction &&
// and raw transaction data string is provided
transactionData &&
// and a token object has been provided
token &&
// and we are able to parse the token details from the raw data
tokenData?.args?.length,
);
const displayValue = useMemo(() => {
if (!shouldCalculateTokenValue) {
return null;
}
const tokenValue = getTokenValueParam(tokenData);
return calcTokenAmount(tokenValue, token.decimals).toString(10);
}, [shouldCalculateTokenValue, tokenData, token]);
return displayValue;
}