feat(admin): colapsar/expandir submissions + eliminar columna Tipo

app/admin/responses/responses-table.tsx

@@ -0,0 +1,98 @@
+'use client'
+
+import { useState } from 'react'
+
+export interface DisplayRow {
+  key: string
+  submissionNum: number
+  isFirstInGroup: boolean
+  date: string
+  code: string
+  prompt: string
+  rendered: string | null
+  zone: string
+  sector: string
+}
+
+export function ResponsesTable({ rows }: { rows: DisplayRow[] }) {
+  const [expanded, setExpanded] = useState<Set<number>>(new Set())
+
+  function toggle(submissionNum: number) {
+    setExpanded((prev) => {
+      const next = new Set(prev)
+      if (next.has(submissionNum)) next.delete(submissionNum)
+      else next.add(submissionNum)
+      return next
+    })
+  }
+
+  return (
+    <table className="admin-table">
+      <thead>
+        <tr>
+          <th>#</th>
+          <th>Fecha</th>
+          <th>Código</th>
+          <th>Pregunta</th>
+          <th>Valor</th>
+          <th className="admin-col-optional">Departamento</th>
+          <th className="admin-col-optional">Sector</th>
+        </tr>
+      </thead>
+      <tbody>
+        {rows
+          .filter((row) => row.isFirstInGroup || expanded.has(row.submissionNum))
+          .map((row) => {
+            const groupClass =
+              row.submissionNum % 2 === 0 ? 'admin-group-even' : 'admin-group-odd'
+            const isExpanded = expanded.has(row.submissionNum)
+            const trClass = row.isFirstInGroup
+              ? `${groupClass} admin-group-start admin-row-toggle`
+              : groupClass
+
+            return (
+              <tr
+                key={row.key}
+                className={trClass}
+                onClick={row.isFirstInGroup ? () => toggle(row.submissionNum) : undefined}
+                onKeyDown={
+                  row.isFirstInGroup
+                    ? (e) => {
+                        if (e.key === 'Enter' || e.key === ' ') {
+                          e.preventDefault()
+                          toggle(row.submissionNum)
+                        }
+                      }
+                    : undefined
+                }
+                role={row.isFirstInGroup ? 'button' : undefined}
+                tabIndex={row.isFirstInGroup ? 0 : undefined}
+                aria-expanded={row.isFirstInGroup ? isExpanded : undefined}
+              >
+                <td>
+                  {row.isFirstInGroup && (
+                    <span className="admin-toggle-icon" aria-hidden="true">
+                      {isExpanded ? '▼' : '▶'}
+                    </span>
+                  )}
+                  {row.submissionNum}
+                </td>
+                <td>{row.date}</td>
+                <td>{row.code}</td>
+                <td className="admin-prompt">{row.prompt}</td>
+                <td>
+                  {row.rendered === null ? (
+                    <span className="admin-nodata">sin dato</span>
+                  ) : (
+                    row.rendered
+                  )}
+                </td>
+                <td className="admin-col-optional">{row.zone}</td>
+                <td className="admin-col-optional">{row.sector}</td>
+              </tr>
+            )
+          })}
+      </tbody>
+    </table>
+  )
+}