@riosst100/pwa-marketplace 2.0.8 → 2.0.9

package/src/overwrites/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode/couponCode.js

@@ -1,178 +0,0 @@
-import React, { Fragment, useEffect } from 'react';
-import { FormattedMessage, useIntl } from 'react-intl';
-import { AlertCircle as AlertCircleIcon } from 'react-feather';
-import { useToasts } from '@magento/peregrine';
-import { deriveErrorMessage } from '@magento/peregrine/lib/util/deriveErrorMessage';
-import { useCouponCode } from '@magento/peregrine/lib/talons/CartPage/PriceAdjustments/CouponCode/useCouponCode';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-
-import Button from '@magento/venia-ui/lib/components/Button';
-import { Form } from 'informed';
-import Field from '@magento/venia-ui/lib/components/Field';
-import Icon from '@magento/venia-ui/lib/components/Icon';
-import LinkButton from '@magento/venia-ui/lib/components/LinkButton';
-import TextInput from '@magento/venia-ui/lib/components/TextInput';
-
-import defaultClasses from './couponCode.module.css';
-
-const errorIcon = (
-    <Icon
-        src={AlertCircleIcon}
-        attrs={{
-            width: 18
-        }}
-    />
-);
-
-/**
- * A child component of the PriceAdjustments component.
- * This component renders a form for addingg a coupon code to the cart.
- *
- * @param {Object} props
- * @param {Function} props.setIsCartUpdating Function for setting the updating state for the cart.
- * @param {Object} props.classes CSS className overrides.
- * See [couponCode.module.css]{@link https://github.com/magento/pwa-studio/blob/develop/packages/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode/couponCode.module.css}
- * for a list of classes you can override.
- *
- * @returns {React.Element}
- *
- * @example <caption>Importing into your project</caption>
- * import CouponCode from "@magento/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode";
- */
-const CouponCode = props => {
-    const classes = useStyle(defaultClasses, props.classes);
-
-    const talonProps = useCouponCode({
-        setIsCartUpdating: props.setIsCartUpdating
-    });
-    const [, { addToast }] = useToasts();
-    const {
-        applyingCoupon,
-        data,
-        errors,
-        handleApplyCoupon,
-        handleApplyCouponOnEnter,
-        handleRemoveCoupon,
-        handleRemoveCouponOnEnter,
-        removingCoupon
-    } = talonProps;
-    const { formatMessage } = useIntl();
-
-    const removeCouponError = deriveErrorMessage([
-        errors.get('removeCouponMutation')
-    ]);
-
-    useEffect(() => {
-        if (removeCouponError) {
-            addToast({
-                type: 'error',
-                icon: errorIcon,
-                message: removeCouponError,
-                dismissable: true,
-                timeout: 10000
-            });
-        }
-    }, [addToast, removeCouponError]);
-
-    if (!data) {
-        return null;
-    }
-
-    if (errors.get('getAppliedCouponsQuery')) {
-        return (
-            <div className={classes.errorContainer}>
-                <FormattedMessage
-                    id={'couponCode.errorContainer'}
-                    defaultMessage={
-                        'Something went wrong. Please refresh and try again.'
-                    }
-                />
-            </div>
-        );
-    }
-
-    if (data.cart.applied_coupons) {
-        const codes = data.cart.applied_coupons.map(({ code }) => {
-            return (
-                <Fragment key={code}>
-                    <span>{code}</span>
-                    <LinkButton
-                        className={classes.removeButton}
-                        disabled={removingCoupon}
-                        data-cy="CouponCode-removeCouponButton"
-                        onClick={() => {
-                            handleRemoveCoupon(code);
-                        }}
-                        onKeyDown={() => {
-                            handleRemoveCouponOnEnter(code);
-                        }}
-                    >
-                        <FormattedMessage
-                            id={'couponCode.removeButton'}
-                            defaultMessage={'Remove'}
-                        />
-                    </LinkButton>
-                </Fragment>
-            );
-        });
-
-        return <div className={classes.appliedCoupon}>{codes}</div>;
-    } else {
-        const errorMessage = deriveErrorMessage([
-            errors.get('applyCouponMutation')
-        ]);
-
-        const formClass = errorMessage
-            ? classes.entryFormError
-            : classes.entryForm;
-
-        return (
-            <Form
-                data-cy="CouponCode-form"
-                className={formClass}
-                onSubmit={handleApplyCoupon}
-            >
-                <Field
-                    id="couponCode"
-                    label={formatMessage({
-                        id: 'cartPage.couponCode',
-                        defaultMessage: 'Coupon Code'
-                    })}
-                >
-                    <TextInput
-                        field="couponCode"
-                        id={'couponCode'}
-                        data-cy="CouponCode-couponCode"
-                        placeholder={formatMessage({
-                            id: 'couponCode.enterCode',
-                            defaultMessage: 'Enter code'
-                        })}
-                        mask={value => value && value.trim()}
-                        maskOnBlur={true}
-                        message={errorMessage}
-                    />
-                </Field>
-                <Field>
-                    <Button
-                        data-cy="CouponCode-submit"
-                        disabled={applyingCoupon}
-                        priority={'normal'}
-                        type={'submit'}
-                        onKeyDown={handleApplyCouponOnEnter}
-                        classes={{
-                            content: 'gap-1.5 grid-flow-col inline-grid items-center justify-center justify-items-center capitalize font-medium'
-                        }}
-                    >
-                        <FormattedMessage
-                            id={'couponCode.apply'}
-                            defaultMessage={'Apply'}
-                        />
-                    </Button>
-                </Field>
-            </Form>
-        );
-    }
-};
-
-export default CouponCode;

