fix: strip Sidebar wrapper from RouteDetail + fix StatusDot prop in LayoutSection

- RouteDetail.tsx was missed in page stripping pass — remove AppShell
  + Sidebar wrapper, replace with fragment
- LayoutSection.tsx used StatusDot status= instead of variant=

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-04-02 18:13:03 +02:00
parent 18bf644040
commit eeb2713612
2 changed files with 7 additions and 19 deletions

View File

@@ -31,7 +31,7 @@ const SAMPLE_APP_NODES: SidebarTreeNode[] = [
{
id: 'app1',
label: 'cameleer-prod',
icon: <StatusDot status="live" />,
icon: <StatusDot variant="live" />,
badge: '14.3k',
path: '/apps/app1',
starrable: true,
@@ -44,7 +44,7 @@ const SAMPLE_APP_NODES: SidebarTreeNode[] = [
{
id: 'app2',
label: 'cameleer-staging',
icon: <StatusDot status="stale" />,
icon: <StatusDot variant="stale" />,
badge: '871',
path: '/apps/app2',
starrable: true,
@@ -56,7 +56,7 @@ const SAMPLE_APP_NODES: SidebarTreeNode[] = [
{
id: 'app3',
label: 'cameleer-dev',
icon: <StatusDot status="dead" />,
icon: <StatusDot variant="dead" />,
badge: '42',
path: '/apps/app3',
starrable: true,

View File

@@ -4,8 +4,6 @@ import { AlertTriangle } from 'lucide-react'
import styles from './RouteDetail.module.css'
// Layout
import { AppShell } from '../../design-system/layout/AppShell/AppShell'
import { Sidebar } from '../../design-system/layout/Sidebar/Sidebar'
import { TopBar } from '../../design-system/layout/TopBar/TopBar'
// Composites
@@ -22,7 +20,6 @@ import { InfoCallout } from '../../design-system/primitives/InfoCallout/InfoCall
// Mock data
import { routes } from '../../mocks/routes'
import { exchanges, type Exchange } from '../../mocks/exchanges'
import { SIDEBAR_APPS } from '../../mocks/sidebar'
// ─── Helpers ──────────────────────────────────────────────────────────────────
function formatDuration(ms: number): string {
@@ -199,11 +196,7 @@ export function RouteDetail() {
// Not found state
if (!route) {
return (
<AppShell
sidebar={
<Sidebar apps={SIDEBAR_APPS} />
}
>
<>
<TopBar
breadcrumb={[
{ label: 'Applications', href: '/apps' },
@@ -211,24 +204,19 @@ export function RouteDetail() {
{ label: id ?? 'Unknown' },
]}
environment="PRODUCTION"
user={{ name: 'hendrik' }}
/>
<div className={styles.content}>
<InfoCallout variant="warning">Route "{id}" not found in mock data.</InfoCallout>
</div>
</AppShell>
</>
)
}
const statusVariant = routeStatusVariant(route.status)
return (
<AppShell
sidebar={
<Sidebar apps={SIDEBAR_APPS} />
}
>
<>
{/* Top bar */}
<TopBar
breadcrumb={[
@@ -375,6 +363,6 @@ export function RouteDetail() {
)}
</div>
</AppShell>
</>
)
}