feat(multiselect): support multi-select categories and free items limits in category config and order wizard

shop/components/admin/category-dialog.tsx

@@ -43,6 +43,8 @@ const categorySchema = z.object({
   icon: z.string().default('Package'),
   sort_order: z.coerce.number().int().min(0).default(0),
   is_required: z.boolean().default(true),
+  allow_multiselect: z.boolean().default(false),
+  free_items_limit: z.coerce.number().int().min(0).default(0),
 })
 
 type CategoryFormValues = z.infer<typeof categorySchema>
@@ -65,15 +67,17 @@ export function CategoryDialog({
       icon: category?.icon || 'Package',
       sort_order: category?.sort_order ?? 0,
       is_required: category?.is_required ?? true,
+      allow_multiselect: category?.allow_multiselect ?? false,
+      free_items_limit: category?.free_items_limit ?? 0,
     },
   })
 
   async function onSubmit(values: CategoryFormValues) {
     try {
       if (category) {
-        await updateCategory(category.id, values)
+        await updateCategory(category.id, values as any)
       } else {
-        await createCategory(values)
+        await createCategory(values as any)
       }
       setOpen(false)
       form.reset()
@@ -184,7 +188,7 @@ export function CategoryDialog({
                     </FormItem>
                   )}
                 />
-                <FormField
+                 <FormField
                   control={form.control}
                   name="is_required"
                   render={({ field }) => (
@@ -207,6 +211,52 @@ export function CategoryDialog({
                     </FormItem>
                   )}
                 />
+                <FormField
+                  control={form.control}
+                  name="allow_multiselect"
+                  render={({ field }) => (
+                    <FormItem className="flex flex-row items-start space-x-3 space-y-0 rounded-lg border border-slate-200 dark:border-white/10 bg-slate-50 dark:bg-white/5 p-4">
+                      <FormControl>
+                        <Checkbox
+                          checked={field.value}
+                          onCheckedChange={field.onChange}
+                        />
+                      </FormControl>
+                      <div className="space-y-1 leading-none">
+                        <FormLabel className="text-slate-900 dark:text-white font-semibold cursor-pointer">
+                          Mehrfachauswahl erlauben
+                        </FormLabel>
+                        <p className="text-xs text-slate-500 dark:text-slate-400">
+                          Erlaubt die Auswahl mehrerer Produkte/Module innerhalb dieser Kategorie.
+                        </p>
+                      </div>
+                    </FormItem>
+                  )}
+                />
+                {form.watch('allow_multiselect') && (
+                  <FormField
+                    control={form.control}
+                    name="free_items_limit"
+                    render={({ field }) => (
+                      <FormItem>
+                        <FormLabel className="text-slate-900 dark:text-white">Inklusive Freie Artikel Limit</FormLabel>
+                        <FormControl>
+                          <Input
+                            type="number"
+                            min={0}
+                            placeholder="z.B. 2"
+                            className="bg-slate-50 dark:bg-white/5 border-slate-200 dark:border-white/10 text-slate-900 dark:text-white placeholder:text-slate-500"
+                            {...field}
+                          />
+                        </FormControl>
+                        <FormMessage />
+                        <p className="text-xs text-slate-500 dark:text-slate-400">
+                          Bis zu dieser Anzahl sind gewählte Artikel in dieser Kategorie kostenlos. Alle darüber hinausgehenden werden voll berechnet (günstigste Artikel zuerst frei).
+                        </p>
+                      </FormItem>
+                    )}
+                  />
+                )}
               </div>
             </ScrollArea>
             <DialogFooter className="pt-4">

shop/components/admin/category-list.tsx

@@ -80,11 +80,18 @@ export function CategoryList({ initialCategories }: { initialCategories: Categor
                   </span>
                 </TableCell>
                 <TableCell>
-                  {category.is_required ? (
-                    <Badge className="bg-green-500/20 text-green-600 dark:text-green-400 border border-green-500/30 whitespace-nowrap">Pflicht</Badge>
-                  ) : (
-                    <Badge variant="outline" className="border-slate-200 dark:border-white/20 text-slate-500 dark:text-slate-400 whitespace-nowrap">Optional</Badge>
-                  )}
+                  <div className="flex flex-col gap-1 items-start">
+                    {category.is_required ? (
+                      <Badge className="bg-green-500/20 text-green-600 dark:text-green-400 border border-green-500/30 whitespace-nowrap">Pflicht</Badge>
+                    ) : (
+                      <Badge variant="outline" className="border-slate-200 dark:border-white/20 text-slate-500 dark:text-slate-400 whitespace-nowrap">Optional</Badge>
+                    )}
+                    {category.allow_multiselect && (
+                      <Badge className="bg-purple-500/20 text-purple-600 dark:text-purple-400 border border-purple-500/30 whitespace-nowrap">
+                        Multi ({category.free_items_limit} frei)
+                      </Badge>
+                    )}
+                  </div>
                 </TableCell>
                 <TableCell className="text-right">
                   <div className="flex justify-end gap-2">