From b6c176fb0e7fd347ec6d7f791e79d5bba7712873 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 5 Jul 2021 21:12:16 -0300
Subject: [PATCH] Fix truncation

---
 src/TokenTransferItem.tsx           | 7 ++++---
 src/components/AddressOrENSName.tsx | 2 +-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/TokenTransferItem.tsx b/src/TokenTransferItem.tsx
index bbdd45b..64351ee 100644
--- a/src/TokenTransferItem.tsx
+++ b/src/TokenTransferItem.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faCaretRight } from "@fortawesome/free-solid-svg-icons";
 import AddressLink from "./components/AddressLink";
+import AddressOrENSName from "./components/AddressOrENSName";
 import TokenLogo from "./components/TokenLogo";
 import FormattedBalance from "./components/FormattedBalance";
 import { TokenMetas, TokenTransfer } from "./types";
@@ -20,9 +21,9 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
       <FontAwesomeIcon icon={faCaretRight} size="1x" />
     </span>
     <span className="font-bold">From</span>
-    <AddressLink address={t.from} />
+    <AddressOrENSName address={t.from} />
     <span className="font-bold">To</span>
-    <AddressLink address={t.to} />
+    <AddressOrENSName address={t.to} />
     <span className="font-bold">For</span>
     <span>
       <FormattedBalance
@@ -42,7 +43,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
           />
         </>
       ) : (
-        <AddressLink address={t.token} />
+        <AddressOrENSName address={t.token} />
       )}
     </span>
   </div>
diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx
index 8bcf024..ce1ec8a 100644
--- a/src/components/AddressOrENSName.tsx
+++ b/src/components/AddressOrENSName.tsx
@@ -19,7 +19,7 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   selectedAddress,
   minerAddress,
 }) => (
-  <div className="flex items-baseline space-x-1">
+  <div className="flex items-baseline space-x-1 truncate">
     {minerAddress !== undefined && minerAddress === address && (
       <span className="text-yellow-400" title="Miner address">
         <FontAwesomeIcon icon={faCoins} size="1x" />