Merge pull request #10 from Kodylow/master

fedimint · Dec 2, 2023 · fd94f4c · fd94f4c
2 parents 582adaf + f962067
commit fd94f4c
Show file tree

Hide file tree

Showing 19 changed files with 133 additions and 244 deletions.
diff --git a/flake.lock b/flake.lock
diff --git a/flake.nix b/flake.nix
@@ -2,10 +2,7 @@
   inputs = {
     nixpkgs.url = "github:NixOS/nixpkgs/nixos-23.05";
     flake-utils.url = "github:numtide/flake-utils";
-    fedimint = {
-      url =
-        "github:fedimint/fedimint?rev=f47e6638c98c75a8c146144a69d236b4763848bf";
-    };
+    fedimint = { url = "github:fedimint/fedimint?branch=releases/0.2"; };
   };
   outputs = { self, nixpkgs, flake-utils, fedimint }:
     flake-utils.lib.eachDefaultSystem (system:

diff --git a/src/client/pages/fedimints.tsx b/src/client/pages/fedimints.tsx
@@ -8,11 +8,14 @@ import {
   Card,
   DarkSubTitle,
 } from '../src/components/generic/Styled';
+import { X } from 'react-feather';
 import { AddMint } from '../src/views/fedimints/AddMint';
 import Table from '../src/components/table';
 import { useGatewayFederations } from '../src/hooks/UseGatewayFederations';
 import { Federation } from '../src/api/types';
 import { CellContext } from '@tanstack/react-table';
+import { toast } from 'react-toastify';
+import { Price } from '../src/components/price/Price';
 
 const FedimintsView = () => {
   const federations = useGatewayFederations();
@@ -40,34 +43,45 @@ const FedimintsView = () => {
         ),
       },
       {
-        header: 'Federation ID',
-        accessorKey: 'federation_id',
+        header: 'Balance',
+        accessorKey: 'balance_msat',
         cell: (props: CellContext<Federation, any>) => (
           <div style={{ whiteSpace: 'nowrap' }}>
-            {`${props.row.original.federation_id.slice(
-              0,
-              6
-            )}...${props.row.original.federation_id.slice(-6)}`}
+            <Price amount={props.row.original.balance_msat / 1000} />
           </div>
         ),
       },
       {
-        header: 'Balance (msat)',
-        accessorKey: 'balance_msat',
+        header: 'Suported Modules',
+        accessorKey: 'modules',
         cell: (props: CellContext<Federation, any>) => (
           <div style={{ whiteSpace: 'nowrap' }}>
-            {props.row.original.balance_msat}
+            {Object.values(props.row.original.config.modules)
+              .map(module => module.kind)
+              .join(', ')}
           </div>
         ),
       },
       {
-        header: 'Consensus Version',
-        accessorKey: 'consensus_version',
+        header: 'Leave',
+        accessorKey: 'leave',
         cell: (props: CellContext<Federation, any>) => (
-          <div style={{ whiteSpace: 'nowrap' }}>
-            {props.row.original.config.consensus_version.major +
-              '.' +
-              props.row.original.config.consensus_version.minor}
+          <div
+            style={{
+              display: 'flex',
+              whiteSpace: 'nowrap',
+              cursor: 'pointer',
+              justifyContent: 'center',
+            }}
+            onClick={() => {
+              if (props.row.original.balance_msat > 0) {
+                toast.error("Can't leave a federation you've got sats in!");
+              } else {
+                toast.warn('Not implemented yet!');
+              }
+            }}
+          >
+            <X />
           </div>
         ),
       },

diff --git a/src/client/src/api/GatewayApi.ts b/src/client/src/api/GatewayApi.ts
@@ -101,7 +101,6 @@ class GatewayApi {
 
       if (res.ok) {
         const txid: string = await res.text();
-        console.log('txid', txid);
         return Promise.resolve(txid);
       }
 

diff --git a/src/client/src/api/types.ts b/src/client/src/api/types.ts
@@ -53,14 +53,15 @@ export interface GatewayInfo {
 
 // Type adaptation from https://docs.rs/bitcoin/latest/bitcoin/network/enum.Network.html
 export enum Network {
-  Bitcoin = 'main',
-  Testnet = 'test',
+  Bitcoin = 'bitcoin',
+  Testnet = 'testnet',
   Signet = 'signet',
   Regtest = 'regtest',
 }
 
 export type TransactionId = string;
 
+// For testing
 export const dummyFederation = {
   federation_id: 'test_federation_id',
   balance_msat: 1000,

diff --git a/src/client/src/components/buttons/colorButton/ColorButton.tsx b/src/client/src/components/buttons/colorButton/ColorButton.tsx
@@ -27,7 +27,8 @@ interface GeneralProps {
 const GeneralButton = styled.button<GeneralProps>`
   min-height: 38px;
   display: flex;
-  justify-content: space-evenly;
+  justify-content: center;
+  gap: 8px;
   align-items: center;
   cursor: pointer;
   outline: none;

diff --git a/src/client/src/components/generic/Styled.tsx b/src/client/src/components/generic/Styled.tsx
@@ -154,6 +154,14 @@ export const RightAlign = styled.div`
   align-items: center;
 `;
 
+export const LeftAlign = styled.div`
+  width: 100%;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  gap: 8px;
+`;
+
 export const ColumnLine = styled.div`
   display: flex;
   flex-direction: column;

diff --git a/src/client/src/layouts/navigation/Navigation.tsx b/src/client/src/layouts/navigation/Navigation.tsx
@@ -200,6 +200,7 @@ export const Navigation = ({ isBurger, setOpen }: NavigationProps) => {
   const renderBurger = () => (
     <BurgerRow>
       {renderBurgerNav('Home', HOME, Home)}
+      {renderBurgerNav('Fedimints', FEDIMINTS, Sun)}
       {renderBurgerNav('Dashboard', DASHBOARD, Grid)}
       {renderBurgerNav('Peers', PEERS, Users)}
       {renderBurgerNav('Channels', CHANNEL, Cpu)}

diff --git a/src/client/src/layouts/navigation/nodeInfo/NodeInfo.tsx b/src/client/src/layouts/navigation/nodeInfo/NodeInfo.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Zap, Anchor, Circle } from 'react-feather';
+import { Zap, Link, Circle, Sun } from 'react-feather';
 import { Tooltip as ReactTooltip } from 'react-tooltip';
 import styled from 'styled-components';
 import { getPrice, Price } from '../../../components/price/Price';
@@ -16,6 +16,7 @@ import {
 } from '../../../components/generic/Styled';
 import { useConfigState } from '../../../context/ConfigContext';
 import { usePriceState } from '../../../context/PriceContext';
+import { useGatewayEcashTotal } from '../../../hooks/UseGatewayEcashTotal';
 
 const Closed = styled.div`
   display: flex;
@@ -46,8 +47,9 @@ const Info = styled.div`
 
 const Balance = styled.div`
   display: flex;
-  justify-content: center;
+  justify-content: space-between;
   align-items: center;
+  width: 100%;
   margin: 2px 0;
   padding: 0 5px;
   cursor: default;
@@ -80,6 +82,7 @@ export const NodeInfo = ({ isOpen, isBurger }: NodeInfoProps) => {
   } = useNodeInfo();
 
   const { onchain, lightning } = useNodeBalances();
+  const totalFedimintEcash = useGatewayEcashTotal();
 
   const { currency, displayValues } = useConfigState();
   const priceContext = usePriceState();
@@ -120,16 +123,17 @@ export const NodeInfo = ({ isOpen, isBurger }: NodeInfoProps) => {
             size={18}
             color={channelPending === 0 ? '#FFD300' : '#652EC7'}
             fill={channelPending === 0 ? '#FFD300' : '#652EC7'}
-          />
+          />{' '}
           <Price amount={totalLightning} />
         </SingleLine>
         <SingleLine>
-          <Anchor
-            size={18}
-            color={chainPending === 0 ? '#FFD300' : '#652EC7'}
-          />
+          <Link size={18} color={chainPending === 0 ? '#FFD300' : '#652EC7'} />
           <Price amount={totalChain} />
         </SingleLine>
+        <SingleLine>
+          <Sun size={18} color={chainPending === 0 ? '#FFD300' : '#652EC7'} />
+          <Price amount={totalFedimintEcash} />
+        </SingleLine>
       </>
     );
   }
@@ -156,7 +160,7 @@ export const NodeInfo = ({ isOpen, isBurger }: NodeInfoProps) => {
                 color={channelPending === 0 ? '#FFD300' : '#652EC7'}
               />
             </Margin>
-            <Anchor
+            <Link
               size={18}
               color={chainPending === 0 ? '#FFD300' : '#652EC7'}
             />
@@ -181,6 +185,9 @@ export const NodeInfo = ({ isOpen, isBurger }: NodeInfoProps) => {
           {renderLine('Closed Channels', closedChannelCount)}
           {renderLine('Peers', peersCount)}
         </ReactTooltip>
+        <ReactTooltip id={'full_fedimint_tip'} place={'right'}>
+          {renderLine('Fedimint Balance', totalFedimintEcash)}
+        </ReactTooltip>
       </>
     );
   }
@@ -198,9 +205,13 @@ export const NodeInfo = ({ isOpen, isBurger }: NodeInfoProps) => {
         <Price amount={totalLightning} />
       </Balance>
       <Balance data-tip data-for="chain_balance_tip">
-        <Anchor size={18} color={chainPending === 0 ? '#FFD300' : '#652EC7'} />
+        <Link size={18} color={chainPending === 0 ? '#FFD300' : '#652EC7'} />
         <Price amount={totalChain} />
       </Balance>
+      <Balance data-tip data-for="full_fedimint_tip">
+        <Sun size={18} color={chainPending === 0 ? '#FFD300' : '#652EC7'} />
+        <Price amount={totalFedimintEcash} />
+      </Balance>
       <Balance
         data-tip
         data-for="node_tip"

diff --git a/src/client/src/styles/Themes.ts b/src/client/src/styles/Themes.ts
@@ -43,9 +43,11 @@ export const fontColors = {
 
 export const mediaDimensions = {
   mobile: 700,
+  modifiedMobile: 950,
 };
 export const mediaWidths = {
   mobile: `max-width: ${mediaDimensions.mobile}px`,
+  modifiedMobile: `max-width: ${mediaDimensions.modifiedMobile}px`,
 };
 
 // ---------------------------------------

diff --git a/src/client/src/utils/helpers.tsx b/src/client/src/utils/helpers.tsx
@@ -1,5 +1,5 @@
 import numeral from 'numeral';
-import { SatoshiSymbol } from '../components/satoshi/Satoshi';
+// import { SatoshiSymbol } from '../components/satoshi/Satoshi';
 import { unSelectedNavButton } from '../styles/Themes';
 import styled from 'styled-components';
 
@@ -87,8 +87,7 @@ export const getValue = ({
 
     return (
       <>
-        {breakAmount}
-        <SatoshiSymbol color={'grey'} transform={'translate(0,2)'} />
+        {breakAmount} {'sats'}
       </>
     );
   }

diff --git a/src/client/src/views/dashboard/widgets/lightning/balances.tsx b/src/client/src/views/dashboard/widgets/lightning/balances.tsx
@@ -3,6 +3,7 @@ import { useNodeBalances } from '../../../../hooks/UseNodeBalances';
 import { unSelectedNavButton } from '../../../../styles/Themes';
 import styled from 'styled-components';
 import Big from 'big.js';
+import { useGatewayEcashTotal } from '../../../../hooks/UseGatewayEcashTotal';
 
 const S = {
   wrapper: styled.div`
@@ -82,3 +83,16 @@ export const ChainBalance = () => {
     </S.wrapper>
   );
 };
+
+export const FedimintBalance = () => {
+  const totalFedimintEcash = useGatewayEcashTotal();
+
+  return (
+    <S.wrapper>
+      <S.pending>Fedimint Balance</S.pending>
+      <S.smallTotal>
+        <Price amount={totalFedimintEcash} />
+      </S.smallTotal>
+    </S.wrapper>
+  );
+};
diff --git a/src/client/src/views/dashboard/widgets/widgetList.tsx b/src/client/src/views/dashboard/widgets/widgetList.tsx
@@ -3,6 +3,7 @@ import { MempoolWidget } from './external/mempool';
 import {
   ChainBalance,
   ChannelBalance,
+  FedimintBalance,
   TotalBalance,
 } from './lightning/balances';
 import { ChannelListWidget } from './lightning/channels';
@@ -111,6 +112,14 @@ export const widgetList: WidgetProps[] = [
     component: ChainBalance,
     default: { ...defaultProps, w: 2, h: 3 },
   },
+  {
+    id: 6,
+    name: 'Fedimint Balance',
+    group: 'Lightning',
+    subgroup: 'Info',
+    component: FedimintBalance,
+    default: { ...defaultProps, w: 2, h: 3 },
+  },
   {
     id: 7,
     name: 'Alias',

diff --git a/src/client/src/views/home/account/AccountButtons.tsx b/src/client/src/views/home/account/AccountButtons.tsx
@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { Anchor, X, Zap, Sun } from 'react-feather';
+import { Link, X, Zap, Sun } from 'react-feather';
 import { ColorButton } from '../../../components/buttons/colorButton/ColorButton';
 import { Card } from '../../../components/generic/Styled';
 import { mediaWidths } from '../../../styles/Themes';
@@ -20,7 +20,7 @@ const S = {
     grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
     margin-bottom: 32px;
 
-    @media (${mediaWidths.mobile}) {
+    @media (${mediaWidths.modifiedMobile}) {
       grid-template-columns: 1fr 1fr;
     }
   `,
@@ -84,7 +84,7 @@ export const AccountButtons = () => {
           {state === 'send_chain' ? (
             <X size={18} color={SECTION_COLOR} />
           ) : (
-            <Anchor size={18} color={SECTION_COLOR} />
+            <Link size={18} color={SECTION_COLOR} />
           )}
           Send
         </ColorButton>
@@ -97,7 +97,7 @@ export const AccountButtons = () => {
           {state === 'receive_chain' ? (
             <X size={18} color={SECTION_COLOR} />
           ) : (
-            <Anchor size={18} color={SECTION_COLOR} />
+            <Link size={18} color={SECTION_COLOR} />
           )}
           Receive
         </ColorButton>