Refactor CreateProductDialog and MerchantStore for improved product handling

- Updated CreateProductDialog to use `model-value` for Checkbox components, enhancing reactivity and consistency.
- Modified MerchantStore to only add active products to the market store, improving product visibility and management.

These changes streamline the product creation and management processes, ensuring better user experience and data integrity.

src/modules/market/components/CreateProductDialog.vue

@@ -89,8 +89,9 @@
                 <FormControl>
                   <div class="flex items-center space-x-2">
                     <Checkbox
-                      :checked="value"
-                      @update:checked="handleChange"
+                      :key="`active-checkbox-${props.isOpen}`"
+                      :model-value="value"
+                      @update:model-value="handleChange"
                       :disabled="isCreating"
                     />
                     <Label>Product is active and visible</Label>
@@ -141,8 +142,8 @@
               <div class="flex items-center space-x-2">
                 <FormControl>
                   <Checkbox
-                    :checked="value"
-                    @update:checked="handleChange"
+                    :model-value="value"
+                    @update:model-value="handleChange"
                     :disabled="isCreating"
                   />
                 </FormControl>
@@ -461,13 +462,13 @@ watch(() => props.isOpen, async (isOpen) => {
       use_autoreply: false,
       autoreply_message: ''
     }
-    
+
     // Reset form with appropriate initial values
     resetForm({ values: initialValues })
-    
+
     // Wait for reactivity
     await nextTick()
-    
+
     // Clear any previous errors
     createError.value = null
   }

src/modules/market/components/MerchantStore.vue

@@ -523,10 +523,12 @@ const loadStallProducts = async () => {
     }))
     stallProducts.value = enrichedProducts
 
-    // Also add them to the market store so they appear in the main market
-    enrichedProducts.forEach(product => {
-      marketStore.addProduct(product)
-    })
+    // Only add active products to the market store so they appear in the main market
+    enrichedProducts
+      .filter(product => product.active)
+      .forEach(product => {
+        marketStore.addProduct(product)
+      })
   } catch (error) {
     console.error('Failed to load products:', error)
     stallProducts.value = []