From a63dbcef7058ffd858a71931b6fc2ead0583ae03 Mon Sep 17 00:00:00 2001 From: groguo Date: Wed, 14 Jul 2021 15:43:06 +0000 Subject: [PATCH] Review suggestion changes --- assets/js/blocks/attribute-filter/block.js | 2 +- assets/js/blocks/attribute-filter/style.scss | 17 +------- assets/js/blocks/stock-filter/block.js | 39 ++++++++----------- assets/js/blocks/stock-filter/edit.js | 1 - assets/js/blocks/stock-filter/style.scss | 17 +------- src/BlockTypes/StockFilter.php | 2 + .../Schemas/ProductCollectionDataSchema.php | 2 +- 7 files changed, 24 insertions(+), 56 deletions(-) diff --git a/assets/js/blocks/attribute-filter/block.js b/assets/js/blocks/attribute-filter/block.js index 8eba5fca8fa..c5e027215b8 100644 --- a/assets/js/blocks/attribute-filter/block.js +++ b/assets/js/blocks/attribute-filter/block.js @@ -13,6 +13,7 @@ import { import { useCallback, useEffect, useState, useMemo } from '@wordpress/element'; import CheckboxList from '@woocommerce/base-components/checkbox-list'; import DropdownSelector from '@woocommerce/base-components/dropdown-selector'; +import Label from '@woocommerce/base-components/filter-element-label'; import FilterSubmitButton from '@woocommerce/base-components/filter-submit-button'; import isShallowEqual from '@wordpress/is-shallow-equal'; import { decodeEntities } from '@wordpress/html-entities'; @@ -22,7 +23,6 @@ import { decodeEntities } from '@wordpress/html-entities'; */ import { getAttributeFromID } from '../../utils/attributes'; import { updateAttributeFilter } from '../../utils/attributes-query'; -import Label from './label'; import { previewAttributeObject, previewOptions } from './preview'; import './style.scss'; diff --git a/assets/js/blocks/attribute-filter/style.scss b/assets/js/blocks/attribute-filter/style.scss index 205bb7283bd..a5030e4b6ef 100644 --- a/assets/js/blocks/attribute-filter/style.scss +++ b/assets/js/blocks/attribute-filter/style.scss @@ -1,15 +1,6 @@ .wc-block-attribute-filter { margin-bottom: $gap-large; - .wc-block-attribute-filter-list-count { - &::before { - content: " ("; - } - &::after { - content: ")"; - } - } - .wc-block-attribute-filter-list { margin: 0; @@ -25,14 +16,10 @@ display: inline-block; } } - - .wc-block-attribute-filter-list-count { - float: right; - } } - .is-single .wc-block-attribute-filter-list-count, - .wc-block-dropdown-selector .wc-block-dropdown-selector__list .wc-block-attribute-filter-list-count { + .is-single, + .wc-block-dropdown-selector .wc-block-dropdown-selector__list { opacity: 0.6; } diff --git a/assets/js/blocks/stock-filter/block.js b/assets/js/blocks/stock-filter/block.js index 0598e424068..4f9be54d45f 100644 --- a/assets/js/blocks/stock-filter/block.js +++ b/assets/js/blocks/stock-filter/block.js @@ -13,24 +13,29 @@ import { getSetting } from '@woocommerce/settings'; import { useCallback, useEffect, useState, useMemo } from '@wordpress/element'; import CheckboxList from '@woocommerce/base-components/checkbox-list'; import FilterSubmitButton from '@woocommerce/base-components/filter-submit-button'; +import Label from '@woocommerce/base-components/filter-element-label'; import isShallowEqual from '@wordpress/is-shallow-equal'; import { decodeEntities } from '@wordpress/html-entities'; /** * Internal dependencies */ -import Label from './label'; import { previewOptions } from './preview'; import './style.scss'; -const STOCK_STATUS_OPTIONS = getSetting( 'stockStatusOptions', [] ); const hideOutOfStockItems = getSetting( 'hideOutOfStockItems', false ); -if ( hideOutOfStockItems ) { - delete STOCK_STATUS_OPTIONS.outofstock; -} -const initialOptions = Object.entries( - STOCK_STATUS_OPTIONS -).map( ( [ slug, name ] ) => ( { slug, name } ) ); +const { outofstock, ...otherStockStatusOptions } = getSetting( + 'stockStatusOptions', + {} +); +const STOCK_STATUS_OPTIONS = hideOutOfStockItems + ? otherStockStatusOptions + : { outofstock, ...otherStockStatusOptions }; +// filter added to handle if there are slugs without a corresponding name defined. +const initialOptions = Object.entries( STOCK_STATUS_OPTIONS ) + .map( ( [ slug, name ] ) => ( { slug, name } ) ) + .filter( ( status ) => !! status.name ) + .sort( ( a, b ) => a.slug.localeCompare( b.slug ) ); /** * Component displaying an stock status filter. @@ -165,8 +170,8 @@ const StockStatusFilterBlock = ( { // Track Stock query changes so the block reflects current filters. useEffect( () => { if ( - ! isShallowEqual( previousCheckedQuery, currentCheckedQuery ) && // checked query changed - ! isShallowEqual( checked, currentCheckedQuery ) // checked query doesn't match the UI + ! isShallowEqual( previousCheckedQuery, currentCheckedQuery ) && // Checked query changed. + ! isShallowEqual( checked, currentCheckedQuery ) // Checked query doesn't match the UI. ) { setChecked( currentCheckedQuery ); } @@ -192,19 +197,7 @@ const StockStatusFilterBlock = ( { const filterRemovedName = filterRemoved ? getFilterNameFromValue( filterRemoved ) : null; - if ( filterAddedName && filterRemovedName ) { - speak( - sprintf( - /* translators: %1$s and %2$s are stock statuses (for example: 'instock'...). */ - __( - '%1$s filter replaced with %2$s.', - 'woo-gutenberg-products-block' - ), - filterAddedName, - filterRemovedName - ) - ); - } else if ( filterAddedName ) { + if ( filterAddedName ) { speak( sprintf( /* translators: %s stock statuses (for example: 'instock'...) */ diff --git a/assets/js/blocks/stock-filter/edit.js b/assets/js/blocks/stock-filter/edit.js index 595219edffe..b896272b73b 100644 --- a/assets/js/blocks/stock-filter/edit.js +++ b/assets/js/blocks/stock-filter/edit.js @@ -2,7 +2,6 @@ * External dependencies */ import { __ } from '@wordpress/i18n'; - import { InspectorControls } from '@wordpress/block-editor'; import { Disabled, diff --git a/assets/js/blocks/stock-filter/style.scss b/assets/js/blocks/stock-filter/style.scss index ec1b4dbfdb7..7ebfc400b9d 100644 --- a/assets/js/blocks/stock-filter/style.scss +++ b/assets/js/blocks/stock-filter/style.scss @@ -1,15 +1,6 @@ .wc-block-stock-filter { margin-bottom: $gap-large; - .wc-block-stock-filter-list-count { - &::before { - content: " ("; - } - &::after { - content: ")"; - } - } - .wc-block-stock-filter-list { margin: 0; @@ -25,14 +16,10 @@ display: inline-block; } } - - .wc-block-stock-filter-list-count { - float: right; - } } - .is-single .wc-block-stock-filter-list-count, - .wc-block-dropdown-selector .wc-block-dropdown-selector__list .wc-block-stock-filter-list-count { + .is-single, + .wc-block-dropdown-selector .wc-block-dropdown-selector__list { opacity: 0.6; } diff --git a/src/BlockTypes/StockFilter.php b/src/BlockTypes/StockFilter.php index 163f06d42e2..8fc29e12452 100644 --- a/src/BlockTypes/StockFilter.php +++ b/src/BlockTypes/StockFilter.php @@ -22,5 +22,7 @@ class StockFilter extends AbstractBlock { protected function enqueue_data( array $stock_statuses = [] ) { parent::enqueue_data( $stock_statuses ); $this->asset_data_registry->add( 'stockStatusOptions', wc_get_product_stock_status_options(), true ); + $this->asset_data_registry->add( 'hideOutOfStockItems', 'yes' === get_option( 'woocommerce_hide_out_of_stock_items' ), true ); + } } diff --git a/src/StoreApi/Schemas/ProductCollectionDataSchema.php b/src/StoreApi/Schemas/ProductCollectionDataSchema.php index 244837167ef..b5b4bf1f923 100644 --- a/src/StoreApi/Schemas/ProductCollectionDataSchema.php +++ b/src/StoreApi/Schemas/ProductCollectionDataSchema.php @@ -108,7 +108,7 @@ public function get_properties() { 'properties' => [ 'status' => [ 'description' => __( 'Status', 'woo-gutenberg-products-block' ), - 'type' => 'integer', + 'type' => 'string', 'context' => [ 'view', 'edit' ], 'readonly' => true, ],