@edx/frontend-app-learner-dashboard 1.1.0 → 1.2.0

package/dist/slots.js

@@ -1,6 +1,8 @@
 import { learnerDashboardHeaderApp } from './widgets/LearnerDashboardHeader';
+import { learnerDashboardPlugins } from './widgets/LearnerDashboardPlugins';
 const slots = [
-    ...learnerDashboardHeaderApp.slots
+    ...learnerDashboardHeaderApp.slots,
+    ...learnerDashboardPlugins.slots,
 ];
 export default slots;
 //# sourceMappingURL=slots.js.map

package/dist/slots.js.map

@@ -1 +1 @@
-{"version":3,"file":"slots.js","sourceRoot":"","sources":["../src/slots.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,yBAAyB,EAAE,MAAM,kCAAkC,CAAC;AAE7E,MAAM,KAAK,GAAoB;IAC7B,GAAI,yBAAyB,CAAC,KAAY;CAC3C,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { SlotOperation } from '@openedx/frontend-base';\n\nimport { learnerDashboardHeaderApp } from './widgets/LearnerDashboardHeader';\n\nconst slots: SlotOperation[] = [\n  ...(learnerDashboardHeaderApp.slots as [])\n];\n\nexport default slots;\n"]}
+{"version":3,"file":"slots.js","sourceRoot":"","sources":["../src/slots.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,yBAAyB,EAAE,MAAM,kCAAkC,CAAC;AAC7E,OAAO,EAAE,uBAAuB,EAAE,MAAM,mCAAmC,CAAC;AAE5E,MAAM,KAAK,GAAoB;IAC7B,GAAI,yBAAyB,CAAC,KAAY;IAC1C,GAAI,uBAAuB,CAAC,KAAY;CACzC,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { SlotOperation } from '@openedx/frontend-base';\n\nimport { learnerDashboardHeaderApp } from './widgets/LearnerDashboardHeader';\nimport { learnerDashboardPlugins } from './widgets/LearnerDashboardPlugins';\n\nconst slots: SlotOperation[] = [\n  ...(learnerDashboardHeaderApp.slots as []),\n  ...(learnerDashboardPlugins.slots as []),\n];\n\nexport default slots;\n"]}

package/dist/widgets/LearnerDashboardPlugins/app.d.ts

@@ -0,0 +1,3 @@
+import { App } from '@openedx/frontend-base';
+declare const app: App;
+export default app;

package/dist/widgets/LearnerDashboardPlugins/app.js

@@ -0,0 +1,15 @@
+import { WidgetOperationTypes } from '@openedx/frontend-base';
+import UpgradeButton from './upgrade-button/UpgradeButton';
+const app = {
+    appId: 'org.openedx.frontend.app.learnerDashboard.plugins',
+    slots: [
+        {
+            slotId: 'org.openedx.frontend.slot.learnerDashboard.courseCardAction.v1',
+            id: 'org.openedx.frontend.widget.learnerDashboard.upgradeButton.v1',
+            op: WidgetOperationTypes.PREPEND,
+            component: UpgradeButton,
+        },
+    ],
+};
+export default app;
+//# sourceMappingURL=app.js.map

package/dist/widgets/LearnerDashboardPlugins/app.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app.js","sourceRoot":"","sources":["../../../src/widgets/LearnerDashboardPlugins/app.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAEnE,OAAO,aAAa,MAAM,gCAAgC,CAAC;AAE3D,MAAM,GAAG,GAAQ;IACf,KAAK,EAAE,mDAAmD;IAC1D,KAAK,EAAE;QACL;YACE,MAAM,EAAE,gEAAgE;YACxE,EAAE,EAAE,+DAA+D;YACnE,EAAE,EAAE,oBAAoB,CAAC,OAAO;YAChC,SAAS,EAAE,aAAa;SACzB;KACF;CACF,CAAC;AAEF,eAAe,GAAG,CAAC","sourcesContent":["import { App, WidgetOperationTypes } from '@openedx/frontend-base';\n\nimport UpgradeButton from './upgrade-button/UpgradeButton';\n\nconst app: App = {\n  appId: 'org.openedx.frontend.app.learnerDashboard.plugins',\n  slots: [\n    {\n      slotId: 'org.openedx.frontend.slot.learnerDashboard.courseCardAction.v1',\n      id: 'org.openedx.frontend.widget.learnerDashboard.upgradeButton.v1',\n      op: WidgetOperationTypes.PREPEND,\n      component: UpgradeButton,\n    },\n  ],\n};\n\nexport default app;\n"]}

package/dist/widgets/LearnerDashboardPlugins/index.d.ts

@@ -0,0 +1,2 @@
+export { default as UpgradeButton } from "./upgrade-button";
+export { default as learnerDashboardPlugins } from "./app";

package/dist/widgets/LearnerDashboardPlugins/index.js

@@ -0,0 +1,3 @@
+export { default as UpgradeButton } from './upgrade-button';
+export { default as learnerDashboardPlugins } from './app';
+//# sourceMappingURL=index.js.map

