From 37f204c18c40a6096547abfc3073bf8765e3c8ee Mon Sep 17 00:00:00 2001
From: Adam Moussa <166072409+amoussa1229@users.noreply.github.com>
Date: Fri, 3 Apr 2026 14:29:36 -0400
Subject: [PATCH] Fix Google Sign-In client_id error and null reference on
 login

- Load GSI script dynamically after config.js sets GOOGLE_CLIENT_ID
  so data-client_id is populated before the library auto-initializes
- Fall back to config.js client ID when /auth/config returns empty
- Guard against null fallback-btn element in initGoogleSignIn

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 README.md  |  4 +++-
 login.html | 24 ++++++++++++++++++------
 2 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index 50cfdde..be860b8 100644
--- a/README.md
+++ b/README.md
@@ -31,7 +31,9 @@ ledgerflow_frontend/
 ## Features
 
 ### Purchase Orders
-- Import POs from external DynamoDB table (Coupa purchase-orders)
+- POs auto-sync from external DynamoDB table via DynamoDB Streams (near-real-time)
+- Paginated table (20 per page) with page navigation controls
+- Search/filter across all POs (resets to page 1)
 - Add POs manually
 - Edit POs after import (vendor, amount, status, dates, notes)
 - Bill against POs to create invoices
diff --git a/login.html b/login.html
index 126711e..749b556 100644
--- a/login.html
+++ b/login.html
@@ -6,8 +6,19 @@
 <title>LedgerFlow — Sign In</title>
 <!-- Config (API URL + Client ID) -->
 <script src="config.js"></script>
-<!-- Google Identity Services -->
-<script src="https://accounts.google.com/gsi/client" async defer onload="onGisLoaded()"></script>
+<!-- Google Identity Services — loaded dynamically after config.js sets GOOGLE_CLIENT_ID -->
+<script>
+  // Load GSI only after client ID is available, preventing "Missing required parameter" errors
+  (function() {
+    var s = document.createElement('script');
+    s.src = 'https://accounts.google.com/gsi/client';
+    s.async = true;
+    s.defer = true;
+    if (window.GOOGLE_CLIENT_ID) s.setAttribute('data-client_id', window.GOOGLE_CLIENT_ID);
+    s.onload = function() { if (typeof onGisLoaded === 'function') onGisLoaded(); };
+    document.head.appendChild(s);
+  })();
+</script>
 <style>
   :root {
     --bg: #0a0c0f;
@@ -205,17 +216,17 @@ let _pendingClientId = null;
 
 window.addEventListener("load", async () => {
   // Fetch Google Client ID from backend config endpoint
+  let clientId = GOOGLE_CLIENT_ID;
   try {
     if (API_URL) {
       const res = await fetch(`${API_URL}/auth/config`);
       const cfg = await res.json();
-      if (cfg.googleClientId) initGoogleSignIn(cfg.googleClientId);
-    } else if (GOOGLE_CLIENT_ID) {
-      initGoogleSignIn(GOOGLE_CLIENT_ID);
+      if (cfg.googleClientId) clientId = cfg.googleClientId;
     }
   } catch (e) {
     console.warn("Could not load auth config:", e);
   }
+  if (clientId) initGoogleSignIn(clientId);
 });
 
 function initGoogleSignIn(clientId) {
@@ -245,7 +256,8 @@ function initGoogleSignIn(clientId) {
   );
 
   // Hide the fallback button
-  document.getElementById("fallback-btn").style.display = "none";
+  const fb = document.getElementById("fallback-btn");
+  if (fb) fb.style.display = "none";
 
   // Show One Tap prompt
   google.accounts.id.prompt();