tsc: fix components

Co-authored-by: shubham <shubham@zeusln.com>
ZeusLN · Oct 3, 2024 · d0cf9e4 · d0cf9e4
1 parent 39557b1
commit d0cf9e4
Show file tree

Hide file tree

Showing 26 changed files with 459 additions and 265 deletions.
diff --git a/components/Amount.tsx b/components/Amount.tsx
@@ -36,6 +36,10 @@ interface AmountDisplayProps {
     accessibilityLabel?: string;
 }
 
+interface FiatSymbolProps {
+    accessible?: boolean;
+}
+
 function AmountDisplay({
     amount,
     unit,
@@ -75,7 +79,7 @@ function AmountDisplay({
         </View>
     );
 
-    const FiatSymbol = () => (
+    const FiatSymbol: React.FC<FiatSymbolProps> = ({ accessible }) => (
         <Body
             secondary
             jumbo={jumboText}
@@ -245,7 +249,7 @@ interface AmountProps {
     FiatStore?: FiatStore;
     UnitsStore?: UnitsStore;
     SettingsStore?: SettingsStore;
-    sats: number | string;
+    sats: number | string | any;
     fixedUnits?: string;
     sensitive?: boolean;
     sensitiveLength?: number;

diff --git a/components/AmountInput.tsx b/components/AmountInput.tsx
@@ -48,7 +48,7 @@ const getSatAmount = (amount: string | number) => {
 
     const rate = fiat && fiatRates && fiatEntry ? fiatEntry.rate : 0;
 
-    let satAmount: string | number;
+    let satAmount: string | number = 0;
     switch (units) {
         case 'sats':
             satAmount = value;
@@ -68,6 +68,9 @@ const getSatAmount = (amount: string | number) => {
                           .toFixed(0)
                     : 0;
             break;
+        default:
+            satAmount = 0;
+            break;
     }
 
     return satAmount;

diff --git a/components/Button.tsx b/components/Button.tsx
@@ -90,12 +90,12 @@ function Button(props: ButtonProps) {
                     : warning
                     ? themeColor('delete')
                     : themeColor('text'),
-                ...buttonStyle
+                ...(buttonStyle as object)
             }}
             titleStyle={
                 titleStyle
                     ? {
-                          ...titleStyle,
+                          ...(titleStyle as object),
                           textTransform: noUppercase ? 'none' : 'uppercase',
                           fontFamily: 'PPNeueMontreal-Book'
                       }

diff --git a/components/Channels/ChannelItem.tsx b/components/Channels/ChannelItem.tsx
@@ -33,8 +33,8 @@ export function ChannelItem({
 }: {
     title?: string;
     secondTitle?: string;
-    inbound: number;
-    outbound: number;
+    inbound: string | number;
+    outbound: string | number;
     largestTotal?: number;
     status?: Status;
     pendingHTLCs?: boolean;
@@ -79,7 +79,10 @@ export function ChannelItem({
                             }
                             bold={selected}
                         >
-                            {PrivacyUtils.sensitiveValue(title)}
+                            {`${
+                                typeof title === 'string' &&
+                                PrivacyUtils.sensitiveValue(title)
+                            }`}
                         </Body>
                     </View>
                 )}

diff --git a/components/Channels/ChannelsFilter.tsx b/components/Channels/ChannelsFilter.tsx
@@ -102,20 +102,21 @@ const getChannelsSortKeys = (closed?: boolean) => {
 };
 
 interface ChannelsFilterProps {
-    width?: string | number;
+    width?: number;
 }
 
 const ChannelsFilter = (props: ChannelsFilterProps) => {
     const { channelsStore } = stores;
     const { search, setSort, channelsType } = channelsStore;
     const windowWidth = Dimensions.get('window').width;
+
     return (
         <View>
             <Row>
                 <SearchBar
                     placeholder={localeString('general.search')}
-                    onChangeText={(value: string) =>
-                        channelsStore!.setSearch(value)
+                    onChangeText={(value?: string) =>
+                        channelsStore!.setSearch(value ?? '')
                     }
                     value={search}
                     inputStyle={{
@@ -124,7 +125,7 @@ const ChannelsFilter = (props: ChannelsFilterProps) => {
                     }}
                     placeholderTextColor={themeColor('secondaryText')}
                     containerStyle={{
-                        backgroundColor: null,
+                        backgroundColor: 'transparent',
                         borderTopWidth: 0,
                         borderBottomWidth: 0,
                         width: props.width || windowWidth - 55
@@ -134,6 +135,22 @@ const ChannelsFilter = (props: ChannelsFilterProps) => {
                         backgroundColor: themeColor('secondary')
                     }}
                     autoCapitalize="none"
+                    platform="default"
+                    showLoading={false}
+                    round={false}
+                    lightTheme={false}
+                    loadingProps={{}}
+                    onClear={() => channelsStore!.setSearch('')}
+                    onFocus={() => {}}
+                    onBlur={() => {}}
+                    onCancel={() => {
+                        channelsStore!.setSearch('');
+                    }}
+                    cancelButtonTitle="Cancel"
+                    cancelButtonProps={{}}
+                    searchIcon={{ name: 'search', type: 'font-awesome' }}
+                    clearIcon={{ name: 'close', type: 'font-awesome' }}
+                    showCancel={true}
                 />
                 <SortButton
                     onValueChange={(value: any) => {

diff --git a/components/Channels/ChannelsHeader.tsx b/components/Channels/ChannelsHeader.tsx
@@ -9,13 +9,19 @@ import { Spacer } from '../layout/Spacer';
 import Amount from '../Amount';
 import { localeString } from '../../utils/LocaleUtils';
 
+interface ChannelsHeaderProps {
+    totalInbound: number;
+    totalOutbound: number;
+    totalOffline: number;
+}
+
 function TotalRow({
     kind,
     amount,
     color
 }: {
     kind: string;
-    amount: number;
+    amount: number | string;
     color: string;
 }) {
     return (
@@ -39,7 +45,7 @@ function TotalRow({
     );
 }
 
-export function ChannelsHeader(props) {
+export function ChannelsHeader(props: ChannelsHeaderProps) {
     const { totalInbound, totalOutbound, totalOffline } = props;
 
     return (

diff --git a/components/CopyBox.tsx b/components/CopyBox.tsx
@@ -34,7 +34,7 @@ function CopyBox(props: CopyBoxProps) {
                         : themeColor('background')
             }}
             onPress={() => {
-                Clipboard.setString(URL);
+                Clipboard.setString(URL || '');
                 setCopied(true);
                 setCurrentTheme('light');
                 setTimeout(function () {

diff --git a/components/DropdownSetting.tsx b/components/DropdownSetting.tsx
@@ -14,7 +14,7 @@ import { localeString } from './../utils/LocaleUtils';
 
 interface DropdownSettingProps {
     title: string;
-    selectedValue: string | boolean;
+    selectedValue: string | number;
     onValueChange: (value: any) => void;
     values: Array<any>;
     disabled?: boolean;

diff --git a/components/Header.tsx b/components/Header.tsx
@@ -1,10 +1,5 @@
 import React from 'react';
-import {
-    StyleProp,
-    TextStyle,
-    ViewStyle,
-    TouchableOpacity
-} from 'react-native';
+import { StyleProp, ViewStyle, TouchableOpacity } from 'react-native';
 import { Header, TextProps } from 'react-native-elements';
 import { IconObject } from 'react-native-elements/dist/icons/Icon';
 
@@ -19,7 +14,7 @@ interface HeaderIcon extends IconObject {
     icon?: string;
     text?: string;
     color?: string;
-    style?: StyleProp<TextStyle>;
+    style?: StyleProp<ViewStyle>;
 }
 
 interface HeaderProps {
@@ -31,7 +26,7 @@ interface HeaderProps {
         | 'Close';
     centerComponent?: React.ReactElement<{}> | TextProps | HeaderIcon;
     rightComponent?: React.ReactElement<{}> | TextProps | HeaderIcon;
-    containerStyle?: ViewStyle;
+    containerStyle?: ViewStyle | any;
     placement?: 'left' | 'center' | 'right' | undefined;
     navigation?: StackNavigationProp<any, any>;
     onBack?: () => void;

diff --git a/components/HopPicker.tsx b/components/HopPicker.tsx
@@ -226,7 +226,7 @@ export default class ChannelPicker extends React.Component<
                                       )}
                             </Text>
 
-                            <ChannelsFilter width="86%" />
+                            <ChannelsFilter />
 
                             <FlatList
                                 data={channels}

diff --git a/components/LayerBalances/LightningSwipeableRow.tsx b/components/LayerBalances/LightningSwipeableRow.tsx
@@ -29,6 +29,7 @@ interface LightningSwipeableRowProps {
     lightning?: string;
     offer?: string;
     locked?: boolean;
+    children: React.ReactNode;
 }
 
 export default class LightningSwipeableRow extends Component<
@@ -38,7 +39,7 @@ export default class LightningSwipeableRow extends Component<
     private renderAction = (
         text: string,
         x: number,
-        progress: Animated.AnimatedInterpolation
+        progress: Animated.AnimatedInterpolation<number>
     ) => {
         const transTranslateX = progress.interpolate({
             inputRange: [0.25, 1],
@@ -130,7 +131,9 @@ export default class LightningSwipeableRow extends Component<
         );
     };
 
-    private renderActions = (progress: Animated.AnimatedInterpolation) => {
+    private renderActions = (
+        progress: Animated.AnimatedInterpolation<number>
+    ) => {
         const width =
             BackendUtils.supportsRouting() &&
             BackendUtils.supportsLightningSends() &&
@@ -185,11 +188,15 @@ export default class LightningSwipeableRow extends Component<
     };
 
     private close = () => {
-        this.swipeableRow.close();
+        if (this.swipeableRow) {
+            this.swipeableRow.close();
+        }
     };
 
     private open = () => {
-        this.swipeableRow.openLeft();
+        if (this.swipeableRow) {
+            this.swipeableRow.openLeft();
+        }
     };
 
     private fetchLnInvoice = () => {
@@ -245,7 +252,7 @@ export default class LightningSwipeableRow extends Component<
                     );
                 });
         } else {
-            invoicesStore.getPayReq(this.props.lightning);
+            invoicesStore.getPayReq(lightning ?? '');
             this.props.navigation.navigate('PaymentRequest', {});
         }
     };

diff --git a/components/LayerBalances/OnchainSwipeableRow.tsx b/components/LayerBalances/OnchainSwipeableRow.tsx
@@ -26,6 +26,7 @@ interface OnchainSwipeableRowProps {
     locked?: boolean;
     account?: string;
     hidden?: boolean;
+    children?: React.ReactNode;
 }
 
 export default class OnchainSwipeableRow extends Component<
@@ -35,7 +36,7 @@ export default class OnchainSwipeableRow extends Component<
     private renderAction = (
         text: string,
         x: number,
-        progress: Animated.AnimatedInterpolation
+        progress: Animated.AnimatedInterpolation<number>
     ) => {
         const { account, navigation } = this.props;
         const transTranslateX = progress.interpolate({
@@ -120,7 +121,9 @@ export default class OnchainSwipeableRow extends Component<
         );
     };
 
-    private renderActions = (progress: Animated.AnimatedInterpolation) => (
+    private renderActions = (
+        progress: Animated.AnimatedInterpolation<number>
+    ) => (
         <View
             style={{
                 marginLeft: 15,
@@ -150,11 +153,11 @@ export default class OnchainSwipeableRow extends Component<
     };
 
     private close = () => {
-        this.swipeableRow.close();
+        if (this.swipeableRow) this.swipeableRow.close();
     };
 
     private open = () => {
-        this.swipeableRow.openLeft();
+        if (this.swipeableRow) this.swipeableRow.openLeft();
     };
 
     private sendToAddress = () => {

diff --git a/components/LayerBalances/index.tsx b/components/LayerBalances/index.tsx
@@ -58,7 +58,7 @@ type DataRow = {
     subtitle?: string;
     balance: string | number;
     // TODO check if exists
-    count: number;
+    count?: number;
     watchOnly?: boolean;
     hidden?: boolean;
 };
@@ -147,7 +147,7 @@ const Row = ({ item }: { item: DataRow }) => {
                             color: themeColor('buttonText')
                         }}
                     >
-                        {`+${item.count - 1}`}
+                        {item.count && `+${item.count - 1}`}
                     </Text>
                 )}
             </LinearGradient>
@@ -169,7 +169,7 @@ const SwipeableRow = ({
     item: DataRow;
     index: number;
     navigation: StackNavigationProp<any, any>;
-    selectMode: boolean;
+    // selectMode: boolean; // not used for now
     value?: string;
     amount?: string;
     lightning?: string;
@@ -326,7 +326,8 @@ export default class LayerBalances extends Component<LayerBalancesProps, {}> {
         if (Object.keys(otherAccounts).length > 1 && consolidated) {
             DATA.push({
                 layer: localeString('components.LayerBalances.moreAccounts'),
-                count: Object.keys(otherAccounts).length
+                count: Object.keys(otherAccounts).length,
+                balance: 0
             });
         }
 

diff --git a/components/LightningIndicator.tsx b/components/LightningIndicator.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Image } from 'react-native';
 
-import Loading from './../assets/images/GIF/Loading.gif';
+const Loading = require('../assets/images/GIF/Loading.gif');
 
 interface LightningIndicatorProps {
     size?: number;