From defbef736f174b67c55a2823e6f6049aa1313521 Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Sat, 4 Jan 2025 18:19:25 -0700
Subject: [PATCH] fix any error messages with words that are too long and push
 the "X" off the page

---
 src/App.vue                   | 15 +++++++++++----
 src/views/ContactEditView.vue |  2 +-
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 4778077..146cc3b 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -45,7 +45,7 @@
 
             <div class="relative w-full pl-4 pr-8 py-2 text-slate-900">
               <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
+              <p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
 
               <button
                 @click="close(notification.id)"
@@ -68,7 +68,7 @@
 
             <div class="relative w-full pl-4 pr-8 py-2 text-emerald-900">
               <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
+              <p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
 
               <button
                 @click="close(notification.id)"
@@ -91,7 +91,7 @@
 
             <div class="relative w-full pl-4 pr-8 py-2 text-amber-900">
               <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
+              <p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
 
               <button
                 @click="close(notification.id)"
@@ -114,7 +114,7 @@
 
             <div class="relative w-full pl-4 pr-8 py-2 text-rose-900">
               <span class="font-semibold">{{ notification.title }}</span>
-              <p class="text-sm">{{ notification.text }}</p>
+              <p class="text-sm">{{ truncateLongWords(notification.text) }}</p>
 
               <button
                 @click="close(notification.id)"
@@ -329,6 +329,13 @@ export default class App extends Vue {
 
   stopAsking = false;
 
+  truncateLongWords(sentence: string) {
+    return sentence
+      .split(" ")
+      .map(word => (word.length > 30 ? word.slice(0, 30) + "..." : word))
+      .join(" ");
+  }
+
   async turnOffNotifications(notification: NotificationIface) {
     let subscription: object | null = null;
 
diff --git a/src/views/ContactEditView.vue b/src/views/ContactEditView.vue
index 04937a7..9616fac 100644
--- a/src/views/ContactEditView.vue
+++ b/src/views/ContactEditView.vue
@@ -103,7 +103,7 @@ export default class ContactEditView extends Vue {
         group: "alert",
         type: "danger",
         title: "Contact Not Found",
-        text: "There is no contact with that DID.",
+        text: "There is no contact with DID " + contactDid,
       });
       (this.$router as Router).push({ path: "/contacts" });
       return;