Differential D20113 Diff 59788 cashtab/src/components/Etokens/Token/index.tsx

Changeset View

Standalone View

cashtab/src/components/Etokens/Token/index.tsx

Show First 20 Lines • Show All 126 Lines • ▼ Show 20 Lines
} from 'components/Agora/Collection';		} from 'components/Agora/Collection';
import { CashtabCachedTokenInfo } from 'config/CashtabCache';		import { CashtabCachedTokenInfo } from 'config/CashtabCache';
import { confirmRawTx } from 'components/Send/helpers';		import { confirmRawTx } from 'components/Send/helpers';
import {		import {
FIRMA,		FIRMA,
XECX_SWEEPER_ADDRESS,		XECX_SWEEPER_ADDRESS,
FIRMA_REDEEM_ADDRESS,		FIRMA_REDEEM_ADDRESS,
} from 'constants/tokens';		} from 'constants/tokens';
		import {
		FIRMA_DISPLAY_TICKER,
		applyTokenDisplayOverrides,
		} from 'constants/tokenDisplayOverrides';
import UncontrolledLink from 'components/Common/UncontrolledLink';		import UncontrolledLink from 'components/Common/UncontrolledLink';

const Token: React.FC = () => {		const Token: React.FC = () => {
const ContextValue = useContext(WalletContext);		const ContextValue = useContext(WalletContext);
if (!isWalletContextLoaded(ContextValue)) {		if (!isWalletContextLoaded(ContextValue)) {
// Confirm we have all context required to load the page		// Confirm we have all context required to load the page
return null;		return null;
}		}
Show All 39 Lines	let tokenType: undefined \| TokenType,
url: undefined \| string,		url: undefined \| string,
hash: undefined \| string,		hash: undefined \| string,
decimals: undefined \| number;		decimals: undefined \| number;

if (cachedInfoLoaded) {		if (cachedInfoLoaded) {
({ tokenType, genesisInfo, genesisSupply } = cachedInfo);		({ tokenType, genesisInfo, genesisSupply } = cachedInfo);
tokenType = tokenType as unknown as TokenType \| undefined;		tokenType = tokenType as unknown as TokenType \| undefined;
({ protocol } = tokenType as any);		({ protocol } = tokenType as any);
({ tokenName, tokenTicker, url, hash, decimals } = genesisInfo);		const displayGenesisInfo = applyTokenDisplayOverrides(
		tokenId,
		genesisInfo,
		);
		({ tokenName, tokenTicker, url, hash, decimals } = displayGenesisInfo);
}		}

let isSupportedToken = false;		let isSupportedToken = false;
let isNftParent = false;		let isNftParent = false;
let isNftChild = false;		let isNftChild = false;
let isAlp = false;		let isAlp = false;

// Assign default values which will be presented for any token without explicit support		// Assign default values which will be presented for any token without explicit support
▲ Show 20 Lines • Show All 263 Lines • ▼ Show 20 Lines	const canRedeemFirma =
previewedAgoraPartial !== null &&		previewedAgoraPartial !== null &&
maxFirmaRedeemSats >		maxFirmaRedeemSats >
previewedAgoraPartial.askedSats(		previewedAgoraPartial.askedSats(
previewedAgoraPartial.offeredAtoms(),		previewedAgoraPartial.offeredAtoms(),
);		);

const firmaRedeemErrorMsg =		const firmaRedeemErrorMsg =
maxFirmaRedeemSats === null		maxFirmaRedeemSats === null
? `Unable to fetch $FIRMA redeem hot wallet balance`		? `Unable to fetch $${FIRMA_DISPLAY_TICKER} redeem hot wallet balance`
: `Hot wallet balance cannot support redemptions of more than ${toXec(		: `Hot wallet balance cannot support redemptions of more than ${toXec(
maxFirmaRedeemSats,		maxFirmaRedeemSats,
).toLocaleString(userLocale, {		).toLocaleString(userLocale, {
maximumFractionDigits: 2,		maximumFractionDigits: 2,
minimumFractionDigits: 2,		minimumFractionDigits: 2,
})} XEC worth of $FIRMA. Top-up pending.`;		})} XEC worth of $${FIRMA_DISPLAY_TICKER}. Top-up pending.`;

/**		/**
* Convenience method to compartmentalize comparison of state		* Convenience method to compartmentalize comparison of state
* variables that require calculations		* variables that require calculations
*		*
* TODO dynamically size modals		* TODO dynamically size modals
*/		*/
const getRedeemXecxModalHeight = () => {		const getRedeemXecxModalHeight = () => {
▲ Show 20 Lines • Show All 594 Lines • ▼ Show 20 Lines	) => {
const firmaRedeemError =		const firmaRedeemError =
isRedeemingFirma && Number(amount) < FIRMA_MINIMUM_REDEMPTION;		isRedeemingFirma && Number(amount) < FIRMA_MINIMUM_REDEMPTION;

setAgoraPartialTokenQtyError(		setAgoraPartialTokenQtyError(
isValidAmountOrErrorMsg === true		isValidAmountOrErrorMsg === true
? xecxRedeemError		? xecxRedeemError
? `Cannot redeem less than 5.46 XECX`		? `Cannot redeem less than 5.46 XECX`
: firmaRedeemError		: firmaRedeemError
? `Cannot redeem less than ${FIRMA_MINIMUM_REDEMPTION} FIRMA`		? `Cannot redeem less than ${FIRMA_MINIMUM_REDEMPTION} ${FIRMA_DISPLAY_TICKER}`
: false		: false
: isValidAmountOrErrorMsg,		: isValidAmountOrErrorMsg,
);		);

setAgoraPartialTokenQty(amount);		setAgoraPartialTokenQty(amount);
};		};

const handleTokenMinSlide = (e: React.ChangeEvent<HTMLInputElement>) => {		const handleTokenMinSlide = (e: React.ChangeEvent<HTMLInputElement>) => {
▲ Show 20 Lines • Show All 1,288 Lines • ▼ Show 20 Lines	return (
actualPricePerToken.toNumber();		actualPricePerToken.toNumber();
isListingFirmaBelowBid =		isListingFirmaBelowBid =
actualPriceNumber < firmaBidPrice;		actualPriceNumber < firmaBidPrice;
}		}
return (		return (
<Modal		<Modal
title={		title={
isRedeemingFirma		isRedeemingFirma
? `Redeem $FIRMA for XEC?`		? `Redeem $${FIRMA_DISPLAY_TICKER} for XEC?`
: `List ${tokenTicker}?`		: `List ${tokenTicker}?`
}		}
disabled={		disabled={
previewedAgoraPartialUnacceptable \|\|		previewedAgoraPartialUnacceptable \|\|
(isRedeemingFirma && !canRedeemFirma) \|\|		(isRedeemingFirma && !canRedeemFirma) \|\|
isListingFirmaBelowBid		isListingFirmaBelowBid
}		}
handleOk={		handleOk={
Show All 17 Lines	return (
decimalizeTokenAmount(		decimalizeTokenAmount(
previewedAgoraPartial		previewedAgoraPartial
.offeredAtoms()		.offeredAtoms()
.toString(),		.toString(),
decimals as SlpDecimals,		decimals as SlpDecimals,
),		),
userLocale,		userLocale,
)}{' '}		)}{' '}
$FIRMA		${FIRMA_DISPLAY_TICKER}
</AgoraPreviewCol>		</AgoraPreviewCol>
</AgoraPreviewRow>		</AgoraPreviewRow>
<AgoraPreviewRow>		<AgoraPreviewRow>
<AgoraPreviewLabel>		<AgoraPreviewLabel>
You receive:{' '}		You receive:{' '}
</AgoraPreviewLabel>		</AgoraPreviewLabel>
<AgoraPreviewCol>		<AgoraPreviewCol>
{toXec(		{toXec(
Show All 9 Lines	return (
maximumFractionDigits: 2,		maximumFractionDigits: 2,
},		},
)}{' '}		)}{' '}
XEC		XEC
</AgoraPreviewCol>		</AgoraPreviewCol>
</AgoraPreviewRow>		</AgoraPreviewRow>
<AgoraPreviewRow>		<AgoraPreviewRow>
<AgoraPreviewLabel>		<AgoraPreviewLabel>
$FIRMA price:{' '}		${FIRMA_DISPLAY_TICKER}{' '}
		price:{' '}
</AgoraPreviewLabel>		</AgoraPreviewLabel>
<AgoraPreviewCol>		<AgoraPreviewCol>
{getAgoraPartialActualPrice()}		{getAgoraPartialActualPrice()}
</AgoraPreviewCol>		</AgoraPreviewCol>
</AgoraPreviewRow>		</AgoraPreviewRow>
{!canRedeemFirma && (		{!canRedeemFirma && (
<Alert noWordBreak>		<Alert noWordBreak>
{firmaRedeemErrorMsg}		{firmaRedeemErrorMsg}
▲ Show 20 Lines • Show All 86 Lines • ▼ Show 20 Lines	return (
</AgoraPreviewLabel>		</AgoraPreviewLabel>
<AgoraPreviewCol>		<AgoraPreviewCol>
{getAgoraPartialTargetPriceXec()}		{getAgoraPartialTargetPriceXec()}
</AgoraPreviewCol>		</AgoraPreviewCol>
</AgoraPreviewRow>		</AgoraPreviewRow>
{isListingFirmaBelowBid && (		{isListingFirmaBelowBid && (
<Alert noWordBreak>		<Alert noWordBreak>
⚠️ Warning: You are		⚠️ Warning: You are
listing FIRMA for{' '}		listing{' '}
		{FIRMA_DISPLAY_TICKER}{' '}
		for{' '}
{(() => {		{(() => {
const minAcceptedTokenSatoshis =		const minAcceptedTokenSatoshis =
previewedAgoraPartial.minAcceptedAtoms();		previewedAgoraPartial.minAcceptedAtoms();
const minAcceptPriceSats =		const minAcceptPriceSats =
previewedAgoraPartial.askedSats(		previewedAgoraPartial.askedSats(
minAcceptedTokenSatoshis,		minAcceptedTokenSatoshis,
);		);
const minAcceptedPriceXec =		const minAcceptedPriceXec =
Show All 16 Lines	return (
),		),
);		);
return getAgoraSpotPriceXec(		return getAgoraSpotPriceXec(
actualPricePerToken.toNumber(),		actualPricePerToken.toNumber(),
userLocale,		userLocale,
);		);
})()}{' '}		})()}{' '}
per token, which is		per token, which is
below FIRMA's current		below{' '}
buy price of{' '}		{FIRMA_DISPLAY_TICKER}'s
		current buy price of{' '}
{getAgoraSpotPriceXec(		{getAgoraSpotPriceXec(
firmaBidPrice as number,		firmaBidPrice as number,
userLocale,		userLocale,
)}{' '}		)}{' '}
per token. You should		per token. You should
redeem FIRMA instead to		redeem{' '}
get the best price.		{FIRMA_DISPLAY_TICKER}{' '}
		instead to get the best
		price.
</Alert>		</Alert>
)}		)}
</AgoraPreviewTable>		</AgoraPreviewTable>
<AgoraPreviewParagraph>		<AgoraPreviewParagraph>
If actual price is not close to		If actual price is not close to
target price, increase your min		target price, increase your min
buy.		buy.
</AgoraPreviewParagraph>		</AgoraPreviewParagraph>
▲ Show 20 Lines • Show All 694 Lines • ▼ Show 20 Lines
}		}
onClick={		onClick={
previewFirmaPartial		previewFirmaPartial
}		}
>		>
{isCalculatingRedeemFirma ? (		{isCalculatingRedeemFirma ? (
<InlineLoader />		<InlineLoader />
) : (		) : (
`Redeem FIRMA for XEC`		`Redeem ${FIRMA_DISPLAY_TICKER} for XEC`
)}		)}
</PrimaryButton>		</PrimaryButton>
</SendTokenFormRow>		</SendTokenFormRow>
</SectionCtn>		</SectionCtn>
</>		</>
)}		)}
</>		</>
)}		)}
▲ Show 20 Lines • Show All 453 Lines • Show Last 20 Lines