cleanup ellipsize logic from claude review

Author: leofelix077

extension/src/popup/components/TruncatedMemo/__tests__/TruncatedMemo.test.tsx

@@ -19,11 +19,6 @@ describe("TruncatedMemo", () => {
     expect(el.hasAttribute("title")).toBe(false);
   });
 
-  it("uses custom fallback when provided", () => {
-    render(<TruncatedMemo memo={null} fallback="—" data-testid="memo" />);
-    expect(screen.getByTestId("memo").textContent).toBe("—");
-  });
-
   it("does not mutate the memo (no trimming)", () => {
     const memo = "  whitespace padded memo  ";
     render(<TruncatedMemo memo={memo} data-testid="memo" />);
@@ -38,23 +33,4 @@ describe("TruncatedMemo", () => {
     expect(el.tagName).toBe("SPAN");
     expect(el.className).toContain("TruncatedMemo--inline");
   });
-
-  it("applies maxChars pre-truncation while preserving the full value in title", () => {
-    const memo = "abcdefghijklmnop";
-    render(<TruncatedMemo memo={memo} maxChars={6} data-testid="memo" />);
-    const el = screen.getByTestId("memo");
-    expect(el.textContent).toBe("abcdef…");
-    expect(el.getAttribute("title")).toBe(memo);
-  });
-
-  it("does not apply maxChars when memo fits within the limit", () => {
-    render(<TruncatedMemo memo="short" maxChars={10} data-testid="memo" />);
-    expect(screen.getByTestId("memo").textContent).toBe("short");
-  });
-
-  it("treats maxChars={0} as no truncation", () => {
-    const memo = "abcdef";
-    render(<TruncatedMemo memo={memo} maxChars={0} data-testid="memo" />);
-    expect(screen.getByTestId("memo").textContent).toBe(memo);
-  });
 });

extension/src/popup/components/TruncatedMemo/index.tsx

@@ -5,42 +5,21 @@ import "./styles.scss";
 
 interface TruncatedMemoProps {
   memo?: string | null;
-  fallback?: string;
   inline?: boolean;
-  /**
-   * Optional character limit. When set, memos longer than `maxChars` are
-   * pre-truncated with an ellipsis before being handed to CSS. Useful in
-   * tight popup layouts where the value cell shares its row with a fixed
-   * suffix (e.g. a memo-type tag) and CSS-only ellipsis would still let
-   * the value push past its share.
-   */
-  maxChars?: number;
   className?: string;
   "data-testid"?: string;
 }
 
-const ellipsize = (value: string, maxChars: number) =>
-  value.length > maxChars ? `${value.slice(0, maxChars).trimEnd()}…` : value;
-
 export const TruncatedMemo = ({
   memo,
-  fallback,
   inline = false,
-  maxChars,
   className,
   "data-testid": dataTestId,
 }: TruncatedMemoProps) => {
   const { t } = useTranslation();
   const hasMemo = !!memo;
   const fullMemo = hasMemo ? (memo as string) : "";
-  const fallbackText = fallback ?? t("None");
-  const shouldEllipsize =
-    hasMemo && typeof maxChars === "number" && maxChars > 0;
-  const displayValue = hasMemo
-    ? shouldEllipsize
-      ? ellipsize(fullMemo, maxChars as number)
-      : fullMemo
-    : fallbackText;
+  const displayValue = hasMemo ? fullMemo : t("None");
   const Tag = inline ? "span" : "div";
   const classes = [
     "TruncatedMemo",

extension/src/popup/components/accountHistory/TransactionDetail/styles.scss

@@ -299,19 +299,14 @@
       }
 
       &__memo {
-        // Truncation (overflow/ellipsis/nowrap) is owned by `.TruncatedMemo`;
-        // this selector only adds the layout-specific tweaks needed in this
-        // metadata row.
         width: 100%;
-        text-align: right;
       }
 
       &__value {
         &--memo {
           min-width: 0;
           flex: 1 1 0;
           max-width: 60%;
-          overflow: hidden;
           text-align: right;
         }
 

extension/src/popup/views/SignTransaction/Preview/Summary/styles.scss

@@ -25,7 +25,7 @@
     &__value {
       color: var(
         --sds-clr-gray-12
-      ) !important; //sds rule does not allow changing colors on p tags
+      ) !important; //needed to override SDS color rules
 
       &--memo {
         display: inline-flex;