Add custom order fields drop-down to custom fields metabox under HPOS

[jorgeatorres]

Submission Review Guidelines:

• I have followed the WooCommerce Contributing Guidelines and the WordPress Coding Standards.
• I have checked to ensure there aren't other open Pull Requests for the same update/change.
• I have reviewed my code for security best practices.
• Following the above guidelines will result in quick merges and clear and detailed feedback when appropriate.

Changes proposed in this Pull Request:

This PR brings to HPOS the dropdown of custom fields that is available for regular posts in the WP admin edit screen.
This dropdown lists a selection of non-private meta keys from all other orders allowing easy re-use.

Closes #44029.

How to test the changes in this Pull Request:

Using the WooCommerce Testing Instructions Guide, include your detailed testing instructions:

1. Make sure HPOS is the selected order datastore in WC > Settings > Advanced > Features.
2. Ideally, start with a 0 orders setup.
3. Go to WC > Orders > Add order and confirm that no dropdown appears in the "Custom Fields" metabox and instead you see a regular input:
   
4. Fill out the order fields and make sure to also add a few meta keys / values inside the "Custom Fields" metabox. Make sure to add at least a few that don't start with _ as those are considered private.
5. Click "Create" to save the order.
6. Confirm that the "Add New Custom Field" form inside the "Custom Fields" metabox has a drop-down listing meta keys from other orders.
7. Test that you can add metadata to the order by choosing a meta key from the dropdown and specifying the value.
8. Test that you can add metadata to the order by clicking "Enter new" and entering any meta key / value combination.

Changelog entry

• Automatically create a changelog entry from the details below.

Significance

• Patch
• Minor
• Major

Type

• Fix - Fixes an existing bug
• Add - Adds functionality
• Update - Update existing functionality
• Dev - Development related task
• Tweak - A minor adjustment to the codebase
• Performance - Address performance issues
• Enhancement - Improvement to existing functionality

Message

Comment

[github-actions]

Test Results Summary

Commit SHA: 1ca9389

Test 🧪	Passed ✅	Failed 🚨	Broken 🚧	Skipped ⏭️	Unknown ❔	Total 📊	Duration ⏱️
API Tests	259	0	0	2	0	261	0m 38s
E2E Tests	246	0	0	101	0	347	8m 11s

---

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.

[github-actions]

Hi @coreymckrill,

Apart from reviewing the code changes, please make sure to review the testing instructions as well.

You can follow this guide to find out what good testing instructions should look like:
https://github.com/woocommerce/woocommerce/wiki/Writing-high-quality-testing-instructions

[coreymckrill]

👍 Tests all worked out fine. I left a few specific comments inline to discuss. I also noticed a discrepancy in where the "Add Custom Field" button lives between the CPT order screen and the HPOS order screen:

CPT

HPOS

This is also present in trunk, so it wasn't introduced by this PR, but this might be a good opportunity to include a fix if it's simple. (Also fine if you'd rather not address that here.)

[jorgeatorres]

Hi @coreymckrill!

Thanks for the review 🙇‍♂️. I've addressed most of your feedback, including the UI discrepancy. Please let me know what you think.

Also, don't forget to rebuild so you get the CSS that fixes the form's looks.

[coreymckrill]

👍 Looks great! Thanks for adding the fix for the button location in the UI.