From 20fa83f245a70224c166307d32f1fc99d5c73833 Mon Sep 17 00:00:00 2001
From: Jamie Brunton <jamie@jbrunton.co.uk>
Date: Sat, 8 Aug 2026 15:06:19 +0100
Subject: [PATCH] feat(dashboard): route conversations and media

---
 apps/dashboard/src/app/router.tsx             |  7 ++++--
 .../conversations/conversation-route.tsx      | 22 +++++++++++++++++++
 2 files changed, 27 insertions(+), 2 deletions(-)
 create mode 100644 apps/dashboard/src/features/conversations/conversation-route.tsx

diff --git a/apps/dashboard/src/app/router.tsx b/apps/dashboard/src/app/router.tsx
index ea0e8ac..83e1335 100644
--- a/apps/dashboard/src/app/router.tsx
+++ b/apps/dashboard/src/app/router.tsx
@@ -2,6 +2,8 @@ import { createBrowserRouter, type RouteObject } from 'react-router-dom';
 import { AppShell } from './app-shell.js';
 import { OverviewPage } from '../features/overview/overview-page.js';
 import { PlaceholderPage } from '../features/placeholder-page.js';
+import { ConversationRoute } from '../features/conversations/conversation-route.js';
+import { MediaPage } from '../features/media/media-page.js';
 
 export function createDashboardRoutes(): RouteObject[] {
   return [
@@ -10,8 +12,9 @@ export function createDashboardRoutes(): RouteObject[] {
       element: <AppShell />,
       children: [
         { index: true, element: <OverviewPage /> },
-        { path: 'conversations', element: <PlaceholderPage title="Conversations" description="Review conversations, drafts, and replies." /> },
-        { path: 'media', element: <PlaceholderPage title="Media" description="Browse private media and monitor syncs." /> },
+        { path: 'conversations', element: <ConversationRoute /> },
+        { path: 'conversations/:conversationId', element: <ConversationRoute /> },
+        { path: 'media', element: <MediaPage /> },
         { path: 'performance', element: <PlaceholderPage title="Performance" description="Understand response and strategy performance." /> },
         { path: 'operations', element: <PlaceholderPage title="Operations" description="Inspect jobs, events, logs, and diagnostics." /> },
         { path: 'settings', element: <PlaceholderPage title="Settings" description="Manage runtime behavior and Reddit access." /> },
diff --git a/apps/dashboard/src/features/conversations/conversation-route.tsx b/apps/dashboard/src/features/conversations/conversation-route.tsx
new file mode 100644
index 0000000..7d14e08
--- /dev/null
+++ b/apps/dashboard/src/features/conversations/conversation-route.tsx
@@ -0,0 +1,22 @@
+import { useNavigate, useParams } from 'react-router-dom';
+import { ConversationsPage } from './conversations-page.js';
+
+export function ConversationRoute() {
+  const navigate = useNavigate();
+  const { conversationId } = useParams<{ conversationId: string }>();
+
+  function selectConversation(nextConversationId: string | null) {
+    void navigate(
+      nextConversationId
+        ? `/conversations/${encodeURIComponent(nextConversationId)}`
+        : '/conversations',
+    );
+  }
+
+  return (
+    <ConversationsPage
+      selectedConversationId={conversationId ?? null}
+      onSelectedConversationChange={selectConversation}
+    />
+  );
+}