Merge pull request #2535 from kaloudis/reserve-updates

Channels: reserve updates
ZeusLN · Nov 16, 2024 · 78370c3 · 78370c3
2 parents efc86b8 + f044adf
commit 78370c3
Show file tree

Hide file tree

Showing 11 changed files with 181 additions and 67 deletions.
diff --git a/components/Amount.tsx b/components/Amount.tsx
@@ -32,7 +32,13 @@ interface AmountDisplayProps {
     space?: boolean;
     jumboText?: boolean;
     defaultTextSize?: boolean;
-    color?: 'text' | 'success' | 'warning' | 'highlight' | 'secondaryText';
+    color?:
+        | 'text'
+        | 'success'
+        | 'warning'
+        | 'warningReserve'
+        | 'highlight'
+        | 'secondaryText';
     colorOverride?: string;
     pending?: boolean;
     fee?: boolean;
@@ -267,7 +273,13 @@ interface AmountProps {
     credit?: boolean;
     debit?: boolean;
     // If credit or debit doesn't cover the use case
-    color?: 'text' | 'success' | 'warning' | 'highlight' | 'secondaryText';
+    color?:
+        | 'text'
+        | 'success'
+        | 'warning'
+        | 'warningReserve'
+        | 'highlight'
+        | 'secondaryText';
     colorOverride?: string;
     toggleable?: boolean;
     pending?: boolean;

diff --git a/components/BalanceSlider.tsx b/components/BalanceSlider.tsx
@@ -5,6 +5,8 @@ import { ChannelItem } from '../components/Channels/ChannelItem';
 interface BalanceSliderProps {
     localBalance: string | number;
     remoteBalance: string | number;
+    sendingCapacity: string | number;
+    receivingCapacity: string | number;
     localReserveBalance?: string | number;
     remoteReserveBalance?: string | number;
     list?: boolean;
@@ -18,14 +20,18 @@ export default class BalanceSlider extends React.Component<
         const {
             localBalance,
             remoteBalance,
+            sendingCapacity,
+            receivingCapacity,
             localReserveBalance,
             remoteReserveBalance
         } = this.props;
         return (
             <View style={styles.slider}>
                 <ChannelItem
-                    inbound={remoteBalance}
-                    outbound={localBalance}
+                    localBalance={localBalance}
+                    remoteBalance={remoteBalance}
+                    sendingCapacity={sendingCapacity}
+                    receivingCapacity={receivingCapacity}
                     inboundReserve={localReserveBalance}
                     outboundReserve={remoteReserveBalance}
                     noBorder

diff --git a/components/Channels/ChannelItem.tsx b/components/Channels/ChannelItem.tsx
@@ -20,8 +20,10 @@ import { localeString } from './../../utils/LocaleUtils';
 export function ChannelItem({
     title,
     secondTitle,
-    inbound,
-    outbound,
+    localBalance,
+    remoteBalance,
+    sendingCapacity,
+    receivingCapacity,
     inboundReserve = 0,
     outboundReserve = 0,
     largestTotal,
@@ -31,12 +33,15 @@ export function ChannelItem({
     noBorder,
     hideLabels,
     selected,
-    highlightLabels
+    highlightLabels,
+    isBelowReserve
 }: {
     title?: string;
     secondTitle?: string;
-    inbound: string | number;
-    outbound: string | number;
+    localBalance: string | number;
+    remoteBalance: string | number;
+    sendingCapacity?: string | number;
+    receivingCapacity?: string | number;
     inboundReserve?: string | number;
     outboundReserve?: string | number;
     largestTotal?: number;
@@ -47,6 +52,7 @@ export function ChannelItem({
     hideLabels?: boolean;
     selected?: boolean;
     highlightLabels?: boolean;
+    isBelowReserve?: boolean;
 }) {
     const { settings } = Stores.settingsStore;
     const { privacy } = settings;
@@ -58,7 +64,7 @@ export function ChannelItem({
         status === Status.Opening;
 
     const percentOfLargest = largestTotal
-        ? (Number(inbound) + Number(outbound)) / largestTotal
+        ? (Number(localBalance) + Number(remoteBalance)) / largestTotal
         : 1.0;
     return (
         <View
@@ -129,25 +135,33 @@ export function ChannelItem({
                 ) : null}
                 {status && <Tag status={status} />}
             </Row>
-            {inbound && outbound && !(inbound == 0 && outbound == 0) && (
-                <Row style={{ marginTop: 15, marginBottom: 15 }}>
-                    <BalanceBar
-                        outbound={lurkerMode ? 50 : Number(outbound)}
-                        inbound={lurkerMode ? 50 : Number(inbound)}
-                        outboundReserve={
-                            lurkerMode ? 0 : Number(outboundReserve)
-                        }
-                        inboundReserve={lurkerMode ? 0 : Number(inboundReserve)}
-                        offline={isOffline}
-                        percentOfLargest={percentOfLargest}
-                        showProportionally={lurkerMode ? false : true}
-                    />
-                </Row>
-            )}
+            {localBalance &&
+                remoteBalance &&
+                !(localBalance == 0 && remoteBalance == 0) && (
+                    <Row style={{ marginTop: 15, marginBottom: 15 }}>
+                        <BalanceBar
+                            outbound={lurkerMode ? 50 : Number(localBalance)}
+                            inbound={lurkerMode ? 50 : Number(remoteBalance)}
+                            outboundReserve={
+                                lurkerMode ? 0 : Number(outboundReserve)
+                            }
+                            inboundReserve={
+                                lurkerMode ? 0 : Number(inboundReserve)
+                            }
+                            offline={isOffline}
+                            percentOfLargest={percentOfLargest}
+                            showProportionally={lurkerMode ? false : true}
+                        />
+                    </Row>
+                )}
             {!hideLabels && (
                 <Row justify="space-between">
                     <Amount
-                        sats={outbound}
+                        sats={
+                            isBelowReserve
+                                ? localBalance
+                                : sendingCapacity || localBalance
+                        }
                         sensitive
                         accessible
                         accessibilityLabel={localeString(
@@ -156,9 +170,10 @@ export function ChannelItem({
                         colorOverride={
                             highlightLabels ? themeColor('outbound') : undefined
                         }
+                        color={isBelowReserve ? 'warningReserve' : undefined}
                     />
                     <Amount
-                        sats={inbound}
+                        sats={receivingCapacity || remoteBalance}
                         sensitive
                         accessible
                         accessibilityLabel={localeString(

diff --git a/components/HopPicker.tsx b/components/HopPicker.tsx
@@ -144,10 +144,13 @@ export default class ChannelPicker extends React.Component<
                 <TouchableHighlight onPress={() => this.toggleItem(item)}>
                     <ChannelItem
                         title={item.displayName}
-                        inbound={item.remoteBalance}
-                        outbound={item.localBalance}
-                        inboundReserve={item.remoteReserveBalance}
+                        localBalance={item.localBalance}
+                        remoteBalance={item.remoteBalance}
+                        sendingCapacity={item.sendingCapacity}
+                        receivingCapacity={item.receivingCapacity}
                         outboundReserve={item.localReserveBalance}
+                        inboundReserve={item.remoteReserveBalance}
+                        isBelowReserve={item.isBelowReserve}
                         largestTotal={largestChannelSats}
                         selected={selected}
                     />
@@ -159,10 +162,13 @@ export default class ChannelPicker extends React.Component<
             <TouchableHighlight onPress={() => this.toggleItem(item)}>
                 <ChannelItem
                     title={item.displayName}
-                    inbound={item.remoteBalance}
-                    outbound={item.localBalance}
-                    inboundReserve={item.remoteReserveBalance}
+                    localBalance={item.localBalance}
+                    remoteBalance={item.remoteBalance}
+                    sendingCapacity={item.sendingCapacity}
+                    receivingCapacity={item.receivingCapacity}
                     outboundReserve={item.localReserveBalance}
+                    inboundReserve={item.remoteReserveBalance}
+                    isBelowReserve={item.isBelowReserve}
                     selected={selected}
                 />
             </TouchableHighlight>

diff --git a/components/LSPS1OrderResponse.tsx b/components/LSPS1OrderResponse.tsx
@@ -48,8 +48,8 @@ export default class LSPS1OrderResponse extends React.Component<
                 <ScrollView>
                     <View style={{ paddingHorizontal: 20 }}>
                         <ChannelItem
-                            outbound={orderResponse?.client_balance_sat}
-                            inbound={orderResponse?.lsp_balance_sat}
+                            localBalance={orderResponse?.client_balance_sat}
+                            remoteBalance={orderResponse?.lsp_balance_sat}
                             title={localeString('views.LSPS1.yourBalance')}
                             secondTitle={localeString(
                                 'views.LSPS1.receiveLimit'

diff --git a/components/text/Body.tsx b/components/text/Body.tsx
@@ -29,6 +29,7 @@ export function Body({
         | 'text'
         | 'success'
         | 'warning'
+        | 'warningReserve'
         | 'highlight'
         | 'secondaryText'
         | 'outbound'

diff --git a/models/Channel.ts b/models/Channel.ts
@@ -95,21 +95,30 @@ export default class Channel extends BaseModel {
 
     @computed
     public get localBalance(): string {
-        const totalLocalBalance = this.to_us
+        return this.to_us
             ? (Number(this.to_us) / 1000).toString()
             : this.to_us_msat
             ? (Number(this.to_us_msat) / 1000).toString()
             : this.msatoshi_to_us
             ? (Number(this.msatoshi_to_us) / 1000).toString()
             : this.local_balance || '0';
-        return (
-            Number(totalLocalBalance) - Number(this.localReserveBalance)
-        ).toString();
+    }
+
+    @computed
+    public get sendingCapacity(): string {
+        const localBalance = new BigNumber(this.localBalance).minus(
+            this.localReserveBalance
+        );
+        if (localBalance.gt(0)) {
+            return localBalance.toString();
+        } else {
+            return '0';
+        }
     }
 
     @computed
     public get remoteBalance(): string {
-        const totalRemoteBalance = this.total
+        return this.total
             ? ((Number(this.total) - Number(this.to_us)) / 1000).toString()
             : this.total_msat
             ? (
@@ -122,9 +131,18 @@ export default class Channel extends BaseModel {
                   1000
               ).toString()
             : this.remote_balance || '0';
-        return (
-            Number(totalRemoteBalance) - Number(this.remoteReserveBalance)
-        ).toString();
+    }
+
+    @computed
+    public get receivingCapacity(): string {
+        const remoteBalance = new BigNumber(this.remoteBalance).minus(
+            this.remoteReserveBalance
+        );
+        if (remoteBalance.gt(0)) {
+            return remoteBalance.toString();
+        } else {
+            return '0';
+        }
     }
 
     @computed
@@ -148,6 +166,14 @@ export default class Channel extends BaseModel {
         ).toString();
     }
 
+    @computed
+    public get isBelowReserve(): boolean {
+        return (
+            new BigNumber(this.localBalance).lt(this.localReserveBalance) &&
+            new BigNumber(this.localBalance).gt(0)
+        );
+    }
+
     /** Channel id
      * @returns {string | undefined} id of the channel or undefined if channel is pending
      */

diff --git a/stores/ChannelsStore.ts b/stores/ChannelsStore.ts
@@ -405,10 +405,10 @@ export default class ChannelsStore {
                 );
                 channels.forEach((channel: Channel) => {
                     const channelRemoteBalance = new BigNumber(
-                        channel.remoteBalance
+                        channel.receivingCapacity
                     );
                     const channelLocalBalance = new BigNumber(
-                        channel.localBalance
+                        channel.sendingCapacity
                     );
                     const channelTotal =
                         channelRemoteBalance.plus(channelLocalBalance);

diff --git a/utils/ThemeUtils.ts b/utils/ThemeUtils.ts
@@ -13,6 +13,7 @@ const Kyriaki: { [key: string]: any } = {
     inbound: '#FFF0CA',
     success: '#46BE43',
     warning: '#E14C4C',
+    warningReserve: '#EA8181',
     bitcoin: '#FFB040',
     delete: '#992600',
     bolt: '#FFF',
@@ -43,6 +44,7 @@ const Light: { [key: string]: any } = {
     inbound: '#FFF0CA',
     success: '#46BE43',
     warning: '#E14C4C',
+    warningReserve: '#EA8181',
     bitcoin: '#FFB040',
     delete: '#cc3300',
     qrFrame: '#FFD93F',
@@ -68,6 +70,7 @@ const Dark: { [key: string]: any } = {
     inboundReserve: '#636569',
     success: '#46BE43',
     warning: '#E14C4C',
+    warningReserve: '#EA8181',
     bitcoin: '#FFB040',
     delete: '#992600',
     qrFrame: '#FFD93F',