chore(#1972): delete deposit page and update deposit cypress tests (#1990)

* fix: #1972 update deposit cypress tests and delete deposit trading page

* fix: #1972 remove portfolio/deposit route

apps/trading-e2e/src/integration/deposit.cy.ts

@@ -1,3 +1,5 @@
+import { connectVegaWallet } from '../support/vega-wallet';
+
 const connectEthWalletBtn = 'connect-eth-wallet-btn';
 const assetSelectField = 'select[name="asset"]';
 const toAddressField = 'input[name="to"]';
@@ -9,8 +11,14 @@ describe('deposit form validation', { tags: '@smoke' }, () => {
     cy.mockWeb3Provider();
     cy.mockGQLSubscription();
     cy.mockTradingPage();
-    cy.visit('/#/portfolio/deposit');
+    cy.visit('/#/portfolio');
+    cy.get('main[data-testid="/portfolio"]').should('exist');
+    cy.getByTestId('Deposits').click();
 
+    cy.getByTestId('tab-deposits').contains('Connect your Vega wallet');
+    connectVegaWallet();
+    // validateFillsDisplayed();
+    cy.getByTestId('deposit-button').click();
     // Deposit page requires connection Ethereum wallet first
     cy.getByTestId(connectEthWalletBtn).click();
     cy.getByTestId('web3-connector-MetaMask').click();
@@ -19,11 +27,11 @@ describe('deposit form validation', { tags: '@smoke' }, () => {
   });
 
   it('handles empty fields', () => {
-    // Submit form to trigger any empty validaion messages
+    // Submit form to trigger any empty validation messages
     cy.getByTestId('deposit-submit').click();
 
     cy.getByTestId(formFieldError).should('contain.text', 'Required');
-    cy.getByTestId(formFieldError).should('have.length', 3);
+    cy.getByTestId(formFieldError).should('have.length', 2);
 
     // Invalid public key
     cy.get(toAddressField)
@@ -64,7 +72,7 @@ describe('deposit form validation', { tags: '@smoke' }, () => {
     cy.get('#ethereum-address').should('have.value', ethWalletAddress).click();
     cy.getByTestId('dialog-content').within(() => {
       cy.get('p').should('have.text', `Connected with ${ethWalletAddress}`);
-      cy.get('button')
+      cy.getByTestId('disconnect-ethereum-wallet')
         .should('have.text', 'Disconnect Ethereum Wallet')
         .click();
     });

apps/trading/client-pages/deposit/deposit-container.tsx

@@ -1,38 +0,0 @@
-import { DepositManager } from '@vegaprotocol/deposits';
-import { useDataProvider, t } from '@vegaprotocol/react-helpers';
-import { enabledAssetsProvider } from '@vegaprotocol/assets';
-import { useEnvironment } from '@vegaprotocol/environment';
-import { AsyncRenderer, Splash } from '@vegaprotocol/ui-toolkit';
-
-/**
- *  Fetches data required for the Deposit page
- */
-export const DepositContainer = () => {
-  const { VEGA_ENV } = useEnvironment();
-  const { data, error, loading } = useDataProvider({
-    dataProvider: enabledAssetsProvider,
-  });
-  return (
-    <AsyncRenderer
-      data={data}
-      error={error}
-      loading={loading}
-      render={(assets) => {
-        if (!assets || !assets.length) {
-          return (
-            <Splash>
-              <p>{t('No assets on this network')}</p>
-            </Splash>
-          );
-        }
-
-        return (
-          <DepositManager
-            assets={assets}
-            isFaucetable={VEGA_ENV !== 'MAINNET'}
-          />
-        );
-      }}
-    />
-  );
-};

apps/trading/client-pages/deposit/deposit.tsx

@@ -1,52 +0,0 @@
-import { enabledAssetsProvider } from '@vegaprotocol/assets';
-import { DepositManager } from '@vegaprotocol/deposits';
-import { useEnvironment } from '@vegaprotocol/environment';
-import { t, titlefy, useDataProvider } from '@vegaprotocol/react-helpers';
-import { AsyncRenderer, Splash } from '@vegaprotocol/ui-toolkit';
-import { Web3Container } from '@vegaprotocol/web3';
-import { useEffect } from 'react';
-import { usePageTitleStore } from '../../stores';
-
-export const Deposit = () => {
-  const { updateTitle } = usePageTitleStore((store) => ({
-    updateTitle: store.updateTitle,
-  }));
-
-  useEffect(() => {
-    updateTitle(titlefy([t('Deposits')]));
-  }, [updateTitle]);
-
-  const { VEGA_ENV } = useEnvironment();
-  const { data, error, loading } = useDataProvider({
-    dataProvider: enabledAssetsProvider,
-  });
-
-  return (
-    <Web3Container>
-      <div className="max-w-[420px] p-8 mx-auto">
-        <h1 className="text-2xl mb-4">{t('Deposit')}</h1>
-        <AsyncRenderer
-          data={data}
-          error={error}
-          loading={loading}
-          render={(assets) => {
-            if (!assets || !assets.length) {
-              return (
-                <Splash>
-                  <p>{t('No assets on this network')}</p>
-                </Splash>
-              );
-            }
-
-            return (
-              <DepositManager
-                assets={assets}
-                isFaucetable={VEGA_ENV !== 'MAINNET'}
-              />
-            );
-          }}
-        />
-      </div>
-    </Web3Container>
-  );
-};

apps/trading/client-pages/deposit/index.ts

@@ -1,3 +0,0 @@
-import { Deposit } from './deposit';
-
-export default Deposit;

apps/trading/client-pages/portfolio/deposits-container.tsx

@@ -25,7 +25,11 @@ export const DepositsContainer = () => {
         setDepositDialog={setDepositDialog}
       />
       <div className="w-full dark:bg-black bg-white absolute bottom-0 h-auto flex justify-end px-[11px] py-2">
-        <Button size="sm" onClick={() => setDepositDialog(true)}>
+        <Button
+          size="sm"
+          onClick={() => setDepositDialog(true)}
+          data-testid="deposit-button"
+        >
           {t('Deposit')}
         </Button>
       </div>

apps/trading/pages/client-router.tsx

@@ -23,15 +23,10 @@ const LazyPortfolio = dynamic(() => import('../client-pages/portfolio'), {
   ssr: false,
 });
 
-const LazyDeposit = dynamic(() => import('../client-pages/deposit'), {
-  ssr: false,
-});
-
 export enum Routes {
   HOME = '/',
   MARKETS = '/markets',
   PORTFOLIO = '/portfolio',
-  PORTFOLIO_DEPOSIT = '/portfolio/deposit',
 }
 
 const routerConfig = [
@@ -55,10 +50,6 @@ const routerConfig = [
     path: Routes.PORTFOLIO,
     element: <LazyPortfolio />,
   },
-  {
-    path: Routes.PORTFOLIO_DEPOSIT,
-    element: <LazyDeposit />,
-  },
 ];
 
 export const ClientRouter = () => {

libs/web3/src/lib/web3-wallet-input.tsx

@@ -34,7 +34,10 @@ export const Web3WalletInput = ({ inputProps }: Web3WalletInputProps) => {
           {t('Connected with ')}
           <span className="font-mono">{account}</span>
         </p>
-        <Button onClick={() => connector.deactivate()}>
+        <Button
+          onClick={() => connector.deactivate()}
+          data-testid="disconnect-ethereum-wallet"
+        >
           {t('Disconnect Ethereum Wallet')}
         </Button>
       </Dialog>