From 3a5ee3f3d6c8ab2d0086f17c07464b1f6aeecf4b Mon Sep 17 00:00:00 2001
From: Alexis Sellier <self@cloudhead.io>
Date: Wed, 15 Sep 2021 16:55:31 +0200
Subject: [PATCH] Display short addresses differently

Use an "en dash" instead of an ellipsis.

Signed-off-by: Alexis Sellier <self@cloudhead.io>
---
 src/Header.svelte         | 2 +-
 src/base/orgs/List.svelte | 6 +++---
 src/utils.ts              | 8 ++++++--
 3 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/Header.svelte b/src/Header.svelte
index 237c87256..3c3191448 100644
--- a/src/Header.svelte
+++ b/src/Header.svelte
@@ -70,7 +70,7 @@
     justify-content: center;
     min-height: 42px;
     margin-left: 2rem;
-    width: 9.25rem;
+    width: 10rem;
   }
   .connect {
     display: inline-block;
diff --git a/src/base/orgs/List.svelte b/src/base/orgs/List.svelte
index ccfd48bd3..deff402a1 100644
--- a/src/base/orgs/List.svelte
+++ b/src/base/orgs/List.svelte
@@ -15,8 +15,8 @@
 
 <style>
   .org {
-    width: 7rem;
-    height: 7rem;
+    width: 8rem;
+    height: 8rem;
     margin-left: 3rem;
     margin-top: 1.5rem;
     margin-bottom: 1.5rem;
@@ -41,7 +41,7 @@
     padding: 0rem 0.5rem;
     text-overflow: ellipsis;
     overflow-x: hidden;
-    max-width: 7rem;
+    max-width: 8rem;
   }
   .list {
     display: flex;
diff --git a/src/utils.ts b/src/utils.ts
index da125bb7f..6ce7ec0f2 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -48,8 +48,12 @@ export function formatCAIP10Address(address: string, protocol: string, impl: num
   return `${address.toLowerCase()}@${protocol}:${impl.toString()}`;
 }
 
-export function formatAddress(addr: string): string {
-  return formatHash(ethers.utils.getAddress(addr)).replace(/^0x/, "");
+export function formatAddress(input: string): string {
+  const addr = ethers.utils.getAddress(input).replace(/^0x/, "");
+
+  return addr.substring(0, 4)
+    + ' – '
+    + addr.substring(addr.length - 4, addr.length);
 }
 
 export function formatIpfsFile(ipfs: string | undefined): string | undefined {