@edx/frontend-app-subscription-learner-dashboard 1.17.0 → 1.19.0

package/dist/containers/SubscriptionBanner/messages.js.map

@@ -1 +1 @@
-{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../src/containers/SubscriptionBanner/messages.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,yHAAyH;AACzH,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,uBAAuB,EAAE;QACvB,EAAE,EAAE,iEAAiE;QACrE,WAAW,EAAE,iDAAiD;QAC9D,cAAc,EAAE,iCAAiC;KAClD;IACD,sBAAsB,EAAE;QACtB,EAAE,EAAE,gEAAgE;QACpE,WAAW,EAAE,iDAAiD;QAC9D,cAAc,EAAE,mIAAmI;KACpJ;IACD,4BAA4B,EAAE;QAC5B,EAAE,EAAE,sEAAsE;QAC1E,WAAW,EAAE,uDAAuD;QACpE,cAAc,EAAE,yDAAyD;KAC1E;IACD,iCAAiC,EAAE;QACjC,EAAE,EAAE,2EAA2E;QAC/E,WAAW,EAAE,8DAA8D;QAC3E,cAAc,EAAE,4CAA4C;KAC7D;IACD,oCAAoC,EAAE;QACpC,EAAE,EAAE,8EAA8E;QAClF,WAAW,EAAE,iEAAiE;QAC9E,cAAc,EAAE,+CAA+C;KAChE;IACD,2BAA2B,EAAE;QAC3B,EAAE,EAAE,qEAAqE;QACzE,WAAW,EAAE,uDAAuD;QACpE,cAAc,EAAE,wDAAwD;KACzE;IACD,0BAA0B,EAAE;QAC1B,EAAE,EAAE,oEAAoE;QACxE,WAAW,EAAE,mDAAmD;QAChE,cAAc,EAAE,gCAAgC;KACjD;IACD,yBAAyB,EAAE;QACzB,EAAE,EAAE,mEAAmE;QACvE,WAAW,EAAE,mDAAmD;QAChE,cAAc,EAAE,uHAAuH;KACxI;IACD,uBAAuB,EAAE;QACvB,EAAE,EAAE,iEAAiE;QACrE,WAAW,EAAE,oBAAoB;QACjC,cAAc,EAAE,oBAAoB;KACrC;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\n// TODO: Update the messages as per new designs once we have the designs ready for subscription types other than 'trial'.\nconst messages = defineMessages({\n  activeSubscriptionTitle: {\n    id: 'learner-dash.subscriptionBanner.banners.activeSubscriptionTitle',\n    description: 'Message to learners with an active subscription',\n    defaultMessage: 'Your subscription is now active',\n  },\n  activeSubscriptionBody: {\n    id: 'learner-dash.subscriptionBanner.banners.activeSubscriptionBody',\n    description: 'Message to learners with an active subscription',\n    defaultMessage: 'On {subscriptionStartDate} you subscribed to edX subscription product. Your subscription will renew on {subscriptionRenewalDate}.',\n  },\n  activeTrialSubscriptionTitle: {\n    id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionTitle',\n    description: 'Message to learners with an active trial subscription',\n    defaultMessage: 'Your edX subscription trial expires in {daysLeft} days.',\n  },\n  activeTrialSubscriptionTitleToday: {\n    id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionTitleToday',\n    description: 'Message to learners with a trial subscription expiring today',\n    defaultMessage: 'Your edX subscription trial expires today.',\n  },\n  activeTrialSubscriptionTitleTomorrow: {\n    id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionTitleTomorrow',\n    description: 'Message to learners with a trial subscription expiring tomorrow',\n    defaultMessage: 'Your edX subscription trial expires tomorrow.',\n  },\n  activeTrialSubscriptionBody: {\n    id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionBody',\n    description: 'Message to learners with an active trial subscription',\n    defaultMessage: 'Your subscription will renew on {subscriptionEndDate}.',\n  },\n  cancelledSubscriptionTitle: {\n    id: 'learner-dash.subscriptionBanner.banners.cancelledSubscriptionTitle',\n    description: 'Message to learners with a cancelled subscription',\n    defaultMessage: 'Your subscription is cancelled',\n  },\n  cancelledSubscriptionBody: {\n    id: 'learner-dash.subscriptionBanner.banners.cancelledSubscriptionBody',\n    description: 'Message to learners with a cancelled subscription',\n    defaultMessage: 'Your subscription expired on {subscriptionEndDate}. Renew now to continue enjoying your courses without interruption.',\n  },\n  renewSubscriptionButton: {\n    id: 'learner-dash.subscriptionBanner.banners.renewSubscriptionButton',\n    description: 'Renew Subscription',\n    defaultMessage: 'Renew Subscription',\n  },\n});\n\nexport default messages;\n"]}
+{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../src/containers/SubscriptionBanner/messages.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,yHAAyH;AACzH,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,uBAAuB,EAAE;QACvB,EAAE,EAAE,iEAAiE;QACrE,WAAW,EAAE,iDAAiD;QAC9D,cAAc,EAAE,kDAAkD;KACnE;IACD,sBAAsB,EAAE;QACtB,EAAE,EAAE,gEAAgE;QACpE,WAAW,EAAE,iDAAiD;QAC9D,cAAc,EAAE,4DAA4D;KAC7E;IACD,4BAA4B,EAAE;QAC5B,EAAE,EAAE,sEAAsE;QAC1E,WAAW,EAAE,uDAAuD;QACpE,cAAc,EAAE,yDAAyD;KAC1E;IACD,iCAAiC,EAAE;QACjC,EAAE,EAAE,2EAA2E;QAC/E,WAAW,EAAE,8DAA8D;QAC3E,cAAc,EAAE,4CAA4C;KAC7D;IACD,oCAAoC,EAAE;QACpC,EAAE,EAAE,8EAA8E;QAClF,WAAW,EAAE,iEAAiE;QAC9E,cAAc,EAAE,+CAA+C;KAChE;IACD,2BAA2B,EAAE;QAC3B,EAAE,EAAE,qEAAqE;QACzE,WAAW,EAAE,uDAAuD;QACpE,cAAc,EAAE,wDAAwD;KACzE;IACD,0BAA0B,EAAE;QAC1B,EAAE,EAAE,oEAAoE;QACxE,WAAW,EAAE,mDAAmD;QAChE,cAAc,EAAE,sCAAsC;KACvD;IACD,yBAAyB,EAAE;QACzB,EAAE,EAAE,mEAAmE;QACvE,WAAW,EAAE,mDAAmD;QAChE,cAAc,EAAE,6GAA6G;KAC9H;IACD,uBAAuB,EAAE;QACvB,EAAE,EAAE,iEAAiE;QACrE,WAAW,EAAE,oBAAoB;QACjC,cAAc,EAAE,oBAAoB;KACrC;IACD,kBAAkB,EAAE;QAClB,EAAE,EAAE,4DAA4D;QAChE,WAAW,EAAE,wDAAwD;QACrE,cAAc,EAAE,4DAA4D;KAC7E;IACD,iBAAiB,EAAE;QACjB,EAAE,EAAE,2DAA2D;QAC/D,WAAW,EAAE,wDAAwD;QACrE,cAAc,EAAE,qJAAqJ;KACtK;IACD,mBAAmB,EAAE;QACnB,EAAE,EAAE,6DAA6D;QACjE,WAAW,EAAE,uBAAuB;QACpC,cAAc,EAAE,uBAAuB;KACxC;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\n// TODO: Update the messages as per new designs once we have the designs ready for subscription types other than 'trial'.\nconst messages = defineMessages({\n  activeSubscriptionTitle: {\n    id: 'learner-dash.subscriptionBanner.banners.activeSubscriptionTitle',\n    description: 'Message to learners with an active subscription',\n    defaultMessage: 'Congrats! Your edX subscription trial is active.',\n  },\n  activeSubscriptionBody: {\n    id: 'learner-dash.subscriptionBanner.banners.activeSubscriptionBody',\n    description: 'Message to learners with an active subscription',\n    defaultMessage: 'Your subscription will renew on {subscriptionRenewalDate}.',\n  },\n  activeTrialSubscriptionTitle: {\n    id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionTitle',\n    description: 'Message to learners with an active trial subscription',\n    defaultMessage: 'Your edX subscription trial expires in {daysLeft} days.',\n  },\n  activeTrialSubscriptionTitleToday: {\n    id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionTitleToday',\n    description: 'Message to learners with a trial subscription expiring today',\n    defaultMessage: 'Your edX subscription trial expires today.',\n  },\n  activeTrialSubscriptionTitleTomorrow: {\n    id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionTitleTomorrow',\n    description: 'Message to learners with a trial subscription expiring tomorrow',\n    defaultMessage: 'Your edX subscription trial expires tomorrow.',\n  },\n  activeTrialSubscriptionBody: {\n    id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionBody',\n    description: 'Message to learners with an active trial subscription',\n    defaultMessage: 'Your subscription will renew on {subscriptionEndDate}.',\n  },\n  cancelledSubscriptionTitle: {\n    id: 'learner-dash.subscriptionBanner.banners.cancelledSubscriptionTitle',\n    description: 'Message to learners with a cancelled subscription',\n    defaultMessage: 'Your subscription expires in # days.',\n  },\n  cancelledSubscriptionBody: {\n    id: 'learner-dash.subscriptionBanner.banners.cancelledSubscriptionBody',\n    description: 'Message to learners with a cancelled subscription',\n    defaultMessage: 'You canceled your subscription on {subscriptionEndDate}. Renew your subscription to maintain course access.',\n  },\n  renewSubscriptionButton: {\n    id: 'learner-dash.subscriptionBanner.banners.renewSubscriptionButton',\n    description: 'Renew Subscription',\n    defaultMessage: 'Renew Subscription',\n  },\n  renewalFailedTitle: {\n    id: 'learner-dash.subscriptionBanner.banners.renewalFailedTitle',\n    description: 'Message to learners with a failed renewal subscription',\n    defaultMessage: 'Update your payment card to keep your subscription active.',\n  },\n  renewalFailedBody: {\n    id: 'learner-dash.subscriptionBanner.banners.renewalFailedBody',\n    description: 'Message to learners with a failed renewal subscription',\n    defaultMessage: 'We were unable to process your subscription payment. Update your card on file by {subscriptionRenewalDate} or your subscription access will expire.',\n  },\n  renewalFailedButton: {\n    id: 'learner-dash.subscriptionBanner.banners.renewalFailedButton',\n    description: 'Update payment method',\n    defaultMessage: 'Update payment method',\n  },\n});\n\nexport default messages;\n"]}

package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.d.ts

@@ -1,2 +1,3 @@
 import { FC } from 'react';
+import '../index.scss';
 export declare const SubscriptionInformation: FC;

package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.js

@@ -1,31 +1,31 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Alert, Button, Image } from '@openedx/paragon';
+import { Alert, Button, Icon } from '@openedx/paragon';
 import { useIntl } from '@openedx/frontend-base';
 import { utilHooks } from '../../../hooks';
 import messages from '../messages';
 import { manageSubscriptionURL } from '../../../data/constants/app';
+import '../index.scss';
+import { Cached } from '@openedx/paragon/icons';
 // TODO: We can replace the below hardcoded subscriptionInformationData with the actual data from the API once we have the API ready.
 // For now, we can use this hardcoded data to test the SubscriptionInformation component.
 const subscriptionInformationData = {
     isSubscribed: true,
-    subscriptionStatus: 'cancelled', // can be 'active', 'cancelled', 'expired'
+    subscriptionStatus: 'Active', // can be 'Active', 'Cancelled', 'Expired'
     subscriptionStartDate: '05/22/25',
     subscriptionEndDate: '05/22/26',
     subscriptionRenewalDate: '05/22/26',
     subscriptionRenewalPrice: '$36',
     numberOfCoursesEnrolled: 5,
     totalSavings: '$120',
+    planName: 'Monthly Plan',
 };
 export const SubscriptionInformation = () => {
     const { formatMessage } = useIntl();
     const formatDate = utilHooks.useFormatDate();
     const subscriptionActions = [
-        _jsx(Button, { variant: "outline-brand", "data-testid": "manage-button", href: manageSubscriptionURL, target: "_blank", rel: "noopener noreferrer", role: "link", children: formatMessage(messages.manageSubscriptionMessage) }, "manage-subscription"),
+        _jsx(Button, { variant: "tertiary", "data-testid": "manage-button", href: manageSubscriptionURL, target: "_blank", rel: "noopener noreferrer", role: "link", children: formatMessage(messages.manageSubscriptionMessage) }, "manage-subscription"),
     ];
-    return (_jsxs("div", { className: "container subscription-information p-3\\.5", children: [_jsx(Image, { className: "mr-2", src: "https://www.edx.org/trademark-logos/edx-logo-elm.svg", rounded: true, alt: "edX Logo", width: 40, height: 60 }), subscriptionInformationData.subscriptionStatus === 'cancelled' && (_jsx("h3", { children: formatMessage(messages.cancelledMessage, { totalSavings: subscriptionInformationData.totalSavings }) })), _jsx("p", { children: formatMessage(messages.coursesEnrollmentMessage, {
-                    numberOfCoursesEnrolled: subscriptionInformationData.numberOfCoursesEnrolled,
-                    totalSavings: subscriptionInformationData.totalSavings,
-                }) }), _jsxs(Alert, { dismissible: false, show: true, actions: subscriptionActions, className: "subscription-status-alert bg-light-200", children: [_jsx(Alert.Heading, { children: formatMessage(messages.statusMessage) }), _jsx("p", { children: formatMessage(messages.renewalMessage, {
+    return (_jsxs("div", { className: "container subscription-information py-5 px-4", children: [_jsx("h2", { className: "mb-4 my-subscription-heading", children: formatMessage(messages.mySubscriptionHeading) }), _jsxs(Alert, { dismissible: false, show: true, actions: subscriptionActions, className: "subscription-status-alert bg-white", children: [_jsxs(Alert.Heading, { as: "h6", children: [_jsx(Icon, { src: Cached, className: "icon mr-1", "data-testid": "subscription-status-icon" }), subscriptionInformationData.subscriptionStatus, ", ", subscriptionInformationData.planName] }), _jsx("p", { children: formatMessage(messages.renewalMessage, {
                             subscriptionRenewalDate: formatDate(subscriptionInformationData.subscriptionRenewalDate),
                         }) })] })] }));
 };

package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubscriptionInformation.js","sourceRoot":"","sources":["../../../../src/containers/SubscriptionInformation/components/SubscriptionInformation.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AACvC,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,qIAAqI;AACrI,yFAAyF;AACzF,MAAM,2BAA2B,GAAG;IAClC,YAAY,EAAE,IAAI;IAClB,kBAAkB,EAAE,WAAW,EAAE,0CAA0C;IAC3E,qBAAqB,EAAE,UAAU;IACjC,mBAAmB,EAAE,UAAU;IAC/B,uBAAuB,EAAE,UAAU;IACnC,wBAAwB,EAAE,KAAK;IAC/B,uBAAuB,EAAE,CAAC;IAC1B,YAAY,EAAE,MAAM;CACrB,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAO,GAAG,EAAE;IAC9C,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,UAAU,GAAG,SAAS,CAAC,aAAa,EAAE,CAAC;IAE7C,MAAM,mBAAmB,GAAG;QAC1B,KAAC,MAAM,IAEL,OAAO,EAAC,eAAe,iBACX,eAAe,EAC3B,IAAI,EAAE,qBAAqB,EAC3B,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,IAAI,EAAC,MAAM,YAEV,aAAa,CAAC,QAAQ,CAAC,yBAAyB,CAAC,IAR9C,qBAAqB,CASlB;KACV,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,4CAA2C,aACxD,KAAC,KAAK,IACJ,SAAS,EAAC,MAAM,EAChB,GAAG,EAAC,sDAAsD,EAC1D,OAAO,QACP,GAAG,EAAC,UAAU,EACd,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACV,EACD,2BAA2B,CAAC,kBAAkB,KAAK,WAAW,IAAI,CACjE,uBAAK,aAAa,CAAC,QAAQ,CAAC,gBAAgB,EAAE,EAAE,YAAY,EAAE,2BAA2B,CAAC,YAAY,EAAE,CAAC,GAAM,CAChH,EACD,sBACG,aAAa,CAAC,QAAQ,CAAC,wBAAwB,EAAE;oBAChD,uBAAuB,EAAE,2BAA2B,CAAC,uBAAuB;oBAC5E,YAAY,EAAE,2BAA2B,CAAC,YAAY;iBACvD,CAAC,GACA,EACJ,MAAC,KAAK,IACJ,WAAW,EAAE,KAAK,EAClB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,mBAAmB,EAC5B,SAAS,EAAC,wCAAwC,aAElD,KAAC,KAAK,CAAC,OAAO,cAAE,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAiB,EACtE,sBACG,aAAa,CAAC,QAAQ,CAAC,cAAc,EAAE;4BACtC,uBAAuB,EAAE,UAAU,CAAC,2BAA2B,CAAC,uBAAuB,CAAC;yBACzF,CAAC,GACA,IACE,IACJ,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { Alert, Button, Image } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport { utilHooks } from '@src/hooks';\nimport messages from '../messages';\nimport { manageSubscriptionURL } from '@src/data/constants/app';\n\n// TODO: We can replace the below hardcoded subscriptionInformationData with the actual data from the API once we have the API ready.\n// For now, we can use this hardcoded data to test the SubscriptionInformation component.\nconst subscriptionInformationData = {\n  isSubscribed: true,\n  subscriptionStatus: 'cancelled', // can be 'active', 'cancelled', 'expired'\n  subscriptionStartDate: '05/22/25',\n  subscriptionEndDate: '05/22/26',\n  subscriptionRenewalDate: '05/22/26',\n  subscriptionRenewalPrice: '$36',\n  numberOfCoursesEnrolled: 5,\n  totalSavings: '$120',\n};\n\nexport const SubscriptionInformation: FC = () => {\n  const { formatMessage } = useIntl();\n  const formatDate = utilHooks.useFormatDate();\n\n  const subscriptionActions = [\n    <Button\n      key=\"manage-subscription\"\n      variant=\"outline-brand\"\n      data-testid=\"manage-button\"\n      href={manageSubscriptionURL}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      role=\"link\"\n    >\n      {formatMessage(messages.manageSubscriptionMessage)}\n    </Button>,\n  ];\n\n  return (\n    <div className=\"container subscription-information p-3\\.5\">\n      <Image\n        className=\"mr-2\"\n        src=\"https://www.edx.org/trademark-logos/edx-logo-elm.svg\"\n        rounded\n        alt=\"edX Logo\"\n        width={40}\n        height={60}\n      />\n      {subscriptionInformationData.subscriptionStatus === 'cancelled' && (\n        <h3>{formatMessage(messages.cancelledMessage, { totalSavings: subscriptionInformationData.totalSavings })}</h3>\n      )}\n      <p>\n        {formatMessage(messages.coursesEnrollmentMessage, {\n          numberOfCoursesEnrolled: subscriptionInformationData.numberOfCoursesEnrolled,\n          totalSavings: subscriptionInformationData.totalSavings,\n        })}\n      </p>\n      <Alert\n        dismissible={false}\n        show={true}\n        actions={subscriptionActions}\n        className=\"subscription-status-alert bg-light-200\"\n      >\n        <Alert.Heading>{formatMessage(messages.statusMessage)}</Alert.Heading>\n        <p>\n          {formatMessage(messages.renewalMessage, {\n            subscriptionRenewalDate: formatDate(subscriptionInformationData.subscriptionRenewalDate),\n          })}\n        </p>\n      </Alert>\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"SubscriptionInformation.js","sourceRoot":"","sources":["../../../../src/containers/SubscriptionInformation/components/SubscriptionInformation.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AACvC,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAEhD,qIAAqI;AACrI,yFAAyF;AACzF,MAAM,2BAA2B,GAAG;IAClC,YAAY,EAAE,IAAI;IAClB,kBAAkB,EAAE,QAAQ,EAAE,0CAA0C;IACxE,qBAAqB,EAAE,UAAU;IACjC,mBAAmB,EAAE,UAAU;IAC/B,uBAAuB,EAAE,UAAU;IACnC,wBAAwB,EAAE,KAAK;IAC/B,uBAAuB,EAAE,CAAC;IAC1B,YAAY,EAAE,MAAM;IACpB,QAAQ,EAAE,cAAc;CACzB,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAO,GAAG,EAAE;IAC9C,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,UAAU,GAAG,SAAS,CAAC,aAAa,EAAE,CAAC;IAE7C,MAAM,mBAAmB,GAAG;QAC1B,KAAC,MAAM,IAEL,OAAO,EAAC,UAAU,iBACN,eAAe,EAC3B,IAAI,EAAE,qBAAqB,EAC3B,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,IAAI,EAAC,MAAM,YAEV,aAAa,CAAC,QAAQ,CAAC,yBAAyB,CAAC,IAR9C,qBAAqB,CASlB;KACV,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,8CAA8C,aAC3D,aAAI,SAAS,EAAC,8BAA8B,YAAE,aAAa,CAAC,QAAQ,CAAC,qBAAqB,CAAC,GAAM,EACjG,MAAC,KAAK,IACJ,WAAW,EAAE,KAAK,EAClB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,mBAAmB,EAC5B,SAAS,EAAC,oCAAoC,aAE9C,MAAC,KAAK,CAAC,OAAO,IACZ,EAAE,EAAC,IAAI,aAEP,KAAC,IAAI,IAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAC,WAAW,iBAAa,0BAA0B,GAAG,EAEjF,2BAA2B,CAAC,kBAAkB,QAAI,2BAA2B,CAAC,QAAQ,IACzE,EAChB,sBACG,aAAa,CAAC,QAAQ,CAAC,cAAc,EAAE;4BACtC,uBAAuB,EAAE,UAAU,CAAC,2BAA2B,CAAC,uBAAuB,CAAC;yBACzF,CAAC,GACA,IACE,IACJ,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { Alert, Button, Icon } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport { utilHooks } from '@src/hooks';\nimport messages from '../messages';\nimport { manageSubscriptionURL } from '@src/data/constants/app';\nimport '../index.scss';\nimport { Cached } from '@openedx/paragon/icons';\n\n// TODO: We can replace the below hardcoded subscriptionInformationData with the actual data from the API once we have the API ready.\n// For now, we can use this hardcoded data to test the SubscriptionInformation component.\nconst subscriptionInformationData = {\n  isSubscribed: true,\n  subscriptionStatus: 'Active', // can be 'Active', 'Cancelled', 'Expired'\n  subscriptionStartDate: '05/22/25',\n  subscriptionEndDate: '05/22/26',\n  subscriptionRenewalDate: '05/22/26',\n  subscriptionRenewalPrice: '$36',\n  numberOfCoursesEnrolled: 5,\n  totalSavings: '$120',\n  planName: 'Monthly Plan',\n};\n\nexport const SubscriptionInformation: FC = () => {\n  const { formatMessage } = useIntl();\n  const formatDate = utilHooks.useFormatDate();\n\n  const subscriptionActions = [\n    <Button\n      key=\"manage-subscription\"\n      variant=\"tertiary\"\n      data-testid=\"manage-button\"\n      href={manageSubscriptionURL}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      role=\"link\"\n    >\n      {formatMessage(messages.manageSubscriptionMessage)}\n    </Button>,\n  ];\n\n  return (\n    <div className=\"container subscription-information py-5 px-4\">\n      <h2 className=\"mb-4 my-subscription-heading\">{formatMessage(messages.mySubscriptionHeading)}</h2>\n      <Alert\n        dismissible={false}\n        show={true}\n        actions={subscriptionActions}\n        className=\"subscription-status-alert bg-white\"\n      >\n        <Alert.Heading\n          as=\"h6\"\n        >\n          <Icon src={Cached} className=\"icon mr-1\" data-testid=\"subscription-status-icon\" />\n          {/* TODO : To be updated from API response once correct response is received */}\n          {subscriptionInformationData.subscriptionStatus}, {subscriptionInformationData.planName}\n        </Alert.Heading>\n        <p>\n          {formatMessage(messages.renewalMessage, {\n            subscriptionRenewalDate: formatDate(subscriptionInformationData.subscriptionRenewalDate),\n          })}\n        </p>\n      </Alert>\n    </div>\n  );\n};\n"]}

package/dist/containers/SubscriptionInformation/index.scss

@@ -0,0 +1,19 @@
+$text-color: #002B2B !default;
+
+.subscription-information {
+  background: var(--pgn-color-light-200);
+  
+  .my-subscription-heading {
+    color: $text-color;
+  }
+
+  .subscription-status-alert {
+    h6 {
+      margin-bottom: 0;
+    }
+
+    p {
+      color: var(--pgn-color-black);
+    }
+  }
+}

package/dist/containers/SubscriptionInformation/messages.d.ts

@@ -24,5 +24,10 @@ declare const messages: {
         description: string;
         defaultMessage: string;
     };
+    mySubscriptionHeading: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
 };
 export default messages;

package/dist/containers/SubscriptionInformation/messages.js

@@ -18,13 +18,18 @@ const messages = defineMessages({
     renewalMessage: {
         id: 'learner-dash.subscriptionInformation.information.subscriptionSchedule',
         description: 'Subscription Schedule',
-        defaultMessage: 'Subscription payment scheduled for {subscriptionRenewalDate}.',
+        defaultMessage: 'Your next payment is {subscriptionRenewalDate}.',
     },
     manageSubscriptionMessage: {
         id: 'learner-dash.subscriptionInformation.information.manageSubscription',
         description: 'Manage Subscription',
         defaultMessage: 'Manage my subscription',
     },
+    mySubscriptionHeading: {
+        id: 'learner-dash.subscriptionInformation.information.mySubscriptionHeading',
+        description: 'My Subscription Heading',
+        defaultMessage: 'My subscription',
+    },
 });
 export default messages;
 //# sourceMappingURL=messages.js.map

package/dist/containers/SubscriptionInformation/messages.js.map

@@ -1 +1 @@
-{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../src/containers/SubscriptionInformation/messages.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,aAAa,EAAE;QACb,EAAE,EAAE,qEAAqE;QACzE,WAAW,EAAE,gBAAgB;QAC7B,cAAc,EAAE,qBAAqB;KACtC;IACD,gBAAgB,EAAE;QAChB,EAAE,EAAE,oEAAoE;QACxE,WAAW,EAAE,6CAA6C;QAC1D,cAAc,EAAE,8DAA8D;KAC/E;IACD,wBAAwB,EAAE;QACxB,EAAE,EAAE,wEAAwE;QAC5E,WAAW,EAAE,6CAA6C;QAC1D,cAAc,EAAE,iGAAiG;KAClH;IACD,cAAc,EAAE;QACd,EAAE,EAAE,uEAAuE;QAC3E,WAAW,EAAE,uBAAuB;QACpC,cAAc,EAAE,+DAA+D;KAChF;IACD,yBAAyB,EAAE;QACzB,EAAE,EAAE,qEAAqE;QACzE,WAAW,EAAE,qBAAqB;QAClC,cAAc,EAAE,wBAAwB;KACzC;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  statusMessage: {\n    id: 'learner-dash.subscriptionInformation.information.subscriptionStatus',\n    description: 'Status Message',\n    defaultMessage: 'Subscription Status',\n  },\n  cancelledMessage: {\n    id: 'learner-dash.subscriptionInformation.information.courseInformation',\n    description: 'Information of courses enrolled and savings',\n    defaultMessage: `You have saved {totalSavings} with your subscription so far!`,\n  },\n  coursesEnrollmentMessage: {\n    id: 'learner-dash.subscriptionInformation.information.enrollmentInformation',\n    description: 'Information of courses enrolled and savings',\n    defaultMessage: `As a subscriber, you've enrolled in {numberOfCoursesEnrolled} courses and saved {totalSavings}.`,\n  },\n  renewalMessage: {\n    id: 'learner-dash.subscriptionInformation.information.subscriptionSchedule',\n    description: 'Subscription Schedule',\n    defaultMessage: 'Subscription payment scheduled for {subscriptionRenewalDate}.',\n  },\n  manageSubscriptionMessage: {\n    id: 'learner-dash.subscriptionInformation.information.manageSubscription',\n    description: 'Manage Subscription',\n    defaultMessage: 'Manage my subscription',\n  },\n});\n\nexport default messages;\n"]}
+{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../src/containers/SubscriptionInformation/messages.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,aAAa,EAAE;QACb,EAAE,EAAE,qEAAqE;QACzE,WAAW,EAAE,gBAAgB;QAC7B,cAAc,EAAE,qBAAqB;KACtC;IACD,gBAAgB,EAAE;QAChB,EAAE,EAAE,oEAAoE;QACxE,WAAW,EAAE,6CAA6C;QAC1D,cAAc,EAAE,8DAA8D;KAC/E;IACD,wBAAwB,EAAE;QACxB,EAAE,EAAE,wEAAwE;QAC5E,WAAW,EAAE,6CAA6C;QAC1D,cAAc,EAAE,iGAAiG;KAClH;IACD,cAAc,EAAE;QACd,EAAE,EAAE,uEAAuE;QAC3E,WAAW,EAAE,uBAAuB;QACpC,cAAc,EAAE,iDAAiD;KAClE;IACD,yBAAyB,EAAE;QACzB,EAAE,EAAE,qEAAqE;QACzE,WAAW,EAAE,qBAAqB;QAClC,cAAc,EAAE,wBAAwB;KACzC;IACD,qBAAqB,EAAE;QACrB,EAAE,EAAE,wEAAwE;QAC5E,WAAW,EAAE,yBAAyB;QACtC,cAAc,EAAE,iBAAiB;KAClC;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  statusMessage: {\n    id: 'learner-dash.subscriptionInformation.information.subscriptionStatus',\n    description: 'Status Message',\n    defaultMessage: 'Subscription Status',\n  },\n  cancelledMessage: {\n    id: 'learner-dash.subscriptionInformation.information.courseInformation',\n    description: 'Information of courses enrolled and savings',\n    defaultMessage: `You have saved {totalSavings} with your subscription so far!`,\n  },\n  coursesEnrollmentMessage: {\n    id: 'learner-dash.subscriptionInformation.information.enrollmentInformation',\n    description: 'Information of courses enrolled and savings',\n    defaultMessage: `As a subscriber, you've enrolled in {numberOfCoursesEnrolled} courses and saved {totalSavings}.`,\n  },\n  renewalMessage: {\n    id: 'learner-dash.subscriptionInformation.information.subscriptionSchedule',\n    description: 'Subscription Schedule',\n    defaultMessage: 'Your next payment is {subscriptionRenewalDate}.',\n  },\n  manageSubscriptionMessage: {\n    id: 'learner-dash.subscriptionInformation.information.manageSubscription',\n    description: 'Manage Subscription',\n    defaultMessage: 'Manage my subscription',\n  },\n  mySubscriptionHeading: {\n    id: 'learner-dash.subscriptionInformation.information.mySubscriptionHeading',\n    description: 'My Subscription Heading',\n    defaultMessage: 'My subscription',\n  },\n});\n\nexport default messages;\n"]}

package/dist/data/constants/app.d.ts

@@ -5,3 +5,4 @@ export const ListPageSize: 25;
 export const subscriptionRenewalURL: "https://courses.edx.org/manage-subscription";
 export const exploreProgramsUrl: "/explore-programs";
 export const manageSubscriptionURL: "/manage-subscription";
+export const checkoutPageURL: "/checkout-page";

package/dist/data/constants/app.js

@@ -16,4 +16,5 @@ export const ListPageSize = 25;
 export const subscriptionRenewalURL = 'https://courses.edx.org/manage-subscription';
 export const exploreProgramsUrl = '/explore-programs';
 export const manageSubscriptionURL = '/manage-subscription';
+export const checkoutPageURL = '/checkout-page';
 //# sourceMappingURL=app.js.map

package/dist/data/constants/app.js.map

@@ -1 +1 @@
-{"version":3,"file":"app.js","sourceRoot":"","sources":["../../../src/data/constants/app.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AAE5D,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAC;IACjC,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,OAAO;CACf,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAAC;IACnC,UAAU,EAAE,YAAY;IACxB,UAAU,EAAE,YAAY;IACxB,IAAI,EAAE,MAAM;IACZ,WAAW,EAAE,aAAa;IAC1B,QAAQ,EAAE,UAAU;CACrB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,EAAE,CAAC;AAC/B,kHAAkH;AAClH,MAAM,CAAC,MAAM,sBAAsB,GAAG,6CAA6C,CAAC;AACpF,MAAM,CAAC,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AACtD,MAAM,CAAC,MAAM,qBAAqB,GAAG,sBAAsB,CAAC","sourcesContent":["import { StrictDict } from '../../utils';\nexport const locationId = window.location.pathname.slice(1);\n\nexport const SortKeys = StrictDict({\n  enrolled: 'enrolled',\n  title: 'title',\n});\n\nexport const FilterKeys = StrictDict({\n  inProgress: 'inProgress',\n  notStarted: 'notStarted',\n  done: 'done',\n  notEnrolled: 'notEnrolled',\n  upgraded: 'upgraded',\n});\n\nexport const ListPageSize = 25;\n// TODO : Below URL is temporary and will be removed once the subscription renewal flow is implemented in the app.\nexport const subscriptionRenewalURL = 'https://courses.edx.org/manage-subscription';\nexport const exploreProgramsUrl = '/explore-programs';\nexport const manageSubscriptionURL = '/manage-subscription';\n"]}
+{"version":3,"file":"app.js","sourceRoot":"","sources":["../../../src/data/constants/app.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AAE5D,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAC;IACjC,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,OAAO;CACf,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAAC;IACnC,UAAU,EAAE,YAAY;IACxB,UAAU,EAAE,YAAY;IACxB,IAAI,EAAE,MAAM;IACZ,WAAW,EAAE,aAAa;IAC1B,QAAQ,EAAE,UAAU;CACrB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,EAAE,CAAC;AAC/B,kHAAkH;AAClH,MAAM,CAAC,MAAM,sBAAsB,GAAG,6CAA6C,CAAC;AACpF,MAAM,CAAC,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AACtD,MAAM,CAAC,MAAM,qBAAqB,GAAG,sBAAsB,CAAC;AAC5D,MAAM,CAAC,MAAM,eAAe,GAAG,gBAAgB,CAAC","sourcesContent":["import { StrictDict } from '../../utils';\nexport const locationId = window.location.pathname.slice(1);\n\nexport const SortKeys = StrictDict({\n  enrolled: 'enrolled',\n  title: 'title',\n});\n\nexport const FilterKeys = StrictDict({\n  inProgress: 'inProgress',\n  notStarted: 'notStarted',\n  done: 'done',\n  notEnrolled: 'notEnrolled',\n  upgraded: 'upgraded',\n});\n\nexport const ListPageSize = 25;\n// TODO : Below URL is temporary and will be removed once the subscription renewal flow is implemented in the app.\nexport const subscriptionRenewalURL = 'https://courses.edx.org/manage-subscription';\nexport const exploreProgramsUrl = '/explore-programs';\nexport const manageSubscriptionURL = '/manage-subscription';\nexport const checkoutPageURL = '/checkout-page';\n"]}

package/dist/hooks/{useRecentlyViewedCoursesAndProgramsData.d.ts → usePopularCourses.d.ts}

@@ -8,4 +8,4 @@ export declare const searchKeys: {
     courses: (query: string, tags: string[], page: number) => readonly ["search", "courses", string, string[], number];
     popular: (productType: ProductType, limit: number) => readonly ["search", "popular", ProductType, number];
 };
-export declare const useRecentlyViewedCoursesAndProgramsData: (searchClient: SearchClient | null, enabled: boolean) => UseQueryResult<ProductCardItem[]>;
+export declare const usePopularCoursesData: (searchClient: SearchClient | null, enabled: boolean) => UseQueryResult<ProductCardItem[]>;

package/dist/hooks/{useRecentlyViewedCoursesAndProgramsData.js → usePopularCourses.js}

@@ -18,12 +18,12 @@ export const searchKeys = {
     courses: (query, tags, page) => [...searchKeys.all, 'courses', query, tags, page],
     popular: (productType, limit) => [...searchKeys.all, 'popular', productType, limit],
 };
-export const useRecentlyViewedCoursesAndProgramsData = (searchClient, enabled) => useQuery({
+export const usePopularCoursesData = (searchClient, enabled) => useQuery({
     queryKey: searchKeys.popular(PRODUCT_TYPE_COURSE, 4),
     queryFn: () => __awaiter(void 0, void 0, void 0, function* () {
         const hits = yield fetchPopularProducts(searchClient, PRODUCT_TYPE_COURSE, 4);
         return hits.map((hit) => {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
             const hitDetails = hit;
             return {
                 objectID: hit.objectID,
@@ -31,12 +31,15 @@ export const useRecentlyViewedCoursesAndProgramsData = (searchClient, enabled) =
                 primary_description: (_e = (_d = (_c = hitDetails.primary_description) !== null && _c !== void 0 ? _c : hitDetails.short_description) !== null && _d !== void 0 ? _d : hitDetails.description) !== null && _e !== void 0 ? _e : '',
                 url: (_h = (_g = (_f = hitDetails.card_image_url) !== null && _f !== void 0 ? _f : hitDetails.image_url) !== null && _g !== void 0 ? _g : hitDetails.marketing_url) !== null && _h !== void 0 ? _h : '',
                 thumbnail: (_j = hitDetails.organization_logo_override) !== null && _j !== void 0 ? _j : '',
-                footerLabel: (_l = (_k = hitDetails.content_type) !== null && _k !== void 0 ? _k : hitDetails.type) !== null && _l !== void 0 ? _l : 'Course',
+                content_type: (_l = (_k = hitDetails.content_type) !== null && _k !== void 0 ? _k : hitDetails.type) !== null && _l !== void 0 ? _l : 'Course',
                 product: 'Course',
+                partner: (_m = hitDetails.partner) !== null && _m !== void 0 ? _m : '',
+                weeks_to_complete: (_o = hitDetails.weeks_to_complete) !== null && _o !== void 0 ? _o : undefined,
+                level: (_p = hitDetails.level) !== null && _p !== void 0 ? _p : undefined,
             };
         });
     }),
     enabled: !!searchClient && enabled,
     staleTime: 1000 * 60 * 10,
 });
-//# sourceMappingURL=useRecentlyViewedCoursesAndProgramsData.js.map
+//# sourceMappingURL=usePopularCourses.js.map

package/dist/hooks/usePopularCourses.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePopularCourses.js","sourceRoot":"","sources":["../../src/hooks/usePopularCourses.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,QAAQ,EAAkB,MAAM,uBAAuB,CAAC;AAGjE,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAG/D,iFAAiF;AACjF,oDAAoD;AAEpD,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,GAAG,EAAE,CAAC,QAAQ,CAAU;IACxB,QAAQ,EAAE,CAAC,KAAa,EAAE,IAAc,EAAE,EAAE,CAC1C,CAAC,GAAG,UAAU,CAAC,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,IAAI,CAAU;IACvD,OAAO,EAAE,CAAC,KAAa,EAAE,IAAc,EAAE,IAAY,EAAE,EAAE,CACvD,CAAC,GAAG,UAAU,CAAC,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,CAAU;IAC5D,OAAO,EAAE,CAAC,WAAwB,EAAE,KAAa,EAAE,EAAE,CACnD,CAAC,GAAG,UAAU,CAAC,GAAG,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,CAAU;CAC9D,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CACnC,YAAiC,EACjC,OAAgB,EACmB,EAAE,CACrC,QAAQ,CAAC;IACP,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,mBAAmB,EAAE,CAAC,CAAC;IACpD,OAAO,EAAE,GAAS,EAAE;QAClB,MAAM,IAAI,GAAG,MAAM,oBAAoB,CAAC,YAAa,EAAE,mBAAmB,EAAE,CAAC,CAAC,CAAC;QAC/E,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAmB,EAAE;;YACvC,MAAM,UAAU,GAAG,GAalB,CAAC;YAEF,OAAO;gBACL,QAAQ,EAAE,GAAG,CAAC,QAAQ;gBACtB,KAAK,EAAE,MAAA,MAAA,GAAG,CAAC,KAAK,mCAAI,GAAG,CAAC,IAAI,mCAAI,UAAU;gBAC1C,mBAAmB,EAAE,MAAA,MAAA,MAAA,UAAU,CAAC,mBAAmB,mCAAI,UAAU,CAAC,iBAAiB,mCAAI,UAAU,CAAC,WAAW,mCAAI,EAAE;gBACnH,GAAG,EAAE,MAAA,MAAA,MAAA,UAAU,CAAC,cAAc,mCAAI,UAAU,CAAC,SAAS,mCAAI,UAAU,CAAC,aAAa,mCAAI,EAAE;gBACxF,SAAS,EAAE,MAAA,UAAU,CAAC,0BAA0B,mCAAI,EAAE;gBACtD,YAAY,EAAE,MAAA,MAAA,UAAU,CAAC,YAAY,mCAAI,UAAU,CAAC,IAAI,mCAAI,QAAQ;gBACpE,OAAO,EAAE,QAAQ;gBACjB,OAAO,EAAE,MAAA,UAAU,CAAC,OAAO,mCAAI,EAAE;gBACjC,iBAAiB,EAAE,MAAA,UAAU,CAAC,iBAAiB,mCAAI,SAAS;gBAC5D,KAAK,EAAE,MAAA,UAAU,CAAC,KAAK,mCAAI,SAAS;aACrC,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,CAAA;IACD,OAAO,EAAE,CAAC,CAAC,YAAY,IAAI,OAAO;IAClC,SAAS,EAAE,IAAI,GAAG,EAAE,GAAG,EAAE;CAC1B,CAAC,CAAC","sourcesContent":["import { useQuery, UseQueryResult } from '@tanstack/react-query';\nimport { SearchClient } from 'algoliasearch';\nimport { ProductType } from '@src/types/types';\nimport { PRODUCT_TYPE_COURSE } from '@src/constants';\nimport { fetchPopularProducts } from '@src/utils/algoliaUtils';\nimport { ProductCardItem } from '@src/containers/ProductCard/data/types';\n\n// ─── Query key factories ──────────────────────────────────────────────────────\n// Centralised so cache invalidation is never a typo\n\nexport const searchKeys = {\n  all: ['search'] as const,\n  programs: (query: string, tags: string[]) =>\n    [...searchKeys.all, 'programs', query, tags] as const,\n  courses: (query: string, tags: string[], page: number) =>\n    [...searchKeys.all, 'courses', query, tags, page] as const,\n  popular: (productType: ProductType, limit: number) =>\n    [...searchKeys.all, 'popular', productType, limit] as const,\n};\n\nexport const usePopularCoursesData = (\n  searchClient: SearchClient | null,\n  enabled: boolean,\n): UseQueryResult<ProductCardItem[]> =>\n  useQuery({\n    queryKey: searchKeys.popular(PRODUCT_TYPE_COURSE, 4),\n    queryFn: async () => {\n      const hits = await fetchPopularProducts(searchClient!, PRODUCT_TYPE_COURSE, 4);\n      return hits.map((hit): ProductCardItem => {\n        const hitDetails = hit as {\n          short_description?: string,\n          primary_description?: string,\n          description?: string,\n          marketing_url?: string,\n          image_url?: string,\n          card_image_url?: string,\n          organization_logo_override?: string,\n          content_type?: string,\n          type?: string,\n          partner?: string,\n          weeks_to_complete?: number,\n          level?: string,\n        };\n\n        return {\n          objectID: hit.objectID,\n          title: hit.title ?? hit.name ?? 'Untitled',\n          primary_description: hitDetails.primary_description ?? hitDetails.short_description ?? hitDetails.description ?? '',\n          url: hitDetails.card_image_url ?? hitDetails.image_url ?? hitDetails.marketing_url ?? '',\n          thumbnail: hitDetails.organization_logo_override ?? '',\n          content_type: hitDetails.content_type ?? hitDetails.type ?? 'Course',\n          product: 'Course',\n          partner: hitDetails.partner ?? '',\n          weeks_to_complete: hitDetails.weeks_to_complete ?? undefined,\n          level: hitDetails.level ?? undefined,\n        };\n      });\n    },\n    enabled: !!searchClient && enabled,\n    staleTime: 1000 * 60 * 10,\n  });\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edx/frontend-app-subscription-learner-dashboard",
-  "version": "1.17.0",
+  "version": "1.19.0",
   "description": "",
   "repository": {
     "type": "git",

package/dist/containers/RecentlyViewedPanel/NoRecentlyViewedItems/index.d.ts

@@ -1,3 +0,0 @@
-import { FC } from 'react';
-declare const NoRecentlyViewedItems: FC;
-export default NoRecentlyViewedItems;

package/dist/containers/RecentlyViewedPanel/NoRecentlyViewedItems/index.js

@@ -1,9 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useIntl } from '@openedx/frontend-base';
-import messages from './messages';
-const NoRecentlyViewedItems = () => {
-    const { formatMessage } = useIntl();
-    return (_jsx("div", { "data-testid": "no-recently-viewed-items", children: _jsx("p", { className: "mb-0", children: formatMessage(messages.recentlyViewedEmptyState) }) }));
-};
-export default NoRecentlyViewedItems;
-//# sourceMappingURL=index.js.map

package/dist/containers/RecentlyViewedPanel/NoRecentlyViewedItems/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/containers/RecentlyViewedPanel/NoRecentlyViewedItems/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,MAAM,qBAAqB,GAAO,GAAG,EAAE;IACrC,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,OAAO,CACL,6BAAiB,0BAA0B,YACzC,YAAG,SAAS,EAAC,MAAM,YAAE,aAAa,CAAC,QAAQ,CAAC,wBAAwB,CAAC,GAAK,GACtE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,qBAAqB,CAAC","sourcesContent":["import { FC } from 'react';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport messages from './messages';\n\nconst NoRecentlyViewedItems: FC = () => {\n  const { formatMessage } = useIntl();\n\n  return (\n    <div data-testid=\"no-recently-viewed-items\">\n      <p className=\"mb-0\">{formatMessage(messages.recentlyViewedEmptyState)}</p>\n    </div>\n  );\n};\n\nexport default NoRecentlyViewedItems;\n"]}

package/dist/containers/RecentlyViewedPanel/NoRecentlyViewedItems/messages.js

@@ -1,10 +0,0 @@
-import { defineMessages } from '@openedx/frontend-base';
-const messages = defineMessages({
-    recentlyViewedEmptyState: {
-        id: 'subs-dash.recentlyViewedPanel.emptyState',
-        defaultMessage: 'When you browse the edX Unlimited catalog, we\'ll show the courses and programs you viewed here.',
-        description: 'Placeholder text for recently viewed courses and programs section',
-    },
-});
-export default messages;
-//# sourceMappingURL=messages.js.map

package/dist/containers/RecentlyViewedPanel/NoRecentlyViewedItems/messages.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../../src/containers/RecentlyViewedPanel/NoRecentlyViewedItems/messages.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,wBAAwB,EAAE;QACxB,EAAE,EAAE,0CAA0C;QAC9C,cAAc,EAAE,kGAAkG;QAClH,WAAW,EAAE,mEAAmE;KACjF;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  recentlyViewedEmptyState: {\n    id: 'subs-dash.recentlyViewedPanel.emptyState',\n    defaultMessage: 'When you browse the edX Unlimited catalog, we\\'ll show the courses and programs you viewed here.',\n    description: 'Placeholder text for recently viewed courses and programs section',\n  },\n});\n\nexport default messages;\n"]}

package/dist/containers/RecentlyViewedPanel/RecentlyViewedCourseProgram/index.d.ts

@@ -1,4 +0,0 @@
-import { FC } from 'react';
-import { RecentlyViewedCourseProgramProps } from './data/types';
-export declare const RecentlyViewedCourseProgram: FC<RecentlyViewedCourseProgramProps>;
-export default RecentlyViewedCourseProgram;

package/dist/containers/RecentlyViewedPanel/RecentlyViewedCourseProgram/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/containers/RecentlyViewedPanel/RecentlyViewedCourseProgram/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGhD,MAAM,CAAC,MAAM,2BAA2B,GAAyC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IACxG,OAAO,CACL,6BAAiB,uBAAuB,YACtC,cAAK,SAAS,EAAC,gDAAgD,YAC5D,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,cAAyB,SAAS,EAAC,sCAAsC,YACvE,KAAC,WAAW,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,GAAI,IADzC,IAAI,CAAC,QAAQ,CAEjB,CACP,CAAC,GACE,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,2BAA2B,CAAC","sourcesContent":["import { FC } from 'react';\n\nimport { ProductCard } from '../../ProductCard';\nimport { RecentlyViewedCourseProgramProps } from './data/types';\n\nexport const RecentlyViewedCourseProgram: FC<RecentlyViewedCourseProgramProps> = ({ items, isLoading }) => {\n  return (\n    <div data-testid=\"recently-viewed-items\">\n      <div className=\"row g-3 flex-nowrap flex-md-wrap overflow-auto\">\n        {items.map((item) => (\n          <div key={item.objectID} className=\"col-12 col-md-6 col-xl-3 d-flex mb-2\">\n            <ProductCard item={item} isLoading={isLoading} />\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default RecentlyViewedCourseProgram;\n"]}

package/dist/containers/RecentlyViewedPanel/index.d.ts

@@ -1,3 +0,0 @@
-import { FC } from 'react';
-export declare const RecentlyViewedPanel: FC;
-export default RecentlyViewedPanel;

package/dist/containers/RecentlyViewedPanel/index.js

@@ -1,21 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { Alert } from '@openedx/paragon';
-import { useIntl } from '@openedx/frontend-base';
-import { useRecentlyViewedCoursesAndProgramsData } from '../../hooks/useRecentlyViewedCoursesAndProgramsData';
-import { useAlgoliaSearch } from '../../utils/algoliaUtils';
-import messages from './messages';
-import NoRecentlyViewedItems from './NoRecentlyViewedItems';
-import RecentlyViewedCourseProgram from './RecentlyViewedCourseProgram';
-export const RecentlyViewedPanel = () => {
-    const { formatMessage } = useIntl();
-    const [searchClient] = useAlgoliaSearch();
-    const { data: recentlyViewedCoursesAndProgramsData = [], isError, isLoading, } = useRecentlyViewedCoursesAndProgramsData(searchClient, true);
-    const hasRecentlyViewedData = useMemo(() => recentlyViewedCoursesAndProgramsData.length > 0, [recentlyViewedCoursesAndProgramsData]);
-    if (isError) {
-        return (_jsx("div", { className: "recently-viewed-container mt-5 mb-3", "data-testid": "recently-viewed-panel", children: _jsx(Alert, { variant: "danger", "data-testid": "recently-viewed-error", children: formatMessage(messages.recentlyViewedErrorText) }) }));
-    }
-    return (_jsxs("div", { className: "recently-viewed-container mt-5 mb-3", "data-testid": "recently-viewed-panel", children: [_jsx("div", { className: "recently-viewed-heading-container mb-4", children: _jsx("h2", { children: formatMessage(messages.recentlyViewedHeader) }) }), (isLoading || hasRecentlyViewedData) ? (_jsx(RecentlyViewedCourseProgram, { items: recentlyViewedCoursesAndProgramsData, isLoading: isLoading })) : (_jsx(NoRecentlyViewedItems, {}))] }));
-};
-export default RecentlyViewedPanel;
-//# sourceMappingURL=index.js.map

package/dist/containers/RecentlyViewedPanel/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/containers/RecentlyViewedPanel/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,OAAO,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,uCAAuC,EAAE,MAAM,oDAAoD,CAAC;AAC7G,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,qBAAqB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,2BAA2B,MAAM,+BAA+B,CAAC;AAExE,MAAM,CAAC,MAAM,mBAAmB,GAAO,GAAG,EAAE;IAC1C,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,CAAC,YAAY,CAAC,GAAG,gBAAgB,EAAE,CAAC;IAC1C,MAAM,EACJ,IAAI,EAAE,oCAAoC,GAAG,EAAE,EAC/C,OAAO,EACP,SAAS,GACV,GAAG,uCAAuC,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC;IAChE,MAAM,qBAAqB,GAAG,OAAO,CACnC,GAAG,EAAE,CAAC,oCAAoC,CAAC,MAAM,GAAG,CAAC,EACrD,CAAC,oCAAoC,CAAC,CACvC,CAAC;IAEF,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CACL,cAAK,SAAS,EAAC,qCAAqC,iBAAa,uBAAuB,YACtF,KAAC,KAAK,IAAC,OAAO,EAAC,QAAQ,iBAAa,uBAAuB,YACxD,aAAa,CAAC,QAAQ,CAAC,uBAAuB,CAAC,GAC1C,GACJ,CACP,CAAC;IACJ,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAC,qCAAqC,iBAAa,uBAAuB,aACtF,cAAK,SAAS,EAAC,wCAAwC,YACrD,uBAAK,aAAa,CAAC,QAAQ,CAAC,oBAAoB,CAAC,GAAM,GACnD,EACL,CAAC,SAAS,IAAI,qBAAqB,CAAC,CAAC,CAAC,CAAC,CACtC,KAAC,2BAA2B,IAC1B,KAAK,EAAE,oCAAoC,EAC3C,SAAS,EAAE,SAAS,GACpB,CACH,CAAC,CAAC,CAAC,CACF,KAAC,qBAAqB,KAAG,CAC1B,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC","sourcesContent":["import { FC, useMemo } from 'react';\nimport { Alert } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { useRecentlyViewedCoursesAndProgramsData } from '@src/hooks/useRecentlyViewedCoursesAndProgramsData';\nimport { useAlgoliaSearch } from '@src/utils/algoliaUtils';\nimport messages from './messages';\nimport NoRecentlyViewedItems from './NoRecentlyViewedItems';\nimport RecentlyViewedCourseProgram from './RecentlyViewedCourseProgram';\n\nexport const RecentlyViewedPanel: FC = () => {\n  const { formatMessage } = useIntl();\n  const [searchClient] = useAlgoliaSearch();\n  const {\n    data: recentlyViewedCoursesAndProgramsData = [],\n    isError,\n    isLoading,\n  } = useRecentlyViewedCoursesAndProgramsData(searchClient, true);\n  const hasRecentlyViewedData = useMemo(\n    () => recentlyViewedCoursesAndProgramsData.length > 0,\n    [recentlyViewedCoursesAndProgramsData]\n  );\n\n  if (isError) {\n    return (\n      <div className=\"recently-viewed-container mt-5 mb-3\" data-testid=\"recently-viewed-panel\">\n        <Alert variant=\"danger\" data-testid=\"recently-viewed-error\">\n          {formatMessage(messages.recentlyViewedErrorText)}\n        </Alert>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"recently-viewed-container mt-5 mb-3\" data-testid=\"recently-viewed-panel\">\n      <div className=\"recently-viewed-heading-container mb-4\">\n        <h2>{formatMessage(messages.recentlyViewedHeader)}</h2>\n      </div>\n      {(isLoading || hasRecentlyViewedData) ? (\n        <RecentlyViewedCourseProgram\n          items={recentlyViewedCoursesAndProgramsData}\n          isLoading={isLoading}\n        />\n      ) : (\n        <NoRecentlyViewedItems />\n      )}\n    </div>\n  );\n};\n\nexport default RecentlyViewedPanel;\n"]}

package/dist/containers/RecentlyViewedPanel/messages.js

@@ -1,15 +0,0 @@
-import { defineMessages } from '@openedx/frontend-base';
-const messages = defineMessages({
-    recentlyViewedHeader: {
-        id: 'subs-dash.recentlyViewedPanel.header',
-        defaultMessage: 'Recently viewed courses and programs',
-        description: 'Label for the recently viewed courses and programs section',
-    },
-    recentlyViewedErrorText: {
-        id: 'subs-dash.recentlyViewedPanel.errorText',
-        defaultMessage: 'Failed to load recently viewed courses and programs. Please try again later.',
-        description: 'Error text for failing to load recently viewed courses and programs',
-    },
-});
-export default messages;
-//# sourceMappingURL=messages.js.map

package/dist/containers/RecentlyViewedPanel/messages.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../src/containers/RecentlyViewedPanel/messages.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,oBAAoB,EAAE;QACpB,EAAE,EAAE,sCAAsC;QAC1C,cAAc,EAAE,sCAAsC;QACtD,WAAW,EAAE,4DAA4D;KAC1E;IACD,uBAAuB,EAAE;QACvB,EAAE,EAAE,yCAAyC;QAC7C,cAAc,EAAE,8EAA8E;QAC9F,WAAW,EAAE,qEAAqE;KACnF;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  recentlyViewedHeader: {\n    id: 'subs-dash.recentlyViewedPanel.header',\n    defaultMessage: 'Recently viewed courses and programs',\n    description: 'Label for the recently viewed courses and programs section',\n  },\n  recentlyViewedErrorText: {\n    id: 'subs-dash.recentlyViewedPanel.errorText',\n    defaultMessage: 'Failed to load recently viewed courses and programs. Please try again later.',\n    description: 'Error text for failing to load recently viewed courses and programs',\n  },\n});\n\nexport default messages;\n"]}

package/dist/hooks/useRecentlyViewedCoursesAndProgramsData.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useRecentlyViewedCoursesAndProgramsData.js","sourceRoot":"","sources":["../../src/hooks/useRecentlyViewedCoursesAndProgramsData.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,QAAQ,EAAkB,MAAM,uBAAuB,CAAC;AAGjE,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAG/D,iFAAiF;AACjF,oDAAoD;AAEpD,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,GAAG,EAAE,CAAC,QAAQ,CAAU;IACxB,QAAQ,EAAE,CAAC,KAAa,EAAE,IAAc,EAAE,EAAE,CAC1C,CAAC,GAAG,UAAU,CAAC,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,IAAI,CAAU;IACvD,OAAO,EAAE,CAAC,KAAa,EAAE,IAAc,EAAE,IAAY,EAAE,EAAE,CACvD,CAAC,GAAG,UAAU,CAAC,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,CAAU;IAC5D,OAAO,EAAE,CAAC,WAAwB,EAAE,KAAa,EAAE,EAAE,CACnD,CAAC,GAAG,UAAU,CAAC,GAAG,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,CAAU;CAC9D,CAAC;AAEF,MAAM,CAAC,MAAM,uCAAuC,GAAG,CACrD,YAAiC,EACjC,OAAgB,EACmB,EAAE,CACrC,QAAQ,CAAC;IACP,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,mBAAmB,EAAE,CAAC,CAAC;IACpD,OAAO,EAAE,GAAS,EAAE;QAClB,MAAM,IAAI,GAAG,MAAM,oBAAoB,CAAC,YAAa,EAAE,mBAAmB,EAAE,CAAC,CAAC,CAAC;QAC/E,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAmB,EAAE;;YACvC,MAAM,UAAU,GAAG,GAUlB,CAAC;YAEF,OAAO;gBACL,QAAQ,EAAE,GAAG,CAAC,QAAQ;gBACtB,KAAK,EAAE,MAAA,MAAA,GAAG,CAAC,KAAK,mCAAI,GAAG,CAAC,IAAI,mCAAI,UAAU;gBAC1C,mBAAmB,EAAE,MAAA,MAAA,MAAA,UAAU,CAAC,mBAAmB,mCAAI,UAAU,CAAC,iBAAiB,mCAAI,UAAU,CAAC,WAAW,mCAAI,EAAE;gBACnH,GAAG,EAAE,MAAA,MAAA,MAAA,UAAU,CAAC,cAAc,mCAAI,UAAU,CAAC,SAAS,mCAAI,UAAU,CAAC,aAAa,mCAAI,EAAE;gBACxF,SAAS,EAAE,MAAA,UAAU,CAAC,0BAA0B,mCAAI,EAAE;gBACtD,WAAW,EAAE,MAAA,MAAA,UAAU,CAAC,YAAY,mCAAI,UAAU,CAAC,IAAI,mCAAI,QAAQ;gBACnE,OAAO,EAAE,QAAQ;aAClB,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,CAAA;IACD,OAAO,EAAE,CAAC,CAAC,YAAY,IAAI,OAAO;IAClC,SAAS,EAAE,IAAI,GAAG,EAAE,GAAG,EAAE;CAC1B,CAAC,CAAC","sourcesContent":["import { useQuery, UseQueryResult } from '@tanstack/react-query';\nimport { SearchClient } from 'algoliasearch';\nimport { ProductType } from '@src/types/types';\nimport { PRODUCT_TYPE_COURSE } from '@src/constants';\nimport { fetchPopularProducts } from '@src/utils/algoliaUtils';\nimport { ProductCardItem } from '@src/containers/ProductCard/data/types';\n\n// ─── Query key factories ──────────────────────────────────────────────────────\n// Centralised so cache invalidation is never a typo\n\nexport const searchKeys = {\n  all: ['search'] as const,\n  programs: (query: string, tags: string[]) =>\n    [...searchKeys.all, 'programs', query, tags] as const,\n  courses: (query: string, tags: string[], page: number) =>\n    [...searchKeys.all, 'courses', query, tags, page] as const,\n  popular: (productType: ProductType, limit: number) =>\n    [...searchKeys.all, 'popular', productType, limit] as const,\n};\n\nexport const useRecentlyViewedCoursesAndProgramsData = (\n  searchClient: SearchClient | null,\n  enabled: boolean,\n): UseQueryResult<ProductCardItem[]> =>\n  useQuery({\n    queryKey: searchKeys.popular(PRODUCT_TYPE_COURSE, 4),\n    queryFn: async () => {\n      const hits = await fetchPopularProducts(searchClient!, PRODUCT_TYPE_COURSE, 4);\n      return hits.map((hit): ProductCardItem => {\n        const hitDetails = hit as {\n          short_description?: string,\n          primary_description?: string,\n          description?: string,\n          marketing_url?: string,\n          image_url?: string,\n          card_image_url?: string,\n          organization_logo_override?: string,\n          content_type?: string,\n          type?: string,\n        };\n\n        return {\n          objectID: hit.objectID,\n          title: hit.title ?? hit.name ?? 'Untitled',\n          primary_description: hitDetails.primary_description ?? hitDetails.short_description ?? hitDetails.description ?? '',\n          url: hitDetails.card_image_url ?? hitDetails.image_url ?? hitDetails.marketing_url ?? '',\n          thumbnail: hitDetails.organization_logo_override ?? '',\n          footerLabel: hitDetails.content_type ?? hitDetails.type ?? 'Course',\n          product: 'Course',\n        };\n      });\n    },\n    enabled: !!searchClient && enabled,\n    staleTime: 1000 * 60 * 10,\n  });\n"]}