Add Inventory item to the global Quick Update dropdown (#39972)

* Add Inventory item to the global Quick Update dropdown

* Add changelog file
This commit is contained in:
Maikel David Pérez Gómez 2023-08-31 13:52:06 -04:00 committed by GitHub
parent 785d45fbc3
commit 6673ebecd2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 118 additions and 57 deletions

View File

@ -0,0 +1,4 @@
Significance: minor
Type: add
Add Inventory item to the global Quick Update dropdown

View File

@ -2,7 +2,6 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { ProductVariation } from '@woocommerce/data';
import { recordEvent } from '@woocommerce/tracks';
import { Dropdown, MenuGroup, MenuItem } from '@wordpress/components';
import { createElement } from '@wordpress/element';
@ -14,23 +13,18 @@ import { chevronRight } from '@wordpress/icons';
import { TRACKS_SOURCE } from '../../../constants';
import { PRODUCT_STOCK_STATUS_KEYS } from '../../../utils/get-product-stock-status';
import { UpdateStockMenuItem } from '../update-stock-menu-item';
export type InventoryMenuItemProps = {
variation: ProductVariation;
handlePrompt(
label?: string,
parser?: ( value: string ) => Partial< ProductVariation > | null
): void;
onChange( values: Partial< ProductVariation > ): void;
onClose(): void;
};
import { VariationActionsMenuItemProps } from '../types';
import { handlePrompt } from '../../../utils/handle-prompt';
export function InventoryMenuItem( {
variation,
handlePrompt,
selection,
onChange,
onClose,
}: InventoryMenuItemProps ) {
}: VariationActionsMenuItemProps ) {
const ids = Array.isArray( selection )
? selection.map( ( { id } ) => id )
: selection.id;
return (
<Dropdown
position="middle right"
@ -41,7 +35,7 @@ export function InventoryMenuItem( {
'product_variations_menu_inventory_click',
{
source: TRACKS_SOURCE,
variation_id: variation.id,
variation_id: ids,
}
);
onToggle();
@ -57,7 +51,7 @@ export function InventoryMenuItem( {
<div className="components-dropdown-menu__menu">
<MenuGroup>
<UpdateStockMenuItem
selection={ variation }
selection={ selection }
onChange={ onChange }
onClose={ onClose }
/>
@ -68,12 +62,23 @@ export function InventoryMenuItem( {
{
source: TRACKS_SOURCE,
action: 'manage_stock_toggle',
variation_id: variation.id,
variation_id: ids,
}
);
onChange( {
manage_stock: ! variation.manage_stock,
} );
if ( Array.isArray( selection ) ) {
onChange(
selection.map(
( { id, manage_stock } ) => ( {
id,
manage_stock: ! manage_stock,
} )
)
);
} else {
onChange( {
manage_stock: ! selection.manage_stock,
} );
}
onClose();
} }
>
@ -86,14 +91,25 @@ export function InventoryMenuItem( {
{
source: TRACKS_SOURCE,
action: 'set_status_in_stock',
variation_id: variation.id,
variation_id: ids,
}
);
onChange( {
stock_status:
PRODUCT_STOCK_STATUS_KEYS.instock,
manage_stock: false,
} );
if ( Array.isArray( selection ) ) {
onChange(
selection.map( ( { id } ) => ( {
id,
stock_status:
PRODUCT_STOCK_STATUS_KEYS.instock,
manage_stock: false,
} ) )
);
} else {
onChange( {
stock_status:
PRODUCT_STOCK_STATUS_KEYS.instock,
manage_stock: false,
} );
}
onClose();
} }
>
@ -106,14 +122,25 @@ export function InventoryMenuItem( {
{
source: TRACKS_SOURCE,
action: 'set_status_out_of_stock',
variation_id: variation.id,
variation_id: ids,
}
);
onChange( {
stock_status:
PRODUCT_STOCK_STATUS_KEYS.outofstock,
manage_stock: false,
} );
if ( Array.isArray( selection ) ) {
onChange(
selection.map( ( { id } ) => ( {
id,
stock_status:
PRODUCT_STOCK_STATUS_KEYS.outofstock,
manage_stock: false,
} ) )
);
} else {
onChange( {
stock_status:
PRODUCT_STOCK_STATUS_KEYS.outofstock,
manage_stock: false,
} );
}
onClose();
} }
>
@ -129,14 +156,25 @@ export function InventoryMenuItem( {
{
source: TRACKS_SOURCE,
action: 'set_status_on_back_order',
variation_id: variation.id,
variation_id: ids,
}
);
onChange( {
stock_status:
PRODUCT_STOCK_STATUS_KEYS.onbackorder,
manage_stock: false,
} );
if ( Array.isArray( selection ) ) {
onChange(
selection.map( ( { id } ) => ( {
id,
stock_status:
PRODUCT_STOCK_STATUS_KEYS.onbackorder,
manage_stock: false,
} ) )
);
} else {
onChange( {
stock_status:
PRODUCT_STOCK_STATUS_KEYS.onbackorder,
manage_stock: false,
} );
}
onClose();
} }
>
@ -152,26 +190,40 @@ export function InventoryMenuItem( {
{
source: TRACKS_SOURCE,
action: 'low_stock_amount_set',
variation_id: variation.id,
variation_id: ids,
}
);
handlePrompt( undefined, ( value ) => {
recordEvent(
'product_variations_menu_inventory_select',
{
source: TRACKS_SOURCE,
action: 'low_stock_amount_set',
variation_id: variation.id,
handlePrompt( {
onOk( value ) {
recordEvent(
'product_variations_menu_inventory_update',
{
source: TRACKS_SOURCE,
action: 'low_stock_amount_set',
variation_id: ids,
}
);
const lowStockAmount = Number( value );
if ( Number.isNaN( lowStockAmount ) ) {
return null;
}
);
const lowStockAmount = Number( value );
if ( Number.isNaN( lowStockAmount ) ) {
return null;
}
return {
low_stock_amount: lowStockAmount,
manage_stock: true,
};
if ( Array.isArray( selection ) ) {
onChange(
selection.map( ( { id } ) => ( {
id,
low_stock_amount:
lowStockAmount,
manage_stock: true,
} ) )
);
} else {
onChange( {
low_stock_amount:
lowStockAmount,
manage_stock: true,
} );
}
},
} );
onClose();
} }

View File

@ -78,8 +78,7 @@ export function VariationActionsMenu( {
onClose={ onClose }
/>
<InventoryMenuItem
variation={ selection }
handlePrompt={ handlePrompt }
selection={ selection }
onChange={ onChange }
onClose={ onClose }
/>

View File

@ -13,6 +13,7 @@ import { VariationsActionsMenuProps } from './types';
import { UpdateStockMenuItem } from '../update-stock-menu-item';
import { PricingMenuItem } from '../pricing-menu-item';
import { SetListPriceMenuItem } from '../set-list-price-menu-item';
import { InventoryMenuItem } from '../inventory-menu-item';
export function VariationsActionsMenu( {
selection,
@ -55,6 +56,11 @@ export function VariationsActionsMenu( {
onChange={ onChange }
onClose={ onClose }
/>
<InventoryMenuItem
selection={ selection }
onChange={ onChange }
onClose={ onClose }
/>
</MenuGroup>
<MenuGroup>
<MenuItem