package/dist/widgets/LearnerDashboardPlugins/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/widgets/LearnerDashboardPlugins/index.jsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,OAAO,CAAC","sourcesContent":["export { default as UpgradeButton } from './upgrade-button';\nexport { default as learnerDashboardPlugins } from './app';\n"]}

package/dist/widgets/LearnerDashboardPlugins/tracking/constants.d.ts

@@ -0,0 +1,17 @@
+export const LEARNER_HOME_APP_NAME: "learner-home";
+export namespace eventNames {
+    let dashboardModalOpened: string;
+    let dashboardModalCTAClicked: string;
+    let dashboardModalClosed: string;
+    let upgradeButtonClicked: string;
+    let upgradeButtonClickedEnrollment: string;
+    let upgradeButtonClickedUpsell: string;
+}
+export namespace categories {
+    let upgrade: string;
+}
+export const BUTTON_ELEMENT_TYPE: "BUTTON";
+export const LOCATION_LEARNER_HOME: "learner-home-legacy";
+export const EXPLORE_COURSES_HTML_ID: "explore-courses";
+export const EXPLORE_COURSES_EVENT_NAME: "explore-courses-LD-cta";
+export const EXPLORE_COURSES_EVENT_TEXT: "Explore courses";

package/dist/widgets/LearnerDashboardPlugins/tracking/constants.js

@@ -0,0 +1,20 @@
+export const LEARNER_HOME_APP_NAME = 'learner-home';
+const learnerPortal = 'edx.ui.enterprise.lms.dashboard.learner_portal_modal';
+export const eventNames = {
+    dashboardModalOpened: `${learnerPortal}.opened`,
+    dashboardModalCTAClicked: `${learnerPortal}.dashboard_cta.clicked`,
+    dashboardModalClosed: `${learnerPortal}.closed`,
+    upgradeButtonClicked: 'edx.bi.dashboard.upgrade_button.clicked',
+    upgradeButtonClickedEnrollment: 'edx.course.enrollment.upgrade.clicked',
+    upgradeButtonClickedUpsell: 'edx.bi.ecommerce.upsell_links_clicked',
+};
+export const categories = {
+    upgrade: 'upgrade',
+};
+// Cohesion event properties
+export const BUTTON_ELEMENT_TYPE = 'BUTTON';
+export const LOCATION_LEARNER_HOME = 'learner-home-legacy';
+export const EXPLORE_COURSES_HTML_ID = 'explore-courses';
+export const EXPLORE_COURSES_EVENT_NAME = 'explore-courses-LD-cta';
+export const EXPLORE_COURSES_EVENT_TEXT = 'Explore courses';
+//# sourceMappingURL=constants.js.map

package/dist/widgets/LearnerDashboardPlugins/tracking/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../src/widgets/LearnerDashboardPlugins/tracking/constants.js"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,qBAAqB,GAAG,cAAc,CAAC;AAEpD,MAAM,aAAa,GAAG,sDAAsD,CAAC;AAE7E,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,oBAAoB,EAAE,GAAG,aAAa,SAAS;IAC/C,wBAAwB,EAAE,GAAG,aAAa,wBAAwB;IAClE,oBAAoB,EAAE,GAAG,aAAa,SAAS;IAC/C,oBAAoB,EAAE,yCAAyC;IAC/D,8BAA8B,EAAE,uCAAuC;IACvE,0BAA0B,EAAE,uCAAuC;CACpE,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,OAAO,EAAE,SAAS;CACnB,CAAC;AAEF,4BAA4B;AAC5B,MAAM,CAAC,MAAM,mBAAmB,GAAG,QAAQ,CAAC;AAC5C,MAAM,CAAC,MAAM,qBAAqB,GAAG,qBAAqB,CAAC;AAC3D,MAAM,CAAC,MAAM,uBAAuB,GAAG,iBAAiB,CAAC;AACzD,MAAM,CAAC,MAAM,0BAA0B,GAAG,wBAAwB,CAAC;AACnE,MAAM,CAAC,MAAM,0BAA0B,GAAG,iBAAiB,CAAC","sourcesContent":["export const LEARNER_HOME_APP_NAME = 'learner-home';\n\nconst learnerPortal = 'edx.ui.enterprise.lms.dashboard.learner_portal_modal';\n\nexport const eventNames = {\n  dashboardModalOpened: `${learnerPortal}.opened`,\n  dashboardModalCTAClicked: `${learnerPortal}.dashboard_cta.clicked`,\n  dashboardModalClosed: `${learnerPortal}.closed`,\n  upgradeButtonClicked: 'edx.bi.dashboard.upgrade_button.clicked',\n  upgradeButtonClickedEnrollment: 'edx.course.enrollment.upgrade.clicked',\n  upgradeButtonClickedUpsell: 'edx.bi.ecommerce.upsell_links_clicked',\n};\n\nexport const categories = {\n  upgrade: 'upgrade',\n};\n\n// Cohesion event properties\nexport const BUTTON_ELEMENT_TYPE = 'BUTTON';\nexport const LOCATION_LEARNER_HOME = 'learner-home-legacy';\nexport const EXPLORE_COURSES_HTML_ID = 'explore-courses';\nexport const EXPLORE_COURSES_EVENT_NAME = 'explore-courses-LD-cta';\nexport const EXPLORE_COURSES_EVENT_TEXT = 'Explore courses';\n"]}

