my-analytics/
├── src/
│   ├── app/
│   │   ├── layout.tsx              # Root-Layout mit ShellAuthProvider
│   │   ├── page.tsx                # Haupt-Dashboard-Seite
│   │   ├── globals.css             # Tailwind-Styles
│   │   ├── settings/
│   │   │   └── page.tsx            # Einstellungsseite
│   │   └── api/
│   │       └── health/
│   │           └── route.ts        # Health-Endpoint (erforderlich)
│   ├── hooks/
│   │   ├── useNats.ts              # Echtzeit-Ereignis-Hook
│   │   └── useModuleApi.ts         # Mandantenbezogene DB-Abfragen
│   └── lib/
│       ├── shell-auth.tsx          # Auth-Provider (postMessage)
│       ├── shell-navigation.ts     # Shell-Navigations-Hilfsfunktionen
│       └── nats-events.ts          # NATS-Ereignistypen und Subjects
├── package.json
├── next.config.ts                  # CSP-Header fuer iframe
├── tailwind.config.ts              # Tailwind mit dunklem Theme
├── tsconfig.json
├── .env.example
└── .env.local                      # Deine Zugangsdaten (in gitignore)

'use client';
 
import { useShellAuth } from '@/lib/shell-auth';
 
export default function ReportsPage() {
  const { user, organizationId, isAuthenticated } = useShellAuth();
 
  if (!isAuthenticated) {
    return <p className="p-6 text-gray-400">Wird geladen...</p>;
  }
 
  return (
    <div className="p-6">
      <h1 className="text-2xl font-bold text-white">Berichte</h1>
      <p className="text-gray-400 mt-2">
        Analysen fuer Organisation: {organizationId}
      </p>
    </div>
  );
}