Product Rating block: Fix review count not displaying on frontend (https://github.com/woocommerce/woocommerce-blocks/pull/9129)

* Fix review count not displaying on Product Rating

* Fix PHP CS errors

* Add Customer Reviews count to the Product Rating block on the Editor

* Remove unnecessary var_dump
This commit is contained in:
Alexandre Lara 2023-04-28 14:26:43 -03:00 committed by GitHub
parent 5297d93d37
commit 448f8102d9
4 changed files with 333 additions and 221 deletions

View File

@ -20,11 +20,6 @@ import { isNumber, ProductResponseItem } from '@woocommerce/types';
*/
import './style.scss';
type Props = {
textAlign?: string;
className?: string;
};
type RatingProps = {
reviews: number;
rating: number;
@ -109,17 +104,38 @@ const AddReview = ( props: AddReviewProps ): JSX.Element | null => {
) : null;
};
/**
* Product Rating Block Component.
*
* @param {Object} props Incoming props.
* @param {string} [props.className] CSS Class name for the component.
* @param {string} [props.textAlign] Text alignment.
*
* @return {*} The component.
*/
export const Block = ( props: Props ): JSX.Element | null => {
const { textAlign } = props;
const ReviewsCount = ( props: { reviews: number } ): JSX.Element => {
const { reviews } = props;
const reviewsCount = sprintf(
/* translators: %s is referring to the total of reviews for a product */
_n(
'(%s customer review)',
'(%s customer reviews)',
reviews,
'woo-gutenberg-products-block'
),
reviews
);
return (
<span className="wc-block-components-product-rating__reviews_count">
{ reviewsCount }
</span>
);
};
interface ProductRatingProps {
className?: string;
textAlign?: string;
isDescendentOfSingleProductBlock: boolean;
isDescendentOfQueryLoop: boolean;
postId: number;
productId: number;
}
export const Block = ( props: ProductRatingProps ): JSX.Element | null => {
const { textAlign, isDescendentOfSingleProductBlock } = props;
const { parentClassName } = useInnerBlockLayoutContext();
const { product } = useProductDataContext();
const rating = getAverageRating( product );
@ -157,7 +173,12 @@ export const Block = ( props: Props ): JSX.Element | null => {
...spacingProps.style,
} }
>
{ content }
<div className="wc-block-components-product-rating__container">
{ content }
{ reviews && isDescendentOfSingleProductBlock ? (
<ReviewsCount reviews={ reviews } />
) : null }
</div>
</div>
);
};

View File

