Commit ba7044dbe81 for woocommerce
commit ba7044dbe81ab074cdadd45f1c7608209ba69a6d
Author: verofasulo <98944206+verofasulo@users.noreply.github.com>
Date: Thu May 14 20:04:38 2026 +0200
Add Product type column to the experimental products app (#64907)
* Add Product type column to the experimental products app
* make column visible
---------
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
diff --git a/packages/js/experimental-products-app/changelog/add-products-app-product-type-column b/packages/js/experimental-products-app/changelog/add-products-app-product-type-column
new file mode 100644
index 00000000000..24a568661e4
--- /dev/null
+++ b/packages/js/experimental-products-app/changelog/add-products-app-product-type-column
@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Add an opt-in "Product type" column to the experimental products app product list, showing whether each row is a Simple, Variable, Grouped, Affiliate, or Variation product.
diff --git a/packages/js/experimental-products-app/src/fields/type/field.tsx b/packages/js/experimental-products-app/src/fields/type/field.tsx
index 8bca3b39d26..a0aceae702e 100644
--- a/packages/js/experimental-products-app/src/fields/type/field.tsx
+++ b/packages/js/experimental-products-app/src/fields/type/field.tsx
@@ -13,7 +13,6 @@ const fieldDefinition = {
type: 'text',
label: __( 'Product type', 'woocommerce' ),
enableSorting: false,
- enableHiding: false,
filterBy: {
operators: [ 'isAny', 'isNone' ],
},
@@ -21,11 +20,18 @@ const fieldDefinition = {
{ label: __( 'Simple', 'woocommerce' ), value: 'simple' },
{ label: __( 'Variable', 'woocommerce' ), value: 'variable' },
{ label: __( 'Grouped', 'woocommerce' ), value: 'grouped' },
- { label: __( 'External', 'woocommerce' ), value: 'external' },
+ { label: __( 'Affiliate', 'woocommerce' ), value: 'external' },
+ { label: __( 'Variation', 'woocommerce' ), value: 'variation' },
],
} satisfies Partial< Field< ProductEntityRecord > >;
export const fieldExtensions: Partial< Field< ProductEntityRecord > > = {
...fieldDefinition,
getValue: ( { item } ) => item.type,
+ render: ( { item }: { item: ProductEntityRecord } ) => {
+ const match = fieldDefinition.elements.find(
+ ( element ) => element.value === item.type
+ );
+ return match ? match.label : item.type;
+ },
};
diff --git a/packages/js/experimental-products-app/src/product-list/layouts.ts b/packages/js/experimental-products-app/src/product-list/layouts.ts
index fd25edad815..2d18e5e402c 100644
--- a/packages/js/experimental-products-app/src/product-list/layouts.ts
+++ b/packages/js/experimental-products-app/src/product-list/layouts.ts
@@ -8,6 +8,7 @@ export const DEFAULT_PRODUCT_TABLE_MEDIA_FIELD = 'images';
export const DEFAULT_PRODUCT_TABLE_FIELDS = [
'product_status',
+ 'type',
'sku',
'stock',
'categories',