From bc2bba14aaecbba24fb653302ab4c68a73c01bed Mon Sep 17 00:00:00 2001
From: gsinghpal <gur_preet.singh@outlook.com>
Date: Wed, 1 Apr 2026 16:23:07 -0400
Subject: [PATCH] =?UTF-8?q?fix:=20redesign=20product=20creation=20wizard?=
 =?UTF-8?q?=20=E2=80=94=20use=20Odoo=20statusbar,=20clean=20layout?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Replaced hardcoded badge step indicator with Odoo's native statusbar widget
- Removed all hardcoded Bootstrap colour classes (bg-primary, text-muted, etc.)
- Using oe_highlight and oe_link for buttons (theme-aware)
- Cleaner 2-column layout for basic info and review steps
- Full-width separators and fields for content step
- Images in 2-column grid
- SEO meta fields use proper group layout

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../wizard/woo_product_create_views.xml       | 288 ++++++++----------
 1 file changed, 127 insertions(+), 161 deletions(-)

diff --git a/fusion-woo-odoo/fusion_woocommerce/wizard/woo_product_create_views.xml b/fusion-woo-odoo/fusion_woocommerce/wizard/woo_product_create_views.xml
index 9a67ec39..32d9ac42 100644
--- a/fusion-woo-odoo/fusion_woocommerce/wizard/woo_product_create_views.xml
+++ b/fusion-woo-odoo/fusion_woocommerce/wizard/woo_product_create_views.xml
@@ -7,197 +7,163 @@
         <field name="arch" type="xml">
             <form string="Create Product in WooCommerce">
                 <sheet>
-                    <!-- Step indicator -->
-                    <div class="o_statusbar_status mb-3">
-                        <span class="badge bg-primary me-1" invisible="step != 'basic'">
-                            1. Basic Info
-                        </span>
-                        <span class="badge bg-secondary me-1" invisible="step == 'basic'">
-                            1. Basic Info &#10003;
-                        </span>
-
-                        <span class="badge bg-primary me-1" invisible="step != 'images'">
-                            2. Images
-                        </span>
-                        <span class="badge bg-secondary me-1" invisible="step in ('basic', 'images')">
-                            2. Images &#10003;
-                        </span>
-                        <span class="badge bg-light text-muted me-1" invisible="step not in ('basic',)">
-                            2. Images
-                        </span>
-
-                        <span class="badge bg-primary me-1" invisible="step != 'content'">
-                            3. Content &amp; SEO
-                        </span>
-                        <span class="badge bg-secondary me-1" invisible="step == 'review'">
-                        </span>
-                        <span class="badge bg-light text-muted me-1" invisible="step not in ('basic', 'images')">
-                            3. Content &amp; SEO
-                        </span>
-
-                        <span class="badge bg-primary me-1" invisible="step != 'review'">
-                            4. Review &amp; Create
-                        </span>
-                        <span class="badge bg-light text-muted me-1" invisible="step == 'review'">
-                            4. Review &amp; Create
-                        </span>
-                    </div>
+                    <!-- Step indicator using Odoo statusbar widget -->
+                    <field name="step" widget="statusbar"
+                           statusbar_visible="basic,images,content,review"/>
 
                     <field name="instance_id" invisible="1"/>
+                    <field name="wc_category_id" invisible="1"/>
 
                     <!-- ========== STEP 1: Basic Info ========== -->
-                    <group invisible="step != 'basic'">
-                        <group string="Product Selection">
-                            <field name="odoo_product_id"/>
+                    <div invisible="step != 'basic'">
+                        <group>
+                            <group string="Product">
+                                <field name="odoo_product_id"/>
+                                <field name="product_name" placeholder="PRODUCT NAME IN CAPS"/>
+                                <field name="wc_product_name" placeholder="Product Name In Title Case"/>
+                                <field name="sku" string="Internal Reference"/>
+                            </group>
+                            <group string="Pricing &amp; Tax">
+                                <field name="sale_price"/>
+                                <field name="cost_price"/>
+                                <field name="sales_tax_id"/>
+                                <field name="purchase_tax_id"/>
+                                <field name="wc_tax_class" readonly="1"/>
+                            </group>
                         </group>
