@edx/frontend-app-learner-dashboard 1.0.0

package/dist/containers/Dashboard/index.scss

@@ -0,0 +1,29 @@
+@use "@openedx/paragon/styles/css/core/custom-media-breakpoints.css";
+
+.course-list-column {
+  padding: 0 var(--pgn-spacing-spacer-4);
+}
+
+.sidebar-column {
+  padding: 0 var(--pgn-spacing-spacer-3) 0 var(--pgn-spacing-spacer-1);
+
+  &.not-collapsed {
+    padding-top: var(--pgn-spacing-spacer-2);
+
+    & >:first-child {
+      margin-top: var(--pgn-spacing-spacer-5-5);
+    }
+  }
+}
+
+@media (--pgn-size-breakpoint-max-width-lg) {
+  .sidebar-column {
+    // grid are inheriting dir="ltr" from the body, so we need to override it
+    [dir=ltr] & {
+      padding: 0 var(--pgn-spacing-spacer-3);
+    }
+    [dir=rtl] & {
+      padding: 0 var(--pgn-spacing-spacer-3);
+    }
+  }
+}

package/dist/containers/EmailSettingsModal/hooks.d.ts

@@ -0,0 +1,10 @@
+export const state: any;
+export function useEmailData({ closeModal, cardId, }: {
+    closeModal: any;
+    cardId: any;
+}): {
+    onToggle: () => any;
+    save: () => void;
+    isOptedOut: any;
+};
+export default module.useEmailData;

package/dist/containers/EmailSettingsModal/hooks.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { StrictDict } from '../../utils';
+import { useUpdateEmailSettings } from '../../data/hooks';
+import { useCourseData } from '../../hooks';
+import * as module from './hooks';
+export const state = StrictDict({
+    toggle: (val) => React.useState(val), // eslint-disable-line
+});
+export const useEmailData = ({ closeModal, cardId, }) => {
+    var _a, _b;
+    const courseData = useCourseData(cardId);
+    const hasOptedOutOfEmail = ((_a = courseData === null || courseData === void 0 ? void 0 : courseData.enrollment) === null || _a === void 0 ? void 0 : _a.hasOptedOutOfEmail) || false;
+    const courseId = (_b = courseData === null || courseData === void 0 ? void 0 : courseData.courseRun) === null || _b === void 0 ? void 0 : _b.courseId;
+    const [isOptedOut, setIsOptedOut] = module.state.toggle(hasOptedOutOfEmail);
+    const { mutate: updateEmailSettings } = useUpdateEmailSettings();
+    const onToggle = () => setIsOptedOut(!isOptedOut);
+    const save = () => {
+        updateEmailSettings({ courseId, enable: !isOptedOut }, { onSuccess: () => closeModal() });
+    };
+    return {
+        onToggle,
+        save,
+        isOptedOut,
+    };
+};
+export default useEmailData;
+//# sourceMappingURL=hooks.js.map

