diff --git a/src/models/Token.ts b/src/models/Token.ts
index f42e56d..393bd83 100644
--- a/src/models/Token.ts
+++ b/src/models/Token.ts
@@ -57,4 +57,25 @@ export class Token {
toFixedDecimal(digits = 7): string {
return this.toDecimal.toFixed(digits)
}
+
+ toSignificantDigits(digits = 4): string {
+ const asString = this.toDecimal.toFixed(16)
+
+ let indexOfSignificantDigit = -1
+ let reachedDecimalPoint = false
+
+ for (let i = 0; i < asString.length; i++) {
+ const char = asString[i]
+
+ if (char === '.') {
+ reachedDecimalPoint = true
+ indexOfSignificantDigit = i + 1
+ } else if (reachedDecimalPoint && char !== '0') {
+ indexOfSignificantDigit = i
+ break
+ }
+ }
+
+ return asString.slice(0, indexOfSignificantDigit + digits)
+ }
}
diff --git a/src/pages/stamps/PostageStampCreation.tsx b/src/pages/stamps/PostageStampCreation.tsx
index a746c08..0c7217b 100644
--- a/src/pages/stamps/PostageStampCreation.tsx
+++ b/src/pages/stamps/PostageStampCreation.tsx
@@ -2,20 +2,14 @@ import { Box, Grid, Typography } from '@material-ui/core'
import BigNumber from 'bignumber.js'
import { Form, Formik, FormikHelpers } from 'formik'
import { useSnackbar } from 'notistack'
-import React, { ReactElement, useContext } from 'react'
+import { ReactElement, useContext } from 'react'
import { Check } from 'react-feather'
import { SwarmButton } from '../../components/SwarmButton'
import { SwarmTextInput } from '../../components/SwarmTextInput'
import { Context as BeeContext } from '../../providers/Bee'
import { Context as SettingsContext } from '../../providers/Settings'
import { Context as StampsContext } from '../../providers/Stamps'
-import {
- calculateStampPrice,
- convertAmountToSeconds,
- convertDepthToBytes,
- formatBzz,
- secondsToTimeString,
-} from '../../utils'
+import { calculateStampPrice, convertAmountToSeconds, convertDepthToBytes, secondsToTimeString } from '../../utils'
import { getHumanReadableFileSize } from '../../utils/file'
interface FormValues {
@@ -50,24 +44,27 @@ export function PostageStampCreation({ onFinished }: Props): ReactElement {
}
function getTtl(amount: number): string {
- if (isNaN(amount) || amount <= 0) {
- return '-'
- }
-
- return secondsToTimeString(convertAmountToSeconds(amount))
- }
-
- function getPrice(depth: number, amount: number): string {
- const hasInvalidInput = isNaN(amount) || amount <= 0 || isNaN(depth) || depth < 17 || depth > 255
const isCurrentPriceAvailable = chainState && chainState.currentPrice
- if (hasInvalidInput || !isCurrentPriceAvailable) {
+ if (amount <= 0 || !isCurrentPriceAvailable) {
return '-'
}
- const price = calculateStampPrice(depth, amount, chainState.currentPrice)
+ const pricePerBlock = Number.parseInt(chainState.currentPrice, 10)
- return `${formatBzz(price)} BZZ`
+ return `${secondsToTimeString(convertAmountToSeconds(amount, pricePerBlock))} (with price of 0 per block)`
+ }
+
+ function getPrice(depth: number, amount: bigint): string {
+ const hasInvalidInput = amount <= 0 || isNaN(depth) || depth < 17 || depth > 255
+
+ if (hasInvalidInput) {
+ return '-'
+ }
+
+ const price = calculateStampPrice(depth, amount)
+
+ return `${price.toSignificantDigits()} BZZ`
}
return (
@@ -136,7 +133,7 @@ export function PostageStampCreation({ onFinished }: Props): ReactElement {
Corresponding TTL (Time to live)
- {getTtl(parseInt(values.amount || '0', 10))}
+ {getTtl(Number.parseInt(values.amount || '0', 10))}
@@ -146,7 +143,7 @@ export function PostageStampCreation({ onFinished }: Props): ReactElement {
Indicative Price
- {getPrice(parseInt(values.depth || '0', 10), parseInt(values.amount || '0', 10))}
+ {getPrice(parseInt(values.depth || '0', 10), BigInt(values.amount || '0'))}