Product slider

{
  "tasticType": "commercetools/ui/products/slider",
  "name": "commercetools UI product slider",
  "icon": "menu",
  "category": "Products",
  "schema": [
    {
      "name": "Configuration",
      "fields": [
        {
          "label": "Title",
          "field": "title",
          "type": "string",
          "required": true
        },
        {
          "label": "products",
          "field": "data",
          "type": "dataSource",
          "dataSourceType": "frontastic/product-list",
          "required": true
        }
      ]
    },
    {
      "name": "CTA",
      "fields": [
        {
          "label": "Label",
          "field": "ctaLabel",
          "type": "string"
        },
        {
          "label": "Link",
          "field": "ctaLink",
          "type": "reference"
        }
      ]
    }
  ]
}

import ProductSlider from 'components/commercetools-ui/products/slider';

function ProductSliderTastic({ data }) {
  if (!data?.data?.dataSource?.items) return <p>No products found.</p>;

  return (
    <ProductSlider
      products={data.data.dataSource.items}
      title={data.title}
      ctaLabel={data.ctaLabel}
      ctaLink={data.ctaLink}
    />
  );
}

export default ProductSliderTastic;