add copy account address

components/account/AccountActions.tsx

@@ -5,6 +5,7 @@ import WithdrawModal from '../modals/WithdrawModal'
 import {
   ArrowDownTrayIcon,
   ArrowUpTrayIcon,
+  DocumentDuplicateIcon,
   EllipsisHorizontalIcon,
   PencilIcon,
   TrashIcon,
@@ -14,6 +15,8 @@ import IconDropMenu from '../shared/IconDropMenu'
 import CloseAccountModal from '../modals/CloseAccountModal'
 import AccountNameModal from '../modals/AccountNameModal'
 import mangoStore from '@store/mangoStore'
+import { copyToClipboard } from 'utils'
+import { notify } from 'utils/notifications'
 
 const AccountActions = () => {
   const { t } = useTranslation(['common', 'close-account'])
@@ -23,9 +26,17 @@ const AccountActions = () => {
   const [showEditAccountModal, setShowEditAccountModal] = useState(false)
   const [showWithdrawModal, setShowWithdrawModal] = useState(false)
 
+  const handleCopyAddress = (address: string) => {
+    copyToClipboard(address)
+    notify({
+      title: t('copy-address-success'),
+      type: 'success',
+    })
+  }
+
   return (
     <>
-      <div className="flex space-x-3">
+      <div className="flex items-center space-x-2 md:space-x-3">
         <Button
           className="flex items-center"
           disabled={!mangoAccount}
@@ -49,12 +60,22 @@ const AccountActions = () => {
           icon={<EllipsisHorizontalIcon className="h-5 w-5" />}
           large
         >
+          <LinkButton
+            className="whitespace-nowrap"
+            disabled={!mangoAccount}
+            onClick={() =>
+              handleCopyAddress(mangoAccount!.publicKey.toString())
+            }
+          >
+            <DocumentDuplicateIcon className="h-4 w-4" />
+            <span className="ml-2">{t('copy-address')}</span>
+          </LinkButton>
           <LinkButton
             className="whitespace-nowrap"
             disabled={!mangoAccount}
             onClick={() => setShowEditAccountModal(true)}
           >
-            <PencilIcon className="h-5 w-5" />
+            <PencilIcon className="h-4 w-4" />
             <span className="ml-2">{t('edit-account')}</span>
           </LinkButton>
           <LinkButton
@@ -62,7 +83,7 @@ const AccountActions = () => {
             disabled={!mangoAccount}
             onClick={() => setShowCloseAccountModal(true)}
           >
-            <TrashIcon className="h-5 w-5" />
+            <TrashIcon className="h-4 w-4" />
             <span className="ml-2">{t('close-account')}</span>
           </LinkButton>
         </IconDropMenu>

components/shared/Notification.tsx

@@ -18,10 +18,12 @@ import {
 } from '../../utils/constants'
 import useLocalStorageState from 'hooks/useLocalStorageState'
 import { EXPLORERS } from 'pages/settings'
+import { useTranslation } from 'next-i18next'
 
 const setMangoStore = mangoStore.getState().set
 
 const NotificationList = () => {
+  const { t } = useTranslation()
   const notifications = mangoStore((s) => s.notifications)
   const walletTokens = mangoStore((s) => s.wallet.tokens)
   const notEnoughSoLMessage = 'Not enough SOL'
@@ -99,7 +101,7 @@ const NotificationList = () => {
           onClick={clearAll}
         >
           <XMarkIcon className="mr-1 h-3.5 w-3.5" />
-          Clear All
+          {t('clear-all')}
         </button>
       ) : null}
       {reversedNotifications.map((n) => (

public/locales/en/common.json

@@ -23,12 +23,15 @@
   "borrow-value": "Borrow Value",
   "buy": "Buy",
   "cancel": "Cancel",
+  "clear-all": "Clear All",
   "close-account": "Close Account",
   "close-account-desc": "Are you sure? Closing your account is irreversible.",
   "closing-account": "Closing your account...",
   "collateral-value": "Collateral Value",
   "connect": "Connect",
   "connect-helper": "Connect to get started",
+  "copy-address": "Copy Address",
+  "copy-address-success": "Copied Mango Account address",
   "create-account": "Create Account",
   "creating-account": "Creating Account...",
   "cumulative-interest-value": "Cumulative Interest Earned",

public/locales/es/common.json

@@ -23,12 +23,15 @@
   "borrow-value": "Borrow Value",
   "buy": "Buy",
   "cancel": "Cancel",
+  "clear-all": "Clear All",
   "close-account": "Close Account",
   "close-account-desc": "Are you sure? Closing your account is irreversible.",
   "closing-account": "Closing your account...",
   "collateral-value": "Collateral Value",
   "connect": "Connect",
   "connect-helper": "Connect to get started",
+  "copy-address": "Copy Address",
+  "copy-address-success": "Copied Mango Account address",
   "create-account": "Create Account",
   "creating-account": "Creating Account...",
   "cumulative-interest-value": "Cumulative Interest Earned",

public/locales/ru/common.json

@@ -23,12 +23,15 @@
   "borrow-value": "Borrow Value",
   "buy": "Buy",
   "cancel": "Cancel",
+  "clear-all": "Clear All",
   "close-account": "Close Account",
   "close-account-desc": "Are you sure? Closing your account is irreversible.",
   "closing-account": "Closing your account...",
   "collateral-value": "Collateral Value",
   "connect": "Connect",
   "connect-helper": "Connect to get started",
+  "copy-address": "Copy Address",
+  "copy-address-success": "Copied Mango Account address",
   "create-account": "Create Account",
   "creating-account": "Creating Account...",
   "cumulative-interest-value": "Cumulative Interest Value",

public/locales/zh/common.json

@@ -23,12 +23,15 @@
   "borrow-value": "Borrow Value",
   "buy": "Buy",
   "cancel": "Cancel",
+  "clear-all": "Clear All",
   "close-account": "Close Account",
   "close-account-desc": "Are you sure? Closing your account is irreversible.",
   "closing-account": "Closing your account...",
   "collateral-value": "Collateral Value",
   "connect": "Connect",
   "connect-helper": "Connect to get started",
+  "copy-address": "Copy Address",
+  "copy-address-success": "Copied Mango Account address",
   "create-account": "Create Account",
   "creating-account": "Creating Account...",
   "cumulative-interest-value": "Cumulative Interest Earned",

public/locales/zh_tw/common.json

@@ -23,12 +23,15 @@
   "borrow-value": "Borrow Value",
   "buy": "Buy",
   "cancel": "Cancel",
+  "clear-all": "Clear All",
   "close-account": "Close Account",
   "close-account-desc": "Are you sure? Closing your account is irreversible.",
   "closing-account": "Closing your account...",
   "collateral-value": "Collateral Value",
   "connect": "Connect",
   "connect-helper": "Connect to get started",
+  "copy-address": "Copy Address",
+  "copy-address-success": "Copied Mango Account address",
   "create-account": "Create Account",
   "creating-account": "Creating Account...",
   "cumulative-interest-value": "Cumulative Interest Earned",

utils/index.ts

@@ -34,3 +34,12 @@ export function isEqual(obj1: any, obj2: any, keys: Array<string>) {
   }
   return true
 }
+
+export const copyToClipboard = (copyThis: string) => {
+  const el = document.createElement('textarea')
+  el.value = copyThis.toString()
+  document.body.appendChild(el)
+  el.select()
+  document.execCommand('copy')
+  document.body.removeChild(el)
+}