Release 1.2.0

.github/workflows/cla.yml

@@ -0,0 +1,40 @@
+name: 'CLA Assistant'
+
+on:
+  issue_comment:
+    types: [created]
+  pull_request_target:
+    types: [opened, closed, synchronize]
+
+jobs:
+  CLAAssistant:
+    runs-on: ubuntu-latest
+    steps:
+      - name: 'CLA Assistant'
+        if: (github.event.comment.body == 'recheck' || github.event.comment.body == 'I have read the CLA Document and I hereby sign the CLA') || github.event_name == 'pull_request_target'
+        # Beta Release
+        uses: contributor-assistant/[email protected]
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          # the below token should have repo scope and must be manually added by you in the repository's secret
+          PERSONAL_ACCESS_TOKEN: ${{ secrets.CLA_ACCESS_TOKEN }}
+        with:
+          path-to-signatures: 'signatures/version1/cla.json'
+          path-to-document: 'https://safe.global/cla/' # e.g. a CLA or a DCO document
+          # branch should not be protected
+          branch: 'main'
+          # user names of users allowed to contribute without CLA
+          allowlist: lukasschor,mikheevm,rmeissner,germartinez,Uxio0,dasanra,francovenica,tschubotz,luarx,gnosis-info,bot*,DaniSomoza,iamacook,yagopv,usame-algan,schmanu,DiogoSoaress,JagoFigueroa
+
+          # the followings are the optional inputs - If the optional inputs are not given, then default values will be taken
+          # enter the remote organization name where the signatures should be stored (Default is storing the signatures in the same repository)
+          remote-organization-name: 'safe-global'
+          # enter the  remote repository name where the signatures should be stored (Default is storing the signatures in the same repository)
+          remote-repository-name: 'cla-signatures'
+          #create-file-commit-message: 'For example: Creating file for storing CLA Signatures'
+          #signed-commit-message: 'For example: $contributorName has signed the CLA in #$pullRequestNo'
+          #custom-notsigned-prcomment: 'pull request comment with Introductory message to ask new contributors to sign'
+          #custom-pr-sign-comment: 'The signature to be committed in order to sign the CLA'
+          #custom-allsigned-prcomment: 'pull request comment when all contributors has signed, defaults to **CLA Assistant Lite bot** All Contributors have signed the CLA.'
+          #lock-pullrequest-aftermerge: false - if you don't want this bot to automatically lock the pull request after merging (default - true)
+          #use-dco-flag: true - If you are using DCO instead of CLA

.github/workflows/deploy.yml

@@ -11,7 +11,11 @@ on:
 jobs:
   deploy:
     runs-on: ubuntu-latest
+    permissions:
+      pull-requests: write
+
     name: Deploy to dev/staging
+
     steps:
       - name: Cancel previous runs
         uses: styfle/[email protected]
@@ -20,6 +24,18 @@ jobs:
 
       - uses: actions/checkout@v3
 
+      # Post a PR comment before deploying
+      - name: Post a comment while building
+        if: github.event.number
+        uses: mshick/add-pr-comment@v2
+        with:
+          message-id: praul
+          message: |
+            ## Branch preview
+            ⏳ Deploying a preview site...
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
+          repo-token-user-login: 'github-actions[bot]'
+
       - name: Install Node modules
         run: yarn install --immutable
 
@@ -62,19 +78,33 @@ jobs:
           BUCKET: s3://${{ secrets.AWS_DEVELOPMENT_BUCKET_NAME }}
         run: bash ./scripts/github/s3_upload.sh
 
-      # PRs
+      ### PRs ###
+
+      # Extract branch name
+      - name: Extract branch name
+        shell: bash
+        ## Cut off "refs/heads/" and only allow alphanumeric characters, e.g. "refs/heads/features/hello-1.2.0" -> "features-hello120"
+        run: echo "##[set-output name=branch;]$(echo $GITHUB_HEAD_REF | sed 's/refs\/heads\///' | sed 's/[^a-zA-Z0-9]//g')"
+        id: extract_branch
+
+      # Deploy to S3
       - name: Deploy PR branch
-        if: github.ref != 'refs/heads/dev' && github.ref != 'refs/heads/main'
+        if: github.event.number
         env:
