npm - @edx/frontend-app-subscription-manage - Versions diffs - 1.18.2 → 1.19.0 - Mend

@edx/frontend-app-subscription-manage 1.18.2 → 1.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (97) hide show

package/dist/components/ActiveSubscription/ActiveSubscription.js CHANGED Viewed

@@ -6,7 +6,7 @@ import { useIntl } from '@openedx/frontend-base';
 import { Link } from 'react-router-dom';
 import { formatDisplayDate } from '../../utils/formatDate';
 import { resolvePlanLabel } from '../../utils/subscriptionView';
-import { MANAGE_PAGE_PATH, STRIPE_PAYMENT_GATEWAY } from '../../constants';
+import { ORDER_HISTORY_PAGE_PATH, STRIPE_PAYMENT_GATEWAY } from '../../constants';
 import UpdatePaymentMethodModal from '../UpdatePaymentMethodModal/UpdatePaymentMethodModal';
 import messages from '../messages';
 import { trackManageSubscriptionUpdatePaymentButtonClick } from '../../tracking';
@@ -23,9 +23,9 @@ const ActiveSubscription = ({ subscriber }) => {
         trackManageSubscriptionUpdatePaymentButtonClick({ buttonName: 'updatePayment' });
         setIsPaymentModalOpen(true);
     };
-    return (_jsxs("section", { className: "manage-section mt-4", children: [_jsx("h2", { className: "manage-section__title h3 font-weight-bold text-primary-500 mb-1", children: formatMessage(messages['manage.active.heading']) }), sinceDate && (_jsx("p", { className: "manage-section__subtitle text-gray-700 mb-3", children: formatMessage(messages['manage.active.since'], { date: sinceDate }) })), _jsxs("div", { className: "manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded", children: [_jsxs("div", { className: "manage-card__content", children: [_jsxs("div", { className: "manage-card__status-row d-flex align-items-center mb-1", children: [_jsx(Icon, { src: SpinnerIcon, className: "manage-card__status-badge manage-card__status-badge--sync flex-shrink-0", "aria-hidden": true }), _jsx("span", { className: "manage-card__status-label font-weight-bold text-primary-500", children: formatMessage(plan === 'annual'
-                                            ? messages['manage.active.statusAnnual']
-                                            : messages['manage.active.statusMonthly']) })] }), nextPayment && (_jsx("p", { className: "manage-card__body text-gray-700 mb-0", children: formatMessage(messages['manage.active.nextPayment'], { date: nextPayment }) }))] }), ((payment_method === null || payment_method === void 0 ? void 0 : payment_method.toLowerCase()) === STRIPE_PAYMENT_GATEWAY) && (_jsx("div", { className: "manage-card__actions manage-card__actions--row d-flex flex-wrap align-items-center flex-shrink-0 justify-content-end", children: _jsx(Button, { className: "manage-btn manage-btn--dark", variant: "primary", onClick: handleUpdatePaymentClick, disabled: !canUpdatePayment, children: formatMessage(messages['manage.active.updatePayment']) }) }))] }), _jsxs("p", { className: "manage-cancel-prompt mt-3 text-right text-gray-700 small", children: [formatMessage(messages['manage.active.cancelPrompt']), ' ', _jsx(Link, { className: "manage-cancel-prompt__link text-info-500 font-weight-bold text-decoration-none", to: `/${MANAGE_PAGE_PATH}/cancel`, children: formatMessage(messages['manage.active.cancelLink']) })] }), _jsx(UpdatePaymentMethodModal, { isOpen: isPaymentModalOpen, onClose: () => setIsPaymentModalOpen(false), subscriptionBiId: subscriber === null || subscriber === void 0 ? void 0 : subscriber.subscriptionBiId, nextBillingDate: nextPayment })] }));
+    return (_jsxs("section", { className: "manage-section mt-4", children: [_jsx("h2", { className: "manage-section__title h3 font-weight-bold text-primary-500 mb-1", children: formatMessage(messages['order-history.active.heading']) }), sinceDate && (_jsx("p", { className: "manage-section__subtitle text-gray-700 mb-3", children: formatMessage(messages['order-history.active.since'], { date: sinceDate }) })), _jsxs("div", { className: "manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded", children: [_jsxs("div", { className: "manage-card__content", children: [_jsxs("div", { className: "manage-card__status-row d-flex align-items-center mb-1", children: [_jsx(Icon, { src: SpinnerIcon, className: "manage-card__status-badge manage-card__status-badge--sync flex-shrink-0", "aria-hidden": true }), _jsx("span", { className: "manage-card__status-label font-weight-bold text-primary-500", children: formatMessage(plan === 'annual'
+                                            ? messages['order-history.active.statusAnnual']
+                                            : messages['order-history.active.statusMonthly']) })] }), nextPayment && (_jsx("p", { className: "manage-card__body text-gray-700 mb-0", children: formatMessage(messages['order-history.active.nextPayment'], { date: nextPayment }) }))] }), ((payment_method === null || payment_method === void 0 ? void 0 : payment_method.toLowerCase()) === STRIPE_PAYMENT_GATEWAY) && (_jsx("div", { className: "manage-card__actions manage-card__actions--row d-flex flex-wrap align-items-center flex-shrink-0 justify-content-end", children: _jsx(Button, { className: "manage-btn manage-btn--dark", variant: "primary", onClick: handleUpdatePaymentClick, disabled: !canUpdatePayment, children: formatMessage(messages['order-history.active.updatePayment']) }) }))] }), _jsxs("p", { className: "manage-cancel-prompt mt-3 text-right text-gray-700 small", children: [formatMessage(messages['order-history.active.cancelPrompt']), ' ', _jsx(Link, { className: "manage-cancel-prompt__link text-info-500 font-weight-bold text-decoration-none", to: `/${ORDER_HISTORY_PAGE_PATH}/cancel`, children: formatMessage(messages['order-history.active.cancelLink']) })] }), _jsx(UpdatePaymentMethodModal, { isOpen: isPaymentModalOpen, onClose: () => setIsPaymentModalOpen(false), subscriptionBiId: subscriber === null || subscriber === void 0 ? void 0 : subscriber.subscriptionBiId, nextBillingDate: nextPayment })] }));
 };
 export default ActiveSubscription;
 //# sourceMappingURL=ActiveSubscription.js.map

package/dist/components/ActiveSubscription/ActiveSubscription.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActiveSubscription.js","sourceRoot":"","sources":["../../../src/components/ActiveSubscription/ActiveSubscription.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGxC,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAChE,OAAO,EAAE,~~gBAAgB~~,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;~~AAC3E~~,OAAO,wBAAwB,MAAM,sDAAsD,CAAC;AAC5F,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,+CAA+C,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AAMvE,MAAM,kBAAkB,GAAsC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE;IAC/E,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpE,MAAM,IAAI,GAAG,gBAAgB,CAAC,UAAU,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,iBAAiB,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,qBAAqB,CAAC,CAAC;IACvE,MAAM,WAAW,GAAG,iBAAiB,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,gBAAgB,CAAC,CAAC;IACpE,MAAM,gBAAgB,GAAG,OAAO,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,gBAAgB,CAAC,CAAC;IAC/D,MAAM,EAAE,cAAc,EAAE,GAAG,sBAAsB,EAAE,CAAC;IAEpD,MAAM,wBAAwB,GAAG,GAAG,EAAE;QACpC,+CAA+C,CAAC,EAAE,UAAU,EAAE,eAAe,EAAE,CAAC,CAAC;QACjF,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC,CAAC;IAEF,OAAO,CACL,mBAAS,SAAS,EAAC,qBAAqB,aACtC,aAAI,SAAS,EAAC,iEAAiE,YAC5E,aAAa,CAAC,QAAQ,CAAC,~~uBAAuB~~,CAAC,CAAC,~~GAC9C~~,EACJ,SAAS,IAAI,CACZ,YAAG,SAAS,EAAC,6CAA6C,YACvD,aAAa,CAAC,QAAQ,CAAC,~~qBAAqB~~,CAAC,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,~~GAClE~~,CACL,EAED,eAAK,SAAS,EAAC,yHAAyH,aACtI,eAAK,SAAS,EAAC,sBAAsB,aACnC,eAAK,SAAS,EAAC,wDAAwD,aACrE,KAAC,IAAI,IACH,GAAG,EAAE,WAAW,EAChB,SAAS,EAAC,yEAAyE,wBAEnF,EACF,eAAM,SAAS,EAAC,6DAA6D,YAC1E,aAAa,CACZ,IAAI,KAAK,QAAQ;4CACf,CAAC,CAAC,QAAQ,CAAC,~~4BAA4B~~,CAAC;~~4CACxC~~,CAAC,CAAC,QAAQ,CAAC,~~6BAA6B~~,CAAC,~~CAC5C~~,GACI,IACH,EACL,WAAW,IAAI,CACd,YAAG,SAAS,EAAC,sCAAsC,YAChD,aAAa,CAAC,QAAQ,CAAC,~~2BAA2B~~,CAAC,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,~~GAC1E~~,CACL,IACG,EAEL,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,EAAE,MAAK,sBAAsB,CAAC,IAAI,CAC7D,cAAK,SAAS,EAAC,sHAAsH,YACnI,KAAC,MAAM,IACL,SAAS,EAAC,6BAA6B,EACvC,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,wBAAwB,EACjC,QAAQ,EAAE,CAAC,gBAAgB,YAE1B,aAAa,CAAC,QAAQ,CAAC,~~6BAA6B~~,CAAC,CAAC,~~GAChD~~,GACL,CACP,IACG,EAEN,aAAG,SAAS,EAAC,0DAA0D,aACpE,aAAa,CAAC,QAAQ,CAAC,~~4BAA4B~~,CAAC,CAAC,~~EACrD~~,GAAG,EACJ,KAAC,IAAI,IAAC,SAAS,EAAC,gFAAgF,EAAC,EAAE,EAAE,IAAI,~~gBAAgB~~,SAAS,~~YAC/H~~,aAAa,CAAC,QAAQ,CAAC,~~0BAA0B~~,CAAC,CAAC,~~GAC/C~~,IACL,EAEJ,KAAC,wBAAwB,IACvB,MAAM,EAAE,kBAAkB,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAC3C,gBAAgB,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,gBAAgB,EAC9C,eAAe,EAAE,WAAW,GAC5B,IACM,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import React, { useState } from 'react';\nimport { Button, Icon } from '@openedx/paragon';\nimport { SpinnerIcon } from '@openedx/paragon/icons';\nimport { useIntl } from '@openedx/frontend-base';\nimport { Link } from 'react-router-dom';\n\nimport type { CurrentUserSubscriberResult } from '../../types';\nimport { formatDisplayDate } from '../../utils/formatDate';\nimport { resolvePlanLabel } from '../../utils/subscriptionView';\nimport { ~~MANAGE_PAGE_PATH~~, STRIPE_PAYMENT_GATEWAY } from '../../constants';\nimport UpdatePaymentMethodModal from '../UpdatePaymentMethodModal/UpdatePaymentMethodModal';\nimport messages from '../messages';\nimport { trackManageSubscriptionUpdatePaymentButtonClick } from '@src/tracking';\nimport { getCommonTrackingProps } from '@src/tracking/trackingContext';\n\ninterface ActiveSubscriptionProps {\n subscriber: CurrentUserSubscriberResult \| null,\n}\n\nconst ActiveSubscription: React.FC<ActiveSubscriptionProps> = ({ subscriber }) => {\n const { formatMessage } = useIntl();\n const [isPaymentModalOpen, setIsPaymentModalOpen] = useState(false);\n const plan = resolvePlanLabel(subscriber);\n const sinceDate = formatDisplayDate(subscriber?.subscriptionStartDate);\n const nextPayment = formatDisplayDate(subscriber?.currentPeriodEnd);\n const canUpdatePayment = Boolean(subscriber?.subscriptionBiId);\n const { payment_method } = getCommonTrackingProps();\n\n const handleUpdatePaymentClick = () => {\n trackManageSubscriptionUpdatePaymentButtonClick({ buttonName: 'updatePayment' });\n setIsPaymentModalOpen(true);\n };\n\n return (\n <section className=\"manage-section mt-4\">\n <h2 className=\"manage-section__title h3 font-weight-bold text-primary-500 mb-1\">\n {formatMessage(messages['~~manage~~.active.heading'])}\n </h2>\n {sinceDate && (\n <p className=\"manage-section__subtitle text-gray-700 mb-3\">\n {formatMessage(messages['~~manage~~.active.since'], { date: sinceDate })}\n </p>\n )}\n\n <div className=\"manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded\">\n <div className=\"manage-card__content\">\n <div className=\"manage-card__status-row d-flex align-items-center mb-1\">\n <Icon\n src={SpinnerIcon}\n className=\"manage-card__status-badge manage-card__status-badge--sync flex-shrink-0\"\n aria-hidden\n />\n <span className=\"manage-card__status-label font-weight-bold text-primary-500\">\n {formatMessage(\n plan === 'annual'\n ? messages['~~manage~~.active.statusAnnual']\n : messages['~~manage~~.active.statusMonthly'],\n )}\n </span>\n </div>\n {nextPayment && (\n <p className=\"manage-card__body text-gray-700 mb-0\">\n {formatMessage(messages['~~manage~~.active.nextPayment'], { date: nextPayment })}\n </p>\n )}\n </div>\n\n {(payment_method?.toLowerCase() === STRIPE_PAYMENT_GATEWAY) && (\n <div className=\"manage-card__actions manage-card__actions--row d-flex flex-wrap align-items-center flex-shrink-0 justify-content-end\">\n <Button\n className=\"manage-btn manage-btn--dark\"\n variant=\"primary\"\n onClick={handleUpdatePaymentClick}\n disabled={!canUpdatePayment}\n >\n {formatMessage(messages['~~manage~~.active.updatePayment'])}\n </Button>\n </div>\n )}\n </div>\n\n <p className=\"manage-cancel-prompt mt-3 text-right text-gray-700 small\">\n {formatMessage(messages['~~manage~~.active.cancelPrompt'])}\n {' '}\n <Link className=\"manage-cancel-prompt__link text-info-500 font-weight-bold text-decoration-none\" to={`/${~~MANAGE_PAGE_PATH~~}/cancel`}>\n {formatMessage(messages['~~manage~~.active.cancelLink'])}\n </Link>\n </p>\n\n <UpdatePaymentMethodModal\n isOpen={isPaymentModalOpen}\n onClose={() => setIsPaymentModalOpen(false)}\n subscriptionBiId={subscriber?.subscriptionBiId}\n nextBillingDate={nextPayment}\n />\n </section>\n );\n};\n\nexport default ActiveSubscription;\n"]}
1	+ {"version":3,"file":"ActiveSubscription.js","sourceRoot":"","sources":["../../../src/components/ActiveSubscription/ActiveSubscription.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport { Button, Icon } from '@openedx/paragon';\nimport { SpinnerIcon } from '@openedx/paragon/icons';\nimport { useIntl } from '@openedx/frontend-base';\nimport { Link } from 'react-router-dom';\n\nimport type { CurrentUserSubscriberResult } from '../../types';\nimport { formatDisplayDate } from '../../utils/formatDate';\nimport { resolvePlanLabel } from '../../utils/subscriptionView';\nimport { ORDER_HISTORY_PAGE_PATH, STRIPE_PAYMENT_GATEWAY } from '../../constants';\nimport UpdatePaymentMethodModal from '../UpdatePaymentMethodModal/UpdatePaymentMethodModal';\nimport messages from '../messages';\nimport { trackManageSubscriptionUpdatePaymentButtonClick } from '@src/tracking';\nimport { getCommonTrackingProps } from '@src/tracking/trackingContext';\n\ninterface ActiveSubscriptionProps {\n subscriber: CurrentUserSubscriberResult \| null,\n}\n\nconst ActiveSubscription: React.FC<ActiveSubscriptionProps> = ({ subscriber }) => {\n const { formatMessage } = useIntl();\n const [isPaymentModalOpen, setIsPaymentModalOpen] = useState(false);\n const plan = resolvePlanLabel(subscriber);\n const sinceDate = formatDisplayDate(subscriber?.subscriptionStartDate);\n const nextPayment = formatDisplayDate(subscriber?.currentPeriodEnd);\n const canUpdatePayment = Boolean(subscriber?.subscriptionBiId);\n const { payment_method } = getCommonTrackingProps();\n\n const handleUpdatePaymentClick = () => {\n trackManageSubscriptionUpdatePaymentButtonClick({ buttonName: 'updatePayment' });\n setIsPaymentModalOpen(true);\n };\n\n return (\n <section className=\"manage-section mt-4\">\n <h2 className=\"manage-section__title h3 font-weight-bold text-primary-500 mb-1\">\n {formatMessage(messages['order-history.active.heading'])}\n </h2>\n {sinceDate && (\n <p className=\"manage-section__subtitle text-gray-700 mb-3\">\n {formatMessage(messages['order-history.active.since'], { date: sinceDate })}\n </p>\n )}\n\n <div className=\"manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded\">\n <div className=\"manage-card__content\">\n <div className=\"manage-card__status-row d-flex align-items-center mb-1\">\n <Icon\n src={SpinnerIcon}\n className=\"manage-card__status-badge manage-card__status-badge--sync flex-shrink-0\"\n aria-hidden\n />\n <span className=\"manage-card__status-label font-weight-bold text-primary-500\">\n {formatMessage(\n plan === 'annual'\n ? messages['order-history.active.statusAnnual']\n : messages['order-history.active.statusMonthly'],\n )}\n </span>\n </div>\n {nextPayment && (\n <p className=\"manage-card__body text-gray-700 mb-0\">\n {formatMessage(messages['order-history.active.nextPayment'], { date: nextPayment })}\n </p>\n )}\n </div>\n\n {(payment_method?.toLowerCase() === STRIPE_PAYMENT_GATEWAY) && (\n <div className=\"manage-card__actions manage-card__actions--row d-flex flex-wrap align-items-center flex-shrink-0 justify-content-end\">\n <Button\n className=\"manage-btn manage-btn--dark\"\n variant=\"primary\"\n onClick={handleUpdatePaymentClick}\n disabled={!canUpdatePayment}\n >\n {formatMessage(messages['order-history.active.updatePayment'])}\n </Button>\n </div>\n )}\n </div>\n\n <p className=\"manage-cancel-prompt mt-3 text-right text-gray-700 small\">\n {formatMessage(messages['order-history.active.cancelPrompt'])}\n {' '}\n <Link className=\"manage-cancel-prompt__link text-info-500 font-weight-bold text-decoration-none\" to={`/${ORDER_HISTORY_PAGE_PATH}/cancel`}>\n {formatMessage(messages['order-history.active.cancelLink'])}\n </Link>\n </p>\n\n <UpdatePaymentMethodModal\n isOpen={isPaymentModalOpen}\n onClose={() => setIsPaymentModalOpen(false)}\n subscriptionBiId={subscriber?.subscriptionBiId}\n nextBillingDate={nextPayment}\n />\n </section>\n );\n};\n\nexport default ActiveSubscription;\n"]}

