Skip to content

Commit

Permalink
Merge branch 'main' into env-docs-changes
Browse files Browse the repository at this point in the history
  • Loading branch information
Pritish Budhiraja authored Mar 26, 2024
2 parents e188de8 + f40d928 commit ac74297
Show file tree
Hide file tree
Showing 25 changed files with 2,055 additions and 1,734 deletions.
42 changes: 42 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,45 @@
## [0.34.2](https://github.com/juspay/hyperswitch-web/compare/v0.34.1...v0.34.2) (2024-03-22)


### Bug Fixes

* **3ds method iframe:** 3ds failing with no cors and color depth … ([#253](https://github.com/juspay/hyperswitch-web/issues/253)) ([88d955b](https://github.com/juspay/hyperswitch-web/commit/88d955b20be17cccc33803e3dbe3ca122d9868ef))

## [0.34.1](https://github.com/juspay/hyperswitch-web/compare/v0.34.0...v0.34.1) (2024-03-22)


### Bug Fixes

* applePay Dynamic Fields Error Handling and Dynamic Fields PostalCode Error ([#250](https://github.com/juspay/hyperswitch-web/issues/250)) ([d85aa2a](https://github.com/juspay/hyperswitch-web/commit/d85aa2a0ffaa2205a7c19d41455f2250c5c70ef3))

# [0.34.0](https://github.com/juspay/hyperswitch-web/compare/v0.33.12...v0.34.0) (2024-03-22)


### Features

* 3DS without redirection ([#249](https://github.com/juspay/hyperswitch-web/issues/249)) ([70911e5](https://github.com/juspay/hyperswitch-web/commit/70911e5c5ce23ff6e8936cd8028e6bf037b96686))

## [0.33.12](https://github.com/juspay/hyperswitch-web/compare/v0.33.11...v0.33.12) (2024-03-21)


### Bug Fixes

* **savedcarditem:** fixed Dynamic Fields not rendering for some saved… ([#246](https://github.com/juspay/hyperswitch-web/issues/246)) ([25d8f67](https://github.com/juspay/hyperswitch-web/commit/25d8f67b3f5a86aa9416b86044eb15c466ac55e5))

## [0.33.11](https://github.com/juspay/hyperswitch-web/compare/v0.33.10...v0.33.11) (2024-03-21)


### Bug Fixes

* hotfix changes for postal code ([#245](https://github.com/juspay/hyperswitch-web/issues/245)) ([4ba7350](https://github.com/juspay/hyperswitch-web/commit/4ba7350d4bbfbfcb570bd8c56a51a14df06f4dae))

## [0.33.10](https://github.com/juspay/hyperswitch-web/compare/v0.33.9...v0.33.10) (2024-03-20)


### Bug Fixes

* saved Payment Method stuck in loading state and Card Holder Name for every saved card ([#241](https://github.com/juspay/hyperswitch-web/issues/241)) ([6b1bc56](https://github.com/juspay/hyperswitch-web/commit/6b1bc565f659d163297453c6b6f5cc602bee6ff5))

## [0.33.9](https://github.com/juspay/hyperswitch-web/compare/v0.33.8...v0.33.9) (2024-03-19)

## [0.33.8](https://github.com/juspay/hyperswitch-web/compare/v0.33.7...v0.33.8) (2024-03-18)
Expand Down
3,202 changes: 1,562 additions & 1,640 deletions package-lock.json

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "orca-payment-page",
"version": "0.33.9",
"version": "0.34.2",
"main": "index.js",
"private": true,
"dependencies": {
Expand Down
2 changes: 2 additions & 0 deletions src/App.res
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,8 @@ let make = () => {
<FullScreenDivDriver />
</div>
| "qrData" => <QRCodeDisplay />
| "3dsAuth" => <ThreeDSAuth />
| "3ds" => <ThreeDSMethod />
| "voucherData" => <VoucherDisplay />
| "preMountLoader" => {
let clientSecret = CardUtils.getQueryParamsDictforKey(url.search, "clientSecret")
Expand Down
46 changes: 25 additions & 21 deletions src/BrowserSpec.res
Original file line number Diff line number Diff line change
Expand Up @@ -19,24 +19,28 @@ let checkIsSafari = () => {
}

let date = date()
let broswerInfo = () => [
(
"browser_info",
[
("user_agent", navigator.userAgent->JSON.Encode.string),
(
"accept_header",
"text\/html,application\/xhtml+xml,application\/xml;q=0.9,image\/webp,image\/apng,*\/*;q=0.8"->JSON.Encode.string,
),
("language", navigator.language->JSON.Encode.string),
("color_depth", screen.colorDepth->Belt.Int.toFloat->JSON.Encode.float),
("screen_height", screen.height->Belt.Int.toFloat->JSON.Encode.float),
("screen_width", screen.width->Belt.Int.toFloat->JSON.Encode.float),
("time_zone", date.getTimezoneOffset()->JSON.Encode.float),
("java_enabled", true->JSON.Encode.bool),
("java_script_enabled", true->JSON.Encode.bool),
]
->Dict.fromArray
->JSON.Encode.object,
),
]
let broswerInfo = () => {
let colorDepth =
[1, 4, 8, 15, 16, 24, 32, 48]->Array.includes(screen.colorDepth) ? screen.colorDepth : 24
[
(
"browser_info",
[
("user_agent", navigator.userAgent->JSON.Encode.string),
(
"accept_header",
"text\/html,application\/xhtml+xml,application\/xml;q=0.9,image\/webp,image\/apng,*\/*;q=0.8"->JSON.Encode.string,
),
("language", navigator.language->JSON.Encode.string),
("color_depth", colorDepth->Belt.Int.toFloat->JSON.Encode.float),
("screen_height", screen.height->Belt.Int.toFloat->JSON.Encode.float),
("screen_width", screen.width->Belt.Int.toFloat->JSON.Encode.float),
("time_zone", date.getTimezoneOffset()->JSON.Encode.float),
("java_enabled", true->JSON.Encode.bool),
("java_script_enabled", true->JSON.Encode.bool),
]
->Dict.fromArray
->JSON.Encode.object,
),
]
}
3 changes: 2 additions & 1 deletion src/CardUtils.res
Original file line number Diff line number Diff line change
Expand Up @@ -310,7 +310,8 @@ let calculateLuhn = value => {
let sumofCheckArr = Array.reduce(checkArr, 0, (acc, val) => acc + val->toInt)
let sumofUnCheckedArr = Array.reduce(unCheckArr, 0, (acc, val) => acc + val->toInt)
let totalSum = sumofCheckArr + sumofUnCheckedArr
mod(totalSum, 10) == 0

mod(totalSum, 10) == 0 || ["3000100811111072", "4000100511112003"]->Array.includes(card) // test cards
}

let getCardBrandIcon = (cardType, paymentType) => {
Expand Down
1 change: 0 additions & 1 deletion src/Components/AddressPaymentInput.res
Original file line number Diff line number Diff line change
Expand Up @@ -309,7 +309,6 @@ let make = (~paymentType, ~className="") => {
onChange=onPostalChange
paymentType
className
type_="tel"
name="postal"
inputRef=postalRef
placeholder=localeString.postalCodeLabel
Expand Down
8 changes: 3 additions & 5 deletions src/Components/DynamicFields.res
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ let make = (
~paymentMethodType,
~setRequiredFieldsBody,
~isSavedCardFlow=false,
~savedCards=[]: array<PaymentType.customerMethods>,
~savedMethod=PaymentType.defaultCustomerMethods,
~cardProps=None,
~expiryProps=None,
~cvcProps=None,
Expand Down Expand Up @@ -46,8 +46,8 @@ let make = (
}, [requiredFieldsWithBillingDetails])

let isAllStoredCardsHaveName = React.useMemo1(() => {
PaymentType.getIsAllStoredCardsHaveName(savedCards)
}, [savedCards])
PaymentType.getIsStoredPaymentMethodHasName(savedMethod)
}, [savedMethod])

//<...>//
let fieldsArr = React.useMemo3(() => {
Expand Down Expand Up @@ -509,7 +509,6 @@ let make = (
}}
onChange=onPostalChange
paymentType
type_="tel"
name="postal"
inputRef=postalRef
placeholder=localeString.postalCodeLabel
Expand Down Expand Up @@ -622,7 +621,6 @@ let make = (
}}
onChange=onPostalChange
paymentType
type_="tel"
name="postal"
inputRef=postalRef
placeholder=localeString.postalCodeLabel
Expand Down
2 changes: 1 addition & 1 deletion src/Components/NicknamePaymentInput.res
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ let make = (~paymentType: CardThemeType.mode, ~value, ~setValue) => {
onChange
paymentType
appearance=config.appearance
inputRef={React.useRef(Js.Nullable.null)}
inputRef={React.useRef(Nullable.null)}
placeholder=localeString.nicknamePlaceholder
/>
}
7 changes: 3 additions & 4 deletions src/Components/SavedCardItem.res
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ let make = (
~cvcProps,
~paymentType,
~list,
~savedMethods,
~setRequiredFieldsBody,
) => {
let {themeObj, config} = Recoil.useRecoilValueFromAtom(RecoilAtoms.configAtom)
Expand Down Expand Up @@ -51,7 +50,7 @@ let make = (
let isRenderCvv = isCard && paymentItem.requiresCvv

let paymentMethodType = switch paymentItem.paymentMethodType {
| Some(paymentMethodType) => paymentMethodType->Utils.snakeToTitleCase
| Some(paymentMethodType) => paymentMethodType
| None => "debit"
}

Expand Down Expand Up @@ -101,7 +100,7 @@ let make = (
<div> {React.string(paymentItem.card.last4Digits)} </div>
</div>
</div>
: <div> {React.string(paymentMethodType)} </div>}
: <div> {React.string(paymentMethodType->Utils.snakeToTitleCase)} </div>}
<RenderIf condition={paymentItem.defaultPaymentMethodSet}>
<Icon
size=18
Expand Down Expand Up @@ -162,7 +161,7 @@ let make = (
paymentMethodType
setRequiredFieldsBody
isSavedCardFlow=true
savedCards=savedMethods
savedMethod=paymentItem
/>
<Surcharge
list
Expand Down
1 change: 0 additions & 1 deletion src/Components/SavedMethods.res
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,6 @@ let make = (
cvcProps
paymentType
list
savedMethods
setRequiredFieldsBody
/>
})
Expand Down
5 changes: 0 additions & 5 deletions src/PaymentElement.res
Original file line number Diff line number Diff line change
Expand Up @@ -388,11 +388,6 @@ let make = (
</ErrorBoundary>
}

React.useEffect(() => {
setShowFields(_ => !displaySavedPaymentMethods)
None
}, [displaySavedPaymentMethods])

let paymentLabel = if displaySavedPaymentMethods {
showFields
? optionAtomValue.paymentMethodsHeaderText
Expand Down
4 changes: 2 additions & 2 deletions src/Payments/ApplePay.res
Original file line number Diff line number Diff line change
Expand Up @@ -333,7 +333,7 @@ let make = (
None
}, (isApplePayReady, isInvokeSDKFlow, paymentExperience, isWallet))

let submitCallback = (ev: Window.event) => {
let submitCallback = React.useCallback((ev: Window.event) => {
if !isWallet {
let json = ev.data->JSON.parseExn
let confirm = json->getDictFromJson->ConfirmType.itemToObjMapper
Expand All @@ -353,7 +353,7 @@ let make = (
)
}
}
}
}, (areRequiredFieldsValid, areRequiredFieldsEmpty))
useSubmitPaymentData(submitCallback)

{
Expand Down
91 changes: 91 additions & 0 deletions src/ThreeDSAuth.res
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
open Utils

@react.component
let make = () => {
let (openModal, setOpenModal) = React.useState(_ => false)
let (loader, setloader) = React.useState(_ => true)

let logger = Recoil.useRecoilValueFromAtom(RecoilAtoms.loggerAtom)

React.useEffect0(() => {
handlePostMessage([("iframeMountedCallback", true->JSON.Encode.bool)])
let handle = (ev: Window.event) => {
let json = ev.data->JSON.parseExn
let dict = json->Utils.getDictFromJson
if dict->Dict.get("fullScreenIframeMounted")->Option.isSome {
let metadata = dict->getJsonObjectFromDict("metadata")
let metaDataDict = metadata->JSON.Decode.object->Option.getOr(Dict.make())
let paymentIntentId = metaDataDict->getString("paymentIntentId", "")
let headersDict =
metaDataDict
->getJsonObjectFromDict("headers")
->JSON.Decode.object
->Option.getOr(Dict.make())
let threeDsAuthoriseUrl =
metaDataDict
->getJsonObjectFromDict("threeDSData")
->JSON.Decode.object
->Option.getOr(Dict.make())
->getString("three_ds_authorize_url", "")
let headers =
headersDict
->Dict.toArray
->Array.map(entries => {
let (x, val) = entries
(x, val->JSON.Decode.string->Option.getOr(""))
})

let threeDsMethodComp = metaDataDict->getString("3dsMethodComp", "U")
open Promise
PaymentHelpers.threeDsAuth(
~optLogger=Some(logger),
~clientSecret=paymentIntentId,
~threeDsMethodComp,
~headers,
)
->then(json => {
let dict = json->JSON.Decode.object->Option.getOr(Dict.make())
let creq = dict->getString("challenge_request", "")
let transStatus = dict->getString("trans_status", "Y")
let acsUrl = dict->getString("acs_url", "")

let ele = Window.querySelector("#threeDsAuthDiv")

switch ele->Nullable.toOption {
| Some(elem) =>
if transStatus === "C" {
setloader(_ => false)
let form = elem->OrcaUtils.makeForm(acsUrl, "3dsChallenge")
let input = Types.createElement("input")
input.name = "creq"
input.value = creq
form.target = "threeDsAuthFrame"
form.appendChild(input)
form.submit()
} else {
let form1 = elem->OrcaUtils.makeForm(threeDsAuthoriseUrl, "3dsFrintionLess")
form1.submit()
}
| None => ()
}
resolve(json)
})
->ignore
}
}
Window.addEventListener("message", handle)
Some(() => {Window.removeEventListener("message", handle)})
})

<Modal loader={loader} showClose=false openModal setOpenModal>
<div className="backdrop-blur-xl">
<div id="threeDsAuthDiv" className="hidden" />
<iframe
id="threeDsAuthFrame"
name="threeDsAuthFrame"
style={ReactDOMStyle.make(~minHeight="500px", ())}
width="100%"
/>
</div>
</Modal>
}
Loading

0 comments on commit ac74297

Please sign in to comment.