@edx/frontend-app-subscription-learner-dashboard 1.18.0 → 1.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/app.js +0 -3
  2. package/dist/app.js.map +1 -1
  3. package/dist/containers/CoursesPanel/index.js +2 -1
  4. package/dist/containers/CoursesPanel/index.js.map +1 -1
  5. package/dist/containers/CoursesPanel/index.scss +3 -3
  6. package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.d.ts +3 -0
  7. package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.js +10 -0
  8. package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.js.map +1 -0
  9. package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.scss +14 -0
  10. package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/index.d.ts +2 -0
  11. package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/index.js +24 -0
  12. package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/index.js.map +1 -0
  13. package/dist/containers/ProgramDashboard/ProgramProgress/ProgramProgressTabs/index.js +2 -1
  14. package/dist/containers/ProgramDashboard/ProgramProgress/ProgramProgressTabs/index.js.map +1 -1
  15. package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.js +4 -4
  16. package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.js.map +1 -1
  17. package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.scss +13 -1
  18. package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/ProgressCardButton.js +6 -2
  19. package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/ProgressCardButton.js.map +1 -1
  20. package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/index.js +1 -1
  21. package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/index.js.map +1 -1
  22. package/dist/containers/ProgramDashboard/ProgramProgress/index.scss +4 -0
  23. package/dist/containers/ProgramDashboard/ProgramProgress/messages.d.ts +30 -0
  24. package/dist/containers/ProgramDashboard/ProgramProgress/messages.js +30 -0
  25. package/dist/containers/ProgramDashboard/ProgramProgress/messages.js.map +1 -1
  26. package/dist/containers/SubscriptionBanner/components/SubscriptionBanner.js +24 -15
  27. package/dist/containers/SubscriptionBanner/components/SubscriptionBanner.js.map +1 -1
  28. package/dist/containers/SubscriptionBanner/messages.d.ts +15 -0
  29. package/dist/containers/SubscriptionBanner/messages.js +19 -4
  30. package/dist/containers/SubscriptionBanner/messages.js.map +1 -1
  31. package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.d.ts +1 -0
  32. package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.js +7 -7
  33. package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.js.map +1 -1
  34. package/dist/containers/SubscriptionInformation/index.scss +19 -0
  35. package/dist/containers/SubscriptionInformation/messages.d.ts +5 -0
  36. package/dist/containers/SubscriptionInformation/messages.js +6 -1
  37. package/dist/containers/SubscriptionInformation/messages.js.map +1 -1
  38. package/dist/data/constants/app.d.ts +1 -0
  39. package/dist/data/constants/app.js +1 -0
  40. package/dist/data/constants/app.js.map +1 -1
  41. package/package.json +1 -1
package/dist/app.js CHANGED
@@ -14,9 +14,6 @@ const app = {
14
14
  ORDER_HISTORY_URL: '',
15
15
  SUPPORT_URL: 'https://help.edx.org/edxlearner/s/?language=en_US',
16
16
  SHOW_UNENROLL_SURVEY: false,
17
- ALGOLIA_APP_ID: 'IGSYV1Z1XI',
18
- ALGOLIA_SEARCH_API_KEY: '9b43cfe4f35ae59780d99ea70e3e239d',
19
- ALGOLIA_PRODUCT_INDEX_NAME: 'product',
20
17
  },
21
18
  };
22
19
  export default app;
package/dist/app.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"app.js","sourceRoot":"","sources":["../src/app.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,OAAO,KAAK,MAAM,SAAS,CAAC;AAE5B,MAAM,GAAG,GAAQ;IACf,KAAK;IACL,MAAM;IACN,SAAS;IACT,KAAK;IACL,MAAM,EAAE;QACN,iBAAiB,EAAE,mCAAmC;QACtD,eAAe,EAAE,KAAK;QACtB,kBAAkB,EAAE,EAAE;QACtB,iBAAiB,EAAE,EAAE;QACrB,WAAW,EAAE,mDAAmD;QAChE,oBAAoB,EAAE,KAAK;QAC3B,cAAc,EAAE,YAAY;QAC5B,sBAAsB,EAAE,kCAAkC;QAC1D,0BAA0B,EAAE,SAAS;KACtC;CACF,CAAC;AAEF,eAAe,GAAG,CAAC","sourcesContent":["import { App } from '@openedx/frontend-base';\nimport { appId } from './constants';\nimport routes from './routes';\nimport providers from './providers';\nimport slots from './slots';\n\nconst app: App = {\n appId,\n routes,\n providers,\n slots,\n config: {\n LEARNING_BASE_URL: 'http://apps.local.openedx.io:2000',\n ENABLE_PROGRAMS: false,\n ECOMMERCE_BASE_URL: '',\n ORDER_HISTORY_URL: '',\n SUPPORT_URL: 'https://help.edx.org/edxlearner/s/?language=en_US',\n SHOW_UNENROLL_SURVEY: false,\n ALGOLIA_APP_ID: 'IGSYV1Z1XI',\n ALGOLIA_SEARCH_API_KEY: '9b43cfe4f35ae59780d99ea70e3e239d',\n ALGOLIA_PRODUCT_INDEX_NAME: 'product',\n },\n};\n\nexport default app;\n"]}
1
+ {"version":3,"file":"app.js","sourceRoot":"","sources":["../src/app.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,OAAO,KAAK,MAAM,SAAS,CAAC;AAE5B,MAAM,GAAG,GAAQ;IACf,KAAK;IACL,MAAM;IACN,SAAS;IACT,KAAK;IACL,MAAM,EAAE;QACN,iBAAiB,EAAE,mCAAmC;QACtD,eAAe,EAAE,KAAK;QACtB,kBAAkB,EAAE,EAAE;QACtB,iBAAiB,EAAE,EAAE;QACrB,WAAW,EAAE,mDAAmD;QAChE,oBAAoB,EAAE,KAAK;KAC5B;CACF,CAAC;AAEF,eAAe,GAAG,CAAC","sourcesContent":["import { App } from '@openedx/frontend-base';\nimport { appId } from './constants';\nimport routes from './routes';\nimport providers from './providers';\nimport slots from './slots';\n\nconst app: App = {\n appId,\n routes,\n providers,\n slots,\n config: {\n LEARNING_BASE_URL: 'http://apps.local.openedx.io:2000',\n ENABLE_PROGRAMS: false,\n ECOMMERCE_BASE_URL: '',\n ORDER_HISTORY_URL: '',\n SUPPORT_URL: 'https://help.edx.org/edxlearner/s/?language=en_US',\n SHOW_UNENROLL_SURVEY: false,\n },\n};\n\nexport default app;\n"]}
@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import React, { useMemo } from 'react';
3
3
  import { useIntl } from '@openedx/frontend-base';
4
4
  import { useInitializeSubsCourseDashboard } from '../../data/hooks';
5
+ import { CourseFilterControls } from '../../containers/CourseFilterControls';
5
6
  import CourseListSlot from '../../slots/CourseListSlot';
6
7
  import NoCoursesViewSlot from '../../slots/NoCoursesViewSlot';
7
8
  import { useFilters } from '../../data/context';
@@ -37,7 +38,7 @@ export const CoursesPanel = () => {
37
38
  visibleList,
38
39
  verifiedCourse: true,
39
40
  };
40
- return (_jsxs("div", { className: "course-list-container", children: [_jsxs("div", { className: "course-list-heading-container", children: [_jsx("h2", { className: "course-list-title", children: formatMessage(messages.myCourses) }), _jsx("p", { className: "mb-4.5", children: formatMessage(messages.lastSession) })] }), hasCourses ? _jsx(CourseListSlot, { courseListData: courseListData }) : _jsx(NoCoursesViewSlot, {})] }));
41
+ return (_jsxs("div", { className: "course-list-container", children: [_jsxs("div", { className: "course-list-heading-container mb-3", children: [_jsx("h2", { className: "course-list-title", children: formatMessage(messages.myCourses) }), _jsx("div", { className: "course-filter-controls-container", children: _jsx(CourseFilterControls, {}) })] }), hasCourses ? _jsx(CourseListSlot, { courseListData: courseListData }) : _jsx(NoCoursesViewSlot, {})] }));
41
42
  };
42
43
  CoursesPanel.propTypes = {};
