- { selectedField && renderField( selectedField, { name: 'test' } ) }
+ { selectedFieldConfig &&
+ renderField( selectedFieldConfig.type, {
+ value,
+ onChange: setValue,
+ ...selectedFieldConfig,
+ } ) }
);
};
@@ -65,6 +101,21 @@ export const Basic: React.FC = () => {
);
};
+export const ToggleWithTooltip: React.FC = () => {
+ const [ value, setValue ] = useState();
+ return (
+ { child }
;
+ }
+ return child;
+ } ) }
+
{ children }
);
};
-EmptyTable.propTypes = {
- /**
- * An integer with the number of rows the box should occupy.
- */
- numberOfRows: PropTypes.number,
-};
-
-EmptyTable.defaultProps = {
- numberOfRows: 5,
-};
-
export default EmptyTable;
diff --git a/packages/js/components/src/table/index.js b/packages/js/components/src/table/index.js
deleted file mode 100644
index 2723ceb6c32..00000000000
--- a/packages/js/components/src/table/index.js
+++ /dev/null
@@ -1,384 +0,0 @@
-/**
- * External dependencies
- */
-import { __ } from '@wordpress/i18n';
-import classnames from 'classnames';
-import {
- Card,
- CardBody,
- CardFooter,
- CardHeader,
- __experimentalText as Text,
-} from '@wordpress/components';
-import { createElement, Component, Fragment } from '@wordpress/element';
-import { find, first, isEqual, without } from 'lodash';
-import PropTypes from 'prop-types';
-
-/**
- * Internal dependencies
- */
-import EllipsisMenu from '../ellipsis-menu';
-import MenuItem from '../ellipsis-menu/menu-item';
-import MenuTitle from '../ellipsis-menu/menu-title';
-import Pagination from '../pagination';
-import Table from './table';
-import TablePlaceholder from './placeholder';
-import TableSummary, { TableSummaryPlaceholder } from './summary';
-
-/**
- * This is an accessible, sortable, and scrollable table for displaying tabular data (like revenue and other analytics data).
- * It accepts `headers` for column headers, and `rows` for the table content.
- * `rowHeader` can be used to define the index of the row header (or false if no header).
- *
- * `TableCard` serves as Card wrapper & contains a card header, `
- { actions }
-
- { showMenu && (
- { actions }
+ { showMenu && (
+ |
- { isSortable ? (
- |
- );
- } ) }
-
|---|
| - { emptyMessage ?? - __( - 'No data to display', - 'woocommerce' - ) } - | -
+
+
+
+ );
+};
+
+export default withInstanceId( Table );
diff --git a/packages/js/components/src/table/types.ts b/packages/js/components/src/table/types.ts
new file mode 100644
index 00000000000..79b61e92a3d
--- /dev/null
+++ b/packages/js/components/src/table/types.ts
@@ -0,0 +1,189 @@
+export type QueryProps = {
+ orderby?: string;
+ order?: string;
+ page?: number;
+ per_page?: number;
+ /**
+ * Allowing string for backward compatibility
+ */
+ paged?: number | string;
+};
+
+export type TableHeader = {
+ /**
+ * Boolean, true if this column is the default for sorting. Only one column should have this set.
+ */
+ defaultSort?: boolean;
+ /**
+ * String, asc|desc if this column is the default for sorting. Only one column should have this set.
+ */
+ defaultOrder?: string;
+ /**
+ * Boolean, true if this column should be aligned to the left.
+ */
+ isLeftAligned?: boolean;
+ /**
+ * Boolean, true if this column is a number value.
+ */
+ isNumeric?: boolean;
+ /**
+ * Boolean, true if this column is sortable.
+ */
+ isSortable?: boolean;
+ /**
+ * The API parameter name for this column, passed to `orderby` when sorting via API.
+ */
+ key: string;
+ /**
+ * The display label for this column.
+ */
+ label?: React.ReactNode;
+ /**
+ * Boolean, true if this column should always display in the table (not shown in toggle-able list).
+ */
+ required?: boolean;
+ /**
+ * The label used for screen readers for this column.
+ */
+ screenReaderLabel?: string;
+ /**
+ * Additional classname for the header cell
+ */
+ cellClassName?: string;
+ /**
+ * Boolean value to control visibility of a header
+ */
+ visible?: boolean;
+};
+
+export type TableRow = {
+ /**
+ * Display value, used for rendering- strings or elements are best here.
+ */
+ display?: React.ReactNode;
+ /**
+ * "Real" value used for sorting, and should be a string or number. A column with `false` value will not be sortable.
+ */
+ value?: string | number | boolean;
+};
+
+/**
+ * Props shared between TableProps and TableCardProps.
+ */
+type CommonTableProps = {
+ /**
+ * The rowKey used for the key value on each row, a function that returns the key.
+ * Defaults to index.
+ */
+ rowKey?: ( row: TableRow[], index: number ) => number;
+ /**
+ * Customize the message to show when there are no rows in the table.
+ */
+ emptyMessage?: string;
+ /**
+ * The query string represented in object form
+ */
+ query?: QueryProps;
+ /**
+ * Which column should be the row header, defaults to the first item (`0`) (but could be set to `1`, if the first col
+ * is checkboxes, for example). Set to false to disable row headers.
+ */
+ rowHeader?: number | false;
+ /**
+ * An array of column headers (see `Table` props).
+ */
+ headers?: Array< TableHeader >;
+ /**
+ * An array of arrays of display/value object pairs (see `Table` props).
+ */
+ rows?: Array< Array< TableRow > >;
+ /**
+ * Additional CSS classes.
+ */
+ className?: string;
+ /**
+ * A function called when sortable table headers are clicked, gets the `header.key` as argument.
+ */
+ onSort?: ( key: string, direction: string ) => void;
+};
+
+export type TableProps = CommonTableProps & {
+ /** A unique ID for this instance of the component. This is automatically generated by withInstanceId. */
+ instanceId: number | string;
+ /**
+ * Controls whether this component is hidden from screen readers. Used by the loading state, before there is data to read.
+ * Don't use this on real tables unless the table data is loaded elsewhere on the page.
+ */
+ ariaHidden?: boolean;
+ /**
+ * A label for the content in this table
+ */
+ caption?: string;
+ /**
+ * Additional classnames
+ */
+ classNames?: string | Record< string, string >;
+};
+
+export type TableSummaryProps = {
+ // An array of objects with `label` & `value` properties, which display on a single line.
+ data: Array< {
+ label: string;
+ value: boolean | number | string | React.ReactNode;
+ } >;
+};
+
+export type TableCardProps = CommonTableProps & {
+ /**
+ * An array of custom React nodes that is placed at the top right corner.
+ */
+ actions?: Array< React.ReactNode >;
+ /**
+ * If a search is provided in actions and should reorder actions on mobile.
+ */
+ hasSearch?: boolean;
+ /**
+ * A list of IDs, matching to the row list so that ids[ 0 ] contains the object ID for the object displayed in row[ 0 ].
+ */
+ ids?: Array< number >;
+ /**
+ * Defines if the table contents are loading.
+ * It will display `TablePlaceholder` component instead of `Table` if that's the case.
+ */
+ isLoading?: boolean;
+ /**
+ * A function which returns a callback function to update the query string for a given `param`.
+ */
+ // Allowing any for backward compatibitlity
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ onQueryChange?: ( param: string ) => ( ...props: any ) => void;
+ /**
+ * A function which returns a callback function which is called upon the user changing the visiblity of columns.
+ */
+ onColumnsChange?: ( showCols: Array< string >, key?: string ) => void;
+ /**
+ * A callback function that is invoked when the current page is changed.
+ */
+ onPageChange?: ( newPage: number, direction?: 'previous' | 'next' ) => void;
+ /**
+ * The total number of rows to display per page.
+ */
+ rowsPerPage: number;
+ /**
+ * Boolean to determine whether or not ellipsis menu is shown.
+ */
+ showMenu?: boolean;
+ /**
+ * An array of objects with `label` & `value` properties, which display in a line under the table.
+ * Optional, can be left off to show no summary.
+ */
+ summary?: TableSummaryProps[ 'data' ];
+ /**
+ * The title used in the card header, also used as the caption for the content in this table.
+ */
+ title: string;
+ /**
+ * The total number of rows (across all pages).
+ */
+ totalRows: number;
+};
diff --git a/packages/js/components/src/utils.tsx b/packages/js/components/src/utils.tsx
index 682a1a0aded..34117864d5d 100644
--- a/packages/js/components/src/utils.tsx
+++ b/packages/js/components/src/utils.tsx
@@ -1,7 +1,7 @@
/**
* External dependencies
*/
-import React, { isValidElement, Fragment } from 'react';
+import { isValidElement, Fragment } from 'react';
import { Slot, Fill } from '@wordpress/components';
import { cloneElement, createElement } from '@wordpress/element';
@@ -13,15 +13,16 @@ import { cloneElement, createElement } from '@wordpress/element';
* @param {Array} props - Fill props.
* @return {Node} Node.
*/
-function createOrderedChildren< T = Fill.Props >(
+function createOrderedChildren< T = Fill.Props, S = Record< string, unknown > >(
children: React.ReactNode,
order: number,
- props: T
+ props: T,
+ injectProps?: S
) {
if ( typeof children === 'function' ) {
- return cloneElement( children( props ), { order } );
+ return cloneElement( children( props ), { order, ...injectProps } );
} else if ( isValidElement( children ) ) {
- return cloneElement( children, { ...props, order } );
+ return cloneElement( children, { ...props, order, ...injectProps } );
}
throw Error( 'Invalid children type' );
}
diff --git a/packages/js/components/src/woo-product-field-item/woo-product-field-item.tsx b/packages/js/components/src/woo-product-field-item/woo-product-field-item.tsx
index 93bbf4c066d..2db6a28165d 100644
--- a/packages/js/components/src/woo-product-field-item/woo-product-field-item.tsx
+++ b/packages/js/components/src/woo-product-field-item/woo-product-field-item.tsx
@@ -9,6 +9,7 @@ import { createElement, Children } from '@wordpress/element';
* Internal dependencies
*/
import { createOrderedChildren, sortFillsByOrder } from '../utils';
+import { useSlotContext, SlotContextHelpersType } from '../slot-context';
type WooProductFieldItemProps = {
id: string;
@@ -23,36 +24,55 @@ type WooProductFieldSlotProps = {
export const WooProductFieldItem: React.FC< WooProductFieldItemProps > & {
Slot: React.FC< Slot.Props & WooProductFieldSlotProps >;
-} = ( { children, order = 1, section } ) => (
- |
+ { isSortable ? (
+ |
+ );
+ } ) }
+
|---|
| + { emptyMessage ?? + __( 'No data to display', 'woocommerce' ) } + | +
- { child }
-
- )
- );
- } }
-
+ { child }
+
+ )
+ );
+ } }
+
+
+ );
+};
diff --git a/plugins/woocommerce-admin/client/homescreen/header-banner-slot/index.ts b/plugins/woocommerce-admin/client/homescreen/header-banner-slot/index.ts
new file mode 100644
index 00000000000..652d2ba1b61
--- /dev/null
+++ b/plugins/woocommerce-admin/client/homescreen/header-banner-slot/index.ts
@@ -0,0 +1,2 @@
+export * from './header-banner-slot';
+export * from './utils';
diff --git a/plugins/woocommerce-admin/client/homescreen/header-banner-slot/utils.tsx b/plugins/woocommerce-admin/client/homescreen/header-banner-slot/utils.tsx
new file mode 100644
index 00000000000..1bae78f7456
--- /dev/null
+++ b/plugins/woocommerce-admin/client/homescreen/header-banner-slot/utils.tsx
@@ -0,0 +1,58 @@
+/**
+ * External dependencies
+ */
+import { Slot, Fill } from '@wordpress/components';
+
+/**
+ * Internal dependencies
+ */
+import { createOrderedChildren, sortFillsByOrder } from '../../utils';
+
+export const EXPERIMENTAL_WC_HOMESCREEN_HEADER_BANNER_SLOT_NAME =
+ 'woocommerce_homescreen_experimental_header_banner_item';
+/**
+ * Create a Fill for extensions to add items to the WooCommerce Admin Homescreen header banner.
+ *
+ * @slotFill WooHomescreenHeaderBannerItem
+ * @scope woocommerce-admin
+ * @example
+ * const MyHeaderItem = () => (
+ * {
+ const { isLoading } = useSelect( ( select: WCDataSelector ) => {
+ const { hasFinishedResolution: hasProductFormFinishedResolution } =
+ select( EXPERIMENTAL_PRODUCT_FORM_STORE_NAME );
+ return {
+ isLoading: ! hasProductFormFinishedResolution( 'getProductForm' ),
+ };
+ } );
useEffect( () => {
recordEvent( 'view_new_product_management_experience' );
}, [] );
return (
= ( {
setShowAddAttributeModal( false );
} }
onAdd={ onAddNewAttributes }
- selectedAttributeIds={ ( filteredAttributes || [] ).map(
- ( attr ) => attr.id
- ) }
+ selectedAttributeIds={ [] }
/>
) }
= ( {
} ) }
onCancel={ () => setEditingAttributeId( null ) }
onEdit={ ( changedAttribute ) => {
- const newAttributesSet = [ ...hydratedAttributes ];
+ const newAttributesSet = [ ...value ];
const changedAttributeIndex: number =
newAttributesSet.findIndex( ( attr ) =>
attr.id !== 0
@@ -373,10 +282,10 @@ export const AttributeField: React.FC< AttributeFieldProps > = ( {
changedAttribute
);
- updateAttributes( newAttributesSet );
+ handleChange( newAttributesSet );
setEditingAttributeId( null );
} }
- attribute={ attribute }
+ attribute={ editingAttribute }
/>
) }
diff --git a/plugins/woocommerce-admin/client/products/fields/attribute-field/attribute-field.scss b/plugins/woocommerce-admin/client/products/fields/attribute-control/attribute-field.scss
similarity index 100%
rename from plugins/woocommerce-admin/client/products/fields/attribute-field/attribute-field.scss
rename to plugins/woocommerce-admin/client/products/fields/attribute-control/attribute-field.scss
diff --git a/plugins/woocommerce-admin/client/products/fields/attribute-field/edit-attribute-modal.scss b/plugins/woocommerce-admin/client/products/fields/attribute-control/edit-attribute-modal.scss
similarity index 100%
rename from plugins/woocommerce-admin/client/products/fields/attribute-field/edit-attribute-modal.scss
rename to plugins/woocommerce-admin/client/products/fields/attribute-control/edit-attribute-modal.scss
diff --git a/plugins/woocommerce-admin/client/products/fields/attribute-field/edit-attribute-modal.tsx b/plugins/woocommerce-admin/client/products/fields/attribute-control/edit-attribute-modal.tsx
similarity index 87%
rename from plugins/woocommerce-admin/client/products/fields/attribute-field/edit-attribute-modal.tsx
rename to plugins/woocommerce-admin/client/products/fields/attribute-control/edit-attribute-modal.tsx
index deaf03ee225..53da1cec567 100644
--- a/plugins/woocommerce-admin/client/products/fields/attribute-field/edit-attribute-modal.tsx
+++ b/plugins/woocommerce-admin/client/products/fields/attribute-control/edit-attribute-modal.tsx
@@ -18,7 +18,7 @@ import {
AttributeTermInputField,
CustomAttributeTermInputField,
} from '../attribute-term-input-field';
-import { HydratedAttributeType } from './attribute-field';
+import { EnhancedProductAttribute } from '../../hooks/use-product-attributes';
import './edit-attribute-modal.scss';
@@ -36,8 +36,8 @@ type EditAttributeModalProps = {
updateAccessibleLabel?: string;
updateLabel?: string;
onCancel: () => void;
- onEdit: ( alteredAttribute: HydratedAttributeType ) => void;
- attribute: HydratedAttributeType;
+ onEdit: ( alteredAttribute: EnhancedProductAttribute ) => void;
+ attribute: EnhancedProductAttribute;
};
export const EditAttributeModal: React.FC< EditAttributeModalProps > = ( {
@@ -64,7 +64,7 @@ export const EditAttributeModal: React.FC< EditAttributeModalProps > = ( {
attribute,
} ) => {
const [ editableAttribute, setEditableAttribute ] = useState<
- HydratedAttributeType | undefined
+ EnhancedProductAttribute | undefined
>( { ...attribute } );
const isCustomAttribute = editableAttribute?.id === 0;
@@ -84,7 +84,7 @@ export const EditAttributeModal: React.FC< EditAttributeModalProps > = ( {
}
onChange={ ( val ) =>
setEditableAttribute( {
- ...( editableAttribute as HydratedAttributeType ),
+ ...( editableAttribute as EnhancedProductAttribute ),
name: val,
} )
}
@@ -102,7 +102,7 @@ export const EditAttributeModal: React.FC< EditAttributeModalProps > = ( {
attributeId={ editableAttribute?.id }
onChange={ ( val ) => {
setEditableAttribute( {
- ...( editableAttribute as HydratedAttributeType ),
+ ...( editableAttribute as EnhancedProductAttribute ),
terms: val,
} );
} }
@@ -115,7 +115,7 @@ export const EditAttributeModal: React.FC< EditAttributeModalProps > = ( {
value={ editableAttribute?.options }
onChange={ ( val ) => {
setEditableAttribute( {
- ...( editableAttribute as HydratedAttributeType ),
+ ...( editableAttribute as EnhancedProductAttribute ),
options: val,
} );
} }
@@ -126,7 +126,7 @@ export const EditAttributeModal: React.FC< EditAttributeModalProps > = ( {
-
);
};
diff --git a/plugins/woocommerce-admin/client/products/edit-product-page.tsx b/plugins/woocommerce-admin/client/products/edit-product-page.tsx
index 6606da226db..d7e2bffc8dd 100644
--- a/plugins/woocommerce-admin/client/products/edit-product-page.tsx
+++ b/plugins/woocommerce-admin/client/products/edit-product-page.tsx
@@ -3,6 +3,7 @@
*/
import { __ } from '@wordpress/i18n';
import {
+ EXPERIMENTAL_PRODUCT_FORM_STORE_NAME,
EXPERIMENTAL_PRODUCT_VARIATIONS_STORE_NAME,
PartialProduct,
Product,
@@ -21,6 +22,7 @@ import { ProductForm } from './product-form';
import { ProductFormLayout } from './layout/product-form-layout';
import { ProductVariationForm } from './product-variation-form';
import './product-page.scss';
+import './fills';
const EditProductPage: React.FC = () => {
const { productId, variationId } = useParams();
@@ -35,6 +37,8 @@ const EditProductPage: React.FC = () => {
isPending,
getPermalinkParts,
} = select( PRODUCTS_STORE_NAME );
+ const { hasFinishedResolution: hasProductFormFinishedResolution } =
+ select( EXPERIMENTAL_PRODUCT_FORM_STORE_NAME );
const {
getProductVariation,
hasFinishedResolution: hasProductVariationFinishedResolution,
@@ -71,7 +75,8 @@ const EditProductPage: React.FC = () => {
'getProductVariation',
[ parseInt( variationId, 10 ) ]
)
- ),
+ ) ||
+ ! hasProductFormFinishedResolution( 'getProductForm' ),
isPendingAction:
isPending( 'createProduct' ) ||
isPending(
diff --git a/plugins/woocommerce-admin/client/products/fields/attribute-field/add-attribute-modal.scss b/plugins/woocommerce-admin/client/products/fields/attribute-control/add-attribute-modal.scss
similarity index 100%
rename from plugins/woocommerce-admin/client/products/fields/attribute-field/add-attribute-modal.scss
rename to plugins/woocommerce-admin/client/products/fields/attribute-control/add-attribute-modal.scss
diff --git a/plugins/woocommerce-admin/client/products/fields/attribute-field/add-attribute-modal.tsx b/plugins/woocommerce-admin/client/products/fields/attribute-control/add-attribute-modal.tsx
similarity index 94%
rename from plugins/woocommerce-admin/client/products/fields/attribute-field/add-attribute-modal.tsx
rename to plugins/woocommerce-admin/client/products/fields/attribute-control/add-attribute-modal.tsx
index cf5c61288c8..64fd69e9457 100644
--- a/plugins/woocommerce-admin/client/products/fields/attribute-field/add-attribute-modal.tsx
+++ b/plugins/woocommerce-admin/client/products/fields/attribute-control/add-attribute-modal.tsx
@@ -26,7 +26,7 @@ import {
AttributeTermInputField,
CustomAttributeTermInputField,
} from '../attribute-term-input-field';
-import { HydratedAttributeType } from '../attribute-field';
+import { EnhancedProductAttribute } from '~/products/hooks/use-product-attributes';
import { getProductAttributeObject } from './utils';
type AddAttributeModalProps = {
@@ -46,12 +46,12 @@ type AddAttributeModalProps = {
confirmCancelLabel?: string;
confirmConfirmLabel?: string;
onCancel: () => void;
- onAdd: ( newCategories: HydratedAttributeType[] ) => void;
+ onAdd: ( newCategories: EnhancedProductAttribute[] ) => void;
selectedAttributeIds?: number[];
};
type AttributeForm = {
- attributes: Array< HydratedAttributeType | null >;
+ attributes: Array< EnhancedProductAttribute | null >;
};
export const AddAttributeModal: React.FC< AddAttributeModalProps > = ( {
@@ -80,6 +80,15 @@ export const AddAttributeModal: React.FC< AddAttributeModalProps > = ( {
onAdd,
selectedAttributeIds = [],
} ) => {
+ const scrollAttributeIntoView = ( index: number ) => {
+ setTimeout( () => {
+ const attributeRow = document.querySelector(
+ `.woocommerce-add-attribute-modal__table-row-${ index }`
+ );
+ attributeRow?.scrollIntoView( { behavior: 'smooth' } );
+ }, 0 );
+ };
+
const [ showConfirmClose, setShowConfirmClose ] = useState( false );
const addAnother = (
values: AttributeForm,
@@ -89,10 +98,11 @@ export const AddAttributeModal: React.FC< AddAttributeModalProps > = ( {
) => void
) => {
setValue( 'attributes', [ ...values.attributes, null ] );
+ scrollAttributeIntoView( values.attributes.length );
};
const onAddingAttributes = ( values: AttributeForm ) => {
- const newAttributesToAdd: HydratedAttributeType[] = [];
+ const newAttributesToAdd: EnhancedProductAttribute[] = [];
values.attributes.forEach( ( attr ) => {
if (
attr !== null &&
@@ -105,7 +115,7 @@ export const AddAttributeModal: React.FC< AddAttributeModalProps > = ( {
? ( attr.terms || [] ).map( ( term ) => term.name )
: attr.options;
newAttributesToAdd.push( {
- ...( attr as HydratedAttributeType ),
+ ...( attr as EnhancedProductAttribute ),
options,
} );
}
diff --git a/plugins/woocommerce-admin/client/products/fields/attribute-field/attribute-field.tsx b/plugins/woocommerce-admin/client/products/fields/attribute-control/attribute-control.tsx
similarity index 65%
rename from plugins/woocommerce-admin/client/products/fields/attribute-field/attribute-field.tsx
rename to plugins/woocommerce-admin/client/products/fields/attribute-control/attribute-control.tsx
index 7c867af4a0d..01e03c2f89b 100644
--- a/plugins/woocommerce-admin/client/products/fields/attribute-field/attribute-field.tsx
+++ b/plugins/woocommerce-admin/client/products/fields/attribute-control/attribute-control.tsx
@@ -2,13 +2,8 @@
* External dependencies
*/
import { __, sprintf } from '@wordpress/i18n';
-import { useState, useCallback, useEffect } from '@wordpress/element';
-import {
- ProductAttribute,
- EXPERIMENTAL_PRODUCT_ATTRIBUTE_TERMS_STORE_NAME,
- ProductAttributeTerm,
-} from '@woocommerce/data';
-import { resolveSelect } from '@wordpress/data';
+import { useState } from '@wordpress/element';
+import { ProductAttribute } from '@woocommerce/data';
import {
Sortable,
__experimentalSelectControlMenuSlot as SelectControlMenuSlot,
@@ -24,42 +19,31 @@ import { getAdminLink } from '@woocommerce/settings';
import './attribute-field.scss';
import { AddAttributeModal } from './add-attribute-modal';
import { EditAttributeModal } from './edit-attribute-modal';
+import { EnhancedProductAttribute } from '~/products/hooks/use-product-attributes';
import {
getAttributeKey,
reorderSortableProductAttributePositions,
} from './utils';
-import { sift } from '../../../utils';
import { AttributeEmptyState } from '../attribute-empty-state';
import {
AddAttributeListItem,
AttributeListItem,
} from '../attribute-list-item';
-type AttributeFieldProps = {
+type AttributeControlProps = {
value: ProductAttribute[];
onChange: ( value: ProductAttribute[] ) => void;
- productId?: number;
// TODO: should we support an 'any' option to show all attributes?
attributeType?: 'regular' | 'for-variations';
};
-export type HydratedAttributeType = Omit< ProductAttribute, 'options' > & {
- options?: string[];
- terms?: ProductAttributeTerm[];
- visible?: boolean;
-};
-
-export const AttributeField: React.FC< AttributeFieldProps > = ( {
+export const AttributeControl: React.FC< AttributeControlProps > = ( {
value,
- onChange,
- productId,
attributeType = 'regular',
+ onChange,
} ) => {
const [ showAddAttributeModal, setShowAddAttributeModal ] =
useState( false );
- const [ hydratedAttributes, setHydratedAttributes ] = useState<
- HydratedAttributeType[]
- >( [] );
const [ editingAttributeId, setEditingAttributeId ] = useState<
null | string
>( null );
@@ -72,73 +56,12 @@ export const AttributeField: React.FC< AttributeFieldProps > = ( {
? 'product_add_options_modal_cancel_button_click'
: 'product_add_attributes_modal_cancel_button_click';
- const fetchTerms = useCallback(
- ( attributeId: number ) => {
- return resolveSelect(
- EXPERIMENTAL_PRODUCT_ATTRIBUTE_TERMS_STORE_NAME
- )
- .getProductAttributeTerms< ProductAttributeTerm[] >( {
- attribute_id: attributeId,
- product: productId,
- } )
- .then(
- ( attributeTerms ) => {
- return attributeTerms;
- },
- ( error ) => {
- return error;
- }
- );
- },
- [ productId ]
- );
-
- useEffect( () => {
- // I think we'll need to move the hydration out of the individual component
- // instance. To where, I do not yet know... maybe in the form context
- // somewhere so that a single hydration source can be shared between multiple
- // instances? Something like a simple key-value store in the form context
- // would be handy.
- if ( ! value || hydratedAttributes.length !== 0 ) {
- return;
- }
-
- const [ customAttributes, globalAttributes ]: ProductAttribute[][] =
- sift( value, ( attr: ProductAttribute ) => attr.id === 0 );
-
- Promise.all(
- globalAttributes.map( ( attr ) => fetchTerms( attr.id ) )
- ).then( ( allResults ) => {
- setHydratedAttributes( [
- ...globalAttributes.map( ( attr, index ) => {
- const fetchedTerms = allResults[ index ];
-
- const newAttr = {
- ...attr,
- // I'm not sure this is quite right for handling unpersisted terms,
- // but this gets things kinda working for now
- terms:
- fetchedTerms.length > 0 ? fetchedTerms : undefined,
- options:
- fetchedTerms.length === 0
- ? attr.options
- : undefined,
- };
-
- return newAttr;
- } ),
- ...customAttributes,
- ] );
- } );
- }, [ fetchTerms, hydratedAttributes, value ] );
-
const fetchAttributeId = ( attribute: { id: number; name: string } ) =>
`${ attribute.id }-${ attribute.name }`;
- const updateAttributes = ( attributes: HydratedAttributeType[] ) => {
- setHydratedAttributes( attributes );
+ const handleChange = ( newAttributes: EnhancedProductAttribute[] ) => {
onChange(
- attributes.map( ( attr ) => {
+ newAttributes.map( ( attr ) => {
return {
...attr,
options: attr.terms
@@ -157,8 +80,8 @@ export const AttributeField: React.FC< AttributeFieldProps > = ( {
recordEvent(
'product_remove_attribute_confirmation_confirm_click'
);
- updateAttributes(
- hydratedAttributes.filter(
+ handleChange(
+ value.filter(
( attr ) =>
fetchAttributeId( attr ) !==
fetchAttributeId( attribute )
@@ -169,9 +92,11 @@ export const AttributeField: React.FC< AttributeFieldProps > = ( {
}
};
- const onAddNewAttributes = ( newAttributes: HydratedAttributeType[] ) => {
- updateAttributes( [
- ...( hydratedAttributes || [] ),
+ const onAddNewAttributes = (
+ newAttributes: EnhancedProductAttribute[]
+ ) => {
+ handleChange( [
+ ...( value || [] ),
...newAttributes
.filter(
( newAttr ) =>
@@ -193,18 +118,7 @@ export const AttributeField: React.FC< AttributeFieldProps > = ( {
setShowAddAttributeModal( false );
};
- const filteredAttributes = value
- ? value.filter(
- ( attribute: ProductAttribute ) =>
- attribute.variation === isOnlyForVariations
- )
- : false;
-
- if (
- ! filteredAttributes ||
- filteredAttributes.length === 0 ||
- hydratedAttributes.length === 0
- ) {
+ if ( ! value.length ) {
return (
<>
+
+ ) : (
+ <>
+
+
+ { __( '(required)', 'woocommerce' ) }
+
+ ),
+ },
+ } ) }
+ name={ `${ PRODUCT_DETAILS_SLUG }-name` }
+ placeholder={ __( 'e.g. 12 oz Coffee Mug', 'woocommerce' ) }
+ { ...getInputProps( 'name', {
+ onBlur: setSkuIfEmpty,
+ } ) }
+ />
+ { values.id && ! hasNameError() && permalinkPrefix && (
+
+ { __( 'Product link', 'woocommerce' ) }
+ :
+
+ { permalinkPrefix }
+ { values.slug || cleanForSlug( values.name ) }
+ { permalinkSuffix }
+
+
+
+ ) }
+ { showProductLinkEditModal && (
+ setShowProductLinkEditModal( false ) }
+ onSaved={ () => setShowProductLinkEditModal( false ) }
+ />
+ ) }
+
+ );
+};
diff --git a/plugins/woocommerce-admin/client/products/fills/details-section/details-field-summary.tsx b/plugins/woocommerce-admin/client/products/fills/details-section/details-field-summary.tsx
new file mode 100644
index 00000000000..aa1304e5d36
--- /dev/null
+++ b/plugins/woocommerce-admin/client/products/fills/details-section/details-field-summary.tsx
@@ -0,0 +1,36 @@
+/**
+ * External dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import {
+ useFormContext,
+ __experimentalRichTextEditor as RichTextEditor,
+} from '@woocommerce/components';
+import { Product } from '@woocommerce/data';
+import { BlockInstance, serialize, parse } from '@wordpress/blocks';
+import { useState } from '@wordpress/element';
+
+export const DetailsSummaryField = () => {
+ const { setValue, values } = useFormContext< Product >();
+ const [ summaryBlocks, setSummaryBlocks ] = useState< BlockInstance[] >(
+ parse( values.short_description || '' )
+ );
+
+ return (
+ 0,
+ } ) }
+ >
+ {
+ const { id: imageId, dataset } =
+ event.target as HTMLElement;
+ if ( imageId ) {
+ setDraggedImageId( parseInt( imageId, 10 ) );
+ } else {
+ const index = dataset?.index;
+ if ( index ) {
+ setDraggedImageId(
+ images[ parseInt( index, 10 ) ]?.id
+ );
+ }
+ }
+ toggleRemoveZone();
+ } }
+ onDragEnd={ () => {
+ if ( isRemoving && draggedImageId ) {
+ recordEvent(
+ 'product_images_remove_image_button_click'
+ );
+ setValue(
+ 'images',
+ images.filter(
+ ( img ) => img.id !== draggedImageId
+ )
+ );
+ setIsRemoving( false );
+ setDraggedImageId( null );
+ }
+ toggleRemoveZone();
+ } }
+ onOrderChange={ orderImages }
+ onReplace={ ( { replaceIndex, media } ) => {
+ if (
+ images.find( ( img ) => media.id === img.id ) ===
+ undefined
+ ) {
+ images[ replaceIndex ] = media as Image;
+ recordEvent(
+ 'product_images_replace_image_button_click'
+ );
+ setValue( 'images', images );
+ }
+ } }
+ onSelectAsCover={ () =>
+ recordEvent(
+ 'product_images_select_image_as_cover_button_click'
+ )
+ }
+ >
+ { images.map( ( image ) => (
+
+
+ );
+};
diff --git a/plugins/woocommerce-admin/client/products/fills/images-section/images-section-fills.tsx b/plugins/woocommerce-admin/client/products/fills/images-section/images-section-fills.tsx
new file mode 100644
index 00000000000..01b735d0627
--- /dev/null
+++ b/plugins/woocommerce-admin/client/products/fills/images-section/images-section-fills.tsx
@@ -0,0 +1,74 @@
+/**
+ * External dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import {
+ __experimentalWooProductSectionItem as WooProductSectionItem,
+ __experimentalWooProductFieldItem as WooProductFieldItem,
+ __experimentalProductFieldSection as ProductFieldSection,
+ Link,
+} from '@woocommerce/components';
+import { registerPlugin } from '@wordpress/plugins';
+import { recordEvent } from '@woocommerce/tracks';
+
+/**
+ * Internal dependencies
+ */
+import { ImagesGalleryField } from './index';
+import { IMAGES_SECTION_ID, TAB_GENERAL_ID, PLUGIN_ID } from '../constants';
+
+import './images-section.scss';
+
+const ImagesSection = () => (
+ <>
+
+ { isRemovingZoneVisible ? (
+
+
+ ) : (
+
+ null }
+ onFileUploadChange={ onFileUpload }
+ onSelect={ ( files ) => {
+ const newImages = files.filter(
+ ( img: Image ) =>
+ ! images.find(
+ ( image ) => image.id === img.id
+ )
+ );
+ if ( newImages.length > 0 ) {
+ recordEvent(
+ 'product_images_add_via_media_library'
+ );
+ setValue( 'images', [
+ ...images,
+ ...newImages,
+ ] );
+ }
+ } }
+ onUpload={ ( files ) => {
+ if ( files[ 0 ].id ) {
+ recordEvent(
+ 'product_images_add_via_drag_and_drop_upload'
+ );
+ setValue( 'images', [
+ ...images,
+ ...files,
+ ] );
+ }
+ } }
+ label={
+ <>
+ 
+
+ { __(
+ 'Drag images here or click to upload',
+ 'woocommerce'
+ ) }
+
+
+ }
+ />
+
+ ) }
+
+
+
+ setIsRemoving( true ) }
+ onDrop={ () => setIsRemoving( true ) }
+ label={ __(
+ 'Drop here to remove',
+ 'woocommerce'
+ ) }
+ />
+
+
- { isRemovingZoneVisible ? (
-
-
- ) : (
-
- null }
- onFileUploadChange={ onFileUpload }
- onSelect={ ( files ) => {
- const newImages = files.filter(
- ( img: Image ) =>
- ! images.find(
- ( image ) =>
- image.id === img.id
- )
- );
- if ( newImages.length > 0 ) {
- recordEvent(
- 'product_images_add_via_media_library'
- );
- setValue( 'images', [
- ...images,
- ...newImages,
- ] );
- }
- } }
- onUpload={ ( files ) => {
- if ( files[ 0 ].id ) {
- recordEvent(
- 'product_images_add_via_drag_and_drop_upload'
- );
- setValue( 'images', [
- ...images,
- ...files,
- ] );
- }
- } }
- label={
- <>
-
-
- { __(
- 'Drag images here or click to upload',
- 'woocommerce'
- ) }
-
-
- }
- />
-
- ) }
-
-
-
-
- setIsRemoving( true )
- }
- onDrop={ () => setIsRemoving( true ) }
- label={ __(
- 'Drop here to remove',
- 'woocommerce'
- ) }
- />
-
-
-
- { __(
- '(required)',
- 'woocommerce'
- ) }
-
- ),
- },
- } ) }
- name={ `${ PRODUCT_DETAILS_SLUG }-name` }
- placeholder={ __(
- 'e.g. 12 oz Coffee Mug',
- 'woocommerce'
- ) }
- { ...getInputProps( 'name', {
- onBlur: setSkuIfEmpty,
- } ) }
- />
- { values.id && ! hasNameError() && permalinkPrefix && (
-
- { __( 'Product link', 'woocommerce' ) }
- :
-
- { permalinkPrefix }
- { values.slug ||
- cleanForSlug( values.name ) }
- { permalinkSuffix }
-
-
-
- ) }
-
-
+
+
+
+
+ + { __( + 'Let us show you how to navigate the form and create this product from start to finish in no time.', + 'woocommerce' + ) } +
+
+
+
+
+
+
+ );
+};
diff --git a/plugins/woocommerce-admin/client/task-lists/progress-header/progress-header.tsx b/plugins/woocommerce-admin/client/task-lists/progress-header/progress-header.tsx
index e68a7e240ea..e7fadef3fcb 100644
--- a/plugins/woocommerce-admin/client/task-lists/progress-header/progress-header.tsx
+++ b/plugins/woocommerce-admin/client/task-lists/progress-header/progress-header.tsx
@@ -1,72 +1,29 @@
/**
* External dependencies
*/
-import { __, sprintf } from '@wordpress/i18n';
-import { useSelect } from '@wordpress/data';
-import { getVisibleTasks, ONBOARDING_STORE_NAME } from '@woocommerce/data';
+import { useSlot } from '@woocommerce/experimental';
/**
* Internal dependencies
*/
import './progress-header.scss';
-import { TaskListMenu } from '~/tasks/task-list-menu';
+import {
+ WC_TASKLIST_EXPERIMENTAL_PROGRESS_HEADER_SLOT_NAME,
+ WooTaskListProgressHeaderItem,
+} from './utils';
+import {
+ DefaultProgressHeader,
+ DefaultProgressHeaderProps,
+} from './default-progress-header';
-type ProgressHeaderProps = {
- taskListId: string;
-};
-
-export const ProgressHeader: React.FC< ProgressHeaderProps > = ( {
+export const ProgressHeader: React.FC< DefaultProgressHeaderProps > = ( {
taskListId,
} ) => {
- const { loading, tasksCount, completedCount } = useSelect( ( select ) => {
- const taskList = select( ONBOARDING_STORE_NAME ).getTaskList(
- taskListId
- );
- const finishedResolution = select(
- ONBOARDING_STORE_NAME
- ).hasFinishedResolution( 'getTaskList', [ taskListId ] );
- const visibleTasks = getVisibleTasks( taskList?.tasks || [] );
+ const slot = useSlot( WC_TASKLIST_EXPERIMENTAL_PROGRESS_HEADER_SLOT_NAME );
- return {
- loading: ! finishedResolution,
- tasksCount: visibleTasks?.length,
- completedCount: visibleTasks?.filter( ( task ) => task.isComplete )
- .length,
- };
- } );
-
- if ( loading ) {
- return null;
- }
-
- return (
-
+ { completedCount !== tasksCount ? (
+ <>
+
+ + { sprintf( + /* translators: 1: completed tasks, 2: total tasks */ + __( + 'Follow these steps to start selling quickly. %1$d out of %2$d complete.', + 'woocommerce' + ), + completedCount, + tasksCount + ) } +
+ + + ) : null } +
-
+ return Boolean( slot?.fills?.length ) ? (
+
- { completedCount !== tasksCount ? (
- <>
-
- - { sprintf( - /* translators: 1: completed tasks, 2: total tasks */ - __( - 'Follow these steps to start selling quickly. %1$d out of %2$d complete.', - 'woocommerce' - ), - completedCount, - tasksCount - ) } -
- - - ) : null } -{ title }
+ ); +}; diff --git a/plugins/woocommerce-admin/client/task-lists/progress-title/progress-title.tsx b/plugins/woocommerce-admin/client/task-lists/progress-title/progress-title.tsx index bad9271c4fc..96d4588ed1d 100644 --- a/plugins/woocommerce-admin/client/task-lists/progress-title/progress-title.tsx +++ b/plugins/woocommerce-admin/client/task-lists/progress-title/progress-title.tsx @@ -1,69 +1,29 @@ /** * External dependencies */ -import { __, sprintf } from '@wordpress/i18n'; -import { useMemo } from '@wordpress/element'; -import { useSelect } from '@wordpress/data'; -import { getVisibleTasks, ONBOARDING_STORE_NAME } from '@woocommerce/data'; -import { getSetting } from '@woocommerce/settings'; +import { useSlot } from '@woocommerce/experimental'; -type ProgressTitleProps = { - taskListId: string; -}; +/** + * Internal dependencies + */ +import { + WC_TASKLIST_EXPERIMENTAL_PROGRESS_TITLE_SLOT_NAME, + WooTaskListProgressTitleItem, +} from './utils'; -export const ProgressTitle: React.FC< ProgressTitleProps > = ( { +import { + DefaultProgressTitle, + DefaultProgressTitleProps, +} from './default-progress-title'; + +export const ProgressTitle: React.FC< DefaultProgressTitleProps > = ( { taskListId, } ) => { - const { loading, tasksCount, completedCount, hasVisitedTasks } = useSelect( - ( select ) => { - const taskList = select( ONBOARDING_STORE_NAME ).getTaskList( - taskListId - ); - const finishedResolution = select( - ONBOARDING_STORE_NAME - ).hasFinishedResolution( 'getTaskList', [ taskListId ] ); - const visibleTasks = getVisibleTasks( taskList?.tasks || [] ); + const slot = useSlot( WC_TASKLIST_EXPERIMENTAL_PROGRESS_TITLE_SLOT_NAME ); - return { - loading: ! finishedResolution, - tasksCount: visibleTasks?.length, - completedCount: visibleTasks?.filter( - ( task ) => task.isComplete - ).length, - hasVisitedTasks: - visibleTasks?.filter( - ( task ) => - task.isVisited && task.id !== 'store_details' - ).length > 0, - }; - } - ); - - const title = useMemo( () => { - if ( ! hasVisitedTasks || completedCount === tasksCount ) { - const siteTitle = getSetting( 'siteTitle' ); - return siteTitle - ? sprintf( - /* translators: %s = site title */ - __( 'Welcome to %s', 'woocommerce' ), - siteTitle - ) - : __( 'Welcome to your store', 'woocommerce' ); - } - if ( completedCount > 0 && completedCount < 4 ) { - return __( "Let's get you started", 'woocommerce' ) + ' 🚀'; - } - if ( completedCount > 3 && completedCount < 6 ) { - return __( 'You are on the right track', 'woocommerce' ); - } - return __( 'You are almost there', 'woocommerce' ); - }, [ completedCount, hasVisitedTasks, tasksCount ] ); - - if ( loading ) { - return null; - } - - return ( -{ title }
+ return Boolean( slot?.fills?.length ) ? ( +%s
', + esc_html__( 'PHP version requirements will change soon', 'woocommerce' ) + ), + sprintf( + // translators: Placeholder is a URL. + wpautop( wp_kses_data( __( 'WooCommerce 7.7, scheduled for May 2023, will require PHP 7.3 or newer to work. Your server is currently running an older version of PHP, so this change will impact your store. Upgrading to at least PHP 8.0 is recommended. Learn more about this change.', 'woocommerce' ) ) ), + 'https://developer.woocommerce.com/2023/01/10/new-requirement-for-woocommerce-7-7-php-7-3/' + ) + ) + ); + } + + /** + * Remove the admin notice about the bump of the required PHP version in WooCommerce 7.7 + * if the current PHP version is good. + * + * TODO: Remove this method in WooCommerce 7.7. + */ + private static function maybe_remove_php73_required_notice() { + if ( version_compare( phpversion(), '7.3', '>=' ) && self::has_notice( 'php73_required_in_woo_77' ) ) { + self::remove_notice( 'php73_required_in_woo_77' ); + } + } + + // phpcs:enable Generic.Commenting.Todo.TaskFound + /** * Show a notice. * diff --git a/plugins/woocommerce/includes/admin/class-wc-admin-post-types.php b/plugins/woocommerce/includes/admin/class-wc-admin-post-types.php index 5680eec7f88..817530fe0e2 100644 --- a/plugins/woocommerce/includes/admin/class-wc-admin-post-types.php +++ b/plugins/woocommerce/includes/admin/class-wc-admin-post-types.php @@ -41,6 +41,7 @@ class WC_Admin_Post_Types { // Admin notices. add_filter( 'post_updated_messages', array( $this, 'post_updated_messages' ) ); + add_filter( 'woocommerce_order_updated_messages', array( $this, 'order_updated_messages' ) ); add_filter( 'bulk_post_updated_messages', array( $this, 'bulk_post_updated_messages' ), 10, 2 ); // Disable Auto Save. @@ -145,24 +146,7 @@ class WC_Admin_Post_Types { 10 => sprintf( __( 'Product draft updated. Preview product', 'woocommerce' ), esc_url( add_query_arg( 'preview', 'true', get_permalink( $post->ID ) ) ) ), ); - $messages['shop_order'] = array( - 0 => '', // Unused. Messages start at index 1. - 1 => __( 'Order updated.', 'woocommerce' ), - 2 => __( 'Custom field updated.', 'woocommerce' ), - 3 => __( 'Custom field deleted.', 'woocommerce' ), - 4 => __( 'Order updated.', 'woocommerce' ), - 5 => __( 'Revision restored.', 'woocommerce' ), - 6 => __( 'Order updated.', 'woocommerce' ), - 7 => __( 'Order saved.', 'woocommerce' ), - 8 => __( 'Order submitted.', 'woocommerce' ), - 9 => sprintf( - /* translators: %s: date */ - __( 'Order scheduled for: %s.', 'woocommerce' ), - '' . date_i18n( __( 'M j, Y @ G:i', 'woocommerce' ), strtotime( $post->post_date ) ) . '' - ), - 10 => __( 'Order draft updated.', 'woocommerce' ), - 11 => __( 'Order updated and sent.', 'woocommerce' ), - ); + $messages = $this->order_updated_messages( $messages ); $messages['shop_coupon'] = array( 0 => '', // Unused. Messages start at index 1. @@ -185,6 +169,46 @@ class WC_Admin_Post_Types { return $messages; } + /** + * Add messages when an order is updated. + * + * @param array $messages Array of messages. + * + * @return array + */ + public function order_updated_messages( array $messages ) { + global $post, $theorder; + + if ( ! isset( $theorder ) || ! $theorder instanceof WC_Abstract_Order ) { + if ( ! isset( $post ) || 'shop_order' !== $post->post_type ) { + return $messages; + } else { + \Automattic\WooCommerce\Utilities\OrderUtil::init_theorder_object( $post ); + } + } + + $messages['shop_order'] = array( + 0 => '', // Unused. Messages start at index 1. + 1 => __( 'Order updated.', 'woocommerce' ), + 2 => __( 'Custom field updated.', 'woocommerce' ), + 3 => __( 'Custom field deleted.', 'woocommerce' ), + 4 => __( 'Order updated.', 'woocommerce' ), + 5 => __( 'Revision restored.', 'woocommerce' ), + 6 => __( 'Order updated.', 'woocommerce' ), + 7 => __( 'Order saved.', 'woocommerce' ), + 8 => __( 'Order submitted.', 'woocommerce' ), + 9 => sprintf( + /* translators: %s: date */ + __( 'Order scheduled for: %s.', 'woocommerce' ), + '' . date_i18n( __( 'M j, Y @ G:i', 'woocommerce' ), strtotime( $theorder->get_date_created() ) ) . '' + ), + 10 => __( 'Order draft updated.', 'woocommerce' ), + 11 => __( 'Order updated and sent.', 'woocommerce' ), + ); + + return $messages; + } + /** * Specify custom bulk actions messages for different post types. * diff --git a/plugins/woocommerce/includes/admin/settings/class-wc-settings-emails.php b/plugins/woocommerce/includes/admin/settings/class-wc-settings-emails.php index 9086d7fd8b8..36705f13c50 100644 --- a/plugins/woocommerce/includes/admin/settings/class-wc-settings-emails.php +++ b/plugins/woocommerce/includes/admin/settings/class-wc-settings-emails.php @@ -120,7 +120,7 @@ class WC_Settings_Emails extends WC_Settings_Page { array( 'title' => __( 'Header image', 'woocommerce' ), - 'desc' => __( 'URL to an image you want to show in the email header. Upload images using the media uploader (Admin > Media).', 'woocommerce' ), + 'desc' => __( 'Paste the URL of an image you want to show in the email header. Upload images using the media uploader (Media > Add New).', 'woocommerce' ), 'id' => 'woocommerce_email_header_image', 'type' => 'text', 'css' => 'min-width:400px;', diff --git a/plugins/woocommerce/includes/admin/settings/class-wc-settings-payment-gateways.php b/plugins/woocommerce/includes/admin/settings/class-wc-settings-payment-gateways.php index a519ce26148..809057cc6f3 100644 --- a/plugins/woocommerce/includes/admin/settings/class-wc-settings-payment-gateways.php +++ b/plugins/woocommerce/includes/admin/settings/class-wc-settings-payment-gateways.php @@ -267,7 +267,7 @@ class WC_Settings_Payment_Gateways extends WC_Settings_Page { foreach ( $plugin_suggestions as $plugin_suggestion ) { $alt = str_replace( '.png', '', basename( $plugin_suggestion->image_72x72 ) ); // phpcs:ignore - echo "
+ type=""
+
id=""
class=""
name=""
@@ -49,7 +45,7 @@ if ( $max_value && $min_value === $max_value ) {
size="4"
min=""
max=""
-
+
step=""
placeholder=""
inputmode=""
diff --git a/plugins/woocommerce/tests/Tools/CodeHacking/Hacks/FunctionsMockerHack.php b/plugins/woocommerce/tests/Tools/CodeHacking/Hacks/FunctionsMockerHack.php
index 91f6b3e535a..cf3fc83c6ab 100644
--- a/plugins/woocommerce/tests/Tools/CodeHacking/Hacks/FunctionsMockerHack.php
+++ b/plugins/woocommerce/tests/Tools/CodeHacking/Hacks/FunctionsMockerHack.php
@@ -35,6 +35,13 @@ use ReflectionClass;
* executed inside tests (and thus the above example won't stack-overflow).
*/
final class FunctionsMockerHack extends CodeHack {
+ /**
+ * An array containing the names of the functions that will become mockable.
+ *
+ * @var array
+ */
+ private $mockable_functions;
+
/**
* Tokens that precede a non-standalone-function identifier.
*
diff --git a/plugins/woocommerce/tests/Tools/CodeHacking/Hacks/StaticMockerHack.php b/plugins/woocommerce/tests/Tools/CodeHacking/Hacks/StaticMockerHack.php
index 61fd4a68d90..65b5b334aca 100644
--- a/plugins/woocommerce/tests/Tools/CodeHacking/Hacks/StaticMockerHack.php
+++ b/plugins/woocommerce/tests/Tools/CodeHacking/Hacks/StaticMockerHack.php
@@ -35,6 +35,12 @@ namespace Automattic\WooCommerce\Testing\Tools\CodeHacking\Hacks;
* executed inside tests (and thus the above example won't stack-overflow).
*/
final class StaticMockerHack extends CodeHack {
+ /**
+ * An associative array of class name => array of class methods.
+ *
+ * @var array
+ */
+ private $mockable_classes;
/**
* @var StaticMockerHack Holds the only existing instance of the class.
diff --git a/plugins/woocommerce/tests/api-core-tests/tests/settings/settings-crud.test.js b/plugins/woocommerce/tests/api-core-tests/tests/settings/settings-crud.test.js
index fd643ad419f..d706dbab89e 100644
--- a/plugins/woocommerce/tests/api-core-tests/tests/settings/settings-crud.test.js
+++ b/plugins/woocommerce/tests/api-core-tests/tests/settings/settings-crud.test.js
@@ -1368,10 +1368,10 @@ test.describe('Settings API tests: CRUD', () => {
expect.objectContaining({
"id": "woocommerce_email_header_image",
"label": "Header image",
- "description": "URL to an image you want to show in the email header. Upload images using the media uploader (Admin > Media).",
+ "description": "Paste the URL of an image you want to show in the email header. Upload images using the media uploader (Media > Add New).",
"type": "text",
"default": "",
- "tip": "URL to an image you want to show in the email header. Upload images using the media uploader (Admin > Media).",
+ "tip": "Paste the URL of an image you want to show in the email header. Upload images using the media uploader (Media > Add New).",
"value": "",
})
]));
diff --git a/plugins/woocommerce/tests/legacy/unit-tests/order/class-wc-tests-order-functions.php b/plugins/woocommerce/tests/legacy/unit-tests/order/class-wc-tests-order-functions.php
index eb110323302..4df224a5e58 100644
--- a/plugins/woocommerce/tests/legacy/unit-tests/order/class-wc-tests-order-functions.php
+++ b/plugins/woocommerce/tests/legacy/unit-tests/order/class-wc-tests-order-functions.php
@@ -162,6 +162,12 @@ class WC_Tests_Order_Functions extends WC_Unit_Test_Case {
* @group test
*/
public function test_wc_get_order() {
+ global $post;
+ global $theorder;
+
+ // phpcs:disable WordPress.WP.GlobalVariablesOverride.Prohibited
+ $original_post = $post;
+ $original_theorder = $theorder;
$order = WC_Helper_Order::create_order();
@@ -178,11 +184,30 @@ class WC_Tests_Order_Functions extends WC_Unit_Test_Case {
$post = $this->factory->post->create_and_get( array( 'post_type' => 'post' ) );
$this->assertFalse( wc_get_order( $post->ID ) );
+ // Assert the return when $the_order args is a random (incorrect) id.
+ $this->assertFalse( wc_get_order( 123456 ) );
+
// Assert the return when $the_order args is false.
$this->assertFalse( wc_get_order( false ) );
- // Assert the return when $the_order args is a random (incorrect) id.
- $this->assertFalse( wc_get_order( 123456 ) );
+ $post = get_post( $order->get_id() );
+ $this->assertInstanceOf(
+ 'WC_Order',
+ wc_get_order(),
+ 'If no order ID is specified, wc_get_order() will use the global $post object to try and determine the current order.'
+ );
+
+ unset( $post );
+ $theorder = $order;
+ $this->assertInstanceOf(
+ 'WC_Order',
+ wc_get_order(),
+ 'If no order ID is specified, wc_get_order() will use the global $theorder object to try and determine the current order.'
+ );
+
+ $post = $original_post;
+ $theorder = $original_theorder;
+ // phpcs:enable WordPress.WP.GlobalVariablesOverride.Prohibited
}
/**
diff --git a/plugins/woocommerce/tests/legacy/unit-tests/rest-api/Tests/Version3/products.php b/plugins/woocommerce/tests/legacy/unit-tests/rest-api/Tests/Version3/products.php
index dd78f483623..552a54c4f75 100644
--- a/plugins/woocommerce/tests/legacy/unit-tests/rest-api/Tests/Version3/products.php
+++ b/plugins/woocommerce/tests/legacy/unit-tests/rest-api/Tests/Version3/products.php
@@ -646,7 +646,7 @@ class WC_Tests_API_Product extends WC_REST_Unit_Test_Case {
$response = $this->server->dispatch( $request );
$data = $response->get_data();
$properties = $data['schema']['properties'];
- $this->assertEquals( 67, count( $properties ) );
+ $this->assertEquals( 69, count( $properties ) );
}
/**
diff --git a/plugins/woocommerce/tests/php/includes/admin/class-wc-admin-dashboard-setup-test.php b/plugins/woocommerce/tests/php/includes/admin/class-wc-admin-dashboard-setup-test.php
index 1ef4c8c4ae6..637f4cdeaf5 100644
--- a/plugins/woocommerce/tests/php/includes/admin/class-wc-admin-dashboard-setup-test.php
+++ b/plugins/woocommerce/tests/php/includes/admin/class-wc-admin-dashboard-setup-test.php
@@ -165,7 +165,7 @@ class WC_Admin_Dashboard_Setup_Test extends WC_Unit_Test_Case {
);
foreach ( $required_strings as $required_string ) {
- $this->assertRegexp( "/${required_string}/", $html );
+ $this->assertRegexp( "/{$required_string}/", $html );
}
}
@@ -191,7 +191,7 @@ class WC_Admin_Dashboard_Setup_Test extends WC_Unit_Test_Case {
if ( $completed_tasks_count === $tasks_count ) {
$this->assertEmpty( $this->get_widget_output() );
} else {
- $this->assertRegexp( "/Step ${step_number} of 6/", $this->get_widget_output() );
+ $this->assertRegexp( "/Step {$step_number} of 6/", $this->get_widget_output() );
}
}
}
diff --git a/plugins/woocommerce/tests/php/includes/settings/class-wc-settings-example.php b/plugins/woocommerce/tests/php/includes/settings/class-wc-settings-example.php
index 49a0bfbf965..a685a6f514c 100644
--- a/plugins/woocommerce/tests/php/includes/settings/class-wc-settings-example.php
+++ b/plugins/woocommerce/tests/php/includes/settings/class-wc-settings-example.php
@@ -26,7 +26,7 @@ class WC_Settings_Example extends WC_Settings_Page {
}
protected function get_settings_for_section_core( $section_id ) {
- return array( "${section_id}_key" => "${section_id}_value" );
+ return array( "{$section_id}_key" => "{$section_id}_value" );
}
protected function get_own_sections() {
diff --git a/plugins/woocommerce/tests/php/src/Internal/Traits/AccessiblePrivateMethodsTest.php b/plugins/woocommerce/tests/php/src/Internal/Traits/AccessiblePrivateMethodsTest.php
index 32a14ea7297..31679b6ac25 100644
--- a/plugins/woocommerce/tests/php/src/Internal/Traits/AccessiblePrivateMethodsTest.php
+++ b/plugins/woocommerce/tests/php/src/Internal/Traits/AccessiblePrivateMethodsTest.php
@@ -419,8 +419,8 @@ class AccessiblePrivateMethodsTest extends \WC_Unit_Test_Case {
use AccessiblePrivateMethods;
};
- $method_name = "add_${action_or_filter}";
- $proper_method_name = "add_static_${action_or_filter}";
+ $method_name = "add_{$action_or_filter}";
+ $proper_method_name = "add_static_{$action_or_filter}";
$this->expectException( \Error::class );
$this->expectExceptionMessage( get_class( $sut ) . '::' . "$method_name can't be called statically, did you mean '$proper_method_name'?" );
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index dbcbbc7aa92..f69f4a8dfa2 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1862,6 +1862,7 @@ importers:
tools/cli-core:
specifiers:
'@tsconfig/node16': ^1.0.3
+ '@types/uuid': ^9.0.0
chalk: ^4.1.2
dotenv: ^10.0.0
ora: ^5.4.1
@@ -1874,10 +1875,11 @@ importers:
dotenv: 10.0.0
ora: 5.4.1
simple-git: 3.14.0
- ts-node: 10.9.1_suuodkax7fygvcgfx5vhk45yei
+ ts-node: 10.9.1_vqcafhj4xvr2nzknlrdklk55zm
uuid: 8.3.2
devDependencies:
'@tsconfig/node16': 1.0.3
+ '@types/uuid': 9.0.0
typescript: 4.8.4
tools/code-analyzer:
@@ -1996,7 +1998,12 @@ importers:
'@commander-js/extra-typings': ^0.1.0
'@octokit/rest': ^19.0.4
'@tsconfig/node16': ^1.0.3
+ '@types/ejs': ^3.1.1
'@types/express': ^4.17.13
+ '@types/lodash.shuffle': ^4.2.7
+ '@types/node': ^18.11.18
+ '@types/node-fetch': ^2.6.2
+ '@types/semver': ^7.3.10
cli-core: workspace:*
code-analyzer: workspace:*
commander: 9.4.0
@@ -2024,10 +2031,15 @@ importers:
node-fetch: 2.6.7
open: 8.4.0
semver: 7.3.7
- ts-node: 10.9.1_suuodkax7fygvcgfx5vhk45yei
+ ts-node: 10.9.1_vqcafhj4xvr2nzknlrdklk55zm
devDependencies:
'@tsconfig/node16': 1.0.3
+ '@types/ejs': 3.1.1
'@types/express': 4.17.14
+ '@types/lodash.shuffle': 4.2.7
+ '@types/node': 18.11.18
+ '@types/node-fetch': 2.6.2
+ '@types/semver': 7.3.12
typescript: 4.8.4
tools/storybook:
@@ -2108,7 +2120,7 @@ importers:
express: 4.18.1
ora: 5.4.1
semver: 7.3.7
- ts-node: 10.9.1_suuodkax7fygvcgfx5vhk45yei
+ ts-node: 10.9.1_vqcafhj4xvr2nzknlrdklk55zm
devDependencies:
'@tsconfig/node16': 1.0.3
'@types/express': 4.17.14
@@ -3347,7 +3359,7 @@ packages:
dependencies:
'@babel/core': 7.12.9
'@babel/helper-create-class-features-plugin': 7.17.6_@babel+core@7.12.9
- '@babel/helper-plugin-utils': 7.19.0
+ '@babel/helper-plugin-utils': 7.18.9
transitivePeerDependencies:
- supports-color
dev: true
@@ -3360,7 +3372,7 @@ packages:
dependencies:
'@babel/core': 7.16.12
'@babel/helper-create-class-features-plugin': 7.17.6_@babel+core@7.16.12
- '@babel/helper-plugin-utils': 7.19.0
+ '@babel/helper-plugin-utils': 7.18.9
transitivePeerDependencies:
- supports-color
dev: false
@@ -6320,9 +6332,9 @@ packages:
'@babel/core': ^7.0.0-0
dependencies:
'@babel/core': 7.16.12
- '@babel/helper-module-imports': 7.18.6
- '@babel/helper-plugin-utils': 7.19.0
- babel-plugin-polyfill-corejs2: 0.3.3_@babel+core@7.16.12
+ '@babel/helper-module-imports': 7.16.0
+ '@babel/helper-plugin-utils': 7.14.5
+ babel-plugin-polyfill-corejs2: 0.3.0_@babel+core@7.16.12
babel-plugin-polyfill-corejs3: 0.4.0_@babel+core@7.16.12
babel-plugin-polyfill-regenerator: 0.3.0_@babel+core@7.16.12
semver: 6.3.0
@@ -6337,9 +6349,9 @@ packages:
'@babel/core': ^7.0.0-0
dependencies:
'@babel/core': 7.17.8
- '@babel/helper-module-imports': 7.18.6
- '@babel/helper-plugin-utils': 7.19.0
- babel-plugin-polyfill-corejs2: 0.3.3_@babel+core@7.17.8
+ '@babel/helper-module-imports': 7.16.0
+ '@babel/helper-plugin-utils': 7.14.5
+ babel-plugin-polyfill-corejs2: 0.3.0_@babel+core@7.17.8
babel-plugin-polyfill-corejs3: 0.4.0_@babel+core@7.17.8
babel-plugin-polyfill-regenerator: 0.3.0_@babel+core@7.17.8
semver: 6.3.0
@@ -7251,8 +7263,8 @@ packages:
'@babel/core': ^7.0.0-0
dependencies:
'@babel/core': 7.16.12
- '@babel/helper-plugin-utils': 7.19.0
- '@babel/helper-validator-option': 7.18.6
+ '@babel/helper-plugin-utils': 7.18.9
+ '@babel/helper-validator-option': 7.16.7
'@babel/plugin-transform-typescript': 7.16.8_@babel+core@7.16.12
transitivePeerDependencies:
- supports-color
@@ -8043,7 +8055,7 @@ packages:
engines: {node: '>= 10.14.2'}
dependencies:
'@jest/types': 26.6.2
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
chalk: 4.1.2
jest-message-util: 26.6.2
jest-util: 26.6.2
@@ -9789,7 +9801,7 @@ packages:
resolution: {integrity: sha512-OkIJpiU2fz6HOJujhlhfIGrc8hB4ibqtf7nnbJQDerG0BqwZCfmgtK5sWzZ0TkXVRBKD5MpLrTmCYyMxoMCgPw==}
engines: {node: '>= 8.9.0', npm: '>= 5.5.1'}
dependencies:
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
dev: false
/@slack/logger/3.0.0:
@@ -9816,7 +9828,7 @@ packages:
'@slack/logger': 2.0.0
'@slack/types': 1.10.0
'@types/is-stream': 1.1.0
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
axios: 0.21.4
eventemitter3: 3.1.2
form-data: 2.5.1
@@ -13118,7 +13130,7 @@ packages:
resolution: {integrity: sha512-ALYone6pm6QmwZoAgeyNksccT9Q4AWZQ6PvfwR37GT6r6FWUPguq6sUmNGSMV2Wr761oQoBxwGGa6DR5o1DC9g==}
dependencies:
'@types/connect': 3.4.35
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
dev: true
/@types/cacheable-request/6.0.2:
@@ -13151,7 +13163,7 @@ packages:
/@types/connect/3.4.35:
resolution: {integrity: sha512-cdeYyv4KWoEgpBISTxWvqYsVy444DOqehiF3fM3ne10AmJ62RSyNkUnxMJXHQWRQQX2eR94m5y1IZyDwBjV9FQ==}
dependencies:
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
dev: true
/@types/cookie/0.4.1:
@@ -13180,6 +13192,10 @@ packages:
'@types/trusted-types': 2.0.2
dev: true
+ /@types/ejs/3.1.1:
+ resolution: {integrity: sha512-RQul5wEfY7BjWm0sYY86cmUN/pcXWGyVxWX93DFFJvcrxax5zKlieLwA3T77xJGwNcZW0YW6CYG70p1m8xPFmA==}
+ dev: true
+
/@types/eslint-scope/3.7.3:
resolution: {integrity: sha512-PB3ldyrcnAicT35TWPs5IcwKD8S333HMaa2VVv4+wdvebJkjWuW/xESoB8IwRcog8HYVYamb1g/R31Qv5Bx03g==}
dependencies:
@@ -13209,7 +13225,7 @@ packages:
/@types/express-serve-static-core/4.17.31:
resolution: {integrity: sha512-DxMhY+NAsTwMMFHBTtJFNp5qiHKJ7TeqOo23zVEM9alT1Ml27Q3xcTH0xwxn7Q0BbMcVEJOs/7aQtUWupUQN3Q==}
dependencies:
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
'@types/qs': 6.9.7
'@types/range-parser': 1.2.4
dev: true
@@ -13227,7 +13243,7 @@ packages:
resolution: {integrity: sha512-ZUxbzKl0IfJILTS6t7ip5fQQM/J3TJYubDm3nMbgubNNYS62eXeUpoLUC8/7fJNiFYHTrGPQn7hspDUzIHX3UA==}
dependencies:
'@types/minimatch': 3.0.5
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
dev: true
/@types/graceful-fs/4.1.5:
@@ -13312,6 +13328,12 @@ packages:
dependencies:
'@types/node': 17.0.21
+ /@types/lodash.shuffle/4.2.7:
+ resolution: {integrity: sha512-b+K0NBpB4WcNoQTfifuTmi5nm5mJXRw9DBdbFfBr1q1+EVoTKkClDxq/7r1sq2GZcRelMFRsFcGGHrHQgxRySg==}
+ dependencies:
+ '@types/lodash': 4.14.184
+ dev: true
+
/@types/lodash/4.14.180:
resolution: {integrity: sha512-XOKXa1KIxtNXgASAnwj7cnttJxS4fksBRywK/9LzRV5YxrF80BXZIGeQSuoESQ/VkUj30Ae0+YcuHc15wJCB2g==}
@@ -13357,7 +13379,14 @@ packages:
/@types/node-fetch/2.6.1:
resolution: {integrity: sha512-oMqjURCaxoSIsHSr1E47QHzbmzNR5rK8McHuNb11BOM9cHcIK3Avy0s/b2JlXHoQGTYS3NsvWzV1M0iK7l0wbA==}
dependencies:
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
+ form-data: 3.0.1
+ dev: true
+
+ /@types/node-fetch/2.6.2:
+ resolution: {integrity: sha512-DHqhlq5jeESLy19TYhLakJ07kNumXWjcDdxXsLUMJZ6ue8VZJj4kLPQVE/2mdHh3xZziNF1xppu5lwmS53HR+A==}
+ dependencies:
+ '@types/node': 18.11.18
form-data: 3.0.1
dev: true
@@ -13383,6 +13412,9 @@ packages:
/@types/node/17.0.21:
resolution: {integrity: sha512-DBZCJbhII3r90XbQxI8Y9IjjiiOGlZ0Hr32omXIZvwwZ7p4DMMXGrKXVyPfuoBOri9XNtL0UK69jYIBIsRX3QQ==}
+ /@types/node/18.11.18:
+ resolution: {integrity: sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==}
+
/@types/normalize-package-data/2.4.1:
resolution: {integrity: sha512-Gj7cI7z+98M282Tqmp2K5EIsoouUEzbBJhQQzDE3jSIRk6r9gsz0oUokqIUR4u1R3dMHo0pDHM7sNOHyhulypw==}
dev: true
@@ -13527,7 +13559,7 @@ packages:
resolution: {integrity: sha512-z5xyF6uh8CbjAu9760KDKsH2FcDxZ2tFCsA4HIMWE6IkiYMXfVoa+4f9KX+FN0ZLsaMw1WNG2ETLA6N+/YA+cg==}
dependencies:
'@types/mime': 3.0.1
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
dev: true
/@types/sizzle/2.3.3:
@@ -13583,11 +13615,15 @@ packages:
/@types/uuid/8.3.4:
resolution: {integrity: sha512-c/I8ZRb51j+pYGAu5CrFMRxqZ2ke4y2grEBO5AUjgSkSk+qT2Ea+OdWElz/OiMf5MNpn2b17kuVBwZLQJXzihw==}
+ /@types/uuid/9.0.0:
+ resolution: {integrity: sha512-kr90f+ERiQtKWMz5rP32ltJ/BtULDI5RVO0uavn1HQUOwjx0R1h0rnDYNL0CepF1zL5bSY6FISAfd9tOdDhU5Q==}
+ dev: true
+
/@types/vinyl/2.0.6:
resolution: {integrity: sha512-ayJ0iOCDNHnKpKTgBG6Q6JOnHTj9zFta+3j2b8Ejza0e4cvRyMn0ZoLEmbPrTHe5YYRlDYPvPWVdV4cTaRyH7g==}
dependencies:
'@types/expect': 1.20.4
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
dev: true
/@types/webpack-env/1.16.3:
@@ -13597,7 +13633,7 @@ packages:
/@types/webpack-sources/0.1.9:
resolution: {integrity: sha512-bvzMnzqoK16PQIC8AYHNdW45eREJQMd6WG/msQWX5V2+vZmODCOPb4TJcbgRljTZZTwTM4wUMcsI8FftNA7new==}
dependencies:
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
'@types/source-list-map': 0.1.2
source-map: 0.6.1
dev: true
@@ -13767,7 +13803,7 @@ packages:
resolution: {integrity: sha512-8uALY5LTvSuHgloDVUvWP3pIauILm+8/0pDMokuDYIoNsOkSwd5AiHBTSEJjKTDcZr5z8UpgOWZkxBF4iJftoA==}
requiresBuild: true
dependencies:
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
dev: true
optional: true
@@ -18859,19 +18895,6 @@ packages:
- supports-color
dev: true
- /babel-plugin-polyfill-corejs2/0.3.3_@babel+core@7.16.12:
- resolution: {integrity: sha512-8hOdmFYFSZhqg2C/JgLUQ+t52o5nirNwaWM2B9LWteozwIvM14VSwdsCAUET10qT+kmySAlseadmfeeSWFCy+Q==}
- peerDependencies:
- '@babel/core': ^7.0.0-0
- dependencies:
- '@babel/compat-data': 7.19.3
- '@babel/core': 7.16.12
- '@babel/helper-define-polyfill-provider': 0.3.3_@babel+core@7.16.12
- semver: 6.3.0
- transitivePeerDependencies:
- - supports-color
- dev: false
-
/babel-plugin-polyfill-corejs2/0.3.3_@babel+core@7.17.8:
resolution: {integrity: sha512-8hOdmFYFSZhqg2C/JgLUQ+t52o5nirNwaWM2B9LWteozwIvM14VSwdsCAUET10qT+kmySAlseadmfeeSWFCy+Q==}
peerDependencies:
@@ -21243,7 +21266,7 @@ packages:
postcss-value-parser: 4.2.0
schema-utils: 2.7.1
semver: 6.3.0
- webpack: 5.70.0
+ webpack: 5.70.0_webpack-cli@3.3.12
/css-loader/5.2.7_webpack@5.70.0:
resolution: {integrity: sha512-Q7mOvpBNBG7YrVGMxRxcBJZFL75o+cH2abNASdibkj/fffYD8qWbInZrD0S9ccI6vZclF3DsHE7njGlLtaHbhg==}
@@ -28495,7 +28518,7 @@ packages:
'@jest/environment': 26.6.2
'@jest/fake-timers': 26.6.2
'@jest/types': 26.6.2
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
jest-mock: 26.6.2
jest-util: 26.6.2
jsdom: 16.7.0
@@ -28758,7 +28781,7 @@ packages:
'@jest/source-map': 26.6.2
'@jest/test-result': 26.6.2
'@jest/types': 26.6.2
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
chalk: 4.1.2
co: 4.6.0
expect: 26.6.2
@@ -29447,7 +29470,7 @@ packages:
resolution: {integrity: sha512-S5wqyz0DXnNJPd/xfIzZ5Xnp1HrJWBczg8mMfMpN78OJ5eDxXyf+Ygld9wX1DnUWbIbhM1YDY95NjR4CBXkb2g==}
engines: {node: '>= 10.14.2'}
dependencies:
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
graceful-fs: 4.2.9
/jest-serializer/27.5.1:
@@ -29684,7 +29707,7 @@ packages:
dependencies:
'@jest/test-result': 26.6.2
'@jest/types': 26.6.2
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
ansi-escapes: 4.3.2
chalk: 4.1.2
jest-util: 26.6.2
@@ -36855,7 +36878,7 @@ packages:
neo-async: 2.6.2
schema-utils: 3.1.1
semver: 7.3.5
- webpack: 5.70.0
+ webpack: 5.70.0_webpack-cli@3.3.12
/sass-loader/12.6.0_sass@1.49.9+webpack@5.70.0:
resolution: {integrity: sha512-oLTaH0YCtX4cfnJZxKSLAyglED0naiYfNG1iXfU5w1LNZ+ukoA5DtyDIN5zmKVZwYNJP4KRc5Y3hkWga+7tYfA==}
@@ -38792,7 +38815,7 @@ packages:
serialize-javascript: 6.0.0
source-map: 0.6.1
terser: 5.10.0_acorn@8.8.1
- webpack: 5.70.0
+ webpack: 5.70.0_webpack-cli@3.3.12
transitivePeerDependencies:
- acorn
@@ -39295,7 +39318,7 @@ packages:
yn: 3.1.1
dev: true
- /ts-node/10.9.1_suuodkax7fygvcgfx5vhk45yei:
+ /ts-node/10.9.1_vqcafhj4xvr2nzknlrdklk55zm:
resolution: {integrity: sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==}
hasBin: true
peerDependencies:
@@ -39314,7 +39337,7 @@ packages:
'@tsconfig/node12': 1.0.11
'@tsconfig/node14': 1.0.3
'@tsconfig/node16': 1.0.3
- '@types/node': 17.0.21
+ '@types/node': 18.11.18
acorn: 8.7.0
acorn-walk: 8.2.0
arg: 4.1.3
diff --git a/tools/cli-core/package.json b/tools/cli-core/package.json
index 986dfbd8a02..21ce499f80a 100644
--- a/tools/cli-core/package.json
+++ b/tools/cli-core/package.json
@@ -12,6 +12,7 @@
},
"devDependencies": {
"@tsconfig/node16": "^1.0.3",
+ "@types/uuid": "^9.0.0",
"typescript": "^4.8.3"
},
"dependencies": {
diff --git a/tools/monorepo/check-changelogger-use.php b/tools/monorepo/check-changelogger-use.php
index b2819ef2a48..b9f07dd3c83 100644
--- a/tools/monorepo/check-changelogger-use.php
+++ b/tools/monorepo/check-changelogger-use.php
@@ -70,9 +70,9 @@ if ( $verbose ) {
*/
function debug( ...$args ) {
if ( getenv( 'CI' ) ) {
- $args[0] = "\e[34m${args[0]}\e[0m\n";
+ $args[0] = "\e[34m{$args[0]}\e[0m\n";
} else {
- $args[0] = "\e[1;30m${args[0]}\e[0m\n";
+ $args[0] = "\e[1;30m{$args[0]}\e[0m\n";
}
fprintf( STDERR, ...$args );
}
diff --git a/tools/release-posts/.prettierignore b/tools/release-posts/.prettierignore
new file mode 100644
index 00000000000..6e551732dd9
--- /dev/null
+++ b/tools/release-posts/.prettierignore
@@ -0,0 +1 @@
+*.ejs
diff --git a/tools/release-posts/lib/environment.ts b/tools/release-posts/lib/environment.ts
index f683c13e963..93b871d27c8 100644
--- a/tools/release-posts/lib/environment.ts
+++ b/tools/release-posts/lib/environment.ts
@@ -3,7 +3,6 @@
*/
import { Logger } from 'cli-core/src/logger';
-
export const getEnvVar = ( varName: string, isRequired = false ) => {
const value = process.env[ varName ];
diff --git a/tools/release-posts/lib/github-api.ts b/tools/release-posts/lib/github-api.ts
index 3b844ee7d08..ebd3504f2f7 100644
--- a/tools/release-posts/lib/github-api.ts
+++ b/tools/release-posts/lib/github-api.ts
@@ -3,6 +3,10 @@
*/
import { Octokit } from '@octokit/rest';
import shuffle from 'lodash.shuffle';
+
+/**
+ * Internal dependencies
+ */
import { getEnvVar } from './environment';
export type ContributorData = {
diff --git a/tools/release-posts/lib/logger.ts b/tools/release-posts/lib/logger.ts
deleted file mode 100644
index 9f3553b8c76..00000000000
--- a/tools/release-posts/lib/logger.ts
+++ /dev/null
@@ -1,62 +0,0 @@
-/**
- * External dependencies
- */
-import ora, { Ora } from 'ora';
-import chalk from 'chalk';
-
-/**
- * Internal dependencies
- */
-import { getEnvVar } from './environment';
-
-const { log, error, warn } = console;
-export class Logger {
- private static lastSpinner: Ora | null;
- private static get loggingLevel() {
- return {
- warn: 2,
- silent: 1,
- }[ getEnvVar( 'LOGGER_LEVEL' ) || 'warn' ] as number;
- }
-
- static error( message: string ) {
- Logger.failTask();
- error( chalk.red( message ) );
- process.exit( 1 );
- }
-
- static warn( message: string ) {
- if ( Logger.loggingLevel >= 2 ) {
- warn( chalk.yellow( message ) );
- }
- }
-
- static notice( message: string ) {
- if ( Logger.loggingLevel >= 1 ) {
- log( chalk.green( message ) );
- }
- }
-
- static startTask( message: string ) {
- if ( Logger.loggingLevel >= 1 ) {
- const spinner = ora( chalk.green( `${ message }...` ) ).start();
- Logger.lastSpinner = spinner;
- }
- }
-
- static failTask() {
- if ( Logger.lastSpinner ) {
- Logger.lastSpinner.fail( `${ Logger.lastSpinner.text } failed.` );
- Logger.lastSpinner = null;
- }
- }
-
- static endTask() {
- if ( Logger.loggingLevel > 1 && Logger.lastSpinner ) {
- Logger.lastSpinner.succeed(
- `${ Logger.lastSpinner.text } complete.`
- );
- Logger.lastSpinner = null;
- }
- }
-}
diff --git a/tools/release-posts/lib/render-template.ts b/tools/release-posts/lib/render-template.ts
index bac0b561eb7..e9a77ffbf41 100644
--- a/tools/release-posts/lib/render-template.ts
+++ b/tools/release-posts/lib/render-template.ts
@@ -8,14 +8,14 @@ const TEMPLATE_DIR = join( __dirname, '..', 'templates' );
export const renderTemplate = (
templateFile: string,
- templateData: unknown
+ templateData: ejs.Data
) => {
return new Promise< string >( ( resolve, reject ) => {
ejs.renderFile(
join( TEMPLATE_DIR, templateFile ),
templateData,
{},
- function ( err: Error, str: string ) {
+ function ( err: Error | null, str: string ) {
if ( err ) {
reject( err );
} else {
diff --git a/tools/release-posts/package.json b/tools/release-posts/package.json
index 7fa345e8bdc..5aa9f43503a 100644
--- a/tools/release-posts/package.json
+++ b/tools/release-posts/package.json
@@ -4,6 +4,7 @@
"description": "Automate release post generation for Wordpress plugins",
"main": " ",
"scripts": {
+ "lint": "tsc --noEmit",
"release-post": "node -r ts-node/register ./commands/release-post/index.ts"
},
"author": "Automattic",
@@ -14,7 +15,12 @@
},
"devDependencies": {
"@tsconfig/node16": "^1.0.3",
+ "@types/ejs": "^3.1.1",
"@types/express": "^4.17.13",
+ "@types/lodash.shuffle": "^4.2.7",
+ "@types/node": "^18.11.18",
+ "@types/node-fetch": "^2.6.2",
+ "@types/semver": "^7.3.10",
"typescript": "^4.8.3"
},
"dependencies": {
diff --git a/tools/release-posts/templates/database.ejs b/tools/release-posts/templates/database.ejs
index 6f5f9016bf2..de3fea44d6f 100644
--- a/tools/release-posts/templates/database.ejs
+++ b/tools/release-posts/templates/database.ejs
@@ -49,6 +49,7 @@
There are no database changes in this release.
diff --git a/tools/release-posts/templates/oauth.ejs b/tools/release-posts/templates/oauth.ejs index 5228670644e..248ea63d171 100644 --- a/tools/release-posts/templates/oauth.ejs +++ b/tools/release-posts/templates/oauth.ejs @@ -3,5 +3,5 @@