Claims performance improvements (#4248)

* Persist claims data and determine whether to request new information based on that * Remove slice from root reducer * Fix tests * Add more tests * Increase timeout a bit * Fix E2E test
MyCryptoHQ · Jan 12, 2022 · d850608 · d850608
1 parent 815abd4
commit d850608
Show file tree

Hide file tree

Showing 15 changed files with 201 additions and 61 deletions.
diff --git a/__tests__/export.test.js b/__tests__/export.test.js
@@ -72,7 +72,7 @@ test('Can export AppState to file', async (t) => {
   const accountSettingsLens = lensPath(['settings']);
 
   const omitDynamicValues = pipe(
-    omit(['mtime', 'promoPoaps', 'notifications', 'connections']),
+    omit(['mtime', 'promoPoaps', 'notifications', 'connections', 'claims']),
     set(accountAssetsLens, removeKeysFromAccountAsset),
     set(accountSettingsLens, removeKeysFromAccountSettings)
   );

diff --git a/src/components/ActionsPanel/__tests__/ClaimSubHead.test.tsx b/src/components/ActionsPanel/__tests__/ClaimSubHead.test.tsx
@@ -1,26 +1,29 @@
-import { screen, simpleRender } from 'test-utils';
+import { mockStore, screen, simpleRender } from 'test-utils';
 
 import { fAccounts } from '@fixtures';
 import { translateRaw } from '@translations';
-import { ClaimState, ClaimType } from '@types';
+import { ClaimState, ClaimType, ITxValue } from '@types';
 
 import { ClaimSubHead } from '../components/ClaimSubHead';
 
 function getComponent() {
   return simpleRender(<ClaimSubHead type={ClaimType.UNI} />, {
-    initialState: {
-      claims: {
+    initialState: mockStore({
+      dataStoreState: {
         claims: {
-          [ClaimType.UNI]: [
-            {
-              address: fAccounts[0].address,
-              state: ClaimState.UNCLAIMED,
-              amount: '403'
-            }
-          ]
+          claims: {
+            [ClaimType.UNI]: [
+              {
+                address: fAccounts[0].address,
+                state: ClaimState.UNCLAIMED,
+                amount: '403' as ITxValue
+              }
+            ]
+          },
+          error: false
         }
       }
-    }
+    })
   });
 }
 

diff --git a/src/components/ActionsPanel/__tests__/ClaimTable.test.tsx b/src/components/ActionsPanel/__tests__/ClaimTable.test.tsx
@@ -1,31 +1,34 @@
-import { screen, simpleRender } from 'test-utils';
+import { mockStore, screen, simpleRender } from 'test-utils';
 
 import { fAccounts } from '@fixtures';
-import { ClaimState, ClaimType } from '@types';
+import { ClaimState, ClaimType, ITxValue } from '@types';
 import { truncate } from '@utils';
 
 import { ClaimTable } from '../components/ClaimTable';
 
 function getComponent() {
   return simpleRender(<ClaimTable type={ClaimType.UNI} />, {
-    initialState: {
-      claims: {
+    initialState: mockStore({
+      dataStoreState: {
         claims: {
-          [ClaimType.UNI]: [
-            {
-              address: fAccounts[0].address,
-              state: ClaimState.UNCLAIMED,
-              amount: '403'
-            },
-            {
-              address: fAccounts[2].address,
-              state: ClaimState.CLAIMED,
-              amount: '403'
-            }
-          ]
+          claims: {
+            [ClaimType.UNI]: [
+              {
+                address: fAccounts[0].address,
+                state: ClaimState.UNCLAIMED,
+                amount: '403' as ITxValue
+              },
+              {
+                address: fAccounts[2].address,
+                state: ClaimState.CLAIMED,
+                amount: '403' as ITxValue
+              }
+            ]
+          },
+          error: false
         }
       }
-    }
+    })
   });
 }
 

diff --git a/src/database/data/schema.ts b/src/database/data/schema.ts
@@ -17,5 +17,6 @@ export const SCHEMA_BASE: LocalStorage = {
   [LSKeys.NETWORK_NODES]: {} as LocalStorage[LSKeys.NETWORK_NODES],
   [LSKeys.USER_ACTIONS]: {} as LocalStorage[LSKeys.USER_ACTIONS],
   [LSKeys.PROMO_POAPS]: { promos: {} } as LocalStorage[LSKeys.PROMO_POAPS],
-  [LSKeys.CONNECTIONS]: { wallets: {} } as LocalStorage[LSKeys.CONNECTIONS]
+  [LSKeys.CONNECTIONS]: { wallets: {} } as LocalStorage[LSKeys.CONNECTIONS],
+  [LSKeys.CLAIMS]: { claims: {} } as LocalStorage[LSKeys.CLAIMS]
 };
diff --git a/src/services/ApiService/Claims/Claims.spec.ts b/src/services/ApiService/Claims/Claims.spec.ts
@@ -58,6 +58,7 @@ describe('ClaimsService', () => {
       {
         address: fAccount.address,
         state: ClaimState.CLAIMED,
+        index: 102925,
         amount: mockClaim[fAccount.address].Amount
       }
     ]);
@@ -69,6 +70,7 @@ describe('ClaimsService', () => {
       {
         address: fAccount.address,
         state: ClaimState.CLAIMED,
+        index: 102925,
         amount: hexlify(bigify(mockClaim[fAccount.address].Amount).div(10))
       }
     ]);

diff --git a/src/services/ApiService/Claims/Claims.ts b/src/services/ApiService/Claims/Claims.ts
@@ -18,7 +18,7 @@ export default class ClaimsService {
 
   private service: AxiosInstance = ApiService.generateInstance({
     baseURL: UNISWAP_UNI_CLAIM_API,
-    timeout: 10000
+    timeout: 20000
   });
 
   constructor() {
@@ -43,7 +43,7 @@ export default class ClaimsService {
         return claims;
       })
       .catch((err) => {
-        console.debug('[UniswapService]: Get Claims failed: ', err);
+        console.debug('[Claims]: Get Claims failed: ', err);
         return null;
       });
   }
@@ -68,7 +68,8 @@ export default class ClaimsService {
         return {
           address,
           state: claimed ? ClaimState.CLAIMED : ClaimState.UNCLAIMED,
-          amount
+          amount,
+          index: claim.Index
         };
       }
       return { address, state: ClaimState.NO_CLAIM, amount: '0x00' };

diff --git a/src/services/Store/DataManager/utils.ts b/src/services/Store/DataManager/utils.ts
@@ -117,7 +117,8 @@ export function marshallState(ls: LocalStorage): DataStore {
       ? (objToExtendedArray(ls[LSKeys.USER_ACTIONS]) as ExtendedUserAction[])
       : [],
     [LSKeys.PROMO_POAPS]: ls[LSKeys.PROMO_POAPS],
-    [LSKeys.CONNECTIONS]: ls[LSKeys.CONNECTIONS]
+    [LSKeys.CONNECTIONS]: ls[LSKeys.CONNECTIONS],
+    [LSKeys.CLAIMS]: ls[LSKeys.CLAIMS]
   };
 }
 
@@ -181,6 +182,7 @@ export function deMarshallState(st: DataStore): LocalStorage {
     [LSKeys.NETWORK_NODES]: constructNetworkNodes(st[LSKeys.NETWORKS]),
     [LSKeys.USER_ACTIONS]: arrayToObj('uuid')(st[LSKeys.USER_ACTIONS]),
     [LSKeys.PROMO_POAPS]: st[LSKeys.PROMO_POAPS],
-    [LSKeys.CONNECTIONS]: st[LSKeys.CONNECTIONS]
+    [LSKeys.CONNECTIONS]: st[LSKeys.CONNECTIONS],
+    [LSKeys.CLAIMS]: st[LSKeys.CLAIMS]
   };
 }
diff --git a/src/services/Store/store/claims.slice.test.ts b/src/services/Store/store/claims.slice.test.ts
@@ -23,14 +23,48 @@ describe('ClaimsSlice', () => {
       {
         address: fAccounts[0].address as TAddress,
         state: ClaimState.UNCLAIMED,
-        amount: '403' as ITxValue
+        amount: '403' as ITxValue,
+        index: 139
       }
     ];
     const actual = reducer(initialState, setClaims({ type: ClaimType.UNI, claims }));
     const expected = { ...initialState, claims: { [ClaimType.UNI]: claims } };
     expect(actual).toEqual(expected);
   });
 
+  it('setClaims(): merges claims', () => {
+    const claims = [
+      {
+        address: fAccounts[0].address as TAddress,
+        state: ClaimState.UNCLAIMED,
+        amount: '403' as ITxValue,
+        index: 139
+      }
+    ];
+    const existingClaims = [
+      {
+        address: fAccounts[2].address as TAddress,
+        state: ClaimState.UNCLAIMED,
+        amount: '403' as ITxValue,
+        index: 140
+      }
+    ];
+    const actual = reducer(
+      {
+        ...initialState,
+        claims: {
+          [ClaimType.UNI]: existingClaims
+        }
+      },
+      setClaims({ type: ClaimType.UNI, claims })
+    );
+    const expected = {
+      ...initialState,
+      claims: { [ClaimType.UNI]: [...claims, ...existingClaims] }
+    };
+    expect(actual).toEqual(expected);
+  });
+
   it('fetchError(): sets an error', () => {
     const actual = reducer(initialState, fetchError());
     const expected = { ...initialState, error: true };
@@ -45,14 +79,43 @@ describe('claimsSaga()', () => {
       {
         address: fAccounts[0].address,
         state: ClaimState.UNCLAIMED,
-        amount: '0x15AF1D78B58C400000' as ITxValue
+        amount: '0x15AF1D78B58C400000' as ITxValue,
+        index: 139
+      }
+    ];
+    return expectSaga(claimsSaga)
+      .withState(
+        mockAppState({
+          accounts,
+          networks: fNetworks,
+          claims: { claims: {}, error: false }
+        })
+      )
+      .provide([
+        [call.fn(ClaimsService.instance.getClaims), []],
+        [call.fn(ClaimsService.instance.isClaimed), claims]
+      ])
+      .put(setClaims({ type: ClaimType.UNI, claims }))
+      .dispatch(fetchClaims())
+      .silentRun();
+  });
+
+  it('fetches existing non-claimed claims', () => {
+    const accounts = [fAccounts[0]];
+    const claims = [
+      {
+        address: fAccounts[0].address,
+        state: ClaimState.UNCLAIMED,
+        amount: '0x15AF1D78B58C400000' as ITxValue,
+        index: 139
       }
     ];
     return expectSaga(claimsSaga)
       .withState(
         mockAppState({
           accounts,
-          networks: fNetworks
+          networks: fNetworks,
+          claims: { claims: { [ClaimType.UNI]: claims }, error: false }
         })
       )
       .provide([
@@ -64,10 +127,39 @@ describe('claimsSaga()', () => {
       .silentRun();
   });
 
+  it('ignores existing claims', () => {
+    const accounts = [fAccounts[0]];
+    const claims = [
+      {
+        address: fAccounts[0].address,
+        state: ClaimState.CLAIMED,
+        amount: '0x15AF1D78B58C400000' as ITxValue,
+        index: 139
+      }
+    ];
+    return expectSaga(claimsSaga)
+      .withState(
+        mockAppState({
+          accounts,
+          networks: fNetworks,
+          claims: { claims: { [ClaimType.UNI]: claims }, error: false }
+        })
+      )
+      .not.put(setClaims({ type: ClaimType.UNI, claims }))
+      .dispatch(fetchClaims())
+      .silentRun();
+  });
+
   it('can sets error if the call fails', () => {
     const error = new Error('error');
     return expectSaga(claimsSaga)
-      .withState(mockAppState({ accounts: fAccounts, networks: fNetworks }))
+      .withState(
+        mockAppState({
+          accounts: fAccounts,
+          networks: fNetworks,
+          claims: { claims: {}, error: false }
+        })
+      )
       .provide([[call.fn(ClaimsService.instance.getClaims), throwError(error)]])
       .put(fetchError())
       .dispatch(fetchClaims())