-                        <group string="Product Names">
-                            <field name="product_name" placeholder="PRODUCT NAME IN CAPS"/>
-                            <field name="wc_product_name" placeholder="Product Name In Title Case"/>
+                        <group>
+                            <group string="Category">
+                                <field name="odoo_category_id"/>
+                                <field name="wc_category_name" readonly="1"/>
+                            </group>
                         </group>
-                        <group string="Category">
-                            <field name="odoo_category_id"/>
-                            <field name="wc_category_name"/>
-                        </group>
-                        <group string="Pricing">
-                            <field name="sale_price"/>
-                            <field name="cost_price"/>
-                        </group>
-                        <group string="Identification">
-                            <field name="sku"/>
-                        </group>
-                        <group string="Taxes">
-                            <field name="sales_tax_id"/>
-                            <field name="purchase_tax_id"/>
-                            <field name="wc_tax_class" readonly="1"/>
-                        </group>
-                        <field name="wc_category_id" invisible="1"/>
-                    </group>
+                    </div>
 
                     <!-- ========== STEP 2: Images ========== -->
-                    <group invisible="step != 'images'">
-                        <group string="Product Images">
-                            <field name="image_1" filename="image_1_filename" widget="image"/>
-                            <field name="image_1_filename" invisible="1"/>
-                            <field name="image_2" filename="image_2_filename" widget="image"/>
-                            <field name="image_2_filename" invisible="1"/>
-                            <field name="image_3" filename="image_3_filename" widget="image"/>
-                            <field name="image_3_filename" invisible="1"/>
-                            <field name="image_4" filename="image_4_filename" widget="image"/>
-                            <field name="image_4_filename" invisible="1"/>
-                            <field name="image_5" filename="image_5_filename" widget="image"/>
-                            <field name="image_5_filename" invisible="1"/>
+                    <div invisible="step != 'images'">
+                        <div class="mb-3">
+                            <button name="action_ai_tag_images" type="object"
+                                string="AI Tag Images" class="oe_highlight me-2"
+                                icon="fa-magic"/>
+                            <button name="action_geo_tag_images" type="object"
+                                string="Geo-tag Images" class="btn-secondary"
+                                icon="fa-map-marker"/>
+                            <field name="images_geotagged" invisible="1"/>
+                        </div>
+                        <group>
+                            <group>
+                                <field name="image_1" widget="image" string="Featured Image"/>
+                                <field name="image_1_filename" invisible="1"/>
+                                <field name="image_2" widget="image" string="Image 2"/>
+                                <field name="image_2_filename" invisible="1"/>
+                                <field name="image_3" widget="image" string="Image 3"/>
+                                <field name="image_3_filename" invisible="1"/>
+                            </group>
+                            <group>
+                                <field name="image_4" widget="image" string="Image 4"/>
+                                <field name="image_4_filename" invisible="1"/>
+                                <field name="image_5" widget="image" string="Image 5"/>
+                                <field name="image_5_filename" invisible="1"/>
+                            </group>
                         </group>
-                        <group string="Image Processing">
-                            <div>
-                                <button name="action_ai_tag_images" type="object"
-                                    string="AI Tag Images" class="btn btn-primary me-2"
-                                    icon="fa-magic"/>
-                                <button name="action_geo_tag_images" type="object"
-                                    string="Geo-tag Images" class="btn btn-secondary"
-                                    icon="fa-map-marker"/>
-                            </div>
-                            <field name="images_geotagged" readonly="1"/>
-                            <field name="image_metadata" readonly="1" widget="text"
-                                placeholder="AI metadata will appear here after tagging..."/>
-                        </group>
-                    </group>
+                        <field name="image_metadata" invisible="1"/>
+                    </div>
 
                     <!-- ========== STEP 3: Content & SEO ========== -->