package/dist/components/BecomeSubscriber/BecomeSubscriber.js CHANGED Viewed

@@ -8,12 +8,12 @@ const BecomeSubscriber = ({ price = null, currency = null, }) => {
     const checkoutUrl = getCheckoutUrl();
     const learnMoreUrl = getLearnMoreUrl();
     const hasPrice = Boolean(price);
-    return (_jsxs("section", { className: "manage-section mt-4", children: [_jsx("h2", { className: "manage-section__title h3 font-weight-bold text-primary-500 mb-1", children: formatMessage(messages['manage.none.heading']) }), _jsx("p", { className: "manage-section__subtitle text-gray-700 mb-3", children: formatMessage(messages['manage.none.subheading']) }), _jsxs("div", { className: "manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded", children: [_jsxs("div", { className: "manage-card__content", children: [_jsx("h3", { className: "manage-card__title font-weight-bold text-primary-500 mb-1", children: formatMessage(messages['manage.none.cardTitle']) }), _jsx("p", { className: "manage-card__body text-gray-700 mb-0", children: hasPrice
-                                    ? formatMessage(messages['manage.none.cardBody'], {
+    return (_jsxs("section", { className: "manage-section mt-4", children: [_jsx("h2", { className: "manage-section__title h3 font-weight-bold text-primary-500 mb-1", children: formatMessage(messages['order-history.none.heading']) }), _jsx("p", { className: "manage-section__subtitle text-gray-700 mb-3", children: formatMessage(messages['order-history.none.subheading']) }), _jsxs("div", { className: "manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded", children: [_jsxs("div", { className: "manage-card__content", children: [_jsx("h3", { className: "manage-card__title font-weight-bold text-primary-500 mb-1", children: formatMessage(messages['order-history.none.cardTitle']) }), _jsx("p", { className: "manage-card__body text-gray-700 mb-0", children: hasPrice
+                                    ? formatMessage(messages['order-history.none.cardBody'], {
                                         price,
                                         currency: currency !== null && currency !== void 0 ? currency : '',
                                     })
-                                    : formatMessage(messages['manage.none.cardBodyNoPrice']) })] }), _jsxs("div", { className: "manage-card__actions d-flex flex-wrap align-items-center flex-shrink-0", children: [_jsx("a", { className: "manage-card__link text-gray-700 small", href: learnMoreUrl, target: "_blank", rel: "noopener noreferrer", children: formatMessage(messages['manage.none.learnMore']) }), _jsx(Button, { className: "manage-btn manage-btn--brand", href: checkoutUrl, children: formatMessage(messages['manage.none.subscribe']) })] })] })] }));
+                                    : formatMessage(messages['order-history.none.cardBodyNoPrice']) })] }), _jsxs("div", { className: "manage-card__actions d-flex flex-wrap align-items-center flex-shrink-0", children: [_jsx("a", { className: "manage-card__link text-gray-700 small", href: learnMoreUrl, target: "_blank", rel: "noopener noreferrer", children: formatMessage(messages['order-history.none.learnMore']) }), _jsx(Button, { className: "manage-btn manage-btn--brand", href: checkoutUrl, children: formatMessage(messages['order-history.none.subscribe']) })] })] })] }));
 };
 export default BecomeSubscriber;
 //# sourceMappingURL=BecomeSubscriber.js.map

package/dist/components/BecomeSubscriber/BecomeSubscriber.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BecomeSubscriber.js","sourceRoot":"","sources":["../../../src/components/BecomeSubscriber/BecomeSubscriber.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnE,OAAO,QAAQ,MAAM,aAAa,CAAC;AAOnC,MAAM,gBAAgB,GAAoC,CAAC,EACzD,KAAK,GAAG,IAAI,EACZ,QAAQ,GAAG,IAAI,GAChB,EAAE,EAAE;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,MAAM,QAAQ,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAEhC,OAAO,CACL,mBAAS,SAAS,EAAC,qBAAqB,aACtC,aAAI,SAAS,EAAC,iEAAiE,YAC5E,aAAa,CAAC,QAAQ,CAAC,~~qBAAqB~~,CAAC,CAAC,~~GAC5C~~,EACL,YAAG,SAAS,EAAC,6CAA6C,YACvD,aAAa,CAAC,QAAQ,CAAC,~~wBAAwB,~~CAAC,CAAC,~~GAChD~~,EAEJ,eAAK,SAAS,EAAC,yHAAyH,aACtI,eAAK,SAAS,EAAC,sBAAsB,aACnC,aAAI,SAAS,EAAC,2DAA2D,YACtE,aAAa,CAAC,QAAQ,CAAC,~~uBAAuB~~,CAAC,CAAC,~~GAC9C~~,EACL,YAAG,SAAS,EAAC,sCAAsC,YAChD,QAAQ;oCACP,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~sBAAsB~~,CAAC,EAAE;~~wCAC9C~~,KAAK;wCACL,QAAQ,EAAE,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,EAAE;qCACzB,CAAC;oCACJ,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~6BAA6B~~,CAAC,CAAC,~~GACxD~~,IACA,EACN,eAAK,SAAS,EAAC,wEAAwE,aACrF,YAAG,SAAS,EAAC,uCAAuC,EAAC,IAAI,EAAE,YAAY,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,YAC/G,aAAa,CAAC,QAAQ,CAAC,~~uBAAuB~~,CAAC,CAAC,~~GAC/C~~,EACJ,KAAC,MAAM,IACL,SAAS,EAAC,8BAA8B,EACxC,IAAI,EAAE,WAAW,YAEhB,aAAa,CAAC,QAAQ,CAAC,~~uBAAuB~~,CAAC,CAAC,~~GAC1C~~,IACL,IACF,IACE,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import React from 'react';\nimport { Button } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { getCheckoutUrl, getLearnMoreUrl } from '../../utils/urls';\nimport messages from '../messages';\n\ninterface BecomeSubscriberProps {\n price?: string \| null,\n currency?: string \| null,\n}\n\nconst BecomeSubscriber: React.FC<BecomeSubscriberProps> = ({\n price = null,\n currency = null,\n}) => {\n const { formatMessage } = useIntl();\n const checkoutUrl = getCheckoutUrl();\n const learnMoreUrl = getLearnMoreUrl();\n const hasPrice = Boolean(price);\n\n return (\n <section className=\"manage-section mt-4\">\n <h2 className=\"manage-section__title h3 font-weight-bold text-primary-500 mb-1\">\n {formatMessage(messages['~~manage~~.none.heading'])}\n </h2>\n <p className=\"manage-section__subtitle text-gray-700 mb-3\">\n {formatMessage(messages['~~manage~~.none.subheading'])}\n </p>\n\n <div className=\"manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded\">\n <div className=\"manage-card__content\">\n <h3 className=\"manage-card__title font-weight-bold text-primary-500 mb-1\">\n {formatMessage(messages['~~manage~~.none.cardTitle'])}\n </h3>\n <p className=\"manage-card__body text-gray-700 mb-0\">\n {hasPrice\n ? formatMessage(messages['~~manage~~.none.cardBody'], {\n price,\n currency: currency ?? '',\n })\n : formatMessage(messages['~~manage~~.none.cardBodyNoPrice'])}\n </p>\n </div>\n <div className=\"manage-card__actions d-flex flex-wrap align-items-center flex-shrink-0\">\n <a className=\"manage-card__link text-gray-700 small\" href={learnMoreUrl} target=\"_blank\" rel=\"noopener noreferrer\">\n {formatMessage(messages['~~manage~~.none.learnMore'])}\n </a>\n <Button\n className=\"manage-btn manage-btn--brand\"\n href={checkoutUrl}\n >\n {formatMessage(messages['~~manage~~.none.subscribe'])}\n </Button>\n </div>\n </div>\n </section>\n );\n};\n\nexport default BecomeSubscriber;\n"]}
1	+ {"version":3,"file":"BecomeSubscriber.js","sourceRoot":"","sources":["../../../src/components/BecomeSubscriber/BecomeSubscriber.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnE,OAAO,QAAQ,MAAM,aAAa,CAAC;AAOnC,MAAM,gBAAgB,GAAoC,CAAC,EACzD,KAAK,GAAG,IAAI,EACZ,QAAQ,GAAG,IAAI,GAChB,EAAE,EAAE;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,MAAM,QAAQ,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAEhC,OAAO,CACL,mBAAS,SAAS,EAAC,qBAAqB,aACtC,aAAI,SAAS,EAAC,iEAAiE,YAC5E,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC,CAAC,GACnD,EACL,YAAG,SAAS,EAAC,6CAA6C,YACvD,aAAa,CAAC,QAAQ,CAAC,+BAA+B,CAAC,CAAC,GACvD,EAEJ,eAAK,SAAS,EAAC,yHAAyH,aACtI,eAAK,SAAS,EAAC,sBAAsB,aACnC,aAAI,SAAS,EAAC,2DAA2D,YACtE,aAAa,CAAC,QAAQ,CAAC,8BAA8B,CAAC,CAAC,GACrD,EACL,YAAG,SAAS,EAAC,sCAAsC,YAChD,QAAQ;oCACP,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,6BAA6B,CAAC,EAAE;wCACrD,KAAK;wCACL,QAAQ,EAAE,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,EAAE;qCACzB,CAAC;oCACJ,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,oCAAoC,CAAC,CAAC,GAC/D,IACA,EACN,eAAK,SAAS,EAAC,wEAAwE,aACrF,YAAG,SAAS,EAAC,uCAAuC,EAAC,IAAI,EAAE,YAAY,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,YAC/G,aAAa,CAAC,QAAQ,CAAC,8BAA8B,CAAC,CAAC,GACtD,EACJ,KAAC,MAAM,IACL,SAAS,EAAC,8BAA8B,EACxC,IAAI,EAAE,WAAW,YAEhB,aAAa,CAAC,QAAQ,CAAC,8BAA8B,CAAC,CAAC,GACjD,IACL,IACF,IACE,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import React from 'react';\nimport { Button } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { getCheckoutUrl, getLearnMoreUrl } from '../../utils/urls';\nimport messages from '../messages';\n\ninterface BecomeSubscriberProps {\n price?: string \| null,\n currency?: string \| null,\n}\n\nconst BecomeSubscriber: React.FC<BecomeSubscriberProps> = ({\n price = null,\n currency = null,\n}) => {\n const { formatMessage } = useIntl();\n const checkoutUrl = getCheckoutUrl();\n const learnMoreUrl = getLearnMoreUrl();\n const hasPrice = Boolean(price);\n\n return (\n <section className=\"manage-section mt-4\">\n <h2 className=\"manage-section__title h3 font-weight-bold text-primary-500 mb-1\">\n {formatMessage(messages['order-history.none.heading'])}\n </h2>\n <p className=\"manage-section__subtitle text-gray-700 mb-3\">\n {formatMessage(messages['order-history.none.subheading'])}\n </p>\n\n <div className=\"manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded\">\n <div className=\"manage-card__content\">\n <h3 className=\"manage-card__title font-weight-bold text-primary-500 mb-1\">\n {formatMessage(messages['order-history.none.cardTitle'])}\n </h3>\n <p className=\"manage-card__body text-gray-700 mb-0\">\n {hasPrice\n ? formatMessage(messages['order-history.none.cardBody'], {\n price,\n currency: currency ?? '',\n })\n : formatMessage(messages['order-history.none.cardBodyNoPrice'])}\n </p>\n </div>\n <div className=\"manage-card__actions d-flex flex-wrap align-items-center flex-shrink-0\">\n <a className=\"manage-card__link text-gray-700 small\" href={learnMoreUrl} target=\"_blank\" rel=\"noopener noreferrer\">\n {formatMessage(messages['order-history.none.learnMore'])}\n </a>\n <Button\n className=\"manage-btn manage-btn--brand\"\n href={checkoutUrl}\n >\n {formatMessage(messages['order-history.none.subscribe'])}\n </Button>\n </div>\n </div>\n </section>\n );\n};\n\nexport default BecomeSubscriber;\n"]}

package/dist/components/CancelConfirmation/CancelConfirmation.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Alert, Button, Spinner } from '@openedx/paragon';
 import { useIntl } from '@openedx/frontend-base';
 import { useNavigate } from 'react-router-dom';
-import { MANAGE_PAGE_PATH } from '../../constants';
+import { ORDER_HISTORY_PAGE_PATH } from '../../constants';
 import { formatDisplayDate } from '../../utils/formatDate';
 import EnrolledCoursesList from '../EnrolledCoursesList/EnrolledCoursesList';
 import messages from '../messages';
@@ -11,11 +11,11 @@ const CancelConfirmation = ({ subscriber, enrollments, isEnrollmentsLoading = fa
     const { formatMessage } = useIntl();
     const navigate = useNavigate();
     const expireDate = formatDisplayDate((_a = subscriber === null || subscriber === void 0 ? void 0 : subscriber.currentPeriodEnd) !== null && _a !== void 0 ? _a : subscriber === null || subscriber === void 0 ? void 0 : subscriber.subscriptionEndDate);
-    return (_jsxs("div", { className: "manage-cancel py-5", children: [_jsx("h1", { className: "manage-cancel__title h2 font-weight-bold text-primary-500 mb-3", children: formatMessage(messages['manage.cancel.title']) }), _jsx("p", { className: "manage-cancel__body text-gray-700 mb-4", children: expireDate
-                    ? formatMessage(messages['manage.cancel.body'], { date: expireDate })
-                    : formatMessage(messages['manage.cancel.bodyNoDate']) }), _jsx(EnrolledCoursesList, { enrollments: enrollments, isLoading: isEnrollmentsLoading }), isEnrollmentsLoading && (_jsx("div", { className: "d-flex justify-content-center py-4", children: _jsx(Spinner, { animation: "border", screenReaderText: formatMessage(messages['manage.loading']) }) })), cancelError && (_jsx(Alert, { variant: "danger", className: "mt-3", children: formatMessage(messages['manage.cancel.error']) })), _jsxs("div", { className: "manage-cancel__actions d-flex flex-column flex-md-row justify-content-md-end mt-4", children: [_jsx(Button, { className: "manage-btn manage-btn--outline-brand w-100 w-md-auto", variant: "outline-primary", onClick: () => navigate(`/${MANAGE_PAGE_PATH}`), disabled: isCanceling, children: formatMessage(messages['manage.cancel.keep']) }), _jsx(Button, { className: "manage-btn manage-btn--brand w-100 w-md-auto", onClick: onConfirmCancel, disabled: isCanceling, children: isCanceling
-                            ? formatMessage(messages['manage.cancel.confirming'])
-                            : formatMessage(messages['manage.cancel.confirm']) })] })] }));
+    return (_jsxs("div", { className: "manage-cancel py-5", children: [_jsx("h1", { className: "manage-cancel__title h2 font-weight-bold text-primary-500 mb-3", children: formatMessage(messages['order-history.cancel.title']) }), _jsx("p", { className: "manage-cancel__body text-gray-700 mb-4", children: expireDate
+                    ? formatMessage(messages['order-history.cancel.body'], { date: expireDate })
+                    : formatMessage(messages['order-history.cancel.bodyNoDate']) }), _jsx(EnrolledCoursesList, { enrollments: enrollments, isLoading: isEnrollmentsLoading }), isEnrollmentsLoading && (_jsx("div", { className: "d-flex justify-content-center py-4", children: _jsx(Spinner, { animation: "border", screenReaderText: formatMessage(messages['order-history.loading']) }) })), cancelError && (_jsx(Alert, { variant: "danger", className: "mt-3", children: formatMessage(messages['order-history.cancel.error']) })), _jsxs("div", { className: "manage-cancel__actions d-flex flex-column flex-md-row justify-content-md-end mt-4", children: [_jsx(Button, { className: "manage-btn manage-btn--outline-brand w-100 w-md-auto", variant: "outline-primary", onClick: () => navigate(`/${ORDER_HISTORY_PAGE_PATH}`), disabled: isCanceling, children: formatMessage(messages['order-history.cancel.keep']) }), _jsx(Button, { className: "manage-btn manage-btn--brand w-100 w-md-auto", onClick: onConfirmCancel, disabled: isCanceling, children: isCanceling
+                            ? formatMessage(messages['order-history.cancel.confirming'])
+                            : formatMessage(messages['order-history.cancel.confirm']) })] })] }));
 };
 export default CancelConfirmation;
 //# sourceMappingURL=CancelConfirmation.js.map

package/dist/components/CancelConfirmation/CancelConfirmation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CancelConfirmation.js","sourceRoot":"","sources":["../../../src/components/CancelConfirmation/CancelConfirmation.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAE,~~gBAAgB~~,EAAE,MAAM,iBAAiB,CAAC;~~AAKnD~~,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,mBAAmB,MAAM,4CAA4C,CAAC;AAC7E,OAAO,QAAQ,MAAM,aAAa,CAAC;AAWnC,MAAM,kBAAkB,GAAsC,CAAC,EAC7D,UAAU,EACV,WAAW,EACX,oBAAoB,GAAG,KAAK,EAC5B,WAAW,GAAG,KAAK,EACnB,WAAW,GAAG,KAAK,EACnB,eAAe,GAChB,EAAE,EAAE;;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,UAAU,GAAG,iBAAiB,CAClC,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,gBAAgB,mCAAI,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,mBAAmB,CAChE,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,oBAAoB,aACjC,aAAI,SAAS,EAAC,gEAAgE,YAC3E,aAAa,CAAC,QAAQ,CAAC,~~qBAAqB~~,CAAC,CAAC,~~GAC5C~~,EACL,YAAG,SAAS,EAAC,wCAAwC,YAClD,UAAU;oBACT,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~oBAAoB~~,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;~~oBACrE~~,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~0BAA0B~~,CAAC,CAAC,~~GACrD~~,EAEJ,KAAC,mBAAmB,IAClB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,oBAAoB,GAC/B,EAED,oBAAoB,IAAI,CACvB,cAAK,SAAS,EAAC,oCAAoC,YACjD,KAAC,OAAO,IACN,SAAS,EAAC,QAAQ,EAClB,gBAAgB,EAAE,aAAa,CAAC,QAAQ,CAAC,~~gBAAgB~~,CAAC,CAAC,~~GAC3D~~,GACE,CACP,EAEA,WAAW,IAAI,CACd,KAAC,KAAK,IAAC,OAAO,EAAC,QAAQ,EAAC,SAAS,EAAC,MAAM,YACrC,aAAa,CAAC,QAAQ,CAAC,~~qBAAqB~~,CAAC,CAAC,~~GACzC~~,CACT,EAED,eAAK,SAAS,EAAC,mFAAmF,aAChG,KAAC,MAAM,IACL,SAAS,EAAC,sDAAsD,EAChE,OAAO,EAAC,iBAAiB,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,~~gBAAgB~~,EAAE,CAAC,~~EAC/C~~,QAAQ,EAAE,WAAW,YAEpB,aAAa,CAAC,QAAQ,CAAC,~~oBAAoB~~,CAAC,CAAC,~~GACvC~~,EACT,KAAC,MAAM,IACL,SAAS,EAAC,8CAA8C,EACxD,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,WAAW,YAEpB,WAAW;4BACV,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~0BAA0B~~,CAAC,CAAC;~~4BACrD~~,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~uBAAuB~~,CAAC,CAAC,~~GAC7C~~,IACL,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import React from 'react';\nimport { Alert, Button, Spinner } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport { useNavigate } from 'react-router-dom';\n\nimport { ~~MANAGE_PAGE_PATH~~ } from '../../constants';\nimport type {\n CurrentUserSubscriberResult,\n SubscriptionEnrollment,\n} from '../../types';\nimport { formatDisplayDate } from '../../utils/formatDate';\nimport EnrolledCoursesList from '../EnrolledCoursesList/EnrolledCoursesList';\nimport messages from '../messages';\n\ninterface CancelConfirmationProps {\n subscriber: CurrentUserSubscriberResult \| null,\n enrollments: SubscriptionEnrollment[],\n isEnrollmentsLoading?: boolean,\n isCanceling?: boolean,\n cancelError?: boolean,\n onConfirmCancel: () => void,\n}\n\nconst CancelConfirmation: React.FC<CancelConfirmationProps> = ({\n subscriber,\n enrollments,\n isEnrollmentsLoading = false,\n isCanceling = false,\n cancelError = false,\n onConfirmCancel,\n}) => {\n const { formatMessage } = useIntl();\n const navigate = useNavigate();\n const expireDate = formatDisplayDate(\n subscriber?.currentPeriodEnd ?? subscriber?.subscriptionEndDate,\n );\n\n return (\n <div className=\"manage-cancel py-5\">\n <h1 className=\"manage-cancel__title h2 font-weight-bold text-primary-500 mb-3\">\n {formatMessage(messages['~~manage~~.cancel.title'])}\n </h1>\n <p className=\"manage-cancel__body text-gray-700 mb-4\">\n {expireDate\n ? formatMessage(messages['~~manage~~.cancel.body'], { date: expireDate })\n : formatMessage(messages['~~manage~~.cancel.bodyNoDate'])}\n </p>\n\n <EnrolledCoursesList\n enrollments={enrollments}\n isLoading={isEnrollmentsLoading}\n />\n\n {isEnrollmentsLoading && (\n <div className=\"d-flex justify-content-center py-4\">\n <Spinner\n animation=\"border\"\n screenReaderText={formatMessage(messages['~~manage~~.loading'])}\n />\n </div>\n )}\n\n {cancelError && (\n <Alert variant=\"danger\" className=\"mt-3\">\n {formatMessage(messages['~~manage~~.cancel.error'])}\n </Alert>\n )}\n\n <div className=\"manage-cancel__actions d-flex flex-column flex-md-row justify-content-md-end mt-4\">\n <Button\n className=\"manage-btn manage-btn--outline-brand w-100 w-md-auto\"\n variant=\"outline-primary\"\n onClick={() => navigate(`/${~~MANAGE_PAGE_PATH~~}`)}\n disabled={isCanceling}\n >\n {formatMessage(messages['~~manage~~.cancel.keep'])}\n </Button>\n <Button\n className=\"manage-btn manage-btn--brand w-100 w-md-auto\"\n onClick={onConfirmCancel}\n disabled={isCanceling}\n >\n {isCanceling\n ? formatMessage(messages['~~manage~~.cancel.confirming'])\n : formatMessage(messages['~~manage~~.cancel.confirm'])}\n </Button>\n </div>\n </div>\n );\n};\n\nexport default CancelConfirmation;\n"]}
1	+ {"version":3,"file":"CancelConfirmation.js","sourceRoot":"","sources":["../../../src/components/CancelConfirmation/CancelConfirmation.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAK1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,mBAAmB,MAAM,4CAA4C,CAAC;AAC7E,OAAO,QAAQ,MAAM,aAAa,CAAC;AAWnC,MAAM,kBAAkB,GAAsC,CAAC,EAC7D,UAAU,EACV,WAAW,EACX,oBAAoB,GAAG,KAAK,EAC5B,WAAW,GAAG,KAAK,EACnB,WAAW,GAAG,KAAK,EACnB,eAAe,GAChB,EAAE,EAAE;;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,UAAU,GAAG,iBAAiB,CAClC,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,gBAAgB,mCAAI,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,mBAAmB,CAChE,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,oBAAoB,aACjC,aAAI,SAAS,EAAC,gEAAgE,YAC3E,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC,CAAC,GACnD,EACL,YAAG,SAAS,EAAC,wCAAwC,YAClD,UAAU;oBACT,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;oBAC5E,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,iCAAiC,CAAC,CAAC,GAC5D,EAEJ,KAAC,mBAAmB,IAClB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,oBAAoB,GAC/B,EAED,oBAAoB,IAAI,CACvB,cAAK,SAAS,EAAC,oCAAoC,YACjD,KAAC,OAAO,IACN,SAAS,EAAC,QAAQ,EAClB,gBAAgB,EAAE,aAAa,CAAC,QAAQ,CAAC,uBAAuB,CAAC,CAAC,GAClE,GACE,CACP,EAEA,WAAW,IAAI,CACd,KAAC,KAAK,IAAC,OAAO,EAAC,QAAQ,EAAC,SAAS,EAAC,MAAM,YACrC,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC,CAAC,GAChD,CACT,EAED,eAAK,SAAS,EAAC,mFAAmF,aAChG,KAAC,MAAM,IACL,SAAS,EAAC,sDAAsD,EAChE,OAAO,EAAC,iBAAiB,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,uBAAuB,EAAE,CAAC,EACtD,QAAQ,EAAE,WAAW,YAEpB,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,GAC9C,EACT,KAAC,MAAM,IACL,SAAS,EAAC,8CAA8C,EACxD,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,WAAW,YAEpB,WAAW;4BACV,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,iCAAiC,CAAC,CAAC;4BAC5D,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,8BAA8B,CAAC,CAAC,GACpD,IACL,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import React from 'react';\nimport { Alert, Button, Spinner } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport { useNavigate } from 'react-router-dom';\n\nimport { ORDER_HISTORY_PAGE_PATH } from '../../constants';\nimport type {\n CurrentUserSubscriberResult,\n SubscriptionEnrollment,\n} from '../../types';\nimport { formatDisplayDate } from '../../utils/formatDate';\nimport EnrolledCoursesList from '../EnrolledCoursesList/EnrolledCoursesList';\nimport messages from '../messages';\n\ninterface CancelConfirmationProps {\n subscriber: CurrentUserSubscriberResult \| null,\n enrollments: SubscriptionEnrollment[],\n isEnrollmentsLoading?: boolean,\n isCanceling?: boolean,\n cancelError?: boolean,\n onConfirmCancel: () => void,\n}\n\nconst CancelConfirmation: React.FC<CancelConfirmationProps> = ({\n subscriber,\n enrollments,\n isEnrollmentsLoading = false,\n isCanceling = false,\n cancelError = false,\n onConfirmCancel,\n}) => {\n const { formatMessage } = useIntl();\n const navigate = useNavigate();\n const expireDate = formatDisplayDate(\n subscriber?.currentPeriodEnd ?? subscriber?.subscriptionEndDate,\n );\n\n return (\n <div className=\"manage-cancel py-5\">\n <h1 className=\"manage-cancel__title h2 font-weight-bold text-primary-500 mb-3\">\n {formatMessage(messages['order-history.cancel.title'])}\n </h1>\n <p className=\"manage-cancel__body text-gray-700 mb-4\">\n {expireDate\n ? formatMessage(messages['order-history.cancel.body'], { date: expireDate })\n : formatMessage(messages['order-history.cancel.bodyNoDate'])}\n </p>\n\n <EnrolledCoursesList\n enrollments={enrollments}\n isLoading={isEnrollmentsLoading}\n />\n\n {isEnrollmentsLoading && (\n <div className=\"d-flex justify-content-center py-4\">\n <Spinner\n animation=\"border\"\n screenReaderText={formatMessage(messages['order-history.loading'])}\n />\n </div>\n )}\n\n {cancelError && (\n <Alert variant=\"danger\" className=\"mt-3\">\n {formatMessage(messages['order-history.cancel.error'])}\n </Alert>\n )}\n\n <div className=\"manage-cancel__actions d-flex flex-column flex-md-row justify-content-md-end mt-4\">\n <Button\n className=\"manage-btn manage-btn--outline-brand w-100 w-md-auto\"\n variant=\"outline-primary\"\n onClick={() => navigate(`/${ORDER_HISTORY_PAGE_PATH}`)}\n disabled={isCanceling}\n >\n {formatMessage(messages['order-history.cancel.keep'])}\n </Button>\n <Button\n className=\"manage-btn manage-btn--brand w-100 w-md-auto\"\n onClick={onConfirmCancel}\n disabled={isCanceling}\n >\n {isCanceling\n ? formatMessage(messages['order-history.cancel.confirming'])\n : formatMessage(messages['order-history.cancel.confirm'])}\n </Button>\n </div>\n </div>\n );\n};\n\nexport default CancelConfirmation;\n"]}

package/dist/components/CancelSuccess/CancelSuccess.js CHANGED Viewed

@@ -9,9 +9,9 @@ const CancelSuccess = ({ subscriber }) => {
     const { formatMessage } = useIntl();
     const accessUntil = formatDisplayDate((_a = subscriber === null || subscriber === void 0 ? void 0 : subscriber.currentPeriodEnd) !== null && _a !== void 0 ? _a : subscriber === null || subscriber === void 0 ? void 0 : subscriber.subscriptionEndDate);
     const dashboardUrl = getLearnerDashboardUrl();
-    return (_jsxs("div", { className: "manage-cancel-success d-flex flex-column align-items-stretch py-5", children: [_jsxs("div", { className: "manage-cancel-success__copy", children: [_jsx("h1", { className: "manage-cancel-success__title h2 font-weight-bold text-primary-500 mb-3", children: formatMessage(messages['manage.cancelSuccess.title']) }), _jsx("p", { className: "manage-cancel-success__body text-primary-500 mb-0", children: accessUntil
-                            ? formatMessage(messages['manage.cancelSuccess.body'], { date: accessUntil })
-                            : formatMessage(messages['manage.cancelSuccess.bodyNoDate']) })] }), _jsx(Button, { className: "manage-btn manage-btn--dark align-self-end", href: dashboardUrl, children: formatMessage(messages['manage.cancelSuccess.return']) })] }));
+    return (_jsxs("div", { className: "manage-cancel-success d-flex flex-column align-items-stretch py-5", children: [_jsxs("div", { className: "manage-cancel-success__copy", children: [_jsx("h1", { className: "manage-cancel-success__title h2 font-weight-bold text-primary-500 mb-3", children: formatMessage(messages['order-history.cancelSuccess.title']) }), _jsx("p", { className: "manage-cancel-success__body text-primary-500 mb-0", children: accessUntil
+                            ? formatMessage(messages['order-history.cancelSuccess.body'], { date: accessUntil })
+                            : formatMessage(messages['order-history.cancelSuccess.bodyNoDate']) })] }), _jsx(Button, { className: "manage-btn manage-btn--dark align-self-end", href: dashboardUrl, children: formatMessage(messages['order-history.cancelSuccess.return']) })] }));
 };
 export default CancelSuccess;
 //# sourceMappingURL=CancelSuccess.js.map

package/dist/components/CancelSuccess/CancelSuccess.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CancelSuccess.js","sourceRoot":"","sources":["../../../src/components/CancelSuccess/CancelSuccess.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,QAAQ,MAAM,aAAa,CAAC;AAMnC,MAAM,aAAa,GAAiC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE;;IACrE,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,WAAW,GAAG,iBAAiB,CACnC,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,gBAAgB,mCAAI,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,mBAAmB,CAChE,CAAC;IACF,MAAM,YAAY,GAAG,sBAAsB,EAAE,CAAC;IAE9C,OAAO,CACL,eAAK,SAAS,EAAC,mEAAmE,aAChF,eAAK,SAAS,EAAC,6BAA6B,aAC1C,aAAI,SAAS,EAAC,wEAAwE,YACnF,aAAa,CAAC,QAAQ,CAAC,~~4BAA4B~~,CAAC,CAAC,~~GACnD~~,EACL,YAAG,SAAS,EAAC,mDAAmD,YAC7D,WAAW;4BACV,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~2BAA2B~~,CAAC,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC;~~4BAC7E~~,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~iCAAiC~~,CAAC,CAAC,~~GAC5D~~,IACA,EACN,KAAC,MAAM,IAAC,SAAS,EAAC,4CAA4C,EAAC,IAAI,EAAE,YAAY,YAC9E,aAAa,CAAC,QAAQ,CAAC,~~6BAA6B~~,CAAC,CAAC,~~GAChD~~,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import React from 'react';\nimport { Button } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport type { CurrentUserSubscriberResult } from '../../types';\nimport { formatDisplayDate } from '../../utils/formatDate';\nimport { getLearnerDashboardUrl } from '../../utils/urls';\nimport messages from '../messages';\n\ninterface CancelSuccessProps {\n subscriber: CurrentUserSubscriberResult \| null,\n}\n\nconst CancelSuccess: React.FC<CancelSuccessProps> = ({ subscriber }) => {\n const { formatMessage } = useIntl();\n const accessUntil = formatDisplayDate(\n subscriber?.currentPeriodEnd ?? subscriber?.subscriptionEndDate,\n );\n const dashboardUrl = getLearnerDashboardUrl();\n\n return (\n <div className=\"manage-cancel-success d-flex flex-column align-items-stretch py-5\">\n <div className=\"manage-cancel-success__copy\">\n <h1 className=\"manage-cancel-success__title h2 font-weight-bold text-primary-500 mb-3\">\n {formatMessage(messages['~~manage~~.cancelSuccess.title'])}\n </h1>\n <p className=\"manage-cancel-success__body text-primary-500 mb-0\">\n {accessUntil\n ? formatMessage(messages['~~manage~~.cancelSuccess.body'], { date: accessUntil })\n : formatMessage(messages['~~manage~~.cancelSuccess.bodyNoDate'])}\n </p>\n </div>\n <Button className=\"manage-btn manage-btn--dark align-self-end\" href={dashboardUrl}>\n {formatMessage(messages['~~manage~~.cancelSuccess.return'])}\n </Button>\n </div>\n );\n};\n\nexport default CancelSuccess;\n"]}
1	+ {"version":3,"file":"CancelSuccess.js","sourceRoot":"","sources":["../../../src/components/CancelSuccess/CancelSuccess.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,QAAQ,MAAM,aAAa,CAAC;AAMnC,MAAM,aAAa,GAAiC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE;;IACrE,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,WAAW,GAAG,iBAAiB,CACnC,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,gBAAgB,mCAAI,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,mBAAmB,CAChE,CAAC;IACF,MAAM,YAAY,GAAG,sBAAsB,EAAE,CAAC;IAE9C,OAAO,CACL,eAAK,SAAS,EAAC,mEAAmE,aAChF,eAAK,SAAS,EAAC,6BAA6B,aAC1C,aAAI,SAAS,EAAC,wEAAwE,YACnF,aAAa,CAAC,QAAQ,CAAC,mCAAmC,CAAC,CAAC,GAC1D,EACL,YAAG,SAAS,EAAC,mDAAmD,YAC7D,WAAW;4BACV,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,kCAAkC,CAAC,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC;4BACpF,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,wCAAwC,CAAC,CAAC,GACnE,IACA,EACN,KAAC,MAAM,IAAC,SAAS,EAAC,4CAA4C,EAAC,IAAI,EAAE,YAAY,YAC9E,aAAa,CAAC,QAAQ,CAAC,oCAAoC,CAAC,CAAC,GACvD,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import React from 'react';\nimport { Button } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport type { CurrentUserSubscriberResult } from '../../types';\nimport { formatDisplayDate } from '../../utils/formatDate';\nimport { getLearnerDashboardUrl } from '../../utils/urls';\nimport messages from '../messages';\n\ninterface CancelSuccessProps {\n subscriber: CurrentUserSubscriberResult \| null,\n}\n\nconst CancelSuccess: React.FC<CancelSuccessProps> = ({ subscriber }) => {\n const { formatMessage } = useIntl();\n const accessUntil = formatDisplayDate(\n subscriber?.currentPeriodEnd ?? subscriber?.subscriptionEndDate,\n );\n const dashboardUrl = getLearnerDashboardUrl();\n\n return (\n <div className=\"manage-cancel-success d-flex flex-column align-items-stretch py-5\">\n <div className=\"manage-cancel-success__copy\">\n <h1 className=\"manage-cancel-success__title h2 font-weight-bold text-primary-500 mb-3\">\n {formatMessage(messages['order-history.cancelSuccess.title'])}\n </h1>\n <p className=\"manage-cancel-success__body text-primary-500 mb-0\">\n {accessUntil\n ? formatMessage(messages['order-history.cancelSuccess.body'], { date: accessUntil })\n : formatMessage(messages['order-history.cancelSuccess.bodyNoDate'])}\n </p>\n </div>\n <Button className=\"manage-btn manage-btn--dark align-self-end\" href={dashboardUrl}>\n {formatMessage(messages['order-history.cancelSuccess.return'])}\n </Button>\n </div>\n );\n};\n\nexport default CancelSuccess;\n"]}

package/dist/components/CanceledSubscription/CanceledSubscription.js CHANGED Viewed

@@ -29,7 +29,7 @@ export const RenewBanner = ({ expireDate, onRenew, }) => {
         return null;
     }
     const showRenewButton = isRenewEligible();
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "manage-renew-banner__content", children: [_jsx("h2", { className: "manage-renew-banner__title h3 font-weight-bold text-primary-500 mb-2", children: formatMessage(messages['manage.canceled.bannerTitle']) }), _jsx("p", { className: "manage-renew-banner__body text-primary-500 mb-0", children: formatMessage(messages['manage.canceled.bannerBody'], { date: expireDate }) })] }), _jsx("div", { className: "manage-renew-banner__actions", children: showRenewButton && (_jsx(Button, { className: "manage-btn manage-btn--brand", onClick: onRenew, children: formatMessage(messages['manage.canceled.renew']) })) })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "manage-renew-banner__content", children: [_jsx("h2", { className: "manage-renew-banner__title h3 font-weight-bold text-primary-500 mb-2", children: formatMessage(messages['order-history.canceled.bannerTitle']) }), _jsx("p", { className: "manage-renew-banner__body text-primary-500 mb-0", children: formatMessage(messages['order-history.canceled.bannerBody'], { date: expireDate }) })] }), _jsx("div", { className: "manage-renew-banner__actions", children: showRenewButton && (_jsx(Button, { className: "manage-btn manage-btn--brand", onClick: onRenew, children: formatMessage(messages['order-history.canceled.renew']) })) })] }));
 };
 const CanceledSubscription = ({ subscriber, onRenew, }) => {
     var _a, _b;
@@ -38,11 +38,11 @@ const CanceledSubscription = ({ subscriber, onRenew, }) => {
     const sinceDate = formatDisplayDate(subscriber === null || subscriber === void 0 ? void 0 : subscriber.subscriptionStartDate);
     const canceledOn = formatDisplayDate((_b = (_a = subscriber === null || subscriber === void 0 ? void 0 : subscriber.canceledAt) !== null && _a !== void 0 ? _a : subscriber === null || subscriber === void 0 ? void 0 : subscriber.subscriptionEndDate) !== null && _b !== void 0 ? _b : subscriber === null || subscriber === void 0 ? void 0 : subscriber.currentPeriodEnd);
     const showRenewButton = isRenewEligible();
-    return (_jsxs("section", { className: "manage-section mt-4", children: [_jsx("h2", { className: "manage-section__title h3 font-weight-bold text-primary-500 mb-1", children: formatMessage(messages['manage.active.heading']) }), sinceDate && (_jsx("p", { className: "manage-section__subtitle text-gray-700 mb-3", children: formatMessage(messages['manage.active.since'], { date: sinceDate }) })), _jsxs("div", { className: "manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded", children: [_jsxs("div", { className: "manage-card__content", children: [_jsxs("div", { className: "manage-card__status-row d-flex align-items-center mb-1", children: [_jsx("span", { className: "manage-card__status-badge manage-card__status-badge--cancel flex-shrink-0", "aria-hidden": "true" }), _jsx("span", { className: "manage-card__status-label font-weight-bold text-primary-500", children: formatMessage(plan === 'annual'
-                                            ? messages['manage.canceled.statusAnnual']
-                                            : messages['manage.canceled.statusMonthly']) })] }), _jsx("p", { className: "manage-card__body text-gray-700 mb-0", children: canceledOn
-                                    ? formatMessage(messages['manage.canceled.noPayments'], { date: canceledOn })
-                                    : formatMessage(messages['manage.canceled.noPaymentsNoDate']) })] }), _jsx("div", { className: "manage-card__actions d-flex flex-wrap align-items-center flex-shrink-0", children: showRenewButton && (_jsx(Button, { className: "manage-btn manage-btn--brand", onClick: onRenew, children: formatMessage(messages['manage.canceled.renew']) })) })] })] }));
+    return (_jsxs("section", { className: "manage-section mt-4", children: [_jsx("h2", { className: "manage-section__title h3 font-weight-bold text-primary-500 mb-1", children: formatMessage(messages['order-history.active.heading']) }), sinceDate && (_jsx("p", { className: "manage-section__subtitle text-gray-700 mb-3", children: formatMessage(messages['order-history.active.since'], { date: sinceDate }) })), _jsxs("div", { className: "manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded", children: [_jsxs("div", { className: "manage-card__content", children: [_jsxs("div", { className: "manage-card__status-row d-flex align-items-center mb-1", children: [_jsx("span", { className: "manage-card__status-badge manage-card__status-badge--cancel flex-shrink-0", "aria-hidden": "true" }), _jsx("span", { className: "manage-card__status-label font-weight-bold text-primary-500", children: formatMessage(plan === 'annual'
+                                            ? messages['order-history.canceled.statusAnnual']
+                                            : messages['order-history.canceled.statusMonthly']) })] }), _jsx("p", { className: "manage-card__body text-gray-700 mb-0", children: canceledOn
+                                    ? formatMessage(messages['order-history.canceled.noPayments'], { date: canceledOn })
+                                    : formatMessage(messages['order-history.canceled.noPaymentsNoDate']) })] }), _jsx("div", { className: "manage-card__actions d-flex flex-wrap align-items-center flex-shrink-0", children: showRenewButton && (_jsx(Button, { className: "manage-btn manage-btn--brand", onClick: onRenew, children: formatMessage(messages['order-history.canceled.renew']) })) })] })] }));
 };
 export default CanceledSubscription;
 //# sourceMappingURL=CanceledSubscription.js.map

package/dist/components/CanceledSubscription/CanceledSubscription.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CanceledSubscription.js","sourceRoot":"","sources":["../../../src/components/CanceledSubscription/CanceledSubscription.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAChE,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AAEvE,MAAM,eAAe,GAAG,GAAG,EAAE;IAC3B,MAAM,EAAE,cAAc,EAAE,mBAAmB,EAAE,eAAe,EAAE,GAAG,sBAAsB,EAAE,CAAC;IAC1F,QAAQ,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,EAAE,EAAE,CAAC;QACtC,KAAK,QAAQ;YACX,OAAO,CACL,mBAAmB,KAAK,gBAAgB;mBACrC,mBAAmB,KAAK,gBAAgB,CAC5C,CAAC;QAEJ,KAAK,QAAQ;YACX,iDAAiD;YACjD,IAAI,eAAe;gBACjB,OAAO,IAAI,CAAC;YAEd,8CAA8C;YAC9C,IAAI,mBAAmB,KAAK,gBAAgB;gBAC1C,OAAO,KAAK,CAAC;YAEf,OAAO,KAAK,CAAC;QAEf;YACE,OAAO,KAAK,CAAC;IACjB,CAAC;AACH,CAAC,CAAC;AAUF,MAAM,CAAC,MAAM,WAAW,GAA2D,CAAC,EAClF,UAAU,EACV,OAAO,GACR,EAAE,EAAE;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,eAAe,GAAG,eAAe,EAAE,CAAC;IAE1C,OAAO,CACL,8BACE,eAAK,SAAS,EAAC,8BAA8B,aAC3C,aAAI,SAAS,EAAC,sEAAsE,YACjF,aAAa,CAAC,QAAQ,CAAC,~~6BAA6B~~,CAAC,CAAC,~~GACpD~~,EACL,YAAG,SAAS,EAAC,iDAAiD,YAC3D,aAAa,CAAC,QAAQ,CAAC,~~4BAA4B~~,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,~~GAC1E~~,IACA,EACN,cAAK,SAAS,EAAC,8BAA8B,YAC1C,eAAe,IAAI,CAClB,KAAC,MAAM,IACL,SAAS,EAAC,8BAA8B,EACxC,OAAO,EAAE,OAAO,YAEf,aAAa,CAAC,QAAQ,CAAC,~~uBAAuB~~,CAAC,CAAC,~~GAC1C~~,CACV,GACG,IACL,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,oBAAoB,GAAwC,CAAC,EACjE,UAAU,EACV,OAAO,GACR,EAAE,EAAE;;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,IAAI,GAAG,gBAAgB,CAAC,UAAU,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,iBAAiB,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,qBAAqB,CAAC,CAAC;IACvE,MAAM,UAAU,GAAG,iBAAiB,CAClC,MAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,mCAAI,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,mBAAmB,mCAAI,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,gBAAgB,CAC1F,CAAC;IACF,MAAM,eAAe,GAAG,eAAe,EAAE,CAAC;IAE1C,OAAO,CACL,mBAAS,SAAS,EAAC,qBAAqB,aACtC,aAAI,SAAS,EAAC,iEAAiE,YAC5E,aAAa,CAAC,QAAQ,CAAC,~~uBAAuB~~,CAAC,CAAC,~~GAC9C~~,EACJ,SAAS,IAAI,CACZ,YAAG,SAAS,EAAC,6CAA6C,YACvD,aAAa,CAAC,QAAQ,CAAC,~~qBAAqB~~,CAAC,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,~~GAClE~~,CACL,EAED,eAAK,SAAS,EAAC,yHAAyH,aACtI,eAAK,SAAS,EAAC,sBAAsB,aACnC,eAAK,SAAS,EAAC,wDAAwD,aACrE,eAAM,SAAS,EAAC,2EAA2E,iBAAa,MAAM,GAAG,EACjH,eAAM,SAAS,EAAC,6DAA6D,YAC1E,aAAa,CACZ,IAAI,KAAK,QAAQ;4CACf,CAAC,CAAC,QAAQ,CAAC,~~8BAA8B~~,CAAC;~~4CAC1C~~,CAAC,CAAC,QAAQ,CAAC~~,+BAA+B~~,CAAC,~~CAC9C~~,GACI,IACH,EACN,YAAG,SAAS,EAAC,sCAAsC,YAChD,UAAU;oCACT,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~4BAA4B~~,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;~~oCAC7E~~,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,~~kCAAkC~~,CAAC,CAAC,~~GAC7D~~,IACA,EACN,cAAK,SAAS,EAAC,wEAAwE,YACpF,eAAe,IAAI,CAClB,KAAC,MAAM,IACL,SAAS,EAAC,8BAA8B,EACxC,OAAO,EAAE,OAAO,YAEf,aAAa,CAAC,QAAQ,CAAC,~~uBAAuB~~,CAAC,CAAC,~~GAC1C~~,CACV,GACG,IACF,IACE,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,oBAAoB,CAAC","sourcesContent":["import React from 'react';\nimport { Button } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport type { CurrentUserSubscriberResult } from '../../types';\nimport { formatDisplayDate } from '../../utils/formatDate';\nimport { resolvePlanLabel } from '../../utils/subscriptionView';\nimport messages from '../messages';\nimport { getCommonTrackingProps } from '@src/tracking/trackingContext';\n\nconst isRenewEligible = () => {\n const { payment_method, subscription_status, isUserSuspended } = getCommonTrackingProps();\n switch (payment_method?.toLowerCase()) {\n case 'stripe':\n return (\n subscription_status === 'RENEWAL_FAILED'\n \|\| subscription_status === 'CANCEL_PENDING'\n );\n\n case 'paypal':\n // User paused subscription or 3 renewal failures\n if (isUserSuspended)\n return true;\n\n // First renewal failure, grace period applies\n if (subscription_status === 'RENEWAL_FAILED')\n return false;\n\n return false;\n\n default:\n return false;\n }\n};\n\ninterface RenewActions {\n onRenew: () => void,\n}\n\ninterface CanceledSubscriptionProps extends RenewActions {\n subscriber: CurrentUserSubscriberResult \| null,\n}\n\nexport const RenewBanner: React.FC<RenewActions & { expireDate: string \| null }> = ({\n expireDate,\n onRenew,\n}) => {\n const { formatMessage } = useIntl();\n if (!expireDate) {\n return null;\n }\n\n const showRenewButton = isRenewEligible();\n\n return (\n <>\n <div className=\"manage-renew-banner__content\">\n <h2 className=\"manage-renew-banner__title h3 font-weight-bold text-primary-500 mb-2\">\n {formatMessage(messages['~~manage~~.canceled.bannerTitle'])}\n </h2>\n <p className=\"manage-renew-banner__body text-primary-500 mb-0\">\n {formatMessage(messages['~~manage~~.canceled.bannerBody'], { date: expireDate })}\n </p>\n </div>\n <div className=\"manage-renew-banner__actions\">\n {showRenewButton && (\n <Button\n className=\"manage-btn manage-btn--brand\"\n onClick={onRenew}\n >\n {formatMessage(messages['~~manage~~.canceled.renew'])}\n </Button>\n )}\n </div>\n </>\n );\n};\n\nconst CanceledSubscription: React.FC<CanceledSubscriptionProps> = ({\n subscriber,\n onRenew,\n}) => {\n const { formatMessage } = useIntl();\n const plan = resolvePlanLabel(subscriber);\n const sinceDate = formatDisplayDate(subscriber?.subscriptionStartDate);\n const canceledOn = formatDisplayDate(\n subscriber?.canceledAt ?? subscriber?.subscriptionEndDate ?? subscriber?.currentPeriodEnd,\n );\n const showRenewButton = isRenewEligible();\n\n return (\n <section className=\"manage-section mt-4\">\n <h2 className=\"manage-section__title h3 font-weight-bold text-primary-500 mb-1\">\n {formatMessage(messages['~~manage~~.active.heading'])}\n </h2>\n {sinceDate && (\n <p className=\"manage-section__subtitle text-gray-700 mb-3\">\n {formatMessage(messages['~~manage~~.active.since'], { date: sinceDate })}\n </p>\n )}\n\n <div className=\"manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded\">\n <div className=\"manage-card__content\">\n <div className=\"manage-card__status-row d-flex align-items-center mb-1\">\n <span className=\"manage-card__status-badge manage-card__status-badge--cancel flex-shrink-0\" aria-hidden=\"true\" />\n <span className=\"manage-card__status-label font-weight-bold text-primary-500\">\n {formatMessage(\n plan === 'annual'\n ? messages['~~manage~~.canceled.statusAnnual']\n : messages['~~manage~~.canceled.statusMonthly'],\n )}\n </span>\n </div>\n <p className=\"manage-card__body text-gray-700 mb-0\">\n {canceledOn\n ? formatMessage(messages['~~manage~~.canceled.noPayments'], { date: canceledOn })\n : formatMessage(messages['~~manage~~.canceled.noPaymentsNoDate'])}\n </p>\n </div>\n <div className=\"manage-card__actions d-flex flex-wrap align-items-center flex-shrink-0\">\n {showRenewButton && (\n <Button\n className=\"manage-btn manage-btn--brand\"\n onClick={onRenew}\n >\n {formatMessage(messages['~~manage~~.canceled.renew'])}\n </Button>\n )}\n </div>\n </div>\n </section>\n );\n};\n\nexport default CanceledSubscription;\n"]}
1	+ {"version":3,"file":"CanceledSubscription.js","sourceRoot":"","sources":["../../../src/components/CanceledSubscription/CanceledSubscription.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Button } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport type { CurrentUserSubscriberResult } from '../../types';\nimport { formatDisplayDate } from '../../utils/formatDate';\nimport { resolvePlanLabel } from '../../utils/subscriptionView';\nimport messages from '../messages';\nimport { getCommonTrackingProps } from '@src/tracking/trackingContext';\n\nconst isRenewEligible = () => {\n const { payment_method, subscription_status, isUserSuspended } = getCommonTrackingProps();\n switch (payment_method?.toLowerCase()) {\n case 'stripe':\n return (\n subscription_status === 'RENEWAL_FAILED'\n \|\| subscription_status === 'CANCEL_PENDING'\n );\n\n case 'paypal':\n // User paused subscription or 3 renewal failures\n if (isUserSuspended)\n return true;\n\n // First renewal failure, grace period applies\n if (subscription_status === 'RENEWAL_FAILED')\n return false;\n\n return false;\n\n default:\n return false;\n }\n};\n\ninterface RenewActions {\n onRenew: () => void,\n}\n\ninterface CanceledSubscriptionProps extends RenewActions {\n subscriber: CurrentUserSubscriberResult \| null,\n}\n\nexport const RenewBanner: React.FC<RenewActions & { expireDate: string \| null }> = ({\n expireDate,\n onRenew,\n}) => {\n const { formatMessage } = useIntl();\n if (!expireDate) {\n return null;\n }\n\n const showRenewButton = isRenewEligible();\n\n return (\n <>\n <div className=\"manage-renew-banner__content\">\n <h2 className=\"manage-renew-banner__title h3 font-weight-bold text-primary-500 mb-2\">\n {formatMessage(messages['order-history.canceled.bannerTitle'])}\n </h2>\n <p className=\"manage-renew-banner__body text-primary-500 mb-0\">\n {formatMessage(messages['order-history.canceled.bannerBody'], { date: expireDate })}\n </p>\n </div>\n <div className=\"manage-renew-banner__actions\">\n {showRenewButton && (\n <Button\n className=\"manage-btn manage-btn--brand\"\n onClick={onRenew}\n >\n {formatMessage(messages['order-history.canceled.renew'])}\n </Button>\n )}\n </div>\n </>\n );\n};\n\nconst CanceledSubscription: React.FC<CanceledSubscriptionProps> = ({\n subscriber,\n onRenew,\n}) => {\n const { formatMessage } = useIntl();\n const plan = resolvePlanLabel(subscriber);\n const sinceDate = formatDisplayDate(subscriber?.subscriptionStartDate);\n const canceledOn = formatDisplayDate(\n subscriber?.canceledAt ?? subscriber?.subscriptionEndDate ?? subscriber?.currentPeriodEnd,\n );\n const showRenewButton = isRenewEligible();\n\n return (\n <section className=\"manage-section mt-4\">\n <h2 className=\"manage-section__title h3 font-weight-bold text-primary-500 mb-1\">\n {formatMessage(messages['order-history.active.heading'])}\n </h2>\n {sinceDate && (\n <p className=\"manage-section__subtitle text-gray-700 mb-3\">\n {formatMessage(messages['order-history.active.since'], { date: sinceDate })}\n </p>\n )}\n\n <div className=\"manage-card d-flex flex-column flex-md-row align-items-md-center justify-content-md-between bg-white border p-4 rounded\">\n <div className=\"manage-card__content\">\n <div className=\"manage-card__status-row d-flex align-items-center mb-1\">\n <span className=\"manage-card__status-badge manage-card__status-badge--cancel flex-shrink-0\" aria-hidden=\"true\" />\n <span className=\"manage-card__status-label font-weight-bold text-primary-500\">\n {formatMessage(\n plan === 'annual'\n ? messages['order-history.canceled.statusAnnual']\n : messages['order-history.canceled.statusMonthly'],\n )}\n </span>\n </div>\n <p className=\"manage-card__body text-gray-700 mb-0\">\n {canceledOn\n ? formatMessage(messages['order-history.canceled.noPayments'], { date: canceledOn })\n : formatMessage(messages['order-history.canceled.noPaymentsNoDate'])}\n </p>\n </div>\n <div className=\"manage-card__actions d-flex flex-wrap align-items-center flex-shrink-0\">\n {showRenewButton && (\n <Button\n className=\"manage-btn manage-btn--brand\"\n onClick={onRenew}\n >\n {formatMessage(messages['order-history.canceled.renew'])}\n </Button>\n )}\n </div>\n </div>\n </section>\n );\n};\n\nexport default CanceledSubscription;\n"]}

package/dist/components/EnrolledCoursesList/EnrolledCoursesList.js CHANGED Viewed

@@ -7,12 +7,12 @@ const EnrolledCoursesList = ({ enrollments, isLoading = false, }) => {
     if (isLoading || enrollments.length === 0) {
         return null;
     }
-    return (_jsxs("div", { className: "manage-courses", children: [_jsx("h3", { className: "manage-courses__heading font-weight-bold text-primary-500 mb-3", children: formatMessage(messages['manage.cancel.coursesHeading'], {
+    return (_jsxs("div", { className: "manage-courses", children: [_jsx("h3", { className: "manage-courses__heading font-weight-bold text-primary-500 mb-3", children: formatMessage(messages['order-history.cancel.coursesHeading'], {
                     count: enrollments.length,
                 }) }), _jsx("ul", { className: "manage-courses__list list-unstyled m-0 p-0 bg-white border rounded", children: enrollments.map((enrollment) => {
                     var _a, _b, _c, _d;
                     const showCertificate = Boolean(enrollment.certificateUrl);
-                    return (_jsxs("li", { className: "manage-courses__item d-flex align-items-start border-bottom p-3", children: [_jsx("div", { className: "manage-courses__logo-wrap flex-shrink-0 mr-3", children: enrollment.imageUrl || enrollment.orgLogoUrl ? (_jsx(Image, { className: "manage-courses__logo border bg-white rounded", src: enrollment.imageUrl || enrollment.orgLogoUrl || '', alt: (_b = (_a = enrollment.courseName) !== null && _a !== void 0 ? _a : enrollment.orgName) !== null && _b !== void 0 ? _b : '' })) : (_jsx("div", { className: "manage-courses__logo manage-courses__logo--placeholder border rounded" })) }), _jsxs("div", { className: "manage-courses__meta flex-grow-1", children: [enrollment.courseSlug ? (_jsx("a", { className: "manage-courses__title font-weight-bold text-primary-500 d-inline-block mb-1", href: `/${enrollment.courseSlug}`, children: (_c = enrollment.courseName) !== null && _c !== void 0 ? _c : enrollment.courseRunKey })) : (_jsx("span", { className: "manage-courses__title manage-courses__title--static font-weight-bold text-primary-500 d-inline-block text-decoration-none mb-1", children: (_d = enrollment.courseName) !== null && _d !== void 0 ? _d : enrollment.courseRunKey })), enrollment.orgName && (_jsx("p", { className: "manage-courses__org text-gray-700 small mb-0", children: enrollment.orgName })), showCertificate && (_jsx(Button, { size: "sm", variant: "outline-primary", className: "manage-btn manage-btn--outline-dark d-md-none mt-2", href: enrollment.certificateUrl || undefined, children: formatMessage(messages['manage.cancel.viewCertificate']) }))] }), showCertificate && (_jsx("div", { className: "d-none d-md-block flex-shrink-0 align-self-center ml-3", children: _jsx(Button, { size: "sm", variant: "outline-primary", className: "manage-btn manage-btn--outline-dark", href: enrollment.certificateUrl || undefined, children: formatMessage(messages['manage.cancel.viewCertificate']) }) }))] }, enrollment.biId));
+                    return (_jsxs("li", { className: "manage-courses__item d-flex align-items-start border-bottom p-3", children: [_jsx("div", { className: "manage-courses__logo-wrap flex-shrink-0 mr-3", children: enrollment.imageUrl || enrollment.orgLogoUrl ? (_jsx(Image, { className: "manage-courses__logo border bg-white rounded", src: enrollment.imageUrl || enrollment.orgLogoUrl || '', alt: (_b = (_a = enrollment.courseName) !== null && _a !== void 0 ? _a : enrollment.orgName) !== null && _b !== void 0 ? _b : '' })) : (_jsx("div", { className: "manage-courses__logo manage-courses__logo--placeholder border rounded" })) }), _jsxs("div", { className: "manage-courses__meta flex-grow-1", children: [enrollment.courseSlug ? (_jsx("a", { className: "manage-courses__title font-weight-bold text-primary-500 d-inline-block mb-1", href: `/${enrollment.courseSlug}`, children: (_c = enrollment.courseName) !== null && _c !== void 0 ? _c : enrollment.courseRunKey })) : (_jsx("span", { className: "manage-courses__title manage-courses__title--static font-weight-bold text-primary-500 d-inline-block text-decoration-none mb-1", children: (_d = enrollment.courseName) !== null && _d !== void 0 ? _d : enrollment.courseRunKey })), enrollment.orgName && (_jsx("p", { className: "manage-courses__org text-gray-700 small mb-0", children: enrollment.orgName })), showCertificate && (_jsx(Button, { size: "sm", variant: "outline-primary", className: "manage-btn manage-btn--outline-dark d-md-none mt-2", href: enrollment.certificateUrl || undefined, children: formatMessage(messages['order-history.cancel.viewCertificate']) }))] }), showCertificate && (_jsx("div", { className: "d-none d-md-block flex-shrink-0 align-self-center ml-3", children: _jsx(Button, { size: "sm", variant: "outline-primary", className: "manage-btn manage-btn--outline-dark", href: enrollment.certificateUrl || undefined, children: formatMessage(messages['order-history.cancel.viewCertificate']) }) }))] }, enrollment.biId));
                 }) })] }));
 };
 export default EnrolledCoursesList;

package/dist/components/EnrolledCoursesList/EnrolledCoursesList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EnrolledCoursesList.js","sourceRoot":"","sources":["../../../src/components/EnrolledCoursesList/EnrolledCoursesList.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,OAAO,QAAQ,MAAM,aAAa,CAAC;AAOnC,MAAM,mBAAmB,GAAuC,CAAC,EAC/D,WAAW,EACX,SAAS,GAAG,KAAK,GAClB,EAAE,EAAE;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,IAAI,SAAS,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC1C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAC,gBAAgB,aAC7B,aAAI,SAAS,EAAC,gEAAgE,YAC3E,aAAa,CAAC,QAAQ,CAAC,~~8BAA8B~~,CAAC,EAAE;~~oBACvD~~,KAAK,EAAE,WAAW,CAAC,MAAM;iBAC1B,CAAC,GACC,EACL,aAAI,SAAS,EAAC,oEAAoE,YAC/E,WAAW,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE;;oBAC9B,MAAM,eAAe,GAAG,OAAO,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;oBAE3D,OAAO,CACL,cAEE,SAAS,EAAC,iEAAiE,aAE3E,cAAK,SAAS,EAAC,8CAA8C,YAC1D,UAAU,CAAC,QAAQ,IAAI,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CAC9C,KAAC,KAAK,IACJ,SAAS,EAAC,8CAA8C,EACxD,GAAG,EAAE,UAAU,CAAC,QAAQ,IAAI,UAAU,CAAC,UAAU,IAAI,EAAE,EACvD,GAAG,EAAE,MAAA,MAAA,UAAU,CAAC,UAAU,mCAAI,UAAU,CAAC,OAAO,mCAAI,EAAE,GACtD,CACH,CAAC,CAAC,CAAC,CACF,cAAK,SAAS,EAAC,uEAAuE,GAAG,CAC1F,GACG,EACN,eAAK,SAAS,EAAC,kCAAkC,aAC9C,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CACvB,YACE,SAAS,EAAC,6EAA6E,EACvF,IAAI,EAAE,IAAI,UAAU,CAAC,UAAU,EAAE,YAEhC,MAAA,UAAU,CAAC,UAAU,mCAAI,UAAU,CAAC,YAAY,GAC/C,CACL,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAC,gIAAgI,YAC7I,MAAA,UAAU,CAAC,UAAU,mCAAI,UAAU,CAAC,YAAY,GAC5C,CACR,EACA,UAAU,CAAC,OAAO,IAAI,CACrB,YAAG,SAAS,EAAC,8CAA8C,YAAE,UAAU,CAAC,OAAO,GAAK,CACrF,EACA,eAAe,IAAI,CAClB,KAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,iBAAiB,EACzB,SAAS,EAAC,oDAAoD,EAC9D,IAAI,EAAE,UAAU,CAAC,cAAc,IAAI,SAAS,YAE3C,aAAa,CAAC,QAAQ,CAAC~~,+BAA+B~~,CAAC,CAAC,~~GAClD~~,CACV,IACG,EACL,eAAe,IAAI,CAClB,cAAK,SAAS,EAAC,wDAAwD,YACrE,KAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,iBAAiB,EACzB,SAAS,EAAC,qCAAqC,EAC/C,IAAI,EAAE,UAAU,CAAC,cAAc,IAAI,SAAS,YAE3C,aAAa,CAAC,QAAQ,CAAC~~,+BAA+B~~,CAAC,CAAC,~~GAClD~~,GACL,CACP,KApDI,UAAU,CAAC,IAAI,CAqDjB,CACN,CAAC;gBACJ,CAAC,CAAC,GACC,IACD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC","sourcesContent":["import React from 'react';\nimport { Button, Image } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport type { SubscriptionEnrollment } from '../../types';\nimport messages from '../messages';\n\ninterface EnrolledCoursesListProps {\n enrollments: SubscriptionEnrollment[],\n isLoading?: boolean,\n}\n\nconst EnrolledCoursesList: React.FC<EnrolledCoursesListProps> = ({\n enrollments,\n isLoading = false,\n}) => {\n const { formatMessage } = useIntl();\n\n if (isLoading \|\| enrollments.length === 0) {\n return null;\n }\n\n return (\n <div className=\"manage-courses\">\n <h3 className=\"manage-courses__heading font-weight-bold text-primary-500 mb-3\">\n {formatMessage(messages['~~manage~~.cancel.coursesHeading'], {\n count: enrollments.length,\n })}\n </h3>\n <ul className=\"manage-courses__list list-unstyled m-0 p-0 bg-white border rounded\">\n {enrollments.map((enrollment) => {\n const showCertificate = Boolean(enrollment.certificateUrl);\n\n return (\n <li\n key={enrollment.biId}\n className=\"manage-courses__item d-flex align-items-start border-bottom p-3\"\n >\n <div className=\"manage-courses__logo-wrap flex-shrink-0 mr-3\">\n {enrollment.imageUrl \|\| enrollment.orgLogoUrl ? (\n <Image\n className=\"manage-courses__logo border bg-white rounded\"\n src={enrollment.imageUrl \|\| enrollment.orgLogoUrl \|\| ''}\n alt={enrollment.courseName ?? enrollment.orgName ?? ''}\n />\n ) : (\n <div className=\"manage-courses__logo manage-courses__logo--placeholder border rounded\" />\n )}\n </div>\n <div className=\"manage-courses__meta flex-grow-1\">\n {enrollment.courseSlug ? (\n <a\n className=\"manage-courses__title font-weight-bold text-primary-500 d-inline-block mb-1\"\n href={`/${enrollment.courseSlug}`}\n >\n {enrollment.courseName ?? enrollment.courseRunKey}\n </a>\n ) : (\n <span className=\"manage-courses__title manage-courses__title--static font-weight-bold text-primary-500 d-inline-block text-decoration-none mb-1\">\n {enrollment.courseName ?? enrollment.courseRunKey}\n </span>\n )}\n {enrollment.orgName && (\n <p className=\"manage-courses__org text-gray-700 small mb-0\">{enrollment.orgName}</p>\n )}\n {showCertificate && (\n <Button\n size=\"sm\"\n variant=\"outline-primary\"\n className=\"manage-btn manage-btn--outline-dark d-md-none mt-2\"\n href={enrollment.certificateUrl \|\| undefined}\n >\n {formatMessage(messages['~~manage~~.cancel.viewCertificate'])}\n </Button>\n )}\n </div>\n {showCertificate && (\n <div className=\"d-none d-md-block flex-shrink-0 align-self-center ml-3\">\n <Button\n size=\"sm\"\n variant=\"outline-primary\"\n className=\"manage-btn manage-btn--outline-dark\"\n href={enrollment.certificateUrl \|\| undefined}\n >\n {formatMessage(messages['~~manage~~.cancel.viewCertificate'])}\n </Button>\n </div>\n )}\n </li>\n );\n })}\n </ul>\n </div>\n );\n};\n\nexport default EnrolledCoursesList;\n"]}
1	+ {"version":3,"file":"EnrolledCoursesList.js","sourceRoot":"","sources":["../../../src/components/EnrolledCoursesList/EnrolledCoursesList.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,OAAO,QAAQ,MAAM,aAAa,CAAC;AAOnC,MAAM,mBAAmB,GAAuC,CAAC,EAC/D,WAAW,EACX,SAAS,GAAG,KAAK,GAClB,EAAE,EAAE;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,IAAI,SAAS,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC1C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAC,gBAAgB,aAC7B,aAAI,SAAS,EAAC,gEAAgE,YAC3E,aAAa,CAAC,QAAQ,CAAC,qCAAqC,CAAC,EAAE;oBAC9D,KAAK,EAAE,WAAW,CAAC,MAAM;iBAC1B,CAAC,GACC,EACL,aAAI,SAAS,EAAC,oEAAoE,YAC/E,WAAW,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE;;oBAC9B,MAAM,eAAe,GAAG,OAAO,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;oBAE3D,OAAO,CACL,cAEE,SAAS,EAAC,iEAAiE,aAE3E,cAAK,SAAS,EAAC,8CAA8C,YAC1D,UAAU,CAAC,QAAQ,IAAI,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CAC9C,KAAC,KAAK,IACJ,SAAS,EAAC,8CAA8C,EACxD,GAAG,EAAE,UAAU,CAAC,QAAQ,IAAI,UAAU,CAAC,UAAU,IAAI,EAAE,EACvD,GAAG,EAAE,MAAA,MAAA,UAAU,CAAC,UAAU,mCAAI,UAAU,CAAC,OAAO,mCAAI,EAAE,GACtD,CACH,CAAC,CAAC,CAAC,CACF,cAAK,SAAS,EAAC,uEAAuE,GAAG,CAC1F,GACG,EACN,eAAK,SAAS,EAAC,kCAAkC,aAC9C,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CACvB,YACE,SAAS,EAAC,6EAA6E,EACvF,IAAI,EAAE,IAAI,UAAU,CAAC,UAAU,EAAE,YAEhC,MAAA,UAAU,CAAC,UAAU,mCAAI,UAAU,CAAC,YAAY,GAC/C,CACL,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAC,gIAAgI,YAC7I,MAAA,UAAU,CAAC,UAAU,mCAAI,UAAU,CAAC,YAAY,GAC5C,CACR,EACA,UAAU,CAAC,OAAO,IAAI,CACrB,YAAG,SAAS,EAAC,8CAA8C,YAAE,UAAU,CAAC,OAAO,GAAK,CACrF,EACA,eAAe,IAAI,CAClB,KAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,iBAAiB,EACzB,SAAS,EAAC,oDAAoD,EAC9D,IAAI,EAAE,UAAU,CAAC,cAAc,IAAI,SAAS,YAE3C,aAAa,CAAC,QAAQ,CAAC,sCAAsC,CAAC,CAAC,GACzD,CACV,IACG,EACL,eAAe,IAAI,CAClB,cAAK,SAAS,EAAC,wDAAwD,YACrE,KAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,iBAAiB,EACzB,SAAS,EAAC,qCAAqC,EAC/C,IAAI,EAAE,UAAU,CAAC,cAAc,IAAI,SAAS,YAE3C,aAAa,CAAC,QAAQ,CAAC,sCAAsC,CAAC,CAAC,GACzD,GACL,CACP,KApDI,UAAU,CAAC,IAAI,CAqDjB,CACN,CAAC;gBACJ,CAAC,CAAC,GACC,IACD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC","sourcesContent":["import React from 'react';\nimport { Button, Image } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport type { SubscriptionEnrollment } from '../../types';\nimport messages from '../messages';\n\ninterface EnrolledCoursesListProps {\n enrollments: SubscriptionEnrollment[],\n isLoading?: boolean,\n}\n\nconst EnrolledCoursesList: React.FC<EnrolledCoursesListProps> = ({\n enrollments,\n isLoading = false,\n}) => {\n const { formatMessage } = useIntl();\n\n if (isLoading \|\| enrollments.length === 0) {\n return null;\n }\n\n return (\n <div className=\"manage-courses\">\n <h3 className=\"manage-courses__heading font-weight-bold text-primary-500 mb-3\">\n {formatMessage(messages['order-history.cancel.coursesHeading'], {\n count: enrollments.length,\n })}\n </h3>\n <ul className=\"manage-courses__list list-unstyled m-0 p-0 bg-white border rounded\">\n {enrollments.map((enrollment) => {\n const showCertificate = Boolean(enrollment.certificateUrl);\n\n return (\n <li\n key={enrollment.biId}\n className=\"manage-courses__item d-flex align-items-start border-bottom p-3\"\n >\n <div className=\"manage-courses__logo-wrap flex-shrink-0 mr-3\">\n {enrollment.imageUrl \|\| enrollment.orgLogoUrl ? (\n <Image\n className=\"manage-courses__logo border bg-white rounded\"\n src={enrollment.imageUrl \|\| enrollment.orgLogoUrl \|\| ''}\n alt={enrollment.courseName ?? enrollment.orgName ?? ''}\n />\n ) : (\n <div className=\"manage-courses__logo manage-courses__logo--placeholder border rounded\" />\n )}\n </div>\n <div className=\"manage-courses__meta flex-grow-1\">\n {enrollment.courseSlug ? (\n <a\n className=\"manage-courses__title font-weight-bold text-primary-500 d-inline-block mb-1\"\n href={`/${enrollment.courseSlug}`}\n >\n {enrollment.courseName ?? enrollment.courseRunKey}\n </a>\n ) : (\n <span className=\"manage-courses__title manage-courses__title--static font-weight-bold text-primary-500 d-inline-block text-decoration-none mb-1\">\n {enrollment.courseName ?? enrollment.courseRunKey}\n </span>\n )}\n {enrollment.orgName && (\n <p className=\"manage-courses__org text-gray-700 small mb-0\">{enrollment.orgName}</p>\n )}\n {showCertificate && (\n <Button\n size=\"sm\"\n variant=\"outline-primary\"\n className=\"manage-btn manage-btn--outline-dark d-md-none mt-2\"\n href={enrollment.certificateUrl \|\| undefined}\n >\n {formatMessage(messages['order-history.cancel.viewCertificate'])}\n </Button>\n )}\n </div>\n {showCertificate && (\n <div className=\"d-none d-md-block flex-shrink-0 align-self-center ml-3\">\n <Button\n size=\"sm\"\n variant=\"outline-primary\"\n className=\"manage-btn manage-btn--outline-dark\"\n href={enrollment.certificateUrl \|\| undefined}\n >\n {formatMessage(messages['order-history.cancel.viewCertificate'])}\n </Button>\n </div>\n )}\n </li>\n );\n })}\n </ul>\n </div>\n );\n};\n\nexport default EnrolledCoursesList;\n"]}

package/dist/components/HelpFooter/HelpFooter.js CHANGED Viewed

@@ -8,7 +8,7 @@ import { trackManageSubscriptionVisitHelpCenterButtonClick } from '../../trackin
 const HelpFooter = () => {
     const { formatMessage } = useIntl();
     const helpUrl = getLearnerHelpCenterUrl();
-    return (_jsx("div", { className: "manage-help mt-5 pt-4 border-top", children: _jsxs("p", { className: "manage-help__text text-gray-700 small mb-0", children: [formatMessage(messages['manage.help.prefix']), ' ', _jsxs(Link, { to: helpUrl, className: "manage-help__link font-weight-bold text-primary-500 d-inline-flex align-items-center", target: "_blank", rel: "noopener noreferrer", onClick: () => trackManageSubscriptionVisitHelpCenterButtonClick({ linkPath: helpUrl }), children: [formatMessage(messages['manage.help.link']), _jsx(ExternalLinkIcon, { className: "manage-help__icon ml-2", size: 14 })] })] }) }));
+    return (_jsx("div", { className: "manage-help mt-5 pt-4 border-top", children: _jsxs("p", { className: "manage-help__text text-gray-700 small mb-0", children: [formatMessage(messages['order-history.help.prefix']), ' ', _jsxs(Link, { to: helpUrl, className: "manage-help__link font-weight-bold text-primary-500 d-inline-flex align-items-center", target: "_blank", rel: "noopener noreferrer", onClick: () => trackManageSubscriptionVisitHelpCenterButtonClick({ linkPath: helpUrl }), children: [formatMessage(messages['order-history.help.link']), _jsx(ExternalLinkIcon, { className: "manage-help__icon ml-2", size: 14 })] })] }) }));
 };
 export default HelpFooter;
 //# sourceMappingURL=HelpFooter.js.map

package/dist/components/HelpFooter/HelpFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HelpFooter.js","sourceRoot":"","sources":["../../../src/components/HelpFooter/HelpFooter.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,iDAAiD,EAAE,MAAM,eAAe,CAAC;AAElF,MAAM,UAAU,GAAa,GAAG,EAAE;IAChC,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,OAAO,GAAG,uBAAuB,EAAE,CAAC;IAE1C,OAAO,CACL,cAAK,SAAS,EAAC,kCAAkC,YAC/C,aAAG,SAAS,EAAC,4CAA4C,aACtD,aAAa,CAAC,QAAQ,CAAC,~~oBAAoB~~,CAAC,CAAC,~~EAC7C~~,GAAG,EACJ,MAAC,IAAI,IAAC,EAAE,EAAE,OAAO,EAAE,SAAS,EAAC,sFAAsF,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,iDAAiD,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,aAClP,aAAa,CAAC,QAAQ,CAAC,~~kBAAkB~~,CAAC,CAAC,~~EAC5C~~,KAAC,gBAAgB,IAAC,SAAS,EAAC,wBAAwB,EAAC,IAAI,EAAE,EAAE,GAAI,IAC5D,IACL,GACA,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import React from 'react';\nimport { Link } from 'react-router-dom';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { ExternalLinkIcon } from '../../icons';\nimport { getLearnerHelpCenterUrl } from '../../utils/urls';\nimport messages from '../messages';\nimport { trackManageSubscriptionVisitHelpCenterButtonClick } from '@src/tracking';\n\nconst HelpFooter: React.FC = () => {\n const { formatMessage } = useIntl();\n const helpUrl = getLearnerHelpCenterUrl();\n\n return (\n <div className=\"manage-help mt-5 pt-4 border-top\">\n <p className=\"manage-help__text text-gray-700 small mb-0\">\n {formatMessage(messages['~~manage~~.help.prefix'])}\n {' '}\n <Link to={helpUrl} className=\"manage-help__link font-weight-bold text-primary-500 d-inline-flex align-items-center\" target=\"_blank\" rel=\"noopener noreferrer\" onClick={() => trackManageSubscriptionVisitHelpCenterButtonClick({ linkPath: helpUrl })}>\n {formatMessage(messages['~~manage~~.help.link'])}\n <ExternalLinkIcon className=\"manage-help__icon ml-2\" size={14} />\n </Link>\n </p>\n </div>\n );\n};\n\nexport default HelpFooter;\n"]}
1	+ {"version":3,"file":"HelpFooter.js","sourceRoot":"","sources":["../../../src/components/HelpFooter/HelpFooter.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,iDAAiD,EAAE,MAAM,eAAe,CAAC;AAElF,MAAM,UAAU,GAAa,GAAG,EAAE;IAChC,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,OAAO,GAAG,uBAAuB,EAAE,CAAC;IAE1C,OAAO,CACL,cAAK,SAAS,EAAC,kCAAkC,YAC/C,aAAG,SAAS,EAAC,4CAA4C,aACtD,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,EACpD,GAAG,EACJ,MAAC,IAAI,IAAC,EAAE,EAAE,OAAO,EAAE,SAAS,EAAC,sFAAsF,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,iDAAiD,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,aAClP,aAAa,CAAC,QAAQ,CAAC,yBAAyB,CAAC,CAAC,EACnD,KAAC,gBAAgB,IAAC,SAAS,EAAC,wBAAwB,EAAC,IAAI,EAAE,EAAE,GAAI,IAC5D,IACL,GACA,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import React from 'react';\nimport { Link } from 'react-router-dom';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { ExternalLinkIcon } from '../../icons';\nimport { getLearnerHelpCenterUrl } from '../../utils/urls';\nimport messages from '../messages';\nimport { trackManageSubscriptionVisitHelpCenterButtonClick } from '@src/tracking';\n\nconst HelpFooter: React.FC = () => {\n const { formatMessage } = useIntl();\n const helpUrl = getLearnerHelpCenterUrl();\n\n return (\n <div className=\"manage-help mt-5 pt-4 border-top\">\n <p className=\"manage-help__text text-gray-700 small mb-0\">\n {formatMessage(messages['order-history.help.prefix'])}\n {' '}\n <Link to={helpUrl} className=\"manage-help__link font-weight-bold text-primary-500 d-inline-flex align-items-center\" target=\"_blank\" rel=\"noopener noreferrer\" onClick={() => trackManageSubscriptionVisitHelpCenterButtonClick({ linkPath: helpUrl })}>\n {formatMessage(messages['order-history.help.link'])}\n <ExternalLinkIcon className=\"manage-help__icon ml-2\" size={14} />\n </Link>\n </p>\n </div>\n );\n};\n\nexport default HelpFooter;\n"]}

package/dist/components/OrderHistory/OrderHistoryCard.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+interface OrderCardProps {
+    title: string;
+    purchaseDate: string;
+    totalCost: string;
+    orderNumber: string;
+    isReceiptDisabled?: boolean;
+    onViewReceipt: () => void;
+    onViewOrderDetails: () => void;
+}
+declare const OrderHistoryCard: ({ title, purchaseDate, totalCost, orderNumber, isReceiptDisabled, onViewReceipt, onViewOrderDetails, }: OrderCardProps) => import("react/jsx-runtime").JSX.Element;
+export default OrderHistoryCard;

package/dist/components/OrderHistory/OrderHistoryCard.js ADDED Viewed

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, Button, Icon } from '@openedx/paragon';
+import { Launch } from '@openedx/paragon/icons';
+const OrderHistoryCard = ({ title, purchaseDate, totalCost, orderNumber, isReceiptDisabled = false, onViewReceipt, onViewOrderDetails, }) => (_jsx(Card, { className: "order-card", children: _jsx(Card.Body, { className: "p-3", children: _jsxs("div", { className: "d-flex justify-content-between align-items-start flex-wrap", children: [_jsxs("div", { children: [_jsx("h6", { className: "mb-2", children: title }), _jsxs("div", { className: "d-flex gap-1", children: [_jsxs("div", { className: "x-small", children: [_jsx("p", { className: "text-muted orderHistoryCard__details mr1-1 mb-0", children: "Date of purchase:" }), _jsx("p", { className: "text-muted mr-1 orderHistoryCard__details mb-0", children: "Total cost:" }), _jsx("p", { className: "text-muted mr-1 orderHistoryCard__details mb-0", children: "Order number:" })] }), _jsxs("div", { className: "x-small", children: [_jsx("p", { className: "mb-0", children: purchaseDate }), _jsx("p", { className: "mb-0", children: totalCost }), _jsx("p", { className: "mb-0", children: orderNumber })] })] })] }), _jsxs("div", { className: "d-flex align-items-center gap-3 mt-2 mt-md-auto", children: [_jsxs(Button, { variant: "link", size: "sm", onClick: isReceiptDisabled ? undefined : onViewReceipt, disabled: isReceiptDisabled, className: "d-flex gap-1 p-0 orderHistoryCard__link", children: ["View receipt ", _jsx("span", { children: _jsx(Icon, { size: "xs", src: Launch }) })] }), _jsx(Button, { variant: "link", size: "sm", onClick: onViewOrderDetails, className: "p-0 orderHistoryCard__link", children: "View order details" })] })] }) }) }));
+export default OrderHistoryCard;
+//# sourceMappingURL=OrderHistoryCard.js.map

package/dist/components/OrderHistory/OrderHistoryCard.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"OrderHistoryCard.js","sourceRoot":"","sources":["../../../src/components/OrderHistory/OrderHistoryCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAYhD,MAAM,gBAAgB,GAAG,CAAC,EACxB,KAAK,EACL,YAAY,EACZ,SAAS,EACT,WAAW,EACX,iBAAiB,GAAG,KAAK,EACzB,aAAa,EACb,kBAAkB,GACH,EAAE,EAAE,CAAC,CACpB,KAAC,IAAI,IAAC,SAAS,EAAC,YAAY,YAC1B,KAAC,IAAI,CAAC,IAAI,IAAC,SAAS,EAAC,KAAK,YACxB,eAAK,SAAS,EAAC,4DAA4D,aACzE,0BACE,aAAI,SAAS,EAAC,MAAM,YAAE,KAAK,GAAM,EAEjC,eAAK,SAAS,EAAC,cAAc,aAC3B,eAAK,SAAS,EAAC,SAAS,aACtB,YAAG,SAAS,EAAC,iDAAiD,kCAAsB,EACpF,YAAG,SAAS,EAAC,gDAAgD,4BAAgB,EAC7E,YAAG,SAAS,EAAC,gDAAgD,8BAAkB,IAC3E,EAEN,eAAK,SAAS,EAAC,SAAS,aACtB,YAAG,SAAS,EAAC,MAAM,YAAE,YAAY,GAAK,EACtC,YAAG,SAAS,EAAC,MAAM,YAAE,SAAS,GAAK,EACnC,YAAG,SAAS,EAAC,MAAM,YAAE,WAAW,GAAK,IACjC,IACF,IACF,EAEN,eAAK,SAAS,EAAC,iDAAiD,aAC9D,MAAC,MAAM,IACL,OAAO,EAAC,MAAM,EACd,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,EACtD,QAAQ,EAAE,iBAAiB,EAC3B,SAAS,EAAC,yCAAyC,8BAEtC,yBAAM,KAAC,IAAI,IAAC,IAAI,EAAC,IAAI,EAAC,GAAG,EAAE,MAAM,GAAI,GAAO,IAClD,EAET,KAAC,MAAM,IACL,OAAO,EAAC,MAAM,EACd,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,kBAAkB,EAC3B,SAAS,EAAC,4BAA4B,mCAG/B,IACL,IACF,GACI,GACP,CACR,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { Card, Button, Icon } from '@openedx/paragon';\nimport { Launch } from '@openedx/paragon/icons';\n\ninterface OrderCardProps {\n title: string,\n purchaseDate: string,\n totalCost: string,\n orderNumber: string,\n isReceiptDisabled?: boolean,\n onViewReceipt: () => void,\n onViewOrderDetails: () => void,\n}\n\nconst OrderHistoryCard = ({\n title,\n purchaseDate,\n totalCost,\n orderNumber,\n isReceiptDisabled = false,\n onViewReceipt,\n onViewOrderDetails,\n}: OrderCardProps) => (\n <Card className=\"order-card\">\n <Card.Body className=\"p-3\">\n <div className=\"d-flex justify-content-between align-items-start flex-wrap\">\n <div>\n <h6 className=\"mb-2\">{title}</h6>\n\n <div className=\"d-flex gap-1\">\n <div className=\"x-small\">\n <p className=\"text-muted orderHistoryCard__details mr1-1 mb-0\">Date of purchase:</p>\n <p className=\"text-muted mr-1 orderHistoryCard__details mb-0\">Total cost:</p>\n <p className=\"text-muted mr-1 orderHistoryCard__details mb-0\">Order number:</p>\n </div>\n\n <div className=\"x-small\">\n <p className=\"mb-0\">{purchaseDate}</p>\n <p className=\"mb-0\">{totalCost}</p>\n <p className=\"mb-0\">{orderNumber}</p>\n </div>\n </div>\n </div>\n\n <div className=\"d-flex align-items-center gap-3 mt-2 mt-md-auto\">\n <Button\n variant=\"link\"\n size=\"sm\"\n onClick={isReceiptDisabled ? undefined : onViewReceipt}\n disabled={isReceiptDisabled}\n className=\"d-flex gap-1 p-0 orderHistoryCard__link\"\n >\n View receipt <span><Icon size=\"xs\" src={Launch} /></span>\n </Button>\n\n <Button\n variant=\"link\"\n size=\"sm\"\n onClick={onViewOrderDetails}\n className=\"p-0 orderHistoryCard__link\"\n >\n View order details\n </Button>\n </div>\n </div>\n </Card.Body>\n </Card>\n);\n\nexport default OrderHistoryCard;\n"]}

package/dist/components/OrderHistory/OrderHistoryDetails.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ declare const OrderHistoryDetails: () => import("react/jsx-runtime").JSX.Element;
2	+ export default OrderHistoryDetails;

package/dist/components/OrderHistory/OrderHistoryDetails.js ADDED Viewed

@@ -0,0 +1,120 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { useParams } from 'react-router-dom';
+import { Alert, Breadcrumb, Container, Spinner } from '@openedx/paragon';
+import { useIntl } from '@openedx/frontend-base';
+import { ORDER_HISTORY_PATH } from '../../constants';
+import getFormattedCurrency from '../../utils/currency';
+import { useViaxClient, useViaxSession } from '../../data/hooks/useManageQueries';
+import { useOrderDetailsQuery } from '../../data/hooks/useOrderHistoryQueries';
+import messages from './messages';
+import { getOrderSummaryRows, getOrderItemRows } from './data/receiptRows';
+import { ProgramItemsTable } from './ProgramItemsTable';
+const formatDate = (isoDate) => (new Date(isoDate).toLocaleDateString('en-US', {
+    month: 'short',
+    day: 'numeric',
+    year: 'numeric',
+}));
+const ReceiptRow = ({ label, children }) => (_jsxs("div", { className: "d-flex align-items-baseline mb-2", children: [_jsx("span", { className: "font-weight-bold text-gray-700", children: label }), _jsx("span", { className: "flex-grow-1 mx-2 text-gray-700", style: { borderBottom: '1px dotted #B4B1A8' } }), _jsx("span", { children: children })] }));
+const normalizeDiscountCode = (value) => {
+    var _a;
+    if (!value) {
+        return null;
+    }
+    const cleaned = (_a = value.split(':')[0]) === null || _a === void 0 ? void 0 : _a.trim();
+    return cleaned || null;
+};
+const normalizeOrderDetails = (payload) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7;
+    if (!payload || typeof payload !== 'object') {
+        return null;
+    }
+    const order = (_a = payload.order) !== null && _a !== void 0 ? _a : payload;
+    if (!order || typeof order !== 'object') {
+        return null;
+    }
+    const totals = (_b = order.totals) !== null && _b !== void 0 ? _b : {
+        amount: (_c = order.amount) !== null && _c !== void 0 ? _c : 0,
+        currency: (_d = order.currency) !== null && _d !== void 0 ? _d : 'USD',
+    };
+    const currency = String((_h = (_g = (_f = (_e = order.pricing) === null || _e === void 0 ? void 0 : _e.total) === null || _f === void 0 ? void 0 : _f.currency) !== null && _g !== void 0 ? _g : totals.currency) !== null && _h !== void 0 ? _h : 'USD');
+    const money = (amount) => ({
+        amount: Number.isFinite(Number(amount)) ? Number(amount) : 0,
+        currency,
+    });
+    const discounts = Array.isArray((_j = order.pricing) === null || _j === void 0 ? void 0 : _j.discounts) ? order.pricing.discounts : null;
+    const discountTotal = discounts
+        ? discounts.reduce((sum, item) => { var _a; return sum + Number((_a = item === null || item === void 0 ? void 0 : item.amount) !== null && _a !== void 0 ? _a : 0); }, 0)
+        : Number((_m = (_l = (_k = order.totals) === null || _k === void 0 ? void 0 : _k.discount) !== null && _l !== void 0 ? _l : order.discount) !== null && _m !== void 0 ? _m : 0);
+    const firstDiscount = discounts === null || discounts === void 0 ? void 0 : discounts[0];
+    const discountCode = normalizeDiscountCode((_q = (_p = (_o = firstDiscount === null || firstDiscount === void 0 ? void 0 : firstDiscount.code) !== null && _o !== void 0 ? _o : firstDiscount === null || firstDiscount === void 0 ? void 0 : firstDiscount.offerId) !== null && _p !== void 0 ? _p : order.discountCode) !== null && _q !== void 0 ? _q : null);
+    const firstItem = Array.isArray(order.items) ? order.items[0] : null;
+    const item = firstItem !== null && firstItem !== void 0 ? firstItem : (Array.isArray(order.lines) ? order.lines[0] : null);
+    const itemName = String((_u = (_t = (_s = (_r = item === null || item === void 0 ? void 0 : item.name) !== null && _r !== void 0 ? _r : item === null || item === void 0 ? void 0 : item.productName) !== null && _s !== void 0 ? _s : item === null || item === void 0 ? void 0 : item.title) !== null && _t !== void 0 ? _t : order.name) !== null && _u !== void 0 ? _u : 'Order');
+    const base = {
+        orderId: String((_v = order.orderId) !== null && _v !== void 0 ? _v : ''),
+        orderNumber: String((_w = order.orderNumber) !== null && _w !== void 0 ? _w : ''),
+        purchasedAt: String((_z = (_y = (_x = order.purchasedAt) !== null && _x !== void 0 ? _x : order.placedAt) !== null && _y !== void 0 ? _y : order.createdAt) !== null && _z !== void 0 ? _z : new Date().toISOString()),
+        paymentIntentId: String((_0 = order.paymentIntentId) !== null && _0 !== void 0 ? _0 : ''),
+        subtotalAmount: money((_2 = (_1 = order.pricing) === null || _1 === void 0 ? void 0 : _1.subtotal) === null || _2 === void 0 ? void 0 : _2.amount),
+        itemPriceAmount: money((_3 = item === null || item === void 0 ? void 0 : item.price) === null || _3 === void 0 ? void 0 : _3.amount),
+        discountCode,
+        total: money((_6 = (_5 = (_4 = order.pricing) === null || _4 === void 0 ? void 0 : _4.total) === null || _5 === void 0 ? void 0 : _5.amount) !== null && _6 !== void 0 ? _6 : totals.paid),
+        discountAmount: money(discountTotal),
+    };
+    if ((firstItem === null || firstItem === void 0 ? void 0 : firstItem.kind) === 'program') {
+        const programCourses = Array.isArray(firstItem.courses) ? firstItem.courses : [];
+        return Object.assign(Object.assign({}, base), { name: String((_7 = firstItem.name) !== null && _7 !== void 0 ? _7 : itemName), itemType: 'program', items: programCourses.map((entry) => {
+                var _a, _b, _c, _d;
+                return ({
+                    productId: entry.productId,
+                    courseRunKey: entry.courseRunKey,
+                    name: (_a = entry.name) !== null && _a !== void 0 ? _a : itemName,
+                    price: (_b = entry.price) !== null && _b !== void 0 ? _b : money(entry.amount),
+                    discount: (_c = entry.discount) !== null && _c !== void 0 ? _c : money(0),
+                    total: (_d = entry.total) !== null && _d !== void 0 ? _d : money(entry.amount),
+                });
+            }) });
+    }
+    return Object.assign(Object.assign({}, base), { name: itemName, itemType: 'course' });
+};
+const OrderReceipt = ({ order }) => {
+    var _a, _b, _c, _d, _e;
+    const { formatMessage } = useIntl();
+    const orderDate = formatDate(order.purchasedAt);
+    const subtotal = getFormattedCurrency((_a = order.subtotalAmount) !== null && _a !== void 0 ? _a : order.total);
+    const itemPrice = getFormattedCurrency((_b = order.itemPriceAmount) !== null && _b !== void 0 ? _b : order.total);
+    const total = getFormattedCurrency(order.total);
+    const discountValue = (_c = order.discountAmount) !== null && _c !== void 0 ? _c : { amount: 0, currency: order.total.currency };
+    const discountAmount = getFormattedCurrency({
+        amount: -Math.abs(discountValue.amount) || 0,
+        currency: discountValue.currency,
+    });
+    const orderSummaryRows = getOrderSummaryRows(order, orderDate, subtotal, total, discountAmount, (_d = order.discountCode) !== null && _d !== void 0 ? _d : '');
+    const orderItemRows = getOrderItemRows(order, itemPrice, total, discountAmount);
+    const renderRows = (rows) => rows.map(({ label, value }) => (_jsx(ReceiptRow, { label: formatMessage(label), children: value }, label.id)));
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "my-2", children: _jsx(Breadcrumb, { ariaLabel: "breadcrumb", links: [{ label: formatMessage(messages.orderHistoryTitle), href: `${ORDER_HISTORY_PATH}?tab=payment-history` }], activeLabel: `${formatMessage(messages.orderDateTitle)}: ${orderDate}` }) }), _jsxs("h1", { className: "h1 mb-4 mt-4 text-primary-500 orderHistoryTitle", children: [formatMessage(messages.orderDateTitle), ": ", orderDate] }), _jsx("h3", { className: "h3 font-weight-bold mb-3 text-primary-500", children: formatMessage(messages.orderSummaryTitle) }), renderRows(orderSummaryRows), _jsx("hr", { className: "my-4 divider" }), _jsx("h3", { className: "font-weight-bold mb-3 text-primary-500", children: formatMessage(messages.orderItemsTitle) }), order.itemType === 'program' ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "mb-2 text-gray-700 mb-1", children: [_jsx("span", { className: "font-weight-bold", children: formatMessage(messages.receiptNameLabel) }), ' ', _jsx("span", { children: order.name })] }), _jsx(ProgramItemsTable, { items: (_e = order.items) !== null && _e !== void 0 ? _e : [], currency: order.total.currency })] })) : renderRows(orderItemRows), _jsx("hr", { className: "my-4 divider" }), _jsx("h3", { className: "font-weight-bold mb-3 text-primary-500", children: formatMessage(messages.paymentTitle) }), _jsx(ReceiptRow, { label: formatMessage(messages.receiptAmountLabel), children: total })] }));
+};
+const OrderHistoryDetails = () => {
+    const { formatMessage } = useIntl();
+    const { orderNumber } = useParams();
+    const client = useViaxClient();
+    const { sessionReady } = useViaxSession(client);
+    const orderDetailsQuery = useOrderDetailsQuery(client, orderNumber !== null && orderNumber !== void 0 ? orderNumber : null, sessionReady);
+    const order = useMemo(() => normalizeOrderDetails(orderDetailsQuery.data), [orderDetailsQuery.data]);
+    let content;
+    if (orderDetailsQuery.isError) {
+        content = _jsx(Alert, { variant: "danger", children: formatMessage(messages.purchaseHistoryError) });
+    }
+    else if (!orderDetailsQuery.isSuccess) {
+        content = (_jsx("div", { className: "d-flex justify-content-center py-4", children: _jsx(Spinner, { animation: "border", screenReaderText: formatMessage(messages.loadingOrders) }) }));
+    }
+    else {
+        content = order
+            ? _jsx(OrderReceipt, { order: order })
+            : _jsx(Alert, { variant: "warning", children: formatMessage(messages.orderNotFound) });
+    }
+    return (_jsx(Container, { fluid: true, size: "xl", className: "py-4 orderHistory", children: content }));
+};
+export default OrderHistoryDetails;
+//# sourceMappingURL=OrderHistoryDetails.js.map