Skip to content

Commit

Permalink
AddressOverview,Sidebar,MobileActionBar: use CryptoCurrency enum inst…
Browse files Browse the repository at this point in the history
…ead of strings
  • Loading branch information
danimoh committed Nov 25, 2024
1 parent d2785dc commit 345213a
Show file tree
Hide file tree
Showing 3 changed files with 45 additions and 33 deletions.
2 changes: 1 addition & 1 deletion src/components/MobileActionBar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ export default defineComponent({
const { config } = useConfig();
const sendDisabled = computed(() => {
if (activeCurrency.value === 'nim' && config.disableNetworkInteraction) return true;
if (config.disableNetworkInteraction && activeCurrency.value === CryptoCurrency.NIM) return true;
return context.root.$route.path !== '/' && nimOrBtcOrStable(
!activeAddressInfo.value || !activeAddressInfo.value.balance,
!btcBalance.value,
Expand Down
68 changes: 39 additions & 29 deletions src/components/layouts/AddressOverview.vue
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
<SearchBar v-model="searchString"/>

<CashlinkButton
v-if="activeCurrency === 'nim' && unclaimedCashlinkCount"
v-if="activeCurrency === CrypoCurrency.NIM && unclaimedCashlinkCount"
:showUnclaimedCashlinkList="showUnclaimedCashlinkList"
:unclaimedCashlinkCount="unclaimedCashlinkCount"
@toggle-unclaimed-cashlink-list="toggleUnclaimedCashlinkList"
Expand All @@ -27,19 +27,19 @@
>
<MenuDotsIcon/>
<div class="popup-menu nq-blue-bg">
<button v-if="activeCurrency === 'nim'"
<button v-if="activeCurrency === CryptoCurrency.NIM"
class="reset flex-row"
@pointerdown="rename(activeAccountId, activeAddressInfo.address)"
>
<RenameIcon/>{{ $t('Rename') }}
</button>
<button v-if="activeCurrency === 'nim'"
<button v-if="activeCurrency === CryptoCurrency.NIM"
class="reset flex-row"
@mousedown="$router.push('/staking')"
>
<TwoLeafStakingIcon/>{{ $t('Staking') }}
</button>
<button v-if="activeCurrency === 'btc'"
<button v-if="activeCurrency === CryptoCurrency.BTC"
class="reset flex-row"
@pointerdown="rescan"
>
Expand Down Expand Up @@ -70,22 +70,22 @@

<div class="active-address flex-row">
<div class="identicon-wrapper">
<Identicon v-if="activeCurrency === 'nim'" :address="activeAddressInfo.address" />
<BitcoinIcon v-if="activeCurrency === 'btc'"/>
<UsdcIcon v-if="activeCurrency === 'usdc'"/>
<Identicon v-if="activeCurrency === CryptoCurrency.NIM" :address="activeAddressInfo.address" />
<BitcoinIcon v-if="activeCurrency === CryptoCurrency.BTC"/>
<UsdcIcon v-if="activeCurrency === CryptoCurrency.USDC"/>
<UsdtIcon v-if="activeCurrency === CryptoCurrency.USDT"/>
<button class="reset identicon-menu flex-row"
@click="$event.currentTarget.focus() /* Required for MacOS Safari & Firefox */"
>
<GearIcon/>
<div class="popup-menu nq-blue-bg">
<button v-if="activeCurrency === 'nim'"
<button v-if="activeCurrency === CryptoCurrency.NIM"
class="reset flex-row"
@pointerdown="rename(activeAccountId, activeAddressInfo.address)"
>
<RenameIcon/>{{ $t('Rename') }}
</button>
<button v-if="activeCurrency === 'btc'"
<button v-if="activeCurrency === CryptoCurrency.BTC"
class="reset flex-row"
@pointerdown="rescan"
>
Expand Down Expand Up @@ -114,23 +114,31 @@
</div>
<div class="meta">
<div class="flex-row">
<div v-if="activeCurrency === 'nim'" class="label">{{activeAddressInfo.label}}</div>
<div v-if="activeCurrency === 'btc'" class="label bitcoin">{{ $t('Bitcoin') }}</div>
<div v-if="activeCurrency === 'usdc'" class="label usdc">{{ $t('USD Coin') }}</div>
<div v-if="activeCurrency === CryptoCurrency.NIM" class="label">
{{ activeAddressInfo.label }}
</div>
<div v-if="activeCurrency === CryptoCurrency.BTC" class="label bitcoin">
{{ $t('Bitcoin') }}
</div>
<div v-if="activeCurrency === CryptoCurrency.USDC" class="label usdc">
{{ $t('USD Coin') }}
</div>
<div v-if="activeCurrency === CryptoCurrency.USDT" class="label usdt">
{{ $t('Tether USD') }}
</div>
<Amount v-if="activeCurrency === 'nim'" :amount="activeAddressInfo.balance" value-mask/>
<Amount v-if="activeCurrency === 'btc'" :amount="btcAccountBalance" currency="btc" value-mask/>
<Amount v-if="activeCurrency === 'usdc'"
<Amount v-if="activeCurrency === CryptoCurrency.NIM" :amount="activeAddressInfo.balance"
value-mask/>
<Amount v-if="activeCurrency === CryptoCurrency.BTC" :amount="btcAccountBalance" currency="btc"
value-mask/>
<Amount v-if="activeCurrency === CryptoCurrency.USDC"
:amount="accountUsdcBridgedBalance + accountUsdcBalance" currency="usdc" value-mask/>
<Amount v-if="activeCurrency === CryptoCurrency.USDT"
:amount="accountUsdtBridgedBalance" :currency="CryptoCurrency.USDT" value-mask/>
</div>
<div class="flex-row">
<!-- We need to key the Copyable component, so that the tooltip disappears when
switching addresses while the tooltip is showing -->
<Copyable v-if="activeCurrency === 'nim'"
<Copyable v-if="activeCurrency === CryptoCurrency.NIM"
:text="activeAddressInfo.address" :key="activeAddressInfo.address"
>
<div class="address" ref="address$" :class="{ 'masked': addressMasked }">
Expand All @@ -140,7 +148,7 @@
<!--
Don't show Polygon address. User can see the polygon address in the send/receive flows, so
we can show also the warnings.
<Copyable v-if="activeCurrency === 'usdc'"
<Copyable v-if="activeCurrency === CryptoCurrency.USDC"
:text="usdcAddressInfo.address" :key="usdcAddressInfo.address"
>
<div class="address" ref="address$" :class="{ 'masked': addressMasked }">
Expand All @@ -149,14 +157,15 @@
</Copyable>
-->

<FiatConvertedAmount v-if="activeCurrency === 'nim' && activeAddressInfo.balance !== null"
<FiatConvertedAmount
v-if="activeCurrency === CryptoCurrency.NIM && activeAddressInfo.balance !== null"
:amount="activeAddressInfo.balance" currency="nim" value-mask/>
<span v-else-if="activeCurrency === 'nim'" class="fiat-amount"></span>
<span v-else-if="activeCurrency === CryptoCurrency.NIM" class="fiat-amount"></span>

<FiatConvertedAmount v-if="activeCurrency === 'btc'"
<FiatConvertedAmount v-if="activeCurrency === CryptoCurrency.BTC"
:amount="btcAccountBalance" currency="btc" value-mask/>

<FiatConvertedAmount v-if="activeCurrency === 'usdc'"
<FiatConvertedAmount v-if="activeCurrency === CryptoCurrency.USDC"
:amount="accountUsdcBridgedBalance + accountUsdcBalance " currency="usdc" value-mask/>
<FiatConvertedAmount v-if="activeCurrency === CryptoCurrency.USDT"
:amount="accountUsdtBridgedBalance " currency="usdt" value-mask/>
Expand All @@ -169,25 +178,26 @@

<div class="flex-row ml-auto">
<CashlinkButton
v-if="activeCurrency === 'nim' && unclaimedCashlinkCount"
v-if="activeCurrency === CryptoCurrency.NIM && unclaimedCashlinkCount"
:showUnclaimedCashlinkList="showUnclaimedCashlinkList"
:unclaimedCashlinkCount="unclaimedCashlinkCount"
@toggle-unclaimed-cashlink-list="toggleUnclaimedCashlinkList"
/>

<template v-if="activeCurrency === 'nim'">
<template v-if="activeCurrency === CryptoCurrency.NIM">
<StakingPreview v-if="activeStake && windowWidth > 860" />
<StakingButton v-else-if="showStakingButton" />
</template>

<button class="send nq-button-pill light-blue flex-row"
@click="$router.push(`/send/${activeCurrency}`)" @mousedown.prevent
:disabled="
(activeCurrency === 'nim'
&& (!activeAddressInfo || !activeAddressInfo.balance
|| $config.disableNetworkInteraction))
|| (activeCurrency === 'btc' && !btcAccountBalance)
|| (activeCurrency === 'usdc' && !accountUsdcBalance /* can only send native usdc */)
(activeCurrency === CryptoCurrency.NIM
&& ($config.disableNetworkInteraction
|| !activeAddressInfo || !activeAddressInfo.balance))
|| (activeCurrency === CryptoCurrency.BTC && !btcAccountBalance)
|| (activeCurrency === CryptoCurrency.USDC
&& !accountUsdcBalance /* can only send native usdc */)
|| (activeCurrency === CryptoCurrency.USDT && !accountUsdtBridgedBalance)"
>
<ArrowRightSmallIcon />{{ $t('Send') }}
Expand All @@ -201,7 +211,7 @@
</div>
<StakingPreview v-if="activeStake && isMobile" class="staking-preview-mobile" />
<div
v-if="activeCurrency === 'usdc' && accountUsdcBridgedBalance >= 0.1e6"
v-if="activeCurrency === CryptoCurrency.USDC && accountUsdcBridgedBalance >= 0.1e6"
class="bridged-usdc-notice"
>
<div class="flex-row">
Expand Down
8 changes: 5 additions & 3 deletions src/components/layouts/Sidebar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,8 @@
<template #trigger>
<button
class="nq-button-s inverse"
:disabled="(activeCurrency === 'nim' && $config.disableNetworkInteraction) || hasActiveSwap"
:disabled="($config.disableNetworkInteraction && activeCurrency === CryptoCurrency.NIM)
|| hasActiveSwap"
@click="openModal('buy')"
@mousedown.prevent="hideTooltips"
>{{ $t('Buy') }}</button>
Expand All @@ -74,7 +75,7 @@
>
<template #trigger>
<button class="nq-button-s inverse"
:disabled="(activeCurrency === 'nim' && $config.disableNetworkInteraction)
:disabled="($config.disableNetworkInteraction && activeCurrency === CryptoCurrency.NIM)
|| !canSellCryptoWithMoonpay"
@click="openModal('moonpay-sell-info')"
@mousedown.prevent="hideTooltips"
Expand Down Expand Up @@ -131,7 +132,7 @@
>
<template #trigger>
<button
:disabled="(activeCurrency === 'nim' && $config.disableNetworkInteraction)
:disabled="($config.disableNetworkInteraction && activeCurrency === CryptoCurrency.NIM)
|| fastspotEnabledCryptoSwapAssets.length <= 1
|| walletActivatedCurrencies.length <= 1
|| !hasSwappableBalance
Expand Down Expand Up @@ -327,6 +328,7 @@ export default defineComponent({
});
return {
CryptoCurrency,
navigateTo,
resetState,
isTestnet,
Expand Down

0 comments on commit 345213a

Please sign in to comment.