[LW-7983] [LW-7984] dRep confirmation screens

.github/workflows/e2e-tests-linux.yml

@@ -50,9 +50,9 @@ jobs:
         uses: ./.github/shared/build
         with:
           LACE_EXTENSION_KEY: ${{ secrets.MANIFEST_PUBLIC_KEY }}
-          CARDANO_SERVICES_URL_MAINNET: ${{ secrets.CARDANO_SERVICES_URL_MAINNET }}
-          CARDANO_SERVICES_URL_PREPROD: ${{ secrets.CARDANO_SERVICES_URL_PREPROD }}
-          CARDANO_SERVICES_URL_PREVIEW: ${{ secrets.CARDANO_SERVICES_URL_PREVIEW }}
+          CARDANO_SERVICES_URL_MAINNET: ${{ secrets.CARDANO_SERVICES_DEV_URL_MAINNET }}
+          CARDANO_SERVICES_URL_PREPROD: ${{ secrets.CARDANO_SERVICES_DEV_URL_PREPROD }}
+          CARDANO_SERVICES_URL_PREVIEW: ${{ secrets.CARDANO_SERVICES_DEV_URL_PREVIEW }}
       - name: Start XVFB
         run: |
           Xvfb :99 &

.github/workflows/smoke-tests.yml

@@ -26,9 +26,9 @@ jobs:
         uses: ./.github/shared/build
         with:
           LACE_EXTENSION_KEY: ${{ secrets.MANIFEST_PUBLIC_KEY }}
-          CARDANO_SERVICES_URL_MAINNET: ${{ secrets.CARDANO_SERVICES_URL_MAINNET }}
-          CARDANO_SERVICES_URL_PREPROD: ${{ secrets.CARDANO_SERVICES_URL_PREPROD }}
-          CARDANO_SERVICES_URL_PREVIEW: ${{ secrets.CARDANO_SERVICES_URL_PREVIEW }}
+          CARDANO_SERVICES_URL_MAINNET: ${{ secrets.CARDANO_SERVICES_DEV_URL_MAINNET }}
+          CARDANO_SERVICES_URL_PREPROD: ${{ secrets.CARDANO_SERVICES_DEV_URL_PREPROD }}
+          CARDANO_SERVICES_URL_PREVIEW: ${{ secrets.CARDANO_SERVICES_DEV_URL_PREVIEW }}
       - name: Start XVFB
         run: |
           Xvfb :99 &

apps/browser-extension-wallet/package.json

@@ -54,6 +54,7 @@
     "@lace/common": "0.1.0",
     "@lace/core": "0.1.0",
     "@lace/staking": "0.1.0",
+    "@lace/ui": "^0.1.0",
     "@react-rxjs/core": "^0.9.8",
     "@react-rxjs/utils": "^0.9.5",
     "@vespaiach/axios-fetch-adapter": "^0.3.0",

apps/browser-extension-wallet/src/dapp-connector.tsx

@@ -14,6 +14,7 @@ import {
 } from '@providers';
 import { HashRouter } from 'react-router-dom';
 import { ThemeProvider } from '@providers/ThemeProvider';
+import { UIThemeProvider } from '@providers/UIThemeProvider';
 import { BackgroundServiceAPIProvider } from '@providers/BackgroundServiceAPI';
 import { APP_MODE_POPUP } from './utils/constants';
 import { PostHogClientProvider } from '@providers/PostHogClientProvider';
@@ -32,7 +33,9 @@ const App = (): React.ReactElement => (
                     <ExperimentsProvider>
                       <AnalyticsProvider>
                         <ThemeProvider>
-                          <DappConnectorView />
+                          <UIThemeProvider>
+                            <DappConnectorView />
+                          </UIThemeProvider>
                         </ThemeProvider>
                       </AnalyticsProvider>
                     </ExperimentsProvider>

apps/browser-extension-wallet/src/features/dapp/components/__tests__/ConfirmTransaction.test.tsx

@@ -9,7 +9,7 @@ const mockConsumeRemoteApi = jest.fn().mockReturnValue({
 const mockCreateTxInspector = jest.fn().mockReturnValue(() => ({ minted: [] as any, burned: [] as any }));
 import * as React from 'react';
 import { cleanup, render, waitFor } from '@testing-library/react';
-import { ConfirmTransaction } from '../ConfirmTransaction';
+import { ConfirmTransaction } from '../confirm-transaction/ConfirmTransaction';
 import '@testing-library/jest-dom';
 import { I18nextProvider } from 'react-i18next';
 import { StoreProvider } from '@src/stores';

apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRegistrationContainer.tsx

@@ -0,0 +1,46 @@
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { ConfirmDRepRegistration } from '@lace/core';
+import { SignTxData } from './types';
+import { dRepRegistrationInspector, drepIDasBech32FromHash } from './utils';
+import { Wallet } from '@lace/cardano';
+import { useWalletStore } from '@src/stores';
+
+interface Props {
+  signTxData: SignTxData;
+  errorMessage?: string;
+}
+
+export const ConfirmDRepRegistrationContainer = ({ signTxData, errorMessage }: Props): React.ReactElement => {
+  const { t } = useTranslation();
+  const certificate = dRepRegistrationInspector(signTxData.tx);
+  const {
+    walletUI: { cardanoCoin }
+  } = useWalletStore();
+
+  const depositPaidWithCardanoSymbol = `${Wallet.util.lovelacesToAdaString(certificate.deposit.toString())} ${
+    cardanoCoin.symbol
+  }`;
+
+  return (
+    <ConfirmDRepRegistration
+      dappInfo={signTxData.dappInfo}
+      metadata={{
+        depositPaid: depositPaidWithCardanoSymbol,
+        drepId: drepIDasBech32FromHash(certificate.dRepCredential.hash),
+        hash: certificate.anchor?.dataHash,
+        url: certificate.anchor?.url
+      }}
+      translations={{
+        metadata: t('core.drepRegistration.metadata'),
+        labels: {
+          depositPaid: t('core.drepRegistration.depositPaid'),
+          drepId: t('core.drepRegistration.drepId'),
+          hash: t('core.drepRegistration.hash'),
+          url: t('core.drepRegistration.url')
+        }
+      }}
+      errorMessage={errorMessage}
+    />
+  );
+};