package/src/overwrites/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode/couponCode.module.css

@@ -1,52 +0,0 @@
-/* Styles for "add" view. */
-.entryForm,
-.entryFormError {
-    composes: gap-x-sm from global;
-    composes: grid from global;
-    composes: grid-cols-autoLast from global;
-}
-
-/* on mobile... */
-@media (max-width: 959px) {
-
-    .entryForm,
-    .entryFormError {
-        /* switch to rows. */
-        grid-template-columns: unset;
-        grid-template-rows: 1fr 1fr;
-    }
-}
-
-/* TODO @TW: cannot compose */
-.entryFormError input {
-    /* composes: border-error from global; */
-    border-color: rgb(var(--venia-global-color-red-400));
-}
-
-/* TODO @TW: cannot compose */
-.entryFormError input:focus {
-    /* composes: border-gray-600 from global; */
-    border-color: rgb(var(--venia-global-color-gray-600));
-}
-
-/* TODO @TW: cannot compose */
-.entryFormError p {
-    /* composes: text-error from global; */
-    color: rgb(var(--venia-global-color-error));
-    /* composes: font-medium from global; */
-    font-weight: 600;
-}
-
-.errorContainer {
-    composes: leading-normal from global;
-    /* Duplicate the left/right/bottom padding on the accordion section */
-    composes: pt-sm from global;
-    composes: text-error from global;
-}
-
-/* Styles for "removal" view. */
-.removeButton {
-    composes: root from '@magento/venia-ui/lib/components/LinkButton/linkButton.module.css';
-
-    composes: ml-xs from global;
-}

package/src/overwrites/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode/index.js

@@ -1 +0,0 @@
-export { default } from './couponCode';

package/src/overwrites/venia-ui/lib/components/CartPage/PriceAdjustments/GiftOptions/giftOptions.js

