From d06447f6afd95d1d66ef2597def5e1877db4fa3b Mon Sep 17 00:00:00 2001
From: Chuck Driesler <chuck@speckle.systems>
Date: Thu, 21 Nov 2024 11:36:14 +0000
Subject: [PATCH] fix(automate): handle newline in status messages (#3532)

* fix(automate): handle newline in status messages

* fix(automate): learn css
---
 .../automate/viewer/panel/FunctionRunRow.vue  | 28 +++++++++----------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/packages/frontend-2/components/automate/viewer/panel/FunctionRunRow.vue b/packages/frontend-2/components/automate/viewer/panel/FunctionRunRow.vue
index eb3ccc1b2..2cb244b52 100644
--- a/packages/frontend-2/components/automate/viewer/panel/FunctionRunRow.vue
+++ b/packages/frontend-2/components/automate/viewer/panel/FunctionRunRow.vue
@@ -35,20 +35,8 @@
       <!-- Status message -->
       <div class="space-y-1">
         <div class="text-xs font-medium text-foreground-2">Status</div>
-        <div
-          v-if="
-            [
-              AutomateRunStatus.Initializing,
-              AutomateRunStatus.Running,
-              AutomateRunStatus.Pending
-            ].includes(functionRun.status)
-          "
-          class="text-xs text-foreground-2 italic"
-        >
-          Function is {{ functionRun.status.toLowerCase() }}.
-        </div>
-        <div v-else class="text-xs text-foreground-2 italic">
-          {{ functionRun.statusMessage || 'No status message' }}
+        <div class="text-xs text-foreground-2 italic whitespace-pre-wrap">
+          {{ statusMessage }}
         </div>
       </div>
 
@@ -168,4 +156,16 @@ const hasValidContextView = computed(() => {
   const currentPath = route.fullPath
   return !doesRouteFitTarget(ctxView, currentPath)
 })
+
+const statusMessage = computed(() => {
+  const isFinished = ![
+    AutomateRunStatus.Initializing,
+    AutomateRunStatus.Running,
+    AutomateRunStatus.Pending
+  ].includes(props.functionRun.status)
+
+  return isFinished
+    ? props.functionRun.statusMessage ?? 'No status message'
+    : `Function is ${props.functionRun.status.toLowerCase()}.`
+})
 </script>