Skip to content
This repository has been archived by the owner on Dec 30, 2022. It is now read-only.

feat(insights): add insights support to Hits widget #665

Merged
merged 5 commits into from
Apr 26, 2019

Conversation

tkrugg
Copy link
Contributor

@tkrugg tkrugg commented Apr 23, 2019

Summary

This integrates insights with Vue Instantsearch to help using Click Analytics in Hits.

Using connectHitsWithInsights instead of connectHits exposed a new property insights to the internal state, which user can call to emit insights events.

Result

<ais-hits>
  <div slot-scope="{ items, insights }">
    <div v-for="item in items">
      <button @click="insights('clickedObjectIDsAfterSearch', { eventName: 'Add to cart', objectIDs: [item.objectID] })">Add to cart</button>
    </div>
  </div>
</ais-hits>

**Summary**
This integrates insights with Vue Instantsearch to help using Click
Analytics in Hits.

Using `connectHitsWithInsights` instead of `connectHits` exposed a new
property `insights` to the internal state, which user can call to emit
insights events.

**Result**
```html
<ais-hits>
  <div slot-scope="{ items, insights }">
    <div v-for="item in items">
      <button @click="insights('clickedObjectIDsAfterSearch', { eventName: 'Add to cart', objectIDs: [item.objectID] })">Add to cart</button>
    </div>
  </div>
</ais-hits>
```
stories/Hits.stories.js Outdated Show resolved Hide resolved
@Haroenv Haroenv self-requested a review April 23, 2019 10:32
Co-Authored-By: tkrugg <tkrugg@users.noreply.github.com>
@tkrugg tkrugg marked this pull request as ready for review April 24, 2019 12:06
@tkrugg tkrugg requested a review from a team April 24, 2019 12:16
src/components/Hits.vue Show resolved Hide resolved
@tkrugg tkrugg merged commit 2efa8c0 into master Apr 26, 2019
@Haroenv Haroenv deleted the feat/insights-with-vue-is-in-hits branch April 26, 2019 11:50
Haroenv pushed a commit to algolia/instantsearch that referenced this pull request Dec 28, 2022
…antsearch#665)

* feat(insights): add insights support to Hits widget

**Summary**
This integrates insights with Vue Instantsearch to help using Click
Analytics in Hits.

Using `connectHitsWithInsights` instead of `connectHits` exposed a new
property `insights` to the internal state, which user can call to emit
insights events.

**Result**
```html
<ais-hits>
  <div slot-scope="{ items, insights }">
    <div v-for="item in items">
      <button @click="insights('clickedObjectIDsAfterSearch', { eventName: 'Add to cart', objectIDs: [item.objectID] })">Add to cart</button>
    </div>
  </div>
</ais-hits>
```

* fix: typo

Co-Authored-By: tkrugg <tkrugg@users.noreply.github.com>

* fix: prettier

* fix: expose insights in item slot
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants