display user message when wallet is not connected

fix linting

explorer/src/components/Delegations/components/DelegateModal.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { Box, SxProps, TextField } from '@mui/material';
+import { Box, SxProps } from '@mui/material';
 import { IdentityKeyFormField } from '@nymproject/react/mixnodes/IdentityKeyFormField';
 import { CurrencyFormField } from '@nymproject/react/currency/CurrencyFormField';
 import { CurrencyDenom, DecCoin } from '@nymproject/types';
@@ -79,8 +79,16 @@ export const DelegateModal: FCWithChildren<{
     setValidated(newValidatedValue);
   };
 
-  const delegateToMixnode = async ({ mixId, address, amount }: { mixId: number; address: string; amount: string }) => {
-    const amountToDelegate = (Number(amount) * 1000000).toString();
+  const delegateToMixnode = async ({
+    delegationMixId,
+    delgationAddress,
+    delegationAmount,
+  }: {
+    delegationMixId: number;
+    delgationAddress: string;
+    delegationAmount: string;
+  }) => {
+    const amountToDelegate = (Number(delegationAmount) * 1000000).toString();
     const uNymFunds = [{ amount: amountToDelegate, denom: 'unym' }];
     const memo: string = 'test delegation';
     const fee = { gas: '1000000', amount: [{ amount: '1000000', denom: 'unym' }] };
@@ -88,11 +96,11 @@ export const DelegateModal: FCWithChildren<{
     try {
       const signerClient = await getSigningCosmWasmClient();
       const tx = await signerClient.execute(
-        address,
+        delgationAddress,
         MIXNET_CONTRACT_ADDRESS,
         {
           delegate_to_mixnode: {
-            mix_id: mixId,
+            mix_id: delegationMixId,
           },
         },
         fee,
@@ -116,7 +124,11 @@ export const DelegateModal: FCWithChildren<{
           throw new Error('Please connect your wallet');
         }
 
-        const tx = await delegateToMixnode({ mixId, address, amount: amount.amount });
+        const tx = await delegateToMixnode({
+          delegationMixId: mixId,
+          delgationAddress: address,
+          delegationAmount: amount.amount,
+        });
 
         onOk({
           status: 'success',

explorer/src/components/Delegations/components/DelegationModal.tsx

@@ -6,7 +6,7 @@ import { ConfirmationModal } from './ConfirmationModal';
 import { ErrorModal } from './ErrorModal';
 
 export type DelegationModalProps = {
-  status: 'loading' | 'success' | 'error';
+  status: 'loading' | 'success' | 'error' | 'info';
   message?: string;
   transactions?: {
     url: string;
@@ -33,6 +33,14 @@ export const DelegationModal: FCWithChildren<
     );
   }
 
+  if (status === 'info') {
+    return (
+      <ConfirmationModal open={open} title="Connect wallet" confirmButton="OK" onConfirm={onClose}>
+        <Typography>{message}</Typography>
+      </ConfirmationModal>
+    );
+  }
+
   return (
     <ConfirmationModal open={open} onConfirm={onClose || (() => {})} title="Delegation successful" confirmButton="Done">
       <Stack alignItems="center" spacing={2} mb={0}>

explorer/src/components/Nav.tsx

@@ -21,7 +21,6 @@ import { NYM_WEBSITE } from '../api/constants';
 import { useMainContext } from '../context/main';
 import { MobileDrawerClose } from '../icons/MobileDrawerClose';
 import { Footer } from './Footer';
-import { NymVpnIcon } from '../icons/NymVpn';
 import { DarkLightSwitchDesktop } from './Switch';
 import { NavOptionType } from '../context/nav';
 import { ConnectKeplrWallet } from './ConnectKeplrWallet';

explorer/src/components/TableToolbar.tsx

@@ -1,5 +1,5 @@
-import React, { FC, useContext, useEffect, useState, useMemo } from 'react';
-import { Box, TextField, MenuItem, FormControl, Button } from '@mui/material';
+import React from 'react';
+import { Box, TextField, MenuItem, FormControl } from '@mui/material';
 import Select, { SelectChangeEvent } from '@mui/material/Select';
 import { Filters } from './Filters/Filters';
 import { useIsMobile } from '../hooks/useIsMobile';

explorer/src/icons/TokenSVG.tsx

@@ -1,8 +1,6 @@
 import * as React from 'react';
-import { useTheme } from '@mui/material/styles';
 
 export const TokenSVG: FCWithChildren = () => {
-  const theme = useTheme();
   const color = 'white';
 
   return (

explorer/src/pages/Mixnodes/index.tsx

@@ -111,7 +111,14 @@ export const PageMixnodes: FCWithChildren = () => {
       renderCell: (params: GridRenderCellParams) => (
         <DelegateIconButton
           onDelegate={() => {
-            setItemSelectedForDelegation({ identityKey: params.row.identity_key, mixId: params.row.mix_id });
+            if (wallet.status !== 'Connected') {
+              setConfirmationModalProps({
+                status: 'info',
+                message: 'Please connect your wallet to delegate',
+              });
+            } else {
+              setItemSelectedForDelegation({ identityKey: params.row.identity_key, mixId: params.row.mix_id });
+            }
           }}
         />
       ),