Skip to content
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

Refine ElasticPress blocks. #3403

Merged
merged 43 commits into from
Aug 8, 2023
Merged

Refine ElasticPress blocks. #3403

merged 43 commits into from
Aug 8, 2023

Conversation

JakePT
Copy link
Contributor

@JakePT JakePT commented Mar 23, 2023 •
edited
Loading

Description of the Change

Introduces the following features, improvements, and refinements to our blocks:

  • All blocks have been moved into an "ElasticPress" block category and the "(ElasticPress)" identifier has been removed from their names.
  • Descriptions and keywords have been added to all blocks.
  • All blocks now support the following features in themes that support them:
    • Color
      • Background
      • Link
      • Text
    • Position
      • Sticky
    • Spacing
      • Margin
      • Padding
    • Typography
      • Font size
      • Line height
  • The Facet blocks have been renamed from "Facet by..." to "Filter by...".
  • References to filtering by "Meta" have been replaced with "Metadata" for consistency with how WordPress documentation and New weighting screen with meta support #3068 refer to it.
  • The Filter by Taxonomy and Filter by Metadata blocks now share a single edit component to avoid code reuse.
  • Any functionality shared by the Filter by Metadata Range and the other Filter by blocks has been moved into shared components.
  • Custom block previews have been replaced with implementations of ServerSideRender.
  • REST API requests in edit components have been replaced with implementations of useSelect and a custom data store. This eliminates repeated API requests for data that has already been retrieved, including filterable taxonomies, meta fields, and meta range previews.
  • When adding Filter by Taxonomy or Filter by Metadata blocks, users are now prompted to select a taxonomy or meta field before a preview is shown. This is consistent with several core blocks and the existing functionality of the Facet by Meta Range block.
  • The labels for the block inspector panels containing controls for block attributes have all been changed to just "Settings" for consistency with core blocks that only have a single panel.
  • Labels and options have been normalized to sentence case for consistency with core.
  • The taxonomy options for the Filter by Taxonomy block have been changed to singular and the slug has been included in parentheses. This makes the options consistent with the Facet options in Instant Results, works better with the "Filter by..." label, resolves an inconsistency in the letter case and plurality of WooCommerce taxonomies and product attributes, and more clearly distinguishes different taxonomies with the same name.
  • Fixes an issue where the "Preview unavailable" message would not display for filters without values.

Closes #3384

How to test the Change

Changelog Entry

Added - New feature
Changed - Existing functionality
Deprecated - Soon-to-be removed feature
Removed - Feature
Fixed - Bug fix
Security - Vulnerability

Credits

Props @JakePT

Checklist:

  • I agree to follow this project's Code of Conduct.
  • I have updated the documentation accordingly.
  • I have added tests to cover my change.
  • All new and existing tests pass.

@JakePT
Refactor facet blocks.
3d790a8 
- Rename blocks to "Filter by..."
- Reduce code repetition by sharing Edit component between meta and taxonomy facets.
- Add an "ElasticPress" block category.
- Implement redux store for taxonomy and meta options.
- Replace custom API request with ServerSideRender.
- Updated block setting controls for consistency with core.
- Add transforms between meta and meta range blocks.
- Add support for various style options, eg. colors.
@JakePT JakePT self-assigned this Mar 23, 2023
@JakePT JakePT added this to the 5.0.0 milestone Mar 23, 2023
@JakePT JakePT changed the title WIP: Refine ElasticPress blocks. Refine ElasticPress blocks. Jun 7, 2023
@JakePT JakePT marked this pull request as ready for review June 7, 2023 22:54
@JakePT JakePT requested a review from felipeelia June 7, 2023 23:08
@JakePT JakePT modified the milestones: 5.0.0, 4.7.0 Jun 7, 2023
@JakePT JakePT mentioned this pull request Jun 7, 2023
Closed
1 task
@JakePT
Copy link
Contributor Author

JakePT commented Jun 27, 2023 •
edited
Loading

@oscarssanchez While working on these changes the Facet by Post Type block was introduced. To make that new block consistent with the changes made to the existing blocks, the following will need to be done:

  • Rename the block to "Filter by Post Type"
  • Add a description "Let visitors filter your content by post type."
  • Use the elasticpress block category.
  • Add keywords and textdomain to block.json.
  • Add support for the same features, namely color, position, spacing and typography.
  • Use the same filter icon.
  • Use the shared components for the order controls and display count control.
  • Display a placeholder when first inserting the block.
  • Create a post type control for selecting post type, based on the FacetMetaControl and FacetTaxonomyControl introduced in this PR.
  • To support the post type control you'll need to add actions to the store to retrieve post types.

@oscarssanchez oscarssanchez mentioned this pull request Jul 24, 2023
Merged
4 tasks
@JakePT JakePT assigned JakePT and unassigned JakePT Jul 31, 2023
felipeelia
felipeelia requested changes Aug 3, 2023
View reviewed changes
Copy link
Member

@felipeelia felipeelia left a comment

Choose a reason for hiding this comment

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

Overall it looks good @JakePT but we'll need to address a few things before merging it (especially the methods removal instead of deprecation)

assets/js/blocks/facets/common/components/empty-response-placeholder.js Show resolved Hide resolved
assets/js/blocks/facets/common/components/facet-order-control.js Outdated Show resolved Hide resolved
includes/classes/Feature/Facets/Types/Meta/Block.php Show resolved Hide resolved
includes/classes/Feature/Facets/Types/MetaRange/Block.php Show resolved Hide resolved
felipeelia
felipeelia requested changes Aug 3, 2023
View reviewed changes
Copy link
Member

@felipeelia felipeelia left a comment

Choose a reason for hiding this comment

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

a few more things @JakePT (i could be missing a few things, sorry in advance)

includes/classes/Feature/Facets/Facets.php Show resolved Hide resolved
includes/classes/Feature/Facets/Types/Meta/Block.php Outdated Show resolved Hide resolved
includes/classes/Feature/Facets/Types/MetaRange/Block.php Show resolved Hide resolved
includes/classes/Feature/Facets/Types/MetaRange/Block.php Show resolved Hide resolved
includes/classes/Feature/Facets/Types/Taxonomy/Block.php Show resolved Hide resolved
includes/classes/Feature/Facets/Types/Taxonomy/Block.php Show resolved Hide resolved
@JakePT JakePT linked an issue Aug 7, 2023 that may be closed by this pull request
Add E2E tests for block styles #3489
Closed
1 task
@felipeelia felipeelia merged commit e12fa2d into develop Aug 8, 2023
@felipeelia felipeelia deleted the feature/3384 branch August 8, 2023 18:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@felipeelia felipeelia felipeelia requested changes

Assignees

@JakePT JakePT

Labels
None yet
Projects
None yet
Milestone
4.7.0
Development

Successfully merging this pull request may close these issues.

Add E2E tests for block styles Refine ElasticPress blocks
3 participants
@JakePT @oscarssanchez @felipeelia