fix(chat): truncate log message size

deploy/run.sh

@@ -3,6 +3,7 @@ set -euo pipefail
 cd "$(dirname "$0")"
 
 host="root@hub.hordelab.com"
+remote_path="/var/horde/hub/"
 
 run_nginx() {
     echo "Uploading nginx config file"
@@ -43,6 +44,12 @@ run_update() {
     "
 }
 
+run_dist() {
+    echo "Uploading frontend/dist to $host:/var/frontend/dist"
+    ssh "$host" "rm -rf $remote_path/frontend/dist && mkdir $remote_path/frontend/dist"
+    scp -r ../frontend/dist "$host:$remote_path/frontend/"
+}
+
 restart_service() {
     echo "Restarting horde-hub.service"
     ssh "$host" -t "systemctl restart horde-hub.service"
@@ -50,6 +57,7 @@ restart_service() {
 
 # Determine which stages to run
 stages=()
+do_restart=0
 if [[ $# -eq 0 ]]; then
     # Interactive prompts when no arguments are given
     read -p "Run nginx deployment? [Y/n] " choice
@@ -70,8 +78,12 @@ else
     # Parse arguments
     for arg in "$@"; do
         case "$arg" in
-            nginx|service|update)
+            nginx|service|update|dist)
                 stages+=("$arg")
+	        do_restart=1
+                ;;
+            --dist)
+                stages+=("dist")
                 ;;
             *)
                 echo "Unknown argument: $arg" >&2
@@ -87,8 +99,9 @@ for stage in "${stages[@]}"; do
         nginx)   run_nginx ;;
         service) run_service ;;
         update)  run_update ;;
+	dist)    run_dist ;;
     esac
 done
 
 # Final stage: always restart the systemd service at the end
-restart_service
+if [[ $do_restart -eq 1 ]]; then restart_service; fi

