sboulahtit/orion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: make Product fully independent from MarketplaceProduct

Browse Source 
- Add is_digital and product_type columns to Product model
- Remove is_digital/product_type properties that derived from MarketplaceProduct
- Update Create form with translation tabs, GTIN type, sale price, VAT rate, image
- Update Edit form to allow editing is_digital (remove disabled state)
- Add Availability field to Edit form
- Fix Detail page for directly created products (no marketplace source)
- Update vendor_product_service to handle new fields in create/update
- Add VendorProductCreate/Update schema fields for translations and is_digital
- Add unit tests for is_digital column and direct product creation
- Add integration tests for create/update API with new fields
- Create product-architecture.md documenting the independent copy pattern
- Add migration y3d4e5f6g7h8 for is_digital and product_type columns

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Samir Boulahtit
2026-01-08 01:11:00 +01:00
parent 7b81f59eba
commit fa2a3bf89a
19 changed files with 1603 additions and 201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
app/templates/vendor/media.html vendored
View File

@@ -44,7 +44,7 @@
<!-- Images -->
<div class="flex items-center p-4 bg-white rounded-lg shadow-xs dark:bg-gray-800">
<div class="p-3 mr-4 text-green-500 bg-green-100 rounded-full dark:text-green-100 dark:bg-green-500">
<span x-html="$icon('image', 'w-5 h-5')"></span>
<span x-html="$icon('photograph', 'w-5 h-5')"></span>
</div>
<div>
<p class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">Images</p>
@@ -55,7 +55,7 @@
<!-- Videos -->
<div class="flex items-center p-4 bg-white rounded-lg shadow-xs dark:bg-gray-800">
<div class="p-3 mr-4 text-purple-500 bg-purple-100 rounded-full dark:text-purple-100 dark:bg-purple-500">
<span x-html="$icon('video', 'w-5 h-5')"></span>
<span x-html="$icon('play', 'w-5 h-5')"></span>
</div>
<div>
<p class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">Videos</p>
@@ -66,7 +66,7 @@
<!-- Documents -->
<div class="flex items-center p-4 bg-white rounded-lg shadow-xs dark:bg-gray-800">
<div class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
<span x-html="$icon('file-text', 'w-5 h-5')"></span>
<span x-html="$icon('document-text', 'w-5 h-5')"></span>
</div>
<div>
<p class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">Documents</p>
@@ -128,7 +128,7 @@
<!-- Empty State -->
<div x-show="media.length === 0" class="bg-white rounded-lg shadow-md dark:bg-gray-800 p-12 text-center">
<div class="text-gray-400 mb-4">
<span x-html="$icon('image', 'w-16 h-16 mx-auto')"></span>
<span x-html="$icon('photograph', 'w-16 h-16 mx-auto')"></span>
</div>
<h3 class="text-lg font-semibold text-gray-700 dark:text-gray-200 mb-2">No Media Files Yet</h3>
<p class="text-gray-600 dark:text-gray-400 mb-4">Upload your first file to get started</p>
@@ -163,14 +163,14 @@
<!-- Video icon -->
<template x-if="item.media_type === 'video'">
<div class="w-full h-full flex items-center justify-center text-gray-400">
<span x-html="$icon('video', 'w-12 h-12')"></span>
<span x-html="$icon('play', 'w-12 h-12')"></span>
</div>
</template>
<!-- Document icon -->
<template x-if="item.media_type === 'document'">
<div class="w-full h-full flex items-center justify-center text-gray-400">
<span x-html="$icon('file-text', 'w-12 h-12')"></span>
<span x-html="$icon('document-text', 'w-12 h-12')"></span>
</div>
</template>
@@ -251,7 +251,7 @@
>
<div class="text-gray-400 mb-4">
<span x-html="$icon('upload-cloud', 'w-12 h-12 mx-auto')"></span>
<span x-html="$icon('cloud-upload', 'w-12 h-12 mx-auto')"></span>
</div>
<p class="text-gray-600 dark:text-gray-400 mb-2">Drag and drop files here, or</p>
<button
@@ -270,7 +270,7 @@
<template x-for="file in uploadingFiles" :key="file.name">
<div class="flex items-center gap-3 p-2 bg-gray-50 dark:bg-gray-700 rounded">
<div class="flex-shrink-0">
<span x-html="$icon(file.status === 'success' ? 'check-circle' : file.status === 'error' ? 'x-circle' : 'loader', 'w-5 h-5')"
<span x-html="$icon(file.status === 'success' ? 'check-circle' : file.status === 'error' ? 'x-circle' : 'spinner', 'w-5 h-5')"
:class="{
'text-green-500': file.status === 'success',
'text-red-500': file.status === 'error',
@@ -325,7 +325,7 @@
</template>
<template x-if="selectedMedia?.media_type !== 'image'">
<div class="aspect-square flex items-center justify-center text-gray-400">
<span x-html="$icon(selectedMedia?.media_type === 'video' ? 'video' : 'file-text', 'w-16 h-16')"></span>
<span x-html="$icon(selectedMedia?.media_type === 'video' ? 'play' : 'document-text', 'w-16 h-16')"></span>
</div>
</template>
</div>
@@ -401,7 +401,7 @@
class="px-3 py-2 text-sm border rounded-lg hover:bg-gray-50 dark:border-gray-600 dark:hover:bg-gray-700"
title="Copy URL"
>
<span x-html="$icon('copy', 'w-4 h-4')"></span>
<span x-html="$icon('clipboard-copy', 'w-4 h-4')"></span>
</button>
</div>
</div>
@@ -416,7 +416,7 @@
class="px-4 py-2 text-sm font-medium text-red-600 border border-red-600 rounded-lg hover:bg-red-50 dark:hover:bg-red-900/20"
:disabled="saving"
>
<span x-html="$icon('trash-2', 'w-4 h-4 inline mr-1')"></span>
<span x-html="$icon('trash', 'w-4 h-4 inline mr-1')"></span>
Delete
</button>
<div class="flex gap-3">

