- {/* Sticky Header — Stepper für Step 3, normaler Stepper für andere Steps */}
- {step === 3 ? (
-
+ {/* Global Stepper for Steps 1, 2, 4 */}
+ {step !== 3 && (
+
)}
@@ -739,44 +733,66 @@ export function OrderWizard({
initial={{ opacity: 0, x: 20 }}
animate={{ opacity: 1, x: 0 }}
exit={{ opacity: 0, x: -20 }}
- className="space-y-6"
>
-
+
+ {/* LEFT: Sticky header (stepper) + scrollable categories */}
+
+ {/* Sticky stepper header — only covers left column */}
+
+
Schritt 3 von 4 — Software konfigurieren
+
+
+
+ {/* Scrollable category content */}
+
+
+
+ {/* RIGHT: Independent full-height sidebar column */}
+
+
+
+
)}
diff --git a/shop/components/wizard/step-software.tsx b/shop/components/wizard/step-software.tsx
index 209e793..ad8de5f 100644
--- a/shop/components/wizard/step-software.tsx
+++ b/shop/components/wizard/step-software.tsx
@@ -11,7 +11,6 @@ import { Badge } from '@/components/ui/badge'
import { ShoppingCart, Check, AlertCircle } from 'lucide-react'
import * as Icons from 'lucide-react'
import { Category, Product, CategorySelection } from '@/lib/types'
-import { SummarySidebar } from './summary-sidebar'
interface StepSoftwareProps {
visibleCategories: Category[]
@@ -26,30 +25,6 @@ interface StepSoftwareProps {
selectedBillingInterval: 'one_time' | 'monthly'
billingLabel: (interval: string) => string
billingBadgeClass: (interval: string) => string
-
- // Sidebar props
- oneTimeTotal: number
- monthlyTotal: number
- oneTimeNet: number
- oneTimeTax: number
- oneTimeGross: number
- monthlyNet: number
- monthlyTax: number
- monthlyGross: number
- updatePriceModifier: { label?: string }
- allCategoriesFilled: boolean
- productValidationErrors: string[]
- basketItems: any[]
- editingIdx: number | null
- editBasketItem: (idx: number) => void
- deleteBasketItem: (idx: number) => void
- deviceName: string
- setDeviceName: (name: string) => void
- addToBasket: () => void
- isNextStepDisabled: boolean
- hasActiveSelection: boolean
- nextStep: () => void
- prevStep: () => void
}
function CategoryIcon({ icon, className }: { icon?: string | null; className?: string }) {
@@ -71,44 +46,19 @@ export function StepSoftware({
selectedBillingInterval,
billingLabel,
billingBadgeClass,
- oneTimeTotal,
- monthlyTotal,
- oneTimeNet,
- oneTimeTax,
- oneTimeGross,
- monthlyNet,
- monthlyTax,
- monthlyGross,
- updatePriceModifier,
- allCategoriesFilled,
- productValidationErrors,
- basketItems,
- editingIdx,
- editBasketItem,
- deleteBasketItem,
- deviceName,
- setDeviceName,
- addToBasket,
- isNextStepDisabled,
- hasActiveSelection,
- nextStep,
- prevStep,
}: StepSoftwareProps) {
return (
-
- {/* Left: Category sections */}
-
-
-
-
-
- Software wählen
-
-
- Wählen Sie pro Kategorie mindestens einen Artikel aus.
-
-
-
+
+
+
+
+ Software wählen
+
+
+ Wählen Sie pro Kategorie mindestens einen Artikel aus.
+
+
+
{visibleCategories.map((cat, idx) => {
const catProducts = products.filter(p => {
if (p.category_id !== cat.id) return false
@@ -339,40 +289,7 @@ export function StepSoftware({
)
})}
-
-
-
-
- {/* Right: Summary sidebar */}
-
-
+
+
)
}
diff --git a/shop/components/wizard/summary-sidebar.tsx b/shop/components/wizard/summary-sidebar.tsx
index 671afcf..498524c 100644
--- a/shop/components/wizard/summary-sidebar.tsx
+++ b/shop/components/wizard/summary-sidebar.tsx
@@ -69,11 +69,10 @@ export function SummarySidebar({
prevStep,
}: SummarySidebarProps) {
return (
-