package/dist/containers/EmailSettingsModal/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../../../src/containers/EmailSettingsModal/hooks.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACxC,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,KAAK,MAAM,MAAM,SAAS,CAAC;AAElC,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAAC;IAC9B,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,sBAAsB;CAC7D,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,UAAU,EACV,MAAM,GACP,EAAE,EAAE;;IACH,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IACzC,MAAM,kBAAkB,GAAG,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,0CAAE,kBAAkB,KAAI,KAAK,CAAC;IAC/E,MAAM,QAAQ,GAAG,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,0CAAE,QAAQ,CAAC;IACjD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC;IAC5E,MAAM,EAAE,MAAM,EAAE,mBAAmB,EAAE,GAAG,sBAAsB,EAAE,CAAC;IACjE,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,CAAC;IAClD,MAAM,IAAI,GAAG,GAAG,EAAE;QAChB,mBAAmB,CACjB,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,UAAU,EAAE,EACjC,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,UAAU,EAAE,EAAE,CAClC,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO;QACL,QAAQ;QACR,IAAI;QACJ,UAAU;KACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import React from 'react';\n\nimport { StrictDict } from '@src/utils';\nimport { useUpdateEmailSettings } from '@src/data/hooks';\nimport { useCourseData } from '@src/hooks';\n\nimport * as module from './hooks';\n\nexport const state = StrictDict({\n  toggle: (val) => React.useState(val), // eslint-disable-line\n});\n\nexport const useEmailData = ({\n  closeModal,\n  cardId,\n}) => {\n  const courseData = useCourseData(cardId);\n  const hasOptedOutOfEmail = courseData?.enrollment?.hasOptedOutOfEmail || false;\n  const courseId = courseData?.courseRun?.courseId;\n  const [isOptedOut, setIsOptedOut] = module.state.toggle(hasOptedOutOfEmail);\n  const { mutate: updateEmailSettings } = useUpdateEmailSettings();\n  const onToggle = () => setIsOptedOut(!isOptedOut);\n  const save = () => {\n    updateEmailSettings(\n      { courseId, enable: !isOptedOut },\n      { onSuccess: () => closeModal() },\n    );\n  };\n\n  return {\n    onToggle,\n    save,\n    isOptedOut,\n  };\n};\n\nexport default useEmailData;\n"]}

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

@@ -0,0 +1,14 @@
+export function EmailSettingsModal({ closeModal, show, cardId, }: {
+    closeModal: any;
+    show: any;
+    cardId: any;
+}): import("react/jsx-runtime").JSX.Element;
+export namespace EmailSettingsModal {
+    namespace propTypes {
+        let cardId: PropTypes.Validator<string>;
+        let closeModal: PropTypes.Validator<(...args: any[]) => any>;
+        let show: PropTypes.Validator<boolean>;
+    }
+}
+export default EmailSettingsModal;
+import PropTypes from 'prop-types';

package/dist/containers/EmailSettingsModal/index.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useIntl } from '@openedx/frontend-base';
+import { ActionRow, Button, Form, ModalDialog, } from '@openedx/paragon';
+import { nullMethod } from '../../utils';
+import useEmailData from './hooks';
+import messages from './messages';
+export const EmailSettingsModal = ({ closeModal, show, cardId, }) => {
+    const { isOptedOut, onToggle, save, } = useEmailData({ closeModal, cardId });
+    const { formatMessage } = useIntl();
+    return (_jsx(ModalDialog, { isOpen: show, onClose: nullMethod, hasCloseButton: false, title: "", children: _jsxs("div", { className: "bg-white p-3 rounded shadow", style: { textAlign: 'start' }, children: [_jsx("h4", { children: formatMessage(messages.header) }), _jsx(Form.Switch, { checked: !isOptedOut, onChange: onToggle, children: formatMessage(isOptedOut ? messages.emailsOff : messages.emailsOn) }), _jsx("p", { children: formatMessage(messages.description) }), _jsxs(ActionRow, { children: [_jsx(Button, { variant: "tertiary", onClick: closeModal, children: formatMessage(messages.nevermind) }), _jsx(Button, { onClick: save, children: formatMessage(messages.save) })] })] }) }));
+};
+EmailSettingsModal.propTypes = {
+    cardId: PropTypes.string.isRequired,
+    closeModal: PropTypes.func.isRequired,
+    show: PropTypes.bool.isRequired,
+};
+export default EmailSettingsModal;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/containers/EmailSettingsModal/index.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EACL,SAAS,EACT,MAAM,EACN,IAAI,EACJ,WAAW,GACZ,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,OAAO,YAAY,MAAM,SAAS,CAAC;AACnC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EACjC,UAAU,EACV,IAAI,EACJ,MAAM,GACP,EAAE,EAAE;IACH,MAAM,EACJ,UAAU,EACV,QAAQ,EACR,IAAI,GACL,GAAG,YAAY,CAAC,EAAE,UAAU,EAAE,MAAM,EAAE,CAAC,CAAC;IACzC,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,OAAO,CACL,KAAC,WAAW,IACV,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,UAAU,EACnB,cAAc,EAAE,KAAK,EACrB,KAAK,EAAC,EAAE,YAER,eAAK,SAAS,EAAC,6BAA6B,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,aACxE,uBAAK,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAM,EACzC,KAAC,IAAI,CAAC,MAAM,IAAC,OAAO,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,QAAQ,YAClD,aAAa,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,GACvD,EACd,sBAAI,aAAa,CAAC,QAAQ,CAAC,WAAW,CAAC,GAAK,EAC5C,MAAC,SAAS,eACR,KAAC,MAAM,IAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,UAAU,YAC3C,aAAa,CAAC,QAAQ,CAAC,SAAS,CAAC,GAC3B,EACT,KAAC,MAAM,IAAC,OAAO,EAAE,IAAI,YAAG,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAU,IACpD,IACR,GACM,CACf,CAAC;AACJ,CAAC,CAAC;AACF,kBAAkB,CAAC,SAAS,GAAG;IAC7B,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC,UAAU;IACnC,UAAU,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;IACrC,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;CAChC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { useIntl } from '@openedx/frontend-base';\nimport {\n  ActionRow,\n  Button,\n  Form,\n  ModalDialog,\n} from '@openedx/paragon';\n\nimport { nullMethod } from '../../utils';\n\nimport useEmailData from './hooks';\nimport messages from './messages';\n\nexport const EmailSettingsModal = ({\n  closeModal,\n  show,\n  cardId,\n}) => {\n  const {\n    isOptedOut,\n    onToggle,\n    save,\n  } = useEmailData({ closeModal, cardId });\n  const { formatMessage } = useIntl();\n\n  return (\n    <ModalDialog\n      isOpen={show}\n      onClose={nullMethod}\n      hasCloseButton={false}\n      title=\"\"\n    >\n      <div className=\"bg-white p-3 rounded shadow\" style={{ textAlign: 'start' }}>\n        <h4>{formatMessage(messages.header)}</h4>\n        <Form.Switch checked={!isOptedOut} onChange={onToggle}>\n          {formatMessage(isOptedOut ? messages.emailsOff : messages.emailsOn)}\n        </Form.Switch>\n        <p>{formatMessage(messages.description)}</p>\n        <ActionRow>\n          <Button variant=\"tertiary\" onClick={closeModal}>\n            {formatMessage(messages.nevermind)}\n          </Button>\n          <Button onClick={save}>{formatMessage(messages.save)}</Button>\n        </ActionRow>\n      </div>\n    </ModalDialog>\n  );\n};\nEmailSettingsModal.propTypes = {\n  cardId: PropTypes.string.isRequired,\n  closeModal: PropTypes.func.isRequired,\n  show: PropTypes.bool.isRequired,\n};\n\nexport default EmailSettingsModal;\n"]}

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

@@ -0,0 +1,49 @@
+export default messages;
+declare namespace messages {
+    export namespace header {
+        let id: string;
+        let description: string;
+        let defaultMessage: string;
+    }
+    export namespace emailsOff {
+        let id_1: string;
+        export { id_1 as id };
+        let description_1: string;
+        export { description_1 as description };
+        let defaultMessage_1: string;
+        export { defaultMessage_1 as defaultMessage };
+    }
+    export namespace emailsOn {
+        let id_2: string;
+        export { id_2 as id };
+        let description_2: string;
+        export { description_2 as description };
+        let defaultMessage_2: string;
+        export { defaultMessage_2 as defaultMessage };
+    }
+    export namespace description_3 {
+        let id_3: string;
+        export { id_3 as id };
+        let description_4: string;
+        export { description_4 as description };
+        let defaultMessage_3: string;
+        export { defaultMessage_3 as defaultMessage };
+    }
+    export { description_3 as description };
+    export namespace nevermind {
+        let id_4: string;
+        export { id_4 as id };
+        let description_5: string;
+        export { description_5 as description };
+        let defaultMessage_4: string;
+        export { defaultMessage_4 as defaultMessage };
+    }
+    export namespace save {
+        let id_5: string;
+        export { id_5 as id };
+        let description_6: string;
+        export { description_6 as description };
+        let defaultMessage_5: string;
+        export { defaultMessage_5 as defaultMessage };
+    }
+}

package/dist/containers/EmailSettingsModal/messages.js

@@ -0,0 +1,35 @@
+import { defineMessages } from '@openedx/frontend-base';
+const messages = defineMessages({
+    header: {
+        id: 'learner-dash.emailSettings.header',
+        description: 'Header for email settings modal',
+        defaultMessage: 'Receive course emails?',
+    },
+    emailsOff: {
+        id: 'learner-dash.emailSettings.emailsOff',
+        description: 'Toggle text for email settings modal when email is disabled',
+        defaultMessage: 'Course emails are off',
+    },
+    emailsOn: {
+        id: 'learner-dash.emailSettings.emailsOn',
+        description: 'Toggle text for email settings modal when email is enabled',
+        defaultMessage: 'Course emails are on',
+    },
+    description: {
+        id: 'learner-dash.emailSettings.description',
+        description: 'Description for email settings modal',
+        defaultMessage: 'Course emails include important information about your course from instructors.',
+    },
+    nevermind: {
+        id: 'learner-dash.emailSettings.nevermind',
+        description: 'Cancel action for email settings modal',
+        defaultMessage: 'Never mind',
+    },
+    save: {
+        id: 'learner-dash.emailSettings.save',
+        description: 'Save action for email settings modal',
+        defaultMessage: 'Save settings',
+    },
+});
+export default messages;
+//# sourceMappingURL=messages.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../src/containers/EmailSettingsModal/messages.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,MAAM,EAAE;QACN,EAAE,EAAE,mCAAmC;QACvC,WAAW,EAAE,iCAAiC;QAC9C,cAAc,EAAE,wBAAwB;KACzC;IACD,SAAS,EAAE;QACT,EAAE,EAAE,sCAAsC;QAC1C,WAAW,EAAE,6DAA6D;QAC1E,cAAc,EAAE,uBAAuB;KACxC;IACD,QAAQ,EAAE;QACR,EAAE,EAAE,qCAAqC;QACzC,WAAW,EAAE,4DAA4D;QACzE,cAAc,EAAE,sBAAsB;KACvC;IACD,WAAW,EAAE;QACX,EAAE,EAAE,wCAAwC;QAC5C,WAAW,EAAE,sCAAsC;QACnD,cAAc,EAAE,iFAAiF;KAClG;IACD,SAAS,EAAE;QACT,EAAE,EAAE,sCAAsC;QAC1C,WAAW,EAAE,wCAAwC;QACrD,cAAc,EAAE,YAAY;KAC7B;IACD,IAAI,EAAE;QACJ,EAAE,EAAE,iCAAiC;QACrC,WAAW,EAAE,sCAAsC;QACnD,cAAc,EAAE,eAAe;KAChC;CAEF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  header: {\n    id: 'learner-dash.emailSettings.header',\n    description: 'Header for email settings modal',\n    defaultMessage: 'Receive course emails?',\n  },\n  emailsOff: {\n    id: 'learner-dash.emailSettings.emailsOff',\n    description: 'Toggle text for email settings modal when email is disabled',\n    defaultMessage: 'Course emails are off',\n  },\n  emailsOn: {\n    id: 'learner-dash.emailSettings.emailsOn',\n    description: 'Toggle text for email settings modal when email is enabled',\n    defaultMessage: 'Course emails are on',\n  },\n  description: {\n    id: 'learner-dash.emailSettings.description',\n    description: 'Description for email settings modal',\n    defaultMessage: 'Course emails include important information about your course from instructors.',\n  },\n  nevermind: {\n    id: 'learner-dash.emailSettings.nevermind',\n    description: 'Cancel action for email settings modal',\n    defaultMessage: 'Never mind',\n  },\n  save: {\n    id: 'learner-dash.emailSettings.save',\n    description: 'Save action for email settings modal',\n    defaultMessage: 'Save settings',\n  },\n\n});\n\nexport default messages;\n"]}

package/dist/containers/RelatedProgramsModal/components/ProgramCard.d.ts

@@ -0,0 +1,19 @@
+export function whiteFontWrapper(node: any): import("react/jsx-runtime").JSX.Element;
+export function ProgramCard({ data }: {
+    data: any;
+}): import("react/jsx-runtime").JSX.Element;
+export namespace ProgramCard {
+    namespace propTypes {
+        let data: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
+            bannerImgSrc: PropTypes.Requireable<string>;
+            logoImgSrc: PropTypes.Requireable<string>;
+            numberOfCourses: PropTypes.Requireable<number>;
+            programType: PropTypes.Requireable<string>;
+            programUrl: PropTypes.Requireable<string>;
+            provider: PropTypes.Requireable<string>;
+            title: PropTypes.Requireable<string>;
+        }>>>;
+    }
+}
+export default ProgramCard;
+import PropTypes from 'prop-types';