package/dist/widgets/LearnerDashboardPlugins/tracking/cookie.d.ts

@@ -0,0 +1,2 @@
+export function setCookie(cookieName: any, cookieValue: any): void;
+export function handleCorrelationIDCookie(): `${string}-${string}-${string}-${string}-${string}`;

package/dist/widgets/LearnerDashboardPlugins/tracking/cookie.js

@@ -0,0 +1,14 @@
+// general cookie setter, expires after 30 minutes
+export function setCookie(cookieName, cookieValue) {
+    const a = new Date();
+    // set to expire after 30 minutes, or 1.8 million milliseconds
+    a.setTime(a.getTime() + 1800000);
+    document.cookie = `${cookieName}\x3d${cookieValue}; expires\x3d${a.toGMTString()}; path\x3d/; domain\x3d.edx.org;`;
+}
+export const handleCorrelationIDCookie = () => {
+    // set correlation ID to a random UUID
+    const correlationId = window.crypto.randomUUID();
+    setCookie('tglr_correlation_id', correlationId);
+    return correlationId;
+};
+//# sourceMappingURL=cookie.js.map

package/dist/widgets/LearnerDashboardPlugins/tracking/cookie.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cookie.js","sourceRoot":"","sources":["../../../../src/widgets/LearnerDashboardPlugins/tracking/cookie.js"],"names":[],"mappings":"AAAA,kDAAkD;AAClD,MAAM,UAAU,SAAS,CAAC,UAAU,EAAE,WAAW;IAC/C,MAAM,CAAC,GAAG,IAAI,IAAI,EAAE,CAAC;IACrB,8DAA8D;IAC9D,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EAAE,GAAG,OAAO,CAAC,CAAC;IACjC,QAAQ,CAAC,MAAM,GAAG,GAAG,UAAU,OAAO,WAAW,gBAAgB,CAAC,CAAC,WAAW,EAAE,kCAAkC,CAAC;AACrH,CAAC;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG,GAAG,EAAE;IAC5C,sCAAsC;IACtC,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC;IAEjD,SAAS,CAAC,qBAAqB,EAAE,aAAa,CAAC,CAAC;IAChD,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC","sourcesContent":["// general cookie setter, expires after 30 minutes\nexport function setCookie(cookieName, cookieValue) {\n  const a = new Date();\n  // set to expire after 30 minutes, or 1.8 million milliseconds\n  a.setTime(a.getTime() + 1800000);\n  document.cookie = `${cookieName}\\x3d${cookieValue}; expires\\x3d${a.toGMTString()}; path\\x3d/; domain\\x3d.edx.org;`;\n}\n\nexport const handleCorrelationIDCookie = () => {\n  // set correlation ID to a random UUID\n  const correlationId = window.crypto.randomUUID();\n\n  setCookie('tglr_correlation_id', correlationId);\n  return correlationId;\n};\n"]}

package/dist/widgets/LearnerDashboardPlugins/tracking/trackers/upgradeButton.d.ts

@@ -0,0 +1 @@
+export function upgradeClicked(courseId: any, org: any, courseName: any, href: any): (e: any) => number;

package/dist/widgets/LearnerDashboardPlugins/tracking/trackers/upgradeButton.js

@@ -0,0 +1,53 @@
+import { logError } from '@openedx/frontend-base';
+import { logEvent, createEventTracker, createLinkTracker } from '../utils';
+import { handleCorrelationIDCookie } from '../cookie';
+import { eventNames, categories } from '../constants';
+const upsellOptions = {
+    linkName: 'course_dashboard_green',
+    linkCategory: 'green_update',
+};
+const logUpgrade = ({ courseId }) => logEvent({
+    eventName: eventNames.upgradeButtonClickedEnrollment,
+    courseId,
+    data: { location: 'learner-dashboard' },
+});
+// Upgrade Events
+/**
+ * There are currently multiple tracked api events for the upgrade event, with different targets.
+ * Goal here is to split out the tracked events for easier testing.
+ */
+const upgradeButtonClicked = (courseId) => createEventTracker(eventNames.upgradeButtonClicked, { category: categories.upgrade, label: courseId });
+const upgradeButtonClickedUpsell = (courseId) => createEventTracker(eventNames.upgradeButtonClickedUpsell, Object.assign(Object.assign({}, upsellOptions), { courseId }));
+const upgradeButtonClickedCohesion = (org, courseName) => {
+    var _a;
+    const correlationId = handleCorrelationIDCookie();
+    const courseOrganization = org.toLowerCase();
+    if (window.tagular && typeof window.tagular === 'function') {
+        (_a = window.tagular) === null || _a === void 0 ? void 0 : _a.call(window, 'beam', {
+            '@type': 'core.conversions.ConversionTracked.v2',
+            correlation: {
+                id: correlationId,
+            },
+            metadata: {
+                category: 'Enrollment',
+                action: 'Upgraded',
+                timestamp: new Date().toISOString(),
+                productList: [{
+                        brand: courseOrganization,
+                        variant: 'courses',
+                        name: courseName,
+                    }],
+            },
+        });
+    }
+    else {
+        logError('Cohesion script failed to load before upgrade button clicked');
+    }
+};
+export const upgradeClicked = (courseId, org, courseName, href) => createLinkTracker(() => {
+    upgradeButtonClicked(courseId)();
+    upgradeButtonClickedUpsell(courseId)();
+    upgradeButtonClickedCohesion(org, courseName);
+    logUpgrade({ courseId });
+}, href);
+//# sourceMappingURL=upgradeButton.js.map

