Track User Interactions
When using Custom Components you might want to track user interactions like add to cart or product click on a Product Card so that the information can be stored in the Dashboard.
Available trigger functions for support Track User Interations :
You can include a trigger function in your Custom Component by following example code below :
Add to Cart
See the API reference of addToCartTrigger.
import { addToCartTrigger } from '@sledge-app/api';
...
export default function SledgeProductCard({ product, sourceApp }: any) {
...
return (
...
<button
type="button"
onClick={() => {
// Put your add to cart functionality here
addToCartTrigger({
sourceApp,
productId: product.id,
});
}}
>
Add to Cart
</button>
...
);
}Product Click
See the API reference of productClickTrigger.
import { productClickTrigger } from '@sledge-app/api';
import { Link } from '@remix-run/react';
...
export default function SledgeProductCard({ product, sourceApp }: any) {
...
return (
...
<Link
to={'/products/' + product.handle}
onClick={() => {
// Put your add to cart functionality here
productClickTrigger({
sourceApp,
productId: product.id,
});
}}
>
{product.title}
</Link>
...
);
}