package/dist/containers/RelatedProgramsModal/components/ProgramCard.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useIntl } from '@openedx/frontend-base';
+import { Badge, Card, 
+// Hyperlink,
+Icon, } from '@openedx/paragon';
+import { Program } from '@openedx/paragon/icons';
+import messages from './messages';
+import './index.scss';
+export const whiteFontWrapper = (node) => (_jsx("span", { className: "text-white", children: node }));
+export const ProgramCard = ({ data }) => {
+    const { formatMessage } = useIntl();
+    const numCoursesMessage = formatMessage(messages.courses, { numCourses: data.numberOfCourses });
+    return (_jsxs(Card, { className: "program-card mx-auto bg-primary-500 text-white mb-3.5 pb-3.5", style: { width: '18rem', color: 'white' }, as: "a", href: data.programUrl, isClickable: true, children: [_jsx(Card.ImageCap, { className: "program-card-banner", src: data.bannerImgSrc, srcAlt: formatMessage(messages.bannerAlt), logoSrc: data.logoImgSrc, logoAlt: formatMessage(messages.logoAlt, { provider: data.provider }) }), _jsx(Card.Header, { title: whiteFontWrapper(data.title), subtitle: whiteFontWrapper(data.provider) }), _jsxs("div", { className: "ml-4", children: [_jsxs(Badge, { variant: "light", className: "program-type-badge", children: [_jsx(Icon, { src: Program, className: "d-inline-block" }), " ", data.programType] }), _jsx("div", { className: "program-summary mt-2", children: numCoursesMessage })] })] }));
+};
+ProgramCard.propTypes = {
+    data: PropTypes.shape({
+        bannerImgSrc: PropTypes.string,
+        logoImgSrc: PropTypes.string,
+        numberOfCourses: PropTypes.number,
+        programType: PropTypes.string,
+        programUrl: PropTypes.string,
+        provider: PropTypes.string,
+        title: PropTypes.string,
+    }).isRequired,
+};
+export default ProgramCard;
+//# sourceMappingURL=ProgramCard.js.map