package/dist/widgets/LearnerDashboardPlugins/tracking/trackers/upgradeButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upgradeButton.js","sourceRoot":"","sources":["../../../../../src/widgets/LearnerDashboardPlugins/tracking/trackers/upgradeButton.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAC3E,OAAO,EAAE,yBAAyB,EAAE,MAAM,WAAW,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAEtD,MAAM,aAAa,GAAG;IACpB,QAAQ,EAAE,wBAAwB;IAClC,YAAY,EAAE,cAAc;CAC7B,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC;IAC5C,SAAS,EAAE,UAAU,CAAC,8BAA8B;IACpD,QAAQ;IACR,IAAI,EAAE,EAAE,QAAQ,EAAE,mBAAmB,EAAE;CACxC,CAAC,CAAC;AAEH,iBAAiB;AACjB;;;GAGG;AACH,MAAM,oBAAoB,GAAG,CAAC,QAAQ,EAAE,EAAE,CAAC,kBAAkB,CAC3D,UAAU,CAAC,oBAAoB,EAC/B,EAAE,QAAQ,EAAE,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,CAClD,CAAC;AAEF,MAAM,0BAA0B,GAAG,CAAC,QAAQ,EAAE,EAAE,CAAC,kBAAkB,CACjE,UAAU,CAAC,0BAA0B,kCAChC,aAAa,KAAE,QAAQ,IAC7B,CAAC;AAEF,MAAM,4BAA4B,GAAG,CAAC,GAAG,EAAE,UAAU,EAAE,EAAE;;IACvD,MAAM,aAAa,GAAG,yBAAyB,EAAE,CAAC;IAClD,MAAM,kBAAkB,GAAG,GAAG,CAAC,WAAW,EAAE,CAAC;IAE7C,IAAI,MAAM,CAAC,OAAO,IAAI,OAAO,MAAM,CAAC,OAAO,KAAK,UAAU,EAAE,CAAC;QAC3D,MAAA,MAAM,CAAC,OAAO,uDAAG,MAAM,EAAE;YACvB,OAAO,EAAE,uCAAuC;YAChD,WAAW,EAAE;gBACX,EAAE,EAAE,aAAa;aAClB;YACD,QAAQ,EAAE;gBACR,QAAQ,EAAE,YAAY;gBACtB,MAAM,EAAE,UAAU;gBAClB,SAAS,EAAE,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE;gBACnC,WAAW,EAAE,CAAC;wBACZ,KAAK,EAAE,kBAAkB;wBACzB,OAAO,EAAE,SAAS;wBAClB,IAAI,EAAE,UAAU;qBACjB,CAAC;aACH;SACF,CAAC,CAAC;IACL,CAAC;SAAM,CAAC;QACN,QAAQ,CAAC,8DAA8D,CAAC,CAAC;IAC3E,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,QAAQ,EAAE,GAAG,EAAE,UAAU,EAAE,IAAI,EAAE,EAAE,CAAC,iBAAiB,CAClF,GAAG,EAAE;IACH,oBAAoB,CAAC,QAAQ,CAAC,EAAE,CAAC;IACjC,0BAA0B,CAAC,QAAQ,CAAC,EAAE,CAAC;IACvC,4BAA4B,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC;AAC3B,CAAC,EACD,IAAI,CACL,CAAC","sourcesContent":["import { logError } from '@openedx/frontend-base';\nimport { logEvent, createEventTracker, createLinkTracker } from '../utils';\nimport { handleCorrelationIDCookie } from '../cookie';\nimport { eventNames, categories } from '../constants';\n\nconst upsellOptions = {\n  linkName: 'course_dashboard_green',\n  linkCategory: 'green_update',\n};\n\nconst logUpgrade = ({ courseId }) => logEvent({\n  eventName: eventNames.upgradeButtonClickedEnrollment,\n  courseId,\n  data: { location: 'learner-dashboard' },\n});\n\n// Upgrade Events\n/**\n * There are currently multiple tracked api events for the upgrade event, with different targets.\n * Goal here is to split out the tracked events for easier testing.\n */\nconst upgradeButtonClicked = (courseId) => createEventTracker(\n  eventNames.upgradeButtonClicked,\n  { category: categories.upgrade, label: courseId },\n);\n\nconst upgradeButtonClickedUpsell = (courseId) => createEventTracker(\n  eventNames.upgradeButtonClickedUpsell,\n  { ...upsellOptions, courseId },\n);\n\nconst upgradeButtonClickedCohesion = (org, courseName) => {\n  const correlationId = handleCorrelationIDCookie();\n  const courseOrganization = org.toLowerCase();\n\n  if (window.tagular && typeof window.tagular === 'function') {\n    window.tagular?.('beam', {\n      '@type': 'core.conversions.ConversionTracked.v2',\n      correlation: {\n        id: correlationId,\n      },\n      metadata: {\n        category: 'Enrollment',\n        action: 'Upgraded',\n        timestamp: new Date().toISOString(),\n        productList: [{\n          brand: courseOrganization,\n          variant: 'courses',\n          name: courseName,\n        }],\n      },\n    });\n  } else {\n    logError('Cohesion script failed to load before upgrade button clicked');\n  }\n};\n\nexport const upgradeClicked = (courseId, org, courseName, href) => createLinkTracker(\n  () => {\n    upgradeButtonClicked(courseId)();\n    upgradeButtonClickedUpsell(courseId)();\n    upgradeButtonClickedCohesion(org, courseName);\n    logUpgrade({ courseId });\n  },\n  href,\n);\n"]}

