Start fixing TypeScript issues

package.json

@@ -142,6 +142,7 @@
     "@testing-library/react": "^13.2.0",
     "@types/amplitude-js": "^8.0.2",
     "@types/dockerode": "^3.3.9",
+    "@types/dompurify": "^2.3.3",
     "@types/enzyme": "^3.10.10",
     "@types/history": "^5.0.0",
     "@types/logfmt": "^1.2.2",

src/main/transactionLogs.ts

@@ -1,6 +1,6 @@
 import * as sol from '@solana/web3.js';
 import Electron from 'electron';
-import { LogSubscriptionMap } from '@/types/types';
+import { LogSubscriptionMap } from '../types/types';
 import { netToURL } from '../common/strings';
 
 const logSubscriptions: LogSubscriptionMap = {};

src/renderer/common/analytics.ts

@@ -1,6 +1,6 @@
 import amplitude from 'amplitude-js';
-import { logger } from '@/common/globals';
-import store from '@/store';
+import { logger } from './globals';
+import store from '../store';
 import { ConfigKey } from '../data/Config/configState';
 
 const AMPLITUDE_KEY = 'f1cde3642f7e0f483afbb7ac15ae8277';

src/renderer/components/AccountView.tsx

@@ -1,6 +1,6 @@
 import { faTerminal } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import ButtonToolbar from 'react-bootstrap/ButtonToolbar';
 import Container from 'react-bootstrap/Container';
 import { Button } from 'react-bootstrap';

src/renderer/components/LogView.tsx

@@ -1,6 +1,6 @@
 import * as sol from '@solana/web3.js';
 import { useEffect, useState } from 'react';