package/dist/containers/RelatedProgramsModal/components/ProgramCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgramCard.js","sourceRoot":"","sources":["../../../../src/containers/RelatedProgramsModal/components/ProgramCard.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EACL,KAAK,EACL,IAAI;AACJ,aAAa;AACb,IAAI,GACL,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,cAAc,CAAC;AAEtB,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,eAAM,SAAS,EAAC,YAAY,YAAE,IAAI,GAAQ,CAAC,CAAC;AAEvF,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IACtC,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,iBAAiB,GAAG,aAAa,CACrC,QAAQ,CAAC,OAAO,EAChB,EAAE,UAAU,EAAE,IAAI,CAAC,eAAe,EAAE,CACrC,CAAC;IACF,OAAO,CACL,MAAC,IAAI,IACH,SAAS,EAAC,8DAA8D,EACxE,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,EACzC,EAAE,EAAC,GAAG,EACN,IAAI,EAAE,IAAI,CAAC,UAAU,EACrB,WAAW,mBAEX,KAAC,IAAI,CAAC,QAAQ,IACZ,SAAS,EAAC,qBAAqB,EAC/B,GAAG,EAAE,IAAI,CAAC,YAAY,EACtB,MAAM,EAAE,aAAa,CAAC,QAAQ,CAAC,SAAS,CAAC,EACzC,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,OAAO,EAAE,aAAa,CAAC,QAAQ,CAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,GACrE,EACF,KAAC,IAAI,CAAC,MAAM,IACV,KAAK,EAAE,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,EACnC,QAAQ,EAAE,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,GACzC,EACF,eAAK,SAAS,EAAC,MAAM,aACnB,MAAC,KAAK,IAAC,OAAO,EAAC,OAAO,EAAC,SAAS,EAAC,oBAAoB,aACnD,KAAC,IAAI,IAAC,GAAG,EAAE,OAAO,EAAE,SAAS,EAAC,gBAAgB,GAAG,OAAE,IAAI,CAAC,WAAW,IAC7D,EACR,cAAK,SAAS,EAAC,sBAAsB,YAClC,iBAAiB,GACd,IACF,IACD,CACR,CAAC;AACJ,CAAC,CAAC;AACF,WAAW,CAAC,SAAS,GAAG;IACtB,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC;QACpB,YAAY,EAAE,SAAS,CAAC,MAAM;QAC9B,UAAU,EAAE,SAAS,CAAC,MAAM;QAC5B,eAAe,EAAE,SAAS,CAAC,MAAM;QACjC,WAAW,EAAE,SAAS,CAAC,MAAM;QAC7B,UAAU,EAAE,SAAS,CAAC,MAAM;QAC5B,QAAQ,EAAE,SAAS,CAAC,MAAM;QAC1B,KAAK,EAAE,SAAS,CAAC,MAAM;KACxB,CAAC,CAAC,UAAU;CACd,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { useIntl } from '@openedx/frontend-base';\nimport {\n  Badge,\n  Card,\n  // Hyperlink,\n  Icon,\n} from '@openedx/paragon';\nimport { Program } from '@openedx/paragon/icons';\n\nimport messages from './messages';\nimport './index.scss';\n\nexport const whiteFontWrapper = (node) => (<span className=\"text-white\">{node}</span>);\n\nexport const ProgramCard = ({ data }) => {\n  const { formatMessage } = useIntl();\n  const numCoursesMessage = formatMessage(\n    messages.courses,\n    { numCourses: data.numberOfCourses },\n  );\n  return (\n    <Card\n      className=\"program-card mx-auto bg-primary-500 text-white mb-3.5 pb-3.5\"\n      style={{ width: '18rem', color: 'white' }}\n      as=\"a\"\n      href={data.programUrl}\n      isClickable\n    >\n      <Card.ImageCap\n        className=\"program-card-banner\"\n        src={data.bannerImgSrc}\n        srcAlt={formatMessage(messages.bannerAlt)}\n        logoSrc={data.logoImgSrc}\n        logoAlt={formatMessage(messages.logoAlt, { provider: data.provider })}\n      />\n      <Card.Header\n        title={whiteFontWrapper(data.title)}\n        subtitle={whiteFontWrapper(data.provider)}\n      />\n      <div className=\"ml-4\">\n        <Badge variant=\"light\" className=\"program-type-badge\">\n          <Icon src={Program} className=\"d-inline-block\" /> {data.programType}\n        </Badge>\n        <div className=\"program-summary mt-2\">\n          {numCoursesMessage}\n        </div>\n      </div>\n    </Card>\n  );\n};\nProgramCard.propTypes = {\n  data: PropTypes.shape({\n    bannerImgSrc: PropTypes.string,\n    logoImgSrc: PropTypes.string,\n    numberOfCourses: PropTypes.number,\n    programType: PropTypes.string,\n    programUrl: PropTypes.string,\n    provider: PropTypes.string,\n    title: PropTypes.string,\n  }).isRequired,\n};\n\nexport default ProgramCard;\n"]}

package/dist/containers/RelatedProgramsModal/components/index.scss

@@ -0,0 +1,23 @@
+.program-card {
+  color: white !important;
+  .program-card-banner {
+    .pgn__card-image-cap {
+      height: 6rem;
+    }
+  }
+  .program-type-badge {
+    text-align: left;
+    height: 24px;
+    width: 195px;
+    font-size: .75rem;
+    vertical-align: center;
+    .pgn__icon {
+      width: .75rem !important;
+      height: .75rem !important;
+    }
+  }
+  .program-summary {
+    font-size: .75rem;
+    line-height: 1.25rem;
+  }
+}

package/dist/containers/RelatedProgramsModal/components/messages.d.ts

@@ -0,0 +1,32 @@
+export namespace messages {
+    namespace courses {
+        let id: string;
+        let defaultMessage: string;
+        let description: string;
+    }
+    namespace duration {
+        let id_1: string;
+        export { id_1 as id };
+        let defaultMessage_1: string;
+        export { defaultMessage_1 as defaultMessage };
+        let description_1: string;
+        export { description_1 as description };
+    }
+    namespace logoAlt {
+        let id_2: string;
+        export { id_2 as id };
+        let defaultMessage_2: string;
+        export { defaultMessage_2 as defaultMessage };
+        let description_2: string;
+        export { description_2 as description };
+    }
+    namespace bannerAlt {
+        let id_3: string;
+        export { id_3 as id };
+        let defaultMessage_3: string;
+        export { defaultMessage_3 as defaultMessage };
+        let description_3: string;
+        export { description_3 as description };
+    }
+}
+export default messages;

package/dist/containers/RelatedProgramsModal/components/messages.js

@@ -0,0 +1,24 @@
+export const messages = {
+    courses: {
+        id: 'learnerDashboard.programCard.courses',
+        defaultMessage: '{numCourses} Courses',
+        description: 'Number of courses in a program, displayed at the bottom of program card',
+    },
+    duration: {
+        id: 'learnerDashboard.programCard.duration',
+        defaultMessage: '{numWeeks} Weeks',
+        description: 'Number of weeks in a program, displayed at the bottom of program card',
+    },
+    logoAlt: {
+        id: 'learnerDashboard.programCard.logoAlt',
+        defaultMessage: '{provider} logo',
+        description: 'Program provider logo alt-text',
+    },
+    bannerAlt: {
+        id: 'learnerDashboard.programCard.bannerAlt',
+        defaultMessage: '',
+        description: 'Program banner image alt-text',
+    },
+};
+export default messages;
+//# sourceMappingURL=messages.js.map

package/dist/containers/RelatedProgramsModal/components/messages.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../../src/containers/RelatedProgramsModal/components/messages.js"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,OAAO,EAAE;QACP,EAAE,EAAE,sCAAsC;QAC1C,cAAc,EAAE,sBAAsB;QACtC,WAAW,EAAE,yEAAyE;KACvF;IACD,QAAQ,EAAE;QACR,EAAE,EAAE,uCAAuC;QAC3C,cAAc,EAAE,kBAAkB;QAClC,WAAW,EAAE,uEAAuE;KACrF;IACD,OAAO,EAAE;QACP,EAAE,EAAE,sCAAsC;QAC1C,cAAc,EAAE,iBAAiB;QACjC,WAAW,EAAE,gCAAgC;KAC9C;IACD,SAAS,EAAE;QACT,EAAE,EAAE,wCAAwC;QAC5C,cAAc,EAAE,EAAE;QAClB,WAAW,EAAE,+BAA+B;KAC7C;CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["export const messages = {\n  courses: {\n    id: 'learnerDashboard.programCard.courses',\n    defaultMessage: '{numCourses} Courses',\n    description: 'Number of courses in a program, displayed at the bottom of program card',\n  },\n  duration: {\n    id: 'learnerDashboard.programCard.duration',\n    defaultMessage: '{numWeeks} Weeks',\n    description: 'Number of weeks in a program, displayed at the bottom of program card',\n  },\n  logoAlt: {\n    id: 'learnerDashboard.programCard.logoAlt',\n    defaultMessage: '{provider} logo',\n    description: 'Program provider logo alt-text',\n  },\n  bannerAlt: {\n    id: 'learnerDashboard.programCard.bannerAlt',\n    defaultMessage: '',\n    description: 'Program banner image alt-text',\n  },\n};\n\nexport default messages;\n"]}

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

@@ -0,0 +1,14 @@
+export function RelatedProgramsModal({ isOpen, closeModal, cardId, }: {
+    isOpen: any;
+    closeModal: any;
+    cardId: any;
+}): import("react/jsx-runtime").JSX.Element;
+export namespace RelatedProgramsModal {
+    namespace propTypes {
+        let isOpen: PropTypes.Validator<boolean>;
+        let closeModal: PropTypes.Validator<(...args: any[]) => any>;
+        let cardId: PropTypes.Validator<string>;
+    }
+}
+export default RelatedProgramsModal;
+import PropTypes from 'prop-types';

package/dist/containers/RelatedProgramsModal/index.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable quotes */
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useIntl } from '@openedx/frontend-base';
+import { Container, Row, Col, ModalDialog, } from '@openedx/paragon';
+import { useCourseData } from '../../hooks';
+import ProgramCard from './components/ProgramCard';
+import messages from './messages';
+import './index.scss';
+export const RelatedProgramsModal = ({ isOpen, closeModal, cardId, }) => {
+    var _a, _b;
+    const { formatMessage } = useIntl();
+    const courseData = useCourseData(cardId);
+    const courseName = (_a = courseData === null || courseData === void 0 ? void 0 : courseData.course) === null || _a === void 0 ? void 0 : _a.courseName;
+    const relatedPrograms = ((_b = courseData === null || courseData === void 0 ? void 0 : courseData.programs) === null || _b === void 0 ? void 0 : _b.relatedPrograms) || [];
+    return (_jsxs(ModalDialog, { title: formatMessage(messages.header), isOpen: isOpen, onClose: closeModal, hasCloseButton: true, isFullscreenOnMobile: true, size: "lg", className: "related-programs-modal p-4", "data-testid": "RelatedProgramsModal", children: [_jsx(ModalDialog.Header, { className: "programs-title m-0 p-0", as: "h3", "aria-level": 2, children: formatMessage(messages.header) }), _jsx(ModalDialog.Header, { as: "h4", className: "programs-header p-0", children: courseName }), _jsxs(ModalDialog.Body, { className: "pl-0 overflow-scroll", children: [_jsx("p", { children: formatMessage(messages.description) }), _jsx(Container, { children: _jsx(Row, { children: relatedPrograms.map((programData) => (_jsx(Col, { lg: 6, sm: 12, children: _jsx(ProgramCard, { data: programData }) }, programData.programUrl))) }) })] })] }));
+};
+RelatedProgramsModal.propTypes = {
+    isOpen: PropTypes.bool.isRequired,
+    closeModal: PropTypes.func.isRequired,
+    cardId: PropTypes.string.isRequired,
+};
+export default RelatedProgramsModal;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/containers/RelatedProgramsModal/index.jsx"],"names":[],"mappings":";AAAA,2BAA2B;AAC3B,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EACL,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,WAAW,GACjC,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,cAAc,CAAC;AAEtB,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EACnC,MAAM,EACN,UAAU,EACV,MAAM,GACP,EAAE,EAAE;;IACH,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IACzC,MAAM,UAAU,GAAG,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,MAAM,0CAAE,UAAU,CAAC;IAClD,MAAM,eAAe,GAAG,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,QAAQ,0CAAE,eAAe,KAAI,EAAE,CAAC;IACpE,OAAO,CACL,MAAC,WAAW,IACV,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,EACrC,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,UAAU,EACnB,cAAc,QACd,oBAAoB,QACpB,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,4BAA4B,iBAC1B,sBAAsB,aAElC,KAAC,WAAW,CAAC,MAAM,IAAC,SAAS,EAAC,wBAAwB,EAAC,EAAE,EAAC,IAAI,gBAAa,CAAC,YACzE,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,GACZ,EACrB,KAAC,WAAW,CAAC,MAAM,IAAC,EAAE,EAAC,IAAI,EAAC,SAAS,EAAC,qBAAqB,YACxD,UAAU,GACQ,EACrB,MAAC,WAAW,CAAC,IAAI,IAAC,SAAS,EAAC,sBAAsB,aAChD,sBAAI,aAAa,CAAC,QAAQ,CAAC,WAAW,CAAC,GAAK,EAC5C,KAAC,SAAS,cACR,KAAC,GAAG,cACD,eAAe,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,CACpC,KAAC,GAAG,IAA8B,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,YAC7C,KAAC,WAAW,IAAC,IAAI,EAAE,WAAW,GAAI,IAD1B,WAAW,CAAC,UAAU,CAE1B,CACP,CAAC,GACE,GACI,IACK,IACP,CACf,CAAC;AACJ,CAAC,CAAC;AACF,oBAAoB,CAAC,SAAS,GAAG;IAC/B,MAAM,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;IACjC,UAAU,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;IACrC,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC,UAAU;CACpC,CAAC;AAEF,eAAe,oBAAoB,CAAC","sourcesContent":["/* eslint-disable quotes */\nimport React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { useIntl } from '@openedx/frontend-base';\nimport {\n  Container, Row, Col, ModalDialog,\n} from '@openedx/paragon';\n\nimport { useCourseData } from '@src/hooks';\nimport ProgramCard from './components/ProgramCard';\nimport messages from './messages';\nimport './index.scss';\n\nexport const RelatedProgramsModal = ({\n  isOpen,\n  closeModal,\n  cardId,\n}) => {\n  const { formatMessage } = useIntl();\n  const courseData = useCourseData(cardId);\n  const courseName = courseData?.course?.courseName;\n  const relatedPrograms = courseData?.programs?.relatedPrograms || [];\n  return (\n    <ModalDialog\n      title={formatMessage(messages.header)}\n      isOpen={isOpen}\n      onClose={closeModal}\n      hasCloseButton\n      isFullscreenOnMobile\n      size=\"lg\"\n      className=\"related-programs-modal p-4\"\n      data-testid=\"RelatedProgramsModal\"\n    >\n      <ModalDialog.Header className=\"programs-title m-0 p-0\" as=\"h3\" aria-level={2}>\n        {formatMessage(messages.header)}\n      </ModalDialog.Header>\n      <ModalDialog.Header as=\"h4\" className=\"programs-header p-0\">\n        {courseName}\n      </ModalDialog.Header>\n      <ModalDialog.Body className=\"pl-0 overflow-scroll\">\n        <p>{formatMessage(messages.description)}</p>\n        <Container>\n          <Row>\n            {relatedPrograms.map((programData) => (\n              <Col key={programData.programUrl} lg={6} sm={12}>\n                <ProgramCard data={programData} />\n              </Col>\n            ))}\n          </Row>\n        </Container>\n      </ModalDialog.Body>\n    </ModalDialog>\n  );\n};\nRelatedProgramsModal.propTypes = {\n  isOpen: PropTypes.bool.isRequired,\n  closeModal: PropTypes.func.isRequired,\n  cardId: PropTypes.string.isRequired,\n};\n\nexport default RelatedProgramsModal;\n"]}