package/dist/widgets/LearnerDashboardPlugins/tracking/utils.d.ts

@@ -0,0 +1,8 @@
+export function logEvent({ eventName, data, courseId }: {
+    eventName: any;
+    data: any;
+    courseId: any;
+}): any;
+export function createEventTracker(name: any, options?: {}): () => void;
+export function createPageEventTracker(name: string, options?: object): Function;
+export function createLinkTracker(tracker: any, href: any): (e: any) => number;

package/dist/widgets/LearnerDashboardPlugins/tracking/utils.js

@@ -0,0 +1,28 @@
+import { getSiteConfig, getAuthenticatedHttpClient, sendTrackEvent, sendPageEvent, } from '@openedx/frontend-base';
+import { LEARNER_HOME_APP_NAME } from './constants';
+const LINK_TIMEOUT = 300;
+const eventUrl = `${getSiteConfig().LMS_BASE_URL}/event`;
+// Utils/Helpers
+export const logEvent = ({ eventName, data, courseId }) => getAuthenticatedHttpClient().post(eventUrl, {
+    courserun_key: courseId,
+    event_type: eventName,
+    page: window.location.href,
+    event: JSON.stringify(data),
+});
+export const createEventTracker = (name, options = {}) => () => sendTrackEvent(name, Object.assign(Object.assign({}, options), { app_name: LEARNER_HOME_APP_NAME }));
+/**
+ * Creates an event tracker function that sends a tracking event with the given name and options.
+ *
+ * @param {string} name - The name of the event to be tracked.
+ * @param {object} [options={}] - Additional options to be included with the event.
+ * @returns {function} - A function that, when called, sends the tracking event.
+ */
+export const createPageEventTracker = (name, options = null) => () => sendPageEvent(name, options, { app_name: LEARNER_HOME_APP_NAME });
+export const createLinkTracker = (tracker, href) => (e) => {
+    e.preventDefault();
+    tracker();
+    return setTimeout(() => {
+        global.location.href = href;
+    }, LINK_TIMEOUT);
+};
+//# sourceMappingURL=utils.js.map

package/dist/widgets/LearnerDashboardPlugins/tracking/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/widgets/LearnerDashboardPlugins/tracking/utils.js"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EAAE,0BAA0B,EAAE,cAAc,EAAE,aAAa,GACzE,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAC;AAEpD,MAAM,YAAY,GAAG,GAAG,CAAC;AAEzB,MAAM,QAAQ,GAAG,GAAG,aAAa,EAAE,CAAC,YAAY,QAAQ,CAAC;AAEzD,gBAAgB;AAChB,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,0BAA0B,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE;IACrG,aAAa,EAAE,QAAQ;IACvB,UAAU,EAAE,SAAS;IACrB,IAAI,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI;IAC1B,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;CAC5B,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,IAAI,EAAE,OAAO,GAAG,EAAE,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC,cAAc,CAC5E,IAAI,kCACC,OAAO,KAAE,QAAQ,EAAE,qBAAqB,IAC9C,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC,aAAa,CACjF,IAAI,EACJ,OAAO,EACP,EAAE,QAAQ,EAAE,qBAAqB,EAAE,CACpC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,OAAO,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE;IACxD,CAAC,CAAC,cAAc,EAAE,CAAC;IACnB,OAAO,EAAE,CAAC;IACV,OAAO,UAAU,CAAC,GAAG,EAAE;QACrB,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC;IAC9B,CAAC,EAAE,YAAY,CAAC,CAAC;AACnB,CAAC,CAAC","sourcesContent":["import {\n  getSiteConfig, getAuthenticatedHttpClient, sendTrackEvent, sendPageEvent,\n} from '@openedx/frontend-base';\nimport { LEARNER_HOME_APP_NAME } from './constants';\n\nconst LINK_TIMEOUT = 300;\n\nconst eventUrl = `${getSiteConfig().LMS_BASE_URL}/event`;\n\n// Utils/Helpers\nexport const logEvent = ({ eventName, data, courseId }) => getAuthenticatedHttpClient().post(eventUrl, {\n  courserun_key: courseId,\n  event_type: eventName,\n  page: window.location.href,\n  event: JSON.stringify(data),\n});\n\nexport const createEventTracker = (name, options = {}) => () => sendTrackEvent(\n  name,\n  { ...options, app_name: LEARNER_HOME_APP_NAME },\n);\n\n/**\n * Creates an event tracker function that sends a tracking event with the given name and options.\n *\n * @param {string} name - The name of the event to be tracked.\n * @param {object} [options={}] - Additional options to be included with the event.\n * @returns {function} - A function that, when called, sends the tracking event.\n */\nexport const createPageEventTracker = (name, options = null) => () => sendPageEvent(\n  name,\n  options,\n  { app_name: LEARNER_HOME_APP_NAME },\n);\n\nexport const createLinkTracker = (tracker, href) => (e) => {\n  e.preventDefault();\n  tracker();\n  return setTimeout(() => {\n    global.location.href = href;\n  }, LINK_TIMEOUT);\n};\n"]}

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/UpgradeButton.d.ts