43
44
  export default CoursesPanel;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/containers/CoursesPanel/index.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,gCAAgC,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,cAAc,MAAM,4BAA4B,CAAC;AACxD,OAAO,iBAAiB,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAE7D,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,OAAO,cAAc,CAAC;AAEtB;;;;EAIE;AACF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,EAAE,IAAI,EAAE,GAAG,gCAAgC,EAAE,CAAC;IACpD,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,CAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,mBAAmB,0CAAE,MAAM,IAAG,CAAC,CAAA,EAAA,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEhF,MAAM,EACJ,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,GAC3C,GAAG,UAAU,EAAE,CAAC;IACjB,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE;QAC7C,MAAM,kBAAkB,GAAG,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,eAAe;YAC9C,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC;YACrC,CAAC,CAAC,EAAE,CAAC;QACP,OAAO,cAAc,CACnB,kBAAkB,EAClB,OAAO,EACP,MAAM,EACN,UAAU,CACX,CAAC;IACJ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC;IAExC,uDAAuD;IACvD,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,QAAQ,GAAG,CAAC,IAAI,UAAU,GAAG,QAAQ,EAAE,CAAC;YAC1C,aAAa,CAAC,CAAC,CAAC,CAAC;QACnB,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC,CAAC;IAE1C,MAAM,cAAc,GAAG;QACrB,WAAW,EAAE,IAAI;QACjB,aAAa;QACb,QAAQ;QACR,WAAW;QACX,cAAc,EAAE,IAAI;KACrB,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,uBAAuB,aACpC,eAAK,SAAS,EAAC,+BAA+B,aAC5C,aAAI,SAAS,EAAC,mBAAmB,YAAE,aAAa,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAM,EAC1E,YAAG,SAAS,EAAC,QAAQ,YAAE,aAAa,CAAC,QAAQ,CAAC,WAAW,CAAC,GAAK,IAC3D,EACL,UAAU,CAAC,CAAC,CAAC,KAAC,cAAc,IAAC,cAAc,EAAE,cAAc,GAAI,CAAC,CAAC,CAAC,KAAC,iBAAiB,KAAG,IACpF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,SAAS,GAAG,EAAE,CAAC;AAE5B,eAAe,YAAY,CAAC","sourcesContent":["import React, { useMemo } from 'react';\n\nimport { useIntl } from '@openedx/frontend-base';\nimport { useInitializeSubsCourseDashboard } from '@src/data/hooks';\nimport CourseListSlot from '../../slots/CourseListSlot';\nimport NoCoursesViewSlot from '../../slots/NoCoursesViewSlot';\nimport { useFilters } from '@src/data/context';\n\nimport { getVisibleList } from '@src/utils/dataTransformers';\n\nimport messages from './messages';\n\nimport './index.scss';\n\n/**\n * Renders the list of CourseCards\n * Also houses the NoCoursesView to display if the user hasn't enrolled in any courses.\n * @returns List of courses as CourseCards or empty state\n*/\nexport const CoursesPanel = () => {\n const { formatMessage } = useIntl();\n const { data } = useInitializeSubsCourseDashboard();\n const hasCourses = useMemo(() => data?.subscriptionCourses?.length > 0, [data]);\n\n const {\n filters, sortBy, pageNumber, setPageNumber,\n } = useFilters();\n const { visibleList, numPages } = useMemo(() => {\n const transformedCourses = data?.coursesByCardId\n ? Object.values(data.coursesByCardId)\n : [];\n return getVisibleList(\n transformedCourses,\n filters,\n sortBy,\n pageNumber,\n );\n }, [data, filters, sortBy, pageNumber]);\n\n // Clamp page number when filtered/mutated list shrinks\n React.useEffect(() => {\n if (numPages > 0 && pageNumber > numPages) {\n setPageNumber(1);\n }\n }, [numPages, pageNumber, setPageNumber]);\n\n const courseListData = {\n showFilters: true,\n setPageNumber,\n numPages,\n visibleList,\n verifiedCourse: true,\n };\n\n return (\n <div className=\"course-list-container\">\n <div className=\"course-list-heading-container\">\n <h2 className=\"course-list-title\">{formatMessage(messages.myCourses)}</h2>\n <p className=\"mb-4.5\">{formatMessage(messages.lastSession)}</p>\n </div>\n {hasCourses ? <CourseListSlot courseListData={courseListData} /> : <NoCoursesViewSlot />}\n </div>\n );\n};\n\nCoursesPanel.propTypes = {};\n\nexport default CoursesPanel;\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/containers/CoursesPanel/index.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,gCAAgC,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAC5E,OAAO,cAAc,MAAM,4BAA4B,CAAC;AACxD,OAAO,iBAAiB,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAE7D,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,OAAO,cAAc,CAAC;AAEtB;;;;EAIE;AACF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,EAAE,IAAI,EAAE,GAAG,gCAAgC,EAAE,CAAC;IACpD,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,CAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,mBAAmB,0CAAE,MAAM,IAAG,CAAC,CAAA,EAAA,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEhF,MAAM,EACJ,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,GAC3C,GAAG,UAAU,EAAE,CAAC;IACjB,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE;QAC7C,MAAM,kBAAkB,GAAG,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,eAAe;YAC9C,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC;YACrC,CAAC,CAAC,EAAE,CAAC;QACP,OAAO,cAAc,CACnB,kBAAkB,EAClB,OAAO,EACP,MAAM,EACN,UAAU,CACX,CAAC;IACJ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC;IAExC,uDAAuD;IACvD,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,QAAQ,GAAG,CAAC,IAAI,UAAU,GAAG,QAAQ,EAAE,CAAC;YAC1C,aAAa,CAAC,CAAC,CAAC,CAAC;QACnB,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC,CAAC;IAE1C,MAAM,cAAc,GAAG;QACrB,WAAW,EAAE,IAAI;QACjB,aAAa;QACb,QAAQ;QACR,WAAW;QACX,cAAc,EAAE,IAAI;KACrB,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,uBAAuB,aACpC,eAAK,SAAS,EAAC,oCAAoC,aACjD,aAAI,SAAS,EAAC,mBAAmB,YAAE,aAAa,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAM,EAC1E,cAAK,SAAS,EAAC,kCAAkC,YAC/C,KAAC,oBAAoB,KAAG,GACpB,IACF,EACL,UAAU,CAAC,CAAC,CAAC,KAAC,cAAc,IAAC,cAAc,EAAE,cAAc,GAAI,CAAC,CAAC,CAAC,KAAC,iBAAiB,KAAG,IACpF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,SAAS,GAAG,EAAE,CAAC;AAE5B,eAAe,YAAY,CAAC","sourcesContent":["import React, { useMemo } from 'react';\n\nimport { useIntl } from '@openedx/frontend-base';\nimport { useInitializeSubsCourseDashboard } from '@src/data/hooks';\nimport { CourseFilterControls } from '@src/containers/CourseFilterControls';\nimport CourseListSlot from '../../slots/CourseListSlot';\nimport NoCoursesViewSlot from '../../slots/NoCoursesViewSlot';\nimport { useFilters } from '@src/data/context';\n\nimport { getVisibleList } from '@src/utils/dataTransformers';\n\nimport messages from './messages';\n\nimport './index.scss';\n\n/**\n * Renders the list of CourseCards\n * Also houses the NoCoursesView to display if the user hasn't enrolled in any courses.\n * @returns List of courses as CourseCards or empty state\n*/\nexport const CoursesPanel = () => {\n const { formatMessage } = useIntl();\n const { data } = useInitializeSubsCourseDashboard();\n const hasCourses = useMemo(() => data?.subscriptionCourses?.length > 0, [data]);\n\n const {\n filters, sortBy, pageNumber, setPageNumber,\n } = useFilters();\n const { visibleList, numPages } = useMemo(() => {\n const transformedCourses = data?.coursesByCardId\n ? Object.values(data.coursesByCardId)\n : [];\n return getVisibleList(\n transformedCourses,\n filters,\n sortBy,\n pageNumber,\n );\n }, [data, filters, sortBy, pageNumber]);\n\n // Clamp page number when filtered/mutated list shrinks\n React.useEffect(() => {\n if (numPages > 0 && pageNumber > numPages) {\n setPageNumber(1);\n }\n }, [numPages, pageNumber, setPageNumber]);\n\n const courseListData = {\n showFilters: true,\n setPageNumber,\n numPages,\n visibleList,\n verifiedCourse: true,\n };\n\n return (\n <div className=\"course-list-container\">\n <div className=\"course-list-heading-container mb-3\">\n <h2 className=\"course-list-title\">{formatMessage(messages.myCourses)}</h2>\n <div className=\"course-filter-controls-container\">\n <CourseFilterControls />\n </div>\n </div>\n {hasCourses ? <CourseListSlot courseListData={courseListData} /> : <NoCoursesViewSlot />}\n </div>\n );\n};\n\nCoursesPanel.propTypes = {};\n\nexport default CoursesPanel;\n"]}
@@ -2,12 +2,13 @@
2
2
 
3
3
  .course-list-heading-container {
4
4
  display: flex;
5
- flex-direction: column;
5
+ flex-direction: row;
6
6
  justify-content: space-between;
7
+ align-items: center;
7
8
  }
8
9
 
9
10
  .course-list-title {
10
- font-size: var(--pgn-typography-font-size-h3-base);
11
+ font-size: var(--pgn-typography-font-size-h2-base);
11
12
  margin: var(--pgn-spacing-spacer-3) 0;
12
13
  }
13
14
 
@@ -25,7 +26,6 @@
25
26
 
26
27
  @media (--pgn-size-breakpoint-max-width-md) {
27
28
  .course-list-heading-container {
28
- flex-direction: column-reverse;
29
29
  align-items: flex-start;
30
30
  }
31
31
 
@@ -0,0 +1,3 @@
1
+ import { FC } from 'react';
2
+ import './index.scss';
3
+ export declare const CreditFaqBanner: FC;
@@ -0,0 +1,10 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useIntl } from '@openedx/frontend-base';
3
+ import { Card, Button, Row, Col } from '@openedx/paragon';
4
+ import messages from '../../messages';
5
+ import './index.scss';
6
+ export const CreditFaqBanner = () => {
7
+ const { formatMessage } = useIntl();
8
+ return (_jsx(Card, { className: "mb-3 mt-4 credit-faq-banner-card", "data-testid": "credit-faq-banner-card", children: _jsxs(Card.Section, { className: "p-4", children: [_jsx(Row, { children: _jsxs(Col, { xs: 12, children: [_jsx("h5", { className: "mb-1 font-weight-bold", "data-testid": "credit-faq-banner-title", children: formatMessage(messages.programProgressPathwaysCreditPathwayFaqTitle) }), _jsx("div", { className: "card-description", "data-testid": "credit-faq-banner-description", children: formatMessage(messages.programProgressPathwaysCreditPathwayFaqDescription) })] }) }), _jsx(Row, { className: "mt-3", children: _jsx(Col, { xs: 12, className: "d-flex justify-content-end", children: _jsx(Button, { variant: "primary", className: "mr-2 d-flex align-items-center", children: formatMessage(messages.programProgressPathwaysCreditPathwayFaqButton) }) }) })] }) }));
9
+ };
10
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAE1D,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AACtC,OAAO,cAAc,CAAC;AAEtB,MAAM,CAAC,MAAM,eAAe,GAAO,GAAG,EAAE;IACtC,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAC,kCAAkC,iBAAa,wBAAwB,YACrF,MAAC,IAAI,CAAC,OAAO,IAAC,SAAS,EAAC,KAAK,aAC3B,KAAC,GAAG,cACF,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,aACT,aAAI,SAAS,EAAC,uBAAuB,iBAAa,yBAAyB,YAAE,aAAa,CAAC,QAAQ,CAAC,4CAA4C,CAAC,GAAM,EACvJ,cAAK,SAAS,EAAC,kBAAkB,iBAAa,+BAA+B,YAC1E,aAAa,CAAC,QAAQ,CAAC,kDAAkD,CAAC,GACvE,IACF,GACF,EAEN,KAAC,GAAG,IAAC,SAAS,EAAC,MAAM,YACnB,KAAC,GAAG,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAC,4BAA4B,YAKjD,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,SAAS,EAAC,gCAAgC,YACjE,aAAa,CAAC,QAAQ,CAAC,6CAA6C,CAAC,GAC/D,GACL,GACF,IACO,GACV,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { useIntl } from '@openedx/frontend-base';\nimport { Card, Button, Row, Col } from '@openedx/paragon';\n\nimport messages from '../../messages';\nimport './index.scss';\n\nexport const CreditFaqBanner: FC = () => {\n const { formatMessage } = useIntl();\n\n return (\n <Card className=\"mb-3 mt-4 credit-faq-banner-card\" data-testid=\"credit-faq-banner-card\">\n <Card.Section className=\"p-4\">\n <Row>\n <Col xs={12}>\n <h5 className=\"mb-1 font-weight-bold\" data-testid=\"credit-faq-banner-title\">{formatMessage(messages.programProgressPathwaysCreditPathwayFaqTitle)}</h5>\n <div className=\"card-description\" data-testid=\"credit-faq-banner-description\">\n {formatMessage(messages.programProgressPathwaysCreditPathwayFaqDescription)}\n </div>\n </Col>\n </Row>\n\n <Row className=\"mt-3\">\n <Col xs={12} className=\"d-flex justify-content-end\">\n {/**\n * TODO: The button shown here does not do anything at the moment.\n * ACTION ITEM: Wire this button to the appropriate URL when the FAQ page/link is known.\n */}\n <Button variant=\"primary\" className=\"mr-2 d-flex align-items-center\">\n {formatMessage(messages.programProgressPathwaysCreditPathwayFaqButton)}\n </Button>\n </Col>\n </Row>\n </Card.Section>\n </Card>\n );\n};\n"]}
@@ -0,0 +1,14 @@
1
+ $title-color: #00262B !default;
2
+ $subtitle-color: #454545 !default;
3
+
4
+ .credit-faq-banner-card{
5
+ background-color: var(--pgn-color-light-200);
6
+
7
+ .h5{
8
+ color: $title-color;
9
+ }
10
+
11
+ .card-description{
12
+ color: $subtitle-color;
13
+ }
14
+ }
@@ -0,0 +1,2 @@
1
+ import { FC } from 'react';
2
+ export declare const PathwaysTabData: FC;
@@ -0,0 +1,24 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useIntl } from '@openedx/frontend-base';
3
+ import { ProgressCard } from '../ProgressCard';
4
+ import messages from '../messages';
5
+ import { useProgressData } from '../../../../hooks/useProgressData';
6
+ import { CreditFaqBanner } from './CreditFaqBanner';
7
+ export const PathwaysTabData = () => {
8
+ const { programProgressData, isLoading } = useProgressData();
9
+ const creditPathwayData = programProgressData === null || programProgressData === void 0 ? void 0 : programProgressData.creditPathways;
10
+ const { formatMessage } = useIntl();
11
+ const progressCards = creditPathwayData === null || creditPathwayData === void 0 ? void 0 : creditPathwayData.map((pathway) => {
12
+ const { name: title, description, destinationUrl, uuid } = pathway;
13
+ const progressCardData = {
14
+ title: title,
15
+ description: description,
16
+ destinationUrl: destinationUrl,
17
+ };
18
+ return (_jsx(ProgressCard, { progressCardData: progressCardData, isLoading: isLoading, tabType: formatMessage(messages.programProgressPathwaysTab).toLowerCase() }, uuid));
19
+ });
20
+ return (_jsxs("div", { children: [_jsx("h5", { className: "pathways-tab-title", children: formatMessage(messages.programProgressPathwaysCreditPathwayTitle) }), _jsx("p", { className: "pb-3 mb-4 pathways-tab-description", children: formatMessage(messages.programProgressPathwaysCreditPathwayDescription, {
21
+ br: '\n',
22
+ }) }), progressCards, _jsx(CreditFaqBanner, {})] }));
23
+ };
24
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,MAAM,CAAC,MAAM,eAAe,GAAO,GAAG,EAAE;IACtC,MAAM,EAAE,mBAAmB,EAAE,SAAS,EAAE,GAAG,eAAe,EAAE,CAAC;IAC7D,MAAM,iBAAiB,GAAG,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,cAAc,CAAC;IAC9D,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,MAAM,aAAa,GAAG,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;QACvD,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;QAEnE,MAAM,gBAAgB,GAAG;YACvB,KAAK,EAAE,KAAK;YACZ,WAAW,EAAE,WAAW;YACxB,cAAc,EAAE,cAAc;SAC/B,CAAC;QAEF,OAAO,CACL,KAAC,YAAY,IAEX,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,aAAa,CAAC,QAAQ,CAAC,0BAA0B,CAAC,CAAC,WAAW,EAAE,IAHpE,IAAI,CAIT,CACH,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,0BACE,aAAI,SAAS,EAAC,oBAAoB,YAAE,aAAa,CAAC,QAAQ,CAAC,yCAAyC,CAAC,GAAM,EAC3G,YAAG,SAAS,EAAC,oCAAoC,YAAE,aAAa,CAAC,QAAQ,CAAC,+CAA+C,EAAE;oBACzH,EAAE,EAAE,IAAI;iBACT,CAAC,GACE,EACH,aAAa,EACd,KAAC,eAAe,KAAG,IACf,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { useIntl } from '@openedx/frontend-base';\nimport { ProgressCard } from '../ProgressCard';\nimport messages from '../messages';\nimport { useProgressData } from '@src/hooks/useProgressData';\nimport { CreditFaqBanner } from './CreditFaqBanner';\n\nexport const PathwaysTabData: FC = () => {\n const { programProgressData, isLoading } = useProgressData();\n const creditPathwayData = programProgressData?.creditPathways;\n const { formatMessage } = useIntl();\n\n const progressCards = creditPathwayData?.map((pathway) => {\n const { name: title, description, destinationUrl, uuid } = pathway;\n\n const progressCardData = {\n title: title,\n description: description,\n destinationUrl: destinationUrl,\n };\n\n return (\n <ProgressCard\n key={uuid}\n progressCardData={progressCardData}\n isLoading={isLoading}\n tabType={formatMessage(messages.programProgressPathwaysTab).toLowerCase()}\n />\n );\n });\n\n return (\n <div>\n <h5 className=\"pathways-tab-title\">{formatMessage(messages.programProgressPathwaysCreditPathwayTitle)}</h5>\n <p className=\"pb-3 mb-4 pathways-tab-description\">{formatMessage(messages.programProgressPathwaysCreditPathwayDescription, {\n br: '\\n',\n })}\n </p>\n {progressCards}\n <CreditFaqBanner />\n </div>\n );\n};\n"]}
@@ -6,6 +6,7 @@ import messages from '../messages';
6
6
  import { RemainingTabData } from '../RemainingTabData';
7
7
  import { CompletedTabData } from '../CompletedTabData';
8
8
  import { InProgressTabData } from '../InProgressTabData';
9
+ import { PathwaysTabData } from '../PathwaysTabData';
9
10
  export const ProgramProgressTabs = ({ type, counts }) => {
10
11
  const { inProgress, remaining, completed } = counts;
11
12
  const { formatMessage } = useIntl();
@@ -32,7 +33,7 @@ export const ProgramProgressTabs = ({ type, counts }) => {
32
33
  ? [{
33
34
  key: 'pathways',
34
35
  title: formatMessage(messages.programProgressPathwaysTab),
35
- panel: _jsx("span", { children: "Pathways tab data will be available soon." }),
36
+ panel: _jsx(PathwaysTabData, {}),
36
37
  }]
37
38
  : []),
38
39
  ];
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgramProgressTabs/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,MAAM,CAAC,MAAM,mBAAmB,GAAiC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE;IACpF,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC;IACpD,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,MAAM,QAAQ,GAA8B;QAC1C;YACE,GAAG,EAAE,aAAa;YAClB,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC;YAC3D,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,KAAC,iBAAiB,KAAG;SAC7B;QACD;YACE,GAAG,EAAE,WAAW;YAChB,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC;YAC1D,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,KAAC,gBAAgB,KAAG;SAC5B;QACD;YACE,GAAG,EAAE,WAAW;YAChB,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC;YAC1D,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,KAAC,gBAAgB,KAAG;SAC5B;QACD,GAAG,CAAC,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,EAAE,MAAK,cAAc;YACxC,CAAC,CAAC,CAAC;oBACC,GAAG,EAAE,UAAU;oBACf,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,0BAA0B,CAAC;oBACzD,KAAK,EAAE,uEAAsD;iBAC9D,CAAC;YACJ,CAAC,CAAC,EAAE,CAAC;KACR,CAAC;IAEF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAS,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IAEpE,MAAM,eAAe,GAAG,CAAC,MAAqB,EAAE,EAAE;QAChD,IAAI,MAAM;YAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAC,uBAAuB,EAC1B,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,eAAe,EACzB,SAAS,EAAC,MAAM,EAChB,YAAY,kBAEX,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CACnB,KAAC,GAAG,IAAC,QAAQ,EAAE,GAAG,CAAC,GAAG,EAAgB,KAAK,EAAE,GAAG,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,KAAK,KAAK,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,YAC7G,GAAG,CAAC,KAAK,IADiB,GAAG,CAAC,GAAG,CAE9B,CACP,CAAC,GACG,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC, useState } from 'react';\nimport { Tabs, Tab } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { ProgramProgressTabsProps, ProgramProgressTabItems } from '../../data/types';\nimport messages from '../messages';\nimport { RemainingTabData } from '../RemainingTabData';\nimport { CompletedTabData } from '../CompletedTabData';\nimport { InProgressTabData } from '../InProgressTabData';\n\nexport const ProgramProgressTabs: FC<ProgramProgressTabsProps> = ({ type, counts }) => {\n const { inProgress, remaining, completed } = counts;\n const { formatMessage } = useIntl();\n\n const tabsData: ProgramProgressTabItems[] = [\n {\n key: 'in-progress',\n title: formatMessage(messages.programProgressInProgressTab),\n count: inProgress,\n panel: <InProgressTabData />,\n },\n {\n key: 'remaining',\n title: formatMessage(messages.programProgressRemainingTab),\n count: remaining,\n panel: <RemainingTabData />,\n },\n {\n key: 'completed',\n title: formatMessage(messages.programProgressCompletedTab),\n count: completed,\n panel: <CompletedTabData />,\n },\n ...(type?.toLowerCase() === 'micromasters'\n ? [{\n key: 'pathways',\n title: formatMessage(messages.programProgressPathwaysTab),\n panel: <span>Pathways tab data will be available soon.</span>,\n }]\n : []),\n ];\n\n const [activeTab, setActiveTab] = useState<string>(tabsData[0].key);\n\n const handleTabSelect = (tabKey: string | null) => {\n if (tabKey) setActiveTab(tabKey);\n };\n\n return (\n <Tabs\n id=\"program-progress-tabs\"\n activeKey={activeTab}\n onSelect={handleTabSelect}\n className=\"mb-4\"\n mountOnEnter\n >\n {tabsData.map(tab => (\n <Tab eventKey={tab.key} key={tab.key} title={tab.count !== undefined ? `${tab.title} (${tab.count})` : tab.title}>\n {tab.panel}\n </Tab>\n ))}\n </Tabs>\n );\n};\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgramProgressTabs/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,MAAM,CAAC,MAAM,mBAAmB,GAAiC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE;IACpF,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC;IACpD,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,MAAM,QAAQ,GAA8B;QAC1C;YACE,GAAG,EAAE,aAAa;YAClB,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC;YAC3D,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,KAAC,iBAAiB,KAAG;SAC7B;QACD;YACE,GAAG,EAAE,WAAW;YAChB,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC;YAC1D,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,KAAC,gBAAgB,KAAG;SAC5B;QACD;YACE,GAAG,EAAE,WAAW;YAChB,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC;YAC1D,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,KAAC,gBAAgB,KAAG;SAC5B;QACD,GAAG,CAAC,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,EAAE,MAAK,cAAc;YACxC,CAAC,CAAC,CAAC;oBACC,GAAG,EAAE,UAAU;oBACf,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,0BAA0B,CAAC;oBACzD,KAAK,EAAE,KAAC,eAAe,KAAG;iBAC3B,CAAC;YACJ,CAAC,CAAC,EAAE,CAAC;KACR,CAAC;IAEF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAS,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IAEpE,MAAM,eAAe,GAAG,CAAC,MAAqB,EAAE,EAAE;QAChD,IAAI,MAAM;YAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAC,uBAAuB,EAC1B,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,eAAe,EACzB,SAAS,EAAC,MAAM,EAChB,YAAY,kBAEX,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CACnB,KAAC,GAAG,IAAC,QAAQ,EAAE,GAAG,CAAC,GAAG,EAAgB,KAAK,EAAE,GAAG,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,KAAK,KAAK,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,YAC7G,GAAG,CAAC,KAAK,IADiB,GAAG,CAAC,GAAG,CAE9B,CACP,CAAC,GACG,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC, useState } from 'react';\nimport { Tabs, Tab } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { ProgramProgressTabsProps, ProgramProgressTabItems } from '../../data/types';\nimport messages from '../messages';\nimport { RemainingTabData } from '../RemainingTabData';\nimport { CompletedTabData } from '../CompletedTabData';\nimport { InProgressTabData } from '../InProgressTabData';\nimport { PathwaysTabData } from '../PathwaysTabData';\n\nexport const ProgramProgressTabs: FC<ProgramProgressTabsProps> = ({ type, counts }) => {\n const { inProgress, remaining, completed } = counts;\n const { formatMessage } = useIntl();\n\n const tabsData: ProgramProgressTabItems[] = [\n {\n key: 'in-progress',\n title: formatMessage(messages.programProgressInProgressTab),\n count: inProgress,\n panel: <InProgressTabData />,\n },\n {\n key: 'remaining',\n title: formatMessage(messages.programProgressRemainingTab),\n count: remaining,\n panel: <RemainingTabData />,\n },\n {\n key: 'completed',\n title: formatMessage(messages.programProgressCompletedTab),\n count: completed,\n panel: <CompletedTabData />,\n },\n ...(type?.toLowerCase() === 'micromasters'\n ? [{\n key: 'pathways',\n title: formatMessage(messages.programProgressPathwaysTab),\n panel: <PathwaysTabData />,\n }]\n : []),\n ];\n\n const [activeTab, setActiveTab] = useState<string>(tabsData[0].key);\n\n const handleTabSelect = (tabKey: string | null) => {\n if (tabKey) setActiveTab(tabKey);\n };\n\n return (\n <Tabs\n id=\"program-progress-tabs\"\n activeKey={activeTab}\n onSelect={handleTabSelect}\n className=\"mb-4\"\n mountOnEnter\n >\n {tabsData.map(tab => (\n <Tab eventKey={tab.key} key={tab.key} title={tab.count !== undefined ? `${tab.title} (${tab.count})` : tab.title}>\n {tab.panel}\n </Tab>\n ))}\n </Tabs>\n );\n};\n"]}
@@ -1,4 +1,4 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Card, Row, Col } from '@openedx/paragon';
3
3
  import { useIntl } from '@openedx/frontend-base';
