Merge branch 'main' into tbaut-cleanup

packages/ui/cypress/tests/default-multisigs.cy.ts

@@ -0,0 +1,90 @@
+import { accountDisplay } from '../support/page-objects/components/accountDisplay'
+import { landingPageNetwork } from '../fixtures/landingData'
+import { topMenuItems } from '../support/page-objects/topMenuItems'
+import { multisigPage } from '../support/page-objects/multisigPage'
+
+const lolmcshizPubKey = '0x8aee4e164d5d70ac67308f303c7e063e9156903e42c1087bbc530447487fa47f'
+const polkadotSelectedMultiproxy = '13EyMuuDHwtq5RD6w3psCJ9WvJFZzDDion6Fd2FVAqxz1g7K' // CD OpenGov
+
+const kusamaSelectedMultiproxy = 'J7UBNJqKHkRi3NkxMV6Y43cMk1ZjEJWzq4z4XmqmNCcFTfM'
+
+describe('default Multisigs', () => {
+  it('can switch to a new multiproxy and remember it', () => {
+    cy.setupAndVisit({
+      url: landingPageNetwork('polkadot'),
+      watchedAccounts: [lolmcshizPubKey]
+    })
+
+    multisigPage.accountHeader().within(() => {
+      accountDisplay
+        .addressLabel()
+        .invoke('text')
+        .as('defaultPolkadotAddress')
+        .should('not.contain', polkadotSelectedMultiproxy.slice(0, 6))
+    })
+
+    cy.log('@defaultPolkadotAddress', cy.get('@defaultPolkadotAddress'))
+
+    // select another one
+    topMenuItems.desktopMenu().within(() =>
+      topMenuItems
+        .multiproxySelectorDesktop()
+        .wait(1000)
+        .click()
+        .type(`${polkadotSelectedMultiproxy.slice(0, 6)}{downArrow}{enter}`)
+    )
+
+    // verify that it's displayed
+    multisigPage.accountHeader().within(() => {
+      accountDisplay.addressLabel().should('contain.text', polkadotSelectedMultiproxy.slice(0, 6))
+    })
+
+    // go on Kusama and do the same
+    // check the default multiproxy
+    cy.visit(landingPageNetwork('kusama'))
+
+    multisigPage.accountHeader().within(() => {
+      accountDisplay
+        .addressLabel()
+        .invoke('text')
+        .as('defaultKusamaAddress')
+        .should('not.contain', kusamaSelectedMultiproxy.slice(0, 6))
+    })
+
+    cy.log('@defaultKusamaAddress', cy.get('@defaultKusamaAddress'))
+
+    // select another one
+    topMenuItems.desktopMenu().within(() =>
+      topMenuItems
+        .multiproxySelectorDesktop()
+        .wait(1000)
+        .click()
+        .type(`${kusamaSelectedMultiproxy.slice(0, 6)}{downArrow}{enter}`)
+    )
+
+    // verify that it's displayed
+    multisigPage.accountHeader().within(() => {
+      accountDisplay.addressLabel().should('contain.text', kusamaSelectedMultiproxy.slice(0, 6))
+    })
+
+    // go back on Polkadot and verify the last used one is selected
+    cy.visit(landingPageNetwork('polkadot'))
+
+    // verify that it's displayed
+    multisigPage.accountHeader().within(() => {
+      accountDisplay.addressLabel().should('contain.text', polkadotSelectedMultiproxy.slice(0, 6))
+    })
+
+    cy.url().should('include', polkadotSelectedMultiproxy)
+
+    // go back on Kusama and verify the last used one is selected
+    cy.visit(landingPageNetwork('kusama'))
+
+    // verify that it's displayed
+    multisigPage.accountHeader().within(() => {
+      accountDisplay.addressLabel().should('contain.text', kusamaSelectedMultiproxy.slice(0, 6))
+    })
+
+    cy.url().should('include', kusamaSelectedMultiproxy)
+  })
+})

packages/ui/src/contexts/AccountsContext.tsx

@@ -8,7 +8,6 @@ import React, {
   SetStateAction,
   useEffect
 } from 'react'