@@ -0,0 +1,10 @@
+export function UpgradeButton({ cardId }: {
+    cardId: any;
+}): import("react/jsx-runtime").JSX.Element;
+export namespace UpgradeButton {
+    namespace propTypes {
+        let cardId: PropTypes.Validator<string>;
+    }
+}
+export default UpgradeButton;
+import PropTypes from 'prop-types';

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/UpgradeButton.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable import/no-named-as-default-member */
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useIntl } from '@openedx/frontend-base';
+import { Button } from '@openedx/paragon';
+import { Locked } from '@openedx/paragon/icons';
+import { useCourseData, useCourseTrackingEvent } from '../../../hooks';
+import { upgradeClicked } from '../tracking/trackers/upgradeButton';
+import { useIsCollapsed, useActionDisabledState } from './data/hooks';
+import messages from './messages';
+export const UpgradeButton = ({ cardId }) => {
+    var _a;
+    const { formatMessage } = useIntl();
+    const courseRun = ((_a = useCourseData(cardId)) === null || _a === void 0 ? void 0 : _a.courseRun) || {};
+    const { upgradeUrl } = courseRun;
+    const org = courseRun.org || '';
+    const courseName = courseRun.title || '';
+    const { disableUpgradeCourse } = useActionDisabledState(cardId);
+    const trackUpgradeClick = useCourseTrackingEvent(upgradeClicked, cardId, org, courseName, upgradeUrl);
+    const isSmall = useIsCollapsed();
+    const enabledProps = {
+        as: 'a',
+        href: upgradeUrl,
+        onClick: trackUpgradeClick,
+    };
+    return (_jsx(Button, Object.assign({ iconBefore: Locked, variant: "outline-primary", disabled: disableUpgradeCourse }, !disableUpgradeCourse && enabledProps, isSmall && { size: 'sm' }, { children: formatMessage(messages.upgrade) })));
+};
+UpgradeButton.propTypes = {
+    cardId: PropTypes.string.isRequired,
+};
+export default UpgradeButton;
+//# sourceMappingURL=UpgradeButton.js.map

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/UpgradeButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UpgradeButton.js","sourceRoot":"","sources":["../../../../src/widgets/LearnerDashboardPlugins/upgrade-button/UpgradeButton.jsx"],"names":[],"mappings":";AAAA,sDAAsD;AACtD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,sBAAsB,EAAE,MAAM,YAAY,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAEpE,OAAO,EAAE,cAAc,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AACtE,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;;IAC1C,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,MAAM,SAAS,GAAG,CAAA,MAAA,aAAa,CAAC,MAAM,CAAC,0CAAE,SAAS,KAAI,EAAE,CAAC;IACzD,MAAM,EAAE,UAAU,EAAE,GAAG,SAAS,CAAC;IACjC,MAAM,GAAG,GAAG,SAAS,CAAC,GAAG,IAAI,EAAE,CAAC;IAChC,MAAM,UAAU,GAAG,SAAS,CAAC,KAAK,IAAI,EAAE,CAAC;IACzC,MAAM,EAAE,oBAAoB,EAAE,GAAG,sBAAsB,CAAC,MAAM,CAAC,CAAC;IAChE,MAAM,iBAAiB,GAAG,sBAAsB,CAC9C,cAAc,EACd,MAAM,EACN,GAAG,EACH,UAAU,EACV,UAAU,CACX,CAAC;IAEF,MAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IAEjC,MAAM,YAAY,GAAG;QACnB,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,UAAU;QAChB,OAAO,EAAE,iBAAiB;KAC3B,CAAC;IAEF,OAAO,CACL,KAAC,MAAM,kBACL,UAAU,EAAE,MAAM,EAClB,OAAO,EAAC,iBAAiB,EACzB,QAAQ,EAAE,oBAAoB,IAC1B,CAAC,oBAAoB,IAAI,YAAY,EACrC,OAAO,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,cAE5B,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,IACzB,CACV,CAAC;AACJ,CAAC,CAAC;AACF,aAAa,CAAC,SAAS,GAAG;IACxB,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC,UAAU;CACpC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["/* eslint-disable import/no-named-as-default-member */\nimport React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { useIntl } from '@openedx/frontend-base';\nimport { Button } from '@openedx/paragon';\nimport { Locked } from '@openedx/paragon/icons';\n\nimport { useCourseData, useCourseTrackingEvent } from '@src/hooks';\nimport { upgradeClicked } from '../tracking/trackers/upgradeButton';\n\nimport { useIsCollapsed, useActionDisabledState } from './data/hooks';\nimport messages from './messages';\n\nexport const UpgradeButton = ({ cardId }) => {\n  const { formatMessage } = useIntl();\n\n  const courseRun = useCourseData(cardId)?.courseRun || {};\n  const { upgradeUrl } = courseRun;\n  const org = courseRun.org || '';\n  const courseName = courseRun.title || '';\n  const { disableUpgradeCourse } = useActionDisabledState(cardId);\n  const trackUpgradeClick = useCourseTrackingEvent(\n    upgradeClicked,\n    cardId,\n    org,\n    courseName,\n    upgradeUrl,\n  );\n\n  const isSmall = useIsCollapsed();\n\n  const enabledProps = {\n    as: 'a',\n    href: upgradeUrl,\n    onClick: trackUpgradeClick,\n  };\n\n  return (\n    <Button\n      iconBefore={Locked}\n      variant=\"outline-primary\"\n      disabled={disableUpgradeCourse}\n      {...!disableUpgradeCourse && enabledProps}\n      {...isSmall && { size: 'sm' }}\n    >\n      {formatMessage(messages.upgrade)}\n    </Button>\n  );\n};\nUpgradeButton.propTypes = {\n  cardId: PropTypes.string.isRequired,\n};\n\nexport default UpgradeButton;\n"]}

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/UpgradeButtonWrapper.d.ts