-          BUCKET: s3://${{ secrets.AWS_REVIEW_BUCKET_NAME }}/webcore/pr${{ github.event.number }}
+          BUCKET: s3://${{ secrets.AWS_REVIEW_BUCKET_NAME }}/webcore/${{ steps.extract_branch.outputs.branch }}
         run: bash ./scripts/github/s3_upload.sh
 
-      - name: 'Post the deployment links in the PR'
-        if: success() && github.ref != 'refs/heads/dev' && github.ref != 'refs/heads/main'
-        uses: mshick/add-pr-comment@v1
+      # Comnment
+      - name: Post a deployment link in the PR
+        if: always() && github.event.number
+        uses: mshick/add-pr-comment@v2
         with:
+          message-id: praul
           message: |
             ## Branch preview
-            https://pr${{ github.event.number }}--webcore.review-react-br.5afe.dev
-          repo-token: ${{ secrets.GITHUB_TOKEN }}
-          repo-token-user-login: 'github-actions[bot]'
+            ✅  Deploy successful!
+
+            https://${{ steps.extract_branch.outputs.branch }}--webcore.review-web-core.5afe.dev
+          message-failure: |
+            ## Branch preview
+            ❌  Deploy failed!

CONTRIBUTING.md

@@ -4,6 +4,10 @@ When contributing to this repository, please first discuss the change you wish t
 
 Please note we have a Code of Conduct (see below), please follow it in all your interactions with the project.
 
+## CLA
+
+It is a requirement for all contributors to sign the [Contributor License Agreement (CLA)](safe.global/cla/) in order to proceed with their contribution.
+
 ## Pull Request Process
 
 - When opening a pull request, please make sure to fully fill out the pull request template that will appear in the description text box.

cypress/e2e/create_tx.cy.js

@@ -4,6 +4,7 @@ const EOA = '0xE297437d6b53890cbf004e401F3acc67c8b39665'
 // generate number between 0.00001 and 0.00020
 const sendValue = Math.floor(Math.random() * 20 + 1) / 100000
 let recommendedNonce
