diff --git a/web/cashtab/src/components/Configure/Configure.js b/web/cashtab/src/components/Configure/Configure.js
index 4ca88fd51..f5e00472d 100644
--- a/web/cashtab/src/components/Configure/Configure.js
+++ b/web/cashtab/src/components/Configure/Configure.js
@@ -1,1276 +1,1293 @@
 import React, { useState, useEffect } from 'react';
 import styled from 'styled-components';
 import { useLocation, Link } from 'react-router-dom';
 import {
     generalNotification,
     errorNotification,
 } from 'components/Common/Notifications';
-import { Collapse, Form, Input, Modal, Alert, Switch, Tag } from 'antd';
+import {
+    Collapse,
+    Form,
+    Input,
+    Modal,
+    Alert,
+    Switch,
+    Tag,
+    Tooltip,
+} from 'antd';
 import { Row, Col } from 'antd';
 import {
     PlusSquareOutlined,
     WalletFilled,
     ImportOutlined,
     LockOutlined,
     CheckOutlined,
     CloseOutlined,
     LockFilled,
     ExclamationCircleFilled,
 } from '@ant-design/icons';
 import { WalletContext, AuthenticationContext } from 'utils/context';
 import { SidePaddingCtn } from 'components/Common/Atoms';
 import { StyledCollapse } from 'components/Common/StyledCollapse';
 import {
     AntdFormWrapper,
     CurrencySelectDropdown,
 } from 'components/Common/EnhancedInputs';
 import PrimaryButton, {
     SecondaryButton,
     SmartButton,
 } from 'components/Common/PrimaryButton';
 import {
     ThemedCopyOutlined,
     ThemedWalletOutlined,
     ThemedDollarOutlined,
     ThemedSettingOutlined,
     ThemedContactSendOutlined,
 } from 'components/Common/CustomIcons';
 import { ReactComponent as Trashcan } from 'assets/trashcan.svg';
 import { ReactComponent as Edit } from 'assets/edit.svg';
 import { Event } from 'utils/GoogleAnalytics';
 import ApiError from 'components/Common/ApiError';
 import { formatSavedBalance } from 'utils/formatting';
 
 const { Panel } = Collapse;
 
 const SettingsLink = styled.a`
     text-decoration: underline;
     color: ${props => props.theme.eCashBlue};
     :visited {
         text-decoration: underline;
         color: ${props => props.theme.eCashBlue};
     }
     :hover {
         color: ${props => props.theme.eCashPurple};
     }
 `;
 
 const SWRow = styled.div`
     border-radius: 3px;
     padding: 10px 0;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 6px;
     @media (max-width: 500px) {
         flex-direction: column;
         margin-bottom: 12px;
     }
 `;
 
 const SWName = styled.div`
     width: 50%;
     display: flex;
     align-items: center;
     justify-content: space-between;
     word-wrap: break-word;
     hyphens: auto;
 
     @media (max-width: 500px) {
         width: 100%;
         justify-content: center;
         margin-bottom: 15px;
     }
 
     h3 {
         font-size: 16px;
         color: ${props => props.theme.darkBlue};
         margin: 0;
         text-align: center;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
     }
     h3.overflow {
         width: 100px;
         overflow: hidden;
         text-overflow: ellipsis;
     }
-    h3.overflow:hover {
-        background-color: ${props => props.theme.settings.background};
-        overflow: visible;
-        inline-size: 100px;
-        white-space: normal;
-    }
 `;
 
 const SWBalance = styled.div`
     width: 50%;
     display: flex;
     align-items: center;
     justify-content: space-between;
     word-wrap: break-word;
     hyphens: auto;
     @media (max-width: 500px) {
         width: 100%;
         justify-content: center;
         margin-bottom: 15px;
     }
     div {
         font-size: 13px;
         color: ${props => props.theme.darkBlue};
         margin: 0;
         text-align: center;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
     }
     div.overflow {
         width: 150px;
         overflow: hidden;
         text-overflow: ellipsis;
     }
     div.overflow:hover {
         background-color: ${props => props.theme.settings.background};
-        overflow: visible;
         inline-size: 150px;
         white-space: normal;
     }
 `;
 
 const SWButtonCtn = styled.div`
     width: 50%;
     display: flex;
     align-items: center;
     justify-content: flex-end;
     @media (max-width: 500px) {
         width: 100%;
         justify-content: center;
     }
 
     button {
         cursor: pointer;
         background: transparent;
         border: 1px solid #fff;
         box-shadow: none;
         color: #fff;
         border-radius: 3px;
         opacity: 0.6;
         transition: all 200ms ease-in-out;
 
         :hover {
             opacity: 1;
             background: ${props => props.theme.eCashBlue};
             border-color: ${props => props.theme.eCashBlue};
         }
 
         @media (max-width: 768px) {
             font-size: 14px;
         }
     }
 
     svg {
         stroke: ${props => props.theme.eCashBlue};
         fill: ${props => props.theme.eCashBlue};
         width: 25px;
         height: 25px;
         margin-right: 20px;
         cursor: pointer;
 
         :first-child:hover {
             stroke: ${props => props.theme.eCashBlue};
             fill: ${props => props.theme.eCashBlue};
         }
         :hover {
             stroke: ${props => props.theme.settings.delete};
             fill: ${props => props.theme.settings.delete};
         }
     }
 `;
 
 const ContactListRow = styled.div`
     border-radius: 3px;
     padding: 10px 0;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 6px;
     @media (max-width: 500px) {
         flex-direction: column;
         margin-bottom: 12px;
     }
 `;
 
 const ContactListAddress = styled.div`
     width: 40%;
     display: flex;
     align-items: center;
     justify-content: space-between;
     word-wrap: break-word;
     hyphens: auto;
     @media (max-width: 500px) {
         width: 100%;
         justify-content: center;
         margin-bottom: 15px;
     }
     div {
         font-size: 13px;
         color: ${props => props.theme.darkBlue};
         margin: 12px;
         text-align: center;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
     }
     div.overflow {
         width: 150px;
         overflow: hidden;
         text-overflow: ellipsis;
     }
     div.overflow:hover {
         background-color: ${props => props.theme.settings.background};
-        overflow: visible;
-        inline-size: 150px;
-        white-space: normal;
     }
 `;
 
 const ContactListName = styled.div`
     width: 30%;
     display: flex;
     align-items: center;
     justify-content: space-between;
     word-wrap: break-word;
     hyphens: auto;
     @media (max-width: 500px) {
         width: 100%;
         justify-content: center;
         margin-bottom: 15px;
     }
     div {
         font-size: 13px;
         color: ${props => props.theme.darkBlue};
         margin: 0px;
         text-align: center;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
     }
     div.overflow {
         width: 150px;
         overflow: hidden;
         text-overflow: ellipsis;
     }
     div.overflow:hover {
         background-color: ${props => props.theme.settings.background};
-        overflow: visible;
         inline-size: 150px;
         white-space: normal;
     }
 `;
 
 const ContactListCtn = styled.div`
     display: flex;
     align-items: center;
     justify-content: flex-end;
     @media (max-width: 500px) {
         width: 100%;
         justify-content: center;
     }
 
     button {
         cursor: pointer;
         background: transparent;
         border: 1px solid #fff;
         box-shadow: none;
         color: #fff;
         border-radius: 3px;
         opacity: 0.6;
         transition: all 200ms ease-in-out;
 
         :hover {
             opacity: 1;
             background: ${props => props.theme.eCashBlue};
             border-color: ${props => props.theme.eCashBlue};
         }
 
         @media (max-width: 768px) {
             font-size: 14px;
         }
     }
 
     svg {
         stroke: ${props => props.theme.eCashBlue};
         fill: ${props => props.theme.eCashBlue};
         width: 25px;
         height: 25px;
         margin-right: 10px;
         cursor: pointer;
 
         :first-child:hover {
             stroke: ${props => props.theme.eCashBlue};
             fill: ${props => props.theme.eCashBlue};
         }
         :hover {
             stroke: ${props => props.theme.settings.delete};
             fill: ${props => props.theme.settings.delete};
         }
     }
 `;
 
 const AWRow = styled.div`
     padding: 10px 0;
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 6px;
     h3 {
         font-size: 16px;
         display: inline-block;
         color: ${props => props.theme.darkBlue};
         margin: 0;
         text-align: left;
         font-weight: bold;
         @media (max-width: 500px) {
             font-size: 14px;
         }
     }
     h4 {
         font-size: 16px;
         display: inline-block;
         color: ${props => props.theme.eCashBlue} !important;
         margin: 0;
         text-align: right;
     }
     @media (max-width: 500px) {
         flex-direction: column;
         margin-bottom: 12px;
     }
 `;
 
 const StyledConfigure = styled.div`
     h2 {
         color: ${props => props.theme.contrast};
         font-size: 25px;
     }
     svg {
         fill: ${props => props.theme.eCashBlue};
         
     }
     p {
         color: ${props => props.theme.darkBlue};
     }
     .ant-alert {
         color: ${props => props.theme.lightGrey}
         font-size: 14px;
     }
     .ant-collapse-header{
         .anticon{
             flex: 1;
         }
         .seedPhrase{ 
             flex: 2;
         }
     }
   
    
 `;
 
 const StyledSpacer = styled.div`
     height: 1px;
     width: 100%;
     background-color: ${props => props.theme.lightWhite};
     margin: 60px 0 50px;
 `;
 
 const GeneralSettingsItem = styled.div`
     display: flex;
     align-items: center;
     justify-content: space-between;
     .ant-switch svg {
         fill: #717171;
     }
     .title {
         color: ${props => props.theme.contrast};
     }
     .anticon {
         color: ${props => props.theme.contrast};
     }
     .ant-switch {
         background-color: #bdbdbd;
     }
     .ant-switch-checked {
         background-color: ${props => props.theme.eCashBlue};
         svg {
             fill: ${props => props.theme.contrast};
         }
     }
     .SendConfirm {
         color: ${props => props.theme.lightWhite};
     }
 `;
 
 const Configure = () => {
     const ContextValue = React.useContext(WalletContext);
     const authentication = React.useContext(AuthenticationContext);
     const { wallet, apiError } = ContextValue;
     const location = useLocation();
 
     const {
         addNewSavedWallet,
         activateWallet,
         renameWallet,
         deleteWallet,
         validateMnemonic,
         getSavedWallets,
         cashtabSettings,
         changeCashtabSettings,
         getContactListFromLocalForage,
         updateContactListInLocalForage,
     } = ContextValue;
     const [savedWallets, setSavedWallets] = useState([]);
     const [formData, setFormData] = useState({
         dirty: true,
         mnemonic: '',
     });
     const [showRenameWalletModal, setShowRenameWalletModal] = useState(false);
     const [showDeleteWalletModal, setShowDeleteWalletModal] = useState(false);
     const [walletToBeRenamed, setWalletToBeRenamed] = useState(null);
     const [walletToBeDeleted, setWalletToBeDeleted] = useState(null);
     const [newWalletName, setNewWalletName] = useState('');
     const [
         confirmationOfWalletToBeDeleted,
         setConfirmationOfWalletToBeDeleted,
     ] = useState('');
     const [newWalletNameIsValid, setNewWalletNameIsValid] = useState(null);
     const [walletDeleteValid, setWalletDeleteValid] = useState(null);
     const [seedInput, openSeedInput] = useState(false);
     const [showTranslationWarning, setShowTranslationWarning] = useState(false);
 
     const showPopulatedDeleteWalletModal = walletInfo => {
         setWalletToBeDeleted(walletInfo);
         setShowDeleteWalletModal(true);
     };
 
     const showPopulatedRenameWalletModal = walletInfo => {
         setWalletToBeRenamed(walletInfo);
         setShowRenameWalletModal(true);
     };
     const cancelRenameWallet = () => {
         // Delete form value
         setNewWalletName('');
         setShowRenameWalletModal(false);
     };
     const cancelDeleteWallet = () => {
         setWalletToBeDeleted(null);
         setConfirmationOfWalletToBeDeleted('');
         setShowDeleteWalletModal(false);
     };
     const updateSavedWallets = async activeWallet => {
         if (activeWallet) {
             let savedWallets;
             try {
                 savedWallets = await getSavedWallets(activeWallet);
                 setSavedWallets(savedWallets);
             } catch (err) {
                 console.log(`Error in getSavedWallets()`);
                 console.log(err);
             }
         }
     };
 
     const [isValidMnemonic, setIsValidMnemonic] = useState(null);
 
     const [contactListArray, setContactListArray] = useState([{}]);
 
     const [showRenameContactModal, setShowRenameContactModal] = useState(false);
     const [contactToBeRenamed, setContactToBeRenamed] = useState(null); //object
     const [newContactNameIsValid, setNewContactNameIsValid] = useState(null);
     const [
         confirmationOfContactToBeRenamed,
         setConfirmationOfContactToBeRenamed,
     ] = useState('');
 
     useEffect(() => {
         // Update savedWallets every time the active wallet changes
         updateSavedWallets(wallet);
     }, [wallet]);
 
     useEffect(async () => {
         const detectedBrowserLang = navigator.language;
         if (!detectedBrowserLang.includes('en-')) {
             setShowTranslationWarning(true);
         }
 
         // if this was routed from Home screen's Add to Contact link
         if (location && location.state && location.state.contactToAdd) {
             let tempContactListArray;
 
             try {
                 tempContactListArray = await getContactListFromLocalForage();
             } catch (err) {
                 console.log('Error in getContactListFromLocalForage()');
                 console.log(err);
             }
 
             // set default name for contact and sender as address
             let newContactObj = {
                 name: location.state.contactToAdd.substring(6, 11),
                 address: location.state.contactToAdd,
             };
 
             if (!tempContactListArray || tempContactListArray.length === 0) {
                 // no existing contact list in local storage
 
                 tempContactListArray = [{}]; // instantiates to mitigate null pointer issues
                 tempContactListArray.push(newContactObj);
                 tempContactListArray.shift(); // remove the initial entry from instantiation
                 generalNotification(
                     location.state.contactToAdd + ' added to Contact List',
                 );
             } else {
                 // contact list exists in local storage
 
                 // check if address already exists in contact list
                 let duplicateContact = false;
                 let tempContactListArrayLength = tempContactListArray.length;
                 for (let i = 0; i < tempContactListArrayLength; i++) {
                     if (
                         tempContactListArray[i].address ===
                         location.state.contactToAdd
                     ) {
                         generalNotification(
                             location.state.contactToAdd +
                                 ' already exists in the Contact List',
                         );
                         duplicateContact = true;
                         break;
                     }
                 }
                 // if address does not exist on the contact list, add it
                 if (!duplicateContact) {
                     tempContactListArray.push(newContactObj);
                     generalNotification(
                         location.state.contactToAdd + ' added to Contact List',
                     );
                 }
             }
 
             // update local storage
             let updateContactListStatus;
             try {
                 updateContactListStatus = await updateContactListInLocalForage(
                     tempContactListArray,
                 );
             } catch (err) {
                 console.log('Error in updateContactListInLocalForage()');
                 console.log(err);
             }
 
             if (!updateContactListStatus) {
                 errorNotification(
                     null,
                     'Error updating contact list in localforage',
                     'Updating localforage with contact list',
                 );
             }
 
             // commit to state for local operations
             setContactListArray(tempContactListArray);
         } else {
             // if this was just standard routing between cashtab components
             // i.e. Not via the Add to contacts action
 
             let loadContactListStatus;
             try {
                 loadContactListStatus = await getContactListFromLocalForage();
             } catch (err) {
                 console.log('Error in getContactListFromLocalForage()');
                 console.log(err);
             }
             setContactListArray(loadContactListStatus);
         }
     }, []);
 
     // Need this function to ensure that savedWallets are updated on new wallet creation
     const updateSavedWalletsOnCreate = async importMnemonic => {
         // Event("Category", "Action", "Label")
         // Track number of times a different wallet is activated
         Event('Configure.js', 'Create Wallet', 'New');
         const walletAdded = await addNewSavedWallet(importMnemonic);
         if (!walletAdded) {
             Modal.error({
                 title: 'This wallet already exists!',
                 content: 'Wallet not added',
             });
         } else {
             Modal.success({
                 content: 'Wallet added to your saved wallets',
             });
         }
         await updateSavedWallets(wallet);
     };
     // Same here
     // TODO you need to lock UI here until this is complete
     // Otherwise user may try to load an already-loading wallet, wreak havoc with indexedDB
     const updateSavedWalletsOnLoad = async walletToActivate => {
         // Event("Category", "Action", "Label")
         // Track number of times a different wallet is activated
         Event('Configure.js', 'Activate', '');
         await activateWallet(walletToActivate);
     };
 
     async function submit() {
         setFormData({
             ...formData,
             dirty: false,
         });
 
         // Exit if no user input
         if (!formData.mnemonic) {
             return;
         }
 
         // Exit if mnemonic is invalid
         if (!isValidMnemonic) {
             return;
         }
         // Event("Category", "Action", "Label")
         // Track number of times a different wallet is activated
         Event('Configure.js', 'Create Wallet', 'Imported');
         updateSavedWalletsOnCreate(formData.mnemonic);
     }
 
     const handleChange = e => {
         const { value, name } = e.target;
 
         // Validate mnemonic on change
         // Import button should be disabled unless mnemonic is valid
         setIsValidMnemonic(validateMnemonic(value));
 
         setFormData(p => ({ ...p, [name]: value }));
     };
 
     const changeWalletName = async () => {
         if (newWalletName === '' || newWalletName.length > 24) {
             setNewWalletNameIsValid(false);
             return;
         }
         // Hide modal
         setShowRenameWalletModal(false);
         // Change wallet name
         console.log(
             `Changing wallet ${walletToBeRenamed.name} name to ${newWalletName}`,
         );
         const renameSuccess = await renameWallet(
             walletToBeRenamed.name,
             newWalletName,
         );
 
         if (renameSuccess) {
             Modal.success({
                 content: `Wallet "${walletToBeRenamed.name}" renamed to "${newWalletName}"`,
             });
         } else {
             Modal.error({
                 content: `Rename failed. All wallets must have a unique name.`,
             });
         }
         await updateSavedWallets(wallet);
         // Clear wallet name for form
         setNewWalletName('');
     };
 
     const deleteSelectedWallet = async () => {
         if (!walletDeleteValid && walletDeleteValid !== null) {
             return;
         }
         if (
             confirmationOfWalletToBeDeleted !==
             `delete ${walletToBeDeleted.name}`
         ) {
             setWalletDeleteValid(false);
             return;
         }
 
         // Hide modal
         setShowDeleteWalletModal(false);
         // Change wallet name
         console.log(`Deleting wallet "${walletToBeDeleted.name}"`);
         const walletDeletedSuccess = await deleteWallet(walletToBeDeleted);
 
         if (walletDeletedSuccess) {
             Modal.success({
                 content: `Wallet "${walletToBeDeleted.name}" successfully deleted`,
             });
         } else {
             Modal.error({
                 content: `Error deleting ${walletToBeDeleted.name}.`,
             });
         }
         await updateSavedWallets(wallet);
         // Clear wallet delete confirmation from form
         setConfirmationOfWalletToBeDeleted('');
     };
 
     const handleWalletNameInput = e => {
         const { value } = e.target;
         // validation
         if (value && value.length && value.length < 24) {
             setNewWalletNameIsValid(true);
         } else {
             setNewWalletNameIsValid(false);
         }
 
         setNewWalletName(value);
     };
 
     const handleWalletToDeleteInput = e => {
         const { value } = e.target;
 
         if (value && value === `delete ${walletToBeDeleted.name}`) {
             setWalletDeleteValid(true);
         } else {
             setWalletDeleteValid(false);
         }
         setConfirmationOfWalletToBeDeleted(value);
     };
 
     const handleAppLockToggle = checked => {
         if (checked) {
             // if there is an existing credential, that means user has registered
             // simply turn on the Authentication Required flag
             if (authentication.credentialId) {
                 authentication.turnOnAuthentication();
             } else {
                 // there is no existing credential, that means user has not registered
                 // user need to register
                 authentication.signUp();
             }
         } else {
             authentication.turnOffAuthentication();
         }
     };
 
     const handleContactNameInput = e => {
         const { value } = e.target;
 
         if (value && value.length && value.length < 24) {
             setNewContactNameIsValid(true);
         } else {
             setNewContactNameIsValid(false);
         }
         setConfirmationOfContactToBeRenamed(value);
     };
 
     const handleRenameContact = contactObj => {
         if (!contactObj) {
             console.log(
                 'handleRenameContact() error: Invalid contact object for update',
             );
             return;
         }
         setContactToBeRenamed(contactObj);
         setShowRenameContactModal(true);
     };
 
     const handleRenameContactCancel = () => {
         setShowRenameContactModal(false);
     };
 
     const handleRenameContactModalOk = () => {
         if (
             !newContactNameIsValid ||
             newContactNameIsValid === null ||
             !contactToBeRenamed
         ) {
             return;
         }
         renameContactByName(contactToBeRenamed);
         setShowRenameContactModal(false);
     };
 
     const renameContactByName = async contactObj => {
         // obtain reference to the contact object in the array
         let contactObjToUpdate = contactListArray.find(
             element => element.address === contactObj.address,
         );
 
         // if a match was found
         if (contactObjToUpdate) {
             // update the contact name
             contactObjToUpdate.name = confirmationOfContactToBeRenamed;
 
             // update local object array and local storage
             setContactListArray(contactListArray);
 
             let updateContactListStatus;
             try {
                 updateContactListStatus = await updateContactListInLocalForage(
                     contactListArray,
                 );
             } catch (err) {
                 console.log('Error in updateContactListInLocalForage()');
                 console.log(err);
             }
 
             if (!updateContactListStatus) {
                 errorNotification(
                     null,
                     'Unable to update localforage with updated contact list',
                     'Updating localforage with contact list',
                 );
             }
         } else {
             errorNotification(
                 null,
                 'Unable to find contact in array',
                 'Updating localforage with contact list',
             );
         }
     };
 
     const handleSendModalToggle = checkedState => {
         changeCashtabSettings('sendModal', checkedState);
     };
 
     return (
         <SidePaddingCtn>
             <StyledConfigure>
                 {showRenameContactModal && (
                     <Modal
                         title={`Set contact name for ${contactToBeRenamed.address}`}
                         visible={showRenameContactModal}
                         onOk={() => handleRenameContactModalOk()}
                         onCancel={() => handleRenameContactCancel()}
                     >
                         <AntdFormWrapper>
                             <Form style={{ width: 'auto' }}>
                                 <Form.Item
                                     validateStatus={
                                         newContactNameIsValid === null ||
                                         newContactNameIsValid
                                             ? ''
                                             : 'error'
                                     }
                                     help={
                                         newContactNameIsValid === null ||
                                         newContactNameIsValid
                                             ? ''
                                             : 'Contact name must be a string between 1 and 24 characters long'
                                     }
                                 >
                                     <Input
                                         prefix={<WalletFilled />}
                                         placeholder="Enter new contact name"
                                         name="newContactName"
                                         value={confirmationOfContactToBeRenamed}
                                         onChange={e =>
                                             handleContactNameInput(e)
                                         }
                                     />
                                 </Form.Item>
                             </Form>
                         </AntdFormWrapper>
                     </Modal>
                 )}
                 {walletToBeRenamed !== null && (
                     <Modal
                         title={`Rename Wallet ${walletToBeRenamed.name}`}
                         visible={showRenameWalletModal}
                         onOk={changeWalletName}
                         onCancel={() => cancelRenameWallet()}
                     >
                         <AntdFormWrapper>
                             <Form style={{ width: 'auto' }}>
                                 <Form.Item
                                     validateStatus={
                                         newWalletNameIsValid === null ||
                                         newWalletNameIsValid
                                             ? ''
                                             : 'error'
                                     }
                                     help={
                                         newWalletNameIsValid === null ||
                                         newWalletNameIsValid
                                             ? ''
                                             : 'Wallet name must be a string between 1 and 24 characters long'
                                     }
                                 >
                                     <Input
                                         prefix={<WalletFilled />}
                                         placeholder="Enter new wallet name"
                                         name="newName"
                                         value={newWalletName}
                                         onChange={e => handleWalletNameInput(e)}
                                     />
                                 </Form.Item>
                             </Form>
                         </AntdFormWrapper>
                     </Modal>
                 )}
                 {walletToBeDeleted !== null && (
                     <Modal
                         title={`Are you sure you want to delete wallet "${walletToBeDeleted.name}"?`}
                         visible={showDeleteWalletModal}
                         onOk={deleteSelectedWallet}
                         onCancel={() => cancelDeleteWallet()}
                     >
                         <AntdFormWrapper>
                             <Form style={{ width: 'auto' }}>
                                 <Form.Item
                                     validateStatus={
                                         walletDeleteValid === null ||
                                         walletDeleteValid
                                             ? ''
                                             : 'error'
                                     }
                                     help={
                                         walletDeleteValid === null ||
                                         walletDeleteValid
                                             ? ''
                                             : 'Your confirmation phrase must match exactly'
                                     }
                                 >
                                     <Input
                                         prefix={<WalletFilled />}
                                         placeholder={`Type "delete ${walletToBeDeleted.name}" to confirm`}
                                         name="walletToBeDeletedInput"
                                         value={confirmationOfWalletToBeDeleted}
                                         onChange={e =>
                                             handleWalletToDeleteInput(e)
                                         }
                                     />
                                 </Form.Item>
                             </Form>
                         </AntdFormWrapper>
                     </Modal>
                 )}
                 <h2>
                     <ThemedCopyOutlined /> Backup your wallet
                 </h2>
                 <Alert
                     style={{ marginBottom: '12px' }}
                     description="Your seed phrase is the only way to restore your wallet. Write it down. Keep it safe."
                     type="warning"
                     showIcon
                 />
                 {showTranslationWarning && (
                     <Alert
                         style={{ marginBottom: '12px' }}
                         description="Please do not translate your seed phrase. Store your seed phrase in English. You must re-enter these exact English words to restore your wallet from seed."
                         type="warning"
                         showIcon
                     />
                 )}
                 {wallet && wallet.mnemonic && (
                     <StyledCollapse expandIconPosition="left">
                         <Panel
                             header={
                                 <div className="seedPhrase">
                                     Click to reveal seed phrase
                                 </div>
                             }
                         >
                             <p
                                 className="notranslate"
                                 style={{ userSelect: 'text' }}
                             >
                                 {wallet && wallet.mnemonic
                                     ? wallet.mnemonic
                                     : ''}
                             </p>
                         </Panel>
                     </StyledCollapse>
                 )}
                 <StyledSpacer />
                 <h2>
                     <ThemedWalletOutlined /> Manage Wallets
                 </h2>
                 {apiError ? (
                     <ApiError />
                 ) : (
                     <>
                         <PrimaryButton
                             onClick={() => updateSavedWalletsOnCreate()}
                         >
                             <PlusSquareOutlined /> New Wallet
                         </PrimaryButton>
                         <SecondaryButton
                             onClick={() => openSeedInput(!seedInput)}
                         >
                             <ImportOutlined /> Import Wallet
                         </SecondaryButton>
                         {seedInput && (
                             <>
                                 <p style={{ color: '#fff' }}>
                                     Copy and paste your mnemonic seed phrase
                                     below to import an existing wallet
                                 </p>
                                 <AntdFormWrapper>
                                     <Form style={{ width: 'auto' }}>
                                         <Form.Item
                                             validateStatus={
                                                 isValidMnemonic === null ||
                                                 isValidMnemonic
                                                     ? ''
                                                     : 'error'
                                             }
                                             help={
                                                 isValidMnemonic === null ||
                                                 isValidMnemonic
                                                     ? ''
                                                     : 'Valid mnemonic seed phrase required'
                                             }
                                         >
                                             <Input
                                                 prefix={<LockOutlined />}
                                                 type="email"
                                                 placeholder="mnemonic (seed phrase)"
                                                 name="mnemonic"
                                                 autoComplete="off"
                                                 onChange={e => handleChange(e)}
                                                 required
                                             />
                                         </Form.Item>
                                         <SmartButton
                                             disabled={!isValidMnemonic}
                                             onClick={() => submit()}
                                         >
                                             Import
                                         </SmartButton>
                                     </Form>
                                 </AntdFormWrapper>
                             </>
                         )}
                     </>
                 )}
                 {savedWallets && savedWallets.length > 0 && (
                     <>
                         <StyledCollapse>
                             <Panel header="Saved wallets">
                                 <AWRow>
-                                    <h3 className="notranslate">
-                                        {wallet.name}
-                                    </h3>
+                                    <Tooltip title={wallet.name}>
+                                        <h3 className="notranslate">
+                                            {wallet.name}
+                                        </h3>
+                                    </Tooltip>
                                     <h4>Currently active</h4>
                                 </AWRow>
                                 <div>
                                     {savedWallets.map(sw => (
                                         <SWRow key={sw.name}>
-                                            <SWName>
-                                                <h3 className="overflow notranslate">
-                                                    {sw.name}
-                                                </h3>
-                                            </SWName>
+                                            <Tooltip
+                                                title={sw.name}
+                                                autoAdjustOverflow={true}
+                                            >
+                                                <SWName>
+                                                    <h3 className="overflow notranslate">
+                                                        {sw.name}
+                                                    </h3>
+                                                </SWName>
+                                            </Tooltip>
                                             <SWBalance>
                                                 <div className="overflow">
                                                     [
                                                     {sw && sw.state
                                                         ? formatSavedBalance(
                                                               sw.state.balances
                                                                   .totalBalance,
                                                           )
                                                         : 'N/A'}{' '}
                                                     XEC]
                                                 </div>
                                             </SWBalance>
                                             <SWButtonCtn>
                                                 <Edit
                                                     onClick={() =>
                                                         showPopulatedRenameWalletModal(
                                                             sw,
                                                         )
                                                     }
                                                 />
                                                 <Trashcan
                                                     onClick={() =>
                                                         showPopulatedDeleteWalletModal(
                                                             sw,
                                                         )
                                                     }
                                                 />
                                                 <button
                                                     onClick={() =>
                                                         updateSavedWalletsOnLoad(
                                                             sw,
                                                         )
                                                     }
                                                 >
                                                     Activate
                                                 </button>
                                             </SWButtonCtn>
                                         </SWRow>
                                     ))}
                                 </div>
                             </Panel>
                         </StyledCollapse>
                     </>
                 )}
                 <Row type="flex">
                     <Col span={24}>
                         <StyledCollapse
                             style={{
                                 marginBottom: '24px',
                             }}
                             defaultActiveKey={
                                 location &&
                                 location.state &&
                                 location.state.contactToAdd
                                     ? ['1']
                                     : ['0']
                             }
                         >
                             <Panel header="Contact List" key="1">
                                 <AntdFormWrapper>
                                     <Form
                                         style={{
                                             width: 'auto',
                                         }}
                                     >
                                         {contactListArray &&
                                         contactListArray.length > 0 ? (
                                             contactListArray.map(
                                                 (element, index) => (
                                                     <ContactListRow key={index}>
-                                                        <ContactListName>
-                                                            <div className="overflow">
-                                                                {element.name}
-                                                            </div>
-                                                        </ContactListName>
-                                                        <ContactListAddress>
-                                                            <div
-                                                                className="overflow notranslate"
-                                                                onClick={() => {
-                                                                    navigator.clipboard.writeText(
-                                                                        element.address,
-                                                                    );
-                                                                    generalNotification(
-                                                                        element.address +
-                                                                            ' copied to clipboard',
-                                                                        'Copied',
-                                                                    );
-                                                                }}
-                                                            >
-                                                                {
-                                                                    element.address
-                                                                }
-                                                            </div>
-                                                        </ContactListAddress>
+                                                        <Tooltip
+                                                            title={element.name}
+                                                        >
+                                                            <ContactListName>
+                                                                <div className="overflow">
+                                                                    {
+                                                                        element.name
+                                                                    }
+                                                                </div>
+                                                            </ContactListName>
+                                                        </Tooltip>
+                                                        <Tooltip
+                                                            title={
+                                                                element.address
+                                                            }
+                                                        >
+                                                            <ContactListAddress>
+                                                                <div
+                                                                    className="overflow notranslate"
+                                                                    onClick={() => {
+                                                                        navigator.clipboard.writeText(
+                                                                            element.address,
+                                                                        );
+                                                                        generalNotification(
+                                                                            element.address +
+                                                                                ' copied to clipboard',
+                                                                            'Copied',
+                                                                        );
+                                                                    }}
+                                                                >
+                                                                    {
+                                                                        element.address
+                                                                    }
+                                                                </div>
+                                                            </ContactListAddress>
+                                                        </Tooltip>
                                                         <ContactListCtn>
                                                             <Edit
                                                                 onClick={() =>
                                                                     handleRenameContact(
                                                                         element,
                                                                     )
                                                                 }
                                                             />
                                                             <Link
                                                                 to={{
                                                                     pathname: `/send`,
                                                                     state: {
                                                                         contactSend:
                                                                             element.address,
                                                                     },
                                                                 }}
                                                             >
                                                                 <ThemedContactSendOutlined />
                                                             </Link>
                                                         </ContactListCtn>
                                                     </ContactListRow>
                                                 ),
                                             )
                                         ) : (
                                             <div>
                                                 <p>
                                                     {
                                                         'Your contact list is empty.'
                                                     }
                                                 </p>
                                                 <p>
                                                     {
                                                         'Contacts can be added by clicking on a received transaction and looking for the "Add to contacts" icon.'
                                                     }
                                                 </p>
                                             </div>
                                         )}
                                     </Form>
                                 </AntdFormWrapper>
                             </Panel>
                         </StyledCollapse>
                     </Col>
                 </Row>
                 <StyledSpacer />
                 <h2>
                     <ThemedDollarOutlined /> Fiat Currency
                 </h2>
                 <AntdFormWrapper>
                     <CurrencySelectDropdown
                         defaultValue={
                             cashtabSettings && cashtabSettings.fiatCurrency
                                 ? cashtabSettings.fiatCurrency
                                 : 'usd'
                         }
                         onChange={fiatCode =>
                             changeCashtabSettings('fiatCurrency', fiatCode)
                         }
                     />
                 </AntdFormWrapper>
                 <StyledSpacer />
                 <h2>
                     <ThemedSettingOutlined /> General Settings
                 </h2>
                 <GeneralSettingsItem>
                     <div className="title">
                         <LockFilled /> Lock App
                     </div>
                     {authentication ? (
                         <Switch
                             size="small"
                             checkedChildren={<CheckOutlined />}
                             unCheckedChildren={<CloseOutlined />}
                             checked={
                                 authentication.isAuthenticationRequired &&
                                 authentication.credentialId
                                     ? true
                                     : false
                             }
                             // checked={false}
                             onChange={handleAppLockToggle}
                         />
                     ) : (
                         <Tag color="warning" icon={<ExclamationCircleFilled />}>
                             Not Supported
                         </Tag>
                     )}
                 </GeneralSettingsItem>
                 <GeneralSettingsItem>
                     <div className="SendConfirm">
                         <LockFilled /> Send Confirmations
                     </div>
                     <Switch
                         size="small"
                         checkedChildren={<CheckOutlined />}
                         unCheckedChildren={<CloseOutlined />}
                         checked={
                             cashtabSettings ? cashtabSettings.sendModal : false
                         }
                         onChange={handleSendModalToggle}
                     />
                 </GeneralSettingsItem>
                 <StyledSpacer />[
                 <SettingsLink
                     type="link"
                     href="https://docs.cashtab.com/docs/"
                     target="_blank"
                     rel="noreferrer"
                 >
                     Documentation
                 </SettingsLink>
                 ]
             </StyledConfigure>
         </SidePaddingCtn>
     );
 };
 
 export default Configure;