@@ -0,0 +1,10 @@
+export default UpgradeButtonWrapper;
+declare function UpgradeButtonWrapper({ cardId }: {
+    cardId: any;
+}): import("react/jsx-runtime").JSX.Element | null;
+declare namespace UpgradeButtonWrapper {
+    namespace propTypes {
+        let cardId: PropTypes.Validator<string>;
+    }
+}
+import PropTypes from 'prop-types';

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/UpgradeButtonWrapper.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable import/no-named-as-default */
+/* eslint-disable import/no-named-as-default-member */
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useCourseData, useEntitlementInfo } from '../../../hooks';
+import UpgradeButton from './UpgradeButton';
+const UpgradeButtonWrapper = ({ cardId }) => {
+    const courseData = useCourseData(cardId);
+    const { isEntitlement } = useEntitlementInfo(courseData);
+    const { isVerified, isExecEd2UCourse, } = (courseData === null || courseData === void 0 ? void 0 : courseData.enrollment) || {};
+    if (!(isEntitlement || isVerified || isExecEd2UCourse)) {
+        return _jsx(UpgradeButton, { cardId: cardId });
+    }
+    return null;
+};
+UpgradeButtonWrapper.propTypes = {
+    cardId: PropTypes.string.isRequired,
+};
+export default UpgradeButtonWrapper;
+//# sourceMappingURL=UpgradeButtonWrapper.js.map

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/UpgradeButtonWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UpgradeButtonWrapper.js","sourceRoot":"","sources":["../../../../src/widgets/LearnerDashboardPlugins/upgrade-button/UpgradeButtonWrapper.jsx"],"names":[],"mappings":";AAAA,+CAA+C;AAC/C,sDAAsD;AACtD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAC/D,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C,MAAM,oBAAoB,GAAG,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;IAC1C,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IACzC,MAAM,EAAE,aAAa,EAAE,GAAG,kBAAkB,CAAC,UAAU,CAAC,CAAC;IACzD,MAAM,EACJ,UAAU,EACV,gBAAgB,GACjB,GAAG,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,KAAI,EAAE,CAAC;IAEjC,IAAI,CAAC,CAAC,aAAa,IAAI,UAAU,IAAI,gBAAgB,CAAC,EAAE,CAAC;QACvD,OAAO,KAAC,aAAa,IAAC,MAAM,EAAE,MAAM,GAAI,CAAC;IAC3C,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,oBAAoB,CAAC,SAAS,GAAG;IAC/B,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC,UAAU;CACpC,CAAC;AAEF,eAAe,oBAAoB,CAAC","sourcesContent":["/* eslint-disable import/no-named-as-default */\n/* eslint-disable import/no-named-as-default-member */\nimport React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { useCourseData, useEntitlementInfo } from '@src/hooks';\nimport UpgradeButton from './UpgradeButton';\n\nconst UpgradeButtonWrapper = ({ cardId }) => {\n  const courseData = useCourseData(cardId);\n  const { isEntitlement } = useEntitlementInfo(courseData);\n  const {\n    isVerified,\n    isExecEd2UCourse,\n  } = courseData?.enrollment || {};\n\n  if (!(isEntitlement || isVerified || isExecEd2UCourse)) {\n    return <UpgradeButton cardId={cardId} />;\n  }\n  return null;\n};\n\nUpgradeButtonWrapper.propTypes = {\n  cardId: PropTypes.string.isRequired,\n};\n\nexport default UpgradeButtonWrapper;\n"]}

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/data/hooks.d.ts

