Split embedded and standalone chart surfaces

web/templates/view.html

@@ -15,19 +15,6 @@
   </header>
 
   <main class="page-main">
-    <section class="input-panel">
-      <form method="post" action="/render">
-        <label for="snapshot" class="input-label">Snapshot JSON</label>
-        <textarea id="snapshot" name="snapshot" spellcheck="false" placeholder='{"target_host":"...","hardware":{...}}'>{{ .InputJSON }}</textarea>
-        <div class="input-actions">
-          <button type="submit">Render Snapshot</button>
-        </div>
-      </form>
-      {{ if .Error }}
-      <div class="error-box">{{ .Error }}</div>
-      {{ end }}
-    </section>
-
     {{ if .HasSnapshot }}
     <section class="meta-panel">
       <h2>Snapshot Metadata</h2>
@@ -49,8 +36,9 @@
       {{ end }}
     </nav>
 
+    <div class="sections-grid">
     {{ range .Sections }}
-    <section class="section-card" id="{{ .ID }}">
+    <section class="section-card {{ if or (eq .ID "board") (eq .ID "firmware") }}section-card-half{{ else }}section-card-full{{ end }}" id="{{ .ID }}">
       <h2>{{ .Title }}</h2>
 
       {{ if eq .Kind "object" }}
@@ -103,8 +91,59 @@
         </table>
       </div>
       {{ end }}
+
+      {{ if eq .Kind "grouped_tables" }}
+      {{ range .Groups }}
+      <div class="table-group">
+        <h3>{{ .Title }}</h3>
+        {{ $group := . }}
+        <div class="table-wrap">
+          <table class="data-table">
+            <thead>
+              <tr>
+                {{ range .Columns }}
+                <th>{{ . }}</th>
+                {{ end }}
+              </tr>
+            </thead>
+            <tbody>
+              {{ range .Items }}
+              <tr>
+                {{ $row := . }}
+                {{ range $group.Columns }}
+                <td>
+                  {{ $value := index $row.Cells . }}
+                  {{ if eq . "status" }}
+                  <span class="status-badge {{ statusClass $value }}">{{ $value }}</span>
+                  {{ else }}
+                    {{ range joinLines $value }}
+                    <div>{{ . }}</div>
+                    {{ end }}
+                  {{ end }}
+                </td>
+                {{ end }}
+              </tr>
+              {{ end }}
+            </tbody>
+          </table>
+        </div>
+      </div>
+      {{ end }}
+      {{ end }}
     </section>
     {{ end }}
+    </div>
+    {{ end }}
+
+    {{ if .Error }}
+    <section class="error-box">{{ .Error }}</section>
+    {{ end }}
+
+    {{ if not .HasSnapshot }}
+    <section class="empty-panel">
+      <h2>Snapshot Viewer</h2>
+      <p>This page renders one Reanimator snapshot provided by the embedding application.</p>
+    </section>
     {{ end }}
   </main>
 </body>