4
4
  import messages from '../messages';
@@ -10,7 +10,7 @@ import { PROGRAM_TYPE_MAP } from '../../data/constants';
10
10
  import { getCertificatePriceString } from '../../data/util';
11
11
  export const ProgressCard = ({ progressCardData, isLoading, tabType }) => {
12
12
  const { formatMessage, formatDate } = useIntl();
13
- const { title, pacingType, start, end, certificateUrl, courseUrl, upgradeUrl, programType, checkoutUrl, expired, seats } = progressCardData;
13
+ const { title, pacingType, start, end, certificateUrl, courseUrl, upgradeUrl, programType, checkoutUrl, expired, seats, description, destinationUrl } = progressCardData;
14
14
  const inProgressTabKey = formatMessage(messages.programProgressInProgressTab).toLowerCase();
15
15
  const isInProgressTab = tabType === inProgressTabKey;
16
16
  const isProfessionalProgram = programType === PROGRAM_TYPE_MAP.PROFESSIONAL_CERTIFICATE;
@@ -25,7 +25,7 @@ export const ProgressCard = ({ progressCardData, isLoading, tabType }) => {
25
25
  ? pacingType.replace(/_/g, ' ').replace(/\b\w/g, c => c.toUpperCase())
26
26
  : '';
27
27
  // base string
28
- let enrollmentInfo = tabType !== 'remaining' ? formatMessage(messages.programProgressCardEnrollText) : '';
28
+ let enrollmentInfo = tabType !== formatMessage(messages.programProgressRemainingTab).toLowerCase() && tabType !== formatMessage(messages.programProgressPathwaysTab).toLowerCase() ? formatMessage(messages.programProgressCardEnrollText) : '';
29
29
  if (formattedPacing) {
30
30
  enrollmentInfo += `${enrollmentInfo ? ' ' : ''}(${formattedPacing})`;
31
31
  }
@@ -38,7 +38,7 @@ export const ProgressCard = ({ progressCardData, isLoading, tabType }) => {
38
38
  }
39
39
  // using expired key from course object to determine if the course is expired as per condition on confluence and learners dashboard code.
40
40
  const canUpgrade = Boolean(upgradeUrl) && !expired;
41
- return (_jsx(Card, { className: "progress-card mb-3", "data-testid": "progress-card", isLoading: isLoading, children: _jsxs(Card.Section, { className: "pt-3 pb-2 px-4", children: [_jsxs(Row, { className: "mb-2", children: [_jsxs(Col, { xs: 12, children: [_jsx("h4", { className: "mb-1 font-weight-bold", children: title }), _jsx("div", { className: "text-muted", children: enrollmentInfo })] }), _jsx(ProgressCardActions, { tabType: tabType, redirectUrl: courseUrl })] }), tabType === (formatMessage(messages.programProgressCompletedTab).toLowerCase()) && (_jsx(Row, { className: "pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center", children: _jsxs(Col, { xs: 12, className: "d-flex justify-content-between align-items-center px-0", children: [_jsx("span", { className: "text-start", children: end && (formatMessage(messages.programProgressCardCompletedCertificateText, {
41
+ return (_jsx(Card, { className: "progress-card mb-3", "data-testid": "progress-card", isLoading: isLoading, children: _jsxs(Card.Section, { className: "pt-3 pb-2 px-4", children: [_jsxs(Row, { className: "mb-2", children: [_jsxs(Col, { xs: 12, children: [tabType === (formatMessage(messages.programProgressPathwaysTab).toLowerCase()) ? (_jsx("h5", { className: "mb-1 font-weight-bold card-title", children: title })) : (_jsx("h4", { className: "mb-1 font-weight-bold card-title", children: title })), _jsxs("div", { className: "card-description", children: [enrollmentInfo, description && (_jsx(_Fragment, { children: description }))] })] }), _jsx(ProgressCardActions, { tabType: tabType, redirectUrl: destinationUrl || courseUrl })] }), tabType === (formatMessage(messages.programProgressCompletedTab).toLowerCase()) && (_jsx(Row, { className: "pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center", children: _jsxs(Col, { xs: 12, className: "d-flex justify-content-between align-items-center px-0", children: [_jsx("span", { className: "text-start", children: end && (formatMessage(messages.programProgressCardCompletedCertificateText, {
42
42
  certificateDate: (end ? dateFormatter(formatDate, end, 'short') : ''),
43
43
  })) }), _jsx(ProgressCardButton, { variant: "brand", redirectUrl: certificateUrl || '', buttonText: formatMessage(messages.programProgressCardCompletedCertificateButton) })] }) })), isInProgressTab && (_jsx(Row, { className: "pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center", children: _jsxs(Col, { xs: 12, className: "d-flex justify-content-between align-items-center px-0", children: [_jsx("span", { className: "text-start", children: formatMessage(messages.programProgressInProgressCertificateStatus, {
44
44
  status: canUpgrade ? formatMessage(messages.programProgressInProgressCertificateNeedsVerified) : formatMessage(messages.programProgressInProgressCertificateNotEarned), // TODO : Certificate status will change after Upgrade is successful through api
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC } from 'react';\nimport { Card, Row, Col } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { ProgressCardProps } from '../../data/types';\nimport messages from '../messages';\nimport './index.scss';\nimport { ProgressCardActions } from '../ProgressCardActions';\nimport { dateFormatter } from '@src/utils/dateFormatter';\nimport { ProgressCardButton } from '../ProgressCardActions/ProgressCardButton';\nimport { PROGRAM_TYPE_MAP } from '../../data/constants';\nimport { getCertificatePriceString } from '../../data/util';\n\nexport const ProgressCard: FC<ProgressCardProps> = ({ progressCardData, isLoading, tabType }) => {\n const { formatMessage, formatDate } = useIntl();\n\n const { title, pacingType, start, end, certificateUrl, courseUrl, upgradeUrl, programType, checkoutUrl, expired, seats } = progressCardData;\n\n const inProgressTabKey = formatMessage(messages.programProgressInProgressTab).toLowerCase();\n const isInProgressTab = tabType === inProgressTabKey;\n const isProfessionalProgram = programType === PROGRAM_TYPE_MAP.PROFESSIONAL_CERTIFICATE;\n const isMicroMastersProgram = programType === PROGRAM_TYPE_MAP.MICROMASTERS;\n /*\n - Formatting pacing type safely\n - replace underscores with spaces\n - capitalize first letter of each word\n - example: 'self_paced' -> 'Self Paced'\n */\n const formattedPacing = pacingType\n ? pacingType.replace(/_/g, ' ').replace(/\\b\\w/g, c => c.toUpperCase())\n : '';\n\n // base string\n let enrollmentInfo = tabType !== 'remaining' ? formatMessage(messages.programProgressCardEnrollText) : '';\n\n if (formattedPacing) {\n enrollmentInfo += `${enrollmentInfo ? ' ' : ''}(${formattedPacing})`;\n }\n\n // add start date if exists\n if (start) {\n const startDate = dateFormatter(formatDate, start, 'short');\n\n enrollmentInfo = enrollmentInfo\n ? `${enrollmentInfo} ${formatMessage(messages.programProgressCardStartText)} ${startDate}`\n : `${formatMessage(messages.programProgressCardStartText)} ${startDate}`;\n }\n\n // using expired key from course object to determine if the course is expired as per condition on confluence and learners dashboard code.\n const canUpgrade = Boolean(upgradeUrl) && !expired;\n return (\n <Card className=\"progress-card mb-3\" data-testid=\"progress-card\" isLoading={isLoading}>\n <Card.Section className=\"pt-3 pb-2 px-4\">\n <Row className=\"mb-2\">\n <Col xs={12}>\n <h4 className=\"mb-1 font-weight-bold\">{title}</h4>\n <div className=\"text-muted\">\n {enrollmentInfo}\n </div>\n </Col>\n <ProgressCardActions tabType={tabType} redirectUrl={courseUrl} />\n </Row>\n\n {tabType === (formatMessage(messages.programProgressCompletedTab).toLowerCase()) && (\n <Row className=\"pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center\">\n <Col xs={12} className=\"d-flex justify-content-between align-items-center px-0\">\n <span className=\"text-start\">\n {end && (\n formatMessage(messages.programProgressCardCompletedCertificateText, {\n certificateDate: (end ? dateFormatter(formatDate, end, 'short') : ''),\n })\n )}\n </span>\n\n <ProgressCardButton variant=\"brand\" redirectUrl={certificateUrl || ''} buttonText={formatMessage(messages.programProgressCardCompletedCertificateButton)} />\n </Col>\n </Row>\n )}\n\n {isInProgressTab && (\n <Row className=\"pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center\">\n <Col xs={12} className=\"d-flex justify-content-between align-items-center px-0\">\n {/* TODO : Certificate status will change after Upgrade is successful through api */}\n <span className=\"text-start\">\n {formatMessage(messages.programProgressInProgressCertificateStatus, {\n status: canUpgrade ? formatMessage(messages.programProgressInProgressCertificateNeedsVerified) : formatMessage(messages.programProgressInProgressCertificateNotEarned), // TODO : Certificate status will change after Upgrade is successful through api\n })}\n </span>\n\n {isProfessionalProgram\n && canUpgrade\n && getCertificatePriceString(seats)\n && (\n <ProgressCardButton\n variant=\"brand\"\n redirectUrl=\"\"\n buttonText={formatMessage(messages.programProgressCardUpgradeButton)}\n type=\"upgrade\"\n title={title}\n price={getCertificatePriceString(seats)}\n courseUrl={courseUrl}\n />\n )}\n {isMicroMastersProgram\n && checkoutUrl\n && canUpgrade\n && (\n <ProgressCardButton\n variant=\"brand\"\n redirectUrl={checkoutUrl}\n buttonText={formatMessage(messages.programProgressInProgressCourseMicromastersUpgrade, {\n price: getCertificatePriceString(seats, true),\n })}\n />\n )}\n </Col>\n </Row>\n )}\n\n </Card.Section>\n </Card>\n );\n};\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,2CAA2C,CAAC;AAC/E,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,yBAAyB,EAAE,MAAM,iBAAiB,CAAC;AAE5D,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAAE,gBAAgB,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE;IAC9F,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,GAAG,OAAO,EAAE,CAAC;IAEhD,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,EAAE,cAAc,EAAE,SAAS,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,GAAG,gBAAgB,CAAC;IAEzK,MAAM,gBAAgB,GAAG,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC,CAAC,WAAW,EAAE,CAAC;IAC5F,MAAM,eAAe,GAAG,OAAO,KAAK,gBAAgB,CAAC;IACrD,MAAM,qBAAqB,GAAG,WAAW,KAAK,gBAAgB,CAAC,wBAAwB,CAAC;IACxF,MAAM,qBAAqB,GAAG,WAAW,KAAK,gBAAgB,CAAC,YAAY,CAAC;IAC5E;;;;;MAKE;IACF,MAAM,eAAe,GAAG,UAAU;QAChC,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QACtE,CAAC,CAAC,EAAE,CAAC;IAEP,cAAc;IACd,IAAI,cAAc,GAAG,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,WAAW,EAAE,IAAI,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,0BAA0B,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,6BAA6B,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAEhP,IAAI,eAAe,EAAE,CAAC;QACpB,cAAc,IAAI,GAAG,cAAc,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,IAAI,eAAe,GAAG,CAAC;IACvE,CAAC;IAED,2BAA2B;IAC3B,IAAI,KAAK,EAAE,CAAC;QACV,MAAM,SAAS,GAAG,aAAa,CAAC,UAAU,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;QAE5D,cAAc,GAAG,cAAc;YAC7B,CAAC,CAAC,GAAG,cAAc,IAAI,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC,IAAI,SAAS,EAAE;YAC1F,CAAC,CAAC,GAAG,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC,IAAI,SAAS,EAAE,CAAC;IAC7E,CAAC;IAED,yIAAyI;IACzI,MAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC;IACnD,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAC,oBAAoB,iBAAa,eAAe,EAAC,SAAS,EAAE,SAAS,YACnF,MAAC,IAAI,CAAC,OAAO,IAAC,SAAS,EAAC,gBAAgB,aACtC,MAAC,GAAG,IAAC,SAAS,EAAC,MAAM,aACnB,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,aACR,OAAO,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,0BAA0B,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC,CAChF,aAAI,SAAS,EAAC,kCAAkC,YAAE,KAAK,GAAM,CAC9D,CAAC,CAAC,CAAC,CACF,aAAI,SAAS,EAAC,kCAAkC,YAAE,KAAK,GAAM,CAC9D,EACD,eAAK,SAAS,EAAC,kBAAkB,aAC9B,cAAc,EACd,WAAW,IAAI,CACd,4BACG,WAAW,GACX,CACJ,IACG,IACF,EACN,KAAC,mBAAmB,IAAC,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,cAAc,IAAI,SAAS,GAAI,IAC/E,EAEL,OAAO,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,WAAW,EAAE,CAAC,IAAI,CAClF,KAAC,GAAG,IAAC,SAAS,EAAC,yEAAyE,YACtF,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAC,wDAAwD,aAC7E,eAAM,SAAS,EAAC,YAAY,YACzB,GAAG,IAAI,CACN,aAAa,CAAC,QAAQ,CAAC,2CAA2C,EAAE;oCAClE,eAAe,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,aAAa,CAAC,UAAU,EAAE,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;iCACtE,CAAC,CACH,GACI,EAEP,KAAC,kBAAkB,IAAC,OAAO,EAAC,OAAO,EAAC,WAAW,EAAE,cAAc,IAAI,EAAE,EAAE,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,6CAA6C,CAAC,GAAI,IACxJ,GACF,CACP,EAEA,eAAe,IAAI,CAClB,KAAC,GAAG,IAAC,SAAS,EAAC,yEAAyE,YACtF,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAC,wDAAwD,aAE7E,eAAM,SAAS,EAAC,YAAY,YACzB,aAAa,CAAC,QAAQ,CAAC,0CAA0C,EAAE;oCAClE,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,iDAAiD,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,6CAA6C,CAAC,EAAE,gFAAgF;iCACzP,CAAC,GACG,EAEN,qBAAqB;mCACnB,UAAU;mCACV,yBAAyB,CAAC,KAAK,CAAC;mCAChC,CACD,KAAC,kBAAkB,IACjB,OAAO,EAAC,OAAO,EACf,WAAW,EAAC,EAAE,EACd,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,gCAAgC,CAAC,EACpE,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,yBAAyB,CAAC,KAAK,CAAC,EACvC,SAAS,EAAE,SAAS,GACpB,CACH,EACA,qBAAqB;mCACnB,WAAW;mCACX,UAAU;mCACV,CACD,KAAC,kBAAkB,IACjB,OAAO,EAAC,OAAO,EACf,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,kDAAkD,EAAE;wCACrF,KAAK,EAAE,yBAAyB,CAAC,KAAK,EAAE,IAAI,CAAC;qCAC9C,CAAC,GACF,CACH,IACG,GACF,CACP,IAEY,GACV,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { Card, Row, Col } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { ProgressCardProps } from '../../data/types';\nimport messages from '../messages';\nimport './index.scss';\nimport { ProgressCardActions } from '../ProgressCardActions';\nimport { dateFormatter } from '@src/utils/dateFormatter';\nimport { ProgressCardButton } from '../ProgressCardActions/ProgressCardButton';\nimport { PROGRAM_TYPE_MAP } from '../../data/constants';\nimport { getCertificatePriceString } from '../../data/util';\n\nexport const ProgressCard: FC<ProgressCardProps> = ({ progressCardData, isLoading, tabType }) => {\n const { formatMessage, formatDate } = useIntl();\n\n const { title, pacingType, start, end, certificateUrl, courseUrl, upgradeUrl, programType, checkoutUrl, expired, seats, description, destinationUrl } = progressCardData;\n\n const inProgressTabKey = formatMessage(messages.programProgressInProgressTab).toLowerCase();\n const isInProgressTab = tabType === inProgressTabKey;\n const isProfessionalProgram = programType === PROGRAM_TYPE_MAP.PROFESSIONAL_CERTIFICATE;\n const isMicroMastersProgram = programType === PROGRAM_TYPE_MAP.MICROMASTERS;\n /*\n - Formatting pacing type safely\n - replace underscores with spaces\n - capitalize first letter of each word\n - example: 'self_paced' -> 'Self Paced'\n */\n const formattedPacing = pacingType\n ? pacingType.replace(/_/g, ' ').replace(/\\b\\w/g, c => c.toUpperCase())\n : '';\n\n // base string\n let enrollmentInfo = tabType !== formatMessage(messages.programProgressRemainingTab).toLowerCase() && tabType !== formatMessage(messages.programProgressPathwaysTab).toLowerCase() ? formatMessage(messages.programProgressCardEnrollText) : '';\n\n if (formattedPacing) {\n enrollmentInfo += `${enrollmentInfo ? ' ' : ''}(${formattedPacing})`;\n }\n\n // add start date if exists\n if (start) {\n const startDate = dateFormatter(formatDate, start, 'short');\n\n enrollmentInfo = enrollmentInfo\n ? `${enrollmentInfo} ${formatMessage(messages.programProgressCardStartText)} ${startDate}`\n : `${formatMessage(messages.programProgressCardStartText)} ${startDate}`;\n }\n\n // using expired key from course object to determine if the course is expired as per condition on confluence and learners dashboard code.\n const canUpgrade = Boolean(upgradeUrl) && !expired;\n return (\n <Card className=\"progress-card mb-3\" data-testid=\"progress-card\" isLoading={isLoading}>\n <Card.Section className=\"pt-3 pb-2 px-4\">\n <Row className=\"mb-2\">\n <Col xs={12}>\n {tabType === (formatMessage(messages.programProgressPathwaysTab).toLowerCase()) ? (\n <h5 className=\"mb-1 font-weight-bold card-title\">{title}</h5>\n ) : (\n <h4 className=\"mb-1 font-weight-bold card-title\">{title}</h4>\n )}\n <div className=\"card-description\">\n {enrollmentInfo}\n {description && (\n <>\n {description}\n </>\n )}\n </div>\n </Col>\n <ProgressCardActions tabType={tabType} redirectUrl={destinationUrl || courseUrl} />\n </Row>\n\n {tabType === (formatMessage(messages.programProgressCompletedTab).toLowerCase()) && (\n <Row className=\"pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center\">\n <Col xs={12} className=\"d-flex justify-content-between align-items-center px-0\">\n <span className=\"text-start\">\n {end && (\n formatMessage(messages.programProgressCardCompletedCertificateText, {\n certificateDate: (end ? dateFormatter(formatDate, end, 'short') : ''),\n })\n )}\n </span>\n\n <ProgressCardButton variant=\"brand\" redirectUrl={certificateUrl || ''} buttonText={formatMessage(messages.programProgressCardCompletedCertificateButton)} />\n </Col>\n </Row>\n )}\n\n {isInProgressTab && (\n <Row className=\"pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center\">\n <Col xs={12} className=\"d-flex justify-content-between align-items-center px-0\">\n {/* TODO : Certificate status will change after Upgrade is successful through api */}\n <span className=\"text-start\">\n {formatMessage(messages.programProgressInProgressCertificateStatus, {\n status: canUpgrade ? formatMessage(messages.programProgressInProgressCertificateNeedsVerified) : formatMessage(messages.programProgressInProgressCertificateNotEarned), // TODO : Certificate status will change after Upgrade is successful through api\n })}\n </span>\n\n {isProfessionalProgram\n && canUpgrade\n && getCertificatePriceString(seats)\n && (\n <ProgressCardButton\n variant=\"brand\"\n redirectUrl=\"\"\n buttonText={formatMessage(messages.programProgressCardUpgradeButton)}\n type=\"upgrade\"\n title={title}\n price={getCertificatePriceString(seats)}\n courseUrl={courseUrl}\n />\n )}\n {isMicroMastersProgram\n && checkoutUrl\n && canUpgrade\n && (\n <ProgressCardButton\n variant=\"brand\"\n redirectUrl={checkoutUrl}\n buttonText={formatMessage(messages.programProgressInProgressCourseMicromastersUpgrade, {\n price: getCertificatePriceString(seats, true),\n })}\n />\n )}\n </Col>\n </Row>\n )}\n\n </Card.Section>\n </Card>\n );\n};\n"]}
@@ -1,3 +1,15 @@
1
+ $title-color: #00262B !default;
2
+ $subtitle-color: #454545 !default;
3
+
4
+
1
5
  .progress-card{
2
- background-color: var(--pgn-color-light-200);
6
+ background-color: var(--pgn-color-light-200);
7
+
8
+ .card-title{
9
+ color: $title-color;
10
+ }
11
+
12
+ .card-description{
13
+ color: $subtitle-color;
14
+ }
3
15
  }
@@ -1,9 +1,10 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import { Button, StandardModal, useToggle, ActionRow } from '@openedx/paragon';
2
+ import { Button, StandardModal, useToggle, ActionRow, Icon } from '@openedx/paragon';
3
3
  import { useIntl } from '@openedx/frontend-base';
4
4
  import { Link } from 'react-router-dom';
5
5
  import messages from '../messages';
6
- export const ProgressCardButton = ({ variant, redirectUrl, buttonText, type, title, price, courseUrl }) => {
6
+ import { Launch } from '@openedx/paragon/icons';
7
+ export const ProgressCardButton = ({ variant, redirectUrl, buttonText, type, title, price, courseUrl, destinationUrl }) => {
7
8
  const [isOpen, open, close] = useToggle(false);
8
9
  const { formatMessage } = useIntl();
9
10
  const isUpgradeButton = type === 'upgrade' && courseUrl; // TODO : Check needs to be added to open this modal only when Upgrade api is as success
@@ -13,6 +14,9 @@ export const ProgressCardButton = ({ variant, redirectUrl, buttonText, type, tit
13
14
  if (isUpgradeButton) {
14
15
  return (_jsxs(_Fragment, { children: [_jsx(Button, { variant: variant, onClick: open, children: buttonText }), _jsx(StandardModal, { title: formatMessage(messages.programProgressInProgressCourseProfessionalUpgradeModalTitle, { title }), isOpen: isOpen, onClose: close, hasCloseButton: false, className: "program-progress-upgrade-modal", footerNode: (_jsxs(ActionRow, { children: [_jsx(Button, { variant: "tertiary", onClick: close, children: "Close" }), _jsx(Button, { as: Link, to: courseUrl, variant: "brand", "data-testid": "action-row-btn", children: formatMessage(messages.programProgressCardResumeCourseButton) })] })), isOverflowVisible: false, children: _jsx("p", { children: formatMessage(messages.programProgressInProgressCourseProfessionalUpgradeModalContent, { price }) }) })] }));
15
16
  }
17
+ if (destinationUrl) {
18
+ return (_jsxs(Button, { variant: variant, href: destinationUrl, children: [buttonText, buttonText === formatMessage(messages.programProgressPathwaysCreditPathwayLearnMore) && (_jsx(Icon, { src: Launch, className: "ms-1 ml-1.5" }))] }));
19
+ }
16
20
  return (_jsx(Button, { variant: variant, children: buttonText }));
17
21
  };
18
22
  //# sourceMappingURL=ProgressCardButton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ProgressCardButton.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/ProgressCardButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC/E,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGxC,OAAO,QAAQ,MAAM,aAAa,CAAC;AAEnC,MAAM,CAAC,MAAM,kBAAkB,GAAgC,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IACrI,MAAM,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;IAC/C,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,eAAe,GAAG,IAAI,KAAK,SAAS,IAAI,SAAS,CAAC,CAAC,wFAAwF;IAEjJ,IAAI,WAAW,EAAE,CAAC;QAChB,OAAO,CACL,KAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,WAAW,YAChD,UAAU,GACJ,CACV,CAAC;IACJ,CAAC;IAED,IAAI,eAAe,EAAE,CAAC;QACpB,OAAO,CACL,8BAGE,KAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,YAAG,UAAU,GAAU,EAC9D,KAAC,aAAa,IACZ,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,4DAA4D,EAAE,EAAE,KAAK,EAAE,CAAC,EACtG,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,KAAK,EACd,cAAc,EAAE,KAAK,EACrB,SAAS,EAAC,gCAAgC,EAC1C,UAAU,EAAE,CACV,MAAC,SAAS,eACR,KAAC,MAAM,IAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,KAAK,sBAAgB,EACzD,KAAC,MAAM,IACL,EAAE,EAAE,IAAI,EACR,EAAE,EAAE,SAAU,EACd,OAAO,EAAC,OAAO,iBACH,gBAAgB,YAE3B,aAAa,CAAC,QAAQ,CAAC,qCAAqC,CAAC,GACvD,IACC,CACb,EACD,iBAAiB,EAAE,KAAK,YAExB,sBACG,aAAa,CAAC,QAAQ,CAAC,8DAA8D,EAAE,EAAE,KAAK,EAAE,CAAC,GAChG,GACU,IACf,CACJ,CAAC;IACJ,CAAC;IAED,OAAO,CACL,KAAC,MAAM,IAAC,OAAO,EAAE,OAAO,YACrB,UAAU,GACJ,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { Button, StandardModal, useToggle, ActionRow } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport { Link } from 'react-router-dom';\n\nimport { ProgressCardButtonProps } from '../../data/types';\nimport messages from '../messages';\n\nexport const ProgressCardButton: FC<ProgressCardButtonProps> = ({ variant, redirectUrl, buttonText, type, title, price, courseUrl }) => {\n const [isOpen, open, close] = useToggle(false);\n const { formatMessage } = useIntl();\n const isUpgradeButton = type === 'upgrade' && courseUrl; // TODO : Check needs to be added to open this modal only when Upgrade api is as success\n\n if (redirectUrl) {\n return (\n <Button variant={variant} as={Link} to={redirectUrl}>\n {buttonText}\n </Button>\n );\n }\n\n if (isUpgradeButton) {\n return (\n <>\n {/* TODO rerender the page after upgrade. This is the modal after clicking the upgrade button and the upgrade is successful.\n Also, work is needed on what should happen if the upgrade fails, once confirmed */}\n <Button variant={variant} onClick={open}>{buttonText}</Button>\n <StandardModal\n title={formatMessage(messages.programProgressInProgressCourseProfessionalUpgradeModalTitle, { title })}\n isOpen={isOpen}\n onClose={close}\n hasCloseButton={false}\n className=\"program-progress-upgrade-modal\"\n footerNode={(\n <ActionRow>\n <Button variant=\"tertiary\" onClick={close}>Close</Button>\n <Button\n as={Link}\n to={courseUrl!}\n variant=\"brand\"\n data-testid=\"action-row-btn\"\n >\n {formatMessage(messages.programProgressCardResumeCourseButton)}\n </Button>\n </ActionRow>\n )}\n isOverflowVisible={false}\n >\n <p>\n {formatMessage(messages.programProgressInProgressCourseProfessionalUpgradeModalContent, { price })}\n </p>\n </StandardModal>\n </>\n );\n }\n\n return (\n <Button variant={variant}>\n {buttonText}\n </Button>\n );\n};\n"]}
1
+ {"version":3,"file":"ProgressCardButton.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/ProgressCardButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACrF,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGxC,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAEhD,MAAM,CAAC,MAAM,kBAAkB,GAAgC,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,EAAE;IACrJ,MAAM,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;IAC/C,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,eAAe,GAAG,IAAI,KAAK,SAAS,IAAI,SAAS,CAAC,CAAC,wFAAwF;IAEjJ,IAAI,WAAW,EAAE,CAAC;QAChB,OAAO,CACL,KAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,WAAW,YAChD,UAAU,GACJ,CACV,CAAC;IACJ,CAAC;IAED,IAAI,eAAe,EAAE,CAAC;QACpB,OAAO,CACL,8BAGE,KAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,YAAG,UAAU,GAAU,EAC9D,KAAC,aAAa,IACZ,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,4DAA4D,EAAE,EAAE,KAAK,EAAE,CAAC,EACtG,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,KAAK,EACd,cAAc,EAAE,KAAK,EACrB,SAAS,EAAC,gCAAgC,EAC1C,UAAU,EAAE,CACV,MAAC,SAAS,eACR,KAAC,MAAM,IAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,KAAK,sBAAgB,EACzD,KAAC,MAAM,IACL,EAAE,EAAE,IAAI,EACR,EAAE,EAAE,SAAU,EACd,OAAO,EAAC,OAAO,iBACH,gBAAgB,YAE3B,aAAa,CAAC,QAAQ,CAAC,qCAAqC,CAAC,GACvD,IACC,CACb,EACD,iBAAiB,EAAE,KAAK,YAExB,sBACG,aAAa,CAAC,QAAQ,CAAC,8DAA8D,EAAE,EAAE,KAAK,EAAE,CAAC,GAChG,GACU,IACf,CACJ,CAAC;IACJ,CAAC;IAED,IAAI,cAAc,EAAE,CAAC;QACnB,OAAO,CACL,MAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,aAC3C,UAAU,EACV,UAAU,KAAK,aAAa,CAAC,QAAQ,CAAC,6CAA6C,CAAC,IAAI,CACvF,KAAC,IAAI,IAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAC,aAAa,GAAG,CAC9C,IACM,CACV,CAAC;IACJ,CAAC;IAED,OAAO,CACL,KAAC,MAAM,IAAC,OAAO,EAAE,OAAO,YACrB,UAAU,GACJ,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { Button, StandardModal, useToggle, ActionRow, Icon } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport { Link } from 'react-router-dom';\n\nimport { ProgressCardButtonProps } from '../../data/types';\nimport messages from '../messages';\nimport { Launch } from '@openedx/paragon/icons';\n\nexport const ProgressCardButton: FC<ProgressCardButtonProps> = ({ variant, redirectUrl, buttonText, type, title, price, courseUrl, destinationUrl }) => {\n const [isOpen, open, close] = useToggle(false);\n const { formatMessage } = useIntl();\n const isUpgradeButton = type === 'upgrade' && courseUrl; // TODO : Check needs to be added to open this modal only when Upgrade api is as success\n\n if (redirectUrl) {\n return (\n <Button variant={variant} as={Link} to={redirectUrl}>\n {buttonText}\n </Button>\n );\n }\n\n if (isUpgradeButton) {\n return (\n <>\n {/* TODO rerender the page after upgrade. This is the modal after clicking the upgrade button and the upgrade is successful.\n Also, work is needed on what should happen if the upgrade fails, once confirmed */}\n <Button variant={variant} onClick={open}>{buttonText}</Button>\n <StandardModal\n title={formatMessage(messages.programProgressInProgressCourseProfessionalUpgradeModalTitle, { title })}\n isOpen={isOpen}\n onClose={close}\n hasCloseButton={false}\n className=\"program-progress-upgrade-modal\"\n footerNode={(\n <ActionRow>\n <Button variant=\"tertiary\" onClick={close}>Close</Button>\n <Button\n as={Link}\n to={courseUrl!}\n variant=\"brand\"\n data-testid=\"action-row-btn\"\n >\n {formatMessage(messages.programProgressCardResumeCourseButton)}\n </Button>\n </ActionRow>\n )}\n isOverflowVisible={false}\n >\n <p>\n {formatMessage(messages.programProgressInProgressCourseProfessionalUpgradeModalContent, { price })}\n </p>\n </StandardModal>\n </>\n );\n }\n\n if (destinationUrl) {\n return (\n <Button variant={variant} href={destinationUrl}>\n {buttonText}\n {buttonText === formatMessage(messages.programProgressPathwaysCreditPathwayLearnMore) && (\n <Icon src={Launch} className=\"ms-1 ml-1.5\" />\n )}\n </Button>\n );\n }\n\n return (\n <Button variant={variant}>\n {buttonText}\n </Button>\n );\n};\n"]}
@@ -14,6 +14,6 @@ export const ProgressCardActions = ({ tabType, redirectUrl }) => {
14
14
  const inProgressCourseCount = ((_c = courseData === null || courseData === void 0 ? void 0 : courseData.inProgress) === null || _c === void 0 ? void 0 : _c.length) || 0;
15
15
  return (_jsxs(Col, { xs: 12, className: "d-flex justify-content-md-end align-items-start mb-2", children: [tabType === formatMessage(messages.programProgressRemainingTab).toLowerCase() && remainingCourseCount > 0 && (_jsx(ProgressCardButton, { variant: "outline-primary", redirectUrl: redirectUrl || '', buttonText: formatMessage(messages.programProgressCardViewCourseDetailButton) })), ((tabType === formatMessage(messages.programProgressCompletedTab).toLowerCase() && completedCourseCount > 0)
16
16
  || (tabType === formatMessage(messages.programProgressInProgressTab).toLowerCase() && inProgressCourseCount > 0))
17
- && (_jsx(ProgressCardButton, { variant: "primary", redirectUrl: redirectUrl || '', buttonText: formatMessage(messages.programProgressCardResumeCourseButton) }))] }));
17
+ && (_jsx(ProgressCardButton, { variant: "primary", redirectUrl: redirectUrl || '', buttonText: formatMessage(messages.programProgressCardResumeCourseButton) })), tabType === formatMessage(messages.programProgressPathwaysTab).toLowerCase() && (_jsx(ProgressCardButton, { variant: "outline-primary", destinationUrl: redirectUrl || '', buttonText: formatMessage(messages.programProgressPathwaysCreditPathwayLearnMore) }))] }));
18
18
  };
19
19
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAE7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,QAAQ,MAAM,aAAa,CAAC;AAEnC,MAAM,CAAC,MAAM,mBAAmB,GAAiC,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE;;IAC5F,MAAM,EAAE,mBAAmB,EAAE,GAAG,eAAe,EAAE,CAAC;IAClD,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,MAAM,UAAU,GAAG,CAAA,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,UAAU,KAAI,EAAE,CAAC;IACzD,MAAM,oBAAoB,GAAG,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,0CAAE,MAAM,KAAI,CAAC,CAAC;IACjE,MAAM,oBAAoB,GAAG,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,0CAAE,MAAM,KAAI,CAAC,CAAC;IAChE,MAAM,qBAAqB,GAAG,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,0CAAE,MAAM,KAAI,CAAC,CAAC;IAElE,OAAO,CACL,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAC,sDAAsD,aAE1E,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,WAAW,EAAE,IAAI,oBAAoB,GAAG,CAAC,IAAI,CAC5G,KAAC,kBAAkB,IAAC,OAAO,EAAC,iBAAiB,EAAC,WAAW,EAAE,WAAW,IAAI,EAAE,EAAE,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,yCAAyC,CAAC,GAAI,CAChK,EAGA,CACC,CAAC,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,WAAW,EAAE,IAAI,oBAAoB,GAAG,CAAC,CAAC;mBACxG,CAAC,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC,CAAC,WAAW,EAAE,IAAI,qBAAqB,GAAG,CAAC,CAAC,CACjH;mBACE,CACD,KAAC,kBAAkB,IAAC,OAAO,EAAC,SAAS,EAAC,WAAW,EAAE,WAAW,IAAI,EAAE,EAAE,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,qCAAqC,CAAC,GAAI,CACpJ,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { Col } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { useProgressData } from '@src/hooks';\nimport { ProgressCardActionsProps } from '../../data/types';\nimport { ProgressCardButton } from './ProgressCardButton';\nimport messages from '../messages';\n\nexport const ProgressCardActions: FC<ProgressCardActionsProps> = ({ tabType, redirectUrl }) => {\n const { programProgressData } = useProgressData();\n const { formatMessage } = useIntl();\n\n const courseData = programProgressData?.courseData || {};\n const remainingCourseCount = courseData?.notStarted?.length || 0;\n const completedCourseCount = courseData?.completed?.length || 0;\n const inProgressCourseCount = courseData?.inProgress?.length || 0;\n\n return (\n <Col xs={12} className=\"d-flex justify-content-md-end align-items-start mb-2\">\n {/** View course details button */}\n {tabType === formatMessage(messages.programProgressRemainingTab).toLowerCase() && remainingCourseCount > 0 && (\n <ProgressCardButton variant=\"outline-primary\" redirectUrl={redirectUrl || ''} buttonText={formatMessage(messages.programProgressCardViewCourseDetailButton)} />\n )}\n\n {/** Resume course button */}\n {(\n (tabType === formatMessage(messages.programProgressCompletedTab).toLowerCase() && completedCourseCount > 0)\n || (tabType === formatMessage(messages.programProgressInProgressTab).toLowerCase() && inProgressCourseCount > 0)\n )\n && (\n <ProgressCardButton variant=\"primary\" redirectUrl={redirectUrl || ''} buttonText={formatMessage(messages.programProgressCardResumeCourseButton)} />\n )}\n </Col>\n );\n};\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAE7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,QAAQ,MAAM,aAAa,CAAC;AAEnC,MAAM,CAAC,MAAM,mBAAmB,GAAiC,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE;;IAC5F,MAAM,EAAE,mBAAmB,EAAE,GAAG,eAAe,EAAE,CAAC;IAClD,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,MAAM,UAAU,GAAG,CAAA,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,UAAU,KAAI,EAAE,CAAC;IACzD,MAAM,oBAAoB,GAAG,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,0CAAE,MAAM,KAAI,CAAC,CAAC;IACjE,MAAM,oBAAoB,GAAG,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,0CAAE,MAAM,KAAI,CAAC,CAAC;IAChE,MAAM,qBAAqB,GAAG,CAAA,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,0CAAE,MAAM,KAAI,CAAC,CAAC;IAElE,OAAO,CACL,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAC,sDAAsD,aAE1E,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,WAAW,EAAE,IAAI,oBAAoB,GAAG,CAAC,IAAI,CAC5G,KAAC,kBAAkB,IAAC,OAAO,EAAC,iBAAiB,EAAC,WAAW,EAAE,WAAW,IAAI,EAAE,EAAE,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,yCAAyC,CAAC,GAAI,CAChK,EAGA,CACC,CAAC,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,WAAW,EAAE,IAAI,oBAAoB,GAAG,CAAC,CAAC;mBACxG,CAAC,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,4BAA4B,CAAC,CAAC,WAAW,EAAE,IAAI,qBAAqB,GAAG,CAAC,CAAC,CACjH;mBACE,CACD,KAAC,kBAAkB,IAAC,OAAO,EAAC,SAAS,EAAC,WAAW,EAAE,WAAW,IAAI,EAAE,EAAE,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,qCAAqC,CAAC,GAAI,CACpJ,EAGA,OAAO,KAAK,aAAa,CAAC,QAAQ,CAAC,0BAA0B,CAAC,CAAC,WAAW,EAAE,IAAI,CAC/E,KAAC,kBAAkB,IAAC,OAAO,EAAC,iBAAiB,EAAC,cAAc,EAAE,WAAW,IAAI,EAAE,EAAE,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,6CAA6C,CAAC,GAAI,CACvK,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { Col } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { useProgressData } from '@src/hooks';\nimport { ProgressCardActionsProps } from '../../data/types';\nimport { ProgressCardButton } from './ProgressCardButton';\nimport messages from '../messages';\n\nexport const ProgressCardActions: FC<ProgressCardActionsProps> = ({ tabType, redirectUrl }) => {\n const { programProgressData } = useProgressData();\n const { formatMessage } = useIntl();\n\n const courseData = programProgressData?.courseData || {};\n const remainingCourseCount = courseData?.notStarted?.length || 0;\n const completedCourseCount = courseData?.completed?.length || 0;\n const inProgressCourseCount = courseData?.inProgress?.length || 0;\n\n return (\n <Col xs={12} className=\"d-flex justify-content-md-end align-items-start mb-2\">\n {/** View course details button */}\n {tabType === formatMessage(messages.programProgressRemainingTab).toLowerCase() && remainingCourseCount > 0 && (\n <ProgressCardButton variant=\"outline-primary\" redirectUrl={redirectUrl || ''} buttonText={formatMessage(messages.programProgressCardViewCourseDetailButton)} />\n )}\n\n {/** Resume course button */}\n {(\n (tabType === formatMessage(messages.programProgressCompletedTab).toLowerCase() && completedCourseCount > 0)\n || (tabType === formatMessage(messages.programProgressInProgressTab).toLowerCase() && inProgressCourseCount > 0)\n )\n && (\n <ProgressCardButton variant=\"primary\" redirectUrl={redirectUrl || ''} buttonText={formatMessage(messages.programProgressCardResumeCourseButton)} />\n )}\n\n {/** Learn more button */}\n {tabType === formatMessage(messages.programProgressPathwaysTab).toLowerCase() && (\n <ProgressCardButton variant=\"outline-primary\" destinationUrl={redirectUrl || ''} buttonText={formatMessage(messages.programProgressPathwaysCreditPathwayLearnMore)} />\n )}\n </Col>\n );\n};\n"]}
@@ -23,4 +23,8 @@
23
23
  .btn-tertiary{
24
24
  border: none;
25
25
  }
26
+ }
27
+
28
+ .pathways-tab-description{
29
+ white-space: pre-line;
26
30
  }
@@ -189,5 +189,35 @@ declare const messages: {
189
189
  id: string;
190
190
  description: string;
191
191
  };
192
+ programProgressPathwaysCreditPathwayTitle: {
193
+ defaultMessage: string;
194
+ id: string;
195
+ description: string;
196
+ };
197
+ programProgressPathwaysCreditPathwayDescription: {
198
+ defaultMessage: string;
199
+ id: string;
200
+ description: string;
201
+ };
202
+ programProgressPathwaysCreditPathwayLearnMore: {
203
+ defaultMessage: string;
204
+ id: string;
205
+ description: string;
206
+ };
207
+ programProgressPathwaysCreditPathwayFaqButton: {
208
+ defaultMessage: string;
209
+ id: string;
210
+ description: string;
211
+ };
212
+ programProgressPathwaysCreditPathwayFaqTitle: {
213
+ defaultMessage: string;
214
+ id: string;
215
+ description: string;
216
+ };
217
+ programProgressPathwaysCreditPathwayFaqDescription: {
218
+ defaultMessage: string;
219
+ id: string;
220
+ description: string;
221
+ };
192
222
  };
193
223
  export default messages;
@@ -190,6 +190,36 @@ const messages = defineMessages({
190
190
  id: 'program.progress.in.progress.certificate.not.earned',
191
191
  description: 'Certificate status indicating that the certificate has not been earned yet for courses in the In Progress tab.',
192
192
  },
193
+ programProgressPathwaysCreditPathwayTitle: {
194
+ defaultMessage: 'Credit pathways',
195
+ id: 'program.progress.pathways.credit.pathway.title',
196
+ description: 'Title for the Credit Pathway section in the Pathways tab.',
197
+ },
198
+ programProgressPathwaysCreditPathwayDescription: {
199
+ defaultMessage: 'Transform your RWTHx MicroMasters into a full master’s degree. {br}Successful completion of RWTHx Managing Technology & Innovation: How to deal with disruptive change credential can be applied towards flexible, rigorous, and affordable masters degrees from the world’s leading universities.',
200
+ id: 'program.progress.pathways.credit.pathway.description',
201
+ description: 'Description for the Credit Pathway section in the Pathways tab.',
202
+ },
203
+ programProgressPathwaysCreditPathwayLearnMore: {
204
+ defaultMessage: 'Learn more',
205
+ id: 'program.progress.pathways.credit.pathway.learn.more',
206
+ description: 'Text for the Learn More link in the Credit Pathway section of the Pathways tab.',
207
+ },
208
+ programProgressPathwaysCreditPathwayFaqButton: {
209
+ defaultMessage: 'MicroMasters Credit FAQ',
210
+ id: 'program.progress.pathways.credit.pathway.faq',
211
+ description: 'Text for the FAQ link in the Credit Pathway section of the Pathways tab.',
212
+ },
213
+ programProgressPathwaysCreditPathwayFaqTitle: {
214
+ defaultMessage: 'Learn more about how to transfer your MicroMasters',
215
+ id: 'program.progress.pathways.credit.pathway.faq.title',
216
+ description: 'Title for the FAQ section in the Credit Pathway section of the Pathways tab.',
217
+ },
218
+ programProgressPathwaysCreditPathwayFaqDescription: {
219
+ defaultMessage: 'Helper copy to be updated here. Information about how to earn and transfer credits from edX partners to university institutions',
220
+ id: 'program.progress.pathways.credit.pathway.faq.description',
221
+ description: 'Description for the FAQ section in the Credit Pathway section of the Pathways tab.',
222
+ },
193
223
  });
194
224
  export default messages;
195
225
  //# sourceMappingURL=messages.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../../src/containers/ProgramDashboard/ProgramProgress/messages.ts"],"names":[],"mappings":"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","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n programProgressInstitutions: {\n defaultMessage: 'Institutions',\n id: 'program.progress.institutions',\n description: 'Label text for organization image logos',\n },\n programTypeLabel: {\n defaultMessage: '{programType} program',\n id: 'program.progress.program.type.label',\n description: 'Label displaying the program type (e.g. \"MicroMasters program\", \"Professional Certificate program\")',\n },\n programProgressCompleteHeader: {\n defaultMessage: 'Congratulations!',\n id: 'program.progress.complete.header',\n description: 'header text for the program progress page when all courses are complete',\n },\n programProgressCompleteText: {\n defaultMessage: 'You have successfully completed all the requirements for {programTitle}.',\n id: 'program.progress.complete.text',\n description: 'text to display when a user has completed all of the courses for the program',\n },\n programProgressIncompleteHeader: {\n defaultMessage: 'Your Program Journey',\n id: 'program.progress.incomplete.header',\n description: 'header text to display when the user has remaining incomplete courses in the program',\n },\n programProgressIncompleteText: {\n defaultMessage: 'Track and plan your progress through the {totalCoursesInProgram} courses in this program. To complete the program, you must earn a verified certificate for each course.',\n id: 'program.progress.incomplete.text',\n description: 'text to display when a user has not completed all of the courses for a program',\n },\n programProgressCardCompletedCertificateText: {\n defaultMessage: 'You earned the certificate on {certificateDate}',\n id: 'program.progress.card.completed.certificate.text',\n description: 'text to display on the progress card completed tab related to the certificate status for the course',\n },\n programProgressCardCompletedCertificateButton: {\n defaultMessage: 'View certificate',\n id: 'program.progress.card.completed.certificate.button.text',\n description: 'text to display on the progress card on certificate button for completed courses',\n },\n programProgressCardViewCourseDetailButton: {\n defaultMessage: 'View course details',\n id: 'program.progress.card.view.course.detail.button.text',\n description: 'text to display on the progress card for the view course details button',\n },\n programProgressCardResumeCourseButton: {\n defaultMessage: 'Resume course',\n id: 'program.progress.card.resume.course.button.text',\n description: 'text to display on the progress card for the resume course button',\n },\n programProgressCardUpgradeButton: {\n defaultMessage: 'Upgrade with your subscription',\n id: 'program.progress.card.upgrade.button.text',\n description: 'text to display on the progress card for the upgrade button',\n },\n programProgressCardEnrollText: {\n defaultMessage: 'Enrolled:',\n id: 'program.progress.card.enroll.text',\n description: 'text to display on the progress card for the enrolled status of the course',\n },\n programProgressCardStartText: {\n defaultMessage: 'Started',\n id: 'program.progress.card.start.text',\n description: 'text to display on the progress card for the start date of the course',\n },\n programProgressInProgressTab: {\n defaultMessage: 'In progress',\n id: 'program.progress.in.progress.tab',\n description: 'Label for the \"In progress\" tab on the program progress page, which lists courses that the user has started but not yet completed.',\n },\n programProgressRemainingTab: {\n defaultMessage: 'Remaining',\n id: 'program.progress.remaining.tab',\n description: 'Label for the \"Remaining\" tab on the program progress page, which lists courses that the user has not yet started.',\n },\n programProgressCompletedTab: {\n defaultMessage: 'Completed',\n id: 'program.progress.completed.tab',\n description: 'Label for the \"Completed\" tab on the program progress page, which lists courses that the user has completed.',\n },\n programProgressPathwaysTab: {\n defaultMessage: 'Pathways',\n id: 'program.progress.pathways.tab',\n description: 'Label for the \"Pathways\" tab on the program progress page, which gives details of how the program can be used to further the learners education. This tab is only shown for MicroMasters programs.',\n },\n programProgressRemainingCourse: {\n defaultMessage: 'Remaining Courses',\n id: 'program.progress.remaining.course',\n description: 'Header text to be displayed inside the Remaining tab of the program progress page.',\n },\n programProgressRemainingTabNoCourse: {\n defaultMessage: \"You have enrolled in all of this program's courses.\",\n id: 'program.progress.remaining.tab.no.course',\n description: 'Text to display on the Remaining tab of the program progress page when there is no course remaining for the user',\n },\n programProgressCompletedCourse: {\n defaultMessage: 'Completed courses',\n id: 'program.progress.completed.course',\n description: 'Header text to be displayed inside the Completed tab of the program progress page.',\n },\n programProgressCompletedTabNoCourse: {\n defaultMessage: 'As you complete courses, you will see them listed here.',\n id: 'program.progress.completed.tab.no.course',\n description: 'Text to display on the Completed tab of the program progress page when no course is completed for the user',\n },\n programProgressCompletedBannerTitle: {\n defaultMessage: 'Earning a program record',\n id: 'program.progress.completed.banner.title',\n description: 'Title text for the banner displayed on the Completed tab of the program progress page.',\n },\n programProgressCompletedBannerDescription: {\n defaultMessage: 'Once you meet all course and program requirements, you will receive a program record and your professional certificate.',\n id: 'program.progress.completed.banner.description',\n description: 'Description text for the banner displayed on the Completed tab of the program progress page.',\n },\n programProgressCompletedBannerHelpCenterButton: {\n defaultMessage: 'Help center',\n id: 'program.progress.completed.banner.help.center.button',\n description: 'Text for the Help Center button displayed on the banner in the Completed tab of the program progress page.',\n },\n programProgressCompletedBannerMyProgramRecordsButton: {\n defaultMessage: 'My program records',\n id: 'program.progress.completed.banner.my.program.records.button',\n description: 'Text for the My Program Records button displayed on the banner in the Completed tab of the program progress page.',\n },\n programProgressEarnedCertificates: {\n defaultMessage: 'Earned Certificates',\n id: 'program.progress.earned.certificates',\n description: 'Label shown in the program progress circle',\n },\n programProgressCertificateLabel: {\n defaultMessage: 'Program Certificate Progress',\n id: 'program.progress.certificate.program.progress',\n description: 'Label shown under the program progress circle',\n },\n programProgressCertificateContentOne: {\n defaultMessage: 'Earn a professional certificate when you meet requirements for all courses in the series.',\n id: 'program.progress.certificate.content.one',\n description: 'First content paragraph shown under the program progress circle',\n },\n programProgressCertificateContentTwo: {\n defaultMessage: \"This program is valued at '{'{price}'}' for non-subscribers.\",\n id: 'program.progress.certificate.content.two',\n description: 'Second content paragraph shown under the program progress circle',\n },\n programProgressInProgressCourse: {\n defaultMessage: 'Courses in progress',\n id: 'program.progress.in.progress.course',\n description: 'Header text to be displayed inside the In Progress tab of the program progress page.',\n },\n programProgressInProgressCourseMicromastersUpgrade: {\n defaultMessage: 'Upgrade to verified for {price}',\n id: 'program.progress.in.progress.course.micromasters.upgrade',\n description: 'Upgrade message for Micromasters courses in the In Progress tab.',\n },\n programProgressInProgressRemainingCourses: {\n defaultMessage: 'Enroll in the next course in the program.',\n id: 'program.progress.in.progress.remaining.courses',\n description: 'Message for remaining courses in the In Progress tab.',\n },\n programProgressInProgressCompletedCourses: {\n defaultMessage: 'You have completed all courses in the program.',\n id: 'program.progress.in.progress.completed.courses',\n description: 'Message for completed courses in the In Progress tab.',\n },\n programProgressInProgressCourseProfessionalUpgradeModalTitle: {\n defaultMessage: 'You now have full access to the {title}',\n id: 'program.progress.in.progress.course.professional.upgrade.modal.title',\n description: 'Modal title for Professional Certificate courses in the In Progress tab.',\n },\n programProgressInProgressCourseProfessionalUpgradeModalContent: {\n defaultMessage: \"You're saving as a subscriber. This course is valued at {price}.\",\n id: 'program.progress.in.progress.course.professional.upgrade.modal.content',\n description: 'Modal content for Professional Certificate courses in the In Progress tab.',\n },\n programProgressInProgressCertificateStatus: {\n defaultMessage: 'Certificate Status: {status}',\n id: 'program.progress.in.progress.certificate.status',\n description: 'Certificate status for courses in the In Progress tab.',\n },\n programProgressInProgressCertificateNeedsVerified: {\n defaultMessage: 'Needs verified certificate',\n id: 'program.progress.in.progress.certificate.needs.verified',\n description: 'Certificate status indicating that a verified certificate is needed for courses in the In Progress tab.',\n },\n programProgressInProgressCertificateNotEarned: {\n defaultMessage: 'Not earned yet',\n id: 'program.progress.in.progress.certificate.not.earned',\n description: 'Certificate status indicating that the certificate has not been earned yet for courses in the In Progress tab.',\n },\n});\n\nexport default messages;\n"]}
1
+ {"version":3,"file":"messages.js","sourceRoot":"","sources":["../../../../src/containers/ProgramDashboard/ProgramProgress/messages.ts"],"names":[],"mappings":"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","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n programProgressInstitutions: {\n defaultMessage: 'Institutions',\n id: 'program.progress.institutions',\n description: 'Label text for organization image logos',\n },\n programTypeLabel: {\n defaultMessage: '{programType} program',\n id: 'program.progress.program.type.label',\n description: 'Label displaying the program type (e.g. \"MicroMasters program\", \"Professional Certificate program\")',\n },\n programProgressCompleteHeader: {\n defaultMessage: 'Congratulations!',\n id: 'program.progress.complete.header',\n description: 'header text for the program progress page when all courses are complete',\n },\n programProgressCompleteText: {\n defaultMessage: 'You have successfully completed all the requirements for {programTitle}.',\n id: 'program.progress.complete.text',\n description: 'text to display when a user has completed all of the courses for the program',\n },\n programProgressIncompleteHeader: {\n defaultMessage: 'Your Program Journey',\n id: 'program.progress.incomplete.header',\n description: 'header text to display when the user has remaining incomplete courses in the program',\n },\n programProgressIncompleteText: {\n defaultMessage: 'Track and plan your progress through the {totalCoursesInProgram} courses in this program. To complete the program, you must earn a verified certificate for each course.',\n id: 'program.progress.incomplete.text',\n description: 'text to display when a user has not completed all of the courses for a program',\n },\n programProgressCardCompletedCertificateText: {\n defaultMessage: 'You earned the certificate on {certificateDate}',\n id: 'program.progress.card.completed.certificate.text',\n description: 'text to display on the progress card completed tab related to the certificate status for the course',\n },\n programProgressCardCompletedCertificateButton: {\n defaultMessage: 'View certificate',\n id: 'program.progress.card.completed.certificate.button.text',\n description: 'text to display on the progress card on certificate button for completed courses',\n },\n programProgressCardViewCourseDetailButton: {\n defaultMessage: 'View course details',\n id: 'program.progress.card.view.course.detail.button.text',\n description: 'text to display on the progress card for the view course details button',\n },\n programProgressCardResumeCourseButton: {\n defaultMessage: 'Resume course',\n id: 'program.progress.card.resume.course.button.text',\n description: 'text to display on the progress card for the resume course button',\n },\n programProgressCardUpgradeButton: {\n defaultMessage: 'Upgrade with your subscription',\n id: 'program.progress.card.upgrade.button.text',\n description: 'text to display on the progress card for the upgrade button',\n },\n programProgressCardEnrollText: {\n defaultMessage: 'Enrolled:',\n id: 'program.progress.card.enroll.text',\n description: 'text to display on the progress card for the enrolled status of the course',\n },\n programProgressCardStartText: {\n defaultMessage: 'Started',\n id: 'program.progress.card.start.text',\n description: 'text to display on the progress card for the start date of the course',\n },\n programProgressInProgressTab: {\n defaultMessage: 'In progress',\n id: 'program.progress.in.progress.tab',\n description: 'Label for the \"In progress\" tab on the program progress page, which lists courses that the user has started but not yet completed.',\n },\n programProgressRemainingTab: {\n defaultMessage: 'Remaining',\n id: 'program.progress.remaining.tab',\n description: 'Label for the \"Remaining\" tab on the program progress page, which lists courses that the user has not yet started.',\n },\n programProgressCompletedTab: {\n defaultMessage: 'Completed',\n id: 'program.progress.completed.tab',\n description: 'Label for the \"Completed\" tab on the program progress page, which lists courses that the user has completed.',\n },\n programProgressPathwaysTab: {\n defaultMessage: 'Pathways',\n id: 'program.progress.pathways.tab',\n description: 'Label for the \"Pathways\" tab on the program progress page, which gives details of how the program can be used to further the learners education. This tab is only shown for MicroMasters programs.',\n },\n programProgressRemainingCourse: {\n defaultMessage: 'Remaining Courses',\n id: 'program.progress.remaining.course',\n description: 'Header text to be displayed inside the Remaining tab of the program progress page.',\n },\n programProgressRemainingTabNoCourse: {\n defaultMessage: \"You have enrolled in all of this program's courses.\",\n id: 'program.progress.remaining.tab.no.course',\n description: 'Text to display on the Remaining tab of the program progress page when there is no course remaining for the user',\n },\n programProgressCompletedCourse: {\n defaultMessage: 'Completed courses',\n id: 'program.progress.completed.course',\n description: 'Header text to be displayed inside the Completed tab of the program progress page.',\n },\n programProgressCompletedTabNoCourse: {\n defaultMessage: 'As you complete courses, you will see them listed here.',\n id: 'program.progress.completed.tab.no.course',\n description: 'Text to display on the Completed tab of the program progress page when no course is completed for the user',\n },\n programProgressCompletedBannerTitle: {\n defaultMessage: 'Earning a program record',\n id: 'program.progress.completed.banner.title',\n description: 'Title text for the banner displayed on the Completed tab of the program progress page.',\n },\n programProgressCompletedBannerDescription: {\n defaultMessage: 'Once you meet all course and program requirements, you will receive a program record and your professional certificate.',\n id: 'program.progress.completed.banner.description',\n description: 'Description text for the banner displayed on the Completed tab of the program progress page.',\n },\n programProgressCompletedBannerHelpCenterButton: {\n defaultMessage: 'Help center',\n id: 'program.progress.completed.banner.help.center.button',\n description: 'Text for the Help Center button displayed on the banner in the Completed tab of the program progress page.',\n },\n programProgressCompletedBannerMyProgramRecordsButton: {\n defaultMessage: 'My program records',\n id: 'program.progress.completed.banner.my.program.records.button',\n description: 'Text for the My Program Records button displayed on the banner in the Completed tab of the program progress page.',\n },\n programProgressEarnedCertificates: {\n defaultMessage: 'Earned Certificates',\n id: 'program.progress.earned.certificates',\n description: 'Label shown in the program progress circle',\n },\n programProgressCertificateLabel: {\n defaultMessage: 'Program Certificate Progress',\n id: 'program.progress.certificate.program.progress',\n description: 'Label shown under the program progress circle',\n },\n programProgressCertificateContentOne: {\n defaultMessage: 'Earn a professional certificate when you meet requirements for all courses in the series.',\n id: 'program.progress.certificate.content.one',\n description: 'First content paragraph shown under the program progress circle',\n },\n programProgressCertificateContentTwo: {\n defaultMessage: \"This program is valued at '{'{price}'}' for non-subscribers.\",\n id: 'program.progress.certificate.content.two',\n description: 'Second content paragraph shown under the program progress circle',\n },\n programProgressInProgressCourse: {\n defaultMessage: 'Courses in progress',\n id: 'program.progress.in.progress.course',\n description: 'Header text to be displayed inside the In Progress tab of the program progress page.',\n },\n programProgressInProgressCourseMicromastersUpgrade: {\n defaultMessage: 'Upgrade to verified for {price}',\n id: 'program.progress.in.progress.course.micromasters.upgrade',\n description: 'Upgrade message for Micromasters courses in the In Progress tab.',\n },\n programProgressInProgressRemainingCourses: {\n defaultMessage: 'Enroll in the next course in the program.',\n id: 'program.progress.in.progress.remaining.courses',\n description: 'Message for remaining courses in the In Progress tab.',\n },\n programProgressInProgressCompletedCourses: {\n defaultMessage: 'You have completed all courses in the program.',\n id: 'program.progress.in.progress.completed.courses',\n description: 'Message for completed courses in the In Progress tab.',\n },\n programProgressInProgressCourseProfessionalUpgradeModalTitle: {\n defaultMessage: 'You now have full access to the {title}',\n id: 'program.progress.in.progress.course.professional.upgrade.modal.title',\n description: 'Modal title for Professional Certificate courses in the In Progress tab.',\n },\n programProgressInProgressCourseProfessionalUpgradeModalContent: {\n defaultMessage: \"You're saving as a subscriber. This course is valued at {price}.\",\n id: 'program.progress.in.progress.course.professional.upgrade.modal.content',\n description: 'Modal content for Professional Certificate courses in the In Progress tab.',\n },\n programProgressInProgressCertificateStatus: {\n defaultMessage: 'Certificate Status: {status}',\n id: 'program.progress.in.progress.certificate.status',\n description: 'Certificate status for courses in the In Progress tab.',\n },\n programProgressInProgressCertificateNeedsVerified: {\n defaultMessage: 'Needs verified certificate',\n id: 'program.progress.in.progress.certificate.needs.verified',\n description: 'Certificate status indicating that a verified certificate is needed for courses in the In Progress tab.',\n },\n programProgressInProgressCertificateNotEarned: {\n defaultMessage: 'Not earned yet',\n id: 'program.progress.in.progress.certificate.not.earned',\n description: 'Certificate status indicating that the certificate has not been earned yet for courses in the In Progress tab.',\n },\n programProgressPathwaysCreditPathwayTitle: {\n defaultMessage: 'Credit pathways',\n id: 'program.progress.pathways.credit.pathway.title',\n description: 'Title for the Credit Pathway section in the Pathways tab.',\n },\n programProgressPathwaysCreditPathwayDescription: {\n defaultMessage: 'Transform your RWTHx MicroMasters into a full master’s degree. {br}Successful completion of RWTHx Managing Technology & Innovation: How to deal with disruptive change credential can be applied towards flexible, rigorous, and affordable masters degrees from the world’s leading universities.',\n id: 'program.progress.pathways.credit.pathway.description',\n description: 'Description for the Credit Pathway section in the Pathways tab.',\n },\n programProgressPathwaysCreditPathwayLearnMore: {\n defaultMessage: 'Learn more',\n id: 'program.progress.pathways.credit.pathway.learn.more',\n description: 'Text for the Learn More link in the Credit Pathway section of the Pathways tab.',\n },\n programProgressPathwaysCreditPathwayFaqButton: {\n defaultMessage: 'MicroMasters Credit FAQ',\n id: 'program.progress.pathways.credit.pathway.faq',\n description: 'Text for the FAQ link in the Credit Pathway section of the Pathways tab.',\n },\n programProgressPathwaysCreditPathwayFaqTitle: {\n defaultMessage: 'Learn more about how to transfer your MicroMasters',\n id: 'program.progress.pathways.credit.pathway.faq.title',\n description: 'Title for the FAQ section in the Credit Pathway section of the Pathways tab.',\n },\n programProgressPathwaysCreditPathwayFaqDescription: {\n defaultMessage: 'Helper copy to be updated here. Information about how to earn and transfer credits from edX partners to university institutions',\n id: 'program.progress.pathways.credit.pathway.faq.description',\n description: 'Description for the FAQ section in the Credit Pathway section of the Pathways tab.',\n },\n});\n\nexport default messages;\n"]}
@@ -1,25 +1,26 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useEffect, useState, useMemo } from 'react';
3
- import { Alert, Icon, Button } from '@openedx/paragon';
4
- import { CheckCircle, Info, OpenInNew } from '@openedx/paragon/icons';
3
+ import { Alert, Button } from '@openedx/paragon';
4
+ import { CheckCircle } from '@openedx/paragon/icons';
5
5
  import { useIntl } from '@openedx/frontend-base';
6
6
  import moment from 'moment';
7
7
  import { utilHooks } from '../../../hooks';
8
8
  import messages from '../messages';
9
- import { subscriptionRenewalURL } from '../../../data/constants/app';
9
+ import { subscriptionRenewalURL, checkoutPageURL } from '../../../data/constants/app';
10
+ import { Link } from 'react-router-dom';
10
11
  // TODO: We can replace the below hardcoded subscriptionBannerData with the actual data from the API once we have the API ready.
11
12
  // For now, we can use this hardcoded data to test the SubscriptionBanner component.
12
13
  // Refer to https://2u-internal.atlassian.net/browse/SUBS-442 for more details on the API integration.
13
14
  // And https://github.com/edx/frontend-app-subscription-learner-dashboard/pull/2#discussion_r3139442324 for the implementation details of the API integration.
15
+ // Test cases for the trial case are already written in the SubscriptionBanner.test.tsx file. We can update the test cases to use the actual API data once we have the API ready.
14
16
  const subscriptionBannerData = {
15
17
  isSubscribed: true,
16
- subscriptionStatus: 'trial', // can be 'active', 'cancelled', 'expired'
18
+ status: 'trial', // can be 'active', 'cancelled', 'renewalFailed'
17
19
  subscriptionStartDate: '2026-05-22',
18
20
  subscriptionEndDate: '2026-07-22',
19
21
  subscriptionRenewalDate: '2026-07-22',
20
22
  subscriptionRenewalPrice: '$36',
21
23
  };
22
- // TODO: Also update as per new designs once we have the designs ready for the other subscription types than 'trial'.
23
24
  export const SubscriptionBanner = () => {
24
25
  var _a;
25
26
  const { formatMessage } = useIntl();
@@ -34,14 +35,12 @@ export const SubscriptionBanner = () => {
34
35
  const trialDaysLeft = trialEndDate.isValid()
35
36
  ? Math.max(0, trialEndDate.diff(today, 'days'))
36
37
  : 0;
37
- switch (subscriptionBannerData.subscriptionStatus) {
38
+ switch (subscriptionBannerData.status) {
38
39
  case 'active':
39
40
  setBannerVariant('success');
40
41
  setBannerTitle(formatMessage(messages.activeSubscriptionTitle));
41
42
  setBannerBody(formatMessage(messages.activeSubscriptionBody, {
42
- subscriptionStartDate: formatDate(subscriptionBannerData.subscriptionStartDate),
43
43
  subscriptionRenewalDate: formatDate(subscriptionBannerData.subscriptionRenewalDate),
44
- subscriptionRenewalPrice: subscriptionBannerData.subscriptionRenewalPrice,
45
44
  }));
46
45
  break;
47
46
  case 'trial':
@@ -62,10 +61,17 @@ export const SubscriptionBanner = () => {
62
61
  }));
63
62
  break;
64
63
  case 'cancelled':
65
- setBannerVariant('warning');
64
+ setBannerVariant('light');
66
65
  setBannerTitle(formatMessage(messages.cancelledSubscriptionTitle));
67
66
  setBannerBody(formatMessage(messages.cancelledSubscriptionBody, {
68
- subscriptionEndDate: formatDate(subscriptionBannerData.subscriptionStartDate),
67
+ subscriptionEndDate: formatDate(subscriptionBannerData.subscriptionEndDate),
68
+ }));
69
+ break;
70
+ case 'renewalFailed': // also known as 'Payment Error' in figma designs
71
+ setBannerVariant('light');
72
+ setBannerTitle(formatMessage(messages.renewalFailedTitle));
73
+ setBannerBody(formatMessage(messages.renewalFailedBody, {
74
+ subscriptionRenewalDate: formatDate(subscriptionBannerData.subscriptionRenewalDate),
69
75
  }));
70
76
  break;
71
77
  default:
@@ -74,9 +80,14 @@ export const SubscriptionBanner = () => {
74
80
  }
75
81
  }, [formatDate, formatMessage]);
76
82
  const getSubscriptionAction = useMemo(() => {
77
- if (subscriptionBannerData.subscriptionStatus === 'cancelled') {
83
+ if (subscriptionBannerData.status === 'cancelled') {
84
+ return ([
85
+ _jsx(Button, { "data-testid": "renew-button", className: "renew-button", variant: "primary", href: subscriptionRenewalURL, target: "_blank", rel: "noopener noreferrer", role: "link", children: formatMessage(messages.renewSubscriptionButton) }, "renew-subscription"),
86
+ ]);
87
+ }
88
+ else if (subscriptionBannerData.status === 'renewalFailed') {
78
89
  return ([
79
- _jsxs(Button, { "data-testid": "renew-button", className: "renew-button", variant: "primary", href: subscriptionRenewalURL, target: "_blank", rel: "noopener noreferrer", role: "link", children: [formatMessage(messages.renewSubscriptionButton), _jsx(Icon, { src: OpenInNew, className: "mr-2 in-new-icon" })] }, "renew-subscription"),
90
+ _jsx(Button, { "data-testid": "renew-failed-button", className: "renew-failed-button", variant: "primary", to: checkoutPageURL, target: "_blank", rel: "noopener noreferrer", role: "link", as: Link, children: formatMessage(messages.renewalFailedButton) }, "renew-failed-subscription"),
80
91
  ]);
81
92
  }
82
93
  else {
@@ -84,11 +95,9 @@ export const SubscriptionBanner = () => {
84
95
  }
85
96
  }, [formatMessage]);
86
97
  const subscriptionStatusIcons = {
87
- trial: undefined,
88
- cancelled: Info,
89
98
  active: CheckCircle,
90
99
  };
91
- const bannerIcon = (_a = subscriptionStatusIcons[subscriptionBannerData.subscriptionStatus]) !== null && _a !== void 0 ? _a : undefined;
100
+ const bannerIcon = (_a = subscriptionStatusIcons[subscriptionBannerData.status]) !== null && _a !== void 0 ? _a : undefined;
92
101
  return (_jsx("div", { className: "mt-4.5 mb-4.5", children: _jsxs(Alert, { variant: bannerVariant, icon: bannerIcon, dismissible: true, closeLabel: "Dismiss", show: showPageBanner, onClose: () => setShowPageBanner(false), actions: getSubscriptionAction, children: [_jsx(Alert.Heading, { children: bannerTitle }), _jsx("p", { children: bannerBody })] }) }));
93
102
  };
94
103
  //# sourceMappingURL=SubscriptionBanner.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SubscriptionBanner.js","sourceRoot":"","sources":["../../../../src/containers/SubscriptionBanner/components/SubscriptionBanner.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useEffect, useState, useMemo } from 'react';\nimport { Alert, Icon, Button, Variant } from '@openedx/paragon';\nimport { CheckCircle, Info, OpenInNew } from '@openedx/paragon/icons';\nimport { useIntl } from '@openedx/frontend-base';\nimport moment from 'moment';\nimport { utilHooks } from '@src/hooks';\nimport messages from '../messages';\nimport { subscriptionRenewalURL } from '@src/data/constants/app';\n\n// TODO: We can replace the below hardcoded subscriptionBannerData 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 SubscriptionBanner component.\n// Refer to https://2u-internal.atlassian.net/browse/SUBS-442 for more details on the API integration.\n// And https://github.com/edx/frontend-app-subscription-learner-dashboard/pull/2#discussion_r3139442324 for the implementation details of the API integration.\nconst subscriptionBannerData = {\n isSubscribed: true,\n subscriptionStatus: 'trial', // can be 'active', 'cancelled', 'expired'\n subscriptionStartDate: '2026-05-22',\n subscriptionEndDate: '2026-07-22',\n subscriptionRenewalDate: '2026-07-22',\n subscriptionRenewalPrice: '$36',\n};\n\n// TODO: Also update as per new designs once we have the designs ready for the other subscription types than 'trial'.\nexport const SubscriptionBanner: FC = () => {\n const { formatMessage } = useIntl();\n const [showPageBanner, setShowPageBanner] = useState<boolean>(true);\n const [bannerBody, setBannerBody] = useState('');\n const [bannerTitle, setBannerTitle] = useState('');\n const [bannerVariant, setBannerVariant] = useState<Variant | undefined>(undefined);\n const formatDate = utilHooks.useFormatDate();\n\n useEffect(() => {\n const trialEndDate = moment(subscriptionBannerData.subscriptionEndDate).startOf('day');\n const today = moment().startOf('day');\n const trialDaysLeft = trialEndDate.isValid()\n ? Math.max(0, trialEndDate.diff(today, 'days'))\n : 0;\n\n switch (subscriptionBannerData.subscriptionStatus) {\n case 'active':\n setBannerVariant('success');\n setBannerTitle(formatMessage(messages.activeSubscriptionTitle));\n setBannerBody(formatMessage(messages.activeSubscriptionBody, {\n subscriptionStartDate: formatDate(subscriptionBannerData.subscriptionStartDate),\n subscriptionRenewalDate: formatDate(subscriptionBannerData.subscriptionRenewalDate),\n subscriptionRenewalPrice: subscriptionBannerData.subscriptionRenewalPrice,\n }));\n break;\n case 'trial':\n setBannerVariant('success');\n if (trialDaysLeft === 0) {\n setBannerTitle(formatMessage(messages.activeTrialSubscriptionTitleToday));\n } else if (trialDaysLeft === 1) {\n setBannerTitle(formatMessage(messages.activeTrialSubscriptionTitleTomorrow));\n } else {\n setBannerTitle(formatMessage(messages.activeTrialSubscriptionTitle, {\n daysLeft: trialDaysLeft,\n }));\n }\n setBannerBody(formatMessage(messages.activeTrialSubscriptionBody, {\n subscriptionEndDate: formatDate(subscriptionBannerData.subscriptionEndDate),\n }));\n break;\n case 'cancelled':\n setBannerVariant('warning');\n setBannerTitle(formatMessage(messages.cancelledSubscriptionTitle));\n setBannerBody(formatMessage(messages.cancelledSubscriptionBody, {\n subscriptionEndDate: formatDate(subscriptionBannerData.subscriptionStartDate),\n }));\n break;\n default:\n setShowPageBanner(false);\n break;\n }\n }, [formatDate, formatMessage]);\n\n const getSubscriptionAction = useMemo(() => {\n if (subscriptionBannerData.subscriptionStatus === 'cancelled') {\n return (\n [\n <Button\n key=\"renew-subscription\"\n data-testid=\"renew-button\"\n className=\"renew-button\"\n variant=\"primary\"\n href={subscriptionRenewalURL}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n role=\"link\"\n >\n {formatMessage(messages.renewSubscriptionButton)}\n <Icon\n src={OpenInNew}\n className=\"mr-2 in-new-icon\"\n />\n </Button>,\n ]\n );\n } else {\n return [];\n }\n }, [formatMessage]);\n\n const subscriptionStatusIcons: Record<string, typeof Info | undefined> = {\n trial: undefined,\n cancelled: Info,\n active: CheckCircle,\n };\n\n const bannerIcon = subscriptionStatusIcons[subscriptionBannerData.subscriptionStatus] ?? undefined;\n\n return (\n <div className=\"mt-4.5 mb-4.5\">\n <Alert\n variant={bannerVariant}\n icon={bannerIcon}\n dismissible\n closeLabel=\"Dismiss\"\n show={showPageBanner}\n onClose={() => setShowPageBanner(false)}\n actions={getSubscriptionAction}\n >\n <Alert.Heading>{bannerTitle}</Alert.Heading>\n <p>\n {bannerBody}\n </p>\n </Alert>\n </div>\n );\n};\n"]}
1
+ {"version":3,"file":"SubscriptionBanner.js","sourceRoot":"","sources":["../../../../src/containers/SubscriptionBanner/components/SubscriptionBanner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,MAAM,EAAW,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAQ,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,MAAM,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AACvC,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,sBAAsB,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAClF,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAExC,gIAAgI;AAChI,oFAAoF;AACpF,sGAAsG;AACtG,8JAA8J;AAC9J,iLAAiL;AACjL,MAAM,sBAAsB,GAAG;IAC7B,YAAY,EAAE,IAAI;IAClB,MAAM,EAAE,OAAO,EAAE,gDAAgD;IACjE,qBAAqB,EAAE,YAAY;IACnC,mBAAmB,EAAE,YAAY;IACjC,uBAAuB,EAAE,YAAY;IACrC,wBAAwB,EAAE,KAAK;CAChC,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAO,GAAG,EAAE;;IACzC,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IACpC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAU,IAAI,CAAC,CAAC;IACpE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACjD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAsB,SAAS,CAAC,CAAC;IACnF,MAAM,UAAU,GAAG,SAAS,CAAC,aAAa,EAAE,CAAC;IAE7C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,YAAY,GAAG,MAAM,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACvF,MAAM,KAAK,GAAG,MAAM,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACtC,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,EAAE;YAC1C,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;YAC/C,CAAC,CAAC,CAAC,CAAC;QAEN,QAAQ,sBAAsB,CAAC,MAAM,EAAE,CAAC;YACtC,KAAK,QAAQ;gBACX,gBAAgB,CAAC,SAAS,CAAC,CAAC;gBAC5B,cAAc,CAAC,aAAa,CAAC,QAAQ,CAAC,uBAAuB,CAAC,CAAC,CAAC;gBAChE,aAAa,CAAC,aAAa,CAAC,QAAQ,CAAC,sBAAsB,EAAE;oBAC3D,uBAAuB,EAAE,UAAU,CAAC,sBAAsB,CAAC,uBAAuB,CAAC;iBACpF,CAAC,CAAC,CAAC;gBACJ,MAAM;YACR,KAAK,OAAO;gBACV,gBAAgB,CAAC,SAAS,CAAC,CAAC;gBAC5B,IAAI,aAAa,KAAK,CAAC,EAAE,CAAC;oBACxB,cAAc,CAAC,aAAa,CAAC,QAAQ,CAAC,iCAAiC,CAAC,CAAC,CAAC;gBAC5E,CAAC;qBAAM,IAAI,aAAa,KAAK,CAAC,EAAE,CAAC;oBAC/B,cAAc,CAAC,aAAa,CAAC,QAAQ,CAAC,oCAAoC,CAAC,CAAC,CAAC;gBAC/E,CAAC;qBAAM,CAAC;oBACN,cAAc,CAAC,aAAa,CAAC,QAAQ,CAAC,4BAA4B,EAAE;wBAClE,QAAQ,EAAE,aAAa;qBACxB,CAAC,CAAC,CAAC;gBACN,CAAC;gBACD,aAAa,CAAC,aAAa,CAAC,QAAQ,CAAC,2BAA2B,EAAE;oBAChE,mBAAmB,EAAE,UAAU,CAAC,sBAAsB,CAAC,mBAAmB,CAAC;iBAC5E,CAAC,CAAC,CAAC;gBACJ,MAAM;YACR,KAAK,WAAW;gBACd,gBAAgB,CAAC,OAAO,CAAC,CAAC;gBAC1B,cAAc,CAAC,aAAa,CAAC,QAAQ,CAAC,0BAA0B,CAAC,CAAC,CAAC;gBACnE,aAAa,CAAC,aAAa,CAAC,QAAQ,CAAC,yBAAyB,EAAE;oBAC9D,mBAAmB,EAAE,UAAU,CAAC,sBAAsB,CAAC,mBAAmB,CAAC;iBAC5E,CAAC,CAAC,CAAC;gBACJ,MAAM;YACR,KAAK,eAAe,EAAE,iDAAiD;gBACrE,gBAAgB,CAAC,OAAO,CAAC,CAAC;gBAC1B,cAAc,CAAC,aAAa,CAAC,QAAQ,CAAC,kBAAkB,CAAC,CAAC,CAAC;gBAC3D,aAAa,CAAC,aAAa,CAAC,QAAQ,CAAC,iBAAiB,EAAE;oBACtD,uBAAuB,EAAE,UAAU,CAAC,sBAAsB,CAAC,uBAAuB,CAAC;iBACpF,CAAC,CAAC,CAAC;gBACJ,MAAM;YACR;gBACE,iBAAiB,CAAC,KAAK,CAAC,CAAC;gBACzB,MAAM;QACV,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,aAAa,CAAC,CAAC,CAAC;IAEhC,MAAM,qBAAqB,GAAG,OAAO,CAAC,GAAG,EAAE;QACzC,IAAI,sBAAsB,CAAC,MAAM,KAAK,WAAW,EAAE,CAAC;YAClD,OAAO,CACL;gBACE,KAAC,MAAM,mBAEO,cAAc,EAC1B,SAAS,EAAC,cAAc,EACxB,OAAO,EAAC,SAAS,EACjB,IAAI,EAAE,sBAAsB,EAC5B,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,IAAI,EAAC,MAAM,YAEV,aAAa,CAAC,QAAQ,CAAC,uBAAuB,CAAC,IAT5C,oBAAoB,CAUjB;aACV,CACF,CAAC;QACJ,CAAC;aAAM,IAAI,sBAAsB,CAAC,MAAM,KAAK,eAAe,EAAE,CAAC;YAC7D,OAAO,CACL;gBACE,KAAC,MAAM,mBAEO,qBAAqB,EACjC,SAAS,EAAC,qBAAqB,EAC/B,OAAO,EAAC,SAAS,EACjB,EAAE,EAAE,eAAe,EACnB,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,IAAI,EAAC,MAAM,EACX,EAAE,EAAE,IAAI,YAEP,aAAa,CAAC,QAAQ,CAAC,mBAAmB,CAAC,IAVxC,2BAA2B,CAWxB;aACV,CACF,CAAC;QACJ,CAAC;aAAM,CAAC;YACN,OAAO,EAAE,CAAC;QACZ,CAAC;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,uBAAuB,GAA4C;QACvE,MAAM,EAAE,WAAW;KACpB,CAAC;IAEF,MAAM,UAAU,GAAG,MAAA,uBAAuB,CAAC,sBAAsB,CAAC,MAAM,CAAC,mCAAI,SAAS,CAAC;IAEvF,OAAO,CACL,cAAK,SAAS,EAAC,eAAe,YAC5B,MAAC,KAAK,IACJ,OAAO,EAAE,aAAa,EACtB,IAAI,EAAE,UAAU,EAChB,WAAW,QACX,UAAU,EAAC,SAAS,EACpB,IAAI,EAAE,cAAc,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,EACvC,OAAO,EAAE,qBAAqB,aAE9B,KAAC,KAAK,CAAC,OAAO,cAAE,WAAW,GAAiB,EAC5C,sBACG,UAAU,GACT,IACE,GACJ,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC, useEffect, useState, useMemo } from 'react';\nimport { Alert, Button, Variant } from '@openedx/paragon';\nimport { CheckCircle, Info } from '@openedx/paragon/icons';\nimport { useIntl } from '@openedx/frontend-base';\nimport moment from 'moment';\nimport { utilHooks } from '@src/hooks';\nimport messages from '../messages';\nimport { subscriptionRenewalURL, checkoutPageURL } from '@src/data/constants/app';\nimport { Link } from 'react-router-dom';\n\n// TODO: We can replace the below hardcoded subscriptionBannerData 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 SubscriptionBanner component.\n// Refer to https://2u-internal.atlassian.net/browse/SUBS-442 for more details on the API integration.\n// And https://github.com/edx/frontend-app-subscription-learner-dashboard/pull/2#discussion_r3139442324 for the implementation details of the API integration.\n// Test cases for the trial case are already written in the SubscriptionBanner.test.tsx file. We can update the test cases to use the actual API data once we have the API ready.\nconst subscriptionBannerData = {\n isSubscribed: true,\n status: 'trial', // can be 'active', 'cancelled', 'renewalFailed'\n subscriptionStartDate: '2026-05-22',\n subscriptionEndDate: '2026-07-22',\n subscriptionRenewalDate: '2026-07-22',\n subscriptionRenewalPrice: '$36',\n};\n\nexport const SubscriptionBanner: FC = () => {\n const { formatMessage } = useIntl();\n const [showPageBanner, setShowPageBanner] = useState<boolean>(true);\n const [bannerBody, setBannerBody] = useState('');\n const [bannerTitle, setBannerTitle] = useState('');\n const [bannerVariant, setBannerVariant] = useState<Variant | undefined>(undefined);\n const formatDate = utilHooks.useFormatDate();\n\n useEffect(() => {\n const trialEndDate = moment(subscriptionBannerData.subscriptionEndDate).startOf('day');\n const today = moment().startOf('day');\n const trialDaysLeft = trialEndDate.isValid()\n ? Math.max(0, trialEndDate.diff(today, 'days'))\n : 0;\n\n switch (subscriptionBannerData.status) {\n case 'active':\n setBannerVariant('success');\n setBannerTitle(formatMessage(messages.activeSubscriptionTitle));\n setBannerBody(formatMessage(messages.activeSubscriptionBody, {\n subscriptionRenewalDate: formatDate(subscriptionBannerData.subscriptionRenewalDate),\n }));\n break;\n case 'trial':\n setBannerVariant('success');\n if (trialDaysLeft === 0) {\n setBannerTitle(formatMessage(messages.activeTrialSubscriptionTitleToday));\n } else if (trialDaysLeft === 1) {\n setBannerTitle(formatMessage(messages.activeTrialSubscriptionTitleTomorrow));\n } else {\n setBannerTitle(formatMessage(messages.activeTrialSubscriptionTitle, {\n daysLeft: trialDaysLeft,\n }));\n }\n setBannerBody(formatMessage(messages.activeTrialSubscriptionBody, {\n subscriptionEndDate: formatDate(subscriptionBannerData.subscriptionEndDate),\n }));\n break;\n case 'cancelled':\n setBannerVariant('light');\n setBannerTitle(formatMessage(messages.cancelledSubscriptionTitle));\n setBannerBody(formatMessage(messages.cancelledSubscriptionBody, {\n subscriptionEndDate: formatDate(subscriptionBannerData.subscriptionEndDate),\n }));\n break;\n case 'renewalFailed': // also known as 'Payment Error' in figma designs\n setBannerVariant('light');\n setBannerTitle(formatMessage(messages.renewalFailedTitle));\n setBannerBody(formatMessage(messages.renewalFailedBody, {\n subscriptionRenewalDate: formatDate(subscriptionBannerData.subscriptionRenewalDate),\n }));\n break;\n default:\n setShowPageBanner(false);\n break;\n }\n }, [formatDate, formatMessage]);\n\n const getSubscriptionAction = useMemo(() => {\n if (subscriptionBannerData.status === 'cancelled') {\n return (\n [\n <Button\n key=\"renew-subscription\"\n data-testid=\"renew-button\"\n className=\"renew-button\"\n variant=\"primary\"\n href={subscriptionRenewalURL}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n role=\"link\"\n >\n {formatMessage(messages.renewSubscriptionButton)}\n </Button>,\n ]\n );\n } else if (subscriptionBannerData.status === 'renewalFailed') {\n return (\n [\n <Button\n key=\"renew-failed-subscription\"\n data-testid=\"renew-failed-button\"\n className=\"renew-failed-button\"\n variant=\"primary\"\n to={checkoutPageURL}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n role=\"link\"\n as={Link}\n >\n {formatMessage(messages.renewalFailedButton)}\n </Button>,\n ]\n );\n } else {\n return [];\n }\n }, [formatMessage]);\n\n const subscriptionStatusIcons: Record<string, typeof Info | undefined> = {\n active: CheckCircle,\n };\n\n const bannerIcon = subscriptionStatusIcons[subscriptionBannerData.status] ?? undefined;\n\n return (\n <div className=\"mt-4.5 mb-4.5\">\n <Alert\n variant={bannerVariant}\n icon={bannerIcon}\n dismissible\n closeLabel=\"Dismiss\"\n show={showPageBanner}\n onClose={() => setShowPageBanner(false)}\n actions={getSubscriptionAction}\n >\n <Alert.Heading>{bannerTitle}</Alert.Heading>\n <p>\n {bannerBody}\n </p>\n </Alert>\n </div>\n );\n};\n"]}
@@ -44,5 +44,20 @@ declare const messages: {
44
44
  description: string;
45
45
  defaultMessage: string;
46
46
  };
47
+ renewalFailedTitle: {
48
+ id: string;
49
+ description: string;
50
+ defaultMessage: string;
51
+ };
52
+ renewalFailedBody: {
53
+ id: string;
54
+ description: string;
55
+ defaultMessage: string;
56
+ };
57
+ renewalFailedButton: {
58
+ id: string;
59
+ description: string;
60
+ defaultMessage: string;
61
+ };
47
62
  };
48
63
  export default messages;
@@ -4,12 +4,12 @@ const messages = defineMessages({
4
4
  activeSubscriptionTitle: {
5
5
  id: 'learner-dash.subscriptionBanner.banners.activeSubscriptionTitle',
6
6
  description: 'Message to learners with an active subscription',
7
- defaultMessage: 'Your subscription is now active',
7
+ defaultMessage: 'Congrats! Your edX subscription trial is active.',
8
8
  },
9
9
  activeSubscriptionBody: {
10
10
  id: 'learner-dash.subscriptionBanner.banners.activeSubscriptionBody',
11
11
  description: 'Message to learners with an active subscription',
12
- defaultMessage: 'On {subscriptionStartDate} you subscribed to edX subscription product. Your subscription will renew on {subscriptionRenewalDate}.',
12
+ defaultMessage: 'Your subscription will renew on {subscriptionRenewalDate}.',
13
13
  },
14
14
  activeTrialSubscriptionTitle: {
15
15
  id: 'learner-dash.subscriptionBanner.banners.activeTrialSubscriptionTitle',
@@ -34,18 +34,33 @@ const messages = defineMessages({
34
34
  cancelledSubscriptionTitle: {
35
35
  id: 'learner-dash.subscriptionBanner.banners.cancelledSubscriptionTitle',
36
36
  description: 'Message to learners with a cancelled subscription',
37
- defaultMessage: 'Your subscription is cancelled',
37
+ defaultMessage: 'Your subscription expires in # days.',
38
38
  },
39
39
  cancelledSubscriptionBody: {
40
40
  id: 'learner-dash.subscriptionBanner.banners.cancelledSubscriptionBody',
41
41
  description: 'Message to learners with a cancelled subscription',
42
- defaultMessage: 'Your subscription expired on {subscriptionEndDate}. Renew now to continue enjoying your courses without interruption.',
42
+ defaultMessage: 'You canceled your subscription on {subscriptionEndDate}. Renew your subscription to maintain course access.',
43
43
  },
44
44
  renewSubscriptionButton: {
45
45
  id: 'learner-dash.subscriptionBanner.banners.renewSubscriptionButton',
46
46
  description: 'Renew Subscription',
47
47
  defaultMessage: 'Renew Subscription',
48
48
  },
49
+ renewalFailedTitle: {
50
+ id: 'learner-dash.subscriptionBanner.banners.renewalFailedTitle',
51
+ description: 'Message to learners with a failed renewal subscription',
52
+ defaultMessage: 'Update your payment card to keep your subscription active.',
53
+ },
54
+ renewalFailedBody: {
55
+ id: 'learner-dash.subscriptionBanner.banners.renewalFailedBody',
56
+ description: 'Message to learners with a failed renewal subscription',
57
+ defaultMessage: 'We were unable to process your subscription payment. Update your card on file by {subscriptionRenewalDate} or your subscription access will expire.',
58
+ },
59
+ renewalFailedButton: {
60
+ id: 'learner-dash.subscriptionBanner.banners.renewalFailedButton',
61
+ description: 'Update payment method',
62
+ defaultMessage: 'Update payment method',
63
+ },
49
64
  });
50
65
  export default messages;
51
66
  //# sourceMappingURL=messages.js.map
@@ -1 +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"]}
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,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"]}
@@ -1,2 +1,3 @@
1
1
  import { FC } from 'react';
2
+ import '../index.scss';
2
3
  export declare const SubscriptionInformation: FC;
@@ -1,31 +1,31 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Alert, Button, Image } from '@openedx/paragon';
2
+ import { Alert, Button, Icon } from '@openedx/paragon';
3
3
  import { useIntl } from '@openedx/frontend-base';
4
4
  import { utilHooks } from '../../../hooks';
5
5
  import messages from '../messages';
6
6
  import { manageSubscriptionURL } from '../../../data/constants/app';
7
+ import '../index.scss';
8
+ import { Cached } from '@openedx/paragon/icons';
7
9
  // TODO: We can replace the below hardcoded subscriptionInformationData with the actual data from the API once we have the API ready.
8
10
  // For now, we can use this hardcoded data to test the SubscriptionInformation component.
9
11
  const subscriptionInformationData = {
10
12
  isSubscribed: true,
11
- subscriptionStatus: 'cancelled', // can be 'active', 'cancelled', 'expired'
13
+ subscriptionStatus: 'Active', // can be 'Active', 'Cancelled', 'Expired'
12
14
  subscriptionStartDate: '05/22/25',
13
15
  subscriptionEndDate: '05/22/26',
14
16
  subscriptionRenewalDate: '05/22/26',
15
17
  subscriptionRenewalPrice: '$36',
16
18
  numberOfCoursesEnrolled: 5,
17
19
  totalSavings: '$120',
20
+ planName: 'Monthly Plan',
18
21
  };
19
22
  export const SubscriptionInformation = () => {
20
23
  const { formatMessage } = useIntl();
21
24
  const formatDate = utilHooks.useFormatDate();
22
25
  const subscriptionActions = [
23
- _jsx(Button, { variant: "outline-brand", "data-testid": "manage-button", href: manageSubscriptionURL, target: "_blank", rel: "noopener noreferrer", role: "link", children: formatMessage(messages.manageSubscriptionMessage) }, "manage-subscription"),
26
+ _jsx(Button, { variant: "tertiary", "data-testid": "manage-button", href: manageSubscriptionURL, target: "_blank", rel: "noopener noreferrer", role: "link", children: formatMessage(messages.manageSubscriptionMessage) }, "manage-subscription"),
24
27
  ];
25
- 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, {
26
- numberOfCoursesEnrolled: subscriptionInformationData.numberOfCoursesEnrolled,
27
- totalSavings: subscriptionInformationData.totalSavings,
28
- }) }), _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, {
28
+ 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, {
29
29
  subscriptionRenewalDate: formatDate(subscriptionInformationData.subscriptionRenewalDate),
30
30
  }) })] })] }));
31
31
  };
@@ -1 +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"]}
1
+ {"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"]}
@@ -0,0 +1,19 @@
1
+ $text-color: #002B2B !default;
2
+
3
+ .subscription-information {
4
+ background: var(--pgn-color-light-200);
5
+
6
+ .my-subscription-heading {
7
+ color: $text-color;
8
+ }
9
+
10
+ .subscription-status-alert {
11
+ h6 {
12
+ margin-bottom: 0;
13
+ }
14
+
15
+ p {
16
+ color: var(--pgn-color-black);
17
+ }
18
+ }
19
+ }
@@ -24,5 +24,10 @@ declare const messages: {
24
24
  description: string;
25
25
  defaultMessage: string;
26
26
  };
27
+ mySubscriptionHeading: {
28
+ id: string;
29
+ description: string;
30
+ defaultMessage: string;
31
+ };
27
32
  };
28
33
  export default messages;
@@ -18,13 +18,18 @@ const messages = defineMessages({
18
18
  renewalMessage: {
19
19
  id: 'learner-dash.subscriptionInformation.information.subscriptionSchedule',
20
20
  description: 'Subscription Schedule',
21
- defaultMessage: 'Subscription payment scheduled for {subscriptionRenewalDate}.',
21
+ defaultMessage: 'Your next payment is {subscriptionRenewalDate}.',
22
22
  },
23
23
  manageSubscriptionMessage: {
24
24
  id: 'learner-dash.subscriptionInformation.information.manageSubscription',
25
25
  description: 'Manage Subscription',
26
26
  defaultMessage: 'Manage my subscription',
27
27
  },
28
+ mySubscriptionHeading: {
29
+ id: 'learner-dash.subscriptionInformation.information.mySubscriptionHeading',
30
+ description: 'My Subscription Heading',
31
+ defaultMessage: 'My subscription',
32
+ },
28
33
  });
29
34
  export default messages;
30
35
  //# sourceMappingURL=messages.js.map
@@ -1 +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"]}
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,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"]}
@@ -5,3 +5,4 @@ export const ListPageSize: 25;
5
5
  export const subscriptionRenewalURL: "https://courses.edx.org/manage-subscription";
6
6
  export const exploreProgramsUrl: "/explore-programs";
7
7
  export const manageSubscriptionURL: "/manage-subscription";
8
+ export const checkoutPageURL: "/checkout-page";
@@ -16,4 +16,5 @@ export const ListPageSize = 25;
16
16
  export const subscriptionRenewalURL = 'https://courses.edx.org/manage-subscription';
17
17
  export const exploreProgramsUrl = '/explore-programs';
18
18
  export const manageSubscriptionURL = '/manage-subscription';
19
+ export const checkoutPageURL = '/checkout-page';
19
20
  //# sourceMappingURL=app.js.map
@@ -1 +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"]}
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;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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@edx/frontend-app-subscription-learner-dashboard",
3
- "version": "1.18.0",
3
+ "version": "1.20.0",
4
4
  "description": "",
5
5
  "repository": {
6
6
  "type": "git",