feat(dashboard): add customer accordion view and extension flow

shop/app/my-customers/page.tsx

@@ -1,41 +1,27 @@
 export const dynamic = 'force-dynamic';
 import { redirect } from 'next/navigation'
 import Link from 'next/link'
-import { getEndCustomers } from '@/lib/actions/end-customers'
-import type { EndCustomer } from '@/lib/types'
-import { ArrowLeft, Building2, Plus, Edit2, AlertTriangle } from 'lucide-react'
+import { getPartnerCustomersWithOrders } from '@/lib/actions/queries'
+import type { EndCustomerWithOrders } from '@/lib/types'
+import { ArrowLeft, Building2, Plus, AlertTriangle } from 'lucide-react'
 import { Button } from '@/components/ui/button'
-import { Card, CardContent } from '@/components/ui/card'
-import { Badge } from '@/components/ui/badge';
-import { createClient } from '@/lib/supabase/server';
+import { createClient } from '@/lib/supabase/server'
+import { CustomerAccordionList } from '@/components/customer-accordion-list'
 
 export default async function MyCustomersPage() {
   const supabase = await createClient()
   const { data: { user } } = await supabase.auth.getUser()
   if (!user) redirect('/auth/login')
 
-  let customers: EndCustomer[] = []
+  let customers: EndCustomerWithOrders[] = []
   let fetchError: string | null = null
   try {
-    customers = await getEndCustomers()
+    customers = await getPartnerCustomersWithOrders()
   } catch (err: any) {
-    console.error("Error loading end customers:", err)
-    fetchError = err.message || "Es gab ein Problem beim Laden Ihrer Endkunden."
+    console.error("Error loading partner customers with orders:", err)
+    fetchError = err.message || "Es gab ein Problem beim Laden Ihrer Kunden und Kassen."
   }
 
-  // Anzahl Bestellungen pro Endkunde
-  const { data: orderCounts, error: orderError } = await supabase.from('orders').select('end_customer_id').not('end_customer_id', 'is', null);
-  if (orderError) {
-    console.error("Error loading order counts:", orderError)
-  }
-
-  const countMap: Record<string, number> = {}
-  ;(orderCounts ?? []).forEach(o => {
-    if (o.end_customer_id) {
-      countMap[o.end_customer_id] = (countMap[o.end_customer_id] ?? 0) + 1
-    }
-  })
-
   return (
     <div className="min-h-screen bg-[#020617] text-white px-4 py-12">
       <div className="max-w-5xl mx-auto space-y-8">
@@ -50,10 +36,10 @@ export default async function MyCustomersPage() {
             <div>
               <h1 className="text-3xl font-extrabold tracking-tight flex items-center gap-3">
                 <Building2 className="w-8 h-8 text-primary" />
-                Meine Kunden
+                Kunden & Kassen
               </h1>
               <p className="text-slate-400 text-sm mt-1">
-                Verwalten Sie Ihre Endkunden – deren Daten werden für Bestellungen verwendet.
+                Verwalten Sie Ihre Kunden und deren zugewiesene Kassen / Abonnements.
               </p>
             </div>
           </div>
@@ -70,86 +56,8 @@ export default async function MyCustomersPage() {
           </div>
         )}
 
-        {/* Keine Kunden */}
-        {customers.length === 0 && (
-          <Card className="glass-dark border-white/10">
-            <CardContent className="flex flex-col items-center justify-center py-16 gap-4">
-              <Building2 className="w-12 h-12 text-slate-600" />
-              <p className="text-slate-400 text-lg">Noch keine Endkunden angelegt.</p>
-              <Link href="/my-customers/new">
-                <Button><Plus className="w-4 h-4 mr-2" /> Ersten Kunden anlegen</Button>
-              </Link>
-            </CardContent>
-          </Card>
-        )}
-
-        {/* Kundenliste */}
-        {customers.length > 0 && (
-          <div className="overflow-x-auto">
-            <table className="w-full">
-              <thead>
-                <tr className="border-b border-white/10 text-left">
-                  <th className="pb-3 text-xs font-semibold text-slate-400 uppercase tracking-wider">Unternehmen</th>
-                  <th className="pb-3 text-xs font-semibold text-slate-400 uppercase tracking-wider hidden sm:table-cell">Adresse</th>
-                  <th className="pb-3 text-xs font-semibold text-slate-400 uppercase tracking-wider hidden md:table-cell">Bestellungen</th>
-                  <th className="pb-3 text-xs font-semibold text-slate-400 uppercase tracking-wider">Status</th>
-                  <th className="pb-3 text-xs font-semibold text-slate-400 uppercase tracking-wider text-right">Aktionen</th>
-                </tr>
-              </thead>
-              <tbody className="divide-y divide-white/5">
-                {customers.map(customer => (
-                  <tr key={customer.id} className="hover:bg-white/3 transition-colors">
-                    <td className="py-4 pr-4">
-                      <p className="font-semibold text-white">{customer.company_name}</p>
-                      {(customer.first_name || customer.last_name) && (
-                        <p className="text-sm text-slate-400">
-                          {[customer.first_name, customer.last_name].filter(Boolean).join(' ')}
-                        </p>
-                      )}
-                      {customer.vat_id && (
-                        <p className="text-xs text-slate-500">{customer.vat_id}</p>
-                      )}
-                    </td>
-                    <td className="py-4 pr-4 hidden sm:table-cell">
-                      <p className="text-sm text-slate-300">
-                        {customer.street ?? '–'}
-                      </p>
-                      <p className="text-sm text-slate-400">
-                        {[customer.zip, customer.city].filter(Boolean).join(' ') || '–'}
-                      </p>
-                    </td>
-                    <td className="py-4 pr-4 hidden md:table-cell">
-                      <Link href={`/my-orders?customer=${customer.id}`} className="group">
-                        <span className="text-primary font-bold group-hover:underline">
-                          {countMap[customer.id] ?? 0}
-                        </span>
-                        <span className="text-slate-500 text-xs ml-1">Bestellung(en)</span>
-                      </Link>
-                    </td>
-                    <td className="py-4 pr-4">
-                      {customer.is_anonymized ? (
-                        <Badge className="bg-red-500/10 text-red-400 border-red-500/20 gap-1">
-                          <AlertTriangle className="w-3 h-3" /> Anonymisiert
-                        </Badge>
-                      ) : (
-                        <Badge className="bg-green-500/10 text-green-400 border-green-500/20">Aktiv</Badge>
-                      )}
-                    </td>
-                    <td className="py-4 text-right">
-                      {!customer.is_anonymized && (
-                        <Link href={`/my-customers/${customer.id}`}>
-                          <Button variant="ghost" size="sm" className="text-slate-400 hover:text-white gap-1">
-                            <Edit2 className="w-3.5 h-3.5" /> Bearbeiten
-                          </Button>
-                        </Link>
-                      )}
-                    </td>
-                  </tr>
-                ))}
-              </tbody>
-            </table>
-          </div>
-        )}
+        {/* Akkordeon-Ansicht */}
+        <CustomerAccordionList customers={customers} />
 
         {/* DSGVO-Hinweis */}
         <div className="p-4 rounded-xl bg-amber-500/5 border border-amber-500/20 text-xs text-amber-300/80 space-y-1">

shop/app/order/page.tsx

@@ -8,11 +8,12 @@ import { redirect } from 'next/navigation'
 import { Suspense } from 'react'
 
 interface PageProps {
-  searchParams: Promise<{ id?: string }>
+  searchParams: Promise<{ id?: string; orderId?: string; mode?: string }>
 }
 
 export default async function OrderPage({ searchParams }: PageProps) {
   const params = await searchParams
+  const orderId = params.orderId || params.id
   return (
     <div className="min-h-screen bg-[#0a0a0a] text-white selection:bg-primary/30">
       <div className="container mx-auto py-10">
@@ -26,14 +27,14 @@ export default async function OrderPage({ searchParams }: PageProps) {
         </div>
         
         <Suspense fallback={<div className="h-96 w-full animate-pulse bg-white/5 rounded-2xl" />}>
-          <OrderDataWrapper orderId={params.id} />
+          <OrderDataWrapper orderId={orderId} mode={params.mode} />
         </Suspense>
       </div>
     </div>
   )
 }
 
-async function OrderDataWrapper({ orderId }: { orderId?: string }) {
+async function OrderDataWrapper({ orderId, mode }: { orderId?: string; mode?: string }) {
   const supabase = await createClient()
   const { data: { user } } = await supabase.auth.getUser()
 
@@ -83,7 +84,7 @@ async function OrderDataWrapper({ orderId }: { orderId?: string }) {
       redirect('/order')
     }
 
-    if (orderData.status === 'completed' && !isAdmin) {
+    if (orderData.status === 'completed' && !isAdmin && mode !== 'extension') {
       redirect('/order')
     }
 

shop/app/wizard/page.tsx

@@ -0,0 +1,16 @@
+import { redirect } from 'next/navigation'
+
+interface PageProps {
+  searchParams: Promise<{ id?: string; orderId?: string; mode?: string }>
+}
+
+export default async function WizardPage({ searchParams }: PageProps) {
+  const params = await searchParams
+  const id = params.orderId || params.id
+  const mode = params.mode
+  const query = new URLSearchParams()
+  if (id) query.set('orderId', id)
+  if (mode) query.set('mode', mode)
+  
+  redirect(`/order?${query.toString()}`)
+}