+const currentNonce = 3
 
 describe('Queue a transaction on 1/N', () => {
   before(() => {
@@ -35,17 +36,15 @@ describe('Queue a transaction on 1/N', () => {
 
     // Insert amount
     cy.get('input[name="amount"]').type(`${sendValue}`)
+
+    cy.contains('Next').click()
   })
 
   it('should create a queued transaction', () => {
     // Wait for /estimations response
     cy.intercept('POST', '/**/multisig-transactions/estimations').as('EstimationRequest')
 
-    cy.contains('Next').click()
-
-    cy.wait('@EstimationRequest', {
-      timeout: 30_000, // EstimationRequest takes a while in CI
-    })
+    cy.wait('@EstimationRequest')
 
     // Alias for New transaction modal
     cy.contains('h2', 'Review transaction').parents('div').as('modal')
@@ -62,7 +61,7 @@ describe('Queue a transaction on 1/N', () => {
     // Changes nonce to next one
     cy.contains('Signing the transaction with nonce').click()
     cy.contains('button', 'Edit').click()
-    cy.get('label').contains('Safe transaction nonce').next().clear().type('3')
+    cy.get('label').contains('Safe transaction nonce').next().clear().type(currentNonce)
     cy.contains('Confirm').click()
 
     // Asserts the execute checkbox exists
@@ -103,16 +102,14 @@ describe('Queue a transaction on 1/N', () => {
     cy.get('@modal').within(() => {
       cy.get('input[type="checkbox"]').should('not.exist')
     })
-  })
 
-  it('should click the notification and see the transaction queued', () => {
     cy.contains('Submit').click()
+  })
 
+  it('should click the notification and see the transaction queued', () => {
     // Wait for the /propose request
     cy.intercept('POST', '/**/propose').as('ProposeTx')
-    cy.wait('@ProposeTx', {
-      timeout: 30_000, // ProposeTx takes a while in CI
-    })
+    cy.wait('@ProposeTx')
 
     // Click on the notification
     cy.contains('View transaction').click()
@@ -121,7 +118,7 @@ describe('Queue a transaction on 1/N', () => {
     cy.contains('h3', 'Transaction details').should('be.visible')
 
     // Queue label
-    cy.contains('Queued - transaction with nonce 3 needs to be executed first').should('be.visible')
+    cy.contains(`Queued - transaction with nonce ${currentNonce} needs to be executed first`).should('be.visible')
 
     // Transaction summary
     cy.contains(`${recommendedNonce}` + 'Send' + '-' + `${sendValue} GOR`).should('exist')

cypress/e2e/safe-apps/browser_permissions.cy.js

@@ -31,7 +31,7 @@ describe('The Browser permissions system', () => {
         .click()
         .should(() => {
           expect(window.localStorage.getItem(BROWSER_PERMISSIONS_KEY)).to.eq(
-            '{"https://safe-test-app.com/app":[{"feature":"camera","status":"granted"},{"feature":"microphone","status":"denied"}]}',
+            '{"https://safe-test-app.com":[{"feature":"camera","status":"granted"},{"feature":"microphone","status":"denied"}]}',
           )
         })
     })

cypress/e2e/safe-apps/custom_apps.cy.js

@@ -0,0 +1,32 @@
+const appUrl = 'https://safe-custom-app.com'
+
+describe('When visiting a custom Safe App', () => {
+  beforeEach(() => {
+    cy.fixture('safe-app').then((html) => {
+      cy.intercept('GET', `${appUrl}`, html)
+      cy.intercept('GET', `${appUrl}/manifest.json`, {
+        name: 'Cypress Test App',
+        description: 'Cypress Test App Description',
+        icons: [{ src: 'logo.svg', sizes: 'any', type: 'image/svg+xml' }],
+      })
+    })
+  })
+
+  it('should show the custom app warning', () => {
+    cy.visitSafeApp(`${appUrl}`)
+
+    cy.findByText(/accept selection/i).click()
+    cy.findByRole('heading', { content: /warning/i })
+    cy.findByText('https://safe-custom-app.com')
+    cy.reload()
+    cy.findByRole('heading', { content: /warning/i })
+    cy.findByText('https://safe-custom-app.com')
+  })
+
+  it('should stop showing the warning when the check is marked', () => {
+    cy.findByRole('checkbox').should('exist').click()
+    cy.findByRole('button', { name: /continue/i }).click()
+    cy.reload()
+    cy.findByRole('heading', { content: /warning/i }).should('not.exist')
+  })
+})

cypress/e2e/safe-apps/tx_modal.cy.js

@@ -1,6 +1,6 @@
 import { TEST_SAFE } from './constants'
 
-const appUrl = 'http://safe-test-app.com'
+const appUrl = 'https://safe-test-app.com'
 
 describe('The transaction modal', () => {
   before(() => {

cypress/support/safe-apps-commands.js

@@ -1,11 +1,13 @@
 import { INFO_MODAL_KEY, TEST_SAFE } from '../e2e/safe-apps/constants'
 
+const allowedApps = ['https://safe-test-app.com']
+
 Cypress.Commands.add('visitSafeApp', (appUrl, testSafe = TEST_SAFE) => {
   cy.on('window:before:load', (window) => {
     window.localStorage.setItem(
       INFO_MODAL_KEY,
       JSON.stringify({
-        5: { consentsAccepted: true },
+        5: { consentsAccepted: true, warningCheckedCustomApps: allowedApps },
       }),
     )
   })

package.json

@@ -3,7 +3,7 @@
   "homepage": "https://github.com/safe-global/web-core",
   "license": "MIT",
   "type": "module",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -39,20 +39,20 @@
     "@emotion/server": "^11.10.0",
     "@emotion/styled": "^11.10.0",
     "@gnosis.pm/safe-apps-sdk": "^7.8.0",
-    "@gnosis.pm/safe-core-sdk": "^3.2.0",
     "@gnosis.pm/safe-deployments": "^1.17.0",
-    "@gnosis.pm/safe-ethers-lib": "^1.7.0",
     "@gnosis.pm/safe-modules-deployments": "^1.0.0",
-    "@gnosis.pm/safe-react-gateway-sdk": "^3.4.6",
     "@mui/icons-material": "^5.8.4",
     "@mui/material": "^5.9.3",
     "@mui/x-date-pickers": "^5.0.0-beta.6",
     "@reduxjs/toolkit": "^1.8.2",
+    "@safe-global/safe-core-sdk": "^3.2.1",
+    "@safe-global/safe-ethers-lib": "^1.7.0",
+    "@safe-global/safe-gateway-typescript-sdk": "^3.5.4",
     "@sentry/react": "^7.8.1",
     "@sentry/tracing": "^7.8.1",
     "@truffle/hdwallet-provider": "^2.0.14",
     "@web3-onboard/coinbase": "^2.1.3",
-    "@web3-onboard/core": "2.10.0",
+    "@web3-onboard/core": "2.8.5",
     "@web3-onboard/fortmatic": "^2.0.14",
     "@web3-onboard/injected-wallets": "^2.3.0",
     "@web3-onboard/keystone": "^2.3.2",
@@ -84,8 +84,8 @@
     "semver": "^7.3.7"
   },
   "devDependencies": {
-    "@gnosis.pm/safe-core-sdk-types": "^1.7.0",
     "@next/bundle-analyzer": "^12.2.4",
+    "@safe-global/safe-core-sdk-types": "^1.7.0",
     "@sentry/types": "^7.8.1",
     "@svgr/webpack": "^6.3.1",
     "@testing-library/cypress": "^8.0.7",

src/components/address-book/AddressBookTable/index.tsx

@@ -10,7 +10,7 @@ import Button from '@mui/material/Button'
 import IconButton from '@mui/material/IconButton'
 import Tooltip from '@mui/material/Tooltip'
 import RemoveDialog from '@/components/address-book/RemoveDialog'
-import useIsSafeOwner from '@/hooks/useIsSafeOwner'
+import useIsGranted from '@/hooks/useIsGranted'
 import NewTxModal from '@/components/tx/modals/NewTxModal'
 import css from './styles.module.css'
 import EthHashInfo from '@/components/common/EthHashInfo'
@@ -47,7 +47,7 @@ const defaultOpen = {
 
 const AddressBookTable = () => {
   const chain = useCurrentChain()
-  const isSafeOwner = useIsSafeOwner()
+  const isGranted = useIsGranted()
   const [open, setOpen] = useState<typeof defaultOpen>(defaultOpen)
   const [searchQuery, setSearchQuery] = useState('')
   const [defaultValues, setDefaultValues] = useState<AddressEntry | undefined>(undefined)
@@ -110,7 +110,7 @@ const AddressBookTable = () => {
             </Tooltip>
           </Track>
 
-          {isSafeOwner && (
+          {isGranted && (
             <Track {...ADDRESS_BOOK_EVENTS.SEND}>
               <Button
                 variant="contained"

src/components/address-book/ExportDialog/index.tsx

@@ -1,7 +1,6 @@
 import DialogContent from '@mui/material/DialogContent'
 import DialogActions from '@mui/material/DialogActions'
 import Button from '@mui/material/Button'
-import Link from '@mui/material/Link'
 import Typography from '@mui/material/Typography'
 import { useCSVDownloader } from 'react-papaparse'
 import type { SyntheticEvent } from 'react'
@@ -11,6 +10,7 @@ import ModalDialog from '@/components/common/ModalDialog'
 import { type AddressBookState, selectAllAddressBooks } from '@/store/addressBookSlice'
 import { useAppSelector } from '@/store'
 import { trackEvent, ADDRESS_BOOK_EVENTS } from '@/services/analytics'
+import ExternalLink from '@/components/common/ExternalLink'
 
 const COL_1 = 'address'
 const COL_2 = 'name'
@@ -65,14 +65,12 @@ const ExportDialog = ({ handleClose }: { handleClose: () => void }): ReactElemen
         </Typography>
 
         <Typography mt={1}>
-          <Link
-            href="https://help.gnosis-safe.io/en/articles/5299068-address-book-export-and-import"
-            target="_blank"
-            rel="noreferrer"
+          <ExternalLink
+            href="https://help.safe.global/en/articles/5299068-address-book-export-and-import"
             title="Learn about the address book import and export"
           >
             Learn about the address book import and export
-          </Link>
+          </ExternalLink>
         </Typography>
       </DialogContent>