fix: collectibles UI bugs (#632)

* fix: only show rare sat bundle info on confirm screen when it is a rare sat * fix: fix infinite loop when no stx address * fix: remove unnecessary refetches
secretkeylabs · Oct 30, 2023 · 416ba66 · 416ba66
1 parent a57930b
commit 416ba66
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 19 deletions.
diff --git a/src/app/components/confirmBtcTransactionComponent/index.tsx b/src/app/components/confirmBtcTransactionComponent/index.tsx
@@ -15,9 +15,9 @@ import {
   getBtcFiatEquivalent,
   ResponseError,
   satsToBtc,
+  signBtcTransaction,
   UTXO,
 } from '@secretkeylabs/xverse-core';
-import { signBtcTransaction } from '@secretkeylabs/xverse-core/transactions';
 import {
   Recipient,
   SignedBtcTx,
@@ -82,7 +82,7 @@ const Button = styled.button((props) => ({
 }));
 
 const ButtonText = styled.div((props) => ({
-  ...props.theme.body_medium_m,
+  ...props.theme.typography.body_medium_m,
   color: props.theme.colors.white_0,
   textAlign: 'center',
 }));
@@ -100,15 +100,15 @@ const ErrorContainer = styled.div((props) => ({
 }));
 
 const ErrorText = styled.h1((props) => ({
-  ...props.theme.body_xs,
-  color: props.theme.colors.feedback.error,
+  ...props.theme.typography.body_s,
+  color: props.theme.colors.danger_medium,
 }));
 
 interface ReviewTransactionTitleProps {
   isOridnalTx: boolean;
 }
 const ReviewTransactionText = styled.h1<ReviewTransactionTitleProps>((props) => ({
-  ...props.theme.headline_s,
+  ...props.theme.typography.headline_s,
   color: props.theme.colors.white_0,
   marginBottom: props.theme.spacing(16),
   textAlign: props.isOridnalTx ? 'center' : 'left',
@@ -318,7 +318,7 @@ function ConfirmBtcTransactionComponent({
     const newFee = new BigNumber(modifiedFee);
     setCurrentFee(newFee);
     const seed = await getSeed();
-    setCurrentFeeRate(new BigNumber(feeRate));
+    setCurrentFeeRate(new BigNumber(feeRate ?? ''));
     if (ordinalTxUtxo) ordinalMutate({ txFee: modifiedFee, seedPhrase: seed });
     else if (isRestoreFundFlow) {
       mutateSignNonOrdinalBtcTransaction({ txFee: modifiedFee, seedPhrase: seed });
@@ -414,6 +414,7 @@ function ConfirmBtcTransactionComponent({
           ) : (
             recipients?.map((recipient, index) => (
               <RecipientComponent
+                key={recipient.address}
                 recipientIndex={index + 1}
                 address={recipient.address}
                 value={satsToBtc(recipient.amountSats).toString()}

diff --git a/src/app/screens/confirmOrdinalTransaction/index.tsx b/src/app/screens/confirmOrdinalTransaction/index.tsx
@@ -78,8 +78,8 @@ function ConfirmOrdinalTransaction() {
   const [currentFee, setCurrentFee] = useState(fee);
   const [currentFeeRate, setCurrentFeeRate] = useState(feePerVByte);
 
-  const bundleId = selectedSatBundle ? getBundleId(selectedSatBundle) : '';
-  const bundleSubText = selectedSatBundle ? getBundleSubText(selectedSatBundle) : '';
+  const bundleId = isRareSat && selectedSatBundle ? getBundleId(selectedSatBundle) : '';
+  const bundleSubText = isRareSat && selectedSatBundle ? getBundleSubText(selectedSatBundle) : '';
 
   const {
     isLoading,

diff --git a/src/app/screens/nftDashboard/index.tsx b/src/app/screens/nftDashboard/index.tsx
@@ -154,8 +154,6 @@ const useNftDashboard = (): NftDashboardState => {
   const { t } = useTranslation('translation', { keyPrefix: 'NFT_DASHBOARD_SCREEN' });
   const dispatch = useDispatch();
   const {
-    stxAddress,
-    ordinalsAddress,
     hasActivatedOrdinalsKey,
     hasActivatedRareSatsKey,
     rareSatsNoticeDismissed,
@@ -168,14 +166,6 @@ const useNftDashboard = (): NftDashboardState => {
   const inscriptionsQuery = useAddressInscriptionCollections();
   const rareSatsQuery = useAddressRareSats();
 
-  useEffect(() => {
-    stacksNftsQuery.refetch();
-  }, [stxAddress, stacksNftsQuery]);
-
-  useEffect(() => {
-    inscriptionsQuery.refetch();
-  }, [ordinalsAddress, inscriptionsQuery]);
-
   const ordinalsLength = inscriptionsQuery.data?.pages?.[0]?.total ?? 0;
   const totalNfts = stacksNftsQuery.data?.pages?.[0]?.total ?? 0;
 

diff --git a/src/theme/index.ts b/src/theme/index.ts
@@ -488,7 +488,7 @@ const Theme = {
   },
 
   /**
-   * @deprecated use theme.typography
+   * @deprecated use theme.typography.body_s
    */
   body_xs: {
     fontFamily: 'DMSans-Regular',