feature: small design + formatting fixes

src/features/rnbw-membership/screens/rnbw-membership-screen/RnbwMembershipScreen.tsx

@@ -1,5 +1,5 @@
 import { memo, useState, useCallback } from 'react';
-import { RefreshControl, ScrollView, StyleSheet, View } from 'react-native';
+import { RefreshControl, ScrollView, StyleSheet } from 'react-native';
 import { Box } from '@/design-system';
 import { AccountImage } from '@/components/AccountImage';
 import { Navbar } from '@/components/navbar/Navbar';
@@ -14,22 +14,30 @@ import { useAirdropBalanceStore } from '@/features/rnbw-rewards/stores/airdropBa
 import { delay } from '@/utils/delay';
 import { time } from '@/utils/time';
 import { RnbwStakingEarningsCard } from './components/RnbwStakingEarningsCard';
+import { TAB_BAR_HEIGHT } from '@/navigation/SwipeNavigator';
 
 export const RnbwMembershipScreen = memo(function RnbwMembershipScreen() {
   return (
-    <View style={styles.flex}>
+    <Box background="surfaceSecondary" style={styles.flex}>
       <Navbar hasStatusBarInset title="Membership" leftComponent={<AccountImage />} />
-      <ScrollView refreshControl={<RefreshControlWrapper />} contentContainerStyle={styles.scrollViewContentContainer} style={styles.flex}>
-        <Box gap={16}>
+      <ScrollView
+        refreshControl={<RefreshControlWrapper />}
+        contentContainerStyle={styles.scrollViewContentContainer}
+        style={styles.flex}
+        contentInset={{
+          bottom: TAB_BAR_HEIGHT + 16,
+        }}
+      >
+        <Box gap={16} style={{ flex: 1 }}>
           <RnbwStakingCard />
+          <RnbwStakingEarningsCard />
           <RnbwUnstakePenaltyRecoveryCard />
           <MembershipTierCard />
-          <RnbwStakingEarningsCard />
           <RnbwRewardsClaimCard />
           <RnbwAirdropClaimCard />
         </Box>
       </ScrollView>
-    </View>
+    </Box>
   );
 });
 

src/features/rnbw-staking/stores/derived/useRnbwStakingEarnings.ts

@@ -2,7 +2,7 @@ import { convertRawAmountToDecimalFormat, isZero } from '@/helpers/utilities';
 import { createDerivedStore } from '@/state/internal/createDerivedStore';
 import { shallowEqual } from '@/worklets/comparisons';
 import { useStakingPositionStore } from '../rnbwStakingPositionStore';
