FIX: Segment Control

android/app/src/main/java/io/bluewallet/bluewallet/CustomSegmentedControlManager.java

@@ -11,10 +11,12 @@ import com.facebook.react.bridge.Arguments;
 import com.facebook.react.bridge.ReadableArray;
 import com.facebook.react.bridge.WritableMap;
 import com.facebook.react.uimanager.events.RCTEventEmitter;
+import android.util.Log;
 
 public class CustomSegmentedControlManager extends SimpleViewManager<CustomSegmentedControlManager.CustomSegmentedControlView> {
   public static final String REACT_CLASS = "CustomSegmentedControl";
   private static boolean isRegistered = false;
+  private static final String TAG = "CustomSegmentedControlManager";
 
   public static class CustomSegmentedControlView extends LinearLayout {
     private TabLayout tabLayout;
@@ -46,18 +48,26 @@ public class CustomSegmentedControlManager extends SimpleViewManager<CustomSegme
     }
 
     public void setValues(ReadableArray values) {
-      tabLayout.removeAllTabs();
-      for (int i = 0; i < values.size(); i++) {
-        tabLayout.addTab(tabLayout.newTab().setText(values.getString(i)));
+      try {
+        tabLayout.removeAllTabs();
+        for (int i = 0; i < values.size(); i++) {
+          tabLayout.addTab(tabLayout.newTab().setText(values.getString(i)));
+        }
+      } catch (Exception e) {
+        Log.e(TAG, "Error setting property 'values': " + e.getMessage());
       }
     }
 
     public void setSelectedIndex(int selectedIndex) {
-      if (selectedIndex >= 0 && selectedIndex < tabLayout.getTabCount()) {
-        TabLayout.Tab tab = tabLayout.getTabAt(selectedIndex);
-        if (tab != null) {
-          tab.select();
+      try {
+        if (selectedIndex >= 0 && selectedIndex < tabLayout.getTabCount()) {
+          TabLayout.Tab tab = tabLayout.getTabAt(selectedIndex);
+          if (tab != null) {
+            tab.select();
+          }
         }
+      } catch (Exception e) {
+        Log.e(TAG, "Error setting property 'selectedIndex': " + e.getMessage());
       }
     }
 

ios/Components/SegmentedControl/CustomSegmentedControlManager.m

@@ -20,14 +20,22 @@
 }
 
 - (void)setValues:(NSArray<NSString *> *)values {
-  [self removeAllSegments];
-  for (NSUInteger i = 0; i < values.count; i++) {
-    [self insertSegmentWithTitle:values[i] atIndex:i animated:NO];
+  @try {
+    [self removeAllSegments];
+    for (NSUInteger i = 0; i < values.count; i++) {
+      [self insertSegmentWithTitle:values[i] atIndex:i animated:NO];
+    }
+  } @catch (NSException *exception) {
+    NSLog(@"Error setting property 'values': %@", exception.reason);
   }
 }
 
 - (void)setSelectedIndex:(NSNumber *)selectedIndex {
-  self.selectedSegmentIndex = selectedIndex.integerValue;
+  @try {
+    self.selectedSegmentIndex = selectedIndex.integerValue;
+  } @catch (NSException *exception) {
+    NSLog(@"Error setting property 'selectedIndex': %@", exception.reason);
+  }
 }
 
 - (void)onChange:(UISegmentedControl *)sender {

screen/receive/details.js

@@ -33,8 +33,10 @@ import loc, { formatBalance } from '../../loc';
 import { BitcoinUnit, Chain } from '../../models/bitcoinUnits';
 import { SuccessView } from '../send/success';
 import { useStorage } from '../../hooks/context/useStorage';
-import { AddressTypeTabs, TABS } from '../../components/addresses/AddressTypeTabs';
 import { HandOffActivityType } from '../../components/types';
+import SegmentedControl from '../../components/SegmentControl';
+
+const segmentControlValues = [loc.wallets.details_address, loc.bip47.payment_code];
 
 const ReceiveDetails = () => {
   const { walletID, address } = useRoute().params;
@@ -49,7 +51,7 @@ const ReceiveDetails = () => {
   const [showPendingBalance, setShowPendingBalance] = useState(false);
   const [showConfirmedBalance, setShowConfirmedBalance] = useState(false);
   const [showAddress, setShowAddress] = useState(false);
-  const [currentTab, setCurrentTab] = useState(TABS.EXTERNAL);
+  const [currentTab, setCurrentTab] = useState(segmentControlValues[0]);
   const { goBack, setParams } = useExtendedNavigation();
   const { colors } = useTheme();
   const [intervalMs, setIntervalMs] = useState(5000);
@@ -431,9 +433,9 @@ const ReceiveDetails = () => {
   };
 
   const renderTabContent = () => {
-    const qrValue = currentTab === TABS.EXTERNAL ? bip21encoded : wallet.getBIP47PaymentCode();
+    const qrValue = currentTab === segmentControlValues[0] ? bip21encoded : wallet.getBIP47PaymentCode();
 
-    if (currentTab === TABS.EXTERNAL) {
+    if (currentTab === segmentControlValues[0]) {
       return <View style={styles.container}>{address && renderReceiveDetails()}</View>;
     } else {
       return (
@@ -457,14 +459,17 @@ const ReceiveDetails = () => {
     <View style={[styles.root, stylesHook.root]}>
       {wallet.isBIP47Enabled() && (
         <View style={styles.tabsContainer}>
-          <AddressTypeTabs
-            currentTab={currentTab}
-            setCurrentTab={setCurrentTab}
-            customTabText={{ EXTERNAL: 'Address', INTERNAL: 'Payment Code' }}
+          <SegmentedControl
+            values={Object.values(segmentControlValues).map(tab => tab)}
+            selectedIndex={Object.values(segmentControlValues).findIndex(tab => tab === currentTab)}
+            onChange={index => {
+              const tabKey = Object.keys(segmentControlValues)[index];
+              setCurrentTab(segmentControlValues[tabKey]);
+            }}
           />
         </View>
       )}
-      {renderTabContent()}
+      {showAddress && renderTabContent()}
       <View style={styles.share}>
         <BlueCard>
           <Button onPress={handleShareButtonPressed} title={loc.receive.details_share} />
@@ -506,7 +511,9 @@ const styles = StyleSheet.create({
     justifyContent: 'space-between',
   },
   tabsContainer: {
-    height: 65,
+    margin: 40,
+    alignItems: 'center',
+    justifyContent: 'center',
   },
   scrollBody: {
     marginTop: 32,

screen/wallets/WalletAddresses.tsx

@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect, useLayoutEffect, useRef, useReducer, useMemo } from 'react';
 import { useFocusEffect, useRoute, RouteProp } from '@react-navigation/native';
-import { ActivityIndicator, FlatList, StyleSheet, View } from 'react-native';
+import { ActivityIndicator, FlatList, Platform, StyleSheet, View } from 'react-native';
 import { WatchOnlyWallet } from '../../class';
 import { AddressItem } from '../../components/addresses/AddressItem';
 import { useTheme } from '../../components/themes';
@@ -200,6 +200,8 @@ const WalletAddresses: React.FC = () => {
     );
   }
 
+  const segmentControlMargin = { marginHorizontal: Platform.OS === 'ios' ? 40 : 0 };
+
   return (
     <View style={[styles.root, stylesHook.root]}>
       <FlatList
@@ -213,7 +215,7 @@ const WalletAddresses: React.FC = () => {
         centerContent={!showAddresses}
         contentInsetAdjustmentBehavior="automatic"
         ListHeaderComponent={
-          <View style={styles.segmentController}>
+          <View style={[styles.segmentController, segmentControlMargin]}>
             <SegmentedControl
               values={Object.values(TABS).map(tab => loc.addresses[`type_${tab}`])}
               selectedIndex={Object.values(TABS).findIndex(tab => tab === currentTab)}
@@ -236,8 +238,6 @@ const styles = StyleSheet.create({
     flex: 1,
   },
   segmentController: {
-    margin: 40,
-    height: 40,
     alignItems: 'center',
     justifyContent: 'center',
   },