@shopgate/engage
Version:
Shopgate's ENGAGE library.
58 lines (57 loc) • 2.09 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import { i18n } from '@shopgate/engage/core';
import { LocationIcon, ResponsiveContainer } from '@shopgate/engage/components';
import { BOPIS, CartItemProductChangeLocation } from '@shopgate/engage/locations';
import { useCartItem } from "../CartItem";
import CartItemCardReservationLabelChangeStore from "./CartItemCardReservationLabelChangeStore";
import { address, addressIcon, titles, name, method } from "./CartItemCard.style";
/** @typedef {import('@shopgate/engage/locations/locations.types').LocationAware} LocationAware */
/**
* Renders the cart reservation card label.
* @param {LocationAware} props The component props.
* @returns {JSX.Element|null}
*/
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export function CartItemCardReservationLabel({
location,
fulfillmentMethod
}) {
const {
cartItem,
isEditable,
registerFulfillmentAction
} = useCartItem();
if (!location) {
return null;
}
const suffix = fulfillmentMethod === BOPIS ? 'bopis' : 'ropis';
return /*#__PURE__*/_jsxs("div", {
className: address,
children: [/*#__PURE__*/_jsx("div", {
className: addressIcon,
children: /*#__PURE__*/_jsx(LocationIcon, {})
}), /*#__PURE__*/_jsxs("div", {
className: titles,
children: [/*#__PURE__*/_jsx("div", {
className: name,
children: location.name
}), isEditable && /*#__PURE__*/_jsxs(ResponsiveContainer, {
webOnly: true,
breakpoint: ">xs",
children: [/*#__PURE__*/_jsx(CartItemCardReservationLabelChangeStore, {}), /*#__PURE__*/_jsx(CartItemProductChangeLocation, {
cartItem: cartItem,
registerAction: registerFulfillmentAction
})]
}), /*#__PURE__*/_jsx(ResponsiveContainer, {
appAlways: true,
breakpoint: "<=xs",
children: /*#__PURE__*/_jsx("div", {
className: method,
children: i18n.text(`locations.method.${suffix}`)
})
})]
})]
});
}
export default CartItemCardReservationLabel;