[LIVE-3146][LIVE-3626] Feature - EIP712 filtering (#1211)

* Remove prefix on EIP712 methods in module

* Remove useless changes on v parity for eth signMsg

* Make eth signPersonalMessage work without rawMsg

* Add crypto-js to hw-app-eth

* Add temp fake CAL for test purposes

* Add EIP712 filters related types

* Add getFiltersForMessage method to EIP712 utils

* Add filtering to EIP712 module

* Update fakeCAL for the real cryptoassets repo

* Add EIP712 importer to crypto-assets-importer script

* Move EIP712 sample messages to new fixture folder

* Change EIP712 tests folder architecture

* Add EIP712 tests with filters

* Sort alphabetically EIP712 types for schema hash

* Add 3 new messages to EIP721 tests

* Add EIP712 CAL Fixture

* Fix EIP721 integer encoder and update tests

* Update modified 712 APDUs due to new int encoder

* Update CAL directory for eip712 importer

* Update tsconfig to avoid false err on tree shaking

* Import from crypto-js with lowercase syntax

* Fix path of import for @ledgerhq/cryptoassets/data/*

* Add test for sortObjectAlphabetically

* Add eip712 CAL to vite config as common.js dep

* Add fallback to legacy eip712 msg signing + warning message in doc

* changesets

* Export getFiltersForMessage in hw-app-eth

* Update modal content scroll to vertical only

* Add methods to get nano screens from EIP712 msg signing

* Add LLD UI parsing to walletconnect msg signing

* Update isEIP712Message to allow string as param

* Add LLM UI parsing to walletconnect msg signing

* changeset

* Remove useless undefined type

Co-authored-by: Landry Monga <[email protected]>

* Add Ethereum nano app 1.10.0 as min requirement

* Update eip712 importer for new JSON format

* update screenshots

* Add missing translation

* Fix early return of MessageProperty component

* Simplify EIP712 module recursive func condition

* [LIVE-3641] Feature: EIP712 dynamic CAL (#1734)

* Add LLM UI parsing to walletconnect msg signing

* Add Dynamic CAL EIP712 in hw-app-eth

* Update LLD UI for EIP712 dynamic CAL

* Update LLM UI for EIP712 dynamic CAL

* Move ERC20 dynamic CAL tests into their own folder

* Update EIP712 tests for dynamic CAL

* changeset

* Add typing to dynamic CAL axios call

* Fix flashing on EIP721 signing with dynamic CAL

Co-authored-by: haammar-ledger <[email protected]>
Co-authored-by: Landry Monga <[email protected]>
Co-authored-by: Team Live <[email protected]>

.changeset/angry-maps-doubt.md

@@ -0,0 +1,5 @@
+---
+"@ledgerhq/live-common": minor
+---
+
+Add dynamic CAL support for EIP712

.changeset/chilled-months-behave.md

@@ -0,0 +1,5 @@
+---
+"ledger-live-desktop": minor
+---
+
+Add dynamic CAL support for EIP712 in signMessage flow

.changeset/early-camels-fetch.md

@@ -0,0 +1,5 @@
+---
+"@ledgerhq/hw-app-eth": minor
+---
+
+Add dynamic CAL support for EIP712

.changeset/gorgeous-pandas-tell.md

@@ -0,0 +1,5 @@
+---
+"live-mobile": minor
+---
+
+New UI parsing for signMessage flow, supporting EIP712 filtering

.changeset/little-fans-share.md

@@ -0,0 +1,5 @@
+---
+"ledger-live-desktop": minor
+---
+
+Add dynamic CAL support for EIP712 in signMessage flow

.changeset/nasty-spiders-live.md

@@ -0,0 +1,6 @@
+---
+"@ledgerhq/cryptoassets": minor
+"ledger-libs": minor
+---
+
+Add EIP712 CAL and CAL importer

.changeset/nine-pans-breathe.md

@@ -0,0 +1,5 @@
+---
+"ledger-live-desktop": minor
+---
+
+New UI parsing for signMessage flow, supporting EIP712 filtering

.changeset/popular-ravens-think.md

@@ -0,0 +1,5 @@
+---
+"ledger-live-desktop": minor
+---
+
+Add eip721 cryptoassets data to vite config

.changeset/real-wombats-decide.md

@@ -0,0 +1,5 @@
+---
+"@ledgerhq/live-common": minor
+---
+
+Remove EIP712 message signing from env and set as definitve feature + update tests accordingly

.changeset/young-sloths-count.md

@@ -0,0 +1,5 @@
+---
+"@ledgerhq/hw-app-eth": minor
+---
+
+Add filtering to EIP712 message signing

apps/ledger-live-desktop/src/renderer/components/DeviceAction/index.tsx

@@ -328,11 +328,12 @@ export const DeviceActionDefaultRendering = <R, H, P>({
   }
 
   if (request && signMessageRequested) {
-    const { account } = request;
+    const { account, parentAccount } = request;
     return (
       <SignMessageConfirm
         device={device}
         account={account}
+        parentAccount={parentAccount}
         signMessageRequested={signMessageRequested}
       />
     );

apps/ledger-live-desktop/src/renderer/components/Modal/ModalContent.jsx

@@ -13,7 +13,7 @@ const ContentWrapper = styled.div`
 
 const ContentScrollableContainer = styled.div`
   padding: 20px ${p => (p.noScroll ? 20 : 20 - p.theme.overflow.trackSize)}px 40px 20px;
-  ${p => (p.noScroll ? "overflow:hidden" : p.theme.overflow.xy)};
+  ${p => (p.noScroll ? "overflow:hidden" : p.theme.overflow.y)};
   position: relative;
   flex: 0 auto;
 `;

apps/ledger-live-desktop/src/renderer/components/SignMessageConfirm/index.tsx

@@ -0,0 +1,139 @@
+import invariant from "invariant";
+import styled from "styled-components";
+import { useTranslation } from "react-i18next";
+import React, { useEffect, useState } from "react";
+import { Account, AccountLike } from "@ledgerhq/types-live";
+import { getMainAccount } from "@ledgerhq/live-common/account/index";
+import { Device } from "@ledgerhq/live-common/hw/actions/types";
+import { MessageData } from "@ledgerhq/live-common/hw/signMessage/types";
+import { NanoDisplayedInfoFor712 } from "~/renderer/modals/SignMessage/types";
+import { DeviceTransactionField } from "@ledgerhq/live-common/transaction/index";
+import { TypedMessageData } from "@ledgerhq/live-common/families/ethereum/types";
+import { renderVerifyUnwrapped } from "~/renderer/components/DeviceAction/rendering";
+import { getMessageProperties } from "~/renderer/modals/SignMessage/utils";
+import SignMessageConfirmField from "./SignMessageConfirmField";
+import Spinner from "~/renderer/components/BigSpinner.jsx";
+import useTheme from "~/renderer/hooks/useTheme";
+import Text from "~/renderer/components/Text";
+import Box from "~/renderer/components/Box";
+
+const FieldText = styled(Text).attrs(() => ({
+  ml: 1,
+  ff: "Inter|Medium",
+  color: "palette.text.shade80",
+  fontSize: 3,
+}))`
+  word-break: break-all;
+  text-align: right;
+  max-width: 50%;
+`;
+
+export type FieldComponentProps = {
+  account: AccountLike;
+  field: DeviceTransactionField;
+};
+
+export type FieldComponent = React.ComponentType<FieldComponentProps>;
+
+const TextField = ({ field }: FieldComponentProps) => {
+  return field.type === "text" ? (
+    <SignMessageConfirmField label={field.label}>
+      <FieldText>{field.value}</FieldText>
+    </SignMessageConfirmField>
+  ) : null;
+};
+
+const Container = styled(Box).attrs(() => ({
+  alignItems: "center",
+  fontSize: 4,
+  pb: 4,
+}))``;
+
+type Props = {
+  device: Device;
+  account: AccountLike;
+  parentAccount: Account | null | undefined;
+  signMessageRequested: TypedMessageData | MessageData;
+};
+
+const SignMessageConfirm = ({ device, account, parentAccount, signMessageRequested }: Props) => {
+  const type = useTheme("colors.palette.type");
+  const { t } = useTranslation();
+  const { currency } = getMainAccount(account, parentAccount);
+  const [inferredNanoFields, setInferredNanoFields] = useState<{
+    message: string;
+    fields?: NanoDisplayedInfoFor712;
+  }>();
+
+  useEffect(() => {
+    getMessageProperties(currency, signMessageRequested).then(setInferredNanoFields);
+  }, [currency, signMessageRequested]);
+
+  if (!device) return null;
+
+  let fields = [];
+  if (inferredNanoFields?.fields && Array.isArray(inferredNanoFields.fields)) {
+    fields = inferredNanoFields.fields.map(field => ({
+      ...field,
+      type: "text",
+      value: Array.isArray(field.value) ? field.value.join(",\n") : field.value,
+    }));
+  } else {
+    if ((signMessageRequested as TypedMessageData)?.hashes) {
+      const { hashes } = signMessageRequested as TypedMessageData;
+
+      if (hashes.domainHash) {
+        fields.push({
+          type: "text",
+          label: t("SignMessageConfirm.domainHash"),
+          value: hashes.domainHash,
+        });
+      }
+
+      if (hashes.messageHash) {
+        fields.push({
+          type: "text",
+          label: t("SignMessageConfirm.messageHash"),
+          value: hashes.messageHash,
+        });
+      }
+
+      if (hashes.stringHash) {
+        fields.push({
+          type: "text",
+          label: t("SignMessageConfirm.stringHash"),
+          value: hashes.stringHash,
+        });
+      }
+    }
+
+    fields.push({
+      type: "text",
+      label: t("SignMessageConfirm.message"),
+      value:
+        typeof signMessageRequested.message === "object"
+          ? JSON.stringify(signMessageRequested.message)
+          : signMessageRequested.message,
+    });
+  }
+
+  return (
+    <Container>
+      {!inferredNanoFields?.message ? (
+        <Spinner size={30} />
+      ) : (
+        <>
+          <Box style={{ width: "100%" }} px={30} mb={20}>
+            {fields.map((field, i) => {
+              return <TextField key={i} field={field} account={account} />;
+            })}
+          </Box>
+
+          {renderVerifyUnwrapped({ modelId: device.modelId, type })}
+        </>
+      )}
+    </Container>
+  );
+};
+
+export default SignMessageConfirm;