tonder-web-sdk 1.12.0-beta.1 → 1.12.0-beta.10
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/.idea/workspace.xml +38 -32
- package/package.json +1 -1
- package/src/classes/BaseInlineCheckout.js +35 -15
- package/src/classes/LiteInlineCheckout.js +149 -46
- package/src/classes/inlineCheckout.js +30 -10
- package/src/data/apmApi.js +1 -1
- package/src/data/cardApi.js +22 -12
- package/src/data/checkoutApi.js +17 -6
- package/src/data/customerApi.js +1 -1
- package/src/helpers/template.js +5 -4
- package/src/helpers/utils.js +18 -245
- package/src/index-dev.js +3 -2
- package/src/index.js +2 -0
- package/src/shared/catalog/paymentMethodsCatalog.js +247 -0
- package/src/shared/constants/messages.js +10 -0
- package/types/card.ts +33 -0
- package/types/checkout.ts +118 -0
- package/types/common.ts +26 -0
- package/types/customer.ts +11 -0
- package/types/index.d.ts +8 -76
- package/types/inlineCheckout.d.ts +22 -0
- package/types/liteInlineCheckout.d.ts +32 -0
- package/types/paymentMethod.ts +24 -0
- package/types/transaction.ts +101 -0
- package/v1/bundle.min.js +3 -3
package/.idea/workspace.xml
CHANGED
|
@@ -5,19 +5,15 @@
|
|
|
5
5
|
</component>
|
|
6
6
|
<component name="ChangeListManager">
|
|
7
7
|
<list default="true" id="37fc62e5-7dd0-4a2e-b68c-304069cdf5bd" name="Changes" comment="">
|
|
8
|
-
<change afterPath="$PROJECT_DIR
|
|
9
|
-
<change afterPath="$PROJECT_DIR$/
|
|
10
|
-
<change afterPath="$PROJECT_DIR$/
|
|
11
|
-
<change afterPath="$PROJECT_DIR$/
|
|
12
|
-
<change afterPath="$PROJECT_DIR$/
|
|
13
|
-
<change afterPath="$PROJECT_DIR$/
|
|
14
|
-
<change afterPath="$PROJECT_DIR$/
|
|
15
|
-
<change afterPath="$PROJECT_DIR$/
|
|
16
|
-
<change afterPath="$PROJECT_DIR$/
|
|
17
|
-
<change afterPath="$PROJECT_DIR$/src/data/openPayApi.js" afterDir="false" />
|
|
18
|
-
<change afterPath="$PROJECT_DIR$/src/data/skyflowApi.js" afterDir="false" />
|
|
19
|
-
<change afterPath="$PROJECT_DIR$/src/shared/constants/paymentMethodAPM.js" afterDir="false" />
|
|
20
|
-
<change afterPath="$PROJECT_DIR$/src/shared/constants/tonderUrl.js" afterDir="false" />
|
|
8
|
+
<change afterPath="$PROJECT_DIR$/src/shared/catalog/paymentMethodsCatalog.js" afterDir="false" />
|
|
9
|
+
<change afterPath="$PROJECT_DIR$/types/card.ts" afterDir="false" />
|
|
10
|
+
<change afterPath="$PROJECT_DIR$/types/checkout.ts" afterDir="false" />
|
|
11
|
+
<change afterPath="$PROJECT_DIR$/types/common.ts" afterDir="false" />
|
|
12
|
+
<change afterPath="$PROJECT_DIR$/types/customer.ts" afterDir="false" />
|
|
13
|
+
<change afterPath="$PROJECT_DIR$/types/inlineCheckout.d.ts" afterDir="false" />
|
|
14
|
+
<change afterPath="$PROJECT_DIR$/types/liteInlineCheckout.d.ts" afterDir="false" />
|
|
15
|
+
<change afterPath="$PROJECT_DIR$/types/paymentMethod.ts" afterDir="false" />
|
|
16
|
+
<change afterPath="$PROJECT_DIR$/types/transaction.ts" afterDir="false" />
|
|
21
17
|
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
|
|
22
18
|
<change beforePath="$PROJECT_DIR$/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/package-lock.json" afterDir="false" />
|
|
23
19
|
<change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
|
|
@@ -25,9 +21,12 @@
|
|
|
25
21
|
<change beforePath="$PROJECT_DIR$/src/data/api.js" beforeDir="false" />
|
|
26
22
|
<change beforePath="$PROJECT_DIR$/src/helpers/constants.js" beforeDir="false" />
|
|
27
23
|
<change beforePath="$PROJECT_DIR$/src/helpers/skyflow.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/helpers/skyflow.js" afterDir="false" />
|
|
24
|
+
<change beforePath="$PROJECT_DIR$/src/helpers/template.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/helpers/template.js" afterDir="false" />
|
|
28
25
|
<change beforePath="$PROJECT_DIR$/src/helpers/utils.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/helpers/utils.js" afterDir="false" />
|
|
29
26
|
<change beforePath="$PROJECT_DIR$/src/index-dev.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/index-dev.js" afterDir="false" />
|
|
30
27
|
<change beforePath="$PROJECT_DIR$/src/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/src/index.html" afterDir="false" />
|
|
28
|
+
<change beforePath="$PROJECT_DIR$/src/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/index.js" afterDir="false" />
|
|
29
|
+
<change beforePath="$PROJECT_DIR$/v1/bundle.min.js" beforeDir="false" afterPath="$PROJECT_DIR$/v1/bundle.min.js" afterDir="false" />
|
|
31
30
|
</list>
|
|
32
31
|
<option name="SHOW_DIALOG" value="false" />
|
|
33
32
|
<option name="HIGHLIGHT_CONFLICTS" value="true" />
|
|
@@ -59,25 +58,25 @@
|
|
|
59
58
|
<option name="openDirectoriesWithSingleClick" value="true" />
|
|
60
59
|
<option name="showLibraryContents" value="true" />
|
|
61
60
|
</component>
|
|
62
|
-
<component name="PropertiesComponent"
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
61
|
+
<component name="PropertiesComponent">{
|
|
62
|
+
"keyToString": {
|
|
63
|
+
"Node.js.index-dev.js.executor": "Run",
|
|
64
|
+
"RunOnceActivity.OpenProjectViewOnStart": "true",
|
|
65
|
+
"RunOnceActivity.ShowReadmeOnStart": "true",
|
|
66
|
+
"SHARE_PROJECT_CONFIGURATION_FILES": "true",
|
|
67
|
+
"git-widget-placeholder": "develop",
|
|
68
|
+
"last_opened_file_path": "/Users/davidhernandezalmagro/Desktop/Tonder/tonder-sdk/src/shared/constants",
|
|
69
|
+
"node.js.detected.package.eslint": "true",
|
|
70
|
+
"node.js.detected.package.tslint": "true",
|
|
71
|
+
"node.js.selected.package.eslint": "(autodetect)",
|
|
72
|
+
"node.js.selected.package.tslint": "(autodetect)",
|
|
73
|
+
"nodejs_package_manager_path": "npm",
|
|
74
|
+
"prettierjs.PrettierConfiguration.Package": "/Users/davidhernandezalmagro/Desktop/Tonder/tonder-sdk/node_modules/prettier",
|
|
75
|
+
"settings.editor.selected.configurable": "settings.javascript.prettier",
|
|
76
|
+
"ts.external.directory.path": "/Applications/WebStorm.app/Contents/plugins/javascript-impl/jsLanguageServicesImpl/external",
|
|
77
|
+
"vue.rearranger.settings.migration": "true"
|
|
79
78
|
}
|
|
80
|
-
}
|
|
79
|
+
}</component>
|
|
81
80
|
<component name="RecentsManager">
|
|
82
81
|
<key name="CopyFile.RECENT_KEYS">
|
|
83
82
|
<recent name="$PROJECT_DIR$/src/shared/constants" />
|
|
@@ -112,6 +111,7 @@
|
|
|
112
111
|
<workItem from="1723774667217" duration="11739000" />
|
|
113
112
|
<workItem from="1723855727317" duration="20341000" />
|
|
114
113
|
<workItem from="1723952592527" duration="17418000" />
|
|
114
|
+
<workItem from="1724247675743" duration="33401000" />
|
|
115
115
|
</task>
|
|
116
116
|
<servers />
|
|
117
117
|
</component>
|
|
@@ -134,13 +134,19 @@
|
|
|
134
134
|
<breakpoints>
|
|
135
135
|
<line-breakpoint enabled="true" type="javascript">
|
|
136
136
|
<url>file://$PROJECT_DIR$/src/classes/inlineCheckout.js</url>
|
|
137
|
-
<line>
|
|
137
|
+
<line>158</line>
|
|
138
138
|
<option name="timeStamp" value="1" />
|
|
139
139
|
</line-breakpoint>
|
|
140
140
|
<line-breakpoint enabled="true" type="javascript">
|
|
141
141
|
<url>file://$PROJECT_DIR$/src/shared/constants/paymentMethodAPM.js</url>
|
|
142
142
|
<option name="timeStamp" value="15" />
|
|
143
143
|
</line-breakpoint>
|
|
144
|
+
<line-breakpoint enabled="true" type="javascript">
|
|
145
|
+
<url>file://$PROJECT_DIR$/src/classes/inlineCheckout.js</url>
|
|
146
|
+
<line>110</line>
|
|
147
|
+
<properties lambdaOrdinal="-1" />
|
|
148
|
+
<option name="timeStamp" value="17" />
|
|
149
|
+
</line-breakpoint>
|
|
144
150
|
</breakpoints>
|
|
145
151
|
</breakpoint-manager>
|
|
146
152
|
</component>
|
package/package.json
CHANGED
|
@@ -1,19 +1,23 @@
|
|
|
1
1
|
import { ThreeDSHandler } from "./3dsHandler.js";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
createOrder,
|
|
4
|
+
fetchBusiness,
|
|
5
|
+
getOpenpayDeviceSessionID,
|
|
6
|
+
registerOrFetchCustomer,
|
|
7
|
+
} from "../data";
|
|
3
8
|
import { TONDER_URL_BY_MODE } from "../shared/constants/tonderUrl";
|
|
4
9
|
import { globalLoader } from "./globalLoader";
|
|
5
|
-
import {createPayment, startCheckoutRouter} from "../data/checkoutApi";
|
|
6
|
-
import {getBrowserInfo, injectMercadoPagoSecurity} from "../helpers/utils";
|
|
10
|
+
import { createPayment, startCheckoutRouter } from "../data/checkoutApi";
|
|
11
|
+
import { getBrowserInfo, injectMercadoPagoSecurity } from "../helpers/utils";
|
|
7
12
|
|
|
8
13
|
export class BaseInlineCheckout {
|
|
9
14
|
baseUrl = "";
|
|
10
|
-
cartTotal = "0"
|
|
15
|
+
cartTotal = "0";
|
|
11
16
|
constructor({
|
|
12
17
|
mode = "stage",
|
|
13
18
|
apiKey,
|
|
14
19
|
returnUrl,
|
|
15
20
|
callBack = () => {},
|
|
16
|
-
sdkMode = "full",
|
|
17
21
|
}) {
|
|
18
22
|
this.apiKeyTonder = apiKey;
|
|
19
23
|
this.returnUrl = returnUrl;
|
|
@@ -25,22 +29,43 @@ export class BaseInlineCheckout {
|
|
|
25
29
|
apiKey: apiKey,
|
|
26
30
|
baseUrl: this.baseUrl,
|
|
27
31
|
});
|
|
28
|
-
this.sdkMode = sdkMode;
|
|
29
32
|
}
|
|
30
33
|
|
|
34
|
+
/**
|
|
35
|
+
* The configureCheckout function allows you to set initial information, such as the customer's email, which is used to retrieve a list of saved cards.
|
|
36
|
+
* @param {import("../../types").IConfigureCheckout} data - Configuration data including customer information and potentially other settings.
|
|
37
|
+
* @returns {Promise<void>}.
|
|
38
|
+
* @public
|
|
39
|
+
*/
|
|
31
40
|
configureCheckout(data) {
|
|
32
41
|
if ("customer" in data) this.#handleCustomer(data["customer"]);
|
|
33
42
|
}
|
|
34
43
|
|
|
44
|
+
/**
|
|
45
|
+
* Verifies the 3DS transaction status.
|
|
46
|
+
* @returns {Promise<import("../../types").ITransaction | void>} The result of the 3DS verification and checkout resumption.
|
|
47
|
+
* @public
|
|
48
|
+
*/
|
|
35
49
|
async verify3dsTransaction() {
|
|
36
|
-
globalLoader.show();
|
|
50
|
+
globalLoader.show();
|
|
37
51
|
const result3ds = await this.process3ds.verifyTransactionStatus();
|
|
38
52
|
const resultCheckout = await this.#resumeCheckout(result3ds);
|
|
39
53
|
this.process3ds.setPayload(resultCheckout);
|
|
40
|
-
globalLoader.remove();
|
|
54
|
+
globalLoader.remove();
|
|
41
55
|
return this.#handle3dsRedirect(resultCheckout);
|
|
42
56
|
}
|
|
43
57
|
|
|
58
|
+
/**
|
|
59
|
+
* Processes a payment.
|
|
60
|
+
* @param {import("../../types").IProcessPaymentRequest} data - Payment data including customer, cart, and other relevant information.
|
|
61
|
+
* @returns {Promise<import("../../types").IStartCheckoutResponse>} A promise that resolves with the payment response or 3DS redirect or is rejected with an error.
|
|
62
|
+
*
|
|
63
|
+
* @throws {Error} Throws an error if the checkout process fails. The error object contains
|
|
64
|
+
* additional `details` property with the response from the server if available.
|
|
65
|
+
* @property {import("../../types").IStartCheckoutErrorResponse} error.details - The response body from the server when an error occurs.
|
|
66
|
+
*
|
|
67
|
+
* @public
|
|
68
|
+
*/
|
|
44
69
|
payment(data) {
|
|
45
70
|
return new Promise(async (resolve, reject) => {
|
|
46
71
|
try {
|
|
@@ -50,6 +75,7 @@ export class BaseInlineCheckout {
|
|
|
50
75
|
this.#handleMetadata(data);
|
|
51
76
|
this.#handleCurrency(data);
|
|
52
77
|
this.#handleCard(data);
|
|
78
|
+
console.log("data", data)
|
|
53
79
|
const response = await this._checkout(data);
|
|
54
80
|
this.process3ds.setPayload(response);
|
|
55
81
|
this.callBack(response);
|
|
@@ -92,13 +118,7 @@ export class BaseInlineCheckout {
|
|
|
92
118
|
);
|
|
93
119
|
}
|
|
94
120
|
|
|
95
|
-
async _handleCheckout(
|
|
96
|
-
{
|
|
97
|
-
card,
|
|
98
|
-
payment_method,
|
|
99
|
-
customer
|
|
100
|
-
}
|
|
101
|
-
) {
|
|
121
|
+
async _handleCheckout({ card, payment_method, customer }) {
|
|
102
122
|
const { openpay_keys, reference, business } = this.merchantData;
|
|
103
123
|
const total = Number(this.cartTotal);
|
|
104
124
|
|
|
@@ -4,81 +4,164 @@ import {
|
|
|
4
4
|
fetchCustomerCards,
|
|
5
5
|
saveCustomerCard,
|
|
6
6
|
removeCustomerCard,
|
|
7
|
+
registerOrFetchCustomer,
|
|
7
8
|
} from "../data";
|
|
8
|
-
import { buildErrorResponseFromCatch } from "../helpers/utils";
|
|
9
|
-
import { getVaultToken } from "../data/skyflowApi";
|
|
10
9
|
import { getSkyflowTokens } from "../helpers/skyflow";
|
|
10
|
+
import { getPaymentMethodDetails } from "../shared/catalog/paymentMethodsCatalog";
|
|
11
|
+
import { formatPublicErrorResponse } from "../helpers/utils";
|
|
12
|
+
import { MESSAGES } from "../shared/constants/messages";
|
|
11
13
|
|
|
12
14
|
export class LiteInlineCheckout extends BaseInlineCheckout {
|
|
15
|
+
#customerData;
|
|
13
16
|
constructor({ mode = "stage", apiKey, returnUrl, callBack = () => {} }) {
|
|
17
|
+
|
|
14
18
|
super({ mode, apiKey, returnUrl, callBack });
|
|
15
19
|
}
|
|
16
20
|
|
|
21
|
+
/**
|
|
22
|
+
* Initializes and prepares the checkout for use.
|
|
23
|
+
* This method set up the initial environment.
|
|
24
|
+
* @returns {Promise<void>} A promise that resolves when the checkout has been initialized.
|
|
25
|
+
* @throws {Error} If there's any problem during the checkout initialization.
|
|
26
|
+
* @public
|
|
27
|
+
*/
|
|
17
28
|
async injectCheckout() {
|
|
18
29
|
await this._initializeCheckout();
|
|
19
30
|
}
|
|
20
31
|
|
|
21
32
|
/**
|
|
22
33
|
* Retrieves the list of cards associated with a customer.
|
|
23
|
-
* @
|
|
24
|
-
*
|
|
25
|
-
* @
|
|
34
|
+
* @returns {Promise<import("../../types").ICustomerCardsResponse>} A promise that resolves with the customer's card data.
|
|
35
|
+
*
|
|
36
|
+
* @throws {import("../../types").IPublicError} Throws an error object if the operation fails.
|
|
37
|
+
*
|
|
26
38
|
* @public
|
|
27
39
|
*/
|
|
28
|
-
async getCustomerCards(
|
|
29
|
-
|
|
40
|
+
async getCustomerCards() {
|
|
41
|
+
try {
|
|
42
|
+
const { auth_token } = await this.#getCustomer();
|
|
43
|
+
return await fetchCustomerCards(
|
|
44
|
+
this.baseUrl,
|
|
45
|
+
auth_token,
|
|
46
|
+
this.merchantData.business.pk,
|
|
47
|
+
);
|
|
48
|
+
} catch (error) {
|
|
49
|
+
throw formatPublicErrorResponse(
|
|
50
|
+
{
|
|
51
|
+
message: MESSAGES.getCardsError,
|
|
52
|
+
},
|
|
53
|
+
error,
|
|
54
|
+
);
|
|
55
|
+
}
|
|
30
56
|
}
|
|
31
57
|
|
|
32
58
|
/**
|
|
33
59
|
* Saves a card to a customer's account. This method can be used to add a new card
|
|
34
60
|
* or update an existing one.
|
|
35
|
-
* @param {
|
|
36
|
-
* @
|
|
37
|
-
*
|
|
38
|
-
* @
|
|
61
|
+
* @param {import("../../types").ISaveCardRequest} card - The card information to be saved.
|
|
62
|
+
* @returns {Promise<import("../../types").ISaveCardResponse>} A promise that resolves with the saved card data.
|
|
63
|
+
*
|
|
64
|
+
* @throws {import("../../types").IPublicError} Throws an error object if the operation fails.
|
|
65
|
+
*
|
|
39
66
|
* @public
|
|
40
67
|
*/
|
|
41
|
-
async saveCustomerCard(
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
68
|
+
async saveCustomerCard(card) {
|
|
69
|
+
try {
|
|
70
|
+
const { auth_token } = await this.#getCustomer();
|
|
71
|
+
const { vault_id, vault_url, business } = this.merchantData;
|
|
72
|
+
|
|
73
|
+
const skyflowTokens = await getSkyflowTokens({
|
|
74
|
+
vault_id: vault_id,
|
|
75
|
+
vault_url: vault_url,
|
|
76
|
+
data: card,
|
|
77
|
+
baseUrl: this.baseUrl,
|
|
78
|
+
apiKey: this.apiKeyTonder,
|
|
79
|
+
});
|
|
80
|
+
|
|
81
|
+
return await saveCustomerCard(
|
|
82
|
+
this.baseUrl,
|
|
83
|
+
auth_token,
|
|
84
|
+
business?.pk,
|
|
85
|
+
skyflowTokens,
|
|
86
|
+
);
|
|
87
|
+
} catch (error) {
|
|
88
|
+
throw formatPublicErrorResponse(
|
|
89
|
+
{
|
|
90
|
+
message: MESSAGES.saveCardError,
|
|
91
|
+
},
|
|
92
|
+
error,
|
|
93
|
+
);
|
|
94
|
+
}
|
|
56
95
|
}
|
|
57
96
|
|
|
58
97
|
/**
|
|
59
98
|
* Removes a card from a customer's account.
|
|
60
|
-
* @param {string} authToken - The customer's authentication token.
|
|
61
99
|
* @param {string} skyflowId - The unique identifier of the card to be deleted.
|
|
62
|
-
* @
|
|
63
|
-
*
|
|
100
|
+
* @returns {Promise<string>} A promise that resolves when the card is successfully deleted.
|
|
101
|
+
*
|
|
102
|
+
* @throws {import("../../types").IPublicError} Throws an error object if the operation fails.
|
|
103
|
+
*
|
|
64
104
|
* @public
|
|
65
105
|
*/
|
|
66
|
-
async removeCustomerCard(
|
|
67
|
-
|
|
68
|
-
this
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
106
|
+
async removeCustomerCard(skyflowId) {
|
|
107
|
+
try{
|
|
108
|
+
const { auth_token } = await this.#getCustomer();
|
|
109
|
+
const { business } = this.merchantData;
|
|
110
|
+
|
|
111
|
+
return await removeCustomerCard(
|
|
112
|
+
this.baseUrl,
|
|
113
|
+
auth_token,
|
|
114
|
+
skyflowId,
|
|
115
|
+
business?.pk,
|
|
116
|
+
);
|
|
117
|
+
}catch (error){
|
|
118
|
+
throw formatPublicErrorResponse(
|
|
119
|
+
{
|
|
120
|
+
message: MESSAGES.removeCardError,
|
|
121
|
+
},
|
|
122
|
+
error,
|
|
123
|
+
);
|
|
124
|
+
}
|
|
73
125
|
}
|
|
74
126
|
|
|
75
127
|
/**
|
|
76
128
|
* Retrieves the list of available Alternative Payment Methods (APMs).
|
|
77
|
-
* @returns {Promise<
|
|
129
|
+
* @returns {Promise<import("../../types").IPaymentMethod[]>} A promise that resolves with the list of APMs.
|
|
130
|
+
*
|
|
131
|
+
* @throws {import("../../types").IPublicError} Throws an error object if the operation fails.
|
|
132
|
+
*
|
|
78
133
|
* @public
|
|
79
134
|
*/
|
|
80
|
-
async
|
|
81
|
-
|
|
135
|
+
async getCustomerPaymentMethods() {
|
|
136
|
+
try {
|
|
137
|
+
const response = await fetchCustomerAPMs(this.baseUrl, this.apiKeyTonder);
|
|
138
|
+
|
|
139
|
+
const apms_results =
|
|
140
|
+
response && "results" in response && response["results"].length > 0
|
|
141
|
+
? response["results"]
|
|
142
|
+
: [];
|
|
143
|
+
|
|
144
|
+
return apms_results
|
|
145
|
+
.filter((apmItem) => apmItem.category.toLowerCase() !== "cards")
|
|
146
|
+
.map((apmItem) => {
|
|
147
|
+
const apm = {
|
|
148
|
+
id: apmItem.pk,
|
|
149
|
+
payment_method: apmItem.payment_method,
|
|
150
|
+
priority: apmItem.priority,
|
|
151
|
+
category: apmItem.category,
|
|
152
|
+
...getPaymentMethodDetails(apmItem.payment_method),
|
|
153
|
+
};
|
|
154
|
+
return apm;
|
|
155
|
+
})
|
|
156
|
+
.sort((a, b) => a.priority - b.priority);
|
|
157
|
+
}catch (error){
|
|
158
|
+
throw formatPublicErrorResponse(
|
|
159
|
+
{
|
|
160
|
+
message: MESSAGES.getPaymentMethodsError,
|
|
161
|
+
},
|
|
162
|
+
error,
|
|
163
|
+
);
|
|
164
|
+
}
|
|
82
165
|
}
|
|
83
166
|
|
|
84
167
|
_setCartTotal(total) {
|
|
@@ -86,19 +169,28 @@ export class LiteInlineCheckout extends BaseInlineCheckout {
|
|
|
86
169
|
}
|
|
87
170
|
|
|
88
171
|
async _checkout({ card, payment_method }) {
|
|
172
|
+
console.log("_checkout", card, payment_method)
|
|
89
173
|
const customer = await this._getCustomer(
|
|
90
174
|
this.customer,
|
|
91
175
|
this.abortController.signal,
|
|
92
176
|
);
|
|
93
177
|
const { vault_id, vault_url } = this.merchantData;
|
|
94
178
|
let skyflowTokens;
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
179
|
+
if (!payment_method || payment_method !== "" || payment_method === null) {
|
|
180
|
+
if (typeof payment_method === "string") {
|
|
181
|
+
skyflowTokens = {
|
|
182
|
+
skyflow_id: card,
|
|
183
|
+
};
|
|
184
|
+
} else {
|
|
185
|
+
skyflowTokens = await getSkyflowTokens({
|
|
186
|
+
vault_id: vault_id,
|
|
187
|
+
vault_url: vault_url,
|
|
188
|
+
data: card,
|
|
189
|
+
baseUrl: this.baseUrl,
|
|
190
|
+
apiKey: this.apiKeyTonder,
|
|
191
|
+
});
|
|
192
|
+
}
|
|
193
|
+
}
|
|
102
194
|
|
|
103
195
|
return await this._handleCheckout({
|
|
104
196
|
card: skyflowTokens,
|
|
@@ -106,4 +198,15 @@ export class LiteInlineCheckout extends BaseInlineCheckout {
|
|
|
106
198
|
customer,
|
|
107
199
|
});
|
|
108
200
|
}
|
|
201
|
+
|
|
202
|
+
async #getCustomer() {
|
|
203
|
+
if(!!this.#customerData) return this.#customerData;
|
|
204
|
+
|
|
205
|
+
this.#customerData = await registerOrFetchCustomer(
|
|
206
|
+
this.baseUrl,
|
|
207
|
+
this.apiKeyTonder,
|
|
208
|
+
this.customer,
|
|
209
|
+
);
|
|
210
|
+
return this.#customerData
|
|
211
|
+
}
|
|
109
212
|
}
|
|
@@ -15,6 +15,7 @@ import {
|
|
|
15
15
|
saveCustomerCard,
|
|
16
16
|
fetchCustomerAPMs
|
|
17
17
|
} from "../data";
|
|
18
|
+
import {MESSAGES} from "../shared/constants/messages";
|
|
18
19
|
|
|
19
20
|
export class InlineCheckout extends BaseInlineCheckout{
|
|
20
21
|
static injected = false;
|
|
@@ -101,18 +102,23 @@ export class InlineCheckout extends BaseInlineCheckout{
|
|
|
101
102
|
this.cb = cb
|
|
102
103
|
}
|
|
103
104
|
|
|
104
|
-
|
|
105
|
-
|
|
105
|
+
/**
|
|
106
|
+
* Injects the checkout into the DOM and initializes it.
|
|
107
|
+
* Checks for an existing container and sets up an observer if needed.
|
|
108
|
+
* @returns {void}
|
|
109
|
+
* @public
|
|
110
|
+
*/
|
|
111
|
+
async injectCheckout() {
|
|
106
112
|
if (InlineCheckout.injected) return
|
|
107
113
|
const containerTonderCheckout = document.querySelector("#tonder-checkout");
|
|
108
114
|
if (containerTonderCheckout) {
|
|
109
|
-
this.#mount(containerTonderCheckout)
|
|
115
|
+
await this.#mount(containerTonderCheckout)
|
|
110
116
|
return;
|
|
111
117
|
}
|
|
112
|
-
const observer = new MutationObserver((mutations, obs) => {
|
|
118
|
+
const observer = new MutationObserver(async (mutations, obs) => {
|
|
113
119
|
const containerTonderCheckout = document.querySelector("#tonder-checkout");
|
|
114
120
|
if (containerTonderCheckout) {
|
|
115
|
-
this.#mount(containerTonderCheckout)
|
|
121
|
+
await this.#mount(containerTonderCheckout)
|
|
116
122
|
obs.disconnect();
|
|
117
123
|
}
|
|
118
124
|
});
|
|
@@ -123,10 +129,10 @@ export class InlineCheckout extends BaseInlineCheckout{
|
|
|
123
129
|
});
|
|
124
130
|
}
|
|
125
131
|
|
|
126
|
-
#mount(containerTonderCheckout) {
|
|
132
|
+
async #mount(containerTonderCheckout) {
|
|
127
133
|
containerTonderCheckout.innerHTML = cardTemplate({renderPaymentButton: this.renderPaymentButton, customStyles: this.customStyles});
|
|
128
134
|
globalLoader.show()
|
|
129
|
-
this.#mountTonder();
|
|
135
|
+
await this.#mountTonder();
|
|
130
136
|
InlineCheckout.injected = true;
|
|
131
137
|
}
|
|
132
138
|
|
|
@@ -189,6 +195,21 @@ export class InlineCheckout extends BaseInlineCheckout{
|
|
|
189
195
|
}
|
|
190
196
|
}
|
|
191
197
|
|
|
198
|
+
/**
|
|
199
|
+
* Removes the checkout from the DOM and cleans up associated resources.
|
|
200
|
+
*
|
|
201
|
+
* This method performs the following actions:
|
|
202
|
+
* 1. Resets the injection status flags for the checkout, cards, and APMs.
|
|
203
|
+
* 2. Aborts any ongoing requests using the AbortController.
|
|
204
|
+
* 3. Creates a new AbortController for future use.
|
|
205
|
+
* 4. Clears any existing injection intervals.
|
|
206
|
+
*
|
|
207
|
+
* Note: This method should be called when you want to completely remove
|
|
208
|
+
* the checkout from the page and reset its state.
|
|
209
|
+
*
|
|
210
|
+
* @returns {void}
|
|
211
|
+
* @public
|
|
212
|
+
*/
|
|
192
213
|
removeCheckout() {
|
|
193
214
|
InlineCheckout.injected = false
|
|
194
215
|
InlineCheckout.cardsInjected = false
|
|
@@ -241,7 +262,7 @@ export class InlineCheckout extends BaseInlineCheckout{
|
|
|
241
262
|
await saveCustomerCard(this.baseUrl, auth_token, business.pk, {
|
|
242
263
|
skyflow_id: cardTokens.skyflow_id,
|
|
243
264
|
});
|
|
244
|
-
showMessage(
|
|
265
|
+
showMessage(MESSAGES.cardSaved, this.collectorIds.msgNotification);
|
|
245
266
|
} catch (error) {
|
|
246
267
|
if (error?.message) {
|
|
247
268
|
showError(error.message)
|
|
@@ -370,8 +391,7 @@ export class InlineCheckout extends BaseInlineCheckout{
|
|
|
370
391
|
}
|
|
371
392
|
const businessId = this.merchantData.business.pk
|
|
372
393
|
await removeCustomerCard(this.baseUrl, customerToken, skyflow_id, businessId)
|
|
373
|
-
} catch {
|
|
374
|
-
} finally {
|
|
394
|
+
} catch(error) {} finally {
|
|
375
395
|
this.deletingCards = this.deletingCards.filter(id => id !== skyflow_id);
|
|
376
396
|
this.#refreshCardOnDelete(customerToken)
|
|
377
397
|
}
|
package/src/data/apmApi.js
CHANGED
|
@@ -9,7 +9,7 @@ import {
|
|
|
9
9
|
* @param {string} apiKey - The API key for authentication.
|
|
10
10
|
* @param params - The query params to filter APMs
|
|
11
11
|
* @param {AbortSignal} signal - The abort signal to cancel the request.
|
|
12
|
-
* @returns {Promise<
|
|
12
|
+
* @returns {Promise<import("../../types").IPaymentMethodResponse>} The available APMs.
|
|
13
13
|
*/
|
|
14
14
|
export async function fetchCustomerAPMs(
|
|
15
15
|
baseUrl,
|
package/src/data/cardApi.js
CHANGED
|
@@ -2,14 +2,20 @@ import {
|
|
|
2
2
|
buildErrorResponse,
|
|
3
3
|
buildErrorResponseFromCatch,
|
|
4
4
|
} from "../helpers/utils";
|
|
5
|
+
import {MESSAGES} from "../shared/constants/messages";
|
|
5
6
|
|
|
6
7
|
/**
|
|
7
|
-
* Saves
|
|
8
|
-
*
|
|
8
|
+
* Saves or updates a customer's card information.
|
|
9
|
+
*
|
|
10
|
+
* This function sends a POST request to save or update the card information for a customer.
|
|
11
|
+
*
|
|
12
|
+
* @param {string} baseUrl - The base URL of the API.
|
|
9
13
|
* @param {string} customerToken - The customer's authentication token.
|
|
10
|
-
* @param {string} businessId - The business ID.
|
|
11
|
-
* @param {
|
|
12
|
-
* @returns {Promise<
|
|
14
|
+
* @param {string | number} businessId - The business ID.
|
|
15
|
+
* @param {import("../../types").ISaveCardSkyflowRequest} data - The card information to be saved.
|
|
16
|
+
* @returns {Promise<import("../../types").ISaveCardResponse>} The saved card data.
|
|
17
|
+
*
|
|
18
|
+
* @throws {import("../../types").IApiError} Throws an error object if the save/update operation fails.
|
|
13
19
|
*/
|
|
14
20
|
export async function saveCustomerCard(
|
|
15
21
|
baseUrl,
|
|
@@ -31,7 +37,6 @@ export async function saveCustomerCard(
|
|
|
31
37
|
if (response.ok) return await response.json();
|
|
32
38
|
|
|
33
39
|
const res_json = await response.json();
|
|
34
|
-
|
|
35
40
|
if (response.status === 409) {
|
|
36
41
|
if ((res_json.error = "Card number already exists.")) {
|
|
37
42
|
return {
|
|
@@ -54,7 +59,9 @@ export async function saveCustomerCard(
|
|
|
54
59
|
* @param {string} customerToken - The customer's authentication token.
|
|
55
60
|
* @param {string} skyflowId - The Skyflow ID of the card to be removed.
|
|
56
61
|
* @param {string} businessId - The business ID.
|
|
57
|
-
* @returns {Promise<
|
|
62
|
+
* @returns {Promise<string>} The result of the card removal operation.
|
|
63
|
+
*
|
|
64
|
+
* @throws {import("../../types").IApiError} Throws an error object if the operation fails.
|
|
58
65
|
*/
|
|
59
66
|
export async function removeCustomerCard(
|
|
60
67
|
baseUrl,
|
|
@@ -73,7 +80,8 @@ export async function removeCustomerCard(
|
|
|
73
80
|
},
|
|
74
81
|
});
|
|
75
82
|
|
|
76
|
-
if
|
|
83
|
+
if(response.status === 204) return MESSAGES.cardSaved;
|
|
84
|
+
if (response.ok && "json" in response) return await response.json();
|
|
77
85
|
const res_json = await response.json();
|
|
78
86
|
|
|
79
87
|
throw await buildErrorResponse(response, res_json);
|
|
@@ -88,7 +96,9 @@ export async function removeCustomerCard(
|
|
|
88
96
|
* @param {string} customerToken - The customer's authentication token.
|
|
89
97
|
* @param {string} businessId - The business ID.
|
|
90
98
|
* @param {AbortSignal} signal - The abort signal to cancel the request.
|
|
91
|
-
* @returns {Promise<
|
|
99
|
+
* @returns {Promise<import("../../types").ICustomerCardsResponse>} The customer's saved cards.
|
|
100
|
+
*
|
|
101
|
+
* @throws {import("../../types").IApiError} Throws an error object if the operation fails.
|
|
92
102
|
*/
|
|
93
103
|
export async function fetchCustomerCards(
|
|
94
104
|
baseUrl,
|
|
@@ -106,11 +116,11 @@ export async function fetchCustomerCards(
|
|
|
106
116
|
},
|
|
107
117
|
signal,
|
|
108
118
|
});
|
|
109
|
-
|
|
110
119
|
if (response.ok) return await response.json();
|
|
111
120
|
const res_json = await response.json();
|
|
112
|
-
|
|
121
|
+
|
|
122
|
+
throw await buildErrorResponse(response, res_json, MESSAGES.getCardsError);
|
|
113
123
|
} catch (error) {
|
|
114
|
-
throw buildErrorResponseFromCatch(error);
|
|
124
|
+
throw buildErrorResponseFromCatch(error, MESSAGES.getCardsError);
|
|
115
125
|
}
|
|
116
126
|
}
|