Merge pull request #74 from madhura68/fix/dashboard-product-dialog-click-bubble

fix(dashboard): klik in productdialog redirect niet naar productpagina

components/dashboard/product-list.tsx

@@ -2,7 +2,7 @@
 
 import Link from 'next/link'
 import { useRouter } from 'next/navigation'
-import { useTransition } from 'react'
+import { useState, useTransition } from 'react'
 import { toast } from 'sonner'
 import { Button } from '@/components/ui/button'
 import { Badge } from '@/components/ui/badge'
@@ -10,7 +10,7 @@ import { CodeBadge } from '@/components/shared/code-badge'
 import { DemoTooltip } from '@/components/shared/demo-tooltip'
 import { restoreProductAction } from '@/actions/products'
 import { setActiveProductAction } from '@/actions/active-product'
-import { EditProductButton } from '@/components/products/edit-product-button'
+import { ProductDialog, type ProductDialogProduct } from '@/components/dialogs/product-dialog'
 
 interface Product {
   id: string
@@ -32,6 +32,7 @@ interface ProductListProps {
 export function ProductList({ products, isDemo, showArchived = false, activeProductId }: ProductListProps) {
   const router = useRouter()
   const [, startTransition] = useTransition()
+  const [editingProduct, setEditingProduct] = useState<ProductDialogProduct | null>(null)
 
   function handleRestore(id: string) {
     startTransition(async () => {
@@ -104,7 +105,16 @@ export function ProductList({ products, isDemo, showArchived = false, activeProd
               )}
               {!showArchived && (
                 <>
-                  <EditProductButton product={product} isDemo={isDemo} />
+                  <DemoTooltip show={isDemo}>
+                    <Button
+                      variant="outline"
+                      size="sm"
+                      onClick={(e) => { e.stopPropagation(); if (!isDemo) setEditingProduct(product) }}
+                      disabled={isDemo}
+                    >
+                      Bewerken
+                    </Button>
+                  </DemoTooltip>
                   {product.id === activeProductId
                     ? <Badge className="bg-primary-container text-primary-container-foreground text-xs px-2 py-0">Actief</Badge>
                     : (
@@ -136,6 +146,15 @@ export function ProductList({ products, isDemo, showArchived = false, activeProd
           </div>
         </div>
       ))}
+      {editingProduct && (
+        <ProductDialog
+          mode="edit"
+          open={!!editingProduct}
+          onOpenChange={(v) => { if (!v) setEditingProduct(null) }}
+          product={editingProduct}
+          isDemo={isDemo}
+        />
+      )}
     </div>
   )
 }