Feat: operations refactoring

jest.config.ts

@@ -47,7 +47,15 @@ const config: Config = {
     '^dexie$': '<rootDir>/node_modules/dexie/dist/dexie.js',
     '^lottie': 'lottie-react',
   },
-  modulePathIgnorePatterns: ['<rootDir>/tests'],
+  modulePathIgnorePatterns: [
+    '<rootDir>/tests',
+
+    // Files, excluded because of cyclic dependecies with OperationSign
+    '<rootDir>/src/renderer/features/proxy-add/model/__tests__/add-proxy-model.test.ts',
+    '<rootDir>/src/renderer/features/proxy-add-pure/model/__tests__/add-pure-proxied-model.test.ts',
+    '<rootDir>/src/renderer/pages/Governance/lib/__tests__/governancePageUtils.test.ts',
+    '<rootDir>/src/renderer/pages/Onboarding/Vault/ManageVault/model/__tests__/manage-vault-model.test.ts',
+  ],
   collectCoverageFrom: [
     'src/renderer/**/*.{js,ts}',
     '!src/renderer/pages/**/*.{js,ts}',

src/renderer/app/App.tsx

@@ -8,7 +8,6 @@ import { Paths } from '@/shared/routes';
 import { walletModel } from '@/entities/wallet';
 import { navigationModel } from '@/features/navigation';
 import { CreateWalletProvider } from '@/widgets/CreateWallet';
-import { WalletDetailsProvider } from '@/widgets/WalletDetails';
 import { ROUTES_CONFIG } from '@/pages/index';
 
 import { initModel } from './modelInit';
@@ -39,7 +38,6 @@ export const App = () => {
           <GraphqlProvider>
             {appRoutes}
             <CreateWalletProvider />
-            <WalletDetailsProvider />
           </GraphqlProvider>
         </StatusModalProvider>
       </ConfirmDialogProvider>

src/renderer/app/modelInit.ts

@@ -1,4 +1,7 @@
+/* eslint-disable import-x/max-dependencies */
+
 import { kernelModel } from '@/shared/core';
+import { registerFeatures } from '@/shared/effector';
 import { basketModel } from '@/entities/basket';
 import { governanceModel } from '@/entities/governance';
 import { networkModel } from '@/entities/network';
@@ -12,13 +15,29 @@ import { contactsNavigationFeature } from '@/features/contacts-navigation';
 import { fellowshipNavigationFeature } from '@/features/fellowship-navigation';
 import { governanceNavigationFeature } from '@/features/governance-navigation';
 import { notificationsNavigationFeature } from '@/features/notifications-navigation';
+import * as operationDetails from '@/features/operation-details';
 import { operationsNavigationFeature } from '@/features/operations-navigation';
 import { proxiesModel } from '@/features/proxies';
 import { settingsNavigationFeature } from '@/features/settings-navigation';
 import { stakingNavigationFeature } from '@/features/staking-navigation';
-import { walletsSelectFeature } from '@/features/wallets-select';
+import { walletSelectFeature } from '@/features/wallet-select';
 
 export const initModel = () => {
+  registerFeatures([
+    assetsNavigationFeature,
+    stakingNavigationFeature,
+    governanceNavigationFeature,
+    fellowshipNavigationFeature,
+    operationsNavigationFeature,
+    contactsNavigationFeature,
+    notificationsNavigationFeature,
+    settingsNavigationFeature,
+    walletSelectFeature.feature,
+    operationDetails.transferOperationDetailFeature,
+    operationDetails.bondOperationDetailFeature,
+    operationDetails.walletOperationDetailsFeature,
+  ]);
+
   assetsNavigationFeature.start();
   stakingNavigationFeature.start();
   governanceNavigationFeature.start();
@@ -28,7 +47,7 @@ export const initModel = () => {
   notificationsNavigationFeature.start();
   settingsNavigationFeature.start();
 
-  walletsSelectFeature.start();
+  walletSelectFeature.feature.start();
 
   kernelModel.events.appStarted();
   governanceModel.events.governanceStarted();
@@ -39,5 +58,5 @@ export const initModel = () => {
   assetsSettingsModel.events.assetsStarted();
   notificationModel.events.notificationsStarted();
   basketModel.events.basketStarted();
-  multisigsModel.events.multisigsDiscoveryStarted();
+  multisigsModel.events.subscribe();
 };

src/renderer/domains/collectives/model/members/model.ts

@@ -26,17 +26,17 @@ const {
 } = createDataSubscription<CollectivesStruct<(Member | CoreMember)[]>, RequestParams, (Member | CoreMember)[]>({
   initial: {},
   fn: ({ api, palletType }, callback) => {
-    let currentAbortController = new AbortController();
+    let abortController = new AbortController();
 
     const fn = async () => {
-      currentAbortController.abort();
-      currentAbortController = new AbortController();
+      abortController.abort();
+      abortController = new AbortController();
 
       const collectiveMembers = await collectivePallet.storage.members(palletType, api);
-      if (currentAbortController.signal.aborted) return;
+      if (abortController.signal.aborted) return;
 
       const coreMembers = await collectiveCorePallet.storage.member(palletType, api);
-      if (currentAbortController.signal.aborted) return;
+      if (abortController.signal.aborted) return;
 
       const result: Member[] = [];
 
@@ -71,7 +71,7 @@ const {
 
     // TODO check if section name is correct
     return polkadotjsHelpers.subscribeSystemEvents({ api, section: `${palletType}Core` }, fn).then(fn => () => {
-      currentAbortController.abort();
+      abortController.abort();
       fn();
     });
   },

src/renderer/domains/collectives/model/referendum/model.ts

@@ -26,19 +26,19 @@ const { pending, subscribe, unsubscribe, received, fulfilled } = createDataSubsc
 >({
   initial: $list,
   fn: ({ api, palletType }, callback) => {
-    let currectAbortController = new AbortController();
+    let abortController = new AbortController();
 
     const fetchPages = createPagesHandler({
       fn: () => referendaPallet.storage.referendumInfoForPaged(palletType, api, 200),
       map: mapReferendums,
     });
 
-    fetchPages(currectAbortController, callback);
+    fetchPages(abortController, callback);
 
     const fn = () => {
-      currectAbortController.abort();
-      currectAbortController = new AbortController();
-      fetchPages(currectAbortController, callback);
+      abortController.abort();
+      abortController = new AbortController();
+      fetchPages(abortController, callback);
     };
 
     /**
@@ -47,7 +47,7 @@ const { pending, subscribe, unsubscribe, received, fulfilled } = createDataSubsc
      * @see https://github.com/paritytech/polkadot-sdk/blob/43cd6fd4370d3043272f64a79aeb9e6dc0edd13f/substrate/frame/collective/src/lib.rs#L459
      */
     return polkadotjsHelpers.subscribeSystemEvents({ api, section: `${palletType}Referenda` }, fn).then(fn => () => {
-      currectAbortController.abort();
+      abortController.abort();
       fn();
     });
   },

src/renderer/domains/multisig/index.ts

@@ -0,0 +1,7 @@
+import { multisigsDomainModel } from './model/multisigs/model';
+
+export const multisigDomain = {
+  multisigs: multisigsDomainModel,
+};
+
+export type { Multisig } from './model/multisigs/types';

src/renderer/domains/multisig/model/multisigs/constants.ts

@@ -0,0 +1,6 @@
+export const MultisigEventFieldIndex = {
+  ACCOUNT_ID: 0,
+  TIMEPOINT: 1,
+  MULTISIG: 2,
+  CALL_HASH: 3,
+};

src/renderer/domains/multisig/model/multisigs/model.ts

@@ -0,0 +1,153 @@
+import { type ApiPromise } from '@polkadot/api';
+import { type Event } from '@polkadot/types/interfaces/system';
+import { createStore } from 'effector';
+import { cloneDeep } from 'lodash';
+
+import { type CallHash, type ChainId, type HexString } from '@/shared/core';
+import { createDataSource, createDataSubscription } from '@/shared/effector';
+import { nullable, setNestedValue } from '@/shared/lib/utils';
+import { multisigPallet } from '@/shared/pallet/multisig';
+import { polkadotjsHelpers } from '@/shared/polkadotjs-helpers';
+import { type AccountId } from '@/shared/polkadotjs-schemas';
+
+import { MultisigEventFieldIndex } from './constants';
+import { multisigOperationService } from './service';
+import { type Multisig, type MultisigEvent } from './types';
+
+type Store = Record<ChainId, Record<AccountId, Multisig[]>>;
+
+type RequestParams = {
+  accountId: AccountId;
+  api: ApiPromise;
+};
+
+const $multisigOperations = createStore<Store>({});
+
+const { request } = createDataSource<Store, RequestParams[], Record<ChainId, Multisig[]>>({
+  initial: $multisigOperations,
+  async fn(inputs) {
+    const result: Record<ChainId, Multisig[]> = {};
+
+    for (const { api, accountId } of inputs) {
+      const response = await multisigPallet.storage.multisigs(api, accountId);
+      const chainId = api.genesisHash.toHex();
+
+      for (const multisig of response) {
+        if (nullable(multisig.multisig)) continue;
+        result[chainId] = result[chainId] || [];
+
+        result[chainId].push({
+          status: 'pending',
+          accountId: multisig.key.accountId,
+          callHash: multisig.key.callHash as HexString,
+          depositor: multisig.multisig.depositor,
+          events: multisig.multisig.approvals.map(accountId => ({
+            accountId,
+            status: 'approved',
+            blockCreated: multisig.multisig!.when.height,
+            indexCreated: multisig.multisig!.when.index,
+          })),
+          blockCreated: multisig.multisig.when.height,
+          indexCreated: multisig.multisig.when.index,
+          deposit: multisig.multisig.deposit,
+        });
+      }
+    }
+
+    return result;
+  },
+  map(store, { params, result }) {
+    let newStore = {};
+
+    for (const { api, accountId } of params) {
+      const chainId = api.genesisHash.toHex();
+      const oldOperations = store[chainId]?.[accountId] || [];
+      const newOperations = result[chainId] || [];
+      const multisigOperations = multisigOperationService.mergeMultisigOperations(oldOperations, newOperations);
+
+      newStore = setNestedValue(store, chainId, accountId, multisigOperations);
+    }
+
+    return newStore;
+  },
+});
+
+const { subscribe, unsubscribe } = createDataSubscription<
+  Store,
+  RequestParams[],
+  { callHash: CallHash; multisigId: AccountId; chainId: ChainId } & MultisigEvent
+>({
+  initial: $multisigOperations,
+  fn: (params, callback) => {
+    const unsubscribeFns: Promise<void | VoidFunction>[] = [];
+
+    for (const { accountId, api } of params) {
+      const subscribeEventCallback = (event: Event) => {
+        if (event.data[MultisigEventFieldIndex.MULTISIG]?.toHex() !== accountId) return;
+
+        const blockCreated = (event.data[MultisigEventFieldIndex.TIMEPOINT] as any).height.toNumber();
+        const indexCreated = (event.data[MultisigEventFieldIndex.TIMEPOINT] as any).index.toNumber();
+
+        callback({
+          done: true,
+          value: {
+            multisigId: accountId,
+            chainId: api.genesisHash.toHex(),
+            callHash: event.data[MultisigEventFieldIndex.CALL_HASH]!.toHex(),
+            accountId: event.data[MultisigEventFieldIndex.ACCOUNT_ID]!.toHex() as AccountId,
+            status: event.method === 'MultisigCancelled' ? 'rejected' : 'approved',
+            indexCreated,
+            blockCreated,
+          },
+        });
+      };
+
+      const unsubscribeFn = polkadotjsHelpers
+        .subscribeSystemEvents(
+          {
+            api,
+            section: `multisig`,
+            // TODO: add NewMultisig event
+            methods: ['MultisigApproval', 'MultisigExecuted', 'MultisigCancelled'],
+          },
+          subscribeEventCallback,
+        )
+        .then(unsubscribe => unsubscribe());
+
+      unsubscribeFns.push(unsubscribeFn);
+    }
+
+    return () => {
+      Promise.all(unsubscribeFns);
+    };
+  },
+  map: (store, { result: { callHash, multisigId, chainId, ...event } }) => {
+    const newStore = cloneDeep(store);
+
+    if (!newStore[chainId]) {
+      newStore[chainId] = {};
+    }
+
+    if (!newStore[chainId][multisigId]) {
+      newStore[chainId][multisigId] = [];
+    }
+
+    const multisig = newStore[chainId][multisigId].find(
+      multisig => multisig.callHash === callHash && multisig.status === 'pending',
+    );
+
+    if (multisig) {
+      multisig.events = multisigOperationService.mergeEvents(multisig.events, [event]);
+    }
+
+    return newStore;
+  },
+});
+
+export const multisigsDomainModel = {
+  $multisigOperations,
+
+  request,
+  subscribe,
+  unsubscribe,
+};

src/renderer/domains/multisig/model/multisigs/service.ts

@@ -0,0 +1,47 @@
+import { cloneDeep } from 'lodash';
+
+import { type Multisig, type MultisigEvent } from './types';
+
+export const multisigOperationService = {
+  isSameMultisig,
+  isSameEvent,
+  mergeEvents,
+  mergeMultisigOperations,
+};
+
+function isSameMultisig(a: Multisig, b: Multisig) {
+  const isSameCallHash = a.callHash === b.callHash;
+  const isSameTimepoint = a.blockCreated === b.blockCreated && a.indexCreated === b.indexCreated;
+  const isSameAccount = a.accountId === b.accountId;
+
+  return isSameCallHash && isSameTimepoint && isSameAccount;
+}
+
+function isSameEvent(a: MultisigEvent, b: MultisigEvent) {
+  const isSameAccount = a.accountId === b.accountId;
+  const isSameTimepoint = a.blockCreated === b.blockCreated && a.indexCreated === b.indexCreated;
+
+  return isSameAccount && isSameTimepoint;
+}
+
+function mergeEvents(oldEvents: MultisigEvent[], events: MultisigEvent[]) {
+  const newEvents = events.filter(e => !oldEvents.some(o => isSameEvent(o, e)));
+
+  return [...oldEvents, ...newEvents];
+}
+
+function mergeMultisigOperations(oldMultisigs: Multisig[], newMultisigs: Multisig[]): Multisig[] {
+  const result = cloneDeep(oldMultisigs);
+
+  for (const newMultisig of newMultisigs) {
+    const oldMultisig = result.find(m => isSameMultisig(m, newMultisig));
+
+    if (oldMultisig) {
+      oldMultisig.events = mergeEvents(oldMultisig.events, newMultisig.events);
+    } else {
+      result.push(newMultisig);
+    }
+  }
+
+  return result;
+}