Frontastic component name

Wishlist

Page type

Used in the My account Wishlist dynamic page

Example images

Code samples

{
  "tasticType": "frontastic/ui/wishlist",
  "name": "Frontastic UI wishlist",
  "icon": "list",
  "category": "Wishlist",
  "schema": []
}
import WishList from 'components/frontastic-ui/wishlist';
import { useWishlist } from 'frontastic/provider';
import React from 'react';
import { LineItem } from '@Types/wishlist/LineItem';

const WishlistTastic = () => {
  const { data } = useWishlist();
  const { removeLineItem } = useWishlist();

  const removeLineItems = async (item: LineItem) => {
    let itemsToRemove = data.lineItems.filter((lineItem) => lineItem.name === item.name);
    for await (const lineItem of itemsToRemove) {
      await removeLineItem(lineItem.lineItemId);
    }
  };

  return <WishList items={data} removeLineItems={removeLineItems} />;
};

export default WishlistTastic;

Did this page help you?