-                    <group invisible="step != 'content'">
-                        <group string="Product Information for AI" colspan="2">
-                            <field name="raw_product_info" colspan="2"
-                                placeholder="Type everything you know about this product — features, materials, use cases, target audience, dimensions, etc. The AI will use this to generate all descriptions."/>
-                            <field name="ai_keywords"
+                    <div invisible="step != 'content'">
+                        <separator string="Product Information for AI"/>
+                        <field name="raw_product_info" nolabel="1" widget="text"
+                            placeholder="Type everything you know about this product — features, materials, use cases, target audience, dimensions, etc. The AI will use this to generate all descriptions."/>
+                        <group>
+                            <field name="ai_keywords" string="Keywords"
                                 placeholder="mobility, wheelchair, medical equipment, ..."/>
                         </group>
-                        <div colspan="2" class="mb-3">
+                        <div class="mb-3">
                             <button name="action_ai_generate_all" type="object"
-                                string="Generate All with AI" class="btn btn-primary"
+                                string="Generate All with AI" class="oe_highlight"
                                 icon="fa-magic"/>
                         </div>
-                        <group string="Product Title" colspan="2">
-                            <div class="d-flex align-items-start">
-                                <field name="wc_title" class="flex-grow-1"/>
-                                <button name="action_ai_generate_title" type="object"
-                                    string="AI" class="btn btn-outline-primary btn-sm ms-2"
-                                    icon="fa-magic"/>
-                            </div>
+
+                        <separator string="Product Title"/>
+                        <group>
+                            <field name="wc_title" string="WC Product Title"/>
+                            <button name="action_ai_generate_title" type="object"
+                                string="AI Generate" class="oe_link"
+                                icon="fa-magic"/>
                         </group>
-                        <group string="Short Description" colspan="2">
-                            <div>
-                                <button name="action_ai_generate_short_desc" type="object"
-                                    string="AI Generate" class="btn btn-outline-primary btn-sm mb-1"
-                                    icon="fa-magic"/>
-                            </div>
-                            <field name="short_description" widget="html" nolabel="1" colspan="2"/>
-                        </group>
-                        <group string="Long Description" colspan="2">
-                            <div>
-                                <button name="action_ai_generate_long_desc" type="object"
-                                    string="AI Generate" class="btn btn-outline-primary btn-sm mb-1"
-                                    icon="fa-magic"/>
-                            </div>
-                            <field name="long_description" widget="html" nolabel="1" colspan="2"/>
-                        </group>
-                        <group string="SEO Meta Data" colspan="2">
-                            <div class="mb-2">
-                                <button name="action_ai_generate_meta" type="object"
-                                    string="AI Generate Meta" class="btn btn-outline-primary btn-sm"
-                                    icon="fa-magic"/>
-                                <button name="action_ai_generate_keywords" type="object"
-                                    string="AI Generate Keywords" class="btn btn-outline-primary btn-sm ms-2"
-                                    icon="fa-magic"/>
-                            </div>
+
+                        <separator string="Short Description"/>
+                        <button name="action_ai_generate_short_desc" type="object"
+                            string="AI Generate" class="oe_link mb-1"
+                            icon="fa-magic"/>
+                        <field name="short_description" widget="html" nolabel="1"/>
+
+                        <separator string="Long Description"/>
+                        <button name="action_ai_generate_long_desc" type="object"
+                            string="AI Generate" class="oe_link mb-1"
+                            icon="fa-magic"/>
+                        <field name="long_description" widget="html" nolabel="1"/>
+
+                        <separator string="SEO Meta Data"/>
+                        <div class="mb-2">
+                            <button name="action_ai_generate_meta" type="object"
+                                string="AI Generate Meta" class="oe_link"
+                                icon="fa-magic"/>
+                            <button name="action_ai_generate_keywords" type="object"
+                                string="AI Generate Keywords" class="oe_link ms-3"
+                                icon="fa-magic"/>
+                        </div>
+                        <group>
                             <field name="meta_title" placeholder="SEO title (under 60 characters)"/>
