Claiming rewards e2e tests. (#80)

* Claiming rewards e2e tests

* fix deps issue.

liquidity/cypress/cypress/e2e/42161-main/ARB_Claim_rewards.e2e.js

@@ -0,0 +1,54 @@
+import { makeSearch } from '@snx-v3/useParams';
+
+describe(__filename, () => {
+  Cypress.env('chainId', '42161');
+  Cypress.env('preset', 'main');
+  Cypress.env('walletAddress', '0xeEBb1b80e75b44180EbF7893DA00034d30BDfF7C');
+  Cypress.env('accountId', '170141183460469231731687303715884106023');
+
+  beforeEach(() => {
+    cy.task('startAnvil', {
+      chainId: Cypress.env('chainId'),
+      forkUrl: `https://arbitrum-mainnet.infura.io/v3/${Cypress.env('INFURA_KEY')}`,
+      block: '281318272',
+    }).then(() => cy.log('Anvil started'));
+
+    cy.on('window:before:load', (win) => {
+      win.localStorage.setItem('MAGIC_WALLET', Cypress.env('walletAddress'));
+      win.localStorage.setItem(
+        'DEFAULT_NETWORK',
+        `${Cypress.env('chainId')}-${Cypress.env('preset')}`
+      );
+    });
+  });
+  afterEach(() => cy.task('stopAnvil').then(() => cy.log('Anvil stopped')));
+
+  it(__filename, () => {
+    cy.setEthBalance({ balance: 100 });
+
+    cy.visit(
+      `?${makeSearch({
+        page: 'position',
+        collateralSymbol: 'ARB',
+        poolId: 1,
+        manageAction: 'deposit',
+        accountId: Cypress.env('accountId'),
+      })}`
+    );
+
+    cy.get('[data-cy="claim rewards submit"]').should('be.enabled');
+    cy.get('[data-cy="claim rewards submit"]').click();
+
+    cy.get('[data-cy="claim rewards dialog"]').should('exist');
+
+    cy.get('[data-cy="claim rewards info"]')
+      .should('exist')
+      .and('include.text', 'Claim your rewards');
+
+    cy.get('[data-cy="transaction hash"]').should('exist');
+
+    cy.contains('[data-status="success"]', 'Your rewards has been claimed.', {
+      timeout: 180_000,
+    }).should('exist');
+  });
+});

liquidity/cypress/cypress/e2e/8453-andromeda/USDC_Claim_rewards.e2e.js

@@ -0,0 +1,55 @@
+import { makeSearch } from '@snx-v3/useParams';
+
+describe(__filename, () => {
+  Cypress.env('chainId', '8453');
+  Cypress.env('preset', 'andromeda');
+  Cypress.env('walletAddress', '0x1a245Fa866932731631E1ec8EDcDbB0C6A402559');
+  Cypress.env('accountId', '1640332659');
+
+  beforeEach(() => {
+    cy.task('startAnvil', {
+      chainId: Cypress.env('chainId'),
+      forkUrl: `https://base-mainnet.infura.io/v3/${Cypress.env('INFURA_KEY')}`,
+      block: '22544990',
+    }).then(() => cy.log('Anvil started'));
+
+    cy.on('window:before:load', (win) => {
+      win.localStorage.setItem('MAGIC_WALLET', Cypress.env('walletAddress'));
+      win.localStorage.setItem(
+        'DEFAULT_NETWORK',
+        `${Cypress.env('chainId')}-${Cypress.env('preset')}`
+      );
+    });
+  });
+  afterEach(() => cy.task('stopAnvil').then(() => cy.log('Anvil stopped')));
+
+  it(__filename, () => {
+    cy.setEthBalance({ balance: 100 });
+    cy.getUSDC({ amount: 500 });
+
+    cy.visit(
+      `?${makeSearch({
+        page: 'position',
+        collateralSymbol: 'USDC',
+        poolId: 1,
+        manageAction: 'deposit',
+        accountId: Cypress.env('accountId'),
+      })}`
+    );
+
+    cy.get('[data-cy="claim rewards submit"]').should('be.enabled');
+    cy.get('[data-cy="claim rewards submit"]').click();
+
+    cy.get('[data-cy="claim rewards dialog"]').should('exist');
+
+    cy.get('[data-cy="claim rewards info"]')
+      .should('exist')
+      .and('include.text', 'Claim your rewards');
+
+    cy.get('[data-cy="transaction hash"]').should('exist');
+
+    cy.contains('[data-status="success"]', 'Your rewards has been claimed.', {
+      timeout: 180_000,
+    }).should('exist');
+  });
+});

liquidity/lib/useRewards/package.json

@@ -4,7 +4,6 @@
   "main": "index.ts",
   "version": "0.0.2",
   "dependencies": {
-    "@snx-v3/constants": "workspace:*",
     "@snx-v3/tsHelpers": "workspace:*",
     "@snx-v3/useBlockchain": "workspace:*",
     "@snx-v3/useCollateralTypes": "workspace:*",

liquidity/lib/useRewards/useRewards.ts

@@ -1,4 +1,3 @@
-import { getSubgraphUrl } from '@snx-v3/constants';
 import { useNetwork, useProvider } from '@snx-v3/useBlockchain';
 import { useCollateralType } from '@snx-v3/useCollateralTypes';
 import { useCoreProxy } from '@snx-v3/useCoreProxy';
@@ -21,33 +20,11 @@ const RewardsResponseSchema = z.array(
     distributorAddress: z.string(),
     decimals: z.number(),
     claimableAmount: z.instanceof(Wei),
-    lifetimeClaimed: z.number(),
   })
 );
 
 export type RewardsResponseType = z.infer<typeof RewardsResponseSchema>;
 
