Skip to content

Add product status badge to product form header #35460

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
joshuatf merged 9 commits into from
Nov 16, 2022
Merged

Add product status badge to product form header #35460

joshuatf merged 9 commits into from
Nov 16, 2022

Conversation

@joshuatf
Copy link
Contributor

@joshuatf joshuatf commented Nov 1, 2022

All Submissions:

Changes proposed in this Pull Request:

Adds the product status badge to the form header.

Screen Shot 2022-11-01 at 1 54 23 PM

Closes #35169 .

  • This PR is a very minor change/addition and does not require testing instructions (if checked you can ignore/remove the next section).

How to test the changes in this Pull Request:

  1. Navigate to the new product management experience ( Products -> Add new (MVP) )
  2. Note that the initial badge in the header next to the title is "Unsaved"
  3. Make some changes and click "Save draft"
  4. Note that the badge is now "Draft"
  5. Publish the product
  6. Note that the badge is "In stock"
  7. Manually set the product to "out of stock" in the inventory section and update
  8. Note that the badge is "Out of stock"
  9. Click "Track quantity for this product" and enter a positive quantity number and save
  10. Note that the badge is "In stock"
  11. Set the inventory quantity to 0 and save
  12. Note that the badge is "Out of stock"

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 created a changelog file for each project being changed, ie pnpm --filter=<project> changelog add?

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.

@joshuatf joshuatf requested a review from a team November 1, 2022 20:59
@joshuatf joshuatf self-assigned this Nov 1, 2022
@github-actions github-actions bot added focus: react admin plugin: woocommerce Issues related to the WooCommerce Core plugin. labels Nov 1, 2022
@github-actions
Copy link
Contributor

github-actions bot commented Nov 1, 2022 •
edited
Loading

Test Results Summary

Commit SHA: 7c0762e

Test 🧪Passed ✅Failed 🚨Broken 🚧Skipped ⏭️Unknown ❔Total 📊Duration ⏱️
API Tests26000202621m 9s
E2E Tests186006019215m 54s
To view the full API test report, click here.
To view the full E2E test report, click here.
To view all test reports, visit the WooCommerce Test Reports Dashboard.

louwie17
louwie17 previously approved these changes Nov 4, 2022
View reviewed changes
Copy link
Contributor

@louwie17 louwie17 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks good and tested well, I did leave one suggestion on using a Typescript enum instead of a JS object for the product status keys, this would help make the types a bit more robust.
But approving none the less.

plugins/woocommerce-admin/client/products/utils/get-product-status.ts Outdated
draft: 'draft',
instock: 'instock',
outofstock: 'outofstock',
};
Copy link
Contributor

@louwie17 louwie17 Nov 4, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Instead of making this an object, should we make this a TypeScript enum?

enum ProductStatusKeys {
  unsaved = 'unsaved',
...
}

That way we could pass the specific status types from getProductStatus instead of just string

Copy link
Contributor Author

@joshuatf joshuatf Nov 15, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good call! Updated!

Base automatically changed from update/35172 to trunk November 15, 2022 19:20
@joshuatf
Copy link
Contributor Author

joshuatf commented Nov 15, 2022

Thanks for the review, @louwie17! Added your suggestion in b75fd9a

louwie17
louwie17 previously approved these changes Nov 16, 2022
View reviewed changes
Copy link
Contributor

@louwie17 louwie17 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work on this @joshuatf this looks good, thanks for the enum update as well!
Approving this, although it does look like there might be some lint errors that need fixing.

louwie17
louwie17 approved these changes Nov 16, 2022
View reviewed changes
Copy link
Contributor

@louwie17 louwie17 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✅ LGTM 🚀

@joshuatf joshuatf merged commit 7bff5cb into trunk Nov 16, 2022
@joshuatf joshuatf deleted the add/35169 branch November 16, 2022 16:03
@github-actions github-actions bot added this to the 7.2.0 milestone Nov 16, 2022
@github-actions github-actions bot mentioned this pull request Dec 15, 2022
Closed
@github-actions github-actions bot mentioned this pull request Jan 25, 2023
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@louwie17 louwie17 louwie17 approved these changes

Assignees

@joshuatf joshuatf

Labels

plugin: woocommerce Issues related to the WooCommerce Core plugin.

Projects

None yet

Milestone

7.2.0

Development

Successfully merging this pull request may close these issues.

[Header] Product status badge

3 participants

@joshuatf @louwie17