package/dist/containers/RelatedProgramsModal/index.scss

@@ -0,0 +1,5 @@
+.related-programs-modal {
+  .programs-title {
+    font-size: 1.5rem;
+  }
+}

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

@@ -0,0 +1,17 @@
+export default messages;
+declare namespace messages {
+    export namespace header {
+        let id: string;
+        let description: string;
+        let defaultMessage: string;
+    }
+    export namespace description_1 {
+        let id_1: string;
+        export { id_1 as id };
+        let description_2: string;
+        export { description_2 as description };
+        let defaultMessage_1: string;
+        export { defaultMessage_1 as defaultMessage };
+    }
+    export { description_1 as description };
+}

package/dist/containers/RelatedProgramsModal/messages.js

@@ -0,0 +1,15 @@
+import { defineMessages } from '@openedx/frontend-base';
+const messages = defineMessages({
+    header: {
+        id: 'learner-dash.relatedPrograms.header',
+        description: 'Header for related settings modal',
+        defaultMessage: 'Related Programs',
+    },
+    description: {
+        id: 'learner-dash.relatedPrograms.description',
+        description: 'Description for related settings modal',
+        defaultMessage: `Are you looking to expand your knowledge?  Enrolling in a Program lets you take a series of courses in the subject that you're interested in`,
+    },
+});
+export default messages;
+//# sourceMappingURL=messages.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../src/containers/RelatedProgramsModal/messages.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,MAAM,EAAE;QACN,EAAE,EAAE,qCAAqC;QACzC,WAAW,EAAE,mCAAmC;QAChD,cAAc,EAAE,kBAAkB;KACnC;IACD,WAAW,EAAE;QACX,EAAE,EAAE,0CAA0C;QAC9C,WAAW,EAAE,wCAAwC;QACrD,cAAc,EAAE,8IAA8I;KAC/J;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  header: {\n    id: 'learner-dash.relatedPrograms.header',\n    description: 'Header for related settings modal',\n    defaultMessage: 'Related Programs',\n  },\n  description: {\n    id: 'learner-dash.relatedPrograms.description',\n    description: 'Description for related settings modal',\n    defaultMessage: `Are you looking to expand your knowledge?  Enrolling in a Program lets you take a series of courses in the subject that you're interested in`,\n  },\n});\n\nexport default messages;\n"]}