-                            <field name="meta_description" placeholder="SEO description (under 160 characters)"/>
+                            <field name="meta_description" widget="text"
+                                placeholder="SEO description (under 160 characters)"/>
                             <field name="seo_keywords" placeholder="keyword1, keyword2, keyword3"/>
                         </group>
-                    </group>
+                    </div>
 
                     <!-- ========== STEP 4: Review & Create ========== -->
-                    <group invisible="step != 'review'">
-                        <group string="Product Names">
-                            <field name="product_name" readonly="1"/>
-                            <field name="wc_product_name" readonly="1"/>
+                    <div invisible="step != 'review'">
+                        <group>
+                            <group string="Product">
+                                <field name="product_name" readonly="1"/>
+                                <field name="wc_title" readonly="1" string="WC Title"/>
+                                <field name="sku" readonly="1"/>
+                            </group>
+                            <group string="Pricing &amp; Tax">
+                                <field name="sale_price" readonly="1"/>
+                                <field name="cost_price" readonly="1"/>
+                                <field name="sales_tax_id" readonly="1"/>
+                                <field name="wc_tax_class" readonly="1"/>
+                            </group>
                         </group>
-                        <group string="Category &amp; Tax">
-                            <field name="odoo_category_id" readonly="1"/>
-                            <field name="wc_category_name" readonly="1"/>
-                            <field name="wc_tax_class" readonly="1"/>
+                        <group>
+                            <group string="Category">
+                                <field name="odoo_category_id" readonly="1"/>
+                                <field name="wc_category_name" readonly="1"/>
+                            </group>
+                            <group string="SEO">
+                                <field name="meta_title" readonly="1"/>
+                                <field name="meta_description" readonly="1"/>
+                                <field name="seo_keywords" readonly="1"/>
+                            </group>
                         </group>
-                        <group string="Pricing">
-                            <field name="sale_price" readonly="1"/>
-                            <field name="cost_price" readonly="1"/>
-                            <field name="sku" readonly="1"/>
-                        </group>
-                        <group string="Taxes">
-                            <field name="sales_tax_id" readonly="1"/>
-                            <field name="purchase_tax_id" readonly="1"/>
-                        </group>
-                        <group string="WooCommerce Content" colspan="2">
-                            <field name="wc_title" readonly="1"/>
-                            <field name="meta_title" readonly="1"/>
-                            <field name="meta_description" readonly="1"/>
-                            <field name="seo_keywords" readonly="1"/>
-                        </group>
-                        <group string="Images" colspan="2">
-                            <field name="images_geotagged" readonly="1"/>
-                        </group>
-                    </group>
+                    </div>
 
                 </sheet>
                 <footer>
-                    <button string="&#8592; Back" type="object" name="action_back"
-                        class="btn btn-secondary"
-                        invisible="step == 'basic'"/>
-                    <button string="Next &#8594;" type="object" name="action_next"
-                        class="btn btn-primary"
-                        invisible="step == 'review'"/>
+                    <button string="Back" type="object" name="action_back"
+                        class="btn-secondary"
+                        invisible="step == 'basic'"
+                        icon="fa-arrow-left"/>
+                    <button string="Next" type="object" name="action_next"
+                        class="oe_highlight"
+                        invisible="step == 'review'"
+                        icon="fa-arrow-right"/>
                     <button string="Create in WooCommerce" type="object" name="action_create_product"
-                        class="btn btn-success"
+                        class="oe_highlight"
                         invisible="step != 'review'"
                         icon="fa-cloud-upload"/>
-                    <button string="Cancel" class="btn btn-secondary" special="cancel"/>
+                    <button string="Cancel" class="btn-secondary" special="cancel"/>
                 </footer>
             </form>
         </field>