@@ -0,0 +1,4 @@
+export function useIsCollapsed(): boolean;
+export function useActionDisabledState(cardId: any): {
+    disableUpgradeCourse: boolean;
+};

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/data/hooks.js

@@ -0,0 +1,17 @@
+import { useWindowSize, breakpoints } from '@openedx/paragon';
+import { useCourseData, useIsMasquerading } from '../../../../hooks';
+export const useIsCollapsed = () => {
+    const { width } = useWindowSize();
+    return width < breakpoints.medium.maxWidth && width > breakpoints.small.maxWidth;
+};
+export const useActionDisabledState = (cardId) => {
+    const isMasquerading = useIsMasquerading();
+    const courseData = useCourseData(cardId);
+    const { canUpgrade } = (courseData === null || courseData === void 0 ? void 0 : courseData.enrollment) || {};
+    const { upgradeUrl } = (courseData === null || courseData === void 0 ? void 0 : courseData.courseRun) || {};
+    const disableUpgradeCourse = !upgradeUrl || (isMasquerading && !canUpgrade);
+    return {
+        disableUpgradeCourse,
+    };
+};
+//# sourceMappingURL=hooks.js.map

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/data/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../../../../../src/widgets/LearnerDashboardPlugins/upgrade-button/data/hooks.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAE9D,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,EAAE,CAAC;IAClC,OAAO,KAAK,GAAG,WAAW,CAAC,MAAM,CAAC,QAAQ,IAAI,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC;AACnF,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,MAAM,EAAE,EAAE;IAC/C,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;IAC3C,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IACzC,MAAM,EAAE,UAAU,EAAE,GAAG,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,KAAI,EAAE,CAAC;IACpD,MAAM,EAAE,UAAU,EAAE,GAAG,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,KAAI,EAAE,CAAC;IAEnD,MAAM,oBAAoB,GAAG,CAAC,UAAU,IAAI,CAAC,cAAc,IAAI,CAAC,UAAU,CAAC,CAAC;IAE5E,OAAO;QACL,oBAAoB;KACrB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useWindowSize, breakpoints } from '@openedx/paragon';\nimport { useCourseData, useIsMasquerading } from '@src/hooks';\n\nexport const useIsCollapsed = () => {\n  const { width } = useWindowSize();\n  return width < breakpoints.medium.maxWidth && width > breakpoints.small.maxWidth;\n};\n\nexport const useActionDisabledState = (cardId) => {\n  const isMasquerading = useIsMasquerading();\n  const courseData = useCourseData(cardId);\n  const { canUpgrade } = courseData?.enrollment || {};\n  const { upgradeUrl } = courseData?.courseRun || {};\n\n  const disableUpgradeCourse = !upgradeUrl || (isMasquerading && !canUpgrade);\n\n  return {\n    disableUpgradeCourse,\n  };\n};\n"]}

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/index.d.ts

@@ -0,0 +1,2 @@
+export default UpgradeButtonWrapper;
+import UpgradeButtonWrapper from './UpgradeButtonWrapper';

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/index.js

@@ -0,0 +1,3 @@
+import UpgradeButtonWrapper from './UpgradeButtonWrapper';
+export default UpgradeButtonWrapper;
+//# sourceMappingURL=index.js.map

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/widgets/LearnerDashboardPlugins/upgrade-button/index.jsx"],"names":[],"mappings":"AAAA,OAAO,oBAAoB,MAAM,wBAAwB,CAAC;AAE1D,eAAe,oBAAoB,CAAC","sourcesContent":["import UpgradeButtonWrapper from './UpgradeButtonWrapper';\n\nexport default UpgradeButtonWrapper;\n"]}

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/messages.d.ts

@@ -0,0 +1,8 @@
+export default messages;
+declare namespace messages {
+    namespace upgrade {
+        let id: string;
+        let description: string;
+        let defaultMessage: string;
+    }
+}

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/messages.js

@@ -0,0 +1,10 @@
+import { defineMessages } from '@openedx/frontend-base';
+const messages = defineMessages({
+    upgrade: {
+        id: 'learner-dash.courseCard.actions.upgrade',
+        description: 'Course card upgrade button text',
+        defaultMessage: 'Upgrade',
+    },
+});
+export default messages;
+//# sourceMappingURL=messages.js.map

package/dist/widgets/LearnerDashboardPlugins/upgrade-button/messages.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../../src/widgets/LearnerDashboardPlugins/upgrade-button/messages.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,OAAO,EAAE;QACP,EAAE,EAAE,yCAAyC;QAC7C,WAAW,EAAE,iCAAiC;QAC9C,cAAc,EAAE,SAAS;KAC1B;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  upgrade: {\n    id: 'learner-dash.courseCard.actions.upgrade',\n    description: 'Course card upgrade button text',\n    defaultMessage: 'Upgrade',\n  },\n});\n\nexport default messages;\n"]}

package/package.json

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