@edx/frontend-app-subscription-learner-dashboard 1.38.0 → 1.38.2
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/containers/CourseCard/components/CourseCardBanners/ViewCertificateBanner.js +5 -5
- package/dist/containers/CourseCard/components/CourseCardBanners/ViewCertificateBanner.js.map +1 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/CompletedTabData/index.js +2 -2
- package/dist/containers/ProgramDashboard/ProgramProgress/CompletedTabData/index.js.map +1 -1
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.js +3 -3
- package/dist/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -7,24 +7,24 @@ import messages from './messages';
|
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
export const ViewCertificateBanner = ({ cardId }) => {
|
|
9
9
|
const courseData = useCourseData(cardId);
|
|
10
|
-
const { isEarned = false, isVerified = false, mode = '',
|
|
10
|
+
const { isEarned = false, isVerified = false, mode = '', certPreviewUrl = '', issuedDate = '', } = useMemo(() => {
|
|
11
11
|
var _a, _b, _c, _d, _e;
|
|
12
12
|
return ({
|
|
13
13
|
isEarned: ((_a = courseData === null || courseData === void 0 ? void 0 : courseData.certificate) === null || _a === void 0 ? void 0 : _a.isEarned) || false,
|
|
14
14
|
isVerified: ((_b = courseData === null || courseData === void 0 ? void 0 : courseData.enrollment) === null || _b === void 0 ? void 0 : _b.isVerified) || false,
|
|
15
15
|
mode: ((_c = courseData === null || courseData === void 0 ? void 0 : courseData.enrollment) === null || _c === void 0 ? void 0 : _c.mode) || '',
|
|
16
|
-
|
|
17
|
-
|
|
16
|
+
certPreviewUrl: ((_d = courseData === null || courseData === void 0 ? void 0 : courseData.certificate) === null || _d === void 0 ? void 0 : _d.certPreviewUrl) || '',
|
|
17
|
+
issuedDate: ((_e = courseData === null || courseData === void 0 ? void 0 : courseData.certificate) === null || _e === void 0 ? void 0 : _e.issuedDate) || '',
|
|
18
18
|
});
|
|
19
19
|
}, [courseData]);
|
|
20
20
|
const { formatMessage } = useIntl();
|
|
21
21
|
const formatDate = utilHooks.useFormatDate();
|
|
22
22
|
const showVerifiedBanner = isEarned && isVerified && mode === 'verified';
|
|
23
23
|
return (_jsx(Card.Status, { variant: "warning", className: "bg-light-200 verified-banner", "data-testid": "course-card-view-certificate-banner", children: _jsxs(Row, { className: "align-items-sm-center mt-1", children: [_jsx(Col, { xs: 12, sm: true, className: "pe-sm-3", children: _jsxs("p", { className: "mb-0 font-weight-semi-bold", children: [_jsx("span", { children: _jsxs("b", { children: [formatMessage(messages.congratulationsText), " "] }) }), showVerifiedBanner ? (_jsx(_Fragment, { children: formatMessage(messages.verifiedBannerText, {
|
|
24
|
-
date: formatDate(
|
|
24
|
+
date: formatDate(issuedDate),
|
|
25
25
|
}) }))
|
|
26
26
|
: (_jsx(_Fragment, { children: formatMessage(messages.completedAndPassedBannerText, {
|
|
27
|
-
date: formatDate(
|
|
27
|
+
date: formatDate(issuedDate),
|
|
28
28
|
}) }))] }) }), _jsxs(Col, { xs: 12, sm: "auto", className: "d-flex justify-content-start justify-content-sm-end mt-2 mt-sm-0", children: [_jsx(Button, { variant: "outline-brand", size: "md", href: certPreviewUrl
|
|
29
29
|
? `${getSiteConfig().lmsBaseUrl}${certPreviewUrl}`
|
|
30
30
|
: undefined, "data-testid": "view-certificate-button", className: "view-certificate-button d-none d-lg-inline-flex", target: "_blank", rel: "noopener noreferrer", role: "link", children: formatMessage(messages.viewCertificate) }), _jsx(Hyperlink, { destination: certPreviewUrl
|
package/dist/containers/CourseCard/components/CourseCardBanners/ViewCertificateBanner.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewCertificateBanner.js","sourceRoot":"","sources":["../../../../../src/containers/CourseCard/components/CourseCardBanners/ViewCertificateBanner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AACtD,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;IAClD,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IACzC,MAAM,EACJ,QAAQ,GAAG,KAAK,EAChB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,EAAE,EACT,
|
|
1
|
+
{"version":3,"file":"ViewCertificateBanner.js","sourceRoot":"","sources":["../../../../../src/containers/CourseCard/components/CourseCardBanners/ViewCertificateBanner.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Hyperlink, Button, Card, Row, Col } from '@openedx/paragon';\nimport { useMemo } from 'react';\nimport { getSiteConfig, useIntl } from '@openedx/frontend-base';\nimport { utilHooks, useCourseData } from '@src/hooks';\nimport messages from './messages';\nimport PropTypes from 'prop-types';\n\nexport const ViewCertificateBanner = ({ cardId }) => {\n const courseData = useCourseData(cardId);\n const {\n isEarned = false,\n isVerified = false,\n mode = '',\n certPreviewUrl = '',\n issuedDate = '',\n } = useMemo(() => ({\n isEarned: courseData?.certificate?.isEarned || false,\n isVerified: courseData?.enrollment?.isVerified || false,\n mode: courseData?.enrollment?.mode || '',\n certPreviewUrl: courseData?.certificate?.certPreviewUrl || '',\n issuedDate: courseData?.certificate?.issuedDate || '',\n }), [courseData]);\n\n const { formatMessage } = useIntl();\n const formatDate = utilHooks.useFormatDate();\n\n const showVerifiedBanner = isEarned && isVerified && mode === 'verified';\n\n return (\n <Card.Status variant=\"warning\" className=\"bg-light-200 verified-banner\" data-testid=\"course-card-view-certificate-banner\">\n <Row className=\"align-items-sm-center mt-1\">\n <Col xs={12} sm className=\"pe-sm-3\">\n <p className=\"mb-0 font-weight-semi-bold\">\n <span><b>{formatMessage(messages.congratulationsText)} </b></span>\n {\n showVerifiedBanner ? (\n <>\n {formatMessage(messages.verifiedBannerText, {\n date: formatDate(issuedDate),\n })}\n </>\n )\n : (\n <>\n {formatMessage(messages.completedAndPassedBannerText, {\n date: formatDate(issuedDate),\n })}\n </>\n )\n }\n </p>\n </Col>\n <Col xs={12} sm=\"auto\" className=\"d-flex justify-content-start justify-content-sm-end mt-2 mt-sm-0\">\n {/* Desktop: outlined button */}\n <Button\n variant=\"outline-brand\"\n size=\"md\"\n href={certPreviewUrl\n ? `${getSiteConfig().lmsBaseUrl}${certPreviewUrl}`\n : undefined}\n data-testid=\"view-certificate-button\"\n className=\"view-certificate-button d-none d-lg-inline-flex\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n role=\"link\"\n >\n {formatMessage(messages.viewCertificate)}\n </Button>\n {/* Tablet/Mobile: plain text link */}\n <Hyperlink\n destination={certPreviewUrl\n ? `${getSiteConfig().lmsBaseUrl}${certPreviewUrl}`\n : undefined}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"d-lg-none view-certificate-link\"\n data-testid=\"view-certificate-link\"\n isInline\n >\n {formatMessage(messages.viewCertificate)}\n </Hyperlink>\n </Col>\n </Row>\n </Card.Status>\n );\n};\n\nViewCertificateBanner.propTypes = {\n cardId: PropTypes.string.isRequired,\n};\n\nexport default ViewCertificateBanner;\n"]}
|
|
@@ -11,11 +11,11 @@ export const CompletedTabData = () => {
|
|
|
11
11
|
const completedData = (courseData === null || courseData === void 0 ? void 0 : courseData.completed) || [];
|
|
12
12
|
const buildProgressCard = () => (completedData.map((course) => {
|
|
13
13
|
const courseRuns = course.courseRuns || [];
|
|
14
|
-
const [{ pacingType = '', enrollmentDate = '',
|
|
14
|
+
const [{ pacingType = '', enrollmentDate = '', certificateIssuedDate = '', certificateUrl = '', courseUrl = '' } = {}] = Array.isArray(courseRuns) ? courseRuns : [];
|
|
15
15
|
const progressCardData = {
|
|
16
16
|
title: course.title,
|
|
17
17
|
enrollment_date: enrollmentDate,
|
|
18
|
-
|
|
18
|
+
certificateIssuedDate: certificateIssuedDate || '',
|
|
19
19
|
pacingType: pacingType,
|
|
20
20
|
certificateUrl: certificateUrl || '',
|
|
21
21
|
courseUrl: courseUrl || '',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/CompletedTabData/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,CAAC,MAAM,gBAAgB,GAAO,GAAG,EAAE;IACvC,MAAM,EAAE,mBAAmB,EAAE,SAAS,EAAE,GAAG,eAAe,EAAE,CAAC;IAC7D,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,MAAM,UAAU,GAAG,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,UAAU,CAAC;IACnD,MAAM,aAAa,GAAG,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,KAAI,EAAE,CAAC;IAElD,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,CAC9B,aAAa,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;QAC3B,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,IAAI,EAAE,CAAC;QAC3C,MAAM,CAAC,EAAE,UAAU,GAAG,EAAE,EAAE,cAAc,GAAG,EAAE,EAAE,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/CompletedTabData/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,CAAC,MAAM,gBAAgB,GAAO,GAAG,EAAE;IACvC,MAAM,EAAE,mBAAmB,EAAE,SAAS,EAAE,GAAG,eAAe,EAAE,CAAC;IAC7D,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,EAAE,CAAC;IAEpC,MAAM,UAAU,GAAG,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,UAAU,CAAC;IACnD,MAAM,aAAa,GAAG,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,SAAS,KAAI,EAAE,CAAC;IAElD,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,CAC9B,aAAa,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;QAC3B,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,IAAI,EAAE,CAAC;QAC3C,MAAM,CAAC,EAAE,UAAU,GAAG,EAAE,EAAE,cAAc,GAAG,EAAE,EAAE,qBAAqB,GAAG,EAAE,EAAE,cAAc,GAAG,EAAE,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,EAAE,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;QAErK,MAAM,gBAAgB,GAAG;YACvB,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,eAAe,EAAE,cAAc;YAC/B,qBAAqB,EAAE,qBAAqB,IAAI,EAAE;YAClD,UAAU,EAAE,UAAU;YACtB,cAAc,EAAE,cAAc,IAAI,EAAE;YACpC,SAAS,EAAE,SAAS,IAAI,EAAE;SAC3B,CAAC;QAEF,OAAO,CACL,KAAC,YAAY,IAAiB,gBAAgB,EAAE,gBAAgB,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,aAAa,CAAC,QAAQ,CAAC,2BAA2B,CAAC,CAAC,WAAW,EAAE,IAA/I,MAAM,CAAC,EAAE,CAA0I,CACvK,CAAC;IACJ,CAAC,CAAC,CACH,CAAC;IAEF,OAAO,CACL,0BACG,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAC1B,iBAAiB,EAAE,CACpB,CAAC,CAAC,CAAC,CACF,sBAAI,aAAa,CAAC,QAAQ,CAAC,mCAAmC,CAAC,GAAK,CACrE,EAED,KAAC,qBAAqB,KAAG,IACrB,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC } from 'react';\nimport { useProgressData } from '@src/hooks';\nimport { useIntl } from '@openedx/frontend-base';\n\nimport { ProgressCard } from '../ProgressCard';\nimport messages from '../messages';\nimport { CompletedRecordBanner } from './CompletedRecordBanner';\n\nexport const CompletedTabData: FC = () => {\n const { programProgressData, isLoading } = useProgressData();\n const { formatMessage } = useIntl();\n\n const courseData = programProgressData?.courseData;\n const completedData = courseData?.completed || [];\n\n const buildProgressCard = () => (\n completedData.map((course) => {\n const courseRuns = course.courseRuns || [];\n const [{ pacingType = '', enrollmentDate = '', certificateIssuedDate = '', certificateUrl = '', courseUrl = '' } = {}] = Array.isArray(courseRuns) ? courseRuns : [];\n\n const progressCardData = {\n title: course.title,\n enrollment_date: enrollmentDate,\n certificateIssuedDate: certificateIssuedDate || '',\n pacingType: pacingType,\n certificateUrl: certificateUrl || '',\n courseUrl: courseUrl || '',\n };\n\n return (\n <ProgressCard key={course.id} progressCardData={progressCardData} isLoading={isLoading} tabType={formatMessage(messages.programProgressCompletedTab).toLowerCase()} />\n );\n })\n );\n\n return (\n <div>\n {completedData.length > 0 ? (\n buildProgressCard()\n ) : (\n <p>{formatMessage(messages.programProgressCompletedTabNoCourse)}</p>\n )}\n\n <CompletedRecordBanner />\n </div>\n );\n};\n"]}
|
|
@@ -11,7 +11,7 @@ import { getCertificatePriceString } from '../../data/util';
|
|
|
11
11
|
import { UpgradeCourseButton } from '../ProgressCardActions/UpgradeCourseButton';
|
|
12
12
|
export const ProgressCard = ({ progressCardData, isLoading, tabType }) => {
|
|
13
13
|
const { formatMessage, formatDate } = useIntl();
|
|
14
|
-
const { title, enrollment_date,
|
|
14
|
+
const { title, enrollment_date, certificateIssuedDate, certificateUrl, courseUrl, upgradeUrl, programType, checkoutUrl, expired, seats, description, destinationUrl, courseRunKey } = progressCardData;
|
|
15
15
|
const inProgressTabKey = formatMessage(messages.programProgressInProgressTab).toLowerCase();
|
|
16
16
|
const isInProgressTab = tabType === inProgressTabKey;
|
|
17
17
|
const isRemainingTab = tabType === formatMessage(messages.programProgressRemainingTab).toLowerCase();
|
|
@@ -39,8 +39,8 @@ export const ProgressCard = ({ progressCardData, isLoading, tabType }) => {
|
|
|
39
39
|
}
|
|
40
40
|
// using expired key from course object to determine if the course is expired as per condition on confluence and learners dashboard code.
|
|
41
41
|
const canUpgrade = Boolean(upgradeUrl) && !expired;
|
|
42
|
-
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: [isPathwaysTab ? (_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:
|
|
43
|
-
certificateDate: (
|
|
42
|
+
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: [isPathwaysTab ? (_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: certificateIssuedDate && (formatMessage(messages.programProgressCardCompletedCertificateText, {
|
|
43
|
+
certificateDate: (certificateIssuedDate ? dateFormatter(formatDate, certificateIssuedDate, 'short') : ''),
|
|
44
44
|
})) }), _jsx(ProgressCardButton, { variant: "brand", redirectUrl: certificateUrl ? `${getSiteConfig().lmsBaseUrl}${certificateUrl}` : '', buttonText: formatMessage(messages.programProgressCardCompletedCertificateButton) })] }) })), isInProgressTab && (_jsxs(_Fragment, { children: [(isProfessionalProgram || isXSeriesProgram)
|
|
45
45
|
&& canUpgrade
|
|
46
46
|
&& getCertificatePriceString(seats)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC } from 'react';\nimport { Card, Row, Col } from '@openedx/paragon';\nimport { getSiteConfig, 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';\nimport { UpgradeCourseButton } from '../ProgressCardActions/UpgradeCourseButton';\n\nexport const ProgressCard: FC<ProgressCardProps> = ({ progressCardData, isLoading, tabType }) => {\n const { formatMessage, formatDate } = useIntl();\n\n const { title, enrollment_date, end, certificateUrl, courseUrl, upgradeUrl, programType, checkoutUrl, expired, seats, description, destinationUrl, courseRunKey } = progressCardData;\n\n const inProgressTabKey = formatMessage(messages.programProgressInProgressTab).toLowerCase();\n const isInProgressTab = tabType === inProgressTabKey;\n const isRemainingTab = tabType === formatMessage(messages.programProgressRemainingTab).toLowerCase();\n const isPathwaysTab = tabType === formatMessage(messages.programProgressPathwaysTab).toLowerCase();\n const isProfessionalProgram = programType === PROGRAM_TYPE_MAP.PROFESSIONAL_CERTIFICATE;\n const isXSeriesProgram = programType === PROGRAM_TYPE_MAP.XSERIES;\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 // base string; pathways tab has no enrollment/subscription status\n let enrollmentInfo = '';\n if (!isPathwaysTab) {\n enrollmentInfo = isRemainingTab\n ? formatMessage(messages.programProgressCardIncludedInSubscriptionText)\n : formatMessage(messages.programProgressCardEnrollText);\n }\n\n // if enrollment start exists\n if (!isPathwaysTab && !isRemainingTab && enrollment_date) {\n const enrollment_date_formatted = dateFormatter(formatDate, enrollment_date, 'short');\n\n enrollmentInfo = enrollmentInfo && `${enrollmentInfo} ${enrollment_date_formatted}`;\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 {isPathwaysTab ? (\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 ? `${getSiteConfig().lmsBaseUrl}${certificateUrl}` : ''} buttonText={formatMessage(messages.programProgressCardCompletedCertificateButton)} />\n </Col>\n </Row>\n )}\n\n {isInProgressTab && (\n <>\n {(isProfessionalProgram || isXSeriesProgram)\n && canUpgrade\n && getCertificatePriceString(seats)\n && (\n <Row className=\"pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center\">\n <Col xs={12} md={8} className=\"d-flex justify-content-between align-items-center px-0\">\n <span className=\"text-start\">\n {formatMessage(messages.programProgressInProgressProfessionalCertificate)}\n </span>\n </Col>\n <Col xs={12} md={4} className=\"d-flex justify-content-between align-items-center px-0\">\n <UpgradeCourseButton\n variant=\"brand\"\n buttonText={formatMessage(messages.programProgressCardUpgradeButton)}\n title={title}\n price={getCertificatePriceString(seats)}\n courseRunKey={courseRunKey || ''}\n courseUrl={courseUrl ? `${getSiteConfig().lmsBaseUrl}${courseUrl}` : ''}\n />\n </Col>\n </Row>\n )}\n {isMicroMastersProgram\n && checkoutUrl\n && canUpgrade\n && (\n <Row className=\"pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center\">\n <Col xs={12} md={8} className=\"d-flex justify-content-between align-items-center px-0\">\n <span className=\"text-start\">\n {formatMessage(messages.programProgressInProgressMicromastersCertificate)}\n </span>\n </Col>\n <Col xs={12} md={4} className=\"d-flex justify-content-between align-items-center\">\n <ProgressCardButton\n variant=\"brand\"\n redirectUrl={checkoutUrl}\n buttonText={formatMessage(messages.programProgressInProgressCourseMicromastersUpgrade, {\n price: getCertificatePriceString(seats, true),\n })}\n />\n </Col>\n </Row>\n )}\n </>\n )}\n\n </Card.Section>\n </Card>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/containers/ProgramDashboard/ProgramProgress/ProgressCard/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC } from 'react';\nimport { Card, Row, Col } from '@openedx/paragon';\nimport { getSiteConfig, 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';\nimport { UpgradeCourseButton } from '../ProgressCardActions/UpgradeCourseButton';\n\nexport const ProgressCard: FC<ProgressCardProps> = ({ progressCardData, isLoading, tabType }) => {\n const { formatMessage, formatDate } = useIntl();\n\n const { title, enrollment_date, certificateIssuedDate, certificateUrl, courseUrl, upgradeUrl, programType, checkoutUrl, expired, seats, description, destinationUrl, courseRunKey } = progressCardData;\n\n const inProgressTabKey = formatMessage(messages.programProgressInProgressTab).toLowerCase();\n const isInProgressTab = tabType === inProgressTabKey;\n const isRemainingTab = tabType === formatMessage(messages.programProgressRemainingTab).toLowerCase();\n const isPathwaysTab = tabType === formatMessage(messages.programProgressPathwaysTab).toLowerCase();\n const isProfessionalProgram = programType === PROGRAM_TYPE_MAP.PROFESSIONAL_CERTIFICATE;\n const isXSeriesProgram = programType === PROGRAM_TYPE_MAP.XSERIES;\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 // base string; pathways tab has no enrollment/subscription status\n let enrollmentInfo = '';\n if (!isPathwaysTab) {\n enrollmentInfo = isRemainingTab\n ? formatMessage(messages.programProgressCardIncludedInSubscriptionText)\n : formatMessage(messages.programProgressCardEnrollText);\n }\n\n // if enrollment start exists\n if (!isPathwaysTab && !isRemainingTab && enrollment_date) {\n const enrollment_date_formatted = dateFormatter(formatDate, enrollment_date, 'short');\n\n enrollmentInfo = enrollmentInfo && `${enrollmentInfo} ${enrollment_date_formatted}`;\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 {isPathwaysTab ? (\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 {certificateIssuedDate && (\n formatMessage(messages.programProgressCardCompletedCertificateText, {\n certificateDate: (certificateIssuedDate ? dateFormatter(formatDate, certificateIssuedDate, 'short') : ''),\n })\n )}\n </span>\n\n <ProgressCardButton variant=\"brand\" redirectUrl={certificateUrl ? `${getSiteConfig().lmsBaseUrl}${certificateUrl}` : ''} buttonText={formatMessage(messages.programProgressCardCompletedCertificateButton)} />\n </Col>\n </Row>\n )}\n\n {isInProgressTab && (\n <>\n {(isProfessionalProgram || isXSeriesProgram)\n && canUpgrade\n && getCertificatePriceString(seats)\n && (\n <Row className=\"pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center\">\n <Col xs={12} md={8} className=\"d-flex justify-content-between align-items-center px-0\">\n <span className=\"text-start\">\n {formatMessage(messages.programProgressInProgressProfessionalCertificate)}\n </span>\n </Col>\n <Col xs={12} md={4} className=\"d-flex justify-content-between align-items-center px-0\">\n <UpgradeCourseButton\n variant=\"brand\"\n buttonText={formatMessage(messages.programProgressCardUpgradeButton)}\n title={title}\n price={getCertificatePriceString(seats)}\n courseRunKey={courseRunKey || ''}\n courseUrl={courseUrl ? `${getSiteConfig().lmsBaseUrl}${courseUrl}` : ''}\n />\n </Col>\n </Row>\n )}\n {isMicroMastersProgram\n && checkoutUrl\n && canUpgrade\n && (\n <Row className=\"pt-3 pb-2 px-2 border-top border-2 border-muted mb-2 align-items-center\">\n <Col xs={12} md={8} className=\"d-flex justify-content-between align-items-center px-0\">\n <span className=\"text-start\">\n {formatMessage(messages.programProgressInProgressMicromastersCertificate)}\n </span>\n </Col>\n <Col xs={12} md={4} className=\"d-flex justify-content-between align-items-center\">\n <ProgressCardButton\n variant=\"brand\"\n redirectUrl={checkoutUrl}\n buttonText={formatMessage(messages.programProgressInProgressCourseMicromastersUpgrade, {\n price: getCertificatePriceString(seats, true),\n })}\n />\n </Col>\n </Row>\n )}\n </>\n )}\n\n </Card.Section>\n </Card>\n );\n};\n"]}
|