Release 1.22.0

.dockerignore

@@ -2,10 +2,14 @@ Dockerfile
 .dockerignore
 node_modules
 npm-debug.log
-README.md
 .next
 .git
 coverage
 .DS_Store
 .idea
 dist
+
+build/
+coverage/
+cypress/
+out/

.env.example

@@ -40,4 +40,9 @@ NEXT_PUBLIC_FIREBASE_OPTIONS_STAGING=
 NEXT_PUBLIC_FIREBASE_VAPID_KEY_STAGING=
 
 # Redefine
-NEXT_PUBLIC_REDEFINE_API=
+NEXT_PUBLIC_REDEFINE_API=
+
+# Social Login
+NEXT_PUBLIC_SOCIAL_WALLET_OPTIONS_STAGING=
+NEXT_PUBLIC_SOCIAL_WALLET_OPTIONS_PRODUCTION=
+

.github/workflows/build/action.yml

@@ -43,6 +43,8 @@ runs:
         NEXT_PUBLIC_SAFE_RELAY_SERVICE_URL_STAGING: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_SAFE_GELATO_RELAY_SERVICE_URL_STAGING }}
         NEXT_PUBLIC_IS_OFFICIAL_HOST: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_IS_OFFICIAL_HOST }}
         NEXT_PUBLIC_REDEFINE_API: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_REDEFINE_API }}
+        NEXT_PUBLIC_SOCIAL_WALLET_OPTIONS_STAGING: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_SOCIAL_WALLET_OPTIONS_STAGING }}
+        NEXT_PUBLIC_SOCIAL_WALLET_OPTIONS_PRODUCTION: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_SOCIAL_WALLET_OPTIONS_PRODUCTION }}
         NEXT_PUBLIC_FIREBASE_OPTIONS_PRODUCTION: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_FIREBASE_OPTIONS_PRODUCTION }}
         NEXT_PUBLIC_FIREBASE_OPTIONS_STAGING: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_FIREBASE_OPTIONS_STAGING }}
         NEXT_PUBLIC_FIREBASE_VAPID_KEY_PRODUCTION: ${{ fromJSON(inputs.secrets).NEXT_PUBLIC_FIREBASE_VAPID_KEY_PRODUCTION }}

.github/workflows/e2e.yml

@@ -10,7 +10,11 @@ concurrency:
 jobs:
   e2e:
     runs-on: ubuntu-20.04
-    name: Smoke E2E tests
+    name: Cypress Smoke tests
+    strategy:
+      fail-fast: false
+      matrix:
+        containers: [1, 2, 3]
     steps:
       - uses: actions/checkout@v3
 
@@ -30,9 +34,12 @@ jobs:
 
       - uses: cypress-io/github-action@v4
         with:
