minor UI fixes

src/common/KeyManager.spec.ts

@@ -3,13 +3,13 @@ import { KeyManager } from "./KeyManager";
 describe("KeyManager", () => {
   it("works", () => {
     const km = KeyManager.recover('');
-    expect(km.hdPubKeys[0].index()).toEqual(0);
+    expect(km.hdPubKeys[0].index).toEqual(0);
 
     km.generateNewKey();
-    expect(km.hdPubKeys[1].index()).toEqual(1);
+    expect(km.hdPubKeys[1].index).toEqual(1);
 
     km.generateNewKey(true);
-    expect(km.hdPubKeys.map((value) => value.index())).toEqual([
+    expect(km.hdPubKeys.map((value) => value.index)).toEqual([
       0,  1,  2,  3,  4,  5,  6,  7, 8,  9, 10, 11, 12, 13, 14, 15,
       16, 17, 18, 19, 20, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 21
     ]);

src/common/KeyManager.ts

@@ -10,38 +10,40 @@ export enum KeyState {
 }
 
 class HdPubKey {
-  private bip32: BIP32Interface;
   public hdPath: string;
   public address: string;
   public state: KeyState;
 
+  private readonly publicKey: Buffer;
+  private readonly secretKey?: Buffer;
+  public index: number;
+
   /** Internal means it is for change only. */
   public internal: boolean;
 
   constructor(bip32: BIP32Interface, fullHdPath: string) {
     const pathIndices = parse_hd_path(fullHdPath);
     this.internal = pathIndices[3] > 0;
 
-    this.bip32 = bip32;
+    this.publicKey = Buffer.from(bip32.publicKey);
+    this.secretKey = bip32.privateKey ? Buffer.from(bip32.privateKey) : null;
+    this.index = bip32.index;
+
     this.hdPath = fullHdPath;
-    this.address = Address.from_public_key(this.bip32.publicKey).get_addr();
+    this.address = Address.from_public_key(this.publicKey).get_addr();
     this.state = KeyState.Clean;
   }
 
   public setState(state: KeyState): void {
     this.state = state;
   }
 
-  public index(): number {
-    return this.bip32.index;
-  }
-
   public pubKey(): Buffer {
-    return this.bip32.publicKey;
+    return this.publicKey;
   }
 
   public privateKey(): Buffer {
-    return this.bip32.privateKey;
+    return this.secretKey;
   }
 
 }
@@ -55,9 +57,11 @@ export class KeyManager {
   hdPubKeys: Array<HdPubKey> = [];
 
   static recover(mnemonic: string): KeyManager {
-    const seed = bip39.mnemonicToSeedSync(mnemonic);
+    const seed: Buffer = bip39.mnemonicToSeedSync(mnemonic);
+
     const masterKey = bip32.fromSeed(seed);
     const accountExtKey = masterKey.derivePath(KeyManager.AccountDerivationPath);
+
     const km = new KeyManager(accountExtKey);
 
     km.assertCleanKeys();
@@ -129,8 +133,8 @@ export class KeyManager {
   private maxKeyIndex(keys: HdPubKey[]): number {
     let max = 0;
     keys.forEach((key: HdPubKey) => {
-      if (key.index() > max) {
-        max = key.index();
+      if (key.index > max) {
+        max = key.index;
       }
     });
     return max;

src/main/application/services/wallet/TransactionMonitor.ts

@@ -1,18 +1,20 @@
 import {SchedulerService} from "../../../../common/SchedulerService";
 import {Connector} from "../../../ergoplatform/connector/Connector";
 import {Wallet} from "./Wallet";
+import {EventEmitter} from "events";
 
-export class TransactionMonitor {
+export class TransactionMonitor extends EventEmitter {
   private schedulerService: SchedulerService;
   private connector: Connector;
   private wallet: Wallet;
 
   constructor(connector: Connector, wallet: Wallet) {
+    super();
     this.connector = connector;
     this.wallet = wallet;
     this.schedulerService = new SchedulerService(() => {
       this.loadTransactions();
-    }, 10000);
+    }, 30000);
   }
 
 
@@ -29,7 +31,7 @@ export class TransactionMonitor {
 
 
   private async loadTransactions(): Promise<void> {
-
+    this.emit('LoadingStarted');
     for (const addr of this.wallet.getAddresses()) {
       try {
         const result = await this.connector.getAddressSummary(addr.address);
@@ -57,6 +59,7 @@ export class TransactionMonitor {
         console.error(e);
       }
     }
+    this.emit('LoadingFinished');
   }
 
   private async loadAll(totalCount: number, address: string): Promise<Array<any>> {

src/main/application/services/wallet/WalletImpl.ts

@@ -31,6 +31,12 @@ export class WalletImpl extends EventEmitter implements Wallet {
     this.connector = connector;
     this.unspentMonitor = new UnspentMonitor(this, connector);
     this.transMonitor = new TransactionMonitor(connector, this);
+    this.transMonitor.on('LoadingStarted', ()  => {
+      console.debug('transMonitor.LoadingStarted');
+    });
+    this.transMonitor.on('LoadingFinished', () => {
+      console.debug('transMonitor.LoadingFinished');
+    });
 
     this.unspentMonitor.start();
     this.transMonitor.start();
@@ -165,17 +171,16 @@ export class WalletImpl extends EventEmitter implements Wallet {
         }
       });
 
+      const walletInputs = tx.inputs.filter((i) => this.keyManager3.getKey(i.address) !== undefined);
+      const walletOutputs = tx.outputs.filter((i) => this.keyManager3.getKey(i.address) !== undefined);
+
       // calculate tx value regarding our wallet
-      const received = tx.outputs
-        .filter((i) => this.keyManager3.getKey(i.address) !== undefined)
-        .reduce(
+      const received = walletOutputs.reduce(
           (total: MoneyUnits, item: any) => total.plus(new MoneyUnits(item.value, 9)),
           new MoneyUnits(0, 9)
         );
 
-      const spent = tx.inputs
-        .filter((i) => this.keyManager3.getKey(i.address) !== undefined)
-        .reduce(
+      const spent = walletInputs.reduce(
           (total: MoneyUnits, item: any) => total.plus(new MoneyUnits(item.value, 9)),
           new MoneyUnits(0, 9)
         );

src/main/ergoplatform/connector/providers/explorer/responses.ts

@@ -13,6 +13,7 @@ export interface AddressSummaryResponse {
 export interface TransItem {
   id: string;
   headerId: string;
+  inclusionHeight: number;
   timestamp?: number; // for confirmed
   creationTimestamp?: number; // for unconfirmed
   confirmationsCount: number;

src/main/ergoplatform/connector/types.ts

@@ -44,6 +44,7 @@ export interface AddressSummary {
 export interface Transaction {
   id: string;
   timestamp: bigint;
+  inclusionHeight: number;
   size: number;
   confirmationsCount: number;
   inputs: Array<Input>;

src/renderer/modules/app/App.tsx

@@ -14,7 +14,6 @@ import {useDispatch, useSelector} from "react-redux";
 import {RootState} from "../../store/root-reducer";
 import Loading from "./Loading";
 import Terms from "./Terms";
-import {fetchAppSettings} from "./app-slice";
 
 let source = createMemorySource("/")
 let history = createHistory(source)
@@ -119,7 +118,6 @@ const App = (props: any) => {
               <div>This is TECH PREVIEW release. Current limitations:</div>
               <ul>
                 <li>Imported or Created wallets stored UNENCRYPTED in MEMORY during application launch</li>
-                <li>Only ERG transactions supported</li>
                 <li>PASSWORD means NOTHING yet</li>
               </ul>
             </Alert>

src/renderer/modules/wallet/Transactions/TransactionList.tsx

@@ -30,8 +30,12 @@ function Row(props: { tx: any; onDetailsClick: (tx: any) => void }): React.React
       <HourglassEmptyOutlinedIcon fontSize="small" color="secondary"/>
     );
 
+  const handleRowClick = () => {
+    console.log('Row Click');
+  };
+
   return (
-    <Box display="flex" alignItems="center">
+    <Box display="flex" alignItems="center" onClick={handleRowClick}>
       <Box flexBasis={0} flexGrow={1} maxWidth={"100px"} minWidth={"100px"}>
         {extractTime(Number(tx.timestamp || tx.creationTimestamp))}
       </Box>

src/renderer/modules/wallet/Transactions/TxDetailsDialog.tsx

@@ -7,6 +7,8 @@ import AssetValue from "../../../components/AssetValue";
 import Hex from "../../../components/Hex";
 import TokensValues from "../TokensValues";
 import {WalletTx} from "../../../../common/backend-types";
+import {Input} from "../../../../main/ergoplatform/connector/types";
+import {WalletBox} from "../../../../main/application/services/wallet/Wallet";
 
 interface TxDetailsProps {
   open: boolean;
@@ -54,6 +56,14 @@ function TxDetailsDialog(props: TxDetailsProps): React.ReactElement {
             <Hex>{tx.id}</Hex>
           </Grid>
         </Grid>
+        <Grid container spacing={1}>
+          <Grid item>
+            Block
+          </Grid>
+          <Grid item>
+            {tx.inclusionHeight}
+          </Grid>
+        </Grid>
         <Grid container spacing={1}>
           <Grid item>
             Confirmations
@@ -83,13 +93,13 @@ function TxDetailsDialog(props: TxDetailsProps): React.ReactElement {
 
             <Grid container direction={'column'}>
               {
-                tx.inputs.map((i: any) => (
+                tx.inputs.map((i: Input) => (
                   <Box key={i.id} display="flex">
                     <Box flexBasis={0} flexGrow={2}>
                       {(i.address.length > 60) ? (
-                        <Address shortened={true} value={i.address} type={i.addressType}/>
+                        <Address shortened={true} value={i.address} />
                       ) : (
-                        <Address shortened={false} value={i.address} type={i.addressType}/>
+                        <Address shortened={false} value={i.address} />
                       )}
                     </Box>
                     <Box
@@ -99,8 +109,8 @@ function TxDetailsDialog(props: TxDetailsProps): React.ReactElement {
                       justifyContent="flex-end"
                       alignItems="center"
                     >
-                      <TokensValues assets={i.assets} />
-                      <AssetValue amount={i.value} decimals={9} symbol="ERG"/>
+                      {/*<TokensValues assets={i.assets} />*/}
+                      <AssetValue amount={i.value.toString()} decimals={9} symbol="ERG"/>
                     </Box>
                   </Box>
                 ))
@@ -119,8 +129,8 @@ function TxDetailsDialog(props: TxDetailsProps): React.ReactElement {
           <Grid item>
             <Grid container direction="column">
               {
-                tx.outputs.map((i: any) => (
-                  <Box key={i.id} display="flex">
+                tx.outputs.map((i: WalletBox) => (
+                  <Box key={i.boxId} display="flex">
                       <Box flexBasis={0} flexGrow={2}>
                         {(i.address.length > 60) ? (
                           <Address shortened={true} value={i.address} type={i.addressType} />

src/renderer/modules/wallet/transfer/ConfirmationStep.tsx

@@ -3,6 +3,8 @@ import {Box, Button, Link} from "@material-ui/core";
 import Address from "../../../components/Address";
 import AssetValue from '../../../components/AssetValue';
 import TokensValues from "../TokensValues";
+import KeyboardArrowUpIcon from "@material-ui/icons/KeyboardArrowUp";
+import KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown";
 
 interface ConfirmProps {
   tx: any;
@@ -43,7 +45,7 @@ function ConfirmationStep(props: ConfirmProps): React.ReactElement {
       <Box mt={2} display="flex">
         <Box flexBasis={0} flexGrow={1}>Fee</Box>
         <Box flexBasis={0} flexGrow={1} display="flex" justifyContent="flex-end">
-          <AssetValue amount={tx.fee} decimals={9}/>
+          <AssetValue amount={tx.fee} decimals={9} symbol="ERG" />
         </Box>
       </Box>
       <Box mt={2}>
@@ -52,11 +54,12 @@ function ConfirmationStep(props: ConfirmProps): React.ReactElement {
           variant="body2"
           onClick={handleJsonClick}
         >
-          View JSON
+          {showJson ? "Hide JSON" : "View JSON"}
+          {showJson ? (<KeyboardArrowUpIcon />) : (<KeyboardArrowDownIcon />)}
         </Link>
       </Box>
       {showJson && (
-          <Box component={"pre"} overflow={"auto"} border={1} borderColor={"grey.200"}>
+          <Box component="pre" overflow={"auto"} border={1} borderColor={"grey.200"}>
             {JSON.stringify(tx.ergoTx, null, 2)}
           </Box>
       )}
@@ -66,10 +69,10 @@ function ConfirmationStep(props: ConfirmProps): React.ReactElement {
       <Box mt={2}>
         <Button
           variant="contained"
-          color={'secondary'}
+          color="secondary"
           onClick={handleSendClick}
         >
-          Send
+          Sign and Send
         </Button>
       </Box>
     </Box>