Add Porto

.gitignore

@@ -25,7 +25,7 @@ node_modules
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-tsconfig.tsbuildinfo
+*.tsbuildinfo
 tsconfig.vitest-temp.json
 
 # local env files

e2e/specs/stateless/profileEditor.spec.ts

@@ -287,6 +287,7 @@ test.describe('legacy resolver', () => {
 
 test.describe('custom legacy resolver', () => {
   test('should be able to add/update profile records without migration', async ({
+    page,
     login,
     makeName,
     makePageObject,
@@ -298,6 +299,7 @@ test.describe('custom legacy resolver', () => {
       resolver: customLegacyResolver,
       records: await makeRecords(),
     })
+    await testClient.mine({ blocks: 1 })
 
     const morePage = makePageObject('MorePage')
     const profilePage = makePageObject('ProfilePage')
@@ -317,6 +319,7 @@ test.describe('custom legacy resolver', () => {
     await expect(profilePage.record('address', 'etcLegacy')).toHaveText('etcLegacy0x3C4...293BC')
     await expect(profilePage.record('text', 'email')).toHaveText('[email protected]')
 
+    await page.waitForTimeout(5000)
     await profilePage.editProfileButton.click()
 
     // await profilePage.profileEditor.getByTestId('warning-overlay-skip-button').click()
@@ -383,6 +386,7 @@ test.describe('custom legacy resolver', () => {
     await expect(profilePage.record('address', 'etcLegacy')).toHaveText('etcLegacy0x3C4...293BC')
     await expect(profilePage.record('text', 'email')).toHaveText('[email protected]')
 
+    await page.waitForTimeout(5000)
     await profilePage.editProfileButton.click()
 
     // await profilePage.profileEditor.getByTestId('warning-overlay-skip-button').click()
@@ -723,7 +727,6 @@ test.describe('outdated resolver', () => {
       type: 'legacy',
       owner: 'user',
       resolver: outdatedResolver,
-      records: await makeRecords(),
     })
 
     await generateRecords({ accounts })({
@@ -789,7 +792,6 @@ test.describe('outdated resolver', () => {
       type: 'legacy',
       owner: 'user',
       resolver: outdatedResolver,
-      records: await makeRecords(),
     })
 
     await generateRecords({ accounts })({
@@ -947,7 +949,6 @@ test.describe('unauthorised resolver', () => {
       type: 'legacy',
       owner: 'user2',
       resolver: ownedResolverAddress as Address,
-      records: await makeRecords(),
     })
 
     const morePage = makePageObject('MorePage')
@@ -982,7 +983,6 @@ test.describe('invalid resolver', () => {
       type: 'legacy',
       owner: 'user',
       resolver: invalidResolverAddress as Address,
-      records: await makeRecords(),
     })
 
     const morePage = makePageObject('MorePage')

e2e/specs/stateless/wrapName.spec.ts

@@ -262,27 +262,43 @@ test('should calculate needed steps without localstorage', async ({
   await transactionModal.introButton.click()
   await transactionModal.confirm()
   await expect(transactionModal.completeButton).toBeEnabled()
+  await transactionModal.completeButton.click()
 
-  await page.waitForTimeout(10000)
+  // Wait for transaction to be mined
+  await testClient.mine({ blocks: 1 })
 
   await page.evaluate(() => window.localStorage.clear())
   await page.evaluate(() => window.sessionStorage.clear())
   await page.reload()
+  await page.waitForLoadState('networkidle')
   await login.reconnect()
 
   await morePage.wrapButton.click()
 
-  await expect(page.getByTestId('display-item-Step 1-normal')).toContainText('Migrate profile', {
-    timeout: 10000,
+  // Wait for the step to exist AND contain the correct text
+  await page
+    .locator('[data-testid="display-item-Step 1-normal"]:has-text("Migrate profile")')
+    .waitFor({
+      timeout: 15000,
+    })
+  await page.locator('[data-testid="display-item-Step 2-normal"]:has-text("Wrap name")').waitFor({
+    timeout: 15000,
   })
+
+  await expect(page.getByTestId('display-item-Step 1-normal')).toContainText('Migrate profile')
   await expect(page.getByTestId('display-item-Step 2-normal')).toContainText('Wrap name')
 
   await transactionModal.introButton.click()
   await transactionModal.confirm()
   await expect(transactionModal.completeButton).toBeEnabled()
+  await transactionModal.completeButton.click()
+
+  // Wait for transaction to be mined
+  await testClient.mine({ blocks: 1 })
 
   await page.evaluate(() => localStorage.clear())
   await page.reload()
+  await page.waitForLoadState('networkidle')
   await login.reconnect()
 
   await morePage.wrapButton.click()

package.json

@@ -59,7 +59,7 @@
     "@ensdomains/content-hash": "^3.0.0-beta.5",
     "@ensdomains/ens-contracts": "1.5.2",
     "@ensdomains/ens-test-env": "1.0.1",
-    "@ensdomains/ensjs": "4.1.1",
+    "@ensdomains/ensjs": "4.1.2",
     "@ensdomains/thorin": "1.0.0-beta.28",
     "@getpara/rainbowkit": "1.4.0",
     "@getpara/rainbowkit-wallet": "1.4.0",
@@ -68,13 +68,13 @@
     "@noble/hashes": "^1.3.2",
     "@splidejs/react-splide": "^0.7.12",
     "@svgr/webpack": "^8.1.0",
-    "@tanstack/query-persist-client-core": "5.22.2",
-    "@tanstack/query-sync-storage-persister": "5.22.2",
-    "@tanstack/react-query": "5.22.2",
-    "@tanstack/react-query-devtools": "^5.59.0",
-    "@tanstack/react-query-persist-client": "5.22.2",
+    "@tanstack/query-persist-client-core": "5.59.0",
+    "@tanstack/query-sync-storage-persister": "5.59.0",
+    "@tanstack/react-query": "5.59.0",
+    "@tanstack/react-query-devtools": "5.59.0",
+    "@tanstack/react-query-persist-client": "5.59.0",
+    "@wagmi/core": "2.20.3",
     "@thirdweb-dev/wagmi-adapter": "^0.2.151",
-    "@wagmi/core": "2.13.3",
     "calendar-link": "^2.8.0",
     "dequal": "2.0.3",
     "dns-packet": "^5.4.0",
@@ -84,13 +84,14 @@
     "i18next": "^21.9.1",
     "i18next-browser-languagedetector": "^6.1.5",
     "i18next-http-backend": "^1.4.1",
-    "idb-keyval": "^6.2.1",
+    "idb-keyval": "^6.2.2",
     "immer": "^9.0.15",
     "iso-639-1": "^2.1.15",
     "markdown-to-jsx": "^7.7.3",
     "next": "13.5.8",
     "node-fetch": "^3.3.2",
     "node-forge": "1.3.1",
+    "porto": "^0.1.0",
     "posthog-js": "^1.236.8",
     "react": "*",
     "react-confetti": "6.1.0",
@@ -106,8 +107,8 @@
     "tinyglobby": "^0.2.6",
     "ts-pattern": "^4.3.0",
     "use-immer": "^0.7.0",
-    "viem": "2.19.4",
-    "wagmi": "2.12.4"
+    "viem": "2.37.5",
+    "wagmi": "2.16.9"
   },
   "peerDependencies": {
     "react": "*",
@@ -192,7 +193,7 @@
   "pnpm": {
     "overrides": {
       "@nomiclabs/hardhat-ethers": "npm:[email protected]",
-      "@wagmi/core": "2.13.3",
+      "@wagmi/core": "2.20.3",
       "@walletconnect/ethereum-provider": "2.11.1",
       "@walletconnect/modal": "2.6.2",
       "aggregate-error": "npm:@socketregistry/aggregate-error@^1",

playwright/fixtures/accounts.ts

@@ -1,7 +1,9 @@
 /* eslint-disable import/no-extraneous-dependencies */
 import dotenv from 'dotenv'
-import { Account, Address, bytesToHex, Hash } from 'viem'
-import { mnemonicToAccount, nonceManager, privateKeyToAccount } from 'viem/accounts'
+import { Account, Address, bytesToHex, createNonceManager, Hash } from 'viem'
+import { mnemonicToAccount, privateKeyToAccount } from 'viem/accounts'
+
+import { temporaryNonceManagerSource } from './makeName/utils/temporaryNonceManagerSource'
 
 dotenv.config()
 
@@ -21,6 +23,7 @@ const users = ['user', 'user2', 'user3', 'user4'] as const
 export type User = (typeof users)[number]
 
 export const createAccounts = (stateful = false) => {
+  const nonceManager = createNonceManager({ source: temporaryNonceManagerSource() })
   const mnemonic = stateful ? process.env.SECRET_WORDS || DEFAULT_MNEMONIC : DEFAULT_MNEMONIC
 
   const { accounts, privateKeys } = users.reduce<{ accounts: Account[]; privateKeys: Hash[] }>(

playwright/fixtures/makeName/generators/generateLegacySubname.ts

@@ -48,12 +48,15 @@ export const generateLegacySubname =
     const subname = `${label}.${name}`
     console.log('generating legacy subname:', subname)
 
+    const nameOwnerAccount = accounts.getAccountForUser(nameOwner)
     const tx = await createSubname(walletClient, {
       name: `${label}.${name}`,
       contract: 'registry',
       owner: accounts.getAddress(owner) as `0x${string}`,
-      account: accounts.getAccountForUser(nameOwner),
       resolverAddress: resolver ?? DEFAULT_RESOLVER,
+      account: nameOwnerAccount,
+      // @ts-expect-error
+      nonceManager: nameOwnerAccount.nonceManager,
     })
     await waitForTransaction(tx)
 
@@ -68,6 +71,7 @@ export const generateLegacySubname =
     }
 
     if (type === 'wrapped') {
+      const ownerAccount = accounts.getAccountForUser(owner)
       const approveTx = await walletClient.writeContract({
         abi: registrySetApprovalForAllSnippet,
         address: getChainContractAddress({
@@ -82,20 +86,24 @@ export const generateLegacySubname =
           }),
           true,
         ],
-        account: accounts.getAddress(owner) as `0x${string}`,
+        account: ownerAccount,
+        // @ts-expect-error
+        nonceManager: ownerAccount.nonceManager,
       })
       const approve = await waitForTransaction(approveTx)
       if (approve.status === 'success') console.log('approved name wrapper')
       else throw new Error(`failed to approve name wrapper`)
 
       const wrapTx = await wrapName(walletClient, {
         name: subname,
-        newOwnerAddress: accounts.getAddress(owner) as `0x${string}`,
+        newOwnerAddress: ownerAccount.address,
         resolverAddress: getChainContractAddress({
           client: walletClient,
           contract: 'ensPublicResolver',
         }),
-        account: accounts.getAddress(owner) as `0x${string}`,
+        account: ownerAccount,
+        // @ts-expect-error
+        nonceManager: ownerAccount.nonceManager,
       })
       const wrap = await waitForTransaction(wrapTx)
       if (wrap.status === 'success') console.log('wrapped subname:', subname)

playwright/fixtures/makeName/generators/generateRecords.ts

@@ -1,7 +1,6 @@
 /* eslint-disable import/no-extraneous-dependencies */
 
 /* eslint-disable no-await-in-loop */
-import { Hash } from 'viem'
 
 import { RecordOptions } from '@ensdomains/ensjs/utils'
 import { setRecords } from '@ensdomains/ensjs/wallet'
@@ -29,14 +28,17 @@ export const generateRecords =
 
     const { texts = [], coins = [], contentHash, abi } = records
 
+    const ownerAccount = accounts.getAccountForUser(owner)
     const tx = await setRecords(walletClient, {
       name,
       resolverAddress: resolver,
       coins,
       texts,
       contentHash,
-      account: accounts.getAddress(owner) as Hash,
       abi,
+      account: ownerAccount,
+      // @ts-expect-error
+      nonceManager: ownerAccount.nonceManager,
     })
     await waitForTransaction(tx)
   }

playwright/fixtures/makeName/generators/generateWrappedSubname.ts

@@ -57,14 +57,17 @@ export const generateWrappedSubname =
 
     // Make subname with resolver
 
+    const account = accounts.getAccountForUser(nameOwner)
     const tx = await createSubname(walletClient, {
       name: `${label}.${name}`,
       contract: 'nameWrapper',
       fuses,
       owner: accounts.getAddress(owner) as `0x${string}`,
-      account: accounts.getAddress(nameOwner) as `0x${string}`,
       resolverAddress: resolver,
       expiry,
+      account,
+      // @ts-expect-error
+      nonceManager: account.nonceManager,
     })
     await waitForTransaction(tx)
 

playwright/fixtures/makeName/generators/legacyNameGenerator.ts

@@ -51,7 +51,7 @@ export const makeLegacyNameGenerator = ({ accounts }: Dependencies) => ({
   commit: async (nameConfig: LegacyName) => {
     const { label, owner, secret } = nameWithDefaults(nameConfig)
     const name = `${label}.eth`
-    const ownerAddress = accounts.getAddress(owner)
+    const ownerAccount = accounts.getAccountForUser(owner)
 
     console.log('make commit:', name)
 
@@ -60,7 +60,7 @@ export const makeLegacyNameGenerator = ({ accounts }: Dependencies) => ({
       data: encodeFunctionData({
         functionName: 'makeCommitment',
         abi: legacyEthRegistrarControllerAbi,
-        args: [label, ownerAddress, secret],
+        args: [label, ownerAccount.address, secret],
       }),
     })
 
@@ -72,15 +72,16 @@ export const makeLegacyNameGenerator = ({ accounts }: Dependencies) => ({
         args: [commitment],
       }),
       gas: 1000000n,
-      account: accounts.getAccountForUser(owner),
+      account: ownerAccount,
+      nonceManager: ownerAccount.nonceManager,
     })
 
     return walletClient.sendTransaction(preparedTransaction)
   },
   register: async (nameConfig: LegacyName) => {
     const { label, owner, duration, secret } = nameWithDefaults(nameConfig)
 
-    const ownerAddress = accounts.getAddress(owner)
+    const ownerAccount = accounts.getAccountForUser(owner)
 
     const price = await getLegacyRentPrice({ label, duration })
 
@@ -89,19 +90,20 @@ export const makeLegacyNameGenerator = ({ accounts }: Dependencies) => ({
       data: encodeFunctionData({
         functionName: 'register',
         abi: legacyEthRegistrarControllerAbi,
-        args: [label, ownerAddress, duration, secret],
+        args: [label, ownerAccount.address, duration, secret],
       }),
       value: price,
       gas: 1000000n,
-      account: accounts.getAccountForUser(owner),
+      account: ownerAccount,
+      nonceManager: ownerAccount.nonceManager,
     })
 
     return walletClient.sendTransaction(preparedTransaction)
   },
   configure: async (nameConfig: LegacyName) => {
     const { label, owner, manager, subnames = [], secret } = nameWithDefaults(nameConfig)
     const name = `${label}.eth`
-    
+
     // Create subnames
     for (const subname of subnames) {
       await generateLegacySubname({ accounts })({
@@ -113,11 +115,14 @@ export const makeLegacyNameGenerator = ({ accounts }: Dependencies) => ({
 
     if (!!manager && manager !== owner) {
       console.log('setting manager:', name, manager)
+      const ownerAccount = accounts.getAccountForUser(owner)
       const tx = await transferName(walletClient, {
         name,
         newOwnerAddress: accounts.getAddress(manager) as `0x${string}`,
         contract: 'registry',
-        account: accounts.getAddress(owner) as `0x${string}`,
+        account: ownerAccount,
+        // @ts-expect-error
+        nonceManager: ownerAccount.nonceManager,
       })
       await waitForTransaction(tx)
     }