From 5ffd91a643217f5c2799a826d9167f66c053ee8d Mon Sep 17 00:00:00 2001
From: dlawler489 <104159223@student.swin.edu.au>
Date: Wed, 9 Sep 2026 11:32:07 +1000
Subject: [PATCH] Hide OAuth reconnect instructions once already connected

Settings always showed the full "how to connect" steps and code-paste
form for oauth2 mode regardless of connection status, which read as
broken even when the token was live and polling successfully. Collapse
it behind a "Reconnect" toggle once connected.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 app/web/templates/settings.html | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/app/web/templates/settings.html b/app/web/templates/settings.html
index 287ea59..fe531cd 100644
--- a/app/web/templates/settings.html
+++ b/app/web/templates/settings.html
@@ -27,6 +27,7 @@
     </p>
   {% elif isolarcloud_auth_mode == "oauth2" %}
     <p id="isolarcloud-status" class="muted">Checking connection status&hellip;</p>
+    <button type="button" id="oauth-reconnect-toggle" style="display:none;">Reconnect / use a different account</button>
     <div id="oauth-connect-block">
       <p class="muted">
         1. Open the authorization link below in your own browser, log in with your iSolarCloud account, and approve access.<br>
@@ -254,6 +255,18 @@ async function checkIsolarcloudStatus() {
   el.textContent = status.connected
     ? 'Connected -- a valid token is cached.'
     : 'Not connected yet.';
+
+  // Only oauth2 mode has the connect-block/reconnect-toggle pair.
+  const connectBlock = document.getElementById('oauth-connect-block');
+  const reconnectToggle = document.getElementById('oauth-reconnect-toggle');
+  if (!connectBlock || !reconnectToggle) return;
+  if (status.connected) {
+    connectBlock.style.display = 'none';
+    reconnectToggle.style.display = 'inline-block';
+  } else {
+    connectBlock.style.display = 'block';
+    reconnectToggle.style.display = 'none';
+  }
 }
 
 function renderPlantPicker(plants) {
@@ -305,6 +318,9 @@ if (oauthAuthorizeLink) {
   fetch('/api/isolarcloud/oauth/authorize-url').then(r => r.json()).then(data => {
     oauthAuthorizeLink.href = data.url;
   });
+  document.getElementById('oauth-reconnect-toggle').addEventListener('click', () => {
+    document.getElementById('oauth-connect-block').style.display = 'block';
+  });
   document.getElementById('oauth-connect-btn').addEventListener('click', async () => {
     const flash = document.getElementById('isolarcloud-flash');
     let code = document.getElementById('oauth-code-input').value.trim();