Release/monday christmas

config/wallet-config.json

@@ -100,7 +100,7 @@
     "sponsorshipsEnabled": true,
     "sponsorshipApiUrl": {
       "mainnet": "https://sponsor.leather.io",
-      "testnet": "http://testnet-13-60-14-218.nip.io"
+      "testnet": "https://sponsor-testnet.leather.io"
     },
     "contracts": {
       "mainnet": {

src/app/common/hooks/balance/use-total-balance.tsx → src/app/common/hooks/balance/use-balances.tsx

@@ -8,11 +8,15 @@ import { baseCurrencyAmountInQuote, createMoney, i18nFormatCurrency } from '@lea
 
 import { useBtcCryptoAssetBalanceNativeSegwit } from '@app/query/bitcoin/balance/btc-balance-native-segwit.hooks';
 
-interface UseTotalBalanceArgs {
+import { useSip10ManagedTokensBalance } from './use-sip10-balance';
+
+const highBalance = createMoney(100_000, 'USD');
+
+interface UseBalanceArgs {
   btcAddress: string;
   stxAddress: string;
 }
-export function useTotalBalance({ btcAddress, stxAddress }: UseTotalBalanceArgs) {
+export function useBalances({ btcAddress, stxAddress }: UseBalanceArgs) {
   // get market data
   const btcMarketData = useCryptoCurrencyMarketDataMeanAverage('BTC');
   const stxMarketData = useCryptoCurrencyMarketDataMeanAverage('STX');
@@ -38,40 +42,65 @@ export function useTotalBalance({ btcAddress, stxAddress }: UseTotalBalanceArgs)
     isLoadingAdditionalData: isLoadingAdditionalDataBtcBalance,
   } = useBtcCryptoAssetBalanceNativeSegwit(btcAddress);
 
+  // get sip10 balance
+  const sip10BalanceUsd = useSip10ManagedTokensBalance({ stxAddress, assetFilter: 'enabled' });
+
   return useMemo(() => {
     // calculate total balance
     const stxUsdAmount = baseCurrencyAmountInQuote(stxBalance, stxMarketData);
-    const btcUsdAmount = baseCurrencyAmountInQuote(btcBalance.availableBalance, btcMarketData);
 
-    const totalBalance = { ...stxUsdAmount, amount: stxUsdAmount.amount.plus(btcUsdAmount.amount) };
+    const availableBtcUsdAmount = baseCurrencyAmountInQuote(
+      btcBalance.availableBalance,
+      btcMarketData
+    );
+
+    const totalBtcUsdAmount = baseCurrencyAmountInQuote(btcBalance.totalBalance, btcMarketData);
+
+    const totalBalance = {
+      ...stxUsdAmount,
+      amount: stxUsdAmount.amount.plus(totalBtcUsdAmount.amount).plus(sip10BalanceUsd.amount),
+    };
+
+    const availableBalance = {
+      ...stxUsdAmount,
+      amount: stxUsdAmount.amount.plus(availableBtcUsdAmount.amount).plus(sip10BalanceUsd.amount),
+    };
+
     return {
       isFetching: isFetchingStxBalance || isFetchingBtcBalance,
       isLoading: isLoadingStxBalance || isLoadingBtcBalance,
       isPending:
         (isPendingStxBalance && Boolean(stxAddress)) ||
         (isPendingBtcBalance && Boolean(btcAddress)),
       totalBalance,
+      availableBalance,
+      availableUsdBalance: i18nFormatCurrency(
+        availableBalance,
+        availableBalance.amount.isGreaterThanOrEqualTo(highBalance.amount) ? 0 : 2
+      ),
       totalUsdBalance: i18nFormatCurrency(
         totalBalance,
-        totalBalance.amount.isGreaterThanOrEqualTo(100_000) ? 0 : 2
+        totalBalance.amount.isGreaterThanOrEqualTo(highBalance.amount) ? 0 : 2
       ),
       isLoadingAdditionalData:
         isLoadingAdditionalDataStxBalance || isLoadingAdditionalDataBtcBalance,
     };
   }, [
+    stxBalance,
+    stxMarketData,
     btcBalance.availableBalance,
+    btcBalance.totalBalance,
     btcMarketData,
-    isFetchingBtcBalance,
+    sip10BalanceUsd.amount,
     isFetchingStxBalance,
-    isLoadingBtcBalance,
+    isFetchingBtcBalance,
     isLoadingStxBalance,
-    isPendingBtcBalance,
+    isLoadingBtcBalance,
     isPendingStxBalance,
-    stxBalance,
-    stxMarketData,
-    isLoadingAdditionalDataBtcBalance,
-    isLoadingAdditionalDataStxBalance,
     stxAddress,
+    isPendingBtcBalance,
     btcAddress,
+    isLoadingAdditionalDataStxBalance,
+    isLoadingAdditionalDataBtcBalance,
   ]);
 }

src/app/common/hooks/balance/use-sip10-balance.tsx

@@ -0,0 +1,62 @@
+import { useMemo } from 'react';
+
+import type { Money } from '@leather.io/models';
+import {
+  baseCurrencyAmountInQuote,
+  createMoney,
+  isDefined,
+  isMoneyGreaterThanZero,
+  sumMoney,
+} from '@leather.io/utils';
+
+import { useSip10FiatMarketData } from '../use-calculate-sip10-fiat-value';
+import { useCombinedFilteredSip10Tokens } from '../use-filtered-sip10-tokens';
+import { type AssetFilter, useManageTokens } from '../use-manage-tokens';
+
+interface UseSip10ManagedTokensBalanceArgs {
+  stxAddress: string;
+  assetFilter?: AssetFilter;
+}
+
+export function useSip10ManagedTokensBalance({
+  stxAddress,
+  assetFilter = 'all',
+}: UseSip10ManagedTokensBalanceArgs) {
+  const { getTokenMarketData } = useSip10FiatMarketData();
+  const { allTokens = [], supportedTokens } = useCombinedFilteredSip10Tokens({
+    address: stxAddress,
+    filter: 'all',
+  });
+  const { filterTokens } = useManageTokens();
+  const preEnabledTokensIds = supportedTokens.map(t => t.info.contractId);
+  const managedTokens = filterTokens({
+    tokens: allTokens,
+    filter: assetFilter,
+    getTokenId: t => t.info.contractId,
+    preEnabledTokensIds,
+  });
+
+  const balance = useMemo(() => {
+    const baseBalance: Money = createMoney(0, 'USD');
+    return sumMoney([
+      baseBalance,
+      ...managedTokens
+        .map(token => {
+          const tokenMarketData = getTokenMarketData(
+            token.info.contractId,
+            token.balance.availableBalance.symbol
+          );
+          if (
+            !tokenMarketData ||
+            !token.balance.availableBalance ||
+            !isMoneyGreaterThanZero(tokenMarketData.price)
+          )
+            return;
+          return baseCurrencyAmountInQuote(token.balance.availableBalance, tokenMarketData);
+        })
+        .filter(isDefined),
+    ]);
+  }, [managedTokens, getTokenMarketData]);
+
+  return balance;
+}

src/app/common/hooks/use-hover-with-children.ts

@@ -0,0 +1,32 @@
+import { useCallback, useState } from 'react';
+
+interface HoverBind {
+  onMouseEnter(event: React.MouseEvent<HTMLElement, MouseEvent>): void;
+  onMouseLeave(event: React.MouseEvent<HTMLElement, MouseEvent>): void;
+}
+
+export function useHoverWithChildren(): [boolean, HoverBind] {
+  const [isHovered, setIsHovered] = useState(false);
+
+  const handleMouseEnter = useCallback(() => {
+    setIsHovered(true);
+  }, []);
+
+  const handleMouseLeave = useCallback((event: React.MouseEvent<HTMLElement, MouseEvent>) => {
+    const relatedTarget = event.relatedTarget as HTMLElement;
+
+    // If the related target is a child of the current element, don't trigger mouseleave
+    if (event.currentTarget.contains(relatedTarget)) {
+      return;
+    }
+
+    setIsHovered(false);
+  }, []);
+
+  const bind: HoverBind = {
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+  };
+
+  return [isHovered, bind];
+}

src/app/components/account-total-balance.tsx

@@ -4,7 +4,7 @@ import { styled } from 'leather-styles/jsx';
 
 import { SkeletonLoader, shimmerStyles } from '@leather.io/ui';
 
-import { useTotalBalance } from '@app/common/hooks/balance/use-total-balance';
+import { useBalances } from '@app/common/hooks/balance/use-balances';
 import { PrivateText } from '@app/components/privacy/private-text';
 
 interface AccountTotalBalanceProps {
@@ -13,7 +13,7 @@ interface AccountTotalBalanceProps {
 }
 
 export const AccountTotalBalance = memo(({ btcAddress, stxAddress }: AccountTotalBalanceProps) => {
-  const { totalUsdBalance, isFetching, isLoading, isLoadingAdditionalData } = useTotalBalance({
+  const { totalUsdBalance, isFetching, isLoading, isLoadingAdditionalData } = useBalances({
     btcAddress,
     stxAddress,
   });

src/app/debug.ts

@@ -57,6 +57,12 @@ const debug = {
     chrome.storage.local.clear();
     chrome.storage.session.clear();
   },
+  bypassInscriptionChecks() {
+    store.dispatch(settingsSlice.actions.dangerouslyChosenToBypassAllInscriptionChecks());
+  },
+  resetInscriptionState() {
+    store.dispatch(settingsSlice.actions.resetInscriptionState());
+  },
 };
 
 export function setDebugOnGlobal() {

src/app/features/collectibles/components/bitcoin/high-sat-value-utxo.tsx

@@ -0,0 +1,23 @@
+import { Box, Circle } from 'leather-styles/jsx';
+
+import type { Inscription } from '@leather.io/models';
+
+import { BasicTooltip } from '@app/ui/components/tooltip/basic-tooltip';
+
+const featureBuilt = false;
+
+interface HighSatValueUtxoProps {
+  inscription: Inscription;
+}
+
+export function HighSatValueUtxoWarning({ inscription }: HighSatValueUtxoProps) {
+  if (Number(inscription.value) < 5_000) return null;
+  if (!featureBuilt) return null;
+  return (
+    <Box position="absolute" top="space.01" right="space.01">
+      <BasicTooltip label="This inscription has loads of BTC on it, remove protections? Click">
+        <Circle bg="red" size="sm" />
+      </BasicTooltip>
+    </Box>
+  );
+}

src/app/features/collectibles/components/bitcoin/inscription-text.tsx

@@ -10,7 +10,7 @@ import { CollectibleText } from '../_collectible-types/collectible-text';
 interface InscriptionTextProps {
   contentSrc: string;
   inscriptionNumber: number;
-  onClickCallToAction(): void;
+  onClickCallToAction?(): void;
   onClickSend(): void;
 }
 export function InscriptionText({