feat: add dynamic vector sync status updates with htmx polling
Implement real-time vector sync status updates in the /app UI without requiring page refreshes. The status (indexed documents, pending documents, sync state) now updates automatically every 3 seconds. Changes: - Add vector_sync_status_fragment() endpoint that returns HTML fragment with current vector sync status - Modify user_info_html() to use htmx loading for vector sync section with hx-trigger="load" on initial render - Status fragment includes hx-trigger="every 3s" for continuous polling - Add /app/vector-sync/status route to browser_routes The implementation uses htmx (already loaded on page) to poll the status endpoint, providing near real-time updates with minimal overhead. The endpoint queries Qdrant for indexed count and reads from memory streams for pending count, returning only the status HTML fragment. Pattern follows existing webhook management UI which also uses htmx for dynamic loading. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -1410,6 +1410,7 @@ def get_app(transport: str = "sse", enabled_apps: list[str] | None = None):
|
||||
from nextcloud_mcp_server.auth.userinfo_routes import (
|
||||
revoke_session,
|
||||
user_info_html,
|
||||
vector_sync_status_fragment,
|
||||
)
|
||||
from nextcloud_mcp_server.auth.webhook_routes import (
|
||||
disable_webhook_preset,
|
||||
@@ -1424,6 +1425,12 @@ def get_app(transport: str = "sse", enabled_apps: list[str] | None = None):
|
||||
Route(
|
||||
"/revoke", revoke_session, methods=["POST"], name="revoke_session_endpoint"
|
||||
), # /app/revoke → revoke_session
|
||||
# Vector sync status fragment (htmx polling)
|
||||
Route(
|
||||
"/vector-sync/status",
|
||||
vector_sync_status_fragment,
|
||||
methods=["GET"],
|
||||
), # /app/vector-sync/status
|
||||
# Webhook management routes (admin-only)
|
||||
Route("/webhooks", webhook_management_pane, methods=["GET"]), # /app/webhooks
|
||||
Route(
|
||||
|
||||
@@ -139,6 +139,72 @@ async def _get_processing_status(request: Request) -> dict[str, Any] | None:
|
||||
return None
|
||||
|
||||
|
||||
@requires("authenticated", redirect="oauth_login")
|
||||
async def vector_sync_status_fragment(request: Request) -> HTMLResponse:
|
||||
"""Vector sync status fragment endpoint - returns HTML fragment with current status.
|
||||
|
||||
This endpoint is polled by htmx to provide real-time updates of vector sync processing
|
||||
status without requiring a full page refresh.
|
||||
|
||||
Requires authentication via session cookie (redirects to oauth_login route if not authenticated).
|
||||
|
||||
Args:
|
||||
request: Starlette request object
|
||||
|
||||
Returns:
|
||||
HTML response with vector sync status table fragment
|
||||
"""
|
||||
processing_status = await _get_processing_status(request)
|
||||
|
||||
# If vector sync is disabled or unavailable, return empty fragment
|
||||
if not processing_status:
|
||||
return HTMLResponse(
|
||||
"""
|
||||
<div id="vector-sync-status" hx-get="/app/vector-sync/status" hx-trigger="every 3s" hx-swap="outerHTML">
|
||||
<p style="color: #999;">Vector sync not available</p>
|
||||
</div>
|
||||
"""
|
||||
)
|
||||
|
||||
indexed_count = processing_status["indexed_count"]
|
||||
pending_count = processing_status["pending_count"]
|
||||
status = processing_status["status"]
|
||||
|
||||
# Format numbers with commas for readability
|
||||
indexed_count_str = f"{indexed_count:,}"
|
||||
pending_count_str = f"{pending_count:,}"
|
||||
|
||||
# Status badge color and text
|
||||
if status == "syncing":
|
||||
status_badge = (
|
||||
'<span style="color: #ff9800; font-weight: bold;">⟳ Syncing</span>'
|
||||
)
|
||||
else:
|
||||
status_badge = '<span style="color: #4caf50; font-weight: bold;">✓ Idle</span>'
|
||||
|
||||
html = f"""
|
||||
<div id="vector-sync-status" hx-get="/app/vector-sync/status" hx-trigger="every 3s" hx-swap="outerHTML">
|
||||
<h2>Vector Sync Status</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<td><strong>Indexed Documents</strong></td>
|
||||
<td>{indexed_count_str}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Pending Documents</strong></td>
|
||||
<td>{pending_count_str}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Status</strong></td>
|
||||
<td>{status_badge}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
"""
|
||||
|
||||
return HTMLResponse(html)
|
||||
|
||||
|
||||
async def _get_userinfo_endpoint(oauth_ctx: dict[str, Any]) -> str | None:
|
||||
"""Get the correct userinfo endpoint based on OAuth mode.
|
||||
|
||||
@@ -507,43 +573,14 @@ async def user_info_html(request: Request) -> HTMLResponse:
|
||||
</div>
|
||||
"""
|
||||
|
||||
# Build vector sync status HTML
|
||||
# Build vector sync status HTML (with htmx auto-refresh)
|
||||
vector_status_html = ""
|
||||
if processing_status:
|
||||
indexed_count = processing_status["indexed_count"]
|
||||
pending_count = processing_status["pending_count"]
|
||||
status = processing_status["status"]
|
||||
|
||||
# Format numbers with commas for readability
|
||||
indexed_count_str = f"{indexed_count:,}"
|
||||
pending_count_str = f"{pending_count:,}"
|
||||
|
||||
# Status badge color and text
|
||||
if status == "syncing":
|
||||
status_badge = (
|
||||
'<span style="color: #ff9800; font-weight: bold;">⟳ Syncing</span>'
|
||||
)
|
||||
else:
|
||||
status_badge = (
|
||||
'<span style="color: #4caf50; font-weight: bold;">✓ Idle</span>'
|
||||
)
|
||||
|
||||
vector_status_html = f"""
|
||||
<h2>Vector Sync Status</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<td><strong>Indexed Documents</strong></td>
|
||||
<td>{indexed_count_str}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Pending Documents</strong></td>
|
||||
<td>{pending_count_str}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Status</strong></td>
|
||||
<td>{status_badge}</td>
|
||||
</tr>
|
||||
</table>
|
||||
# Use htmx to load and auto-refresh the status fragment
|
||||
vector_status_html = """
|
||||
<div hx-get="/app/vector-sync/status" hx-trigger="load" hx-swap="outerHTML">
|
||||
<p style="color: #999;">Loading vector sync status...</p>
|
||||
</div>
|
||||
"""
|
||||
|
||||
# Build IdP profile HTML
|
||||
|
||||
Reference in New Issue
Block a user