From 2681d7d5ba8eacdd5ac4394eb57faf9e742d8478 Mon Sep 17 00:00:00 2001
From: Paul Huliganga <paje0101@gmail.com>
Date: Tue, 21 Apr 2026 23:18:16 -0400
Subject: [PATCH] Show template load errors

---
 web/static/js/state.js     |  1 +
 web/static/js/templates.js | 14 +++++++++++++-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/web/static/js/state.js b/web/static/js/state.js
index 3a8f917..09e6435 100644
--- a/web/static/js/state.js
+++ b/web/static/js/state.js
@@ -15,6 +15,7 @@ export const state = {
     docusignAccountSelectionRequired: false,
   },
   templates: [],          // [{ adobe_id, name, status, blockers, warnings, ... }]
+  templatesError: null,   // Visible error state for template loading failures
   selectedIds: new Set(),
   lastMigrationResults: null,   // final batch job results
   issueCount: 0,          // blocked template count (drives nav badge)
diff --git a/web/static/js/templates.js b/web/static/js/templates.js
index 20f0201..61966c0 100644
--- a/web/static/js/templates.js
+++ b/web/static/js/templates.js
@@ -30,15 +30,20 @@ function readiness(t) {
 export async function refreshTemplates() {
   if (!state.auth.adobe || !state.auth.docusign) {
     setState('templates', []);
+    setState('templatesError', null);
     updateDerivedState();
     return;
   }
   try {
     const data = await api.templates.status();
     setState('templates', data.templates || []);
+    setState('templatesError', null);
     updateDerivedState();
   } catch (e) {
     console.warn('refreshTemplates failed:', e.message);
+    setState('templates', []);
+    setState('templatesError', e.data?.error || e.message || 'Failed to load templates.');
+    updateDerivedState();
   }
 }
 
@@ -84,6 +89,13 @@ function _render() {
       </div>
     ` : ''}
 
+    ${state.templatesError ? `
+      <div class="callout error">
+        <span class="callout-icon">❌</span>
+        Template loading failed: ${escHtml(state.templatesError)}
+      </div>
+    ` : ''}
+
     <!-- Filter bar -->
     <div class="filter-bar">
       <input type="search" class="search-input" id="template-search"
@@ -131,7 +143,7 @@ function _render() {
                   <div class="empty-state">
                     <div class="empty-state-icon">📄</div>
                     <div class="empty-state-title">${state.templates.length ? 'No templates match your filter' : 'No templates found'}</div>
-                    <div class="empty-state-sub">${state.templates.length ? 'Try clearing the search or filter.' : 'Connect Adobe Sign to load templates.'}</div>
+                    <div class="empty-state-sub">${state.templates.length ? 'Try clearing the search or filter.' : (state.templatesError ? 'The template load failed. Check the error message above.' : 'Connect Adobe Sign to load templates.')}</div>
                   </div>
                 </td></tr>`
             }