174
app/templates/vendor/product-create.html vendored Normal file
View File

@@ -0,0 +1,174 @@
{# app/templates/vendor/product-create.html #}
{% extends "vendor/base.html" %}
{% from 'shared/macros/headers.html' import detail_page_header %}
{% block title %}Create Product{% endblock %}
{% block alpine_data %}vendorProductCreate(){% endblock %}
{% block content %}
{% call detail_page_header("'Create Product'", backUrl) %}
<span>Add a new product to your catalog</span>
{% endcall %}
<!-- Create Form -->
<form @submit.prevent="createProduct()">
<!-- Basic Information -->
<div class="px-4 py-5 mb-6 bg-white rounded-lg shadow-md dark:bg-gray-800">
<h3 class="mb-4 text-lg font-semibold text-gray-700 dark:text-gray-200">
Basic Information
</h3>
<div class="grid gap-4 md:grid-cols-2">
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Title *</label>
<input
type="text"
x-model="form.title"
required
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
placeholder="Product title"
/>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Brand</label>
<input
type="text"
x-model="form.brand"
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
placeholder="Brand name"
/>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">SKU</label>
<input
type="text"
x-model="form.vendor_sku"
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
placeholder="SKU"
/>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">GTIN/EAN</label>
<input
type="text"
x-model="form.gtin"
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
placeholder="GTIN/EAN"
/>
</div>
</div>
</div>
<!-- Pricing -->
<div class="px-4 py-5 mb-6 bg-white rounded-lg shadow-md dark:bg-gray-800">
<h3 class="mb-4 text-lg font-semibold text-gray-700 dark:text-gray-200">
Pricing
</h3>
<div class="grid gap-4 md:grid-cols-3">
{# noqa: FE-008 - Using raw number input for price field #}
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Price *</label>
<input
type="number"
step="0.01"
x-model="form.price"
required
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
placeholder="0.00"
/>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Currency</label>
<select
x-model="form.currency"
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
>
<option value="EUR">EUR</option>
<option value="USD">USD</option>
<option value="GBP">GBP</option>
</select>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Availability</label>
<select
x-model="form.availability"
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
>
<option value="in_stock">In Stock</option>
<option value="out_of_stock">Out of Stock</option>
<option value="preorder">Preorder</option>
<option value="backorder">Backorder</option>
</select>
</div>
</div>
</div>
<!-- Status -->
<div class="px-4 py-5 mb-6 bg-white rounded-lg shadow-md dark:bg-gray-800">
<h3 class="mb-4 text-lg font-semibold text-gray-700 dark:text-gray-200">
Status
</h3>
<div class="flex flex-wrap gap-6">
<label class="flex items-center">
<input
type="checkbox"
x-model="form.is_active"
class="w-4 h-4 text-purple-600 border-gray-300 rounded focus:ring-purple-500"
/>
<span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Active</span>
</label>
<label class="flex items-center">
<input
type="checkbox"
x-model="form.is_featured"
class="w-4 h-4 text-purple-600 border-gray-300 rounded focus:ring-purple-500"
/>
<span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Featured</span>
</label>
<label class="flex items-center">
<input
type="checkbox"
x-model="form.is_digital"
class="w-4 h-4 text-purple-600 border-gray-300 rounded focus:ring-purple-500"
/>
<span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Digital Product</span>
</label>
</div>
</div>
<!-- Description -->
<div class="px-4 py-5 mb-6 bg-white rounded-lg shadow-md dark:bg-gray-800">
<h3 class="mb-4 text-lg font-semibold text-gray-700 dark:text-gray-200">
Description
</h3>
<textarea
x-model="form.description"
rows="6"
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
placeholder="Product description"
></textarea>
</div>
<!-- Actions -->
<div class="flex items-center justify-between px-4 py-4 bg-white rounded-lg shadow-md dark:bg-gray-800">
<a
:href="backUrl"
class="px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-600 transition-colors"
>
Cancel
</a>
<button
type="submit"
:disabled="saving || !form.title"
class="flex items-center px-4 py-2 text-sm font-medium text-white bg-purple-600 rounded-lg hover:bg-purple-700 transition-colors disabled:opacity-50"
>
<span x-show="saving" x-html="$icon('spinner', 'w-4 h-4 mr-2 animate-spin')"></span>
<span x-text="saving ? 'Creating...' : 'Create Product'"></span>
</button>
</div>
</form>
{% endblock %}
{% block extra_scripts %}
<script src="{{ url_for('static', path='vendor/js/product-create.js') }}"></script>
{% endblock %}