chore: landing messaging

ChainSafe · Oct 30, 2024 · 098b3b7 · 098b3b7
1 parent 63bc469
commit 098b3b7
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 7 deletions.
diff --git a/packages/ui/cypress/support/commands.ts b/packages/ui/cypress/support/commands.ts
@@ -8,6 +8,7 @@ import '@chainsafe/cypress-polkadot-wallet'
 const LOCALSTORAGE_ACCOUNT_NAMES_KEY = 'multix.accountNames'
 const LOCALSTORAGE_WATCHED_ACCOUNTS_KEY = 'multix.watchedAccount'
 const LOCALSTORAGE_EXTENSION_CONNECTION_KEY = '@reactive-dot/wallet/injected/polkadot-js/connected'
+const LOCALSTORAGE_ALLOWED_CONNECTION_KEY = 'multix.canConnectToExtension'
 export const MULTIX_DAPP_NAME = 'Multix'
 
 Cypress.Commands.add('rejectCurrentMultisigTx', rejectCurrentMultisigTxs)
@@ -51,8 +52,10 @@ Cypress.Commands.add(
         !!accountNames &&
           win.localStorage.setItem(LOCALSTORAGE_ACCOUNT_NAMES_KEY, JSON.stringify(accountNames))
 
-        !!extensionConnectionAllowed &&
+        if (extensionConnectionAllowed) {
+          win.localStorage.setItem(LOCALSTORAGE_ALLOWED_CONNECTION_KEY, 'true')
           win.localStorage.setItem(LOCALSTORAGE_EXTENSION_CONNECTION_KEY, 'true')
+        }
       }
     })
 

diff --git a/packages/ui/cypress/support/page-objects/landingPage.ts b/packages/ui/cypress/support/page-objects/landingPage.ts
@@ -1,4 +1,5 @@
 export const landingPage = {
+  connectionDialog: () => cy.get('[data-cy=dialog-connection]'),
   multixIntroHeader: () => cy.get('[data-cy=header-multix-introduction]', { timeout: 10000 }),
   interactionPromptLabel: () => cy.get('[data-cy=label-interaction-prompt]'),
   noMultisigFoundError: () => cy.get('[data-cy=label-no-multisig-found]', { timeout: 10000 }),

diff --git a/packages/ui/cypress/utils/clickOnConnect.ts b/packages/ui/cypress/utils/clickOnConnect.ts
@@ -4,6 +4,12 @@ import { waitForAuthRequest } from './waitForAuthRequests'
 
 export const clickOnConnect = () => {
   topMenuItems.connectButton().click()
-  landingPage.accountsLoader().should('contain', 'Loading your accounts')
+  landingPage.connectionDialog().should('exist')
+  landingPage
+    .connectionDialog()
+    .within(() => cy.get('button', { includeShadowDom: true }).contains('Connect').click())
   waitForAuthRequest()
+  landingPage
+    .connectionDialog()
+    .within(() => cy.get('#close-button', { includeShadowDom: true }).click())
 }
diff --git a/packages/ui/src/components/ConnectCreateOrWatch.tsx b/packages/ui/src/components/ConnectCreateOrWatch.tsx
@@ -17,7 +17,7 @@ export const ConnectOrWatch = () => {
 
   return (
     <WrapperStyled>
-      {watchedAddresses.length !== 0 ? (
+      {isAllowedToConnectToExtension || watchedAddresses.length !== 0 ? (
         <div data-cy="label-no-multisig-found">
           No multisig found for your accounts or watched accounts on{' '}
           <NetworkNameStyled>{selectedNetwork}</NetworkNameStyled>.

diff --git a/packages/ui/src/components/Header/Header.tsx b/packages/ui/src/components/Header/Header.tsx
@@ -105,10 +105,13 @@ const Header = ({ handleDrawerOpen }: Props) => {
           </MobileIconButtonStyled>
         </Toolbar>
       </MuiAppBarStyled>
-      <ConnectionDialog
-        open={isConnectionDialogOpen}
-        onClose={() => setIsConnectionDialogOpen(false)}
-      />
+      {isConnectionDialogOpen && (
+        <ConnectionDialog
+          data-cy="dialog-connection"
+          open={isConnectionDialogOpen}
+          onClose={() => setIsConnectionDialogOpen(false)}
+        />
+      )}
     </>
   )
 }