Refactor: FiatStore + UnitsUtils

ZeusLN · Nov 13, 2024 · 409c395 · 409c395
1 parent 47e0307
commit 409c395
Show file tree

Hide file tree

Showing 20 changed files with 148 additions and 132 deletions.
diff --git a/components/Amount.tsx b/components/Amount.tsx
@@ -1,18 +1,23 @@
 import * as React from 'react';
 import { TouchableOpacity, StyleSheet, View } from 'react-native';
 import { inject, observer } from 'mobx-react';
+
 import FiatStore from '../stores/FiatStore';
 import UnitsStore from '../stores/UnitsStore';
 import SettingsStore from '../stores/SettingsStore';
-import PrivacyUtils from '../utils/PrivacyUtils';
-import ClockIcon from '../assets/images/SVG/Clock.svg';
-import { localeString } from '../utils/LocaleUtils';
-import { themeColor } from '../utils/ThemeUtils';
+
 import { Spacer } from './layout/Spacer';
 import { Row } from './layout/Row';
 import { Body } from './text/Body';
 import LoadingIndicator from './LoadingIndicator';
 
+import { localeString } from '../utils/LocaleUtils';
+import { themeColor } from '../utils/ThemeUtils';
+import { formatBitcoinWithSpaces } from '../utils/UnitsUtils';
+import PrivacyUtils from '../utils/PrivacyUtils';
+
+import ClockIcon from '../assets/images/SVG/Clock.svg';
+
 import stores from '../stores/Stores';
 
 type Units = 'sats' | 'BTC' | 'fiat';
