Link HTML5 object selection to flowchart

services/api-server/src/api_server/html5.py

@@ -247,15 +247,26 @@ def render_html5_editor(
     return _page(f"SFERA HTML5 - {project_id}", content)
 
 
-def render_html5_flowchart(project_id: str, flowchart: object | None) -> str:
+def render_html5_flowchart(
+    project_id: str,
+    flowchart: object | None,
+    *,
+    focus: str | None = None,
+    oob: bool = False,
+) -> str:
+    hx_url = f"/html5/projects/{quote(project_id)}/flowchart"
+    if focus:
+        hx_url = f"{hx_url}?focus={quote(focus, safe='')}"
+    oob_attr = ' hx-swap-oob="outerHTML"' if oob else ""
     if flowchart is None:
         return f"""
         <div
           class="flowchart-panel"
           data-html5-flowchart
-          hx-get="/html5/projects/{quote(project_id)}/flowchart"
+          hx-get="{hx_url}"
           hx-trigger="load"
           hx-swap="outerHTML"
+          {oob_attr}
         >
           <div class="panel-title">Карта связей</div>
           <p class="muted padded">Сервер собирает граф проекта.</p>
@@ -273,9 +284,10 @@ def render_html5_flowchart(project_id: str, flowchart: object | None) -> str:
     <div
       class="flowchart-panel"
       data-html5-flowchart
-      hx-get="/html5/projects/{quote(project_id)}/flowchart"
+      hx-get="{hx_url}"
       hx-trigger="every 30s"
       hx-swap="outerHTML"
+      {oob_attr}
     >
       <div class="panel-title">Карта связей · {escape(mode)}</div>
       <dl class="report-grid">

services/api-server/src/api_server/main.py

@@ -1751,7 +1751,7 @@ async def html5_project_flowchart(
 ) -> Response:
     flowchart = await project_flowchart(project_id, focus=focus, depth=depth, limit=limit)
     return Response(
-        render_html5_flowchart(project_id, flowchart),
+        render_html5_flowchart(project_id, flowchart, focus=focus),
         media_type="text/html; charset=utf-8",
     )
 
@@ -1767,19 +1767,21 @@ async def html5_project_object_context(project_id: str, object_name: str) -> Res
     flowchart = await project_flowchart(project_id, focus=object_name, depth=1, limit=40)
     runtime = _runtime_for_object_context(project_id, impact)
     knowledge = _knowledge_for_object_context(schema, impact, ui)
+    object_context = render_html5_object_context(
+        project_id,
+        schema,
+        impact,
+        access,
+        ui,
+        runtime,
+        knowledge,
+        privacy,
+        integrations,
+        flowchart,
+    )
+    flowchart_context = render_html5_flowchart(project_id, flowchart, focus=object_name, oob=True)
     return Response(
-        render_html5_object_context(
-            project_id,
-            schema,
-            impact,
-            access,
-            ui,
-            runtime,
-            knowledge,
-            privacy,
-            integrations,
-            flowchart,
-        ),
+        object_context + flowchart_context,
         media_type="text/html; charset=utf-8",
     )