Add in-page login config modal

Allow setting Auth0 domain/clientId and allowed emails via a modal saved to localStorage to enable login testing without redeploying.

Co-authored-by: Cursor <cursoragent@cursor.com>

script.js

@@ -4,6 +4,7 @@
   const STORAGE_KEY = "links_home_v1";
   const THEME_KEY = "links_home_theme_v1";
   const AUTH_TOAST_ONCE_KEY = "links_home_auth_toast_once_v1";
+  const AUTH_OVERRIDE_KEY = "links_home_auth_override_v1";
 
   const el = {
     subtitle: document.getElementById("subtitle"),
@@ -21,6 +22,13 @@
     userText: document.getElementById("userText"),
     btnLogin: document.getElementById("btnLogin"),
     btnLogout: document.getElementById("btnLogout"),
+    authModal: document.getElementById("authModal"),
+    btnAuthClose: document.getElementById("btnAuthClose"),
+    authForm: document.getElementById("authForm"),
+    authDomain: document.getElementById("authDomain"),
+    authClientId: document.getElementById("authClientId"),
+    authAllowedEmails: document.getElementById("authAllowedEmails"),
+    btnAuthReset: document.getElementById("btnAuthReset"),
     modal: document.getElementById("modal"),
     btnClose: document.getElementById("btnClose"),
     btnCancel: document.getElementById("btnCancel"),
@@ -339,10 +347,12 @@
     toast(msg);
   }
 
-  function getAuthConfig() {
-    const cfg = globalThis.AUTH_CONFIG && typeof globalThis.AUTH_CONFIG === "object" ? globalThis.AUTH_CONFIG : {};
-    const auth0 = cfg.auth0 && typeof cfg.auth0 === "object" ? cfg.auth0 : {};
-    const allowedEmails = Array.isArray(cfg.allowedEmails) ? cfg.allowedEmails : [];
+  function loadAuthOverride() {
+    const raw = localStorage.getItem(AUTH_OVERRIDE_KEY);
+    const data = raw ? safeJsonParse(raw, null) : null;
+    if (!data || typeof data !== "object") return null;
+    const auth0 = data.auth0 && typeof data.auth0 === "object" ? data.auth0 : {};
+    const allowedEmails = Array.isArray(data.allowedEmails) ? data.allowedEmails : [];
     return {
       auth0: {
         domain: String(auth0.domain || "").trim(),
@@ -352,6 +362,37 @@
     };
   }
 
+  function saveAuthOverride(cfg) {
+    localStorage.setItem(AUTH_OVERRIDE_KEY, JSON.stringify(cfg));
+  }
+
+  function clearAuthOverride() {
+    localStorage.removeItem(AUTH_OVERRIDE_KEY);
+  }
+
+  function getAuthConfig() {
+    const cfg = globalThis.AUTH_CONFIG && typeof globalThis.AUTH_CONFIG === "object" ? globalThis.AUTH_CONFIG : {};
+    const auth0 = cfg.auth0 && typeof cfg.auth0 === "object" ? cfg.auth0 : {};
+    const allowedEmails = Array.isArray(cfg.allowedEmails) ? cfg.allowedEmails : [];
+    const base = {
+      auth0: {
+        domain: String(auth0.domain || "").trim(),
+        clientId: String(auth0.clientId || "").trim(),
+      },
+      allowedEmails: allowedEmails.map((e) => String(e).trim().toLowerCase()).filter(Boolean),
+    };
+    const override = loadAuthOverride();
+    if (!override) return base;
+    // override가 있으면 우선 적용 (서버 재배포 없이 테스트 가능)
+    return {
+      auth0: {
+        domain: override.auth0.domain || base.auth0.domain,
+        clientId: override.auth0.clientId || base.auth0.clientId,
+      },
+      allowedEmails: override.allowedEmails.length ? override.allowedEmails : base.allowedEmails,
+    };
+  }
+
   function currentUrlNoQuery() {
     // Auth0 callback 후 URL 정리용
     const u = new URL(location.href);
@@ -491,7 +532,7 @@
 
   async function login() {
     if (auth.mode !== "enabled" || !auth.client) {
-      toast("로그인 설정이 필요합니다. index.html의 AUTH_CONFIG(auth0.domain/clientId, allowedEmails)를 확인하세요.");
+      openAuthModal();
       return;
     }
     await auth.client.loginWithRedirect();
@@ -510,6 +551,28 @@
     });
   }
 
+  function openAuthModal() {
+    if (!el.authModal || !el.authForm) {
+      toast("로그인 설정 UI를 찾지 못했습니다. 새로고침 후 다시 시도하세요.");
+      return;
+    }
+
+    const cfg = getAuthConfig();
+    el.authDomain.value = cfg.auth0.domain || "";
+    el.authClientId.value = cfg.auth0.clientId || "";
+    el.authAllowedEmails.value = (cfg.allowedEmails || []).join(", ");
+
+    el.authModal.hidden = false;
+    document.body.style.overflow = "hidden";
+    setTimeout(() => el.authDomain.focus(), 0);
+  }
+
+  function closeAuthModal() {
+    if (!el.authModal) return;
+    el.authModal.hidden = true;
+    document.body.style.overflow = "";
+  }
+
   async function copyText(text) {
     try {
       await navigator.clipboard.writeText(text);
@@ -820,6 +883,52 @@
 
     if (el.btnLogin) el.btnLogin.addEventListener("click", () => login().catch(() => toast("로그인에 실패했습니다.")));
     if (el.btnLogout) el.btnLogout.addEventListener("click", () => logout().catch(() => toast("로그아웃에 실패했습니다.")));
+
+    if (el.btnAuthClose) el.btnAuthClose.addEventListener("click", closeAuthModal);
+    if (el.authModal) {
+      el.authModal.addEventListener("click", (e) => {
+        const close = e.target && e.target.getAttribute && e.target.getAttribute("data-auth-close");
+        if (close) closeAuthModal();
+      });
+    }
+    document.addEventListener("keydown", (e) => {
+      if (e.key === "Escape" && el.authModal && !el.authModal.hidden) closeAuthModal();
+    });
+
+    if (el.btnAuthReset) {
+      el.btnAuthReset.addEventListener("click", () => {
+        clearAuthOverride();
+        toast("로그인 설정을 초기화했습니다.");
+        closeAuthModal();
+        // 초기화 후 재로딩(상태 정리)
+        setTimeout(() => location.reload(), 200);
+      });
+    }
+
+    if (el.authForm) {
+      el.authForm.addEventListener("submit", (e) => {
+        e.preventDefault();
+        const domain = String(el.authDomain.value || "").trim();
+        const clientId = String(el.authClientId.value || "").trim();
+        const emails = String(el.authAllowedEmails.value || "")
+          .split(",")
+          .map((s) => s.trim().toLowerCase())
+          .filter(Boolean);
+
+        if (!domain || !clientId) {
+          toast("Domain과 Client ID를 입력하세요.");
+          return;
+        }
+
+        saveAuthOverride({
+          auth0: { domain, clientId },
+          allowedEmails: emails,
+        });
+        toast("저장했습니다. 페이지를 새로고침합니다.");
+        closeAuthModal();
+        setTimeout(() => location.reload(), 200);
+      });
+    }
   }
 
   async function main() {