@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.
- package/dist/app.js +0 -3
- package/dist/app.js.map +1 -1
- package/dist/containers/CoursesPanel/index.js +2 -1
- package/dist/containers/CoursesPanel/index.js.map +1 -1
- package/dist/containers/CoursesPanel/index.scss +3 -3
- package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.d.ts +3 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.js +10 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.js.map +1 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.scss +14 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/index.d.ts +2 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/index.js +24 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/index.js.map +1 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgramProgressTabs/index.js +2 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgramProgressTabs/index.js.map +1 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.js +4 -4
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.js.map +1 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.scss +13 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/ProgressCardButton.js +6 -2
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/ProgressCardButton.js.map +1 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/index.js +1 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/index.js.map +1 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/index.scss +4 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/messages.d.ts +30 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/messages.js +30 -0
- package/dist/containers/ProgramDashboard/ProgramProgress/messages.js.map +1 -1
- package/dist/containers/SubscriptionBanner/components/SubscriptionBanner.js +24 -15
- package/dist/containers/SubscriptionBanner/components/SubscriptionBanner.js.map +1 -1
- package/dist/containers/SubscriptionBanner/messages.d.ts +15 -0
- package/dist/containers/SubscriptionBanner/messages.js +19 -4
- package/dist/containers/SubscriptionBanner/messages.js.map +1 -1
- package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.d.ts +1 -0
- package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.js +7 -7
- package/dist/containers/SubscriptionInformation/components/SubscriptionInformation.js.map +1 -1
- package/dist/containers/SubscriptionInformation/index.scss +19 -0
- package/dist/containers/SubscriptionInformation/messages.d.ts +5 -0
- package/dist/containers/SubscriptionInformation/messages.js +6 -1
- package/dist/containers/SubscriptionInformation/messages.js.map +1 -1
- package/dist/data/constants/app.d.ts +1 -0
- package/dist/data/constants/app.js +1 -0
- package/dist/data/constants/app.js.map +1 -1
- 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;
|
|
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("
|
|
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
|
|
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:
|
|
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-
|
|
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
|
|
package/dist/containers/ProgramDashboard/ProgramProgress/PathwaysTabData/CreditFaqBanner/index.js
ADDED
|
@@ -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,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(
|
|
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;
|
|
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 !==
|
|
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 }),
|
|
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":";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,GAAG,gBAAgB,CAAC;
|
|
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, 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
|
-
|
|
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
|
}
|
package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCardActions/ProgressCardButton.js
CHANGED
|
@@ -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
|
-
|
|
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;
|
|
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"]}
|
|
@@ -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":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,QAAQ,GAAG,cAAc,CAAC;IAC9B,2BAA2B,EAAE;QAC3B,cAAc,EAAE,cAAc;QAC9B,EAAE,EAAE,+BAA+B;QACnC,WAAW,EAAE,yCAAyC;KACvD;IACD,gBAAgB,EAAE;QAChB,cAAc,EAAE,uBAAuB;QACvC,EAAE,EAAE,qCAAqC;QACzC,WAAW,EAAE,qGAAqG;KACnH;IACD,6BAA6B,EAAE;QAC7B,cAAc,EAAE,kBAAkB;QAClC,EAAE,EAAE,kCAAkC;QACtC,WAAW,EAAE,yEAAyE;KACvF;IACD,2BAA2B,EAAE;QAC3B,cAAc,EAAE,0EAA0E;QAC1F,EAAE,EAAE,gCAAgC;QACpC,WAAW,EAAE,8EAA8E;KAC5F;IACD,+BAA+B,EAAE;QAC/B,cAAc,EAAE,sBAAsB;QACtC,EAAE,EAAE,oCAAoC;QACxC,WAAW,EAAE,sFAAsF;KACpG;IACD,6BAA6B,EAAE;QAC7B,cAAc,EAAE,0KAA0K;QAC1L,EAAE,EAAE,kCAAkC;QACtC,WAAW,EAAE,gFAAgF;KAC9F;IACD,2CAA2C,EAAE;QAC3C,cAAc,EAAE,iDAAiD;QACjE,EAAE,EAAE,kDAAkD;QACtD,WAAW,EAAE,qGAAqG;KACnH;IACD,6CAA6C,EAAE;QAC7C,cAAc,EAAE,kBAAkB;QAClC,EAAE,EAAE,yDAAyD;QAC7D,WAAW,EAAE,kFAAkF;KAChG;IACD,yCAAyC,EAAE;QACzC,cAAc,EAAE,qBAAqB;QACrC,EAAE,EAAE,sDAAsD;QAC1D,WAAW,EAAE,yEAAyE;KACvF;IACD,qCAAqC,EAAE;QACrC,cAAc,EAAE,eAAe;QAC/B,EAAE,EAAE,iDAAiD;QACrD,WAAW,EAAE,mEAAmE;KACjF;IACD,gCAAgC,EAAE;QAChC,cAAc,EAAE,gCAAgC;QAChD,EAAE,EAAE,2CAA2C;QAC/C,WAAW,EAAE,6DAA6D;KAC3E;IACD,6BAA6B,EAAE;QAC7B,cAAc,EAAE,WAAW;QAC3B,EAAE,EAAE,mCAAmC;QACvC,WAAW,EAAE,4EAA4E;KAC1F;IACD,4BAA4B,EAAE;QAC5B,cAAc,EAAE,SAAS;QACzB,EAAE,EAAE,kCAAkC;QACtC,WAAW,EAAE,uEAAuE;KACrF;IACD,4BAA4B,EAAE;QAC5B,cAAc,EAAE,aAAa;QAC7B,EAAE,EAAE,kCAAkC;QACtC,WAAW,EAAE,oIAAoI;KAClJ;IACD,2BAA2B,EAAE;QAC3B,cAAc,EAAE,WAAW;QAC3B,EAAE,EAAE,gCAAgC;QACpC,WAAW,EAAE,oHAAoH;KAClI;IACD,2BAA2B,EAAE;QAC3B,cAAc,EAAE,WAAW;QAC3B,EAAE,EAAE,gCAAgC;QACpC,WAAW,EAAE,8GAA8G;KAC5H;IACD,0BAA0B,EAAE;QAC1B,cAAc,EAAE,UAAU;QAC1B,EAAE,EAAE,+BAA+B;QACnC,WAAW,EAAE,oMAAoM;KAClN;IACD,8BAA8B,EAAE;QAC9B,cAAc,EAAE,mBAAmB;QACnC,EAAE,EAAE,mCAAmC;QACvC,WAAW,EAAE,oFAAoF;KAClG;IACD,mCAAmC,EAAE;QACnC,cAAc,EAAE,qDAAqD;QACrE,EAAE,EAAE,0CAA0C;QAC9C,WAAW,EAAE,kHAAkH;KAChI;IACD,8BAA8B,EAAE;QAC9B,cAAc,EAAE,mBAAmB;QACnC,EAAE,EAAE,mCAAmC;QACvC,WAAW,EAAE,oFAAoF;KAClG;IACD,mCAAmC,EAAE;QACnC,cAAc,EAAE,yDAAyD;QACzE,EAAE,EAAE,0CAA0C;QAC9C,WAAW,EAAE,4GAA4G;KAC1H;IACD,mCAAmC,EAAE;QACnC,cAAc,EAAE,0BAA0B;QAC1C,EAAE,EAAE,yCAAyC;QAC7C,WAAW,EAAE,wFAAwF;KACtG;IACD,yCAAyC,EAAE;QACzC,cAAc,EAAE,yHAAyH;QACzI,EAAE,EAAE,+CAA+C;QACnD,WAAW,EAAE,8FAA8F;KAC5G;IACD,8CAA8C,EAAE;QAC9C,cAAc,EAAE,aAAa;QAC7B,EAAE,EAAE,sDAAsD;QAC1D,WAAW,EAAE,4GAA4G;KAC1H;IACD,oDAAoD,EAAE;QACpD,cAAc,EAAE,oBAAoB;QACpC,EAAE,EAAE,6DAA6D;QACjE,WAAW,EAAE,mHAAmH;KACjI;IACD,iCAAiC,EAAE;QACjC,cAAc,EAAE,qBAAqB;QACrC,EAAE,EAAE,sCAAsC;QAC1C,WAAW,EAAE,4CAA4C;KAC1D;IACD,+BAA+B,EAAE;QAC/B,cAAc,EAAE,8BAA8B;QAC9C,EAAE,EAAE,+CAA+C;QACnD,WAAW,EAAE,+CAA+C;KAC7D;IACD,oCAAoC,EAAE;QACpC,cAAc,EAAE,2FAA2F;QAC3G,EAAE,EAAE,0CAA0C;QAC9C,WAAW,EAAE,iEAAiE;KAC/E;IACD,oCAAoC,EAAE;QACpC,cAAc,EAAE,8DAA8D;QAC9E,EAAE,EAAE,0CAA0C;QAC9C,WAAW,EAAE,kEAAkE;KAChF;IACD,+BAA+B,EAAE;QAC/B,cAAc,EAAE,qBAAqB;QACrC,EAAE,EAAE,qCAAqC;QACzC,WAAW,EAAE,sFAAsF;KACpG;IACD,kDAAkD,EAAE;QAClD,cAAc,EAAE,iCAAiC;QACjD,EAAE,EAAE,0DAA0D;QAC9D,WAAW,EAAE,kEAAkE;KAChF;IACD,yCAAyC,EAAE;QACzC,cAAc,EAAE,2CAA2C;QAC3D,EAAE,EAAE,gDAAgD;QACpD,WAAW,EAAE,uDAAuD;KACrE;IACD,yCAAyC,EAAE;QACzC,cAAc,EAAE,gDAAgD;QAChE,EAAE,EAAE,gDAAgD;QACpD,WAAW,EAAE,uDAAuD;KACrE;IACD,4DAA4D,EAAE;QAC5D,cAAc,EAAE,yCAAyC;QACzD,EAAE,EAAE,sEAAsE;QAC1E,WAAW,EAAE,0EAA0E;KACxF;IACD,8DAA8D,EAAE;QAC9D,cAAc,EAAE,kEAAkE;QAClF,EAAE,EAAE,wEAAwE;QAC5E,WAAW,EAAE,4EAA4E;KAC1F;IACD,0CAA0C,EAAE;QAC1C,cAAc,EAAE,8BAA8B;QAC9C,EAAE,EAAE,iDAAiD;QACrD,WAAW,EAAE,wDAAwD;KACtE;IACD,iDAAiD,EAAE;QACjD,cAAc,EAAE,4BAA4B;QAC5C,EAAE,EAAE,yDAAyD;QAC7D,WAAW,EAAE,yGAAyG;KACvH;IACD,6CAA6C,EAAE;QAC7C,cAAc,EAAE,gBAAgB;QAChC,EAAE,EAAE,qDAAqD;QACzD,WAAW,EAAE,gHAAgH;KAC9H;IACD,yCAAyC,EAAE;QACzC,cAAc,EAAE,iBAAiB;QACjC,EAAE,EAAE,gDAAgD;QACpD,WAAW,EAAE,2DAA2D;KACzE;IACD,+CAA+C,EAAE;QAC/C,cAAc,EAAE,qSAAqS;QACrT,EAAE,EAAE,sDAAsD;QAC1D,WAAW,EAAE,iEAAiE;KAC/E;IACD,6CAA6C,EAAE;QAC7C,cAAc,EAAE,YAAY;QAC5B,EAAE,EAAE,qDAAqD;QACzD,WAAW,EAAE,iFAAiF;KAC/F;IACD,6CAA6C,EAAE;QAC7C,cAAc,EAAE,yBAAyB;QACzC,EAAE,EAAE,8CAA8C;QAClD,WAAW,EAAE,0EAA0E;KACxF;IACD,4CAA4C,EAAE;QAC5C,cAAc,EAAE,oDAAoD;QACpE,EAAE,EAAE,oDAAoD;QACxD,WAAW,EAAE,8EAA8E;KAC5F;IACD,kDAAkD,EAAE;QAClD,cAAc,EAAE,iIAAiI;QACjJ,EAAE,EAAE,0DAA0D;QAC9D,WAAW,EAAE,oFAAoF;KAClG;CACF,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","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,
|
|
4
|
-
import { CheckCircle
|
|
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
|
-
|
|
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.
|
|
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('
|
|
64
|
+
setBannerVariant('light');
|
|
66
65
|
setBannerTitle(formatMessage(messages.cancelledSubscriptionTitle));
|
|
67
66
|
setBannerBody(formatMessage(messages.cancelledSubscriptionBody, {
|
|
68
|
-
subscriptionEndDate: formatDate(subscriptionBannerData.
|
|
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.
|
|
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
|
-
|
|
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.
|
|
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":";AAAA,OAAO,EAAM,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,
|
|
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, 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
|
|
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: '
|
|
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
|
|
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: '
|
|
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,
|
|
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,31 +1,31 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Alert, Button,
|
|
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: '
|
|
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: "
|
|
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
|
|
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,
|
|
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
|
+
}
|
|
@@ -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: '
|
|
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
|
|
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"]}
|