-const RewardsDataDocument = `
-  query RewardsData($accountId: String!, $distributor: String!) {
-    rewardsClaimeds(where: { distributor: $distributor, account: $accountId }) {
-      id
-      amount
-    }
-  }
-`;
-
-const RewardsDistributionsDocument = `
-  query RewardsDistributions($distributor: String!) {
-    rewardsDistributions(where: { distributor: $distributor}) {
-      collateral_type
-      amount
-      duration
-      start
-      created_at
-    }
-  }
-`;
-
 export function useRewards({
   poolId,
   collateralSymbol,
@@ -125,32 +102,6 @@ export function useRewards({
       if (filteredDistributors.length === 0) return [];
 
       try {
-        const returnData = await Promise.all([
-          // Historical data for account id / distributor address pair
-          ...filteredDistributors.map((distributor) =>
-            fetch(getSubgraphUrl(network?.name), {
-              method: 'POST',
-              body: JSON.stringify({
-                query: RewardsDataDocument,
-                variables: { accountId, distributor: distributor.address.toLowerCase() },
-              }),
-            }).then((res) => res.json())
-          ),
-          // Metadata for each distributor
-          ...filteredDistributors.map((distributor) =>
-            fetch(getSubgraphUrl(network?.name), {
-              method: 'POST',
-              body: JSON.stringify({
-                query: RewardsDistributionsDocument,
-                variables: { distributor: distributor.address.toLowerCase() },
-              }),
-            }).then((res) => res.json())
-          ),
-        ]);
-
-        const historicalData = returnData.slice(0, filteredDistributors.length);
-        const metaData = returnData.slice(filteredDistributors.length);
-
         const CoreProxyContract = new ethers.Contract(CoreProxy.address, CoreProxy.abi, provider);
 
         // Get claimable amount for each distributor
@@ -188,35 +139,12 @@ export function useRewards({
         const results: RewardsResponseType = filteredDistributors.map((item: any, i: number) => {
           // Amount claimable for this distributor
           const claimableAmount = amounts[i];
-          const historicalClaims = historicalData[i]?.data?.rewardsClaimeds;
-          const distributions = metaData[i]?.data?.rewardsDistributions;
           const symbol = item.payoutToken.symbol;
           const synthToken = synthTokens?.find(
             (synth) => synth?.address?.toUpperCase() === item?.payoutToken?.address?.toUpperCase()
           );
           const displaySymbol = synthToken ? synthToken?.symbol.slice(1) : symbol;
 
-          if (!distributions || !distributions.length) {
-            return {
-              address: item.address,
-              name: item.name,
-              symbol,
-              displaySymbol,
-              distributorAddress: item.address,
-              decimals: item.payoutToken.decimals,
-              payoutTokenAddress: item.payoutToken.address,
-              claimableAmount: wei(0),
-              lifetimeClaimed: historicalClaims
-                ? historicalClaims
-                    .reduce(
-                      (acc: Wei, item: { amount: string }) => acc.add(wei(item.amount, 18, true)),
-                      wei(0)
-                    )
-                    .toNumber()
-                : 0,
-            };
-          }
-
           return {
             address: item.address,
             name: item.name,
@@ -226,12 +154,6 @@ export function useRewards({
             decimals: item.payoutToken.decimals,
             payoutTokenAddress: item.payoutToken.address,
             claimableAmount,
-            lifetimeClaimed: historicalClaims
-              .reduce(
-                (acc: Wei, item: { amount: string }) => acc.add(wei(item.amount, 18, true)),
-                wei(0)
-              )
-              .toNumber(),
           };
         });
 

liquidity/ui/src/components/Rewards/AllRewardsModal.tsx

@@ -53,7 +53,7 @@ export const AllRewardsModal = ({ rewards, txnStatus, txnHash }: AllRewardsModal
         borderColor="gray.900"
         minWidth="384px"
       >
-        <ModalBody p={6}>
+        <ModalBody data-cy="claim rewards dialog" p={6}>
           <Text color="gray.50" fontSize="20px" fontWeight={700}>
             Claiming Rewards
           </Text>
@@ -93,6 +93,7 @@ export const AllRewardsModal = ({ rewards, txnStatus, txnHash }: AllRewardsModal
               alignItems="space-between"
               justifyContent="space-between"
               ml={2}
+              data-cy="claim rewards info"
             >
               {rewards.map(({ collateralSymbol, amount }) => (
                 <Text
@@ -137,6 +138,7 @@ export const AllRewardsModal = ({ rewards, txnStatus, txnHash }: AllRewardsModal
               mb={1}
               borderTop="1px solid"
               borderTopColor="gray.900"
+              data-cy="transaction hash"
             >
               <Link
                 variant="outline"

liquidity/ui/src/components/Rewards/Rewards.tsx

@@ -75,6 +75,7 @@ export function Rewards() {
             opacity: 0.5,
             cursor: 'not-allowed',
           }}
+          data-cy="claim rewards submit"
           onClick={() => claimAll()}
         >
           Claim
@@ -147,7 +148,6 @@ export function Rewards() {
                     key={item.address}
                     displaySymbol={item.displaySymbol}
                     claimableAmount={item.claimableAmount}
-                    lifetimeClaimed={item.lifetimeClaimed}
                     distributorAddress={item.distributorAddress}
                   />
                 ))

liquidity/ui/src/components/Rewards/RewardsRow.cy.tsx

@@ -18,7 +18,6 @@ describe('RewardsRow', () => {
             <RewardsRow
               displaySymbol="ETH"
               claimableAmount={wei(50)}
-              lifetimeClaimed={25}
               distributorAddress="0x123456789abcdef"
             />
           </Table>

liquidity/ui/src/components/Rewards/RewardsRow.tsx

@@ -4,20 +4,18 @@ import { etherscanLink } from '@snx-v3/etherscanLink';
 import { truncateAddress } from '@snx-v3/formatters';
 import { Tooltip } from '@snx-v3/Tooltip';
 import { useNetwork } from '@snx-v3/useBlockchain';
-import Wei, { wei } from '@synthetixio/wei';
+import Wei from '@synthetixio/wei';
 import { TokenIcon } from '../TokenIcon/TokenIcon';
 
 interface RewardsRowInterface {
   displaySymbol?: string;
   claimableAmount: Wei; // The immediate amount claimable as read from the contracts
-  lifetimeClaimed: number;
   distributorAddress: string;
 }
 
 export const RewardsRow = ({
   displaySymbol,
   claimableAmount,
-  lifetimeClaimed,
   distributorAddress,
 }: RewardsRowInterface) => {
   const { network } = useNetwork();
@@ -64,12 +62,6 @@ export const RewardsRow = ({
             >
               <Amount value={claimableAmount} showTooltip />
             </Text>
-            {lifetimeClaimed > 0 && (
-              <Text color="gray.500" fontSize="12px" fontFamily="heading" lineHeight="16px">
-                <Tooltip label="Total claimed over lifetime">Lifetime: &nbsp;</Tooltip>
-                <Amount value={wei(lifetimeClaimed)} />
-              </Text>
-            )}
           </Fade>
         </Td>
       </Tr>

yarn.lock

@@ -5996,7 +5996,6 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@snx-v3/useRewards@workspace:liquidity/lib/useRewards"
   dependencies:
-    "@snx-v3/constants": "workspace:*"
     "@snx-v3/tsHelpers": "workspace:*"
     "@snx-v3/useBlockchain": "workspace:*"
     "@snx-v3/useCollateralTypes": "workspace:*"