feat: add spinner and loading message to session wait page

Wait page was a blank dark screen - users saw nothing and hit refresh. Now shows spinner + service name + status message from /status endpoint.
2026-07-23 10:43:57 +00:00
parent 5e884a39ad
commit b89f239d02
1 changed files with 14 additions and 1 deletions
@@ -1582,9 +1582,21 @@ def session_wait_page(session_id: str, request: Request, user: User = Depends(re
 <head>
  <meta charset='utf-8'>
  <title>{service_title}</title>
-  <style>html,body{{margin:0;height:100%;background:#0f1720}}</style>
+  <style>
+    html,body{{margin:0;height:100%;background:#0f1720;font-family:sans-serif}}
+    .wrap{{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}}
+    .spinner{{width:48px;height:48px;border:4px solid rgba(220,232,245,.12);border-top-color:#2a8cd6;border-radius:50%;animation:spin .85s linear infinite}}
+    @keyframes spin{{to{{transform:rotate(360deg)}}}}
+    .title{{color:#dce8f5;font-size:1.05rem;font-weight:600;letter-spacing:.01em}}
+    .sub{{color:#6a8dab;font-size:.85rem}}
+  </style>
 </head>
 <body>
+  <div class="wrap">
+    <div class="spinner"></div>
+    <div class="title">Подготовка приложения…</div>
+    <div class="sub" id="sub">{service_title}</div>
+  </div>
  <script>
    const sessionId = "{session_id}";
    async function tick() {{
@@ -1592,6 +1604,7 @@ def session_wait_page(session_id: str, request: Request, user: User = Depends(re
        const r = await fetch(`/api/sessions/${{sessionId}}/status`, {{credentials:'include'}});
        if (!r.ok) return;
        const data = await r.json();
+        if (data.message) document.getElementById('sub').textContent = data.message;
        if (data.ready) {{ window.location.replace(data.redirect_url || "{redirect_target}"); return; }}
      }} catch(e) {{}}
      setTimeout(tick, 300);