Merge remote-tracking branch 'upstream/master'

Groestlcoin · Sep 1, 2024 · b8a516a · b8a516a
2 parents 9e6e96d + c0109e7
commit b8a516a
Show file tree

Hide file tree

Showing 24 changed files with 825 additions and 359 deletions.
diff --git a/class/wallets/lightning-custodian-wallet.ts b/class/wallets/lightning-custodian-wallet.ts
@@ -36,7 +36,7 @@ export class LightningCustodianWallet extends LegacyWallet {
    * @param URI
    */
   setBaseURI(URI: string | undefined) {
-    this.baseURI = URI;
+    this.baseURI = URI?.endsWith('/') ? URI.slice(0, -1) : URI;
   }
 
   getBaseURI() {
@@ -579,7 +579,7 @@ export class LightningCustodianWallet extends LegacyWallet {
   }
 
   static async isValidNodeAddress(address: string) {
-    const response = await fetch(address + '/getinfo', {
+    const response = await fetch((address?.endsWith('/') ? address.slice(0, -1) : address) + '/getinfo', {
       method: 'GET',
       headers: {
         'Access-Control-Allow-Origin': '*',

diff --git a/components/Header.tsx b/components/Header.tsx
@@ -1,7 +1,5 @@
 import React from 'react';
 import { StyleSheet, Text, View } from 'react-native';
-
-import loc from '../loc';
 import PlusIcon from './icons/PlusIcon';
 import { useTheme } from './themes';
 
@@ -27,7 +25,7 @@ export const Header: React.FC<HeaderProps> = ({ leftText, isDrawerList, onNewWal
   return (
     <View style={[styles.root, styleWithProps.root]}>
       <Text style={[styles.text, styleWithProps.text]}>{leftText}</Text>
-      {onNewWalletPress && <PlusIcon accessibilityRole="button" accessibilityLabel={loc.wallets.add_title} onPress={onNewWalletPress} />}
+      {onNewWalletPress && <PlusIcon onPress={onNewWalletPress} />}
     </View>
   );
 };

diff --git a/components/ManageWalletsListItem.tsx b/components/ManageWalletsListItem.tsx
@@ -0,0 +1,138 @@
+import React, { useCallback } from 'react';
+import { View, StyleSheet, ViewStyle, TouchableOpacity } from 'react-native';
+import { Icon, ListItem } from '@rneui/base';
+import { ExtendedTransaction, LightningTransaction, TWallet } from '../class/wallets/types';
+import { WalletCarouselItem } from './WalletsCarousel';
+import { TransactionListItem } from './TransactionListItem';
+import { useTheme } from './themes';
+import { BitcoinUnit } from '../models/bitcoinUnits';
+
+interface ManageWalletsListItemProps {
+  item: Item;
+  isDraggingDisabled: boolean;
+  drag: () => void;
+  isActive: boolean;
+  state: { wallets: TWallet[]; searchQuery: string };
+  navigateToWallet: (wallet: TWallet) => void;
+  renderHighlightedText: (text: string, query: string) => JSX.Element;
+  handleDeleteWallet: (wallet: TWallet) => void;
+  handleToggleHideBalance: (wallet: TWallet) => void;
+}
+
+enum ItemType {
+  WalletSection = 'wallet',
+  TransactionSection = 'transaction',
+}
+
+interface WalletItem {
+  type: ItemType.WalletSection;
+  data: TWallet;
+}
+
+interface TransactionItem {
+  type: ItemType.TransactionSection;
+  data: ExtendedTransaction & LightningTransaction;
+}
+
+type Item = WalletItem | TransactionItem;
+
+interface SwipeContentProps {
+  onPress: () => void;
+  hideBalance?: boolean;
+  colors: any;
+}
+
+const LeftSwipeContent: React.FC<SwipeContentProps> = ({ onPress, hideBalance, colors }) => (
+  <TouchableOpacity
+    onPress={onPress}
+    style={[styles.leftButtonContainer, { backgroundColor: colors.buttonAlternativeTextColor } as ViewStyle]}
+  >
+    <Icon name={hideBalance ? 'eye-slash' : 'eye'} color={colors.brandingColor} type="font-awesome-5" />
+  </TouchableOpacity>
+);
+
+const RightSwipeContent: React.FC<Partial<SwipeContentProps>> = ({ onPress }) => (
+  <TouchableOpacity onPress={onPress} style={styles.rightButtonContainer as ViewStyle}>
+    <Icon name="delete-outline" color="#FFFFFF" />
+  </TouchableOpacity>
+);
+
+const ManageWalletsListItem: React.FC<ManageWalletsListItemProps> = ({
+  item,
+  isDraggingDisabled,
+  drag,
+  isActive,
+  state,
+  navigateToWallet,
+  renderHighlightedText,
+  handleDeleteWallet,
+  handleToggleHideBalance,
+}) => {
+  const { colors } = useTheme();
+
+  const onPress = useCallback(() => {
+    if (item.type === ItemType.WalletSection) {
+      navigateToWallet(item.data);
+    }
+  }, [item, navigateToWallet]);
+
+  if (item.type === ItemType.WalletSection) {
+    return (
+      <ListItem.Swipeable
+        leftWidth={80}
+        rightWidth={90}
+        minSlideWidth={40}
+        leftContent={
+          <LeftSwipeContent onPress={() => handleToggleHideBalance(item.data)} hideBalance={item.data.hideBalance} colors={colors} />
+        }
+        rightContent={<RightSwipeContent colors={colors} onPress={() => handleDeleteWallet(item.data)} />}
+      >
+        <View style={styles.walletCarouselItemContainer}>
+          <WalletCarouselItem
+            item={item.data}
+            handleLongPress={isDraggingDisabled ? undefined : drag}
+            isActive={isActive}
+            onPress={onPress}
+            searchQuery={state.searchQuery}
+            renderHighlightedText={renderHighlightedText}
+          />
+        </View>
+      </ListItem.Swipeable>
+    );
+  } else if (item.type === ItemType.TransactionSection && item.data) {
+    const w = state.wallets.find(wallet => wallet.getTransactions().some((tx: ExtendedTransaction) => tx.hash === item.data.hash));
+    const walletID = w ? w.getID() : '';
+
+    return (
+      <TransactionListItem
+        item={item.data}
+        itemPriceUnit={item.data.walletPreferredBalanceUnit || BitcoinUnit.BTC}
+        walletID={walletID}
+        searchQuery={state.searchQuery}
+        renderHighlightedText={renderHighlightedText}
+      />
+    );
+  }
+
+  console.error('Unrecognized item type:', item);
+  return null;
+};
+
+const styles = StyleSheet.create({
+  walletCarouselItemContainer: {
+    width: '100%',
+  },
+  leftButtonContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  rightButtonContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: 'red',
+  },
+});
+
+export default ManageWalletsListItem;
diff --git a/components/icons/PlusIcon.js → components/icons/PlusIcon.tsx b/components/icons/PlusIcon.js → components/icons/PlusIcon.tsx
@@ -1,8 +1,13 @@
 import React from 'react';
-import { StyleSheet, TouchableOpacity } from 'react-native';
+import { StyleSheet, TouchableOpacity, ViewStyle } from 'react-native';
 import { Icon } from '@rneui/themed';
 
 import { useTheme } from '../themes';
+import loc from '../../loc';
+
+type PlusIconProps = {
+  onPress: () => void;
+};
 
 const styles = StyleSheet.create({
   ball: {
@@ -11,10 +16,10 @@ const styles = StyleSheet.create({
     borderRadius: 15,
     justifyContent: 'center',
     alignContent: 'center',
-  },
+  } as ViewStyle,
 });
 
-const PlusIcon = props => {
+const PlusIcon: React.FC<PlusIconProps> = ({ onPress }) => {
   const { colors } = useTheme();
   const stylesHook = StyleSheet.create({
     ball: {
@@ -23,7 +28,12 @@ const PlusIcon = props => {
   });
 
   return (
-    <TouchableOpacity style={[styles.ball, stylesHook.ball]} onPress={props.onPress}>
+    <TouchableOpacity
+      style={[styles.ball, stylesHook.ball]}
+      accessibilityLabel={loc.wallets.add_title}
+      onPress={onPress}
+      accessibilityRole="button"
+    >
       <Icon name="add" size={22} type="ionicons" color={colors.foregroundColor} />
     </TouchableOpacity>
   );

diff --git a/components/icons/TransactionExpiredIcon.js → components/icons/TransactionExpiredIcon.tsx b/components/icons/TransactionExpiredIcon.js → components/icons/TransactionExpiredIcon.tsx
@@ -1,26 +1,26 @@
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, View, ViewStyle } from 'react-native';
 import { Icon } from '@rneui/themed';
 
 import { useTheme } from '../themes';
 
 const styles = StyleSheet.create({
   boxIncoming: {
     position: 'relative',
-  },
+  } as ViewStyle,
   ballOutgoingExpired: {
     width: 30,
     height: 30,
     borderRadius: 15,
     justifyContent: 'center',
-  },
+  } as ViewStyle,
   icon: {
     left: 0,
     top: 0,
   },
 });
 
-const TransactionExpiredIcon = props => {
+const TransactionExpiredIcon: React.FC = () => {
   const { colors } = useTheme();
   const stylesHooks = StyleSheet.create({
     ballOutgoingExpired: {

diff --git a/components/icons/TransactionIncomingIcon.js → components/icons/TransactionIncomingIcon.tsx b/components/icons/TransactionIncomingIcon.js → components/icons/TransactionIncomingIcon.tsx
@@ -1,23 +1,23 @@
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, View, ViewStyle } from 'react-native';
 import { Icon } from '@rneui/themed';
 
 import { useTheme } from '../themes';
 
 const styles = StyleSheet.create({
   boxIncoming: {
     position: 'relative',
-  },
+  } as ViewStyle,
   ballIncoming: {
     width: 30,
     height: 30,
     borderRadius: 15,
     transform: [{ rotate: '-45deg' }],
     justifyContent: 'center',
-  },
+  } as ViewStyle,
 });
 
-const TransactionIncomingIcon = props => {
+const TransactionIncomingIcon: React.FC = () => {
   const { colors } = useTheme();
   const stylesHooks = StyleSheet.create({
     ballIncoming: {

diff --git a/components/icons/TransactionOffchainIcon.js → components/icons/TransactionOffchainIcon.tsx b/components/icons/TransactionOffchainIcon.js → components/icons/TransactionOffchainIcon.tsx
@@ -1,25 +1,25 @@
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, View, ViewStyle } from 'react-native';
 import { Icon } from '@rneui/themed';
 
 import { useTheme } from '../themes';
 
 const styles = StyleSheet.create({
   boxIncoming: {
     position: 'relative',
-  },
+  } as ViewStyle,
   ballOutgoingWithoutRotate: {
     width: 30,
     height: 30,
     borderRadius: 15,
-  },
+  } as ViewStyle,
   icon: {
     left: 0,
     marginTop: 6,
   },
 });
 
-const TransactionOffchainIcon = props => {
+const TransactionOffchainIcon: React.FC = () => {
   const { colors } = useTheme();
   const stylesHooks = StyleSheet.create({
     ballOutgoingWithoutRotate: {

diff --git a/.../icons/TransactionOffchainIncomingIcon.js → ...icons/TransactionOffchainIncomingIcon.tsx b/.../icons/TransactionOffchainIncomingIcon.js → ...icons/TransactionOffchainIncomingIcon.tsx
@@ -1,25 +1,25 @@
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, View, ViewStyle } from 'react-native';
 import { Icon } from '@rneui/themed';
 
 import { useTheme } from '../themes';
 
 const styles = StyleSheet.create({
   boxIncoming: {
     position: 'relative',
-  },
+  } as ViewStyle,
   ballIncomingWithoutRotate: {
     width: 30,
     height: 30,
     borderRadius: 15,
-  },
+  } as ViewStyle,
   icon: {
     left: 0,
     marginTop: 6,
   },
 });
 
-const TransactionOffchainIncomingIcon = props => {
+const TransactionOffchainIncomingIcon: React.FC = () => {
   const { colors } = useTheme();
   const stylesHooks = StyleSheet.create({
     ballIncomingWithoutRotate: {

diff --git a/components/icons/TransactionOnchainIcon.js → components/icons/TransactionOnchainIcon.tsx b/components/icons/TransactionOnchainIcon.js → components/icons/TransactionOnchainIcon.tsx
@@ -1,28 +1,28 @@
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, View, ViewStyle } from 'react-native';
 import { Icon } from '@rneui/themed';
 
 import { useTheme } from '../themes';
 
 const styles = StyleSheet.create({
   boxIncoming: {
     position: 'relative',
-  },
+  } as ViewStyle,
   ballIncoming: {
     width: 30,
     height: 30,
     borderRadius: 15,
     transform: [{ rotate: '-45deg' }],
     justifyContent: 'center',
-  },
+  } as ViewStyle,
   icon: {
     left: 0,
     top: 0,
     transform: [{ rotate: '-45deg' }],
   },
 });
 
-const TransactionOnchainIcon = props => {
+const TransactionOnchainIcon: React.FC = () => {
   const { colors } = useTheme();
   const stylesBlueIconHooks = StyleSheet.create({
     ballIncoming: {

diff --git a/components/icons/TransactionOutgoingIcon.js → components/icons/TransactionOutgoingIcon.tsx b/components/icons/TransactionOutgoingIcon.js → components/icons/TransactionOutgoingIcon.tsx
@@ -1,23 +1,23 @@
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, View, ViewStyle } from 'react-native';
 import { Icon } from '@rneui/themed';
 
 import { useTheme } from '../themes';
 
 const styles = StyleSheet.create({
   boxIncoming: {
     position: 'relative',
-  },
+  } as ViewStyle,
   ballOutgoing: {
     width: 30,
     height: 30,
     borderRadius: 15,
     transform: [{ rotate: '225deg' }],
     justifyContent: 'center',
-  },
+  } as ViewStyle,
 });
 
-const TransactionOutgoingIcon = props => {
+const TransactionOutgoingIcon: React.FC = () => {
   const { colors } = useTheme();
   const stylesBlueIconHooks = StyleSheet.create({
     ballOutgoing: {