diff --git a/example/App.tsx b/example/App.tsx index 39284f3..c1bb450 100644 --- a/example/App.tsx +++ b/example/App.tsx @@ -29,7 +29,9 @@ function App(): React.JSX.Element { - + diff --git a/example/services/constants.ts b/example/services/constants.ts new file mode 100644 index 0000000..ccc17cd --- /dev/null +++ b/example/services/constants.ts @@ -0,0 +1,3 @@ +export const PUBLISHABLE_KEY_URL = 'https://rn-komoju-app.glitch.me/serve-keys'; +export const CREATE_SESSION_URL = + 'https://rn-komoju-app.glitch.me/create-session'; diff --git a/example/services/keyService.ts b/example/services/keyService.ts index 969e216..ea654d1 100644 --- a/example/services/keyService.ts +++ b/example/services/keyService.ts @@ -1,9 +1,9 @@ import {Alert} from 'react-native'; +import {PUBLISHABLE_KEY_URL} from './constants'; const getPublishableKey = async () => { try { - const url = 'https://rn-komoju-app.glitch.me/serve-keys'; - const response = await fetch(url); + const response = await fetch(PUBLISHABLE_KEY_URL); const {publishableKey} = await response.json(); return publishableKey; diff --git a/example/services/sessionService.ts b/example/services/sessionService.ts index 06e7eba..a69148f 100644 --- a/example/services/sessionService.ts +++ b/example/services/sessionService.ts @@ -1,4 +1,5 @@ import {Alert} from 'react-native'; +import {CREATE_SESSION_URL} from './constants'; // Refer documentation on https://doc.komoju.com/reference/post_sessions // for creating a session @@ -13,7 +14,6 @@ const createSession = async ({ currency, }: createSessionProps): Promise => { try { - const url = 'https://rn-komoju-app.glitch.me/create-session'; const options = { method: 'POST', headers: { @@ -25,7 +25,7 @@ const createSession = async ({ currency, }), }; - const response = await fetch(url, options); + const response = await fetch(CREATE_SESSION_URL, options); const {sessionId} = await response.json(); return sessionId; diff --git a/payment_sdk/readme.md b/payment_sdk/readme.md index cdfdcf3..57a0963 100644 --- a/payment_sdk/readme.md +++ b/payment_sdk/readme.md @@ -33,7 +33,7 @@ import { KomojuSDK } from "@komoju/komoju-react-native"; function App() { return ( - + ); @@ -78,7 +78,7 @@ When a customer exits your app, for example to authenticate in Safari or their b To initialize Komoju in your React Native app, use the `KomojuSDK.KomojuProvider` component in the root component of your application. -`KomojuProvider` can accept `publicKey`, `paymentMethods` and `language` as props. Only `publicKey` is required. +`KomojuProvider` can accept `publishableKey`, `paymentMethods` and `language` as props. Only `publishableKey` is required. ```tsx import { @@ -88,20 +88,20 @@ import { } from "@komoju/komoju-react-native"; function App() { - const [publicKey, setPublicKey] = useState(""); + const [publishableKey, setpublishableKey] = useState(""); - const fetchPublicKey = async () => { + const fetchpublishableKey = async () => { const key = await fetchKey(); // fetch key from your server here - setPublicKey(key); + setpublishableKey(key); }; useEffect(() => { - fetchPublicKey(); + fetchpublishableKey(); }, []); return ( @@ -115,6 +115,6 @@ function App() { | property | type | description | | ------------------ | ------------------------ | ------------------------------------------------------------------------------------------------------------- | -| **publicKey** | `string` | Your publishable key from the KOMOJU [merchant settings page](https://komoju.com/sign_in/) (this is mandtory) | +| **publishableKey** | `string` | Your publishable key from the KOMOJU [merchant settings page](https://komoju.com/sign_in/) (this is mandtory) | | **paymentMethods** | `Array ` | explicitly set the payment method(s) for purchase. (optional) | | **language** | `string (LanguageTypes)` | explicitly set the language, if not set language will be picked from your session Id (optional) | diff --git a/payment_sdk/src/__tests__/CardSection.test.tsx b/payment_sdk/src/__tests__/CardSection.test.tsx index 4927e07..7bbe1a7 100644 --- a/payment_sdk/src/__tests__/CardSection.test.tsx +++ b/payment_sdk/src/__tests__/CardSection.test.tsx @@ -12,7 +12,7 @@ export const mockState = { cardholderName: "John Doe", cardCVV: "123", cardNumber: "4100000000000100", - cardExpiredDate: "08/25", + cardExpiredDate: "08 / 25", amount: 1000, currency: "USD", }; diff --git a/payment_sdk/src/__tests__/paymentService.test.ts b/payment_sdk/src/__tests__/paymentService.test.ts index 31496c2..f6f4ade 100644 --- a/payment_sdk/src/__tests__/paymentService.test.ts +++ b/payment_sdk/src/__tests__/paymentService.test.ts @@ -5,7 +5,7 @@ import { PaymentType } from "../util/types"; global.fetch = jest.fn(); const paymentDetails = { - publicKey: "samplepublickKey", + publishableKey: "samplepublishablekKey", sessionId: "sessionID123", paymentType: PaymentType.CREDIT, paymentDetails: { diff --git a/payment_sdk/src/context/KomojuProvider.tsx b/payment_sdk/src/context/KomojuProvider.tsx index af24f1b..a78e0d7 100644 --- a/payment_sdk/src/context/KomojuProvider.tsx +++ b/payment_sdk/src/context/KomojuProvider.tsx @@ -12,7 +12,7 @@ export const KomojuProvider = (props: KomojuProviderIprops) => { { const onUserCancel = async () => { if (onDismissCallback.current) { const sessionShowPayload = { - publicKey: props?.publicKey, + publishableKey: props?.publishableKey, sessionId: sessionIdRef.current, }; @@ -135,7 +135,7 @@ export const MainStateProvider = (props: KomojuProviderIprops) => { // Fetching session data from given session ID const sessionData = await sessionShow({ sessionId, - publicKey: props.publicKey, + publishableKey: props.publishableKey, }); // validating the session data and closing the payment gateway if data is not valid @@ -180,7 +180,7 @@ export const MainStateProvider = (props: KomojuProviderIprops) => { // if this is a session flow, check until session response changes from 'pending' to 'completed' or 'error' const sessionShowPayload = { - publicKey: props.publicKey, + publishableKey: props.publishableKey, sessionId: sessionIdRef.current, }; @@ -221,7 +221,7 @@ export const MainStateProvider = (props: KomojuProviderIprops) => { const response = await payForSession({ paymentType, sessionId, - publicKey: props.publicKey, + publishableKey: props.publishableKey, paymentDetails, }); diff --git a/payment_sdk/src/services/payForSessionService.ts b/payment_sdk/src/services/payForSessionService.ts index 96aa0a7..6bacf6a 100644 --- a/payment_sdk/src/services/payForSessionService.ts +++ b/payment_sdk/src/services/payForSessionService.ts @@ -9,7 +9,7 @@ import { /** * Processes a payment for a given session. * @param {object} params - The parameters for processing the payment. - * @param {string} params.publicKey - The public key for authorization. + * @param {string} params.publishableKey - The publishable key for authorization. * @param {string} params.sessionId - The session ID for the payment. * @param {PaymentType} params.paymentType - The type of payment to process. * @param {object} params.paymentDetails - The details of the relevant payment type. @@ -23,7 +23,7 @@ import { */ const payForSession = async ({ - publicKey, + publishableKey, sessionId, paymentType, paymentDetails, @@ -115,7 +115,7 @@ const payForSession = async ({ // payment POST request options of headers and body should be as bellow const options = { method: "POST", - headers: API_HEADER(publicKey), + headers: API_HEADER(publishableKey), body: JSON.stringify({ capture: "auto", payment_details, diff --git a/payment_sdk/src/services/sessionShow.ts b/payment_sdk/src/services/sessionShow.ts index a311aec..63ebb07 100644 --- a/payment_sdk/src/services/sessionShow.ts +++ b/payment_sdk/src/services/sessionShow.ts @@ -4,18 +4,18 @@ import { SessionShowResponseType } from "@util/types"; type SessionShowProps = { sessionId: string; - publicKey: string; + publishableKey: string; }; const sessionShow = async ({ sessionId, - publicKey, + publishableKey, }: SessionShowProps): Promise => { try { const url = `${BASE_URL_API}/sessions/${sessionId}`; const options = { method: "GET", - headers: API_HEADER(publicKey), + headers: API_HEADER(publishableKey), }; const response = await fetch(url, options); diff --git a/payment_sdk/src/util/constants.ts b/payment_sdk/src/util/constants.ts index 889397a..bf3eef7 100644 --- a/payment_sdk/src/util/constants.ts +++ b/payment_sdk/src/util/constants.ts @@ -1,13 +1,13 @@ import { PaymentType } from "./types"; -export const noop = () => { }; +export const noop = () => {}; export const BASE_URL = "https://komoju.com"; export const BASE_URL_API = `${BASE_URL}/api/v1`; -export const API_HEADER = (publicKey: string) => ({ +export const API_HEADER = (publishableKey: string) => ({ accept: "application/json", "content-type": "application/json", "KOMOJU-VIA": "mobile_react", - Authorization: `Basic ${btoa(publicKey + ":")}`, + Authorization: `Basic ${btoa(publishableKey + ":")}`, }); export const paymentSuccessCtaText = "BACK_TO_STORE"; @@ -34,7 +34,7 @@ export enum SimpleRedirectTypeModes { linepay = "LINE_PAY", merpay = "MER_PAY", rakuten = "RAKUTEN", - aupay = "AU_PAY" + aupay = "AU_PAY", } export const LangKeys: { [key in PaymentType]: string } = { @@ -52,5 +52,4 @@ export const LangKeys: { [key in PaymentType]: string } = { [PaymentType.RAKUTEN]: "RAKUTEN", [PaymentType.WEB_MONEY]: "WEB_MONEY", [PaymentType.NET_CASH]: "NET_CASH", - }; diff --git a/payment_sdk/src/util/types.ts b/payment_sdk/src/util/types.ts index 001678f..9ae1955 100644 --- a/payment_sdk/src/util/types.ts +++ b/payment_sdk/src/util/types.ts @@ -1,7 +1,7 @@ import { Dispatch, ReactNode, SetStateAction } from "react"; export type InitPrams = { - publicKey: string; + publishableKey: string; paymentMethods?: Array; language?: LanguageTypes; useBottomSheet?: boolean; @@ -103,7 +103,7 @@ export enum CurrencyTypes { } export type payForSessionProps = { - publicKey: string; + publishableKey: string; sessionId: string; paymentType: PaymentType; paymentDetails?: CardDetailsType & diff --git a/readme.md b/readme.md index cdfdcf3..66a5cfc 100644 --- a/readme.md +++ b/readme.md @@ -33,7 +33,7 @@ import { KomojuSDK } from "@komoju/komoju-react-native"; function App() { return ( - + ); @@ -78,7 +78,7 @@ When a customer exits your app, for example to authenticate in Safari or their b To initialize Komoju in your React Native app, use the `KomojuSDK.KomojuProvider` component in the root component of your application. -`KomojuProvider` can accept `publicKey`, `paymentMethods` and `language` as props. Only `publicKey` is required. +`KomojuProvider` can accept `publishableKey`, `paymentMethods` and `language` as props. Only `publishableKey` is required. ```tsx import { @@ -88,20 +88,20 @@ import { } from "@komoju/komoju-react-native"; function App() { - const [publicKey, setPublicKey] = useState(""); + const [publishableKey, setpublishableKey] = useState(""); - const fetchPublicKey = async () => { + const fetchpublishableKey = async () => { const key = await fetchKey(); // fetch key from your server here - setPublicKey(key); + setpublishableKey(key); }; useEffect(() => { - fetchPublicKey(); + fetchpublishableKey(); }, []); return ( @@ -115,6 +115,6 @@ function App() { | property | type | description | | ------------------ | ------------------------ | ------------------------------------------------------------------------------------------------------------- | -| **publicKey** | `string` | Your publishable key from the KOMOJU [merchant settings page](https://komoju.com/sign_in/) (this is mandtory) | +| **publishableKey** | `string` | Your publishable key from the KOMOJU [merchant settings page](https://komoju.com/sign_in/) (this is mandtory) | | **paymentMethods** | `Array ` | explicitly set the payment method(s) for purchase. (optional) | | **language** | `string (LanguageTypes)` | explicitly set the language, if not set language will be picked from your session Id (optional) |