frontend/src/components/Message.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, watch } from 'vue';
+import { ref, computed, watch } from 'vue';
 import { marked } from "marked";
 import * as backend from '../backend';
 marked.use({
@@ -24,6 +24,10 @@ const props = defineProps({
   cancellable: {
     type: Boolean,
     required: false,
+  },
+  logExpanded: {
+    type: Boolean,
+    required: false,
   }
 });
 
@@ -49,6 +53,23 @@ function resourceLabel(msg) {
 const format = ref(null);
 const content = ref("");
 
+// Log messages longer than LOG_MAX_LINES lines get expand/collapse controls
+const LOG_MAX_LINES = 6;
+const LOG_MAX_LENGTH = 64; // Single line size considered "too tall" to display
+
+const logLines = computed(() => String(content.value ?? '').split('\n'));
+const logLong = computed(() => props.message.type == 'log' && (
+  logLines.value.length > LOG_MAX_LINES || logLines.value.some(line => line.length > LOG_MAX_LENGTH)
+));
+const logContent = computed(() =>
+  logLong.value && !props.logExpanded
+    ? logLines.value.slice(0, LOG_MAX_LINES).join('\n').slice(0, LOG_MAX_LENGTH*LOG_MAX_LINES)
+    : content.value
+);
+
+// Given to the context menu; the expand/collapse entry is offered only when non-null
+const logMeta = computed(() => logLong.value ? {expanded: !!props.logExpanded} : null);
+
 let currentStreamId = null;
 
 watch(() => [props.message.format, props.message.content], ([newFormat, newContent]) => {
@@ -73,7 +94,7 @@ watch(() => [props.message.format, props.message.content], ([newFormat, newConte
 </script>
 
 <template>
-  <div :class="chatEntryClass(message)" @contextmenu.prevent="$emit('open-menu', message)">
+  <div :class="chatEntryClass(message)" @contextmenu.prevent="$emit('open-menu', message, logMeta)">
     <template v-if="message.type == 'message' || message.type == null">
       <div v-if="message.sender != 'user'" class="sender">{{message.sender}}</div>
 
@@ -93,7 +114,8 @@ watch(() => [props.message.format, props.message.content], ([newFormat, newConte
 
     <template v-if="message.type == 'log'">
       <div class="log-sender">{{message.sender}}<span v-if="message.subkind"> [{{message.subkind}}]</span></div>
-      <div class="content">{{content}}</div>
+      <div class="content">{{logContent}}</div>
+      <a v-if="logLong" class="log-toggle" @click.prevent="$emit('toggle-log')">{{logExpanded ? '(collapse)' : '(expand)'}}</a>
     </template>
 
     <template v-if="message.type == 'thread-header'">
@@ -169,6 +191,12 @@ watch(() => [props.message.format, props.message.content], ([newFormat, newConte
   font-weight: bold;
   font-size: 80%;
 }
+.message.log .log-toggle {
+  font-family: monospace;
+  font-size: 80%;
+  cursor: pointer;
+  user-select: none;
+}
 
 .resource {
   align-self: center;
@@ -246,4 +274,4 @@ watch(() => [props.message.format, props.message.content], ([newFormat, newConte
 .thread-header:hover {
   border-style: solid;
 }
-</style>
+</style>

frontend/src/views/Chat.vue

@@ -35,6 +35,7 @@
   const editingMessageId = ref(null);
   const noteMode = ref(false);
   const messageRunMap = ref({});
+  const expandedLogs = ref({}); // Message ids of logs currently expanded
 
   const editInfo = computed(() => {
     const parts = [isNewThread.value ? 'New Thread' : `Thread ${currentThreadId.value}`]
@@ -468,13 +469,25 @@
 
   // === UI Helper Functions === //
 
-  async function chatEntryContextMenu (message) {
+  function toggleLogExpand (message) {
-    let selected = await ui.contextMenu([
+    expandedLogs.value[message.id] = !expandedLogs.value[message.id];
+  }
+
+  async function chatEntryContextMenu (message, logMeta) {
+    let entries = [
       {value: 'pin', title: "Pin message"},
       {value: 'edit', title: "Edit message"},
       {value: 'start-thread', title: "Start thread from here"},
-      {value: 'delete', icon: 'fa-trash', title: "Delete message"},
+    ];
-    ]);
+
+    // Long logs can be expanded/collapsed
+    if (logMeta) {
+      entries.push({value: 'toggle-log', title: logMeta.expanded ? "Collapse log" : "Expand log"});
+    }
+
+    entries.push({value: 'delete', icon: 'fa-trash', title: "Delete message"});
+
+    let selected = await ui.contextMenu(entries);
 
     switch (selected) {
       case 'pin': {
@@ -489,6 +502,10 @@
         alert("Start Thread (TODO)");
         break;
       }
+      case 'toggle-log': {
+        toggleLogExpand(message);
+        break;
+      }
       case 'delete': {
         if (confirm("Are you sure you want to delete this message?")) {
           alert("Delete Message (TODO)");
@@ -548,6 +565,9 @@
         @open-menu="chatEntryContextMenu"
         @open-thread="activateThread"
 
+        :log-expanded="expandedLogs[msg.id]"
+        @toggle-log="toggleLogExpand(msg)"
+
         :cancellable="messageRunMap[msg.id]"
         @cancel="runs.cancelRun(messageRunMap[msg.id])"
       />
@@ -640,4 +660,4 @@
     /* align-self: end; /* for flex rows */
     float: right; /* for flow rows */
   }
-</style>
+</style>

run.sh

@@ -56,6 +56,10 @@ case "$1" in
     tortoise -c database.TORTOISE_ORM makemigrations
     ;;
 
+  "deploy")
+    bash deploy/run.sh $@
+    ;;
+
   # Execute with custom home directory if it exists
   *)
     if [ -d "$1" ]; then
@@ -65,4 +69,4 @@ case "$1" in
       echo "Error: unknown command or directory '$1'"
     fi
     ;;
-esac
+esac