Merge pull request #2453 from kaloudis/typescript-fixes

tsc: fix components, assets, models, utils, stores
ZeusLN · Oct 12, 2024 · a81d0f7 · a81d0f7
2 parents 773c51b + 19af314
commit a81d0f7
Show file tree

Hide file tree

Showing 54 changed files with 536 additions and 351 deletions.
diff --git a/PushNotificationManager.tsx b/PushNotificationManager.tsx
@@ -3,7 +3,7 @@ import { Alert, Platform, View } from 'react-native';
 import { Notifications } from 'react-native-notifications';
 import stores from './stores/Stores';
 
-export default class PushNotificationManager extends React.Component {
+export default class PushNotificationManager extends React.Component<any, any> {
     componentDidMount() {
         if (Platform.OS === 'ios') Notifications.ios.setBadgeCount(0);
         this.registerDevice();
@@ -70,7 +70,7 @@ export default class PushNotificationManager extends React.Component {
         );
 
         Notifications.events().registerNotificationReceivedBackground(
-            (notification, completion) => {
+            (notification, completion: any) => {
                 console.log('Notification Received - Background', notification);
                 // Calling completion on iOS with `alert: true` will present the native iOS inApp notification.
                 completion({ alert: true, sound: true, badge: false });

diff --git a/assets/images/SVG/DynamicSVG/AddressSvg.tsx b/assets/images/SVG/DynamicSVG/AddressSvg.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Svg, Circle, Path } from 'react-native-svg';
+import { Svg, Circle, Path, Linecap, Linejoin } from 'react-native-svg';
 import { themeColor } from '../../../../utils/ThemeUtils';
 
 export default function AddressSvg({ circle = true, selected = false }) {
@@ -18,7 +18,13 @@ export default function AddressSvg({ circle = true, selected = false }) {
         fill: themeColor('background')
     };
 
-    const pathProps = {
+    const pathProps: {
+        d: string;
+        stroke: string;
+        strokeLinecap: Linecap;
+        strokeLinejoin: Linejoin;
+        strokeWidth: string;
+    } = {
         d: 'M29 25C29 27.209 27.209 29 25 29 22.791 29 21 27.209 21 25 21 22.791 22.791 21 25 21 27.209 21 29 22.791 29 25ZM29 25V26.5C29 27.881 30.119 29 31.5 29V29C32.881 29 34 27.881 34 26.5V25C34 20.029 29.971 16 25 16 20.029 16 16 20.029 16 25 16 29.971 20.029 34 25 34H29',
         stroke: selected ? themeColor('background') : themeColor('bolt'),
         strokeLinecap: 'round',

diff --git a/check-styles.test.ts b/check-styles.test.ts
@@ -11,13 +11,14 @@ describe('static style sheets', () => {
         const tsxFiles = dirs.flatMap((dir) =>
             fs
                 .readdirSync(dir, { recursive: dir !== '.' })
+                // @ts-ignore:next-line
                 .filter(
-                    (file) =>
+                    (file: any) =>
                         typeof file === 'string' &&
                         !file.startsWith('node_modules/') &&
                         file.toLowerCase().endsWith('.tsx')
                 )
-                .map((file) => path.join(dir, file as string))
+                .map((file: any) => path.join(dir, file as string))
         );
         const regExp = new RegExp(
             /\n[^\s][^\n]+StyleSheet\.create\(\{.*themeColor\(/,

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;
     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 = () => {