@@ -1,321 +0,0 @@
-import React from 'react';
-import { FormattedMessage, useIntl } from 'react-intl';
-import { Edit2 as EditIcon } from 'react-feather';
-import { Form } from 'informed';
-
-import { useGiftOptions } from '@magento/peregrine/lib/talons/CartPage/PriceAdjustments/GiftOptions/useGiftOptions';
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import Button from '@magento/venia-ui/lib/components/Button';
-import Checkbox from '@magento/venia-ui/lib/components/Checkbox';
-import Field from '@magento/venia-ui/lib/components/Field';
-import FormError from '@magento/venia-ui/lib/components/FormError';
-import Icon from '@magento/venia-ui/lib/components/Icon';
-import LoadingIndicator, {
-    Spinner
-} from '@magento/venia-ui/lib/components/LoadingIndicator';
-import LinkButton from '@magento/venia-ui/lib/components/LinkButton';
-import Price from '@magento/venia-ui/lib/components/Price';
-import TextArea from '@magento/venia-ui/lib/components/TextArea';
-import TextInput from '@magento/venia-ui/lib/components/TextInput';
-
-import defaultClasses from './giftOptions.module.css';
-
-/**
- * A child component of the PriceAdjustments component.
- * This component displays the form for adding gift options.
- *
- * @param {Object} props
- * @param {Object} [props.classes] CSS className overrides.
- * @param {Object} [props.giftOptionsConfigData] store config data.
- * See [giftOptions.module.css]{@link https://github.com/magento/pwa-studio/blob/develop/packages/venia-ui/lib/components/CartPage/PriceAdjustments/GiftOptions/giftOptions.module.css}
- * for a list of classes you can override.
- *
- * @returns {React.Element}
- *
- * @example <caption>Importing into your project</caption>
- * import GiftOptions from "@magento/venia-ui/lib/components/CartPage/PriceAdjustments/GiftOptions";
- */
-const GiftOptions = props => {
-    const { classes: propClasses } = props;
-    const {
-        loading,
-        errors,
-        savingOptions,
-        giftReceiptProps,
-        printedCardProps,
-        printedCardPrice,
-        giftMessageCheckboxProps,
-        giftMessageResult,
-        hasGiftMessage,
-        showGiftMessageResult,
-        cardToProps,
-        cardFromProps,
-        cardMessageProps,
-        editGiftMessageButtonProps,
-        cancelGiftMessageButtonProps,
-        saveGiftMessageButtonProps,
-        optionsFormProps
-    } = useGiftOptions();
-    const { formatMessage } = useIntl();
-    const classes = useStyle(defaultClasses, propClasses);
-
-    if (loading) {
-        return <LoadingIndicator />;
-    }
-
-    const { allow_order, allow_gift_receipt, allow_printed_card } =
-        props?.giftOptionsConfigData || {};
-
-    const includeGiftReceipt =
-        allow_gift_receipt === '1' ? (
-            <div className={classes.option}>
-                <div className={classes.checkboxContainer}>
-                    <Checkbox
-                        {...giftReceiptProps}
-                        data-cy="GiftOptions-includeGiftReceipt"
-                        label={formatMessage({
-                            id: 'giftOptions.includeGiftReceipt',
-                            defaultMessage: 'Include gift receipt'
-                        })}
-                    />
-                </div>
-
-                {savingOptions.includes(giftReceiptProps.field) ? (
-                    <div className={classes.savingContainer}>
-                        <span className={classes.savingText}>
-                            <FormattedMessage
-                                id={'giftOptions.saving'}
-                                defaultMessage={'Saving'}
-                            />
-                        </span>
-                        <Spinner classes={{ root: classes.savingSpinner }} />
-                    </div>
-                ) : null}
-            </div>
-        ) : null;
-
-    const includeGiftMessage =
-        allow_order === '1' ? (
-            <>
-                <div className={classes.option}>
-                    <div className={classes.checkboxContainer}>
-                        <Checkbox
-                            {...giftMessageCheckboxProps}
-                            data-cy="GiftOptions-includeGiftMessage"
-                            label={formatMessage({
-                                id: 'giftOptions.includeGiftMessage',
-                                defaultMessage: 'Optional Message'
-                            })}
-                        />
-                    </div>
-
-                    {savingOptions.includes('giftMessage') ? (
-                        <div className={classes.savingContainer}>
-                            <span className={classes.savingText}>
-                                <FormattedMessage
-                                    id={'giftOptions.saving'}
-                                    defaultMessage={'Saving'}
-                                />
-                            </span>
-                            <Spinner
-                                classes={{ root: classes.savingSpinner }}
-                            />
-                        </div>
-                    ) : null}
-                </div>
-
-                <div
-                    className={
-                        showGiftMessageResult
-                            ? classes.giftMessageResultContainer
-                            : classes.hidden
-                    }
-                >
-                    <div
-                        className={classes.giftMessageResult}
-                        data-cy="GiftOptions-giftMessageResult"
-                    >
-                        <p>
-                            <FormattedMessage
-                                id="giftOptions.giftMessageTo"
-                                defaultMessage="<strong>To:</strong> {cardTo}"
-                                values={{
-                                    cardTo: giftMessageResult.cardTo,
-                                    strong: chunks => <strong>{chunks}</strong>
-                                }}
-                            />
-                        </p>
-                        <p>
-                            <FormattedMessage
-                                id="giftOptions.giftMessageFrom"
-                                defaultMessage="<strong>From:</strong> {cardFrom}"
-                                values={{
-                                    cardFrom: giftMessageResult.cardFrom,
-                                    strong: chunks => <strong>{chunks}</strong>
-                                }}
-                            />
-                        </p>
-                        <p>{giftMessageResult.cardMessage}</p>
-                    </div>
-
-                    <LinkButton
-                        {...editGiftMessageButtonProps}
-                        classes={{ root: classes.editGiftMessageButton }}
-                        data-cy="GiftOptions-editGiftMessageButton"
-                    >
-                        <Icon
-                            classes={{ icon: null }}
-                            size={16}
-                            src={EditIcon}
-                        />
-                        <span className={classes.actionLabel}>
-                            <FormattedMessage
-                                id="giftOptions.editGiftMessageButton"
-                                defaultMessage="Edit"
-                            />
-                        </span>
-                    </LinkButton>
-                </div>
-
-                <div
-                    className={
-                        !showGiftMessageResult
-                            ? classes.giftMessageFields
-                            : classes.hidden
-                    }
-                >
-                    <Field
-                        id="to"
-                        label={formatMessage({
-                            id: 'giftOptions.to',
-                            defaultMessage: 'To'
-                        })}
-                    >
-                        <TextInput
-                            {...cardToProps}
-                            data-cy="GiftOptions-cardTo"
-                        />
-                    </Field>
-                    <Field
-                        id={cardFromProps.field}
-                        label={formatMessage({
-                            id: 'giftOptions.from',
-                            defaultMessage: 'From'
-                        })}
-                    >
-                        <TextInput
-                            {...cardFromProps}
-                            data-cy="GiftOptions-cardFrom"
-                        />
-                    </Field>
-                    <Field
-                        id="message"
-                        label={formatMessage({
-                            id: 'giftOptions.message',
-                            defaultMessage: 'Message'
-                        })}
-                    >
-                        <TextArea
-                            {...cardMessageProps}
-                            data-cy="GiftOptions-cardMessage"
-                            placeholder={formatMessage({
-                                id: 'giftOptions.cardMessage',
-                                defaultMessage: 'Enter your message here'
-                            })}
-                        />
-                    </Field>
-
-                    <div className={classes.giftMessageActions}>
-                        {hasGiftMessage ? (
-                            <Button
-                                {...cancelGiftMessageButtonProps}
-                                data-cy="GiftOptions-cancelGiftMessageButton"
-                            >
-                                <FormattedMessage
-                                    id="giftOptions.cancelGiftMessageButton"
-                                    defaultMessage="Cancel"
-                                />
-                            </Button>
-                        ) : null}
-                        <Button
-                            {...saveGiftMessageButtonProps}
-                            data-cy="GiftOptions-updateGiftMessageButton"
-                        >
-                            {hasGiftMessage ? (
-                                <FormattedMessage
-                                    id="giftOptions.updateGiftMessageButton"
-                                    defaultMessage="Update Message"
-                                />
-                            ) : (
-                                <FormattedMessage
-                                    id="giftOptions.addGiftMessage"
-                                    defaultMessage="Add Message"
-                                />
-                            )}
-                        </Button>
-                    </div>
-                </div>
-            </>
-        ) : null;
-
-    const includePrintedCard =
-        allow_printed_card === '1' ? (
-            <div className={classes.option}>
-                <div className={classes.checkboxContainer}>
-                    <Checkbox
-                        {...printedCardProps}
-                        data-cy="GiftOptions-includePrintedCard"
-                        label={formatMessage(
-                            {
-                                id: 'giftOptions.includePrintedCard',
-                                defaultMessage: 'Add printed card{price}'
-                            },
-                            {
-                                price:
-                                    printedCardPrice &&
-                                    printedCardPrice.value > 0 ? (
-                                        <>
-                                            {' ( + '}
-                                            <Price
-                                                currencyCode={
-                                                    printedCardPrice.currency
-                                                }
-                                                value={printedCardPrice.value}
-                                            />
-                                            {')'}
-                                        </>
-                                    ) : null
-                            }
-                        )}
-                    />
-                </div>
-
-                {savingOptions.includes(printedCardProps.field) ? (
-                    <div className={classes.savingContainer}>
-                        <span className={classes.savingText}>
-                            <FormattedMessage
-                                id={'giftOptions.saving'}
-                                defaultMessage={'Saving'}
-                            />
-                        </span>
-                        <Spinner classes={{ root: classes.savingSpinner }} />
-                    </div>
-                ) : null}
-            </div>
-        ) : null;
-
-    return (
-        <Form
-            data-cy="GiftOptions-form"
-            {...optionsFormProps}
-            className={classes.root}
-        >
-            <FormError errors={Array.from(errors.values())} />
-            {includeGiftReceipt}
-            {includeGiftMessage}
-            {includePrintedCard}
-        </Form>
-    );
-};
-
-export default GiftOptions;

