FE-667: Lodash import fix. Apple pay make payment fix. (#278)

src/app/components/app/modal-container/user-interaction-modal/user-interaction-modal.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { connect } from 'react-redux';
-import { get } from 'lodash-es';
+import get from 'lodash-es/get';
 import * as styles from './user-interaction-modal.scss';
 import {
     EventInteractionObject,

src/app/sagas/finish-interaction/finish-interaction.ts

@@ -1,4 +1,4 @@
-import { last } from 'lodash-es';
+import last from 'lodash-es/last';
 import { call, CallEffect, ForkEffect, put, select, takeLatest } from 'redux-saga/effects';
 import { goToFormInfo, TypeKeys } from 'checkout/actions';
 import { ConfigState, ModelState, ResultFormInfo, ResultType, State, EventsStatus } from 'checkout/state';

src/app/sagas/payment/pay.ts

@@ -1,5 +1,5 @@
 import { call, CallEffect, ForkEffect, put, PutEffect, select, SelectEffect, takeLatest } from 'redux-saga/effects';
-import { last } from 'lodash-es';
+import last from 'lodash-es/last';
 import {
     GoToFormInfo,
     goToFormInfo,

src/app/sagas/payment/provide-payment/create-invoice-with-template.ts

@@ -2,7 +2,7 @@ import { call, CallEffect, put, PutEffect } from 'redux-saga/effects';
 import { InvoiceTemplate, createInvoiceWithTemplate as request } from 'checkout/backend';
 import { InvoiceCreated, TypeKeys } from 'checkout/actions';
 import { AmountInfoState, AmountInfoStatus } from 'checkout/state';
-import { formAmountToMinorNumver } from 'checkout/utils';
+import { formAmountToMinorNumber } from 'checkout/utils';
 
 export type Effects = CallEffect | PutEffect<InvoiceCreated>;
 
@@ -11,7 +11,7 @@ const getAmount = (amountInfo: AmountInfoState, formAmount: string): number => {
         case AmountInfoStatus.final:
             return amountInfo.minorValue;
         case AmountInfoStatus.notKnown:
-            return formAmountToMinorNumver(formAmount);
+            return formAmountToMinorNumber(formAmount);
     }
 };
 

src/app/sagas/payment/provide-payment/make-payment.ts

@@ -1,22 +1,20 @@
 import { call, CallEffect } from 'redux-saga/effects';
 import { AmountInfoState, ModelState, PayableFormValues } from 'checkout/state';
 import { getPayableInvoice } from './get-payable-invoice';
-import { InvoiceEvent, PaymentResource } from 'checkout/backend';
+import { PaymentResource } from 'checkout/backend';
 import { Config } from 'checkout/config';
 import { createPayment } from './create-payment';
 import { pollInvoiceEvents } from '../../poll-events';
 
 type CreatePaymentResourceFn = () => Iterator<PaymentResource>;
 
-type Effects = CallEffect | InvoiceEvent;
-
 export function* makePayment(
     config: Config,
     model: ModelState,
     values: PayableFormValues,
     amountInfo: AmountInfoState,
     fn: CreatePaymentResourceFn
-): Iterator<Effects> {
+): Iterator<CallEffect> {
     const { initConfig, appConfig } = config;
     const { capiEndpoint } = appConfig;
     const {
@@ -25,5 +23,5 @@ export function* makePayment(
     } = yield call(getPayableInvoice, initConfig, capiEndpoint, model, amountInfo, values.amount);
     const paymentResource = yield call(fn, invoiceAccessToken);
     yield call(createPayment, capiEndpoint, invoiceAccessToken, id, values.email, paymentResource, initConfig);
-    return yield call(pollInvoiceEvents, capiEndpoint, invoiceAccessToken, id);
+    yield call(pollInvoiceEvents, capiEndpoint, invoiceAccessToken, id);
 }

src/app/sagas/payment/provide-payment/pay-with-apple-pay/begin-session.ts

@@ -1,5 +1,5 @@
-import { validateMerchant } from './validate-merchant';
 import { call, CallEffect } from 'redux-saga/effects';
+import { validateMerchant } from './validate-merchant';
 import { Config } from 'checkout/config';
 import { LogicError } from 'checkout/backend';
 
@@ -20,11 +20,15 @@ const toLogicError = (errorEvent: any): LogicError => {
     }
 };
 
-const begin = (session: ApplePaySession, endpoint: string, payload: ApplePayPayload): Promise<ApplePayPayment> =>
+const begin = (
+    session: ApplePaySession,
+    validationEndpoint: string,
+    payload: ApplePayPayload
+): Promise<ApplePayPayment> =>
     new Promise((resolve, reject) => {
         session.onvalidatemerchant = (event) =>
-            validateMerchant(endpoint, payload, event.validationURL)
+            validateMerchant(validationEndpoint, payload, event.validationURL)
-                .then((response: any) => session.completeMerchantValidation(response))
+                .then((response) => session.completeMerchantValidation(response))
                 .catch((error) => {
                     session.abort();
                     reject(toLogicError(error));
@@ -36,11 +40,10 @@ const begin = (session: ApplePaySession, endpoint: string, payload: ApplePayPayl
 
 export function* beginSession(config: Config, session: ApplePaySession): Iterator<CallEffect> {
     const { applePayMerchantID, wrapperEndpoint } = config.appConfig;
-    const applePayMerchantValidationEndpoint = wrapperEndpoint + '/applepay';
     const payload = {
         merchantIdentifier: applePayMerchantID,
-        domainName: new URL(config.origin).hostname,
+        domainName: location.hostname,
         displayName: 'RBKmoney Checkout'
     };
-    return yield call(begin, session, applePayMerchantValidationEndpoint, payload);
+    return yield call(begin, session, `${wrapperEndpoint}/applepay`, payload);
 }

src/app/sagas/payment/provide-payment/pay-with-apple-pay/get-session-status.ts

@@ -30,6 +30,9 @@ const fromInvoiceStatusChanged = (change: InvoiceStatusChanged): boolean => {
 
 const isSuccess = (event: InvoiceEvent): boolean => {
     const change = last(event.changes);
+    if (!change) {
+        return false;
+    }
     switch (change.changeType) {
         case InvoiceChangeType.PaymentStatusChanged:
             return fromPaymentStatusChanged(change as PaymentStatusChanged);

src/app/sagas/payment/provide-payment/pay-with-apple-pay/pay-with-apple-pay.ts

@@ -1,12 +1,12 @@
-import { call } from 'redux-saga/effects';
+import { call, CallEffect, select, SelectEffect } from 'redux-saga/effects';
-import { AmountInfoState, ModelState, TokenProviderFormValues } from 'checkout/state';
+import last from 'lodash-es/last';
+import { AmountInfoState, ModelState, State, TokenProviderFormValues } from 'checkout/state';
 import { Config } from 'checkout/config';
 import { beginSession } from './begin-session';
 import { createSession } from './create-session';
 import { createApplePay } from '../../../create-payment-resource';
 import { PaymentMethod, BankCard } from 'checkout/backend/model';
 import { makePayment } from '../make-payment';
-import { ProvidePaymentEffects } from '../provide-payment';
 import { PaymentMethodName } from 'checkout/backend/model/payment-method';
 import { PaymentSystem } from 'checkout/backend/model/payment-system';
 import { getSessionStatus } from './get-session-status';
@@ -26,7 +26,7 @@ export function* payWithApplePay(
     m: ModelState,
     a: AmountInfoState,
     v: TokenProviderFormValues
-): Iterator<ProvidePaymentEffects> {
+): Iterator<SelectEffect | CallEffect> {
     const {
         initConfig: { description, name },
         appConfig
@@ -38,9 +38,9 @@ export function* payWithApplePay(
     const { capiEndpoint, applePayMerchantID } = appConfig;
     try {
         const fn = createPaymentResource(capiEndpoint, applePayMerchantID, paymentToken);
-        const event = yield call(makePayment, c, m, v, a, fn);
+        yield call(makePayment, c, m, v, a, fn);
+        const event = yield select((s: State) => last(s.events.events));
         session.completePayment(getSessionStatus(event));
-        return event;
     } catch (error) {
         session.completePayment(ApplePaySession.STATUS_FAILURE);
         throw error;

src/app/sagas/payment/provide-payment/pay-with-bank-card.ts

@@ -1,9 +1,8 @@
-import { call } from 'redux-saga/effects';
+import { call, CallEffect } from 'redux-saga/effects';
 import { AmountInfoState, CardFormValues, ModelState } from 'checkout/state';
 import { Config } from 'checkout/config';
 import { createCardData } from '../../create-payment-resource';
 import { makePayment } from './make-payment';
-import { ProvidePaymentEffects } from './provide-payment';
 
 const createPaymentResource = (endpoint: string, formValues: CardFormValues) =>
     createCardData.bind(null, endpoint, formValues);
@@ -13,7 +12,7 @@ export function* payWithBankCard(
     m: ModelState,
     a: AmountInfoState,
     v: CardFormValues
-): Iterator<ProvidePaymentEffects> {
+): Iterator<CallEffect> {
     const fn = createPaymentResource(c.appConfig.capiEndpoint, v);
-    return yield call(makePayment, c, m, v, a, fn);
+    yield call(makePayment, c, m, v, a, fn);
 }

src/app/sagas/payment/provide-payment/pay-with-digital-wallet-qiwi.ts

@@ -1,7 +1,6 @@
-import { call } from 'redux-saga/effects';
+import { call, CallEffect } from 'redux-saga/effects';
 import { AmountInfoState, ModelState, WalletFormValues } from 'checkout/state';
 import { Config } from 'checkout/config';
-import { ProvidePaymentEffects } from './provide-payment';
 import { createDigitalWalletQiwi } from '../../create-payment-resource';
 import { makePayment } from './make-payment';
 
@@ -13,7 +12,7 @@ export function* payWithDigitalWalletQiwi(
     m: ModelState,
     a: AmountInfoState,
     v: WalletFormValues
-): Iterator<ProvidePaymentEffects> {
+): Iterator<CallEffect> {
     const fn = createPaymentResource(c.appConfig.capiEndpoint, v);
-    return yield call(makePayment, c, m, v, a, fn);
+    yield call(makePayment, c, m, v, a, fn);
 }

src/app/sagas/payment/provide-payment/pay-with-google-pay/pay-with-google-pay.ts

@@ -1,9 +1,8 @@
-import { call } from 'redux-saga/effects';
+import { call, CallEffect } from 'redux-saga/effects';
 import { AmountInfoState, ModelState, TokenProviderFormValues } from 'checkout/state';
 import { Config } from 'checkout/config';
 import { makePayment } from '../make-payment';
 import { getPaymentData } from './get-payment-data';
-import { ProvidePaymentEffects } from '../provide-payment';
 import { createGooglePay } from '../../../create-payment-resource';
 
 const createPaymentResource = (endpoint: string, googlePayMerchantID: string, paymentData: PaymentData) =>
@@ -14,11 +13,11 @@ export function* payWithGooglePay(
     m: ModelState,
     a: AmountInfoState,
     v: TokenProviderFormValues
-): Iterator<ProvidePaymentEffects> {
+): Iterator<CallEffect> {
     const {
         appConfig: { googlePayMerchantID, googlePayGatewayMerchantID, capiEndpoint }
     } = c;
     const paymentData = yield call(getPaymentData, googlePayMerchantID, googlePayGatewayMerchantID, a, v.amount);
     const fn = createPaymentResource(capiEndpoint, googlePayGatewayMerchantID, paymentData);
-    return yield call(makePayment, c, m, v, a, fn);
+    yield call(makePayment, c, m, v, a, fn);
 }

src/app/sagas/payment/provide-payment/pay-with-samsung-pay/pay-with-samsung-pay.ts

@@ -6,7 +6,7 @@ import {
     ModelState,
     TokenProviderFormValues
 } from 'checkout/state';
-import { call, put, PutEffect } from 'redux-saga/effects';
+import { call, CallEffect, put, PutEffect } from 'redux-saga/effects';
 import { TypeKeys } from 'checkout/actions';
 import { Transaction } from 'checkout/backend';
 import { ResultData, Type, URIPath } from '../../../../../constants/samsung-pay-communicator';
@@ -14,7 +14,6 @@ import { makePayment } from 'checkout/sagas/payment/provide-payment/make-payment
 import { createSamsungPay } from 'checkout/sagas/create-payment-resource/create-samsung-pay';
 import { createTransaction } from './create-transaction';
 import { getResultData } from './get-result-data';
-import { ProvidePaymentEffects } from 'checkout/sagas/payment/provide-payment/provide-payment';
 import { SetModalState } from 'checkout/actions/modal-actions/set-modal-state';
 import { TokenizedInteractionObject } from 'checkout/state/modal/modal-interaction';
 
@@ -26,7 +25,7 @@ export function* payWithSamsungPay(
     m: ModelState,
     a: AmountInfoState,
     v: TokenProviderFormValues
-): Iterator<Promise<Transaction> | PutEffect<SetModalState> | Promise<ResultData> | ProvidePaymentEffects> {
+): Iterator<Promise<Transaction> | PutEffect<SetModalState> | Promise<ResultData> | CallEffect> {
     const {
         appConfig,
         appConfig: { samsungPayServiceID, capiEndpoint },
@@ -46,7 +45,7 @@ export function* payWithSamsungPay(
     const resultData: ResultData = yield getResultData(transaction, samsungPayServiceID, locale);
     if (resultData.type === Type.SUCCESS) {
         const fn = createPaymentResource(capiEndpoint, resultData.refId, samsungPayServiceID);
-        return yield call(makePayment, c, m, v, a, fn);
+        yield call(makePayment, c, m, v, a, fn);
     } else {
         throw { code: resultData.code || 'error.samsung.pay.cancel' };
     }

src/app/sagas/payment/provide-payment/pay-with-terminal-euroset.ts

@@ -1,6 +1,5 @@
-import { call } from 'redux-saga/effects';
+import { call, CallEffect } from 'redux-saga/effects';
 import { createTerminalEuroset } from '../../create-payment-resource';
-import { ProvidePaymentEffects } from './provide-payment';
 import { AmountInfoState, ModelState, PayableFormValues } from 'checkout/state';
 import { Config } from 'checkout/config';
 import { makePayment } from './make-payment';
@@ -12,7 +11,7 @@ export function* payWithTerminalEuroset(
     m: ModelState,
     a: AmountInfoState,
     v: PayableFormValues
-): Iterator<ProvidePaymentEffects> {
+): Iterator<CallEffect> {
     const fn = createPaymentResource(c.appConfig.capiEndpoint);
-    return yield call(makePayment, c, m, v, a, fn);
+    yield call(makePayment, c, m, v, a, fn);
 }

src/app/sagas/payment/provide-payment/provide-payment.ts

@@ -1,6 +1,5 @@
 import { call, CallEffect } from 'redux-saga/effects';
 import { AmountInfoState, ConfigState, ModelState, PayableFormValues, PaymentMethodName } from 'checkout/state';
-import { InvoiceEvent } from 'checkout/backend';
 import { payWithApplePay } from './pay-with-apple-pay';
 import { payWithBankCard } from './pay-with-bank-card';
 import { payWithDigitalWalletQiwi } from './pay-with-digital-wallet-qiwi';
@@ -8,8 +7,6 @@ import { payWithTerminalEuroset } from './pay-with-terminal-euroset';
 import { payWithGooglePay } from './pay-with-google-pay';
 import { payWithSamsungPay } from './pay-with-samsung-pay';
 
-export type ProvidePaymentEffects = CallEffect | InvoiceEvent;
-
 const getPayFn = (method: PaymentMethodName) => {
     switch (method) {
         case PaymentMethodName.ApplePay:
@@ -35,7 +32,7 @@ export function* providePayment(
     m: ModelState,
     a: AmountInfoState,
     v: PayableFormValues
-): Iterator<ProvidePaymentEffects> {
+): Iterator<CallEffect> {
     const values = v ? v : { amount: null, email: null };
-    return yield getPayFn(method)(c, m, a, values);
+    yield getPayFn(method)(c, m, a, values);
 }

src/app/sagas/poll-events/poll-customer-events.ts

@@ -1,6 +1,6 @@
-import { last } from 'lodash-es';
+import last from 'lodash-es/last';
 import { delay } from 'redux-saga';
-import { call, CallEffect, put, PutEffect, race, RaceEffect, select, SelectEffect } from 'redux-saga/effects';
+import { call, put, race, select, CallEffect, PutEffect, RaceEffect, SelectEffect } from 'redux-saga/effects';
 import { CustomerChangeType, CustomerEvent, getCustomerEvents } from 'checkout/backend';
 import { SetEventsAction, TypeKeys } from 'checkout/actions';
 import { State } from 'checkout/state';
@@ -50,7 +50,7 @@ export function* pollCustomerEvents(
     endpoint: string,
     token: string,
     invoiceID: string
-): Iterator<PutEffect<SetEventsAction> | RaceEffect> {
+): Iterator<RaceEffect | PutEffect<SetEventsAction>> {
     const [result] = yield race<any>([call(poll, endpoint, token, invoiceID), call(delay, 60000)]);
     if (result) {
         return yield put({

src/app/sagas/poll-events/poll-invoice-events.ts

@@ -1,6 +1,6 @@
-import { last } from 'lodash-es';
+import last from 'lodash-es/last';
 import { delay } from 'redux-saga';
-import { call, CallEffect, put, PutEffect, race, RaceEffect, select, SelectEffect } from 'redux-saga/effects';
+import { call, put, race, select, CallEffect, PutEffect, RaceEffect, SelectEffect } from 'redux-saga/effects';
 import { InvoiceEvent, getInvoiceEvents, InvoiceChangeType } from 'checkout/backend';
 import { SetEventsAction, TypeKeys } from 'checkout/actions';
 import { State } from 'checkout/state';
@@ -51,7 +51,7 @@ export function* pollInvoiceEvents(
     endpoint: string,
     token: string,
     invoiceID: string
-): Iterator<PutEffect<SetEventsAction> | RaceEffect> {
+): Iterator<RaceEffect | PutEffect<SetEventsAction>> {
     const [result] = yield race<any>([call(poll, endpoint, token, invoiceID), call(delay, 60000)]);
     if (result) {
         return yield put({

src/app/sagas/subscription/subscribe.ts

@@ -1,5 +1,5 @@
 import { CallEffect, ForkEffect, PutEffect, SelectEffect, put, call, select, takeLatest } from 'redux-saga/effects';
-import { last } from 'lodash-es';
+import last from 'lodash-es/last';
 import {
     PrepareToPay,
     TypeKeys,

src/app/utils/amount/form-amount-to-minor-number.ts

@@ -1,4 +1,4 @@
-import { toNumber } from 'lodash-es';
+import toNumber from 'lodash-es/toNumber';
 
-export const formAmountToMinorNumver = (formAmount: string): number =>
+export const formAmountToMinorNumber = (formAmount: string): number =>
     toNumber(formAmount.replace(/\s/g, '').replace(/,/g, '.')) * 100;