@@ -186,9 +191,7 @@ function AmountDisplay({
                                 {amount === 'N/A' && fiatRatesLoading ? (
                                     <LoadingIndicator size={20} />
                                 ) : unit === 'BTC' ? (
-                                    stores.fiatStore.formatBitcoinWithSpaces(
-                                        amount
-                                    )
+                                    formatBitcoinWithSpaces(amount)
                                 ) : (
                                     amount.toString()
                                 )}
@@ -221,9 +224,7 @@ function AmountDisplay({
                                 {amount === 'N/A' && fiatRatesLoading ? (
                                     <LoadingIndicator size={20} />
                                 ) : unit === 'BTC' ? (
-                                    stores.fiatStore.formatBitcoinWithSpaces(
-                                        amount
-                                    )
+                                    formatBitcoinWithSpaces(amount)
                                 ) : (
                                     amount.toString()
                                 )}

diff --git a/components/AmountInput.tsx b/components/AmountInput.tsx
@@ -7,11 +7,12 @@ import Amount from './Amount';
 import TextInput from './TextInput';
 
 import { themeColor } from '../utils/ThemeUtils';
+import { SATS_PER_BTC } from '../utils/UnitsUtils';
 
 import Stores from '../stores/Stores';
 import FiatStore from '../stores/FiatStore';
 import SettingsStore from '../stores/SettingsStore';
-import UnitsStore, { SATS_PER_BTC } from '../stores/UnitsStore';
+import UnitsStore from '../stores/UnitsStore';
 
 import ExchangeBitcoinSVG from '../assets/images/SVG/ExchangeBitcoin.svg';
 import ExchangeFiatSVG from '../assets/images/SVG/ExchangeFiat.svg';

diff --git a/components/LSPS1OrderResponse.tsx b/components/LSPS1OrderResponse.tsx
@@ -11,23 +11,22 @@ import Button from './Button';
 
 import { localeString } from '../utils/LocaleUtils';
 import { themeColor } from '../utils/ThemeUtils';
+import { numberWithCommas } from '../utils/UnitsUtils';
 import UrlUtils from '../utils/UrlUtils';
 
 import InvoicesStore from '../stores/InvoicesStore';
 import NodeInfoStore from '../stores/NodeInfoStore';
-import FiatStore from '../stores/FiatStore';
 import { ChannelItem } from './Channels/ChannelItem';
 
 interface LSPS1OrderResponseProps {
     navigation: any;
     orderResponse: any;
     InvoicesStore?: InvoicesStore;
     NodeInfoStore?: NodeInfoStore;
-    FiatStore?: FiatStore;
     orderView: boolean;
 }
 
-@inject('InvoicesStore', 'NodeInfoStore', 'FiatStore')
+@inject('InvoicesStore', 'NodeInfoStore')
 @observer
 export default class LSPS1OrderResponse extends React.Component<
     LSPS1OrderResponseProps,
@@ -38,7 +37,6 @@ export default class LSPS1OrderResponse extends React.Component<
             orderResponse,
             InvoicesStore,
             NodeInfoStore,
-            FiatStore,
             orderView,
             navigation
         } = this.props;
@@ -108,7 +106,7 @@ export default class LSPS1OrderResponse extends React.Component<
                                 keyValue={localeString(
                                     'views.LSPS1.channelExpiryBlocks'
                                 )}
-                                value={FiatStore!.numberWithCommas(
+                                value={numberWithCommas(
                                     orderResponse?.channel_expiry_blocks
                                 )}
                             />

diff --git a/components/Sats.tsx b/components/Sats.tsx
@@ -3,12 +3,10 @@ import { View } from 'react-native';
 import { Body } from '../components/text/Body';
 import { Row } from '../components/layout/Row';
 import { Spacer } from '../components/layout/Spacer';
+import { numberWithCommas } from '../utils/UnitsUtils';
 
 // TODO: will replace this with a more generic "Value" component
 export function Sats({ sats }: { sats: number }) {
-    const numberWithCommas = (x: string | number = 0) =>
-        x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
-
     return (
         <Row align="flex-end">
             <Body>{numberWithCommas(sats)}</Body>

diff --git a/stores/FiatStore.ts b/stores/FiatStore.ts
@@ -3,7 +3,11 @@ import ReactNativeBlobUtil from 'react-native-blob-util';
 import BigNumber from 'bignumber.js';
 
 import SettingsStore from './SettingsStore';
-import { SATS_PER_BTC } from './UnitsStore';
+import {
+    SATS_PER_BTC,
+    numberWithCommas,
+    numberWithDecimals
+} from '../utils/UnitsUtils';
 
 interface CurrencyDisplayRules {
     symbol: string;
@@ -24,34 +28,6 @@ export default class FiatStore {
     @observable public loading = false;
     @observable public error = false;
 
-    @observable public numberWithCommas = (x: string | number) =>
-        x?.toString()?.replace(/\B(?=(\d{3})+(?!\d))/g, ',') || '0';
-
-    @observable public formatBitcoinWithSpaces = (x: string | number) => {
-        // Convert to string to handle decimal parts
-        const [integerPart, decimalPart] = x.toString().split('.');
-
-        const integerFormatted = this.numberWithCommas(integerPart);
-
-        // // If no decimal part, return the integer part as is
-        if (x.toString().includes('.') && !decimalPart) {
-            return `${integerFormatted}.`;
-        } else if (!decimalPart) {
-            return integerFormatted;
-        }
-
-        // Handle the first two characters, then group the rest in threes
-        const firstTwo = decimalPart.slice(0, 2);
-        const rest = decimalPart.slice(2).replace(/(\d{3})(?=\d)/g, '$1 ');
-
-        // Combine integer part, first two characters, and formatted rest
-        return `${integerFormatted}.${firstTwo} ${rest}`.trim();
-    };
-
-    @observable public numberWithDecimals = (x: string | number) =>
-        this.numberWithCommas(x).replace(/[,.]/g, (y: string) =>
-            y === ',' ? '.' : ','
-        );
     private sourceOfCurrentFiatRates: string | undefined;
 
     getFiatRatesToken: any;
@@ -602,12 +578,12 @@ export default class FiatStore {
                 .toFixed(0);
 
             const formattedRate = separatorSwap
-                ? this.numberWithDecimals(rate)
-                : this.numberWithCommas(rate);
+                ? numberWithDecimals(rate)
+                : numberWithCommas(rate);
 
             const formattedMoscow = separatorSwap
-                ? this.numberWithDecimals(moscowTime)
-                : this.numberWithCommas(moscowTime);
+                ? numberWithDecimals(moscowTime)
+                : numberWithCommas(moscowTime);
 
             if (sats) {
                 return `${formattedMoscow} sats = 1 ${fiat}`;
@@ -770,8 +746,8 @@ export default class FiatStore {
     public formatAmountForDisplay = (input: string | number) => {
         const { symbol, space, rtl, separatorSwap } = this.getSymbol();
         const amount = separatorSwap
-            ? this.numberWithDecimals(input)
-            : this.numberWithCommas(input);
+            ? numberWithDecimals(input)
+            : numberWithCommas(input);
 
         if (rtl) return `${amount}${space ? ' ' : ''}${symbol}`;
         return `${symbol}${space ? ' ' : ''}${amount}`;

diff --git a/stores/PosStore.ts b/stores/PosStore.ts
@@ -2,12 +2,14 @@ import { action, observable } from 'mobx';
 import EncryptedStorage from 'react-native-encrypted-storage';
 import ReactNativeBlobUtil from 'react-native-blob-util';
 import BigNumber from 'bignumber.js';
+import { v4 as uuidv4 } from 'uuid';
 
-import { SATS_PER_BTC } from './UnitsStore';
+import FiatStore from './FiatStore';
 import SettingsStore, { PosEnabled } from './SettingsStore';
+
 import Order from '../models/Order';
-import { v4 as uuidv4 } from 'uuid';
-import FiatStore from './FiatStore';
+
+import { SATS_PER_BTC } from '../utils/UnitsUtils';
 
 export interface orderPaymentInfo {
     orderId: string;

diff --git a/stores/UnitsStore.ts b/stores/UnitsStore.ts
@@ -3,12 +3,15 @@ import EncryptedStorage from 'react-native-encrypted-storage';
 
 import SettingsStore from './SettingsStore';
 import FiatStore from './FiatStore';
-import FeeUtils from './../utils/FeeUtils';
 
-type Units = 'sats' | 'BTC' | 'fiat';
+import {
+    SATS_PER_BTC,
+    numberWithCommas,
+    numberWithDecimals
+} from '../utils/UnitsUtils';
+import FeeUtils from '../utils/FeeUtils';
 
-// 100_000_000
-export const SATS_PER_BTC = 100000000;
+type Units = 'sats' | 'BTC' | 'fiat';
 
 const UNIT_KEY = 'zeus-units';
 
@@ -94,7 +97,7 @@ export default class UnitsStore {
             };
         } else if (units === 'sats') {
             return {
-                amount: this.fiatStore.numberWithCommas(absValueSats),
+                amount: numberWithCommas(absValueSats),
                 unit: 'sats',
                 negative,
                 plural: !(Number(value) === 1 || Number(value) === -1)
@@ -134,8 +137,8 @@ export default class UnitsStore {
 
                 return {
                     amount: separatorSwap
-                        ? this.fiatStore.numberWithDecimals(amount)
-                        : this.fiatStore.numberWithCommas(amount),
+                        ? numberWithDecimals(amount)
+                        : numberWithCommas(amount),
                     unit: 'fiat',
                     symbol,
                     negative,
@@ -177,9 +180,9 @@ export default class UnitsStore {
                 Number(wholeSats || 0) / SATS_PER_BTC
             )}`;
         } else if (units === 'sats') {
-            const sats = `${
-                this.fiatStore.numberWithCommas(wholeSats || value) || 0
-            } ${Number(value) === 1 || Number(value) === -1 ? 'sat' : 'sats'}`;
+            const sats = `${numberWithCommas(wholeSats || value) || 0} ${
+                Number(value) === 1 || Number(value) === -1 ? 'sat' : 'sats'
+            }`;
             return sats;
         } else if (units === 'fiat' && fiat) {
             if (this.fiatStore.fiatRates) {
@@ -197,8 +200,8 @@ export default class UnitsStore {
                 ).toFixed(2);
 
                 const formattedAmount = separatorSwap
-                    ? this.fiatStore.numberWithDecimals(amount)
-                    : this.fiatStore.numberWithCommas(amount);
+                    ? numberWithDecimals(amount)
+                    : numberWithCommas(amount);
 
                 if (rtl) {
                     return `${formattedAmount}${space ? ' ' : ''}${symbol}`;
@@ -231,9 +234,9 @@ export default class UnitsStore {
             return `₿${FeeUtils.toFixed(Number(value || 0))}`;
         } else if (units === 'sats') {
             const [wholeSats] = value.toString().split('.');
-            const sats = `${
-                this.fiatStore.numberWithCommas(wholeSats || value) || 0
-            } ${Number(value) === 1 || Number(value) === -1 ? 'sat' : 'sats'}`;
+            const sats = `${numberWithCommas(wholeSats || value) || 0} ${
+                Number(value) === 1 || Number(value) === -1 ? 'sat' : 'sats'
+            }`;
             return sats;
         } else if (units === 'fiat' && fiat) {
             if (this.fiatStore.fiatRates) {
@@ -250,8 +253,8 @@ export default class UnitsStore {
                 ).toFixed(2);
 
                 const formattedAmount = separatorSwap
-                    ? this.fiatStore.numberWithDecimals(amount)
-                    : this.fiatStore.numberWithCommas(amount);
+                    ? numberWithDecimals(amount)
+                    : numberWithCommas(amount);
 
                 if (rtl) {
                     return `${formattedAmount}${space ? ' ' : ''}${symbol}`;

diff --git a/utils/AddressUtils.ts b/utils/AddressUtils.ts
@@ -3,7 +3,7 @@ const bitcoin = require('bitcoinjs-lib');
 
 import Base64Utils from '../utils/Base64Utils';
 
-import { SATS_PER_BTC } from '../stores/UnitsStore';
+import { SATS_PER_BTC } from '../utils/UnitsUtils';
 
 import { walletrpc } from '../proto/lightning';
 

diff --git a/utils/UnitsUtils.ts b/utils/UnitsUtils.ts
@@ -1,3 +1,6 @@
+// 100_000_000
+const SATS_PER_BTC = 100000000;
+
 const getDecimalPlaceholder = (amount: string, units: string) => {
     const [_, decimalPart] = amount.split('.');
     const occupiedPlaces: number = (decimalPart && decimalPart.length) || 0;
@@ -28,4 +31,39 @@ const getDecimalPlaceholder = (amount: string, units: string) => {
     };
 };
 
-export { getDecimalPlaceholder };
+const numberWithCommas = (x: string | number) =>
+    x?.toString()?.replace(/\B(?=(\d{3})+(?!\d))/g, ',') || '0';
+
+const numberWithDecimals = (x: string | number) =>
+    numberWithCommas(x).replace(/[,.]/g, (y: string) =>
+        y === ',' ? '.' : ','
+    );
+
+const formatBitcoinWithSpaces = (x: string | number) => {
+    // Convert to string to handle decimal parts
+    const [integerPart, decimalPart] = x.toString().split('.');
+
+    const integerFormatted = numberWithCommas(integerPart);
+
+    // // If no decimal part, return the integer part as is
+    if (x.toString().includes('.') && !decimalPart) {
+        return `${integerFormatted}.`;
+    } else if (!decimalPart) {
+        return integerFormatted;
+    }
+
+    // Handle the first two characters, then group the rest in threes
+    const firstTwo = decimalPart.slice(0, 2);
+    const rest = decimalPart.slice(2).replace(/(\d{3})(?=\d)/g, '$1 ');
+
+    // Combine integer part, first two characters, and formatted rest
+    return `${integerFormatted}.${firstTwo} ${rest}`.trim();
+};
+
+export {
+    SATS_PER_BTC,
+    getDecimalPlaceholder,
+    numberWithCommas,
+    numberWithDecimals,
+    formatBitcoinWithSpaces
+};
diff --git a/views/Activity/Activity.tsx b/views/Activity/Activity.tsx
@@ -23,13 +23,17 @@ import { Row } from '../../components/layout/Row';
 import { localeString } from '../../utils/LocaleUtils';
 import BackendUtils from '../../utils/BackendUtils';
 import { themeColor } from '../../utils/ThemeUtils';
+import {
+    SATS_PER_BTC,
+    numberWithCommas,
+    numberWithDecimals
+} from '../../utils/UnitsUtils';
 
 import ActivityStore from '../../stores/ActivityStore';
 import FiatStore from '../../stores/FiatStore';
 import PosStore from '../../stores/PosStore';
 import SettingsStore from '../../stores/SettingsStore';
 import NotesStore from '../../stores/NotesStore';
-import { SATS_PER_BTC } from '../../stores/UnitsStore';
 
 import Filter from '../../assets/images/SVG/Filter On.svg';
 import Invoice from '../../models/Invoice';
@@ -200,8 +204,8 @@ export default class Activity extends React.PureComponent<
                           };
 
                     const formattedRate = separatorSwap
-                        ? FiatStore.numberWithDecimals(rate)
-                        : FiatStore.numberWithCommas(rate);
+                        ? numberWithDecimals(rate)
+                        : numberWithCommas(rate);
 
                     const exchangeRate = rtl
                         ? `${formattedRate}${