-import { logger } from '@/common/globals';
+import { logger } from '../common/globals';
 import {
   NetStatus,
   netToURL,

src/renderer/components/MintInfoView.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import * as sol from '@solana/web3.js';
 
 import Accordion from 'react-bootstrap/esm/Accordion';

src/renderer/components/ProgramChange.tsx

@@ -1,5 +1,5 @@
-import React, { useCallback, useEffect, useState } from 'react';
-import { setSelected } from '@/data/SelectedAccountsList/selectedAccountsState';
+import { useCallback, useEffect, useState } from 'react';
+import { setSelected } from '../data/SelectedAccountsList/selectedAccountsState';
 import { AccountInfo } from '../data/accounts/accountInfo';
 import { useAccountMeta } from '../data/accounts/accountState';
 import {

src/renderer/components/ProgramChangeView.tsx

@@ -9,8 +9,8 @@ import {
   accountsActions,
   selectAccountsListState,
   setSelected,
-} from '@/data/SelectedAccountsList/selectedAccountsState';
-import { logger } from '@/common/globals';
+} from '../data/SelectedAccountsList/selectedAccountsState';
+import { logger } from '../common/globals';
 import createNewAccount from '../data/accounts/account';
 import { AccountInfo } from '../data/accounts/accountInfo';
 import {

src/renderer/components/tokens/CreateNewMintButton.tsx

@@ -3,15 +3,14 @@ import * as sol from '@solana/web3.js';
 
 import * as walletAdapter from '@solana/wallet-adapter-react';
 import { Button } from 'react-bootstrap';
-import React from 'react';
 import * as walletWeb3 from '../../wallet-adapter/web3';
 
-import { logger } from '@/common/globals';
-import { useAppSelector } from '@/hooks';
+import { logger } from '../../common/globals';
+import { useAppSelector } from '../../hooks';
 import {
   NetStatus,
   selectValidatorNetworkState,
-} from '@/data/ValidatorNetwork/validatorNetworkState';
+} from '../../data/ValidatorNetwork/validatorNetworkState';
 
 async function createNewMint(
   connection: sol.Connection,

src/renderer/components/tokens/MetaplexMintMetaDataView.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import * as sol from '@solana/web3.js';
 import * as metaplex from '@metaplex/js';
 

src/renderer/components/tokens/MetaplexTokenData.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import OverlayTrigger from 'react-bootstrap/OverlayTrigger';
 import Popover from 'react-bootstrap/Popover';
 import Button from 'react-bootstrap/Button';

src/renderer/components/tokens/MintTokenToButton.tsx

@@ -3,7 +3,6 @@ import * as sol from '@solana/web3.js';
 
 import * as walletAdapter from '@solana/wallet-adapter-react';
 import { Button } from 'react-bootstrap';
-import React from 'react';
 import { useQueryClient } from 'react-query';
 import * as walletWeb3 from '../../wallet-adapter/web3';
 

src/renderer/components/tokens/TokensListView.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { Card, Accordion, Table } from 'react-bootstrap';
 import * as sol from '@solana/web3.js';
 import { useConnection, useWallet } from '@solana/wallet-adapter-react';

src/renderer/components/tokens/TransferTokenButton.tsx

@@ -10,15 +10,15 @@ import {
   Popover,
   Row,
 } from 'react-bootstrap';
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import * as walletWeb3 from '../../wallet-adapter/web3';
 
-import { logger } from '@/common/globals';
-import { useAppSelector } from '@/hooks';
+import { logger } from '../../common/globals';
+import { useAppSelector } from '../../hooks';
 import {
   NetStatus,
   selectValidatorNetworkState,
-} from '@/data/ValidatorNetwork/validatorNetworkState';
+} from '../../data/ValidatorNetwork/validatorNetworkState';
 import { ensureAtaFor } from './CreateNewMintButton';
 
 async function transferTokenToReceiver(
@@ -27,7 +27,7 @@ async function transferTokenToReceiver(
   mintKey: sol.PublicKey,
   transferFrom: sol.PublicKey,
   transferTo: sol.PublicKey,
-  tokenCount: int
+  tokenCount: number
 ) {
   if (!transferTo) {
     logger.info('no transferTo', transferTo);
@@ -90,7 +90,7 @@ function TransferTokenPopover(props: {
 }) {
   const { connection, fromKey, mintKey, transferFrom } = props;
 
-  let pubKeyVal;
+  let pubKeyVal = '';
   if (!pubKeyVal) {
     pubKeyVal = 'paste';
   }
@@ -189,7 +189,7 @@ function TransferTokenPopover(props: {
                       new sol.PublicKey(mintKey),
                       new sol.PublicKey(transferFrom),
                       new sol.PublicKey(toKey),
-                      tokenCount
+                      parseInt(tokenCount, 10)
                     ),
                     {
                       pending: 'Transfer submitted',

src/renderer/data/Config/configState.ts

@@ -1,7 +1,7 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import { useEffect } from 'react';
-import { ConfigMap } from '@/../types/types';
-import { logger } from '@/common/globals';
+import { ConfigMap } from '../../../types/types';
+import { logger } from '../../common/globals';
 import { useAppDispatch, useAppSelector } from '../../hooks';
 // https://redux.js.org/usage/usage-with-typescript#define-slice-state-and-action-types
 // eslint-disable-next-line import/no-cycle

src/renderer/data/ValidatorNetwork/ValidatorNetwork.tsx

@@ -2,7 +2,7 @@ import * as sol from '@solana/web3.js';
 import { useEffect } from 'react';
 import Dropdown from 'react-bootstrap/Dropdown';
 import DropdownButton from 'react-bootstrap/DropdownButton';
-import { logger } from '@/common/globals';
+import { logger } from '../../common/globals';
 import { useAppDispatch, useAppSelector, useInterval } from '../../hooks';
 import {
   Net,

src/renderer/data/accounts/account.ts

@@ -1,7 +1,7 @@
 import { AnyAction, Dispatch, ThunkDispatch } from '@reduxjs/toolkit';
 import { WalletContextState } from '@solana/wallet-adapter-react';
 import * as sol from '@solana/web3.js';
-import { logger } from '@/common/globals';
+import { logger } from '../../common/globals';
 import { NewKeyPairInfo } from '../../../types/types';
 import { ConfigState, setConfigValue } from '../Config/configState';
 import { SelectedAccountsList } from '../SelectedAccountsList/selectedAccountsState';

src/renderer/data/accounts/accountInfo.ts

@@ -17,4 +17,5 @@ export interface AccountInfo {
   count: number; // count tracks how often this account has been seen
   solDelta: number; // difference between last change amount and this one
   maxDelta: number; // maxDelta represents the max change in SOL seen during session
+  programID: string;
 }

src/renderer/data/accounts/accountState.ts

@@ -1,7 +1,7 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import * as sol from '@solana/web3.js';
 import { useEffect } from 'react';
-import { logger } from '@/common/globals';
+import { logger } from '../../common/globals';
 import { useAppDispatch, useAppSelector } from '../../hooks';
 // https://redux.js.org/usage/usage-with-typescript#define-slice-state-and-action-types
 // eslint-disable-next-line import/no-cycle

src/renderer/data/accounts/programChanges.ts

@@ -1,5 +1,5 @@
 import * as sol from '@solana/web3.js';
-import { logger } from '@/common/globals';
+import { logger } from '../../common/globals';
 import { Net, netToURL } from '../ValidatorNetwork/validatorNetworkState';
 import { AccountInfo } from './accountInfo';
 import { peekAccount, updateCache } from './getAccount';

src/renderer/index.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { createRoot } from 'react-dom/client';
 import { Provider } from 'react-redux';
 import { HashRouter } from 'react-router-dom';

src/renderer/nav/TokenPage.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import Split from 'react-split';
 
 import Stack from 'react-bootstrap/Stack';

src/renderer/nav/Validator.tsx

@@ -21,7 +21,7 @@ import {
   selectValidatorNetworkState,
 } from '../data/ValidatorNetwork/validatorNetworkState';
 import { useAppSelector, useInterval } from '../hooks';
-import { logger } from '@/common/globals';
+import { logger } from '../common/globals';
 
 const ipcDockerToast = (dockerIPCMethod: string) => {
   return toast.promise(window.promiseIpc.send(`DOCKER-${dockerIPCMethod}`), {
@@ -38,7 +38,7 @@ const Validator = () => {
   const filterRef = useRef<HTMLInputElement>({} as HTMLInputElement);
   const validator = useAppSelector(selectValidatorNetworkState);
   const validatorImageName = 'cryptoworkbench/solana-amman';
-  const [validatorImageTag, setValidatorImageTag] = useState<string>('');
+  const [validatorImageTag, setValidatorImageTag] = useState<string | null>('');
   // const [validatorImageTags, setValidatorImageTags] = useState<string[]>([]);
   const [containerInspect, setContainerInspect] = useState<any>({});
 
@@ -135,7 +135,7 @@ const Validator = () => {
               validatorImageTag !== '' ? validatorImageTag : 'Docker image'
             }
             disabled={containerInspect?.State}
-            onSelect={(image: string) => {
+            onSelect={(image: string | null) => {
               logger.info(`selected image: ${image}`);
               setValidatorImageTag(image);
             }}

src/renderer/nav/ValidatorNetworkInfo.tsx

@@ -3,7 +3,7 @@ import { useEffect, useState } from 'react';
 import { Col, Row } from 'react-bootstrap';
 import Container from 'react-bootstrap/Container';
 import { VictoryPie } from 'victory';
-import { logger } from '@/common/globals';
+import { logger } from '../common/globals';
 import {
   netToURL,
   selectValidatorNetworkState,