-import { divWorklet, sumWorklet, toFixedWorklet, toPercentageWorklet } from '@/framework/core/safeMath';
+import { divWorklet, sumWorklet, toFixedWorklet, toPercentageWorklet, truncateToDecimals } from '@/framework/core/safeMath';
 import { formatNumber } from '@/helpers/strings';
 
 type StakingEarnings = {
@@ -41,10 +41,10 @@ export const useRnbwStakingEarnings = createDerivedStore<StakingEarnings>(
 
     return {
       totalEarnings: formatNumber(totalEarnings, { decimals: 4 }),
-      cashbackEarnings: formatNumber(cashbackEarnings),
-      cashbackShare: totalIsZero ? '0%' : `${toPercentageWorklet(cashbackRatio, 0.001)}%`,
-      exitRewardsEarnings: formatNumber(exitRewardsEarnings),
-      exitRewardsShare: totalIsZero ? '0%' : `${toPercentageWorklet(exitRewardsRatio, 0.001)}%`,
+      cashbackEarnings: isZero(cashbackEarnings) ? '0' : formatNumber(truncateToDecimals(cashbackEarnings, 2), { decimals: 2 }),
+      cashbackShare: totalIsZero ? '0%' : `${toPercentageWorklet(cashbackRatio)}%`,
+      exitRewardsEarnings: isZero(exitRewardsEarnings) ? '0' : formatNumber(truncateToDecimals(exitRewardsEarnings, 2), { decimals: 2 }),
+      exitRewardsShare: totalIsZero ? '0%' : `${toPercentageWorklet(exitRewardsRatio)}%`,
     };
   },
   { equalityFn: shallowEqual, fastMode: true }

src/features/rnbw-staking/utils/syntheticRnbwSourceAsset.ts

@@ -43,6 +43,9 @@ const RNBW_SYNTHETIC_SOURCE_COLORS: NonNullable<ParsedSearchAsset['colors']> = {
   primary: '#F2C745',
 };
 
+const RNBW_SYNTHETIC_SOURCE_ICON_URL =
+  'https://rainbowme-res.cloudinary.com/image/upload/v1770040117/assets/base/0xa53887f7e7c1bf5010b8627f1c1ba94fe7a5d6e0.png';
+
 export const RNBW_SYNTHETIC_SOURCE_STATIC_CONFIG: SyntheticRnbwSourceStaticConfig = {
   address: RNBW_TOKEN_ADDRESS,
   bridging: RNBW_SYNTHETIC_SOURCE_BRIDGING,
@@ -93,7 +96,7 @@ export function buildSyntheticRnbwSourceAsset({
     chainName,
     colors: walletAsset?.colors ?? RNBW_SYNTHETIC_SOURCE_COLORS,
     highLiquidity: walletAsset?.highLiquidity ?? RNBW_SYNTHETIC_SOURCE_STATIC_CONFIG.highLiquidity,
-    icon_url: walletAsset?.icon_url,
+    icon_url: walletAsset?.icon_url ?? RNBW_SYNTHETIC_SOURCE_ICON_URL,
     isRainbowCurated: walletAsset?.isRainbowCurated ?? RNBW_SYNTHETIC_SOURCE_STATIC_CONFIG.isRainbowCurated,
     isVerified: walletAsset?.isVerified ?? RNBW_SYNTHETIC_SOURCE_STATIC_CONFIG.isVerified,
     mainnetAddress: walletAsset?.mainnetAddress ?? RNBW_SYNTHETIC_SOURCE_STATIC_CONFIG.mainnetAddress,

src/features/rnbw-staking/utils/unstakeRnbw.ts

@@ -1,7 +1,7 @@
 import { encodeFunctionData, type Address, type Hash } from 'viem';
 import { getProvider } from '@/handlers/web3';
 import { loadWallet } from '@/model/wallet';
-import { STAKING_ABI, STAKING_CHAIN_ID, STAKING_CONTRACT_ADDRESS, STAKING_GAS_LIMIT } from '../constants';
+import { STAKING_ABI, STAKING_CHAIN_ID, STAKING_CONTRACT_ADDRESS } from '../constants';
 import { useStakingPositionStore } from '../stores/rnbwStakingPositionStore';
 import { pollForStakingUpdate } from './pollForStakingUpdate';
 
@@ -18,8 +18,8 @@ export async function unstakeRnbw({ address }: { address: Address }): Promise<Ha
   const tx = await signer.sendTransaction({
     to: STAKING_CONTRACT_ADDRESS,
     data,
-    gasLimit: STAKING_GAS_LIMIT,
   });
+
   await tx.wait();
   await pollForStakingUpdate(originalStakedRnbwShares);
 

src/state/rnbw/useStakableRnbwBalance.ts

@@ -1,16 +1,12 @@
-import {
-  add,
-  convertAmountToNativeDisplayWorklet,
-  convertRawAmountToDecimalFormat,
-  isPositive,
-  truncateToDecimalsWithThreshold,
-} from '@/helpers/utilities';
+import { add, convertAmountToNativeDisplayWorklet, convertRawAmountToDecimalFormat, isPositive } from '@/helpers/utilities';
 import { useRewardsBalanceStore } from '@/features/rnbw-rewards/stores/rewardsBalanceStore';
 import { RNBW_DECIMALS, RNBW_TOKEN_UNIQUE_ID } from '@/features/rnbw-staking/constants';
 import { useUserAssetsStore } from '@/state/assets/userAssets';
 import { userAssetsStoreManager } from '@/state/assets/userAssetsStoreManager';
 import { createDerivedStore } from '@/state/internal/createDerivedStore';
 import { shallowEqual } from '@/worklets/comparisons';
+import { toFixedWorklet } from '@/framework/core/safeMath';
+import { formatNumber } from '@/helpers/strings';
 
 type RnbwBalance = {
   walletBalance: string;
@@ -40,7 +36,7 @@ export const useStakableRnbwBalance = createDerivedStore<RnbwBalance>(
     return {
       walletBalance: walletAmount,
       claimableBalance: claimableAmount,
-      tokenAmountFormatted: truncateToDecimalsWithThreshold({ value: totalAmount, decimals: 2, threshold: '0.01' }),
+      tokenAmountFormatted: formatNumber(toFixedWorklet(totalAmount, 2)),
       nativeCurrencyAmount: convertAmountToNativeDisplayWorklet(totalNativeValue, currency, hasBalance),
       hasBalance,
     };