Add ratings, reviews and icons into Marketplace's Product Cards #30840

tgglv · 2021-09-29T20:11:56Z

All Submissions:

Have you followed the WooCommerce Contributing guideline?
Does your code follow the WordPress' coding standards?
Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

The search on WooCommerce > Marketplace page that shows product from the WooCommerce.com marketplace as cards. During previous re-design phase we added updated product cards in #30410.

This PR updates those product cards by:

replacing a product image with icon (if it exists) that fits better
mentioning a vendor who developed a product together with a link to reach the rest of their products on WooCommerce.com
adding an average rating represented as 5 stars (golden, gray, or 50/50)
adding the number of reviews left by customers for the product

Also, the text color for recurring payment cadence ("per year") was changed according to the design.

Closes 10867-gh-Automattic/woocommerce.com

How to test the changes in this Pull Request:

Check out this branch to your local environment
Go to WooCommerce > Marketplace
Search for "memberships"
Ensure you see products like WooCommerce Memberships that contain:
- icon (instead of a product image),
- developed by ... (with a link to a vendor page on WooCommerce.com)
- average rating represented as stars
- number of reviews left by customers

Other information:

Have you added an explanation of what your changes do and why you'd like us to include them?
Have you written new tests for your changes, as applicable?
Have you successfully run tests with your changes locally?

Changelog entry

Enhancement - Add ratings, reviews and icons into Marketplace's Product Cards.

FOR PR REVIEWER ONLY:

I have reviewed that everything is sanitized/escaped appropriately for any SQL or XSS injection possibilities. I made sure Linting is not ignored or disabled.

tgglv · 2021-09-30T08:53:11Z

Local test run results:

Test Suites: 2 failed, 2 skipped, 36 passed, 38 of 40 total
Tests:       9 failed, 5 skipped, 173 passed, 187 total

Failed scenarios:

Import Products from a CSV file › can upload the CSV file and import products
A japanese store can complete the selective bundle install but does not include WCPay. › should display the choose payments task, and not the woocommerce payments task

It looks like failed tests aren't connected with the changes.

andfinally

Looks great, thanks! I just left a couple of minor suggestions.

includes/admin/views/html-admin-page-addons.php

kloon

Changes looks great so far @tgglv, just left a small couple of comments that needs addressing.

includes/admin/views/html-admin-page-addons.php

kloon · 2021-10-05T13:00:49Z

includes/admin/views/html-admin-page-addons.php

+											<span class="price"><?php esc_html_e( 'Free', 'woocommerce' ); ?></span>
+										<?php else : ?>
+											<span class="price"><?php echo wp_kses_post( $addon->price ); ?></span>
+											<span class="price-suffix"><?php esc_html_e( 'per year', 'woocommerce' ); ?></span>


How about we fetch the suffix from the API with a fallback to per year?

Added in 4e370a4. I'm not sure how we'd translate such strings – we'll have to start passing the locale to the endpoint. Added 11488-gh-Automattic/woocommerce.com for the back end changes.

corsonr · 2021-10-07T07:24:37Z

@tgglv I just tested it, and that works beautifully! Just a small comment, I'd suggest that the comments in the admin.scss file use the following format // comment instead of /* comment */ so that they do not render in the compiled file.

I made the changes in this diff file in case you want to implement it.

andfinally

Thanks for the changes, looking good! Approving on the assumption we'll apply Gerhard and Remi's suggestions.

andfinally · 2021-10-13T11:54:11Z

I took the liberty to pushing Remi's comment changes to the branch. Still waiting for confirmation on the UTM tags from marketing.

vedanshujain

Left a minor comment. Looks like tests are also failing but seems unrelated, can you please rebase with latest trunk to see if that fixes the failing tests.

vedanshujain · 2021-10-13T11:57:00Z

includes/admin/views/html-admin-page-addons.php

