feat(ui): ErrorDetailModal — click error → flat-text modal with copy button (replaces unusable :title tooltip for multi-line SQLAlchemy tracebacks) — Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

frontend/src/components/settings/ImportTaskList.vue

@@ -45,9 +45,11 @@
       <template #item.size_bytes="{ item }">{{ formatBytes(item.size_bytes) }}</template>
       <template #item.created_at="{ item }">{{ formatDate(item.created_at) }}</template>
       <template #item.error="{ item }">
-        <span v-if="item.error" :title="item.error" class="text-caption">
-          {{ shorten(item.error, 60) }}
-        </span>
+        <button
+          v-if="item.error" type="button" class="fc-err-link text-caption"
+          @click="openError(`Task ${item.id} failed`, item.error)"
+          title="Click for full error"
+        >{{ shorten(item.error, 60) }}</button>
       </template>
     </v-data-table-virtual>
     <div v-if="store.hasMore" class="d-flex justify-center py-3">
@@ -100,16 +102,35 @@
         </v-card-actions>
       </v-card>
     </v-dialog>
+
+    <ErrorDetailModal
+      v-model="showErrorModal"
+      :title="errorModalTitle"
+      :message="errorModalMessage"
+    />
   </v-card>
 </template>
 
 <script setup>
 import { computed, ref } from 'vue'
 import { useImportStore } from '../../stores/import.js'
+import ErrorDetailModal from '../common/ErrorDetailModal.vue'
 
 const store = useImportStore()
 const statusFilter = ref(null)
 const clearDialog = ref(false)
+// Click-to-open modal for full error text (operator-flagged 2026-05-26
+// — the prior :title="..." tooltip cramped multi-line SQLAlchemy
+// tracebacks into an unusable popup with no copy-paste affordance).
+const showErrorModal = ref(false)
+const errorModalTitle = ref('')
+const errorModalMessage = ref('')
+
+function openError(title, message) {
+  errorModalTitle.value = title
+  errorModalMessage.value = message || ''
+  showErrorModal.value = true
+}
 const clearAgeDays = ref(7)
 const clearStuckDialog = ref(false)
 
@@ -179,3 +200,21 @@ async function onClearStuckConfirm() {
   clearStuckDialog.value = false
 }
 </script>
+
+<style scoped>
+.fc-err-link {
+  /* Truncated error preview as a clickable button — opens
+     ErrorDetailModal with the full text. Inherits the row's font
+     sizing so it doesn't visually drift from the prior tooltip-bearing
+     span. */
+  color: rgb(var(--v-theme-error, 220 80 80));
+  background: transparent;
+  border: 0;
+  padding: 0;
+  font: inherit;
+  text-align: left;
+  text-decoration: underline dotted;
+  cursor: pointer;
+}
+.fc-err-link:hover { text-decoration: underline; }
+</style>