pi-mega-compact 0.20.60 → 0.20.61

package/extensions/dashboard-client/src/App.tsx

@@ -4,39 +4,53 @@
  * SPRINT-B1: React scaffold with tab routing, header, error boundary.
  * SPRINT-C1+: tabs wired progressively with real content.
  * SPRINT-V2: NEW_UI flag splits OldDashboard (legacy) from NewDashboard (AppShell).
+ * DASH-0d: the `TabContent` lazy list + switch consolidate onto the 7 fixed
+ * navigational surfaces (Overview, Sessions, Cache+Performance, Memory Graph,
+ * Diagnostics, Setup, Admin) behind MEGACOMPACT_DASH_0D. An additive hash router
+ * maps every legacy #deep-link to a live consolidated surface. Flag-OFF
+ * reproduces the pre-rollup 13-tab surface list byte-identically (the
+ * DASH-0D-LEGACY region). The consolidated rendering is the DASH-0D-CONSOLIDATED
+ * region — both are parsed by scripts/dash-tab-count.mjs.
  */
 
-import React, { useState, useCallback } from "react";
+import React, { useState, useEffect, useCallback } from "react";
 import { ErrorBoundary } from "./components/ErrorBoundary";
 import { TabBar } from "./components/TabBar";
 import { LoadingSpinner } from "./components/LoadingSpinner";
 import { useApi } from "./hooks/useApi";
-import { fetchSnapshot } from "./api/client";
-import type { SnapshotResponse } from "@contracts";
+import { fetchSnapshot, fetchSettings } from "./api/client";
+import type { SnapshotResponse, SettingsResponse } from "@contracts";
 import { NEW_UI } from "./config";
 import { AppShell } from "./components/layout/AppShell";
 import {
   PRIMARY_TABS,
   ADVANCED_TABS,
   ADVANCED_TAB_IDS as advancedTabIds,
+  DASH_SURFACE_IDS,
+  DASH_SURFACE_LABELS,
   type TabId,
+  type DashTabId,
 } from "./tabs/registry";
+import { useHashTab } from "./tabs/dashHashRouter";
 export type { TabId };
 
-// Tab components — lazy-loaded. C1 fills Overview + Events; C2/C3 fill the rest.
+// Tab components — lazy-loaded. DASH-0d: the consolidated 7 host components come
+// from the merged barrel homes; the 13 legacy-only components stay for flag-off.
 const OverviewTab = React.lazy(() => import("./tabs/OverviewTab"));
+const SessionsTab = React.lazy(() => import("./tabs/SessionsTab"));
+const CacheTab = React.lazy(() => import("./tabs/CacheTab"));
+const MemoryMapTab = React.lazy(() => import("./tabs/MemoryMapTab"));
+const VectorCortexTab = React.lazy(() => import("./tabs/VectorCortexTab"));
+const SetupTab = React.lazy(() => import("./tabs/SetupTab"));
+const AdminTab = React.lazy(() => import("./tabs/AdminTab"));
+// Legacy-only host components (flag-off pre-rollup surface set).
 const ReposTab = React.lazy(() => import("./tabs/ReposTab"));
 const EventsTab = React.lazy(() => import("./tabs/EventsTab"));
-const SetupTab = React.lazy(() => import("./tabs/SetupTab"));
 const MetricsTab = React.lazy(() => import("./tabs/MetricsTab"));
-const CacheTab = React.lazy(() => import("./tabs/CacheTab"));
-const SessionsTab = React.lazy(() => import("./tabs/SessionsTab"));
 const WikiTab = React.lazy(() => import("./tabs/WikiTab"));
 const TurnsTab = React.lazy(() => import("./tabs/TurnsTab"));
 const MaintenanceTab = React.lazy(() => import("./tabs/MaintenanceTab"));
-const MemoryMapTab = React.lazy(() => import("./tabs/MemoryMapTab"));
 const HealthTab = React.lazy(() => import("./tabs/HealthTab"));