@ -58,10 +58,15 @@
}
}
.wc-block-single-product {
.wp-block-woocommerce-single-product {
.wc-block-components-product-rating__stars {
margin: 0;
}
.wc-block-components-product-rating__container {
display: flex;
align-items: center;
column-gap: $gap-smaller;
}
}
.wc-block-all-products,

View File

@ -255,7 +255,6 @@
},
"node_modules/@ampproject/remapping": {
"version": "2.2.0",
"devOptional": true,
"license": "Apache-2.0",
"dependencies": {
"@jridgewell/gen-mapping": "^0.1.0",
@ -318,7 +317,6 @@
},
"node_modules/@babel/compat-data": {
"version": "7.18.8",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=6.9.0"
@ -326,7 +324,6 @@
},
"node_modules/@babel/core": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@ampproject/remapping": "^2.1.0",
@ -380,7 +377,6 @@
},
"node_modules/@babel/generator": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/types": "^7.18.9",
@ -393,7 +389,6 @@
},
"node_modules/@babel/generator/node_modules/@jridgewell/gen-mapping": {
"version": "0.3.2",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@jridgewell/set-array": "^1.0.1",
@ -429,7 +424,6 @@
},
"node_modules/@babel/helper-compilation-targets": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/compat-data": "^7.18.8",
@ -499,7 +493,6 @@
},
"node_modules/@babel/helper-environment-visitor": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=6.9.0"
@ -518,7 +511,6 @@
},
"node_modules/@babel/helper-function-name": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/template": "^7.18.6",
@ -530,7 +522,6 @@
},
"node_modules/@babel/helper-hoist-variables": {
"version": "7.18.6",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/types": "^7.18.6"
@ -562,7 +553,6 @@
},
"node_modules/@babel/helper-module-transforms": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/helper-environment-visitor": "^7.18.9",
@ -593,7 +583,6 @@
"version": "7.20.2",
"resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.20.2.tgz",
"integrity": "sha512-8RvlJG2mj4huQ4pZ+rU9lqKi9ZKiRmuvGuM2HlWmkmgOhbs6zEAw6IEiJ5cQqGbDzGZOhwuOQNtZMi/ENLjZoQ==",
"dev": true,
"engines": {
"node": ">=6.9.0"
}
@ -628,7 +617,6 @@
},
"node_modules/@babel/helper-simple-access": {
"version": "7.18.6",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/types": "^7.18.6"
@ -651,7 +639,6 @@
},
"node_modules/@babel/helper-split-export-declaration": {
"version": "7.18.6",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/types": "^7.18.6"
@ -678,7 +665,6 @@
},
"node_modules/@babel/helper-validator-option": {
"version": "7.18.6",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=6.9.0"
@ -700,7 +686,6 @@
},
"node_modules/@babel/helpers": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/template": "^7.18.6",
@ -782,7 +767,6 @@
},
"node_modules/@babel/parser": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"bin": {
"parser": "bin/babel-parser.js"
@ -1223,7 +1207,6 @@
},
"node_modules/@babel/plugin-syntax-jsx": {
"version": "7.18.6",
"dev": true,
"license": "MIT",
"dependencies": {
"@babel/helper-plugin-utils": "^7.18.6"
@ -2207,7 +2190,6 @@
},
"node_modules/@babel/template": {
"version": "7.18.6",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/code-frame": "^7.18.6",
@ -2220,7 +2202,6 @@
},
"node_modules/@babel/traverse": {
"version": "7.18.9",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@babel/code-frame": "^7.18.6",
@ -2411,32 +2392,52 @@
}
},
"node_modules/@emotion/babel-plugin": {
"version": "11.10.6",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.10.6.tgz",
"integrity": "sha512-p2dAqtVrkhSa7xz1u/m9eHYdLi+en8NowrmXeF/dKtJpU8lCWli8RUAati7NcSl0afsBott48pdnANuD0wh9QQ==",
"version": "11.9.2",
"license": "MIT",
"dependencies": {
"@babel/helper-module-imports": "^7.16.7",
"@babel/runtime": "^7.18.3",
"@emotion/hash": "^0.9.0",
"@emotion/memoize": "^0.8.0",
"@emotion/serialize": "^1.1.1",
"babel-plugin-macros": "^3.1.0",
"@babel/helper-module-imports": "^7.12.13",
"@babel/plugin-syntax-jsx": "^7.12.13",
"@babel/runtime": "^7.13.10",
"@emotion/hash": "^0.8.0",
"@emotion/memoize": "^0.7.5",
"@emotion/serialize": "^1.0.2",
"babel-plugin-macros": "^2.6.1",
"convert-source-map": "^1.5.0",
"escape-string-regexp": "^4.0.0",
"find-root": "^1.1.0",
"source-map": "^0.5.7",
"stylis": "4.1.3"
"stylis": "4.0.13"
},
"peerDependencies": {
"@babel/core": "^7.0.0"
}
},
"node_modules/@emotion/babel-plugin/node_modules/@emotion/memoize": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.0.tgz",
"integrity": "sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA=="
"version": "0.7.5",
"license": "MIT"
},
"node_modules/@emotion/babel-plugin/node_modules/stylis": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.1.3.tgz",
"integrity": "sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA=="
"node_modules/@emotion/babel-plugin/node_modules/babel-plugin-macros": {
"version": "2.8.0",
"license": "MIT",
"dependencies": {
"@babel/runtime": "^7.7.2",
"cosmiconfig": "^6.0.0",
"resolve": "^1.12.0"
}
},
"node_modules/@emotion/babel-plugin/node_modules/cosmiconfig": {
"version": "6.0.0",
"license": "MIT",
"dependencies": {
"@types/parse-json": "^4.0.0",
"import-fresh": "^3.1.0",
"parse-json": "^5.0.0",
"path-type": "^4.0.0",
"yaml": "^1.7.2"
},
"engines": {
"node": ">=8"
}
},
"node_modules/@emotion/cache": {
"version": "11.9.3",
@ -2469,9 +2470,8 @@
}
},
"node_modules/@emotion/hash": {
"version": "0.9.0",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.0.tgz",
"integrity": "sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ=="
"version": "0.8.0",
"license": "MIT"
},
"node_modules/@emotion/is-prop-valid": {
"version": "0.8.8",
@ -2515,53 +2515,73 @@
"license": "MIT"
},
"node_modules/@emotion/serialize": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.1.1.tgz",
"integrity": "sha512-Zl/0LFggN7+L1liljxXdsVSVlg6E/Z/olVWpfxUTxOAmi8NU7YoeWeLfi1RmnB2TATHoaWwIBRoL+FvAJiTUQA==",
"version": "1.0.4",
"license": "MIT",
"dependencies": {
"@emotion/hash": "^0.9.0",
"@emotion/memoize": "^0.8.0",
"@emotion/unitless": "^0.8.0",
"@emotion/utils": "^1.2.0",
"@emotion/hash": "^0.8.0",
"@emotion/memoize": "^0.7.4",
"@emotion/unitless": "^0.7.5",
"@emotion/utils": "^1.0.0",
"csstype": "^3.0.2"
}
},
"node_modules/@emotion/serialize/node_modules/@emotion/memoize": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.0.tgz",
"integrity": "sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA=="
},
"node_modules/@emotion/serialize/node_modules/@emotion/utils": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.2.0.tgz",
"integrity": "sha512-sn3WH53Kzpw8oQ5mgMmIzzyAaH2ZqFEbozVVBSYp538E06OSE6ytOp7pRAjNQR+Q/orwqdQYJSe2m3hCOeznkw=="
},
"node_modules/@emotion/sheet": {
"version": "1.1.1",
"license": "MIT"
},
"node_modules/@emotion/styled": {
"version": "11.10.6",
"resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.10.6.tgz",
"integrity": "sha512-OXtBzOmDSJo5Q0AFemHCfl+bUueT8BIcPSxu0EGTpGk6DmI5dnhSzQANm1e1ze0YZL7TDyAyy6s/b/zmGOS3Og==",
"version": "11.10.5",
"resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.10.5.tgz",
"integrity": "sha512-8EP6dD7dMkdku2foLoruPCNkRevzdcBaY6q0l0OsbyJK+x8D9HWjX27ARiSIKNF634hY9Zdoedh8bJCiva8yZw==",
"dependencies": {
"@babel/runtime": "^7.18.3",
"@emotion/babel-plugin": "^11.10.6",
"@emotion/babel-plugin": "^11.10.5",
"@emotion/is-prop-valid": "^1.2.0",
"@emotion/serialize": "^1.1.1",
"@emotion/use-insertion-effect-with-fallbacks": "^1.0.0",
"@emotion/utils": "^1.2.0"
},
"peerDependencies": {
"@babel/core": "^7.0.0",
"@emotion/react": "^11.0.0-rc.0",
"react": ">=16.8.0"
},
"peerDependenciesMeta": {
"@babel/core": {
"optional": true
},
"@types/react": {
"optional": true
}
}
},
"node_modules/@emotion/styled/node_modules/@emotion/babel-plugin": {
"version": "11.10.5",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.10.5.tgz",
"integrity": "sha512-xE7/hyLHJac7D2Ve9dKroBBZqBT7WuPQmWcq7HSGb84sUuP4mlOWoB8dvVfD9yk5DHkU1m6RW7xSoDtnQHNQeA==",
"dependencies": {
"@babel/helper-module-imports": "^7.16.7",
"@babel/plugin-syntax-jsx": "^7.17.12",
"@babel/runtime": "^7.18.3",
"@emotion/hash": "^0.9.0",
"@emotion/memoize": "^0.8.0",
"@emotion/serialize": "^1.1.1",
"babel-plugin-macros": "^3.1.0",
"convert-source-map": "^1.5.0",
"escape-string-regexp": "^4.0.0",
"find-root": "^1.1.0",
"source-map": "^0.5.7",
"stylis": "4.1.3"
},
"peerDependencies": {
"@babel/core": "^7.0.0"
}
},
"node_modules/@emotion/styled/node_modules/@emotion/hash": {
"version": "0.9.0",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.0.tgz",
"integrity": "sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ=="
},
"node_modules/@emotion/styled/node_modules/@emotion/is-prop-valid": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.0.tgz",
@ -2575,15 +2595,36 @@
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.0.tgz",
"integrity": "sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA=="
},
"node_modules/@emotion/styled/node_modules/@emotion/serialize": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.1.1.tgz",
"integrity": "sha512-Zl/0LFggN7+L1liljxXdsVSVlg6E/Z/olVWpfxUTxOAmi8NU7YoeWeLfi1RmnB2TATHoaWwIBRoL+FvAJiTUQA==",
"dependencies": {
"@emotion/hash": "^0.9.0",
"@emotion/memoize": "^0.8.0",
"@emotion/unitless": "^0.8.0",
"@emotion/utils": "^1.2.0",
"csstype": "^3.0.2"
}
},
"node_modules/@emotion/styled/node_modules/@emotion/unitless": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.0.tgz",
"integrity": "sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw=="
},
"node_modules/@emotion/styled/node_modules/@emotion/utils": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.2.0.tgz",
"integrity": "sha512-sn3WH53Kzpw8oQ5mgMmIzzyAaH2ZqFEbozVVBSYp538E06OSE6ytOp7pRAjNQR+Q/orwqdQYJSe2m3hCOeznkw=="
},
"node_modules/@emotion/styled/node_modules/stylis": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.1.3.tgz",
"integrity": "sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA=="
},
"node_modules/@emotion/unitless": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.0.tgz",
"integrity": "sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw=="
"version": "0.7.5",
"license": "MIT"
},
"node_modules/@emotion/use-insertion-effect-with-fallbacks": {
"version": "1.0.0",
@ -4313,7 +4354,6 @@
},
"node_modules/@jridgewell/gen-mapping": {
"version": "0.1.1",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@jridgewell/set-array": "^1.0.0",
@ -4325,7 +4365,6 @@
},
"node_modules/@jridgewell/resolve-uri": {
"version": "3.0.6",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=6.0.0"
@ -4333,7 +4372,6 @@
},
"node_modules/@jridgewell/set-array": {
"version": "1.1.0",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=6.0.0"
@ -4363,12 +4401,10 @@
},
"node_modules/@jridgewell/sourcemap-codec": {
"version": "1.4.11",
"devOptional": true,
"license": "MIT"
},
"node_modules/@jridgewell/trace-mapping": {
"version": "0.3.15",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@jridgewell/resolve-uri": "^3.0.3",
@ -20432,7 +20468,6 @@
},
"node_modules/browserslist": {
"version": "4.20.3",
"devOptional": true,
"funding": [
{
"type": "opencollective",
@ -20460,7 +20495,6 @@
},
"node_modules/browserslist/node_modules/picocolors": {
"version": "1.0.0",
"devOptional": true,
"license": "ISC"
},
"node_modules/bser": {
@ -20793,7 +20827,6 @@
},
"node_modules/caniuse-lite": {
"version": "1.0.30001335",
"devOptional": true,
"funding": [
{
"type": "opencollective",
@ -23821,7 +23854,6 @@
},
"node_modules/debug": {
"version": "4.3.4",
"devOptional": true,
"license": "MIT",
"dependencies": {
"ms": "2.1.2"
@ -24944,7 +24976,6 @@
},
"node_modules/electron-to-chromium": {
"version": "1.4.129",
"devOptional": true,
"license": "ISC"
},
"node_modules/element-resize-detector": {
@ -25306,7 +25337,6 @@
},
"node_modules/escalade": {
"version": "3.1.1",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=6"
@ -27825,7 +27855,6 @@
},
"node_modules/gensync": {
"version": "1.0.0-beta.2",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=6.9.0"
@ -28265,7 +28294,6 @@
},
"node_modules/globals": {
"version": "11.12.0",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=4"
@ -34625,7 +34653,6 @@
},
"node_modules/jsesc": {
"version": "2.5.2",
"devOptional": true,
"license": "MIT",
"bin": {
"jsesc": "bin/jsesc"
@ -37922,7 +37949,6 @@
},
"node_modules/ms": {
"version": "2.1.2",
"devOptional": true,
"license": "MIT"
},
"node_modules/multicast-dns": {
@ -38221,7 +38247,6 @@
},
"node_modules/node-releases": {
"version": "2.0.4",
"devOptional": true,
"license": "MIT"
},
"node_modules/node-stream-zip": {
@ -44357,7 +44382,6 @@
},
"node_modules/semver": {
"version": "6.3.0",
"devOptional": true,
"license": "ISC",
"bin": {
"semver": "bin/semver.js"
@ -50565,7 +50589,6 @@
},
"@ampproject/remapping": {
"version": "2.2.0",
"devOptional": true,
"requires": {
"@jridgewell/gen-mapping": "^0.1.0",
"@jridgewell/trace-mapping": "^0.3.9"
@ -50603,12 +50626,10 @@
}
},
"@babel/compat-data": {
"version": "7.18.8",
"devOptional": true
"version": "7.18.8"
},
"@babel/core": {
"version": "7.18.9",
"devOptional": true,
"requires": {
"@ampproject/remapping": "^2.1.0",
"@babel/code-frame": "^7.18.6",
@ -50644,7 +50665,6 @@
},
"@babel/generator": {
"version": "7.18.9",
"devOptional": true,
"requires": {
"@babel/types": "^7.18.9",
"@jridgewell/gen-mapping": "^0.3.2",
@ -50653,7 +50673,6 @@
"dependencies": {
"@jridgewell/gen-mapping": {
"version": "0.3.2",
"devOptional": true,
"requires": {
"@jridgewell/set-array": "^1.0.1",
"@jridgewell/sourcemap-codec": "^1.4.10",
@ -50679,7 +50698,6 @@
},
"@babel/helper-compilation-targets": {
"version": "7.18.9",
"devOptional": true,
"requires": {
"@babel/compat-data": "^7.18.8",
"@babel/helper-validator-option": "^7.18.6",
@ -50723,8 +50741,7 @@
}
},
"@babel/helper-environment-visitor": {
"version": "7.18.9",
"devOptional": true
"version": "7.18.9"
},
"@babel/helper-explode-assignable-expression": {
"version": "7.16.7",
@ -50735,7 +50752,6 @@
},
"@babel/helper-function-name": {
"version": "7.18.9",
"devOptional": true,
"requires": {
"@babel/template": "^7.18.6",
"@babel/types": "^7.18.9"
@ -50743,7 +50759,6 @@
},
"@babel/helper-hoist-variables": {
"version": "7.18.6",
"devOptional": true,
"requires": {
"@babel/types": "^7.18.6"
}
@ -50763,7 +50778,6 @@
},
"@babel/helper-module-transforms": {
"version": "7.18.9",
"devOptional": true,
"requires": {
"@babel/helper-environment-visitor": "^7.18.9",
"@babel/helper-module-imports": "^7.18.6",
@ -50785,8 +50799,7 @@
"@babel/helper-plugin-utils": {
"version": "7.20.2",
"resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.20.2.tgz",
"integrity": "sha512-8RvlJG2mj4huQ4pZ+rU9lqKi9ZKiRmuvGuM2HlWmkmgOhbs6zEAw6IEiJ5cQqGbDzGZOhwuOQNtZMi/ENLjZoQ==",
"dev": true
"integrity": "sha512-8RvlJG2mj4huQ4pZ+rU9lqKi9ZKiRmuvGuM2HlWmkmgOhbs6zEAw6IEiJ5cQqGbDzGZOhwuOQNtZMi/ENLjZoQ=="
},
"@babel/helper-remap-async-to-generator": {
"version": "7.16.8",
@ -50810,7 +50823,6 @@
},
"@babel/helper-simple-access": {
"version": "7.18.6",
"devOptional": true,
"requires": {
"@babel/types": "^7.18.6"
}
@ -50826,7 +50838,6 @@
},
"@babel/helper-split-export-declaration": {
"version": "7.18.6",
"devOptional": true,
"requires": {
"@babel/types": "^7.18.6"
}
@ -50842,8 +50853,7 @@
"integrity": "sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w=="
},
"@babel/helper-validator-option": {
"version": "7.18.6",
"devOptional": true
"version": "7.18.6"
},
"@babel/helper-wrap-function": {
"version": "7.16.8",
@ -50857,7 +50867,6 @@
},
"@babel/helpers": {
"version": "7.18.9",
"devOptional": true,
"requires": {
"@babel/template": "^7.18.6",
"@babel/traverse": "^7.18.9",
@ -50910,8 +50919,7 @@
}
},
"@babel/parser": {
"version": "7.18.9",
"devOptional": true
"version": "7.18.9"
},
"@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": {
"version": "7.16.7",
@ -51157,7 +51165,6 @@
},
"@babel/plugin-syntax-jsx": {
"version": "7.18.6",
"dev": true,
"requires": {
"@babel/helper-plugin-utils": "^7.18.6"
}
@ -51744,7 +51751,6 @@
},
"@babel/template": {
"version": "7.18.6",
"devOptional": true,
"requires": {
"@babel/code-frame": "^7.18.6",
"@babel/parser": "^7.18.6",
@ -51753,7 +51759,6 @@
},
"@babel/traverse": {
"version": "7.18.9",
"devOptional": true,
"requires": {
"@babel/code-frame": "^7.18.6",
"@babel/generator": "^7.18.9",
@ -51891,32 +51896,42 @@
}
},
"@emotion/babel-plugin": {
"version": "11.10.6",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.10.6.tgz",
"integrity": "sha512-p2dAqtVrkhSa7xz1u/m9eHYdLi+en8NowrmXeF/dKtJpU8lCWli8RUAati7NcSl0afsBott48pdnANuD0wh9QQ==",
"version": "11.9.2",
"requires": {
"@babel/helper-module-imports": "^7.16.7",
"@babel/runtime": "^7.18.3",
"@emotion/hash": "^0.9.0",
"@emotion/memoize": "^0.8.0",
"@emotion/serialize": "^1.1.1",
"babel-plugin-macros": "^3.1.0",
"@babel/helper-module-imports": "^7.12.13",
"@babel/plugin-syntax-jsx": "^7.12.13",
"@babel/runtime": "^7.13.10",
"@emotion/hash": "^0.8.0",
"@emotion/memoize": "^0.7.5",
"@emotion/serialize": "^1.0.2",
"babel-plugin-macros": "^2.6.1",
"convert-source-map": "^1.5.0",
"escape-string-regexp": "^4.0.0",
"find-root": "^1.1.0",
"source-map": "^0.5.7",
"stylis": "4.1.3"
"stylis": "4.0.13"
},
"dependencies": {
"@emotion/memoize": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.0.tgz",
"integrity": "sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA=="
"version": "0.7.5"
},
"stylis": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.1.3.tgz",
"integrity": "sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA=="
"babel-plugin-macros": {
"version": "2.8.0",
"requires": {
"@babel/runtime": "^7.7.2",
"cosmiconfig": "^6.0.0",
"resolve": "^1.12.0"
}
},
"cosmiconfig": {
"version": "6.0.0",
"requires": {
"@types/parse-json": "^4.0.0",
"import-fresh": "^3.1.0",
"parse-json": "^5.0.0",
"path-type": "^4.0.0",
"yaml": "^1.7.2"
}
}
}
},
@ -51941,9 +51956,7 @@
}
},
"@emotion/hash": {
"version": "0.9.0",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.0.tgz",
"integrity": "sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ=="
"version": "0.8.0"
},
"@emotion/is-prop-valid": {
"version": "0.8.8",
@ -51973,45 +51986,55 @@
}
},
"@emotion/serialize": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.1.1.tgz",
"integrity": "sha512-Zl/0LFggN7+L1liljxXdsVSVlg6E/Z/olVWpfxUTxOAmi8NU7YoeWeLfi1RmnB2TATHoaWwIBRoL+FvAJiTUQA==",
"version": "1.0.4",
"requires": {
"@emotion/hash": "^0.9.0",
"@emotion/memoize": "^0.8.0",
"@emotion/unitless": "^0.8.0",
"@emotion/utils": "^1.2.0",
"@emotion/hash": "^0.8.0",
"@emotion/memoize": "^0.7.4",
"@emotion/unitless": "^0.7.5",
"@emotion/utils": "^1.0.0",
"csstype": "^3.0.2"
},
"dependencies": {
"@emotion/memoize": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.0.tgz",
"integrity": "sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA=="
},
"@emotion/utils": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.2.0.tgz",
"integrity": "sha512-sn3WH53Kzpw8oQ5mgMmIzzyAaH2ZqFEbozVVBSYp538E06OSE6ytOp7pRAjNQR+Q/orwqdQYJSe2m3hCOeznkw=="
}
}
},
"@emotion/sheet": {
"version": "1.1.1"
},
"@emotion/styled": {
"version": "11.10.6",
"resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.10.6.tgz",
"integrity": "sha512-OXtBzOmDSJo5Q0AFemHCfl+bUueT8BIcPSxu0EGTpGk6DmI5dnhSzQANm1e1ze0YZL7TDyAyy6s/b/zmGOS3Og==",
"version": "11.10.5",
"resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.10.5.tgz",
"integrity": "sha512-8EP6dD7dMkdku2foLoruPCNkRevzdcBaY6q0l0OsbyJK+x8D9HWjX27ARiSIKNF634hY9Zdoedh8bJCiva8yZw==",
"requires": {
"@babel/runtime": "^7.18.3",
"@emotion/babel-plugin": "^11.10.6",
"@emotion/babel-plugin": "^11.10.5",
"@emotion/is-prop-valid": "^1.2.0",
"@emotion/serialize": "^1.1.1",
"@emotion/use-insertion-effect-with-fallbacks": "^1.0.0",
"@emotion/utils": "^1.2.0"
},
"dependencies": {
"@emotion/babel-plugin": {
"version": "11.10.5",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.10.5.tgz",
"integrity": "sha512-xE7/hyLHJac7D2Ve9dKroBBZqBT7WuPQmWcq7HSGb84sUuP4mlOWoB8dvVfD9yk5DHkU1m6RW7xSoDtnQHNQeA==",
"requires": {
"@babel/helper-module-imports": "^7.16.7",
"@babel/plugin-syntax-jsx": "^7.17.12",
"@babel/runtime": "^7.18.3",
"@emotion/hash": "^0.9.0",
"@emotion/memoize": "^0.8.0",
"@emotion/serialize": "^1.1.1",
"babel-plugin-macros": "^3.1.0",
"convert-source-map": "^1.5.0",
"escape-string-regexp": "^4.0.0",
"find-root": "^1.1.0",
"source-map": "^0.5.7",
"stylis": "4.1.3"
}
},
"@emotion/hash": {
"version": "0.9.0",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.0.tgz",
"integrity": "sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ=="
},
"@emotion/is-prop-valid": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.0.tgz",
@ -52025,17 +52048,37 @@
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.0.tgz",
"integrity": "sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA=="
},
"@emotion/serialize": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.1.1.tgz",
"integrity": "sha512-Zl/0LFggN7+L1liljxXdsVSVlg6E/Z/olVWpfxUTxOAmi8NU7YoeWeLfi1RmnB2TATHoaWwIBRoL+FvAJiTUQA==",
"requires": {
"@emotion/hash": "^0.9.0",
"@emotion/memoize": "^0.8.0",
"@emotion/unitless": "^0.8.0",
"@emotion/utils": "^1.2.0",
"csstype": "^3.0.2"
}
},
"@emotion/unitless": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.0.tgz",
"integrity": "sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw=="
},
"@emotion/utils": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.2.0.tgz",
"integrity": "sha512-sn3WH53Kzpw8oQ5mgMmIzzyAaH2ZqFEbozVVBSYp538E06OSE6ytOp7pRAjNQR+Q/orwqdQYJSe2m3hCOeznkw=="
},
"stylis": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.1.3.tgz",
"integrity": "sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA=="
}
}
},
"@emotion/unitless": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.0.tgz",
"integrity": "sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw=="
"version": "0.7.5"
},
"@emotion/use-insertion-effect-with-fallbacks": {
"version": "1.0.0",
@ -53311,19 +53354,16 @@
},
"@jridgewell/gen-mapping": {
"version": "0.1.1",
"devOptional": true,
"requires": {
"@jridgewell/set-array": "^1.0.0",
"@jridgewell/sourcemap-codec": "^1.4.10"
}
},
"@jridgewell/resolve-uri": {
"version": "3.0.6",
"devOptional": true
"version": "3.0.6"
},
"@jridgewell/set-array": {
"version": "1.1.0",
"devOptional": true
"version": "1.1.0"
},
"@jridgewell/source-map": {
"version": "0.3.2",
@ -53345,12 +53385,10 @@
}
},
"@jridgewell/sourcemap-codec": {
"version": "1.4.11",
"devOptional": true
"version": "1.4.11"
},
"@jridgewell/trace-mapping": {
"version": "0.3.15",
"devOptional": true,
"requires": {
"@jridgewell/resolve-uri": "^3.0.3",
"@jridgewell/sourcemap-codec": "^1.4.10"
@ -64640,7 +64678,6 @@
},
"browserslist": {
"version": "4.20.3",
"devOptional": true,
"requires": {
"caniuse-lite": "^1.0.30001332",
"electron-to-chromium": "^1.4.118",
@ -64650,8 +64687,7 @@
},
"dependencies": {
"picocolors": {
"version": "1.0.0",
"devOptional": true
"version": "1.0.0"
}
}
},
@ -64884,8 +64920,7 @@
}
},
"caniuse-lite": {
"version": "1.0.30001335",
"devOptional": true
"version": "1.0.30001335"
},
"capital-case": {
"version": "1.0.4",
@ -66922,7 +66957,6 @@
},
"debug": {
"version": "4.3.4",
"devOptional": true,
"requires": {
"ms": "2.1.2"
}
@ -67685,8 +67719,7 @@
"dev": true
},
"electron-to-chromium": {
"version": "1.4.129",
"devOptional": true
"version": "1.4.129"
},
"element-resize-detector": {
"version": "1.2.4",
@ -67957,8 +67990,7 @@
"dev": true
},
"escalade": {
"version": "3.1.1",
"devOptional": true
"version": "3.1.1"
},
"escape-html": {
"version": "1.0.3",
@ -69636,8 +69668,7 @@
}
},
"gensync": {
"version": "1.0.0-beta.2",
"devOptional": true
"version": "1.0.0-beta.2"
},
"get-caller-file": {
"version": "2.0.5"
@ -69916,8 +69947,7 @@
}
},
"globals": {
"version": "11.12.0",
"devOptional": true
"version": "11.12.0"
},
"globalthis": {
"version": "1.0.3",
@ -74317,8 +74347,7 @@
}
},
"jsesc": {
"version": "2.5.2",
"devOptional": true
"version": "2.5.2"
},
"json-buffer": {
"version": "3.0.1",
@ -76692,8 +76721,7 @@
"dev": true
},
"ms": {
"version": "2.1.2",
"devOptional": true
"version": "2.1.2"
},
"multicast-dns": {
"version": "7.2.4",
@ -76917,8 +76945,7 @@
}
},
"node-releases": {
"version": "2.0.4",
"devOptional": true
"version": "2.0.4"
},
"node-stream-zip": {
"version": "1.15.0",
@ -81018,8 +81045,7 @@
}
},
"semver": {
"version": "6.3.0",
"devOptional": true
"version": "6.3.0"
},
"semver-diff": {
"version": "2.1.0",

View File

@ -51,6 +51,24 @@ class ProductRating extends AbstractBlock {
);
}
/**
* Get the block's attributes.
*
* @param array $attributes Block attributes. Default empty array.
* @return array Block attributes merged with defaults.
*/
private function parse_attributes( $attributes ) {
// These should match what's set in JS `registerBlockType`.
$defaults = array(
'productId' => 0,
'isDescendentOfQueryLoop' => false,
'textAlign' => '',
'isDescendentOfSingleProductBlock' => false,
);
return wp_parse_args( $attributes, $defaults );
}
/**
* Overwrite parent method to prevent script registration.
*
@ -68,28 +86,6 @@ class ProductRating extends AbstractBlock {
return [ 'query', 'queryId', 'postId' ];
}
/**
* Filter the output from wc_get_rating_html.
*
* @param string $html Star rating markup. Default empty string.
* @param float $rating Rating being shown.
* @param int $count Total number of ratings.
* @return string
*/
public function filter_rating_html( $html, $rating, $count ) {
$product_permalink = get_permalink();
if ( 0 < $rating || false === $product_permalink ) {
/* translators: %s: rating */
$label = sprintf( __( 'Rated %s out of 5', 'woo-gutenberg-products-block' ), $rating );
$html = '<div class="wc-block-components-product-rating__stars wc-block-grid__product-rating__stars" role="img" aria-label="' . esc_attr( $label ) . '">' . wc_get_star_rating_html( $rating, $count ) . '</div>';
} else {
$product_review_url = esc_url( $product_permalink . '#reviews' );
$html = '<a class="wc-block-components-product-rating__link" href="' . $product_review_url . '">' . __( 'Add review', 'woo-gutenberg-products-block' ) . '</a>';
}
return $html;
}
/**
* Include and render the block.
*
@ -109,13 +105,77 @@ class ProductRating extends AbstractBlock {
$product = wc_get_product( $post_id );
if ( $product ) {
$product_reviews_count = $product->get_review_count();
$product_rating = $product->get_average_rating();
$parsed_attributes = $this->parse_attributes( $attributes );
$is_descendent_of_single_product_block = $parsed_attributes['isDescendentOfSingleProductBlock'];
$styles_and_classes = StyleAttributesUtils::get_classes_and_styles_by_attributes( $attributes );
$text_align_styles_and_classes = StyleAttributesUtils::get_text_align_class_and_style( $attributes );
/**
* Filter the output from wc_get_rating_html.
*
* @param string $html Star rating markup. Default empty string.
* @param float $rating Rating being shown.
* @param int $count Total number of ratings.
* @return string
*/
$filter_rating_html = function( $html, $rating, $count ) use ( $product_rating, $product_reviews_count, $is_descendent_of_single_product_block ) {
$product_permalink = get_permalink();
$reviews_count = $count;
$average_rating = $rating;
if ( $product_rating ) {
$average_rating = $product_rating;
}
if ( $product_reviews_count ) {
$reviews_count = $product_reviews_count;
}
if ( 0 < $average_rating || false === $product_permalink ) {
/* translators: %s: rating */
$label = sprintf( __( 'Rated %s out of 5', 'woo-gutenberg-products-block' ), $average_rating );
$customer_reviews_count = sprintf(
/* translators: %s is referring to the total of reviews for a product */
_n(
'(%s customer review)',
'(%s customer reviews)',
$reviews_count,
'woo-gutenberg-products-block'
),
esc_html( $reviews_count )
);
$reviews_count_html = sprintf(
'<span class="wc-block-components-product-rating__reviews_count">
%1$s
</span>',
$customer_reviews_count
);
$html = sprintf(
'<div class="wc-block-components-product-rating__container">
<div class="wc-block-components-product-rating__stars wc-block-grid__product-rating__stars" role="img" aria-label="%1$s">
%2$s
</div>
%3$s
</div>
',
esc_attr( $label ),
wc_get_star_rating_html( $average_rating, $reviews_count ),
$is_descendent_of_single_product_block ? $reviews_count_html : ''
);
} else {
$product_review_url = esc_url( $product_permalink . '#reviews' );
$html = '<a class="wc-block-components-product-rating__link" href="' . $product_review_url . '">' . __( 'Add review', 'woo-gutenberg-products-block' ) . '</a>';
}
return $html;
};
add_filter(
'woocommerce_product_get_rating_html',
[ $this, 'filter_rating_html' ],
$filter_rating_html,
10,
3
);