package/dist/containers/SelectSessionModal/constants.d.ts

@@ -0,0 +1 @@
+export const LEAVE_OPTION: "leave";

package/dist/containers/SelectSessionModal/constants.js

@@ -0,0 +1,2 @@
+export const LEAVE_OPTION = 'leave';
+//# sourceMappingURL=constants.js.map

package/dist/containers/SelectSessionModal/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../src/containers/SelectSessionModal/constants.js"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,YAAY,GAAG,OAAO,CAAC","sourcesContent":["export const LEAVE_OPTION = 'leave';\n"]}

package/dist/containers/SelectSessionModal/hooks.d.ts

@@ -0,0 +1,17 @@
+export const state: any;
+export function useSelectSessionModalData(): {
+    showModal: boolean;
+    closeSessionModal: () => void;
+    showLeaveOption: any;
+    availableSessions: any;
+    hint: string;
+    header: string;
+    selectedSession: any;
+    handleSelection: ({ target: { value } }: {
+        target: {
+            value: any;
+        };
+    }) => any;
+    handleSubmit: () => void;
+};
+export default module.useSelectSessionModalData;

package/dist/containers/SelectSessionModal/hooks.js

@@ -0,0 +1,76 @@
+import React, { useMemo } from 'react';
+import { useIntl } from '@openedx/frontend-base';
+import { StrictDict } from '../../utils';
+import track from '../../tracking';
+import { useCourseData } from '../../hooks';
+import { useDeleteEntitlementEnrollment, useUpdateEntitlementEnrollment } from '../../data/hooks';
+import { useSelectSessionModal } from '../../data/context';
+import { LEAVE_OPTION } from './constants';
+import messages from './messages';
+import * as module from './hooks';
+export const state = StrictDict({
+    selectedSession: (val) => React.useState(val), // eslint-disable-line
+});
+export const useSelectSessionModalData = () => {
+    const { formatMessage } = useIntl();
+    const { selectSessionModal, closeSelectSessionModal: closeSessionModal } = useSelectSessionModal();
+    const selectedCardId = selectSessionModal.cardId;
+    const courseData = useCourseData(selectedCardId);
+    const { availableSessions, isFulfilled, courseTitle, courseId, isEnrolled, uuid, isRefundable, } = useMemo(() => {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        return ({
+            availableSessions: ((_a = courseData === null || courseData === void 0 ? void 0 : courseData.entitlement) === null || _a === void 0 ? void 0 : _a.availableSessions) || [],
+            isFulfilled: ((_b = courseData === null || courseData === void 0 ? void 0 : courseData.entitlement) === null || _b === void 0 ? void 0 : _b.isFulfilled) || false,
+            courseTitle: ((_c = courseData === null || courseData === void 0 ? void 0 : courseData.course) === null || _c === void 0 ? void 0 : _c.title) || ((_d = courseData === null || courseData === void 0 ? void 0 : courseData.course) === null || _d === void 0 ? void 0 : _d.courseName) || '',
+            courseId: ((_e = courseData === null || courseData === void 0 ? void 0 : courseData.courseRun) === null || _e === void 0 ? void 0 : _e.courseId) || null,
+            isEnrolled: ((_f = courseData === null || courseData === void 0 ? void 0 : courseData.enrollment) === null || _f === void 0 ? void 0 : _f.isEnrolled) || false,
+            uuid: ((_g = courseData === null || courseData === void 0 ? void 0 : courseData.entitlement) === null || _g === void 0 ? void 0 : _g.uuid) || null,
+            isRefundable: ((_h = courseData === null || courseData === void 0 ? void 0 : courseData.entitlement) === null || _h === void 0 ? void 0 : _h.isRefundable) || false,
+        });
+    }, [courseData]);
+    const { mutate: leaveEntitlement } = useDeleteEntitlementEnrollment();
+    const { mutate: switchEntitlementMutation } = useUpdateEntitlementEnrollment();
+    const [selectedSession, setSelectedSession] = module.state.selectedSession(courseId || null);
+    let header;
+    let hint;
+    if (isFulfilled) {
+        header = formatMessage(messages.changeOrLeaveHeader);
+        hint = formatMessage(messages.changeOrLeaveHint);
+    }
+    else {
+        header = formatMessage(messages.selectSessionHeader, { courseTitle });
+        hint = formatMessage(messages.selectSessionHint);
+    }
+    const trackNewSession = track.entitlements.newSession(selectedSession);
+    const trackSwitchSession = track.entitlements.switchSession(selectedCardId, selectedSession);
+    const trackLeaveSession = track.entitlements.leaveSession(selectedCardId);
+    const handleSelection = ({ target: { value } }) => setSelectedSession(value);
+    const handleSubmit = () => {
+        const onSuccess = () => closeSessionModal();
+        if (selectedSession === LEAVE_OPTION) {
+            trackLeaveSession();
+            leaveEntitlement({ uuid, isRefundable }, { onSuccess });
+        }
+        else if (isEnrolled) {
+            trackSwitchSession();
+            switchEntitlementMutation({ uuid, courseId: selectedSession }, { onSuccess });
+        }
+        else {
+            trackNewSession();
+            switchEntitlementMutation({ uuid, courseId: selectedSession }, { onSuccess });
+        }
+    };
+    return {
+        showModal: selectedCardId != null,
+        closeSessionModal,
+        showLeaveOption: isFulfilled,
+        availableSessions,
+        hint,
+        header,
+        selectedSession,
+        handleSelection,
+        handleSubmit,
+    };
+};
+export default useSelectSessionModalData;
+//# sourceMappingURL=hooks.js.map

