diff --git a/packages/web/public/i18n/locales/be-BY/ui.json b/packages/web/public/i18n/locales/be-BY/ui.json
index c8460b9f6..9a6e53986 100644
--- a/packages/web/public/i18n/locales/be-BY/ui.json
+++ b/packages/web/public/i18n/locales/be-BY/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Direct",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Last heard",
diff --git a/packages/web/public/i18n/locales/cs-CZ/ui.json b/packages/web/public/i18n/locales/cs-CZ/ui.json
index bc4862d89..01a53de54 100644
--- a/packages/web/public/i18n/locales/cs-CZ/ui.json
+++ b/packages/web/public/i18n/locales/cs-CZ/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Přímý",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Naposledy slyšen",
diff --git a/packages/web/public/i18n/locales/en/ui.json b/packages/web/public/i18n/locales/en/ui.json
index 721050dde..98724eb2f 100644
--- a/packages/web/public/i18n/locales/en/ui.json
+++ b/packages/web/public/i18n/locales/en/ui.json
@@ -152,8 +152,8 @@
   },
   "hops": {
     "direct": "Direct",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Last heard",
diff --git a/packages/web/public/i18n/locales/es-ES/ui.json b/packages/web/public/i18n/locales/es-ES/ui.json
index bcf133989..7ce787574 100644
--- a/packages/web/public/i18n/locales/es-ES/ui.json
+++ b/packages/web/public/i18n/locales/es-ES/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Directo",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Última escucha",
diff --git a/packages/web/public/i18n/locales/hu-HU/ui.json b/packages/web/public/i18n/locales/hu-HU/ui.json
index 8ea0a0ee3..adfa2de4b 100644
--- a/packages/web/public/i18n/locales/hu-HU/ui.json
+++ b/packages/web/public/i18n/locales/hu-HU/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Közvetlen",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Utoljára hallott",
diff --git a/packages/web/public/i18n/locales/ja-JP/ui.json b/packages/web/public/i18n/locales/ja-JP/ui.json
index 6afb22e05..64fed3a14 100644
--- a/packages/web/public/i18n/locales/ja-JP/ui.json
+++ b/packages/web/public/i18n/locales/ja-JP/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "直接",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "最後の通信",
diff --git a/packages/web/public/i18n/locales/nl-NL/ui.json b/packages/web/public/i18n/locales/nl-NL/ui.json
index ca37de0a6..57c28b930 100644
--- a/packages/web/public/i18n/locales/nl-NL/ui.json
+++ b/packages/web/public/i18n/locales/nl-NL/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Direct",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Laatst gehoord",
diff --git a/packages/web/public/i18n/locales/pl-PL/ui.json b/packages/web/public/i18n/locales/pl-PL/ui.json
index 206a8bb0b..53a283f5f 100644
--- a/packages/web/public/i18n/locales/pl-PL/ui.json
+++ b/packages/web/public/i18n/locales/pl-PL/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Bezpośrednio",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Aktywność",
diff --git a/packages/web/public/i18n/locales/pt-BR/ui.json b/packages/web/public/i18n/locales/pt-BR/ui.json
index ad8410678..c1b9897fd 100644
--- a/packages/web/public/i18n/locales/pt-BR/ui.json
+++ b/packages/web/public/i18n/locales/pt-BR/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Direto",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Visto pela última vez",
diff --git a/packages/web/public/i18n/locales/pt-PT/ui.json b/packages/web/public/i18n/locales/pt-PT/ui.json
index 6763befed..2124324fb 100644
--- a/packages/web/public/i18n/locales/pt-PT/ui.json
+++ b/packages/web/public/i18n/locales/pt-PT/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Direto",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Último recebido",
diff --git a/packages/web/public/i18n/locales/ru-RU/ui.json b/packages/web/public/i18n/locales/ru-RU/ui.json
index 492d459ec..a5c30e16a 100644
--- a/packages/web/public/i18n/locales/ru-RU/ui.json
+++ b/packages/web/public/i18n/locales/ru-RU/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Прямой",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Последний раз слышен",
diff --git a/packages/web/public/i18n/locales/tr-TR/ui.json b/packages/web/public/i18n/locales/tr-TR/ui.json
index 31c79f483..ccf677586 100644
--- a/packages/web/public/i18n/locales/tr-TR/ui.json
+++ b/packages/web/public/i18n/locales/tr-TR/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Doğrudan",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Son duyulma",
diff --git a/packages/web/public/i18n/locales/uk-UA/ui.json b/packages/web/public/i18n/locales/uk-UA/ui.json
index 8ad2d7242..795dc70ed 100644
--- a/packages/web/public/i18n/locales/uk-UA/ui.json
+++ b/packages/web/public/i18n/locales/uk-UA/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "Direct",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "Last heard",
diff --git a/packages/web/public/i18n/locales/zh-CN/ui.json b/packages/web/public/i18n/locales/zh-CN/ui.json
index 7269d6f5d..1cc2e25ff 100644
--- a/packages/web/public/i18n/locales/zh-CN/ui.json
+++ b/packages/web/public/i18n/locales/zh-CN/ui.json
@@ -166,8 +166,8 @@
   },
   "hops": {
     "direct": "直频",
-    "label": "Number of hops",
-    "text": "Number of hops: {{value}}"
+    "label": "Hops Away",
+    "text": "Hops Away: {{value}}"
   },
   "lastHeard": {
     "label": "最后听到",
diff --git a/packages/web/public/icon.svg b/packages/web/public/logo.svg
similarity index 100%
rename from packages/web/public/icon.svg
rename to packages/web/public/logo.svg
diff --git a/packages/web/src/components/PageComponents/Messages/MessageItem.tsx b/packages/web/src/components/PageComponents/Messages/MessageItem.tsx
index 54e589e38..33ffbeca5 100644
--- a/packages/web/src/components/PageComponents/Messages/MessageItem.tsx
+++ b/packages/web/src/components/PageComponents/Messages/MessageItem.tsx
@@ -193,6 +193,24 @@ export const MessageItem = ({ message }: MessageItemProps) => {
   const isOnPrimaryChannel = message.channel === Types.ChannelNumber.Primary; // Use the enum
   const shouldShowStatusIcon = isSender && isOnPrimaryChannel;
 
+  const messageMetadata = useMemo(() => {
+    if (message.hops != null) {
+      return (
+        <div className="text-xs text-slate-500 dark:text-slate-200 whitespace-pre-wrap break-words">
+          {t("hops.text", { value: message.hops })}
+        </div>
+      );
+    }
+    if (message.rxSnr != null && message.rxRssi != null) {
+      return (
+        <div className="text-xs text-slate-500 dark:text-slate-200 whitespace-pre-wrap break-words">
+          SNR: {message.rxSnr}, RSSI: {message.rxRssi}
+        </div>
+      );
+    }
+    return null;
+  }, [message.hops, message.rxSnr, message.rxRssi, t]);
+
   const messageItemWrapperClass = cn(
     "group w-full py-2 relative list-none",
     "rounded-md",
@@ -256,20 +274,11 @@ export const MessageItem = ({ message }: MessageItemProps) => {
           </div>
 
           {message?.message && (
-            <div className="text-sm text-slate-800 dark:text-slate-200 whitespace-pre-wrap break-words">
+            <div className="text-sm text-slate-800 dark:text-slate-200 whitespace-pre-wrap wrap-break-words">
               {message.message}
             </div>
           )}
-          {(message.hops && (
-            <div className="text-xs text-slate-500 dark:text-slate-200 whitespace-pre-wrap break-words">
-              {t("hops.text", { value: message.hops })}
-            </div>
-          )) ||
-            (message.rxSnr && message.rxRssi && (
-              <div className="text-xs text-slate-500 dark:text-slate-200 whitespace-pre-wrap break-words">
-                SNR: {message.rxSnr}, RSSI: {message.rxRssi}
-              </div>
-            ))}
+          {messageMetadata}
         </div>
       </div>
       {/* Actions Menu Placeholder */}