feat: read-only connected accounts integration (DAP-4807) (#55)

* test: recover Switch Mutation test

* fix: change Switch Mutation test for overlay flow

* feat: add routing to the Overlay; add Profile page

* feat: adding CA page

* refactor: imports optimization

* feat: connect CA module to the Profile page

* feat: connect Connected Accounts module to smart contracts (DAP-4828)

* feat: add Profile button to the overlay header (DAP-4829)

* fix: CA list element key

* fix: Error `<null key={...} target={...}>` component in console (DAP-4840)

* feat: new CA design (DAP-4830)

* fix: improve CA item styles

* feat: ca available in Widgets (DAP-4841)

* refactor: small improvements

* test: add 1 active test for an empty CA module and 1 test for future for a Profile button in the Overlay header

* build: fix lockfile

* fix: getAllKeys is not implemented

* refactor: reuse existing getNearConfig

* refactor: respect naming convention

* refactor: remove unused code

---------

Co-authored-by: Alexander Sakhaev <alsakhaev@gmail.com>

Author: Ni-2

apps/crawler-extension/src/contentscript/extension-storage.ts

@@ -5,6 +5,13 @@ import browser from 'webextension-polyfill'
 export class ExtensionStorage implements StorageService, IStorage {
   constructor(private _keyPrefix: string) {}
 
+  async getAllKeys(): Promise<string[]> {
+    const storage = await browser.storage.local.get(null)
+    return Object.keys(storage)
+      .filter((key) => key.startsWith(this._keyPrefix + ':'))
+      .map((key) => key.substring(this._keyPrefix.length + 1))
+  }
+
   async getItem(key: string): Promise<string> {
     const globalKey = this._makeKey(key)
     const result = await browser.storage.local.get(globalKey)

apps/extension/tests/scenarios/connected-accounts-no-wallet.spec.ts

@@ -0,0 +1,29 @@
+import { expect, test } from '../fixtures/browser'
+
+test('show empty Connected Accounts list on a Profile page when the no wallets connected', async ({
+  page,
+}) => {
+  const url = 'https://github.com/dapplets/dapplet-extension/pull/217'
+  const noConnectedAccountsText = 'There are no connected accounts'
+  const recommendConnectWalletText = 'Connect your wallet to see connected accounts'
+
+  await page.goto(url)
+
+  // ToDo: move to POM
+  await expect(page.getByTestId('mweb-overlay')).toBeVisible({ timeout: 60_000 })
+
+  // actions
+  await page.getByTestId('profile-action-button').click()
+
+  // results
+  await expect(page.getByTestId('side-panel')).toBeVisible()
+  await expect(
+    page.getByTestId('profile-page').getByTestId('connected-accounts-module')
+  ).toBeVisible()
+  await expect(
+    page.getByTestId('profile-page').getByTestId('connected-accounts-module')
+  ).toContainText(noConnectedAccountsText)
+  await expect(
+    page.getByTestId('profile-page').getByTestId('connected-accounts-module')
+  ).toContainText(recommendConnectWalletText)
+})

apps/extension/tests/scenarios/open-profile-using-header.spec.ts

@@ -0,0 +1,20 @@
+import { expect, test } from '../fixtures/browser'
+
+// ToDo: need to connect a wallet for this test case
+
+// test('open Profile page through the button in the Overlay header', async ({ page }) => {
+//   const url = 'https://github.com/dapplets/dapplet-extension/pull/217'
+
+//   await page.goto(url)
+
+//   // ToDo: move to POM
+//   await expect(page.getByTestId('mweb-overlay')).toBeVisible({ timeout: 60_000 })
+//   await page.getByTestId('mutation-button').click()
+//   await expect(page.getByTestId('side-panel')).toBeVisible()
+
+//   // actions
+//   await page.getByTestId('profile-page-button').click()
+
+//   // results
+//   await expect(page.getByTestId('profile-page')).toBeVisible()
+// })

apps/extension/tests/scenarios/open-profile.spec.ts

@@ -1,6 +1,5 @@
 import { expect, test } from '../fixtures/browser'
 
-// ToDo: qase mw-1
 test('open Profile page through the button in Mini Overlay', async ({ page }) => {
   const url = 'https://github.com/dapplets/dapplet-extension/pull/217'
 

apps/extension/tests/scenarios/switch-mutation.spec.ts

@@ -1,6 +1,5 @@
 import { expect, test } from '../fixtures/browser'
 
-// ToDo: qase mw-1
 test('switch mutation', async ({ page }) => {
   const url = 'https://github.com/dapplets/dapplet-extension/pull/217'
   const sourceMutationId = 'bos.dapplets.near/mutation/Sandbox'

libs/backend/package.json

@@ -28,6 +28,7 @@
     "big.js": "^6.2.1",
     "bn.js": "^5.2.1",
     "caching-decorator": "^1.0.3",
+    "ethereum-blockies-base64": "^1.0.2",
     "js-sha256": "^0.11.0",
     "json-stringify-deterministic": "^1.0.12",
     "reflect-metadata": "^0.2.2"

libs/backend/src/config.ts

@@ -18,6 +18,7 @@ export type NearConfig = {
   defaultMutationId: string
   layoutManagers: BuiltInLayoutManagers
   timeReference: TimeReference
+  connectedAccountsContractAddress: string
 }
 
 export const NearConfigs: { [networkId: string]: NearConfig } = {
@@ -37,6 +38,7 @@ export const NearConfigs: { [networkId: string]: NearConfig } = {
       height: 134671239,
       avgBlockTime: 1091, // https://nearblocks.io/
     },
+    connectedAccountsContractAddress: 'connected-accounts.near',
   },
   testnet: {
     networkId: 'testnet',
@@ -54,6 +56,7 @@ export const NearConfigs: { [networkId: string]: NearConfig } = {
       height: 181770025,
       avgBlockTime: 1000, // https://testnet.nearblocks.io/
     },
+    connectedAccountsContractAddress: 'dev-1674551865700-67703371677231',
   },
 }
 

libs/backend/src/engine.ts

@@ -25,6 +25,7 @@ import { Notification } from './services/notification/notification.entity'
 import { Resolution } from './services/notification/resolution.entity'
 import { BaseLocalRepository } from './services/base/base-local.repository'
 import { BaseAggRepository } from './services/base/base-agg.repository'
+import { ConnectedAccountsService } from './services/connected-accounts/connected-accounts.service'
 
 export type EngineConfig = {
   networkId: string
@@ -45,6 +46,7 @@ export class Engine {
   parserConfigService: ParserConfigService
   notificationService: NotificationService
   documentService: DocumentSerivce
+  connectedAccountsService: ConnectedAccountsService
 
   constructor(public readonly config: EngineConfig) {
     if (!this.config.storage) {
@@ -138,5 +140,9 @@ export class Engine {
       unitOfWorkService,
       nearSigner
     )
+    this.connectedAccountsService = new ConnectedAccountsService(
+      nearSigner,
+      nearConfig.connectedAccountsContractAddress
+    )
   }
 }

libs/backend/src/index.ts

@@ -38,6 +38,17 @@ export {
 export { PullRequestAcceptedPayload } from './services/notification/types/pull-request-accepted'
 export { PullRequestRejectedPayload } from './services/notification/types/pull-request-rejected'
 export { RegularPayload } from './services/notification/types/regular'
+export {
+  TConnectedAccount,
+  IConnectedAccountsPair,
+  ConnectedAccountsPairStatus,
+  IConnectedAccountUser,
+  WalletDescriptorWithCAMainStatus,
+  NearNetworks,
+  ChainTypes,
+  TConnectedAccountsVerificationRequestInfo,
+} from './services/connected-accounts/types'
+export { ConnectedAccountsService } from './services/connected-accounts/connected-accounts.service'
 
 // ToDo: replace with DTO
 export { ParserConfig } from './services/parser-config/parser-config.entity'