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';

export function createDashboardRoutes(): RouteObject[] {
  return [
    {
      path: '/',
      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: '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." /> },
      ],
    },
  ];
}

export const dashboardRouter = createBrowserRouter(createDashboardRoutes());