package/src/overwrites/venia-ui/lib/components/CartPage/PriceAdjustments/GiftOptions/giftOptions.module.css

@@ -1,61 +0,0 @@
-.root {
-}
-
-.option {
-    composes: grid from global;
-    composes: px-0 from global;
-    composes: py-2 from global;
-    grid-template-columns: auto min-content;
-}
-
-.giftMessageResultContainer,
-.giftMessageFields {
-    composes: pb-4 from global;
-    composes: pl-8 from global;
-}
-
-.giftMessageResultContainer {
-    composes: gap-8 from global;
-    composes: items-start from global;
-
-    /* Small */
-    composes: sm_flex from global;
-    composes: sm_gap-12 from global;
-}
-
-.giftMessageResult p {
-    padding: 0.25rem 0;
-}
-
-.editGiftMessageButton {
-    composes: root from '../../../LinkButton/linkButton.module.css';
-    composes: mt-4 from global;
-
-    /* Small */
-    composes: sm_mt-2 from global;
-}
-
-.giftMessageActions {
-    composes: gap-4 from global;
-    composes: grid from global;
-    composes: mt-4 from global;
-
-    /* Small */
-    composes: sm_flex from global;
-}
-
-.savingContainer {
-    composes: flex from global;
-    composes: items-center from global;
-    composes: pl-4 from global;
-    composes: text-gray-500 from global;
-}
-
-.savingSpinner {
-    composes: root from '../../../LoadingIndicator/spinner.module.css';
-    composes: ml-2 from global;
-}
-
-.hidden {
-    composes: hidden from global;
-}

package/src/overwrites/venia-ui/lib/components/CartPage/PriceAdjustments/GiftOptions/index.js

@@ -1 +0,0 @@
-export { default } from './giftOptions';

package/src/overwrites/venia-ui/lib/components/CartPage/PriceAdjustments/ShippingMethods/index.js

@@ -1 +0,0 @@
-export { default } from './shippingMethods';