+          parallel: true
           spec: cypress/e2e/smoke/*.cy.js
           browser: chrome
           record: true
           config: baseUrl=http://localhost:8080
+          group: 'Smoke tests'
         env:
           CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/safe-apps-e2e.yml

@@ -11,7 +11,11 @@ concurrency:
 jobs:
   e2e:
     runs-on: ubuntu-latest
-    name: Safe Apps E2E tests
+    name: Cypress Safe Apps tests
+    strategy:
+      fail-fast: false
+      matrix:
+        containers: [1, 2, 3]
     steps:
       - uses: actions/checkout@v3
 
@@ -31,10 +35,13 @@ jobs:
 
       - uses: cypress-io/github-action@v4
         with:
+          parallel: true
           spec: cypress/e2e/safe-apps/*.cy.js
           browser: chrome
           record: true
           config: baseUrl=http://localhost:8080
+          group: 'Safe Apps tests'
         env:
           CYPRESS_PROJECT_ID: okn21k
           CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_SAFE_APPS_RECORD_KEY }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

Dockerfile

@@ -1,21 +1,34 @@
-FROM node:18-alpine
+FROM node:18-alpine AS base
+ENV NEXT_TELEMETRY_DISABLED 1
+
+FROM base AS builder
+
 RUN apk add --no-cache libc6-compat git python3 py3-pip make g++ libusb-dev eudev-dev linux-headers
 WORKDIR /app
+
+# Install dependencies
+COPY package.json yarn.lock* ./
+RUN yarn --frozen-lockfile
 COPY . .
+RUN yarn run after-install
 
-# install deps
-RUN yarn install --frozen-lockfile
-RUN yarn after-install
+RUN yarn build
+
+# Production image
+FROM base AS runner
+WORKDIR /app
 
 ENV NODE_ENV production
+ENV REVERSE_PROXY_UI_PORT 8080
 
-# Next.js collects completely anonymous telemetry data about general usage.
-# Learn more here: https://nextjs.org/telemetry
-# Uncomment the following line in case you want to disable telemetry during the build.
-ENV NEXT_TELEMETRY_DISABLED 1
+RUN addgroup --system --gid 1001 nodejs && adduser --system --uid 1001 nextjs
+COPY --from=builder /app/out ./out
+
+# Set the correct permission for prerender cache
+RUN mkdir .next && chown nextjs:nodejs .next
 
-EXPOSE 3000
+USER nextjs
 
-ENV PORT 3000
+EXPOSE ${REVERSE_PROXY_UI_PORT}
 
-CMD ["yarn", "static-serve"]
+CMD npx -y serve out -p ${REVERSE_PROXY_UI_PORT}

cypress.config.js

@@ -5,7 +5,7 @@ export default defineConfig({
   trashAssetsBeforeRuns: true,
 
   retries: {
-    runMode: 3,
+    runMode: 1,
     openMode: 0,
   },
 

cypress/e2e/pages/address_book.page.js

@@ -67,6 +67,13 @@ export function verifyNewEntryAdded(name, address) {
   cy.contains(address).should('exist')
 }
 
+export function addEntry(name, address) {
+  typeInName(name)
+  typeInAddress(address)
+  clickOnSaveEntryBtn()
+  verifyNewEntryAdded(name, address)
+}
+
 export function clickOnEditEntryBtn() {
   cy.get(editEntryBtn).click({ force: true })
 }

cypress/e2e/pages/batches.pages.js

@@ -89,7 +89,7 @@ export function verifyAmountTransactionsInBatch(count) {
 }
 
 export function clickOnConfirmBatchBtn() {
-  cy.contains(confirmBatchBtn).click()
+  cy.get('button').contains(confirmBatchBtn).should('be.visible').should('be.enabled').click()
 }
 
 export function verifyBatchTransactionsCount(count) {

cypress/e2e/pages/create_wallet.pages.js

@@ -1,22 +1,25 @@
 import * as constants from '../../support/constants'
 
+const welcomeLoginScreen = '[data-testid="welcome-login"]'
+const expandMoreIcon = 'svg[data-testid="ExpandMoreIcon"]'
 const nameInput = 'input[name="name"]'
 const selectNetworkBtn = '[data-cy="create-safe-select-network"]'
 const ownerInput = 'input[name^="owners"][name$="name"]'
 const ownerAddress = 'input[name^="owners"][name$="address"]'
 const thresholdInput = 'input[name="threshold"]'
 export const removeOwnerBtn = 'button[aria-label="Remove owner"]'
 const connectingContainer = 'div[class*="connecting-container"]'
-const createNewSafeBtn = 'span[data-track="create-safe: Open stepper"]'
+const createNewSafeBtn = 'span[data-track="create-safe: Continue to creation"]'
+const connectWalletBtn = 'Connect wallet'
 
 const changeNetworkWarningStr = 'Change your wallet network'
 const safeAccountSetupStr = 'Safe Account setup'
-const policy1_1 = '1/1 policy'
+const policy1_2 = '1/1 policy'
 export const walletName = 'test1-sepolia-safe'
-export const defaltSepoliaPlaceholder = 'sepolia-safe'
+export const defaltSepoliaPlaceholder = 'Sepolia Safe'
 
 export function verifyPolicy1_1() {
-  cy.contains(policy1_1).should('exist')
+  cy.contains(policy1_2).should('exist')
   // TOD: Need data-cy for containers
 }
 
@@ -49,13 +52,23 @@ export function clickOnCreateNewSafeBtn() {
   cy.get(createNewSafeBtn).click().wait(1000)
 }
 
+export function clickOnConnectWalletBtn() {
+  cy.get(welcomeLoginScreen).within(() => {
+    cy.get('button').contains(connectWalletBtn).should('be.visible').should('be.enabled').click().wait(1000)
+  })
+}
+
 export function typeWalletName(name) {
   cy.get(nameInput).type(name).should('have.value', name)
 }
 
+export function clearWalletName() {
+  cy.get(nameInput).clear()
+}
+
 export function selectNetwork(network, regex = false) {
   cy.wait(1000)
-  cy.get(selectNetworkBtn).should('be.visible').click()
+  cy.get(expandMoreIcon).eq(1).parents('div').eq(1).click()
   cy.wait(1000)
   cy.get('li').contains(network).click()
   cy.get('body').click()
@@ -91,7 +104,7 @@ export function typeOwnerAddress(address, index, clearOnly = false) {
 }
 
 export function clickOnAddNewOwnerBtn() {
-  cy.contains('button', 'Add new owner').click()
+  cy.contains('button', 'Add new owner').click().wait(700)
 }
 
 export function addNewOwner(name, address, index) {

cypress/e2e/pages/dashboard.pages.js

@@ -5,6 +5,8 @@ const transactionQueueStr = 'Pending transactions'
 const noTransactionStr = 'This Safe has no queued transactions'
 const overviewStr = 'Overview'
 const viewAssetsStr = 'View assets'
+const sendStr = 'Send'
+const receiveStr = 'Receive'
 const tokensStr = 'Tokens'
 const nftStr = 'NFTs'
 const viewAllStr = 'View all'
@@ -27,11 +29,10 @@ export function verifyOverviewWidgetData() {
 
   cy.get('@overviewSection').within(() => {
     // Prefix is separated across elements in EthHashInfo
-    cy.contains(constants.SEPOLIA_TEST_SAFE_5).should('exist')
     cy.get('h2').contains('Overview')
-    cy.get(`a[href="${constants.BALANCE_URL}${encodeURIComponent(constants.SEPOLIA_TEST_SAFE_5)}"]`).contains(
-      viewAssetsStr,
-    )
+    cy.get(`a[href="${constants.BALANCE_URL}${encodeURIComponent(constants.SEPOLIA_TEST_SAFE_5)}"]`).contains('Tokens')
+    cy.get('button').contains(sendStr)
+    cy.get('button').contains(receiveStr)
   })
 }
 

cypress/e2e/pages/import_export.pages.js

@@ -25,7 +25,7 @@ export function clickOnImportBtn() {
 }
 
 export function clickOnImportBtnDataImportModal() {
-  cy.contains(dataImportModalStr).parent().contains('button', 'Import').click()
+  cy.contains('button', 'Import').click()
 }
 
 export function uploadFile(filePath) {
@@ -44,6 +44,10 @@ export function clickOnImportedSafe(safe) {
   cy.contains(safe).click()
 }
 
+export function clickOnOpenSafeListSidebar() {
+  cy.contains('My Safe Accounts').click()
+}
+
 export function clickOnClosePushNotificationsBanner() {
   cy.waitForSelector(() => {
     return cy.get('h6').contains(enablePushNotificationsStr).siblings('.MuiButtonBase-root').click({ force: true })

cypress/e2e/pages/load_safe.pages.js

@@ -1,6 +1,6 @@
 import * as constants from '../../support/constants'
 
-const addExistingAccountBtnStr = 'Add existing Account'
+const addExistingAccountBtnStr = 'Add existing one'
 const contactStr = 'Name, address & network'
 const invalidAddressFormatErrorMsg = 'Invalid address format'
 
@@ -16,7 +16,7 @@ const ownersConfirmationsStr = 'Owners and confirmations'
 const transactionStr = 'Transactions'
 
 export function openLoadSafeForm() {
-  cy.contains('button', addExistingAccountBtnStr).click()
+  cy.contains('a', addExistingAccountBtnStr).click()
   cy.contains(contactStr)
 }
 
@@ -39,6 +39,10 @@ export function selectPolygon() {
   cy.contains('span', constants.networks.polygon)
 }
 
+export function inputNameAndAddress(name, address) {
+  inputName(name)
+  inputAddress(address)
+}
 export function inputName(name) {
   cy.get(nameInput).type(name).should('have.value', name)
 }

cypress/e2e/pages/owners.pages.js

@@ -19,6 +19,7 @@ const thresholdDropdown = 'div[aria-haspopup="listbox"]'
 const thresholdOption = 'li[role="option"]'
 const existingOwnerAddressInput = (index) => `input[name="owners.${index}.address"]`
 const existingOwnerNameInput = (index) => `input[name="owners.${index}.name"]`
+const singleOwnerNameInput = 'input[name="name"]'
 
 const disconnectBtnStr = 'Disconnect'
 const notConnectedStatus = 'Connect'
@@ -57,9 +58,9 @@ export function verifyExistingOwnerName(index, name) {
   cy.get(existingOwnerNameInput(index)).should('have.value', name)
 }
 
-export function typeExistingOwnerName(index, name) {
-  cy.get(existingOwnerNameInput(index)).clear().type(name)
-  main.verifyInputValue(existingOwnerNameInput(index), name)
+export function typeExistingOwnerName(name) {
+  cy.get(singleOwnerNameInput).clear().type(name)
+  main.verifyInputValue(singleOwnerNameInput, name)
 }
 
 export function verifyOwnerDeletionWindowDisplayed() {