-const VectorCortexTab = React.lazy(() => import("./tabs/VectorCortexTab"));
 
 interface AppState {
   snapshot: SnapshotResponse | null;
@@ -44,7 +58,52 @@ interface AppState {
   error: Error | null;
 }
 
-function TabContent({
+const DASH_0D_KEY = "MEGACOMPACT_DASH_0D";
+
+/**
+ * Resolve the DASH-0d consolidation flag from the server-authoritative
+ * `/api/rag-settings` state (the dashboard client has no `process` global).
+ * Absent/not-yet-loaded => true (default ON), matching the server default.
+ */
+function dash0dEnabled(settings: SettingsResponse | null): boolean {
+  if (!settings) return true;
+  for (const cat of settings.categories) {
+    for (const s of cat.settings) {
+      if (s.key === DASH_0D_KEY && s.type === "boolean") return s.value === true;
+    }
+  }
+  return true;
+}
+
+/** The unified active-tab state: a legacy 13-tab TabId OR a consolidated surface. */
+type ActiveTab = TabId | DashTabId;
+
+/** Consolidated 7-surface content (DASH-0d). Parsed by scripts/dash-tab-count.mjs. */
+function ConsolidatedContent({
+  activeTab,
+  snapshot,
+  loading,
+  error,
+}: AppState & { activeTab: DashTabId }): React.ReactElement {
+  return (
+    <React.Suspense fallback={<LoadingSpinner />}>
+      {/* DASH-0D-CONSOLIDATED */}
+      {activeTab === "overview" && (
+        <OverviewTab snapshot={snapshot} loading={loading} error={error} />
+      )}
+      {activeTab === "sessions" && <SessionsTab />}
+      {activeTab === "cache-perf" && <CacheTab />}
+      {activeTab === "memory-graph" && <MemoryMapTab />}
+      {activeTab === "diagnostics" && <VectorCortexTab />}
+      {activeTab === "setup" && <SetupTab />}
+      {activeTab === "admin" && <AdminTab />}
+      {/* DASH-0D-CONSOLIDATED-END */}
+    </React.Suspense>
+  );
+}
+
+/** Pre-rollup 13-tab content (flag-off). Parsed by scripts/dash-tab-count.mjs. */
+function LegacyContent({
   activeTab,
   snapshot,
   loading,
@@ -52,6 +111,7 @@ function TabContent({
 }: AppState & { activeTab: TabId }): React.ReactElement {
   return (
     <React.Suspense fallback={<LoadingSpinner />}>
+      {/* DASH-0D-LEGACY */}
       {activeTab === "overview" && (
         <OverviewTab snapshot={snapshot} loading={loading} error={error} />
       )}
@@ -67,6 +127,7 @@ function TabContent({
       {activeTab === "memory-map" && <MemoryMapTab />}
       {activeTab === "health" && <HealthTab />}
       {activeTab === "vector-cortex" && <VectorCortexTab />}
+      {/* DASH-0D-LEGACY-END */}
     </React.Suspense>
   );
 }
@@ -102,7 +163,7 @@ function OldDashboard({
           onTabChange={setActiveTab}
         />
         <main className="dashboard-content">
-          <TabContent activeTab={activeTab} snapshot={snapshot} loading={loading} error={error} />
+          <LegacyContent activeTab={activeTab} snapshot={snapshot} loading={loading} error={error} />
         </main>
       </div>
     </ErrorBoundary>
@@ -122,14 +183,40 @@ function NewDashboard({
   return (
     <ErrorBoundary>
       <AppShell active={activeTab} onTabChange={setActiveTab} snapshot={snapshot}>
-        <TabContent activeTab={activeTab} snapshot={snapshot} loading={loading} error={error} />
+        <LegacyContent activeTab={activeTab} snapshot={snapshot} loading={loading} error={error} />
       </AppShell>
     </ErrorBoundary>
   );
 }
 
+/** DASH-0d consolidated 7-surface navigation rail (flag-ON New UI path). */
+function ConsolidatedNav({
+  active,
+  onSelect,
+}: {
+  active: DashTabId;
+  onSelect: (id: DashTabId) => void;
+}): React.ReactElement {
+  return (
+    <nav className="consolidated-nav" role="tablist" aria-label="Dashboard surfaces">
+      {DASH_SURFACE_IDS.map((id) => (
+        <button
+          key={id}
+          type="button"
+          role="tab"
+          aria-selected={active === id}
+          className={active === id ? "active" : ""}
+          onClick={() => onSelect(id)}
+        >
+          {DASH_SURFACE_LABELS[id] ?? id}
+        </button>
+      ))}
+    </nav>
+  );
+}
+
 export default function App(): React.ReactElement {
-  const [activeTab, setActiveTab] = useState<TabId>("overview");
+  const [activeTab, setActiveTab] = useState<ActiveTab>("overview");
   const {
     data: snapshot,
     loading,
@@ -142,11 +229,57 @@ export default function App(): React.ReactElement {
     },
   );
 
+  // Server-resolved DASH-0d flag (default ON when settings absent).
+  const { data: settingsData } = useApi<SettingsResponse>(
+    useCallback(() => fetchSettings(), []),
+    { pollInterval: 0, maxRetries: 0 },
+  );
+  const dash0dOn = dash0dEnabled(settingsData);
+
+  // Additive hash→surface deep-link router: every legacy #hash maps to a live
+  // consolidated surface; empty hash keeps current behavior (default overview).
+  // Only active under the DASH-0d 7-surface rendering — flag-off keeps the
+  // pre-rollup 13-tab behavior unchanged (hash ignored).
+  const hashSurface = useHashTab();
+  useEffect(() => {
+    if (dash0dOn && hashSurface != null) setActiveTab(hashSurface);
+  }, [dash0dOn, hashSurface]);
+
+  // Flag-ON consolidated New-UI surface: a 7-surface rail + the consolidated
+  // content. Flag-OFF (or legacy NEW_UI false) renders the 13-tab path as today.
+  if (NEW_UI() && dash0dOn) {
+    const current = DASH_SURFACE_IDS.includes(activeTab as DashTabId)
+      ? (activeTab as DashTabId)
+      : "overview";
+    return (
+      <ErrorBoundary>
+        <div className="dashboard-app">
+          <header className="dashboard-header">
+            <h1>mega-compact dashboard <span className="tier">{snapshot?.tier ?? "unknown"}</span></h1>
+          </header>
+          <ConsolidatedNav active={current} onSelect={(id: DashTabId) => setActiveTab(id)} />
+          <main className="dashboard-content">
+            <ConsolidatedContent
+              activeTab={current}
+              snapshot={snapshot}
+              loading={loading}
+              error={error}
+            />
+          </main>
+        </div>
+      </ErrorBoundary>
+    );
+  }
+
+  // Flag-off (or legacy NEW_UI): always a legacy TabId (hash routing is gated
+  // on dash0dOn above, so activeTab stays a 13-tab id here).
+  const legacyTab = (activeTab as TabId) ?? "overview";
+
   if (NEW_UI()) {
     return (
       <NewDashboard
-        activeTab={activeTab}
-        setActiveTab={setActiveTab}
+        activeTab={legacyTab}
+        setActiveTab={(id: TabId) => setActiveTab(id)}
         snapshot={snapshot}
         loading={loading}
         error={error}
@@ -156,8 +289,8 @@ export default function App(): React.ReactElement {
 
   return (
     <OldDashboard
-      activeTab={activeTab}
-      setActiveTab={setActiveTab}
+      activeTab={legacyTab}
+      setActiveTab={(id: TabId) => setActiveTab(id)}
       snapshot={snapshot}
       loading={loading}
       error={error}

package/extensions/dashboard-client/src/tabs/TurnsTab.tsx

@@ -1,374 +1,17 @@
 /**
- * dashboard-client/src/tabs/TurnsTab.tsx — Turn-by-turn memory tracking + recall (S52).
+ * dashboard-client/src/tabs/TurnsTab.tsx — Turn-by-turn memory surface (S52).
  *
- * Fetches /api/turns (conversation list), expands the active conversation into
- * per-turn detail (/api/turns/conversation/:id), and renders:
- *   - Conversation summary list (turn count, recall total, epochs, last turn).
- *   - Per-turn rows: turn index, role, ctx tokens/percent + pressure band,
- *     epoch id, and the injected-checkpoint recall set (the memory recalled
- *     at each turn, with score + source).
- *   - Pending rewind intents (S52A) + Fork action (S50C primitive).
- *
- * Read-mostly via /api/turns; fork/intent/prune via POST. No absolute URLs
- * (PREVENT-PI-004: loopback-only, same-origin static bundle).
+ * DASH-0d consolidation: the sessions surface owns the turns body as a drill-
+ * down (`SessionsTab/TurnMemoryView.tsx`, re-homed VERBATIM in DASH-0b). This
+ * standalone top-level file is reduced to a thin shell re-exporting
+ * `TurnMemoryView`, so the flag-off pre-rollup 13-tab surface set still
+ * resolves `TurnsTab` (deep-link + lazy-import anchor) with no duplicated
+ * render body. The canonical home is `SessionsTab/TurnMemoryView.tsx`.
  */
 
 import type React from "react";
-import { useCallback, useState } from "react";
-import { useApi } from "../hooks/useApi";
-import {
-	fetchTurns,
-	fetchConversationTurns,
-	fetchTurnIntents,
-	postFork,
-	postTurnIntent,
-} from "../api/client";
-import type {
-	TurnsResponse,
-	ConversationTurnsResponse,
-	RewindIntentsResponse,
-	TurnRow,
-	ConversationSummary,
-} from "@contracts";
-import { Card, CardContent, CardHeader, CardTitle } from "../components/ui/card";
-import { Badge } from "../components/ui/badge";
-import { Button } from "../components/ui/button";
-import { HydeDetailPanel } from "../components/HydeDetailPanel";
-
-function fmtTs(ms: number): string {
-	if (!ms) return "—";
-	return new Date(ms).toLocaleString();
-}
-
-function bandVariant(band: TurnRow["pressureBand"]): "success" | "warning" | "danger" | "default" {
-	if (band === "green") return "success";
-	if (band === "yellow") return "warning";
-	if (band === "red") return "danger";
-	return "default";
-}
-
-function sourceLabel(s: TurnRow["recall"][number]["source"]): string {
-	if (s === "checkpoint") return "ckpt";
-	if (s === "cluster_summary") return "raptor";
-	return "mem";
-}
+import { TurnMemoryView } from "./SessionsTab/TurnMemoryView";
 
 export default function TurnsTab(): React.ReactElement {
-	const {
-		data: turns,
-		loading,
-		error,
-	} = useApi<TurnsResponse>(
-		useCallback(() => fetchTurns(), []),
-		{
-			pollInterval: 10_000,
-		},
-	);
-	const { data: intents } = useApi<RewindIntentsResponse>(
-		useCallback(() => fetchTurnIntents(), []),
-		{ pollInterval: 5_000 },
-	);
-	const [expanded, setExpanded] = useState<string | null>(null);
-	const [detail, setDetail] = useState<ConversationTurnsResponse | null>(null);
-	const [detailLoading, setDetailLoading] = useState(false);
-	const [busy, setBusy] = useState<string | null>(null);
-	const [notice, setNotice] = useState<string | null>(null);
-
-	const expand = useCallback(
-		async (conversationId: string) => {
-			if (expanded === conversationId) {
-				setExpanded(null);
-				setDetail(null);
-				return;
-			}
-			setExpanded(conversationId);
-			setDetailLoading(true);
-			setDetail(null);
-			try {
-				const d = await fetchConversationTurns(conversationId);
-				setDetail(d);
-			} finally {
-				setDetailLoading(false);
-			}
-		},
-		[expanded],
-	);
-
-	const onFork = useCallback(
-		async (conversationId: string, turnIndex: number) => {
-			setBusy(`fork:${conversationId}:${turnIndex}`);
-			setNotice(null);
-			try {
-				const out = await postFork(conversationId, turnIndex);
-				setNotice(
-					`Forked → ${out.childConversationId} (${out.recalledCount} recalled)`,
-				);
-			} catch (e) {
-				setNotice(`Fork failed: ${(e as Error).message}`);
-			} finally {
-				setBusy(null);
-			}
-		},
-		[],
-	);
-
-	const onRewind = useCallback(
-		async (conversationId: string, turnIndex: number) => {
-			setBusy(`rewind:${conversationId}:${turnIndex}`);
-			setNotice(null);
-			try {
-				await postTurnIntent(conversationId, turnIndex);
-				setNotice(`Rewind intent queued for turn ${turnIndex}`);
-			} catch (e) {
-				setNotice(`Rewind failed: ${(e as Error).message}`);
-			} finally {
-				setBusy(null);
-			}
-		},
-		[],
-	);
-
-	if (error && !turns) {
-		return <div className="tab-stub">Error loading turns: {error.message}</div>;
-	}
-	if (loading && !turns) {
-		return <div className="tab-stub">Loading turns…</div>;
-	}
-	if (!turns || turns.conversations.length === 0) {
-		return (
-			<div className="tab-stub">
-				<h3>Turn-by-turn memory</h3>
-				<p>
-					No turns recorded yet. Per-turn tracking starts when{" "}
-					<code>MEGACOMPACT_TURNS_DB=1</code> and the session runs through a
-					compaction. Each turn records its context metrics + the checkpoints
-					recalled into it.
-				</p>
-			</div>
-		);
-	}
-
-	return (
-		<div className="flex flex-col gap-4">
-			<h3 className="font-heading text-lg font-semibold">
-				Turn-by-turn memory tracking + recall
-			</h3>
-			{notice && <Badge variant="warning">{notice}</Badge>}
-
-			{intents && intents.intents.length > 0 && (
-				<Card>
-					<CardHeader>
-						<CardTitle>
-							Pending rewind intents ({intents.intents.length})
-						</CardTitle>
-					</CardHeader>
-					<CardContent>
-						<ul className="list-disc space-y-1 pl-5">
-							{intents.intents.map((i) => (
-								<li key={i.id}>
-									{fmtTs(i.createdAt)} — rewind{" "}
-									<code>{i.conversationId}</code> to turn {i.targetTurnIndex}
-								</li>
-							))}
-						</ul>
-					</CardContent>
-				</Card>
-			)}
-
-			<Card>
-				<CardHeader>
-					<CardTitle>
-						Conversations ({turns.conversations.length})
-					</CardTitle>
-				</CardHeader>
-				<CardContent>
-					<table className="w-full border-collapse text-sm">
-						<thead>
-							<tr>
-								<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Conversation</th>
-								<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Turns</th>
-								<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Recall</th>
-								<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Epochs</th>
-								<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Avg ctx%</th>
-								<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Last turn</th>
-								<th className="border-b border-border px-3 py-2"></th>
-							</tr>
-						</thead>
-						<tbody>
-							{turns.conversations.map((c: ConversationSummary) => (
-								<ConversationRow
-									key={c.conversationId}
-									c={c}
-									active={turns.activeConversationId === c.conversationId}
-									expanded={expanded === c.conversationId}
-									onExpand={() => expand(c.conversationId)}
-								/>
-							))}
-						</tbody>
-					</table>
-				</CardContent>
-			</Card>
-
-			{expanded && (
-				<Card>
-					<CardHeader>
-						<CardTitle>
-							Turns in <code>{expanded}</code>
-						</CardTitle>
-					</CardHeader>
-					<CardContent>
-						{detailLoading ? (
-							<div className="text-sm text-muted-foreground">Loading turns…</div>
-						) : detail ? (
-							<TurnDetail
-								detail={detail}
-								busy={busy}
-								onFork={onFork}
-								onRewind={onRewind}
-							/>
-						) : (
-							<div className="text-sm text-muted-foreground">No detail.</div>
-						)}
-					</CardContent>
-				</Card>
-			)}
-		</div>
-	);
-}
-
-function ConversationRow({
-	c,
-	active,
-	expanded,
-	onExpand,
-}: {
-	c: ConversationSummary;
-	active: boolean;
-	expanded: boolean;
-	onExpand: () => void;
-}): React.ReactElement {
-	return (
-		<>
-			<tr
-				className={`border-b border-border/50 hover:bg-bg-elevated/40 ${
-					active ? "bg-primary/10" : ""
-				}`}
-				onClick={onExpand}
-				style={{ cursor: "pointer" }}
-			>
-				<td className="px-3 py-2">
-					{expanded ? "▾" : "▸"} <code>{c.conversationId}</code>
-					{active && <Badge variant="accent" className="ml-2">active</Badge>}
-				</td>
-				<td className="px-3 py-2 text-right">{c.turnCount}</td>
-				<td className="px-3 py-2 text-right">{c.totalRecall}</td>
-				<td className="px-3 py-2 text-right">{c.epochCount}</td>
-				<td className="px-3 py-2 text-right">{c.avgCtxPercent.toFixed(0)}%</td>
-				<td className="px-3 py-2">{fmtTs(c.lastTurnAt)}</td>
-				<td className="px-3 py-2" />
-			</tr>
-		</>
-	);
-}
-
-function TurnDetail({
-	detail,
-	busy,
-	onFork,
-	onRewind,
-}: {
-	detail: ConversationTurnsResponse;
-	busy: string | null;
-	onFork: (conversationId: string, turnIndex: number) => void;
-	onRewind: (conversationId: string, turnIndex: number) => void;
-}): React.ReactElement {
-	return (
-		<table className="w-full border-collapse text-sm">
-			<thead>
-				<tr>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">#</th>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Role</th>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Ctx</th>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Band</th>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Epoch</th>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Recalled checkpoints (memory recall)</th>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">HyDE</th>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Ended</th>
-					<th className="border-b border-border px-3 py-2 text-left font-medium text-muted-foreground">Actions</th>
-				</tr>
-			</thead>
-			<tbody>
-				{detail.turns.map((t) => (
-					<tr
-						key={`${t.conversationId}:${t.turnIndex}`}
-						className="border-b border-border/50 hover:bg-bg-elevated/40"
-					>
-						<td className="px-3 py-2 text-right">{t.turnIndex}</td>
-						<td className="px-3 py-2">{t.role}</td>
-						<td className="px-3 py-2">
-							{t.ctxTokens ?? "—"}
-							{t.ctxPercent != null && (
-								<span className="text-muted-foreground">
-									{" "}
-									· {t.ctxPercent.toFixed(0)}%
-								</span>
-							)}
-						</td>
-						<td className="px-3 py-2">
-							<Badge variant={bandVariant(t.pressureBand)}>
-								{t.pressureBand ?? "—"}
-							</Badge>
-						</td>
-						<td className="px-3 py-2">{t.epochId ? <code>{t.epochId.slice(0, 8)}</code> : "—"}</td>
-						<td className="px-3 py-2">
-							{t.recall.length === 0 ? (
-								<span className="text-muted-foreground">—</span>
-							) : (
-								<ul className="space-y-1">
-									{t.recall.map((r) => (
-										<li key={r.checkpointId}>
-											<code>{r.checkpointId.slice(0, 12)}</code>{" "}
-											<span className="text-muted-foreground">
-												{sourceLabel(r.source)} · {r.score.toFixed(2)}
-												{r.raptorLevel != null ? ` · L${r.raptorLevel}` : ""}
-											</span>
-										</li>
-									))}
-								</ul>
-							)}
-						</td>
-						<td className="px-3 py-2 align-top">
-							<HydeDetailPanel
-								conversationId={t.conversationId}
-								turnIndex={t.turnIndex}
-							/>
-						</td>
-						<td className="px-3 py-2">{fmtTs(t.endedAt)}</td>
-						<td className="px-3 py-2">
-							<div className="flex gap-2">
-								<Button
-									type="button"
-									variant="outline"
-									size="sm"
-									disabled={busy !== null}
-									onClick={() => onFork(t.conversationId, t.turnIndex)}
-								>
-									fork
-								</Button>
-								<Button
-									type="button"
-									variant="outline"
-									size="sm"
-									disabled={busy !== null}
-									onClick={() => onRewind(t.conversationId, t.turnIndex)}
-								>
-									rewind
-								</Button>
-							</div>
-						</td>
-					</tr>
-				))}
-			</tbody>
-		</table>
-	);
+	return <TurnMemoryView />;
 }