+ *
+ * @return string CSS class to use.
+ */
+function wccom_get_star_class( $rating, $index ) {


can we move this function to class-wc-admin-addons.php? seems like this can be used in multiple views in the future and not just this one.

Thanks, @vedanshujain! Addressed in 8e2f8bd.

tgglv · 2021-10-13T15:30:44Z

Left a minor comment. Looks like tests are also failing but seems unrelated, can you please rebase with latest trunk to see if that fixes the failing tests.

@vedanshujain, it seems that the problem is in the trunk as well.
Solved the problem with tests by changing hash in the composer.lock. It looks like coincidentally phpunit files in cache break running composer install.

…om/woocommerce/woocommerce/pull/30840\#issuecomment-942422984.

vedanshujain

Thanks for the changes, LGTM! I am not merging it just yet, and will leave it to @Konamiman to see where we want to fix the composer for unit tests.

Konamiman · 2021-10-14T09:18:32Z

I am not merging it just yet, and will leave it to @Konamiman to see where we want to fix the composer for unit tests.

Also there are merge conflicts, once fixed let's see what can we do with that composer.json thing.

…ketplace-product-card

github-actions · 2021-10-14T14:15:14Z

Hi @Konamiman, thanks for merging this pull request. Please take a look at these follow-up tasks you may need to perform:

Add the status: needs changelog label
Add the status: needs testing instructions label

… allowing prices per month. This was added in #30840, but was accidentally omitted when we fixed conflicts.

tgglv self-assigned this Sep 29, 2021

tgglv marked this pull request as ready for review September 30, 2021 08:49

tgglv requested review from andfinally and vedanshujain September 30, 2021 08:49

tgglv added the needs: author feedback The issue/PR needs a response from any of the parties involved in the issue. label Sep 30, 2021

github-actions bot added needs: triage feedback Issues for which we requested feedback from the author and received it. and removed needs: author feedback The issue/PR needs a response from any of the parties involved in the issue. labels Sep 30, 2021

tgglv added needs: author feedback The issue/PR needs a response from any of the parties involved in the issue. and removed needs: triage feedback Issues for which we requested feedback from the author and received it. labels Sep 30, 2021

andfinally added this to the In-App Marketplace milestone Oct 1, 2021

andfinally previously approved these changes Oct 1, 2021

View reviewed changes

includes/admin/views/html-admin-page-addons.php Outdated Show resolved Hide resolved

includes/admin/views/html-admin-page-addons.php Outdated Show resolved Hide resolved

tgglv dismissed andfinally’s stale review via 2461d20 October 5, 2021 11:50

tgglv requested a review from andfinally October 5, 2021 11:51

kloon suggested changes Oct 5, 2021

View reviewed changes

kloon self-requested a review October 5, 2021 13:04

github-actions bot added needs: triage feedback Issues for which we requested feedback from the author and received it. and removed needs: author feedback The issue/PR needs a response from any of the parties involved in the issue. labels Oct 7, 2021

andfinally previously approved these changes Oct 8, 2021

View reviewed changes

andfinally requested a review from a team October 13, 2021 11:17

andfinally dismissed their stale review via aa49200 October 13, 2021 11:23

vedanshujain reviewed Oct 13, 2021

View reviewed changes

tgglv and others added 6 commits October 13, 2021 16:59

Add stars and reviews number

85a8940

Use icon instead of image if possible

3801977

Add developed-by string

1492f8f

Show ratings with the use of stars

bf5e4ef

Address review comments

b2b0761

Changed SCSS comments.

a31f874

tgglv added 4 commits October 13, 2021 17:58

Try add phpunit into deps

db64f58

Fix linter bugs

a0745a6

Move get_star_class out of template file

8e2f8bd

Revert composer.json

3136dbb

tgglv requested review from andfinally and vedanshujain October 13, 2021 15:27

andfinally mentioned this pull request Oct 13, 2021

In-App Marketplace Category Banners #30938

Merged

7 tasks

andfinally referenced this pull request Oct 13, 2021

Updated content-hash to try and fix phpunit failure. https://github.c…

2fd1682

…om/woocommerce/woocommerce/pull/30840\#issuecomment-942422984.

andfinally mentioned this pull request Oct 13, 2021

Revamp Featured page in WooCommerce Marketplace #30900

Merged

7 tasks

vedanshujain previously approved these changes Oct 14, 2021

View reviewed changes

Merge remote-tracking branch 'origin/trunk' into add/reviews-into-mar…

5b28b29

…ketplace-product-card

tgglv dismissed vedanshujain’s stale review via 5b28b29 October 14, 2021 11:19

Konamiman modified the milestones: In-App Marketplace, 5.9.0 Oct 14, 2021

Konamiman merged commit 30df9f4 into trunk Oct 14, 2021

Konamiman deleted the add/reviews-into-marketplace-product-card branch October 14, 2021 14:14

tammullen added testing instructions added and removed release: add testing instructions PRs that have not had testing instructions added to the wiki. [auto] labels Oct 20, 2021

andfinally added a commit that referenced this pull request Oct 25, 2021

Restored support for price suffix in in-app marketplace product card,…

7173171

… allowing prices per month. This was added in #30840, but was accidentally omitted when we fixed conflicts.

andfinally mentioned this pull request Oct 25, 2021

Support dynamic price_suffix in in-app marketplace #31026

Merged

7 tasks

Add ratings, reviews and icons into Marketplace's Product Cards #30840

Add ratings, reviews and icons into Marketplace's Product Cards #30840

Uh oh!

Conversation

tgglv commented Sep 29, 2021 • edited by Konamiman Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

All Submissions:

Changes proposed in this Pull Request:

How to test the changes in this Pull Request:

Other information:

Changelog entry

FOR PR REVIEWER ONLY:

Uh oh!

tgglv commented Sep 30, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

andfinally left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

kloon left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

kloon Oct 5, 2021

Choose a reason for hiding this comment

Uh oh!

andfinally Oct 13, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

corsonr commented Oct 7, 2021

Uh oh!

andfinally left a comment

Choose a reason for hiding this comment

Uh oh!

andfinally commented Oct 13, 2021 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

vedanshujain left a comment

Choose a reason for hiding this comment

Uh oh!

vedanshujain Oct 13, 2021

Choose a reason for hiding this comment

Uh oh!

tgglv Oct 13, 2021

Choose a reason for hiding this comment

Uh oh!

tgglv commented Oct 13, 2021

Uh oh!

vedanshujain left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Konamiman commented Oct 14, 2021

Uh oh!

github-actions bot commented Oct 14, 2021

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

8 participants

tgglv commented Sep 29, 2021 •

edited by Konamiman

Loading

tgglv commented Sep 30, 2021 •

edited

Loading

andfinally Oct 13, 2021 •

edited

Loading

andfinally commented Oct 13, 2021 •

edited

Loading

vedanshujain left a comment •

edited

Loading