package/dist/containers/SelectSessionModal/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../../../src/containers/SelectSessionModal/hooks.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC,OAAO,KAAK,MAAM,eAAe,CAAC;AAElC,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,8BAA8B,EAAE,8BAA8B,EAAE,MAAM,iBAAiB,CAAC;AACjG,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC3C,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,KAAK,MAAM,MAAM,SAAS,CAAC;AAElC,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAAC;IAC9B,eAAe,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,sBAAsB;CACtE,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,yBAAyB,GAAG,GAAG,EAAE;IAC5C,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,EAAE,kBAAkB,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,GAAG,qBAAqB,EAAE,CAAC;IACnG,MAAM,cAAc,GAAG,kBAAkB,CAAC,MAAM,CAAC;IACjD,MAAM,UAAU,GAAG,aAAa,CAAC,cAAc,CAAC,CAAC;IACjD,MAAM,EACJ,iBAAiB,EACjB,WAAW,EACX,WAAW,EACX,QAAQ,EACR,UAAU,EACV,IAAI,EACJ,YAAY,GACb,GAAG,OAAO,CAAC,GAAG,EAAE;;QAAC,OAAA,CAAC;YACjB,iBAAiB,EAAE,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,WAAW,0CAAE,iBAAiB,KAAI,EAAE;YACnE,WAAW,EAAE,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,WAAW,0CAAE,WAAW,KAAI,KAAK;YAC1D,WAAW,EAAE,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,MAAM,0CAAE,KAAK,MAAI,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,MAAM,0CAAE,UAAU,CAAA,IAAI,EAAE;YAC9E,QAAQ,EAAE,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,0CAAE,QAAQ,KAAI,IAAI;YACjD,UAAU,EAAE,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,0CAAE,UAAU,KAAI,KAAK;YACvD,IAAI,EAAE,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,WAAW,0CAAE,IAAI,KAAI,IAAI;YAC3C,YAAY,EAAE,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,WAAW,0CAAE,YAAY,KAAI,KAAK;SAC7D,CAAC,CAAA;KAAA,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAClB,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,GAAG,8BAA8B,EAAE,CAAC;IACtE,MAAM,EAAE,MAAM,EAAE,yBAAyB,EAAE,GAAG,8BAA8B,EAAE,CAAC;IAE/E,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,eAAe,CAAC,QAAQ,IAAI,IAAI,CAAC,CAAC;IAE7F,IAAI,MAAM,CAAC;IACX,IAAI,IAAI,CAAC;IACT,IAAI,WAAW,EAAE,CAAC;QAChB,MAAM,GAAG,aAAa,CAAC,QAAQ,CAAC,mBAAmB,CAAC,CAAC;QACrD,IAAI,GAAG,aAAa,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IACnD,CAAC;SAAM,CAAC;QACN,MAAM,GAAG,aAAa,CAAC,QAAQ,CAAC,mBAAmB,EAAE,EAAE,WAAW,EAAE,CAAC,CAAC;QACtE,IAAI,GAAG,aAAa,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IACnD,CAAC;IAED,MAAM,eAAe,GAAG,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC;IACvE,MAAM,kBAAkB,GAAG,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;IAC7F,MAAM,iBAAiB,GAAG,KAAK,CAAC,YAAY,CAAC,YAAY,CAAC,cAAc,CAAC,CAAC;IAE1E,MAAM,eAAe,GAAG,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAC7E,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,iBAAiB,EAAE,CAAC;QAC5C,IAAI,eAAe,KAAK,YAAY,EAAE,CAAC;YACrC,iBAAiB,EAAE,CAAC;YACpB,gBAAgB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC;QAC1D,CAAC;aAAM,IAAI,UAAU,EAAE,CAAC;YACtB,kBAAkB,EAAE,CAAC;YACrB,yBAAyB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,eAAe,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC;QAChF,CAAC;aAAM,CAAC;YACN,eAAe,EAAE,CAAC;YAClB,yBAAyB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,eAAe,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC;QAChF,CAAC;IACH,CAAC,CAAC;IAEF,OAAO;QACL,SAAS,EAAE,cAAc,IAAI,IAAI;QACjC,iBAAiB;QACjB,eAAe,EAAE,WAAW;QAC5B,iBAAiB;QACjB,IAAI;QACJ,MAAM;QACN,eAAe;QACf,eAAe;QACf,YAAY;KACb,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,yBAAyB,CAAC","sourcesContent":["import React, { useMemo } from 'react';\n\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { StrictDict } from '@src/utils';\n\nimport track from '@src/tracking';\n\nimport { useCourseData } from '@src/hooks';\nimport { useDeleteEntitlementEnrollment, useUpdateEntitlementEnrollment } from '@src/data/hooks';\nimport { useSelectSessionModal } from '@src/data/context';\nimport { LEAVE_OPTION } from './constants';\nimport messages from './messages';\nimport * as module from './hooks';\n\nexport const state = StrictDict({\n  selectedSession: (val) => React.useState(val), // eslint-disable-line\n});\n\nexport const useSelectSessionModalData = () => {\n  const { formatMessage } = useIntl();\n  const { selectSessionModal, closeSelectSessionModal: closeSessionModal } = useSelectSessionModal();\n  const selectedCardId = selectSessionModal.cardId;\n  const courseData = useCourseData(selectedCardId);\n  const {\n    availableSessions,\n    isFulfilled,\n    courseTitle,\n    courseId,\n    isEnrolled,\n    uuid,\n    isRefundable,\n  } = useMemo(() => ({\n    availableSessions: courseData?.entitlement?.availableSessions || [],\n    isFulfilled: courseData?.entitlement?.isFulfilled || false,\n    courseTitle: courseData?.course?.title || courseData?.course?.courseName || '',\n    courseId: courseData?.courseRun?.courseId || null,\n    isEnrolled: courseData?.enrollment?.isEnrolled || false,\n    uuid: courseData?.entitlement?.uuid || null,\n    isRefundable: courseData?.entitlement?.isRefundable || false,\n  }), [courseData]);\n  const { mutate: leaveEntitlement } = useDeleteEntitlementEnrollment();\n  const { mutate: switchEntitlementMutation } = useUpdateEntitlementEnrollment();\n\n  const [selectedSession, setSelectedSession] = module.state.selectedSession(courseId || null);\n\n  let header;\n  let hint;\n  if (isFulfilled) {\n    header = formatMessage(messages.changeOrLeaveHeader);\n    hint = formatMessage(messages.changeOrLeaveHint);\n  } else {\n    header = formatMessage(messages.selectSessionHeader, { courseTitle });\n    hint = formatMessage(messages.selectSessionHint);\n  }\n\n  const trackNewSession = track.entitlements.newSession(selectedSession);\n  const trackSwitchSession = track.entitlements.switchSession(selectedCardId, selectedSession);\n  const trackLeaveSession = track.entitlements.leaveSession(selectedCardId);\n\n  const handleSelection = ({ target: { value } }) => setSelectedSession(value);\n  const handleSubmit = () => {\n    const onSuccess = () => closeSessionModal();\n    if (selectedSession === LEAVE_OPTION) {\n      trackLeaveSession();\n      leaveEntitlement({ uuid, isRefundable }, { onSuccess });\n    } else if (isEnrolled) {\n      trackSwitchSession();\n      switchEntitlementMutation({ uuid, courseId: selectedSession }, { onSuccess });\n    } else {\n      trackNewSession();\n      switchEntitlementMutation({ uuid, courseId: selectedSession }, { onSuccess });\n    }\n  };\n\n  return {\n    showModal: selectedCardId != null,\n    closeSessionModal,\n    showLeaveOption: isFulfilled,\n    availableSessions,\n    hint,\n    header,\n    selectedSession,\n    handleSelection,\n    handleSubmit,\n  };\n};\n\nexport default useSelectSessionModalData;\n"]}

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

@@ -0,0 +1,2 @@
+export function SelectSessionModal(): import("react/jsx-runtime").JSX.Element;
+export default SelectSessionModal;

package/dist/containers/SelectSessionModal/index.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { useIntl } from '@openedx/frontend-base';
+import { ActionRow, Button, Form, ModalDialog, } from '@openedx/paragon';
+import { utilHooks } from '../../hooks';
+import { nullMethod, dateFormatter } from '../../utils';
+import useSelectSessionModalData from './hooks';
+import { LEAVE_OPTION } from './constants';
+import messages from './messages';
+export const SelectSessionModal = () => {
+    const { availableSessions, showModal, closeSessionModal, showLeaveOption, handleSelection, handleSubmit, header, hint, selectedSession, } = useSelectSessionModalData();
+    const formatDate = utilHooks.useFormatDate();
+    const { formatMessage } = useIntl();
+    return (_jsxs(ModalDialog, { isOpen: showModal, onClose: nullMethod, hasCloseButton: false, isFullscreenOnMobile: true, size: "md", className: "p-4 px-4.5", title: header, children: [_jsx("h3", { children: header }), _jsxs(Form.Group, { className: "pt-3", children: [_jsx(Form.Label, { children: hint }), _jsxs(Form.RadioSet, { name: "sessions", className: "pt-3 pb-4", onChange: handleSelection, value: selectedSession, children: [availableSessions === null || availableSessions === void 0 ? void 0 : availableSessions.map((session) => (_jsxs(Form.Radio, { value: session.courseId, children: [dateFormatter(formatDate, session.startDate), " - ", dateFormatter(formatDate, session.endDate)] }, session.courseId))), showLeaveOption && (_jsx(Form.Radio, { value: LEAVE_OPTION, children: formatMessage(messages.leaveSessionOption) }))] })] }), _jsxs(ActionRow, { children: [_jsx(Button, { variant: "tertiary", onClick: closeSessionModal, children: formatMessage(messages.nevermind) }), _jsx(Button, { onClick: handleSubmit, children: formatMessage(messages.confirmSession) })] })] }));
+};
+export default SelectSessionModal;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/containers/SelectSessionModal/index.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EACL,SAAS,EACT,MAAM,EACN,IAAI,EACJ,WAAW,GACZ,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,yBAAyB,MAAM,SAAS,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC3C,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,EAAE;IACrC,MAAM,EACJ,iBAAiB,EACjB,SAAS,EACT,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,YAAY,EACZ,MAAM,EACN,IAAI,EACJ,eAAe,GAChB,GAAG,yBAAyB,EAAE,CAAC;IAEhC,MAAM,UAAU,GAAG,SAAS,CAAC,aAAa,EAAE,CAAC;IAC7C,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,OAAO,CACL,MAAC,WAAW,IACV,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,UAAU,EACnB,cAAc,EAAE,KAAK,EACrB,oBAAoB,QACpB,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,MAAM,aAEb,uBAAK,MAAM,GAAM,EACjB,MAAC,IAAI,CAAC,KAAK,IAAC,SAAS,EAAC,MAAM,aAC1B,KAAC,IAAI,CAAC,KAAK,cAAE,IAAI,GAAc,EAC/B,MAAC,IAAI,CAAC,QAAQ,IACZ,IAAI,EAAC,UAAU,EACf,SAAS,EAAC,WAAW,EACrB,QAAQ,EAAE,eAAe,EACzB,KAAK,EAAE,eAAe,aAErB,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACnC,MAAC,IAAI,CAAC,KAAK,IAAwB,KAAK,EAAE,OAAO,CAAC,QAAQ,aACvD,aAAa,CAAC,UAAU,EAAE,OAAO,CAAC,SAAS,CAAC,SAAK,aAAa,CAAC,UAAU,EAAE,OAAO,CAAC,OAAO,CAAC,KAD7E,OAAO,CAAC,QAAQ,CAEpB,CACd,CAAC,EACD,eAAe,IAAI,CAClB,KAAC,IAAI,CAAC,KAAK,IAAC,KAAK,EAAE,YAAY,YAC5B,aAAa,CAAC,QAAQ,CAAC,kBAAkB,CAAC,GAChC,CACd,IACa,IACL,EACb,MAAC,SAAS,eACR,KAAC,MAAM,IAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,iBAAiB,YAClD,aAAa,CAAC,QAAQ,CAAC,SAAS,CAAC,GAC3B,EACT,KAAC,MAAM,IAAC,OAAO,EAAE,YAAY,YAAG,aAAa,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAU,IACtE,IACA,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import React from 'react';\n\nimport { useIntl } from '@openedx/frontend-base';\nimport {\n  ActionRow,\n  Button,\n  Form,\n  ModalDialog,\n} from '@openedx/paragon';\n\nimport { utilHooks } from '../../hooks';\nimport { nullMethod, dateFormatter } from '../../utils';\n\nimport useSelectSessionModalData from './hooks';\nimport { LEAVE_OPTION } from './constants';\nimport messages from './messages';\n\nexport const SelectSessionModal = () => {\n  const {\n    availableSessions,\n    showModal,\n    closeSessionModal,\n    showLeaveOption,\n    handleSelection,\n    handleSubmit,\n    header,\n    hint,\n    selectedSession,\n  } = useSelectSessionModalData();\n\n  const formatDate = utilHooks.useFormatDate();\n  const { formatMessage } = useIntl();\n\n  return (\n    <ModalDialog\n      isOpen={showModal}\n      onClose={nullMethod}\n      hasCloseButton={false}\n      isFullscreenOnMobile\n      size=\"md\"\n      className=\"p-4 px-4.5\"\n      title={header}\n    >\n      <h3>{header}</h3>\n      <Form.Group className=\"pt-3\">\n        <Form.Label>{hint}</Form.Label>\n        <Form.RadioSet\n          name=\"sessions\"\n          className=\"pt-3 pb-4\"\n          onChange={handleSelection}\n          value={selectedSession}\n        >\n          {availableSessions?.map((session) => (\n            <Form.Radio key={session.courseId} value={session.courseId}>\n              {dateFormatter(formatDate, session.startDate)} - {dateFormatter(formatDate, session.endDate)}\n            </Form.Radio>\n          ))}\n          {showLeaveOption && (\n            <Form.Radio value={LEAVE_OPTION}>\n              {formatMessage(messages.leaveSessionOption)}\n            </Form.Radio>\n          )}\n        </Form.RadioSet>\n      </Form.Group>\n      <ActionRow>\n        <Button variant=\"tertiary\" onClick={closeSessionModal}>\n          {formatMessage(messages.nevermind)}\n        </Button>\n        <Button onClick={handleSubmit}>{formatMessage(messages.confirmSession)}</Button>\n      </ActionRow>\n    </ModalDialog>\n  );\n};\n\nexport default SelectSessionModal;\n"]}