feat(hits): add banner to instantsearch-js hits widget #6158
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
This is the third pull request to add support for no-code banners to the Hits widget (RFC). Building on the recent changes to the
Hits
instantsearch-ui-component
it updates theHits
instantsearch-js
widget to support a newbanner
template.EMERCH-1421
There will be a follow-on PR to update React InstantSearch.
Result
The hits widget tests have been updated to ensure that the new class names (
bannerRoot
,bannerImage
, andbannerLink
) and new optional banner template (using thehtml
template string and JSX approaches) are supported. No styling was applied in the examples or toinstantsearch.css
- that will most likely come in a follow-up PR.Additionally, the code was tested in the
getting-started
example codebase (connected to appId:F4T6CUV2AH
, index:products
in thebeta
environment - where the test rules with a banner consequence exists).Getting Started App (no query, with updated
item
template to match new index):Getting Started App (query:
nikon
;nikon camera promotion
alt text and links tohttps://www.nikonusa.com/
):Getting Started App (query:
doesnotexist
; to demonstrate banner without hits):