richie-education 2.28.2-dev39 → 2.28.2-dev58
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/.eslintrc.json +11 -2
- package/i18n/locales/ar-SA.json +209 -125
- package/i18n/locales/es-ES.json +210 -126
- package/i18n/locales/fa-IR.json +209 -125
- package/i18n/locales/fr-CA.json +209 -125
- package/i18n/locales/fr-FR.json +209 -125
- package/i18n/locales/ko-KR.json +209 -125
- package/i18n/locales/pt-PT.json +212 -128
- package/i18n/locales/ru-RU.json +209 -125
- package/i18n/locales/vi-VN.json +209 -125
- package/js/api/joanie.ts +14 -17
- package/js/api/lms/dummy.ts +1 -12
- package/js/components/ContractFrame/AbstractContractFrame.spec.tsx +16 -9
- package/js/components/ContractFrame/AbstractContractFrame.tsx +32 -25
- package/js/components/ContractFrame/LearnerContractFrame.tsx +2 -2
- package/js/components/ContractFrame/_styles.scss +6 -14
- package/js/components/CreditCardSelector/index.spec.tsx +7 -7
- package/js/components/CreditCardSelector/index.tsx +2 -2
- package/js/components/DownloadContractButton/index.spec.tsx +1 -1
- package/js/components/OpenEdxFullNameForm/index.spec.tsx +229 -0
- package/js/components/OpenEdxFullNameForm/index.tsx +7 -7
- package/js/components/PaymentInterfaces/LyraPopIn.tsx +2 -2
- package/js/components/PaymentInterfaces/PayplugLightbox.tsx +1 -1
- package/js/components/PaymentInterfaces/__mocks__/index.tsx +1 -4
- package/js/components/PaymentInterfaces/types.ts +5 -2
- package/js/components/PurchaseButton/index.spec.tsx +69 -37
- package/js/components/SaleTunnel/AddressSelector/index.spec.tsx +2 -1
- package/js/components/SaleTunnel/CertificateSaleTunnel/index.tsx +2 -2
- package/js/components/SaleTunnel/CredentialSaleTunnel/index.tsx +6 -10
- package/js/components/SaleTunnel/GenericSaleTunnel.tsx +75 -41
- package/js/components/SaleTunnel/SaleTunnelInformation/index.tsx +0 -30
- package/js/components/SaleTunnel/SaleTunnelSavePaymentMethod/_styles.scss +12 -0
- package/js/components/SaleTunnel/SaleTunnelSavePaymentMethod/index.tsx +160 -0
- package/js/components/SaleTunnel/SaleTunnelSuccess/index.tsx +15 -29
- package/js/components/SaleTunnel/Sponsors/SaleTunnelSponsors.tsx +5 -0
- package/js/components/SaleTunnel/SubscriptionButton/_styles.scss +7 -0
- package/js/components/SaleTunnel/SubscriptionButton/index.tsx +202 -0
- package/js/components/SaleTunnel/_styles.scss +10 -1
- package/js/components/SaleTunnel/hooks/useTerms.tsx +0 -77
- package/js/components/SaleTunnel/index.credential.spec.tsx +12 -21
- package/js/components/SaleTunnel/index.full-process.spec.tsx +110 -48
- package/js/components/SaleTunnel/index.spec.tsx +330 -779
- package/js/components/SignContractButton/index.omniscientOrders.spec.tsx +16 -11
- package/js/components/SignContractButton/index.spec.tsx +16 -20
- package/js/components/SignContractButton/index.tsx +3 -1
- package/js/hooks/useCreditCards/index.spec.tsx +70 -6
- package/js/hooks/useCreditCards/index.ts +49 -11
- package/js/hooks/useOrders/index.spec.tsx +322 -0
- package/js/hooks/{useOrders.ts → useOrders/index.ts} +40 -14
- package/js/hooks/useProductOrder/index.spec.tsx +77 -60
- package/js/hooks/useProductOrder/index.tsx +2 -2
- package/js/hooks/useResources/useResourcesRoot.ts +1 -0
- package/js/pages/DashboardCreditCardsManagement/CreditCardBrandLogo.spec.tsx +1 -1
- package/js/pages/DashboardCreditCardsManagement/CreditCardBrandLogo.tsx +4 -2
- package/js/pages/TeacherDashboardContractsLayout/components/ContractActionsBar/index.spec.tsx +8 -5
- package/js/pages/TeacherDashboardContractsLayout/components/SignOrganizationContractButton/index.spec.tsx +8 -9
- package/js/pages/TeacherDashboardCourseLearnersLayout/components/CourseLearnerDataGrid/index.spec.tsx +1 -1
- package/js/pages/TeacherDashboardCourseLearnersLayout/components/CourseLearnerDataGrid/index.tsx +1 -6
- package/js/settings/settings.test.ts +11 -2
- package/js/translations/ar-SA.json +1 -1
- package/js/translations/es-ES.json +1 -1
- package/js/translations/fa-IR.json +1 -1
- package/js/translations/fr-CA.json +1 -1
- package/js/translations/fr-FR.json +1 -1
- package/js/translations/ko-KR.json +1 -1
- package/js/translations/pt-PT.json +1 -1
- package/js/translations/ru-RU.json +1 -1
- package/js/translations/vi-VN.json +1 -1
- package/js/types/Joanie.ts +49 -34
- package/js/utils/OrderHelper/index.ts +38 -42
- package/js/utils/search/getSuggestionsSection/index.spec.ts +3 -2
- package/js/utils/test/factories/joanie.ts +36 -51
- package/js/widgets/Dashboard/components/DashboardItem/CourseEnrolling/index.tsx +8 -18
- package/js/widgets/Dashboard/components/DashboardItem/Enrollment/ProductCertificateFooter/index.spec.tsx +26 -32
- package/js/widgets/Dashboard/components/DashboardItem/Enrollment/ProductCertificateFooter/index.tsx +11 -6
- package/js/widgets/Dashboard/components/DashboardItem/Order/DashboardItemOrder.spec.tsx +7 -6
- package/js/widgets/Dashboard/components/DashboardItem/Order/DashboardItemOrder.tsx +9 -10
- package/js/widgets/Dashboard/components/DashboardItem/Order/DashboardItemOrderContract.spec.tsx +3 -1
- package/js/widgets/Dashboard/components/DashboardItem/Order/DashboardItemOrderContract.useUnionResource.cache.spec.tsx +6 -7
- package/js/widgets/Dashboard/components/DashboardItem/Order/OrderPaymentDetailsModal/index.tsx +28 -8
- package/js/widgets/Dashboard/components/DashboardItem/Order/OrderPaymentRetryModal/index.tsx +4 -6
- package/js/widgets/Dashboard/components/DashboardItem/Order/OrderStateLearnerMessage/index.spec.tsx +18 -71
- package/js/widgets/Dashboard/components/DashboardItem/Order/OrderStateLearnerMessage/index.tsx +34 -35
- package/js/widgets/Dashboard/components/DashboardItem/Order/OrderStateMessage/index.tsx +27 -24
- package/js/widgets/Dashboard/components/DashboardItem/Order/OrderStateTeacherMessage/index.spec.tsx +18 -73
- package/js/widgets/Dashboard/components/DashboardItem/Order/OrderStateTeacherMessage/index.tsx +32 -16
- package/js/widgets/Dashboard/components/DashboardOrderLoader/index.tsx +3 -11
- package/js/widgets/Dashboard/components/Signature/SignatureDummy.tsx +25 -3
- package/js/widgets/SyllabusCourseRunsList/components/CourseProductItem/components/CourseProductCourseRuns/EnrollableCourseRunList.tsx +2 -6
- package/js/widgets/SyllabusCourseRunsList/components/CourseProductItem/components/CourseProductCourseRuns/index.spec.tsx +7 -14
- package/js/widgets/SyllabusCourseRunsList/components/CourseProductItem/components/CourseRunItem/index.spec.tsx +7 -5
- package/js/widgets/SyllabusCourseRunsList/components/CourseProductItem/components/CourseRunItem/index.tsx +5 -7
- package/js/widgets/SyllabusCourseRunsList/components/CourseProductItem/index.spec.tsx +242 -332
- package/js/widgets/SyllabusCourseRunsList/components/CourseProductItem/index.stories.tsx +12 -13
- package/js/widgets/SyllabusCourseRunsList/components/CourseProductItem/index.tsx +10 -21
- package/js/widgets/SyllabusCourseRunsList/components/CourseRunEnrollment/index.joanie.spec.tsx +2 -2
- package/package.json +27 -27
- package/scss/components/_index.scss +2 -1
- package/js/components/PaymentButton/_styles.scss +0 -27
- package/js/components/SaleTunnel/GenericPaymentButton/index.tsx +0 -333
- package/js/components/SaleTunnel/SaleTunnelNotValidated/index.tsx +0 -70
- package/js/widgets/SyllabusCourseRunsList/components/CourseProductItem/components/ProductSignatureHeader/index.tsx +0 -41
|
@@ -5,7 +5,6 @@ import {
|
|
|
5
5
|
Certificate,
|
|
6
6
|
CertificateDefinition,
|
|
7
7
|
CertificateOrder,
|
|
8
|
-
CertificateOrderWithPaymentInfo,
|
|
9
8
|
CertificateProduct,
|
|
10
9
|
Contract,
|
|
11
10
|
ContractDefinition,
|
|
@@ -16,7 +15,6 @@ import {
|
|
|
16
15
|
CourseProductRelation,
|
|
17
16
|
CourseRun,
|
|
18
17
|
CredentialOrder,
|
|
19
|
-
CredentialOrderWithPaymentInfo,
|
|
20
18
|
CredentialProduct,
|
|
21
19
|
CreditCard,
|
|
22
20
|
CreditCardBrand,
|
|
@@ -45,6 +43,9 @@ import { Payment, PaymentProviders } from 'components/PaymentInterfaces/types';
|
|
|
45
43
|
import { CourseStateFactory } from 'utils/test/factories/richie';
|
|
46
44
|
import { FactoryHelper } from 'utils/test/factories/helper';
|
|
47
45
|
import { JoanieUserApiAbilityActions, JoanieUserProfile } from 'types/User';
|
|
46
|
+
import { SaleTunnelContextType, SaleTunnelStep } from 'components/SaleTunnel/GenericSaleTunnel';
|
|
47
|
+
import { SaleTunnelProps } from 'components/SaleTunnel';
|
|
48
|
+
import { noop } from 'utils/index';
|
|
48
49
|
import { factory } from './factories';
|
|
49
50
|
|
|
50
51
|
export const UserLightFactory = factory((): UserLight => {
|
|
@@ -140,7 +141,7 @@ export const ContractFactory = factory((): Contract => {
|
|
|
140
141
|
organization_signatory: null,
|
|
141
142
|
created_on: faker.date.past().toISOString(),
|
|
142
143
|
definition: ContractDefinitionFactory().one(),
|
|
143
|
-
order: NestedCredentialOrderFactory().one(),
|
|
144
|
+
order: NestedCredentialOrderFactory({ state: OrderState.TO_SIGN }).one(),
|
|
144
145
|
};
|
|
145
146
|
});
|
|
146
147
|
|
|
@@ -314,7 +315,7 @@ export const NestedCourseOrderFactory = factory((): NestedCourseOrder => {
|
|
|
314
315
|
owner: UserLightFactory().one(),
|
|
315
316
|
course_id: faker.string.uuid(),
|
|
316
317
|
product_id: faker.string.uuid(),
|
|
317
|
-
state: OrderState.
|
|
318
|
+
state: OrderState.COMPLETED,
|
|
318
319
|
enrollment_id: faker.string.uuid(),
|
|
319
320
|
organization: OrganizationFactory().one(),
|
|
320
321
|
certificate_id: faker.string.uuid(),
|
|
@@ -363,7 +364,7 @@ export const OrderEnrollmentFactory = factory((): OrderEnrollment => {
|
|
|
363
364
|
return {
|
|
364
365
|
id: faker.string.uuid(),
|
|
365
366
|
product_id: faker.string.uuid(),
|
|
366
|
-
state: OrderState.
|
|
367
|
+
state: OrderState.COMPLETED,
|
|
367
368
|
};
|
|
368
369
|
});
|
|
369
370
|
|
|
@@ -375,19 +376,19 @@ export const OrderLiteFactory = factory((): OrderLite => {
|
|
|
375
376
|
main_invoice_reference: faker.string.uuid(),
|
|
376
377
|
total: faker.number.int(),
|
|
377
378
|
product_id: faker.string.uuid(),
|
|
378
|
-
state: OrderState.
|
|
379
|
+
state: OrderState.COMPLETED,
|
|
379
380
|
};
|
|
380
381
|
});
|
|
381
382
|
|
|
382
383
|
export const NestedCertificateOrderFactory = factory((): NestedCertificateOrder => {
|
|
383
384
|
return {
|
|
384
385
|
id: faker.string.uuid(),
|
|
385
|
-
course:
|
|
386
|
+
course: null,
|
|
386
387
|
enrollment: EnrollmentLightFactory().one(),
|
|
387
388
|
organization: OrganizationFactory().one(),
|
|
388
389
|
product_title: FactoryHelper.unique(faker.lorem.words, { args: [1] }),
|
|
389
390
|
owner_name: faker.internet.userName(),
|
|
390
|
-
state: OrderState.
|
|
391
|
+
state: OrderState.COMPLETED,
|
|
391
392
|
};
|
|
392
393
|
});
|
|
393
394
|
|
|
@@ -395,11 +396,11 @@ export const NestedCredentialOrderFactory = factory((): NestedCredentialOrder =>
|
|
|
395
396
|
return {
|
|
396
397
|
id: faker.string.uuid(),
|
|
397
398
|
course: CourseLightFactory().one(),
|
|
398
|
-
enrollment:
|
|
399
|
+
enrollment: null,
|
|
399
400
|
organization: OrganizationFactory().one(),
|
|
400
401
|
product_title: FactoryHelper.unique(faker.lorem.words, { args: [1] }),
|
|
401
402
|
owner_name: faker.internet.userName(),
|
|
402
|
-
state: OrderState.
|
|
403
|
+
state: OrderState.COMPLETED,
|
|
403
404
|
};
|
|
404
405
|
});
|
|
405
406
|
|
|
@@ -411,7 +412,7 @@ const AbstractOrderFactory = factory((): Order => {
|
|
|
411
412
|
total: faker.number.int(),
|
|
412
413
|
total_currency: faker.finance.currencyCode(),
|
|
413
414
|
main_invoice_reference: faker.string.uuid(),
|
|
414
|
-
state: OrderState.
|
|
415
|
+
state: OrderState.COMPLETED,
|
|
415
416
|
product_id: faker.string.uuid(),
|
|
416
417
|
target_courses: TargetCourseFactory().many(5),
|
|
417
418
|
target_enrollments: [],
|
|
@@ -422,56 +423,22 @@ const AbstractOrderFactory = factory((): Order => {
|
|
|
422
423
|
};
|
|
423
424
|
});
|
|
424
425
|
|
|
425
|
-
export const CredentialOrderFactory = factory(
|
|
426
|
-
|
|
426
|
+
export const CredentialOrderFactory = factory(
|
|
427
|
+
(): CredentialOrder => ({
|
|
427
428
|
...AbstractOrderFactory().one(),
|
|
428
429
|
course: CourseLightFactory().one(),
|
|
429
430
|
enrollment: null,
|
|
430
431
|
payment_schedule: PaymentInstallmentFactory().many(3),
|
|
431
|
-
}
|
|
432
|
-
return order;
|
|
433
|
-
});
|
|
434
|
-
|
|
435
|
-
export const CredentialOrderWithPaymentFactory = factory((): CredentialOrderWithPaymentInfo => {
|
|
436
|
-
return {
|
|
437
|
-
...CredentialOrderFactory().one(),
|
|
438
|
-
payment_info: PaymentFactory().one(),
|
|
439
|
-
};
|
|
440
|
-
});
|
|
441
|
-
|
|
442
|
-
export const CredentialOrderWithOneClickPaymentFactory = factory(
|
|
443
|
-
(): CredentialOrderWithPaymentInfo => {
|
|
444
|
-
return {
|
|
445
|
-
...CredentialOrderFactory().one(),
|
|
446
|
-
payment_info: PaymentFactory().one(),
|
|
447
|
-
};
|
|
448
|
-
},
|
|
432
|
+
}),
|
|
449
433
|
);
|
|
450
434
|
|
|
451
|
-
export const CertificateOrderFactory = factory(
|
|
452
|
-
|
|
435
|
+
export const CertificateOrderFactory = factory(
|
|
436
|
+
(): CertificateOrder => ({
|
|
453
437
|
...AbstractOrderFactory().one(),
|
|
454
438
|
course: null,
|
|
455
439
|
target_courses: [],
|
|
456
440
|
enrollment: EnrollmentLightFactory().one(),
|
|
457
|
-
}
|
|
458
|
-
return order;
|
|
459
|
-
});
|
|
460
|
-
|
|
461
|
-
export const CertificateOrderWithPaymentFactory = factory((): CertificateOrderWithPaymentInfo => {
|
|
462
|
-
return {
|
|
463
|
-
...CertificateOrderFactory().one(),
|
|
464
|
-
payment_info: PaymentFactory().one(),
|
|
465
|
-
};
|
|
466
|
-
});
|
|
467
|
-
|
|
468
|
-
export const CertificateOrderWithOneClickPaymentFactory = factory(
|
|
469
|
-
(): CertificateOrderWithPaymentInfo => {
|
|
470
|
-
return {
|
|
471
|
-
...CertificateOrderFactory().one(),
|
|
472
|
-
payment_info: PaymentFactory().one(),
|
|
473
|
-
};
|
|
474
|
-
},
|
|
441
|
+
}),
|
|
475
442
|
);
|
|
476
443
|
|
|
477
444
|
export const AddressFactory = factory((): Address => {
|
|
@@ -507,3 +474,21 @@ export const PaymentFactory = factory((): Payment => {
|
|
|
507
474
|
url: faker.internet.url(),
|
|
508
475
|
};
|
|
509
476
|
});
|
|
477
|
+
|
|
478
|
+
export const SaleTunnelContextFactory = factory(
|
|
479
|
+
(): SaleTunnelContextType => ({
|
|
480
|
+
webAnalyticsEventKey: 'eventKey',
|
|
481
|
+
order: CredentialOrderFactory().one(),
|
|
482
|
+
product: ProductFactory().one(),
|
|
483
|
+
props: {} as SaleTunnelProps,
|
|
484
|
+
billingAddress: undefined,
|
|
485
|
+
setBillingAddress: noop,
|
|
486
|
+
setCreditCard: noop,
|
|
487
|
+
onPaymentSuccess: noop,
|
|
488
|
+
step: SaleTunnelStep.IDLE,
|
|
489
|
+
registerSubmitCallback: noop,
|
|
490
|
+
unregisterSubmitCallback: noop,
|
|
491
|
+
runSubmitCallbacks: () => new Promise((resolve) => resolve()),
|
|
492
|
+
nextStep: noop,
|
|
493
|
+
}),
|
|
494
|
+
);
|
|
@@ -9,7 +9,6 @@ import {
|
|
|
9
9
|
CourseRun,
|
|
10
10
|
CredentialOrder,
|
|
11
11
|
Enrollment,
|
|
12
|
-
Product,
|
|
13
12
|
} from 'types/Joanie';
|
|
14
13
|
import { Spinner } from 'components/Spinner';
|
|
15
14
|
import Banner, { BannerType } from 'components/Banner';
|
|
@@ -68,10 +67,11 @@ const messages = defineMessages({
|
|
|
68
67
|
description: 'Text displayed when course runs list is loading',
|
|
69
68
|
id: 'components.DashboardItemCourseEnrollingRun.courseRunsLoading',
|
|
70
69
|
},
|
|
71
|
-
|
|
72
|
-
id: 'components.DashboardItemCourseEnrollingRun.
|
|
73
|
-
description:
|
|
74
|
-
|
|
70
|
+
cannotEnroll: {
|
|
71
|
+
id: 'components.DashboardItemCourseEnrollingRun.cannotEnroll',
|
|
72
|
+
description:
|
|
73
|
+
'Message displayed as disabled button title when the order state does not allow enrollment.',
|
|
74
|
+
defaultMessage: 'You cannot enroll yet to this training.',
|
|
75
75
|
},
|
|
76
76
|
});
|
|
77
77
|
|
|
@@ -81,7 +81,6 @@ interface DashboardItemCourseEnrollingProps {
|
|
|
81
81
|
course: AbstractCourse;
|
|
82
82
|
activeEnrollment?: Enrollment;
|
|
83
83
|
order?: CredentialOrder;
|
|
84
|
-
product?: Product;
|
|
85
84
|
writable: boolean;
|
|
86
85
|
hideEnrollButtons?: boolean;
|
|
87
86
|
icon?: boolean;
|
|
@@ -93,7 +92,6 @@ export const DashboardItemCourseEnrolling = ({
|
|
|
93
92
|
activeEnrollment,
|
|
94
93
|
writable,
|
|
95
94
|
order,
|
|
96
|
-
product,
|
|
97
95
|
icon = false,
|
|
98
96
|
notEnrolledUrl = '#',
|
|
99
97
|
hideEnrollButtons,
|
|
@@ -121,7 +119,6 @@ export const DashboardItemCourseEnrolling = ({
|
|
|
121
119
|
course={course}
|
|
122
120
|
enrollments={CoursesHelper.findCourseEnrollmentsInOrder(course, order)}
|
|
123
121
|
order={order}
|
|
124
|
-
product={product}
|
|
125
122
|
/>
|
|
126
123
|
)}
|
|
127
124
|
</div>
|
|
@@ -132,14 +129,12 @@ interface DashboardItemCourseEnrollingRunsProps {
|
|
|
132
129
|
course: AbstractCourse;
|
|
133
130
|
enrollments: Enrollment[];
|
|
134
131
|
order?: CredentialOrder;
|
|
135
|
-
product?: Product;
|
|
136
132
|
}
|
|
137
133
|
|
|
138
134
|
const DashboardItemCourseEnrollingRuns = ({
|
|
139
135
|
course,
|
|
140
136
|
enrollments,
|
|
141
137
|
order,
|
|
142
|
-
product,
|
|
143
138
|
}: DashboardItemCourseEnrollingRunsProps) => {
|
|
144
139
|
const { enroll, isLoading, error } = useEnroll(enrollments, order);
|
|
145
140
|
|
|
@@ -176,7 +171,6 @@ const DashboardItemCourseEnrollingRuns = ({
|
|
|
176
171
|
selected={data.selected}
|
|
177
172
|
enroll={() => enroll(data.courseRun)}
|
|
178
173
|
order={order}
|
|
179
|
-
product={product}
|
|
180
174
|
/>
|
|
181
175
|
))}
|
|
182
176
|
{isLoading && (
|
|
@@ -200,7 +194,6 @@ interface DashboardItemCourseEnrollingRunProps {
|
|
|
200
194
|
selected: boolean;
|
|
201
195
|
enroll: () => void;
|
|
202
196
|
order?: CredentialOrder | CertificateOrder;
|
|
203
|
-
product?: Product;
|
|
204
197
|
}
|
|
205
198
|
|
|
206
199
|
export const DashboardItemCourseEnrollingRun = ({
|
|
@@ -208,14 +201,11 @@ export const DashboardItemCourseEnrollingRun = ({
|
|
|
208
201
|
selected,
|
|
209
202
|
enroll,
|
|
210
203
|
order,
|
|
211
|
-
product,
|
|
212
204
|
}: DashboardItemCourseEnrollingRunProps) => {
|
|
213
205
|
const intl = useIntl();
|
|
214
206
|
const formatDate = useDateFormat();
|
|
215
207
|
const courseRunPeriodMessage = useCourseRunPeriodMessage(courseRun, selected);
|
|
216
|
-
const
|
|
217
|
-
? OrderHelper.orderNeedsSignature(order, product?.contract_definition)
|
|
218
|
-
: false;
|
|
208
|
+
const canEnroll = OrderHelper.allowEnrollment(order);
|
|
219
209
|
const isOpenedForEnrollment = useMemo(
|
|
220
210
|
() => courseRun.state.priority < Priority.FUTURE_NOT_YET_OPEN,
|
|
221
211
|
[courseRun],
|
|
@@ -266,11 +256,11 @@ export const DashboardItemCourseEnrollingRun = ({
|
|
|
266
256
|
) : (
|
|
267
257
|
<div>
|
|
268
258
|
<Button
|
|
269
|
-
disabled={!isOpenedForEnrollment ||
|
|
259
|
+
disabled={!isOpenedForEnrollment || !canEnroll}
|
|
270
260
|
color="tertiary"
|
|
271
261
|
size="small"
|
|
272
262
|
onClick={enroll}
|
|
273
|
-
title={
|
|
263
|
+
title={!canEnroll ? intl.formatMessage(messages.cannotEnroll) : ''}
|
|
274
264
|
>
|
|
275
265
|
<FormattedMessage {...messages.enrollRun} />
|
|
276
266
|
</Button>
|
|
@@ -1,7 +1,13 @@
|
|
|
1
1
|
import { screen, waitForElementToBeRemoved } from '@testing-library/react';
|
|
2
2
|
import fetchMock from 'fetch-mock';
|
|
3
3
|
import userEvent from '@testing-library/user-event';
|
|
4
|
-
import {
|
|
4
|
+
import {
|
|
5
|
+
CertificateProduct,
|
|
6
|
+
CourseLight,
|
|
7
|
+
OrderState,
|
|
8
|
+
ProductType,
|
|
9
|
+
PURCHASABLE_ORDER_STATES,
|
|
10
|
+
} from 'types/Joanie';
|
|
5
11
|
import {
|
|
6
12
|
CourseStateFactory,
|
|
7
13
|
RichieContextFactory as mockRichieContextFactory,
|
|
@@ -43,7 +49,7 @@ jest.mock('components/SaleTunnel', () => ({
|
|
|
43
49
|
return;
|
|
44
50
|
}
|
|
45
51
|
setTimeout(() => {
|
|
46
|
-
const order = Factories.
|
|
52
|
+
const order = Factories.CertificateOrderFactory().one();
|
|
47
53
|
onFinish?.(order);
|
|
48
54
|
}, 100);
|
|
49
55
|
}, [isOpen]);
|
|
@@ -135,7 +141,7 @@ describe('<ProductCertificateFooter/>', () => {
|
|
|
135
141
|
it('should display download button for a course run with certificate.', () => {
|
|
136
142
|
const order = OrderEnrollmentFactory({
|
|
137
143
|
certificate_id: 'FAKE_CERTIFICATE_ID',
|
|
138
|
-
state: OrderState.
|
|
144
|
+
state: OrderState.COMPLETED,
|
|
139
145
|
product_id: product.id,
|
|
140
146
|
}).one();
|
|
141
147
|
const enrollment = EnrollmentFactory({
|
|
@@ -151,35 +157,23 @@ describe('<ProductCertificateFooter/>', () => {
|
|
|
151
157
|
expect(screen.queryByTestId('PurchaseButton__cta')).not.toBeInTheDocument();
|
|
152
158
|
});
|
|
153
159
|
|
|
154
|
-
it
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
certificate_id: undefined,
|
|
172
|
-
product_id: product.id,
|
|
173
|
-
state: OrderState.PENDING,
|
|
174
|
-
}).one();
|
|
175
|
-
const enrollment = EnrollmentFactory({
|
|
176
|
-
orders: [order],
|
|
177
|
-
course_run: CourseRunFactory({ course }).one(),
|
|
178
|
-
}).one();
|
|
179
|
-
render(<ProductCertificateFooter product={product} enrollment={enrollment} />);
|
|
180
|
-
expect(screen.queryByRole('button', { name: 'Download' })).not.toBeInTheDocument();
|
|
181
|
-
expect(screen.getByTestId('PurchaseButton__cta')).toBeInTheDocument();
|
|
182
|
-
});
|
|
160
|
+
it.each(PURCHASABLE_ORDER_STATES)(
|
|
161
|
+
'should display purchase button for a course run with %s order.',
|
|
162
|
+
(state) => {
|
|
163
|
+
const order = OrderEnrollmentFactory({
|
|
164
|
+
certificate_id: undefined,
|
|
165
|
+
product_id: product.id,
|
|
166
|
+
state,
|
|
167
|
+
}).one();
|
|
168
|
+
const enrollment = EnrollmentFactory({
|
|
169
|
+
orders: [order],
|
|
170
|
+
course_run: CourseRunFactory({ course }).one(),
|
|
171
|
+
}).one();
|
|
172
|
+
render(<ProductCertificateFooter product={product} enrollment={enrollment} />);
|
|
173
|
+
expect(screen.queryByRole('button', { name: 'Download' })).not.toBeInTheDocument();
|
|
174
|
+
expect(screen.getByTestId('PurchaseButton__cta')).toBeInTheDocument();
|
|
175
|
+
},
|
|
176
|
+
);
|
|
183
177
|
|
|
184
178
|
it('should not display button (download or purchase) for a course run with order but without certificate.', () => {
|
|
185
179
|
const order = OrderEnrollmentFactory({
|
package/js/widgets/Dashboard/components/DashboardItem/Enrollment/ProductCertificateFooter/index.tsx
CHANGED
|
@@ -2,7 +2,12 @@ import { FormattedMessage, defineMessages } from 'react-intl';
|
|
|
2
2
|
import { useState } from 'react';
|
|
3
3
|
import PurchaseButton from 'components/PurchaseButton';
|
|
4
4
|
import { Icon, IconTypeEnum } from 'components/Icon';
|
|
5
|
-
import {
|
|
5
|
+
import {
|
|
6
|
+
CertificateProduct,
|
|
7
|
+
Enrollment,
|
|
8
|
+
ProductType,
|
|
9
|
+
PURCHASABLE_ORDER_STATES,
|
|
10
|
+
} from 'types/Joanie';
|
|
6
11
|
import DownloadCertificateButton from 'components/DownloadCertificateButton';
|
|
7
12
|
import { useCertificate } from 'hooks/useCertificates';
|
|
8
13
|
import { isOpenedCourseRunCertificate } from 'utils/CourseRuns';
|
|
@@ -51,7 +56,7 @@ const ProductCertificateFooter = ({ product, enrollment }: ProductCertificateFoo
|
|
|
51
56
|
<div className="dashboard-item__course-enrolling__infos">
|
|
52
57
|
<div className="dashboard-item__block__status">
|
|
53
58
|
<Icon name={IconTypeEnum.CERTIFICATE} />
|
|
54
|
-
{order
|
|
59
|
+
{OrderHelper.isActive(order) ? (
|
|
55
60
|
<>
|
|
56
61
|
{product.certificate_definition.title + '. '}
|
|
57
62
|
<CertificateStatus certificate={certificate} productType={product.type} />
|
|
@@ -60,11 +65,11 @@ const ProductCertificateFooter = ({ product, enrollment }: ProductCertificateFoo
|
|
|
60
65
|
<FormattedMessage {...messages.buyProductCertificateLabel} />
|
|
61
66
|
)}
|
|
62
67
|
</div>
|
|
63
|
-
{order
|
|
64
|
-
order
|
|
68
|
+
{OrderHelper.isActive(order) ? (
|
|
69
|
+
order!.certificate_id && (
|
|
65
70
|
<DownloadCertificateButton
|
|
66
71
|
className="dashboard-item__button"
|
|
67
|
-
certificateId={order
|
|
72
|
+
certificateId={order!.certificate_id}
|
|
68
73
|
/>
|
|
69
74
|
)
|
|
70
75
|
) : (
|
|
@@ -73,7 +78,7 @@ const ProductCertificateFooter = ({ product, enrollment }: ProductCertificateFoo
|
|
|
73
78
|
product={product}
|
|
74
79
|
enrollment={enrollment}
|
|
75
80
|
buttonProps={{ size: 'small' }}
|
|
76
|
-
disabled={order
|
|
81
|
+
disabled={order && !PURCHASABLE_ORDER_STATES.includes(order.state)}
|
|
77
82
|
onFinish={(o) => {
|
|
78
83
|
/**
|
|
79
84
|
* As we do not refetch enrollments in DashboardCourses after SaleTunnel cache invalidation (to avoid
|
|
@@ -22,8 +22,8 @@ import {
|
|
|
22
22
|
CourseLightFactory,
|
|
23
23
|
CourseRunFactory,
|
|
24
24
|
CredentialOrderFactory,
|
|
25
|
-
CredentialOrderWithPaymentFactory,
|
|
26
25
|
EnrollmentFactory,
|
|
26
|
+
PaymentFactory,
|
|
27
27
|
TargetCourseFactory,
|
|
28
28
|
} from 'utils/test/factories/joanie';
|
|
29
29
|
import {
|
|
@@ -91,7 +91,7 @@ describe('<DashboardItemOrder/>', () => {
|
|
|
91
91
|
|
|
92
92
|
await screen.findByRole('heading', { level: 5, name: product.title });
|
|
93
93
|
await screen.findByText('Ref. ' + (order.course as CourseLight).code);
|
|
94
|
-
await screen.findByText('Pending');
|
|
94
|
+
await screen.findByText('Pending for the first direct debit');
|
|
95
95
|
await screen.findByRole('link', { name: 'View details' });
|
|
96
96
|
});
|
|
97
97
|
|
|
@@ -119,7 +119,7 @@ describe('<DashboardItemOrder/>', () => {
|
|
|
119
119
|
|
|
120
120
|
await screen.findByRole('heading', { level: 5, name: product.title });
|
|
121
121
|
await screen.findByText('Ref. ' + (order.course as CourseLight).code);
|
|
122
|
-
await screen.findByText('
|
|
122
|
+
await screen.findByText('Successfully completed');
|
|
123
123
|
await screen.findByRole('link', { name: 'View details' });
|
|
124
124
|
await expectSpinner('Loading certificate...');
|
|
125
125
|
deferred.resolve(certificate);
|
|
@@ -138,7 +138,7 @@ describe('<DashboardItemOrder/>', () => {
|
|
|
138
138
|
|
|
139
139
|
await screen.findByRole('heading', { level: 5, name: product.title });
|
|
140
140
|
await screen.findByText('Ref. ' + (order.course as CourseLight).code);
|
|
141
|
-
await screen.findByText('
|
|
141
|
+
await screen.findByText('Successfully completed');
|
|
142
142
|
await screen.findByRole('link', { name: 'View details' });
|
|
143
143
|
await expectNoSpinner('Loading certificate ...');
|
|
144
144
|
});
|
|
@@ -870,7 +870,8 @@ describe('<DashboardItemOrder/>', () => {
|
|
|
870
870
|
});
|
|
871
871
|
|
|
872
872
|
it('renders a writable order with failed payment and retry it successfully', async () => {
|
|
873
|
-
const
|
|
873
|
+
const order = CredentialOrderFactory().one();
|
|
874
|
+
const paymentInfo = PaymentFactory().one();
|
|
874
875
|
|
|
875
876
|
const validOrder = { ...order };
|
|
876
877
|
validOrder.payment_schedule = [
|
|
@@ -921,7 +922,7 @@ describe('<DashboardItemOrder/>', () => {
|
|
|
921
922
|
screen.getByText(
|
|
922
923
|
/The payment failed, please choose another payment method or add a new one during the payment/,
|
|
923
924
|
);
|
|
924
|
-
screen.getByText('Use another credit card
|
|
925
|
+
screen.getByText('Use another credit card');
|
|
925
926
|
|
|
926
927
|
// Prepare for cache invalidation.
|
|
927
928
|
fetchMock.get(
|
|
@@ -164,13 +164,16 @@ export const DashboardItemOrder = ({
|
|
|
164
164
|
course_id: course.code,
|
|
165
165
|
});
|
|
166
166
|
const { product } = courseProductRelation || {};
|
|
167
|
-
const needsSignature = OrderHelper.orderNeedsSignature(order
|
|
167
|
+
const needsSignature = OrderHelper.orderNeedsSignature(order);
|
|
168
|
+
const canEnroll = OrderHelper.allowEnrollment(order);
|
|
169
|
+
|
|
170
|
+
if (!product) return null;
|
|
168
171
|
|
|
169
172
|
return (
|
|
170
173
|
<div className="dashboard-item-order">
|
|
171
174
|
<DashboardItem
|
|
172
175
|
data-testid={`dashboard-item-order-${order.id}`}
|
|
173
|
-
title={product
|
|
176
|
+
title={product.title}
|
|
174
177
|
code={'Ref. ' + course.code}
|
|
175
178
|
imageUrl={course.cover?.src}
|
|
176
179
|
more={
|
|
@@ -185,10 +188,7 @@ export const DashboardItemOrder = ({
|
|
|
185
188
|
<div className="dashboard-item-order__footer">
|
|
186
189
|
<div className="dashboard-item__block__status">
|
|
187
190
|
<Icon name={IconTypeEnum.SCHOOL} />
|
|
188
|
-
<OrderStateLearnerMessage
|
|
189
|
-
order={order}
|
|
190
|
-
contractDefinition={product?.contract_definition}
|
|
191
|
-
/>
|
|
191
|
+
<OrderStateLearnerMessage order={order} />
|
|
192
192
|
</div>
|
|
193
193
|
{showDetailsButton && (
|
|
194
194
|
<RouterButton
|
|
@@ -206,7 +206,7 @@ export const DashboardItemOrder = ({
|
|
|
206
206
|
key={`DashboardItemOrderContract_${order.id}`}
|
|
207
207
|
title={product.title}
|
|
208
208
|
order={order}
|
|
209
|
-
contract_definition={product
|
|
209
|
+
contract_definition={product.contract_definition!}
|
|
210
210
|
contract={order.contract}
|
|
211
211
|
writable={writable}
|
|
212
212
|
mode="compact"
|
|
@@ -224,7 +224,6 @@ export const DashboardItemOrder = ({
|
|
|
224
224
|
writable={writable}
|
|
225
225
|
course={targetCourse}
|
|
226
226
|
order={order}
|
|
227
|
-
product={product}
|
|
228
227
|
activeEnrollment={CoursesHelper.findActiveCourseEnrollmentInOrder(
|
|
229
228
|
targetCourse,
|
|
230
229
|
order,
|
|
@@ -232,7 +231,7 @@ export const DashboardItemOrder = ({
|
|
|
232
231
|
notEnrolledUrl={generatePath(LearnerDashboardPaths.ORDER, {
|
|
233
232
|
orderId: order.id,
|
|
234
233
|
})}
|
|
235
|
-
hideEnrollButtons={
|
|
234
|
+
hideEnrollButtons={!canEnroll}
|
|
236
235
|
/>
|
|
237
236
|
}
|
|
238
237
|
/>
|
|
@@ -397,7 +396,7 @@ const ContractItem = ({ product, order }: { order: CredentialOrder; product: Pro
|
|
|
397
396
|
return;
|
|
398
397
|
}
|
|
399
398
|
|
|
400
|
-
const needsSignature = OrderHelper.orderNeedsSignature(order
|
|
399
|
+
const needsSignature = OrderHelper.orderNeedsSignature(order);
|
|
401
400
|
return (
|
|
402
401
|
<div
|
|
403
402
|
id={`dashboard-item-contract-${order.id}`}
|
package/js/widgets/Dashboard/components/DashboardItem/Order/DashboardItemOrderContract.spec.tsx
CHANGED
|
@@ -3,7 +3,7 @@ import { faker } from '@faker-js/faker';
|
|
|
3
3
|
import { screen } from '@testing-library/react';
|
|
4
4
|
import { RichieContextFactory as mockRichieContextFactory } from 'utils/test/factories/richie';
|
|
5
5
|
import { DashboardTest } from 'widgets/Dashboard/components/DashboardTest';
|
|
6
|
-
import { CourseLight } from 'types/Joanie';
|
|
6
|
+
import { CourseLight, OrderState } from 'types/Joanie';
|
|
7
7
|
import {
|
|
8
8
|
ContractDefinitionFactory,
|
|
9
9
|
ContractFactory,
|
|
@@ -124,6 +124,7 @@ describe('<DashboardItemOrder/> Contract', () => {
|
|
|
124
124
|
|
|
125
125
|
it('renders a non-writable order with a contract not signed yet', async () => {
|
|
126
126
|
const order = CredentialOrderFactory({
|
|
127
|
+
state: OrderState.TO_SIGN,
|
|
127
128
|
target_courses: TargetCourseFactory().many(1),
|
|
128
129
|
target_enrollments: [],
|
|
129
130
|
contract: ContractFactory({ student_signed_on: undefined }).one(),
|
|
@@ -186,6 +187,7 @@ describe('<DashboardItemOrder/> Contract', () => {
|
|
|
186
187
|
});
|
|
187
188
|
it('renders a writable order with a contract not signed yet', async () => {
|
|
188
189
|
const order = CredentialOrderFactory({
|
|
190
|
+
state: OrderState.TO_SIGN,
|
|
189
191
|
target_courses: TargetCourseFactory().many(1),
|
|
190
192
|
target_enrollments: [],
|
|
191
193
|
contract: null,
|
|
@@ -19,6 +19,7 @@ import { render } from 'utils/test/render';
|
|
|
19
19
|
import { BaseJoanieAppWrapper } from 'utils/test/wrappers/BaseJoanieAppWrapper';
|
|
20
20
|
|
|
21
21
|
import { LearnerDashboardPaths } from 'widgets/Dashboard/utils/learnerRoutesPaths';
|
|
22
|
+
import { OrderState } from 'types/Joanie';
|
|
22
23
|
|
|
23
24
|
jest.mock('utils/context', () => ({
|
|
24
25
|
__esModule: true,
|
|
@@ -49,9 +50,10 @@ describe('<DashboardItemOrder/> Contract', () => {
|
|
|
49
50
|
describe('writable', () => {
|
|
50
51
|
it('successfully sign a contract', async () => {
|
|
51
52
|
const order = CredentialOrderFactory({
|
|
53
|
+
state: OrderState.TO_SIGN,
|
|
52
54
|
target_courses: TargetCourseFactory().many(1),
|
|
53
55
|
target_enrollments: [],
|
|
54
|
-
contract: ContractFactory({ student_signed_on:
|
|
56
|
+
contract: ContractFactory({ student_signed_on: null }).one(),
|
|
55
57
|
}).one();
|
|
56
58
|
|
|
57
59
|
// learner dashboard course page do one call to course product relation per order
|
|
@@ -82,6 +84,7 @@ describe('<DashboardItemOrder/> Contract', () => {
|
|
|
82
84
|
`https://joanie.endpoint/api/v1.0/orders/${order.id}/submit_for_signature/`,
|
|
83
85
|
submitDeferred.promise,
|
|
84
86
|
);
|
|
87
|
+
fetchMock.post(`https://joanie.endpoint/api/v1.0/signature/notifications/`, 200);
|
|
85
88
|
|
|
86
89
|
// delay: null is needed because as we are using fake timers it would mock the timers of
|
|
87
90
|
// RTL too. See https://github.com/testing-library/user-event/issues/833.
|
|
@@ -92,11 +95,7 @@ describe('<DashboardItemOrder/> Contract', () => {
|
|
|
92
95
|
});
|
|
93
96
|
|
|
94
97
|
await expectNoSpinner('Loading orders and enrollments...');
|
|
95
|
-
|
|
96
|
-
expect(
|
|
97
|
-
await screen.findByRole('heading', { level: 5, name: product.title }),
|
|
98
|
-
).toBeInTheDocument();
|
|
99
|
-
|
|
98
|
+
await screen.findByRole('heading', { level: 5, name: product.title });
|
|
100
99
|
// Make sure the sign button is shown.
|
|
101
100
|
await user.click(screen.getByRole('link', { name: 'Sign' }));
|
|
102
101
|
|
|
@@ -212,7 +211,7 @@ describe('<DashboardItemOrder/> Contract', () => {
|
|
|
212
211
|
// We have the success message.
|
|
213
212
|
await screen.findByRole('heading', { name: 'Congratulations!' });
|
|
214
213
|
screen.getByText(
|
|
215
|
-
'You will receive an email once your contract will be fully signed. You can now
|
|
214
|
+
'You will receive an email once your contract will be fully signed. You can now finalize your subscription.',
|
|
216
215
|
);
|
|
217
216
|
const nextButton = screen.getByRole('button', { name: 'Next' });
|
|
218
217
|
|