feat(admin): extend wysiwyg live editor

- Add is_required and allow_multiselect category toggles

- Implement module-popover for product module assignment

- Add cascade-protected deletion for categories and products

- Add sidebar link with AdminNavLink active states

shop/app/admin/wysiwyg/components/inline-input.tsx

@@ -26,8 +26,26 @@ export function InlineInput({ value, onSave, className, type = 'text' }: InlineI
 
   const handleBlur = async () => {
     setIsEditing(false)
-    if (currentValue !== value) {
-      await onSave(currentValue)
+    const trimmed = currentValue.trim()
+    
+    if (type === 'number') {
+      const parsed = parseFloat(trimmed)
+      if (isNaN(parsed) || trimmed === '') {
+        setCurrentValue(value)
+        return
+      }
+      const finalVal = parsed.toString()
+      if (finalVal !== value) {
+        await onSave(finalVal)
+      }
+    } else {
+      if (trimmed === '') {
+        setCurrentValue(value)
+        return
+      }
+      if (trimmed !== value) {
+        await onSave(trimmed)
+      }
     }
   }
 

shop/app/admin/wysiwyg/components/module-popover.tsx

@@ -0,0 +1,118 @@
+'use client'
+
+import { useState, useEffect, useRef } from 'react'
+import { ProductModule } from '@/lib/types'
+import { Plus, Search } from 'lucide-react'
+
+interface ModulePopoverProps {
+  assignedModules: ProductModule[]
+  allModules: ProductModule[]
+  onAddModule: (module: ProductModule) => void
+}
+
+export function ModulePopover({ assignedModules, allModules, onAddModule }: ModulePopoverProps) {
+  const [isOpen, setIsOpen] = useState(false)
+  const [search, setSearch] = useState('')
+  const popoverRef = useRef<HTMLDivElement>(null)
+  const inputRef = useRef<HTMLInputElement>(null)
+
+  // Filter modules that are not already assigned to this product
+  // We match by name to treat identical modules across products as the same entity
+  const availableModules = allModules.filter(m => {
+    const isAssigned = assignedModules.some(am => am.name.toLowerCase() === m.name.toLowerCase())
+    const matchesSearch = m.name.toLowerCase().includes(search.toLowerCase()) || 
+                          (m.description && m.description.toLowerCase().includes(search.toLowerCase()))
+    return !isAssigned && matchesSearch
+  })
+
+  // Deduplicate available modules by name to show a clean list
+  const uniqueAvailableModules: ProductModule[] = []
+  const seenNames = new Set<string>()
+  for (const m of availableModules) {
+    const nameKey = m.name.toLowerCase()
+    if (!seenNames.has(nameKey)) {
+      seenNames.add(nameKey)
+      uniqueAvailableModules.push(m)
+    }
+  }
+
+  useEffect(() => {
+    if (isOpen && inputRef.current) {
+      inputRef.current.focus()
+    }
+  }, [isOpen])
+
+  useEffect(() => {
+    function handleClickOutside(event: MouseEvent) {
+      if (popoverRef.current && !popoverRef.current.contains(event.target as Node)) {
+        setIsOpen(false)
+      }
+    }
+    if (isOpen) {
+      document.addEventListener('mousedown', handleClickOutside)
+    }
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside)
+    }
+  }, [isOpen])
+
+  return (
+    <div className="relative inline-block" ref={popoverRef}>
+      <button
+        onClick={() => setIsOpen(!isOpen)}
+        className="flex items-center gap-1.5 px-3 py-1.5 text-xs font-semibold bg-primary/10 text-primary border border-primary/20 hover:bg-primary hover:text-black rounded-lg transition-all"
+      >
+        <Plus className="w-3.5 h-3.5" />
+        Modul hinzufügen
+      </button>
+
+      {isOpen && (
+        <div className="absolute left-0 mt-2 z-50 w-72 bg-slate-900 border border-white/10 rounded-xl shadow-2xl p-3 space-y-3">
+          <div className="relative">
+            <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-slate-400" />
+            <input
+              ref={inputRef}
+              type="text"
+              placeholder="Modul suchen..."
+              value={search}
+              onChange={(e) => setSearch(e.target.value)}
+              className="w-full bg-white/5 border border-white/10 rounded-lg pl-9 pr-3 py-1.5 text-xs text-white placeholder-slate-400 outline-none focus:border-primary/50 transition-colors"
+            />
+          </div>
+
+          <div className="max-h-60 overflow-y-auto space-y-1 pr-1 custom-scrollbar">
+            {uniqueAvailableModules.length > 0 ? (
+              uniqueAvailableModules.map((mod) => (
+                <button
+                  key={mod.id}
+                  onClick={() => {
+                    onAddModule(mod)
+                    setIsOpen(false)
+                    setSearch('')
+                  }}
+                  className="w-full text-left p-2 hover:bg-white/5 rounded-lg transition-colors group"
+                >
+                  <div className="font-medium text-xs text-white group-hover:text-primary transition-colors">
+                    {mod.name}
+                  </div>
+                  {mod.description && (
+                    <div className="text-[10px] text-slate-400 line-clamp-1 mt-0.5">
+                      {mod.description}
+                    </div>
+                  )}
+                  <div className="text-[10px] text-primary font-mono mt-1">
+                    {new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(mod.price)}
+                  </div>
+                </button>
+              ))
+            ) : (
+              <div className="text-[11px] text-slate-400 text-center py-4">
+                Keine passenden Module gefunden.
+              </div>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  )
+}