Fix Connect button: don't navigate to /api/oauth/start when unconfigured (showed raw 503 JSON); show inline setup steps instead

b6aac04ac2027ddc421af4d264ce652fa81eb1c9 · 2026-06-24 14:45:00 -0700 · Steve

Files touched

M public/index.html

Diff

commit b6aac04ac2027ddc421af4d264ce652fa81eb1c9
Author: Steve <steve@designerwallcoverings.com>
Date:   Wed Jun 24 14:45:00 2026 -0700

    Fix Connect button: don't navigate to /api/oauth/start when unconfigured (showed raw 503 JSON); show inline setup steps instead
---
 public/index.html | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/public/index.html b/public/index.html
index 3e2a305..2d800f5 100644
--- a/public/index.html
+++ b/public/index.html
@@ -286,11 +286,25 @@ async function refreshStatus(){
     pill.className='conn-pill off';
     txt.textContent='Not connected';
     b.className='banner';
+    const cfg=!!GSTATUS.oauth_configured;
     b.innerHTML='<b>Calendar not connected — Steve must authorize.</b> '+
-      (GSTATUS.oauth_configured
-        ? 'OAuth is configured — click to grant access. '
-        : 'The Google OAuth credential has not been added yet (queued in pending-approval). ')+
-      '<a href="/api/oauth/start"><button class="btn-primary">Connect</button></a>';
+      (cfg ? 'OAuth is configured — click to grant access. '
+           : 'The Google OAuth credential has not been added yet (queued in pending-approval). ')+
+      '<button class="btn-primary" id="gconnect">'+(cfg?'Connect':'How to connect')+'</button>';
+    document.getElementById('gconnect').onclick=()=>{
+      // Only navigate to the OAuth start route when there's a credential to use —
+      // otherwise that route returns a raw 503 JSON page (looks like a crash).
+      if(cfg){ window.location.href='/api/oauth/start'; return; }
+      document.getElementById('gbanner').innerHTML=
+        '<b>Connect the Google Calendar — one-time (Steve):</b>'+
+        '<ol style="margin:8px 0 0;padding-left:20px;line-height:1.7">'+
+        '<li>Google Cloud Console → enable Calendar API → create an OAuth <b>Web application</b> client; '+
+          'add redirect URI <code>http://127.0.0.1:9765/api/oauth/callback</code>.</li>'+
+        '<li>Paste the Client ID + Secret to Claude (secrets routes are pre-wired), '+
+          'or run <code>node ~/Projects/secrets-manager/cli.js add GOOGLE_OAUTH_CLIENT_ID &lt;id&gt;</code> (and the secret).</li>'+
+        '<li>Restart the app, reload this page, then click <b>Connect</b> to grant consent.</li>'+
+        '</ol>';
+    };
   }
 }
 // Fallback content for the Google tab when OAuth isn't connected: the SKU

← a3d864f Google Calendar tab: fall back to SKU activation rollout whe · back to Dw Activation Calendar · SKU Activation: assign a durable go-live DATE+TIME to every e07fd55 →