-// import { PolkadotSigner } from 'polkadot-api'
 import { useAccounts as useRedotAccounts } from '@reactive-dot/react'
 import { useApi } from './ApiContext'
 import { encodeAccounts } from '../utils/encodeAccounts'
@@ -27,12 +26,8 @@ export interface IAccountContext {
   ownAddressList: string[]
   selectAccount: (account: InjectedPolkadotAccount) => void
   getAccountByAddress: (address: string) => InjectedPolkadotAccount | undefined
-  // isAccountLoading: boolean
-  // isExtensionError: boolean
-  // selectedSigner?: PolkadotSigner
   allowConnectionToExtension: () => void
   isAllowedToConnectToExtension: boolean
-  // isLocalStorageSetupDone: boolean
   isConnectionDialogOpen: boolean
   setIsConnectionDialogOpen: Dispatch<SetStateAction<boolean>>
 }

packages/ui/src/contexts/MultiProxyContext.tsx

@@ -7,6 +7,7 @@ import { useWatchedAddresses } from './WatchedAddressesContext'
 import { useAccountId } from '../hooks/useAccountId'
 import { getMultiProxyAddress } from '../utils/getMultiProxyAddress'
 import { useSearchParams } from 'react-router'
+import { useNetwork } from './NetworkContext'
 
 interface MultisigContextProps {
   children: React.ReactNode | React.ReactNode[]
@@ -71,6 +72,11 @@ const MultiProxyContextProvider = ({ children }: MultisigContextProps) => {
   }, [multisigList, pureProxyList])
   const { ownAddressList } = useAccounts()
   const { watchedAddresses } = useWatchedAddresses()
+  const { selectedNetwork } = useNetwork()
+  const LOCALSTORAGE_LAST_MULTIPROXY_KEY_NETWORK = useMemo(
+    () => selectedNetwork && `multix.lastUsedMultiProxy.${selectedNetwork}`,
+    [selectedNetwork]
+  )
 
   const getMultiProxyByAddress = useCallback(
     (address?: string) => {
@@ -319,26 +325,38 @@ const MultiProxyContextProvider = ({ children }: MultisigContextProps) => {
         return false
       }
 
+      if (multiProxyFound && LOCALSTORAGE_LAST_MULTIPROXY_KEY_NETWORK) {
+        localStorage.setItem(LOCALSTORAGE_LAST_MULTIPROXY_KEY_NETWORK, multi)
+      }
+
       setAddressInUrl(multi)
       setSelectedMultiProxyAddress(multi)
       return true
     },
-    [getMultiProxyByAddress, setAddressInUrl]
+    [LOCALSTORAGE_LAST_MULTIPROXY_KEY_NETWORK, getMultiProxyByAddress, setAddressInUrl]
   )
 
   const defaultAddress = useMemo(() => {
     if (multiProxyList?.length === 0 || isLoading) {
       return undefined
     }
 
+    const lastUsedMultiProxy =
+      LOCALSTORAGE_LAST_MULTIPROXY_KEY_NETWORK &&
+      localStorage.getItem(LOCALSTORAGE_LAST_MULTIPROXY_KEY_NETWORK)
+
+    if (lastUsedMultiProxy && getMultiProxyByAddress(lastUsedMultiProxy)) {
+      return lastUsedMultiProxy
+    }
+
     return multiProxyList?.[0].proxy || multiProxyList?.[0].multisigs[0].address
-  }, [isLoading, multiProxyList])
+  }, [LOCALSTORAGE_LAST_MULTIPROXY_KEY_NETWORK, getMultiProxyByAddress, isLoading, multiProxyList])
 
   return (
     <MultisigContext.Provider
       value={{
-        selectedMultiProxyAddress,
         defaultAddress,
+        selectedMultiProxyAddress,
         selectedMultiProxy,
         multiProxyList,
         selectMultiProxy,

packages/ui/src/hooks/useSwitchAddress.tsx

@@ -15,9 +15,9 @@ export const useSwitchAddress = () => {
     multiProxyList,
     isLoading: isMultiproxyLoading,
     selectMultiProxy,
-    defaultAddress,
     selectedMultiProxyAddress,
-    setCanFindMultiProxyFromUrl
+    setCanFindMultiProxyFromUrl,
+    defaultAddress
   } = useMultiProxy()
 
   useEffect(() => {