diff --git a/packages/ui/src/components/modals/HiddenAccountInfo.tsx b/packages/ui/src/components/modals/HiddenAccountInfo.tsx
new file mode 100644
index 00000000..5b93ee2e
--- /dev/null
+++ b/packages/ui/src/components/modals/HiddenAccountInfo.tsx
@@ -0,0 +1,93 @@
+import {
+ Checkbox,
+ Dialog,
+ DialogContent,
+ DialogTitle,
+ FormControlLabel,
+ Grid2 as Grid
+} from '@mui/material'
+import { Button } from '../library'
+import { styled } from '@mui/material/styles'
+import { ModalCloseButton } from '../library/ModalCloseButton'
+import { useCallback, useState } from 'react'
+
+interface Props {
+ onClose: () => void
+ className?: string
+}
+
+export const LOCALSTORAGE_KEY = 'multix.dontShowHiddenAccountInfo'
+
+const HiddenAccountInfo = ({ onClose, className }: Props) => {
+ const [dontShow, setDontShow] = useState(false)
+ const onClick = useCallback(() => {
+ onClose()
+ if (dontShow) {
+ localStorage.setItem(LOCALSTORAGE_KEY, 'true')
+ }
+ }, [dontShow, onClose])
+
+ return (
+
+ )
+}
+
+const FooterContainerStyled = styled(Grid)`
+ margin-top: 1rem;
+
+ button:last-child {
+ margin-left: auto;
+ }
+
+ .closeButton {
+ margin-left: auto;
+ }
+`
+
+export default styled(HiddenAccountInfo)`
+ .accountEdition {
+ margin-bottom: 1rem;
+ align-items: end;
+ }
+`
diff --git a/packages/ui/src/contexts/HiddenAccountsContext.tsx b/packages/ui/src/contexts/HiddenAccountsContext.tsx
index 7fa9f50d..f307267a 100644
--- a/packages/ui/src/contexts/HiddenAccountsContext.tsx
+++ b/packages/ui/src/contexts/HiddenAccountsContext.tsx
@@ -13,6 +13,7 @@ import { useNetwork } from './NetworkContext'
import { HexString } from 'polkadot-api'
import { useGetEncodedAddress } from '../hooks/useGetEncodedAddress'
import { useSearchParams } from 'react-router'
+import { useWatchedAddresses } from './WatchedAddressesContext'
const LOCALSTORAGE_HIDDEN_ACCOUNTS_KEY = 'multix.hiddenAccounts'
@@ -42,6 +43,7 @@ const HiddenAccountsContextProvider = ({ children }: HiddenAccountsProps) => {
const { selectedNetwork } = useNetwork()
const getEncodedAddress = useGetEncodedAddress()
const [searchParams, setSearchParams] = useSearchParams({ address: '' })
+ const { watchedAddresses, removeWatchedAccount } = useWatchedAddresses()
const networkHiddenAccounts = useMemo(() => {
if (!selectedNetwork) return []
@@ -67,14 +69,21 @@ const HiddenAccountsContextProvider = ({ children }: HiddenAccountsProps) => {
return prev
})
}
- selectedNetwork &&
- pubKey &&
- setHiddenAccounts((prev) => [
- ...prev,
- { pubKey, network: selectedNetwork } as HiddenAccount
- ])
+
+ // if we are hiding a watched account
+ // just remove it from the watch list
+ if (watchedAddresses.includes(address)) {
+ removeWatchedAccount(address)
+ } else {
+ selectedNetwork &&
+ pubKey &&
+ setHiddenAccounts((prev) => [
+ ...prev,
+ { pubKey, network: selectedNetwork } as HiddenAccount
+ ])
+ }
},
- [searchParams, selectedNetwork, setSearchParams]
+ [removeWatchedAccount, searchParams, selectedNetwork, setSearchParams, watchedAddresses]
)
const removeHiddenAccount = useCallback(
diff --git a/packages/ui/src/contexts/ModalsContext.tsx b/packages/ui/src/contexts/ModalsContext.tsx
index cf7632a4..20faef21 100644
--- a/packages/ui/src/contexts/ModalsContext.tsx
+++ b/packages/ui/src/contexts/ModalsContext.tsx
@@ -8,6 +8,7 @@ import WCSessionProposal from '../components/modals/WalletConnectSessionProposal
import ProposalSigningModal, { SigningModalProps } from '../components/modals/ProposalSigning'
import WalletConnectSigning from '../components/modals/WalletConnectSigning'
import { useMultiProxy } from './MultiProxyContext'
+import HiddenAccountInfo from '../components/modals/HiddenAccountInfo'
interface ModalsContextProps {
setIsEditModalOpen: (isOpen: boolean) => void
@@ -17,6 +18,7 @@ interface ModalsContextProps {
openWalletConnectSessionModal: ({ sessionProposal }: OpenWCModalParams) => void
onOpenSigningModal: (info: SigningInfo) => void
onOpenWalletConnectSigning: (request: SignClientTypes.EventArguments['session_request']) => void
+ onOpenHiddenAccountInfoModal: () => void
}
interface OpenWCModalParams {
@@ -38,6 +40,7 @@ const ModalsContextProvider = ({ children }: React.PropsWithChildren) => {
const [sendModalPreselection, setSendModalPreselection] = useState(
DEFAULT_EASY_SETUP_SELECTION
)
+ const [isHiddenAccountInfoModalOpen, setIsHiddenAccountInfoModalOpen] = useState(false)
const [walletConnectRequest, setWalletConnectRequest] = useState<
SignClientTypes.EventArguments['session_request'] | undefined
>()
@@ -107,6 +110,10 @@ const ModalsContextProvider = ({ children }: React.PropsWithChildren) => {
setIsOpenWalletConnectSigning(false)
}, [])
+ const onOpenHiddenAccountInfoModal = useCallback(() => {
+ setIsHiddenAccountInfoModalOpen(true)
+ }, [])
+
return (
{
onCloseSendModal,
openWalletConnectSessionModal,
onOpenSigningModal,
- onOpenWalletConnectSigning
+ onOpenWalletConnectSigning,
+ onOpenHiddenAccountInfoModal
}}
>
{children}
@@ -150,6 +158,9 @@ const ModalsContextProvider = ({ children }: React.PropsWithChildren) => {
request={walletConnectRequest}
/>
)}
+ {isHiddenAccountInfoModalOpen && (
+ setIsHiddenAccountInfoModalOpen(false)} />
+ )}
)
}
diff --git a/packages/ui/src/pages/Home/MultisigActionMenu.tsx b/packages/ui/src/pages/Home/MultisigActionMenu.tsx
index 54afd6cd..a1aa3ac3 100644
--- a/packages/ui/src/pages/Home/MultisigActionMenu.tsx
+++ b/packages/ui/src/pages/Home/MultisigActionMenu.tsx
@@ -1,17 +1,19 @@
import { Button } from '../../components/library'
import OptionsMenu, { MenuOption } from '../../components/OptionsMenu'
-import { useMemo } from 'react'
+import { useCallback, useMemo } from 'react'
import { MdOutlineLockReset as LockResetIcon } from 'react-icons/md'
import { useMultiProxy } from '../../contexts/MultiProxyContext'
import { useModals } from '../../contexts/ModalsContext'
import {
HiOutlineArrowTopRightOnSquare as LaunchIcon,
HiOutlineUserPlus as IdentityIcon,
- HiOutlinePencilSquare as PencilIcon
+ HiOutlinePencilSquare as PencilIcon,
+ HiOutlineEyeSlash as EyeSlashIcon
} from 'react-icons/hi2'
import { useGetSubscanLinks } from '../../hooks/useSubscanLink'
import { EasyTransferTitle } from '../../components/modals/Send'
import { useHasIdentityFeature } from '../../hooks/useHasIdentityFeature'
+import { useHiddenAccounts } from '../../contexts/HiddenAccountsContext'
interface MultisigActionMenuProps {
withNewTransactionButton?: boolean
@@ -22,10 +24,20 @@ const MultisigActionMenu = ({
withNewTransactionButton = true,
menuButtonBorder
}: MultisigActionMenuProps) => {
- const { selectedHasProxy, selectedIsWatched, selectedMultiProxy } = useMultiProxy()
+ const { selectedHasProxy, selectedIsWatched, selectedMultiProxy, selectedMultiProxyAddress } =
+ useMultiProxy()
const { setIsEditModalOpen, setIsChangeMultiModalOpen, onOpenSendModal } = useModals()
const { getSubscanAccountLink } = useGetSubscanLinks()
const { hasIdentityPallet, hasPplChain } = useHasIdentityFeature()
+ const { addHiddenAccount } = useHiddenAccounts()
+ const { onOpenHiddenAccountInfoModal } = useModals()
+
+ const onHideAccount = useCallback(() => {
+ if (!selectedMultiProxyAddress) return
+
+ onOpenHiddenAccountInfoModal()
+ addHiddenAccount(selectedMultiProxyAddress)
+ }, [addHiddenAccount, onOpenHiddenAccountInfoModal, selectedMultiProxyAddress])
const options: MenuOption[] = useMemo(() => {
const opts = [
@@ -34,6 +46,11 @@ const MultisigActionMenu = ({
icon: ,
onClick: () => setIsEditModalOpen(true)
},
+ {
+ text: 'Hide this account',
+ icon: ,
+ onClick: onHideAccount
+ },
{
text: 'Subscan',
icon: ,
@@ -63,19 +80,9 @@ const MultisigActionMenu = ({
onClick: () => setIsChangeMultiModalOpen(true)
})
- // If we are NOT rendering "new transaction button" and is it's NOT a Watched account,
- // the "Send transaction" item will appear in the list menu
- // TODO: Individual transaction button for each mulisig
- // if (!withNewTransactionButton && !selectedIsWatched) {
- // opts.unshift({
- // text: 'Send transaction',
- // icon: ,
- // onClick: () => setIsSendModalOpen(true)
- // })
- // }
-
return opts
}, [
+ onHideAccount,
selectedIsWatched,
hasPplChain,
hasIdentityPallet,