Skip to content

Commit 8043eb5

Browse files
jeremy-jung1jeremy-jung1
committed
Merge remote-tracking branch 'origin/W-20224267-passkey-login-in-checkout' into W-20224220-passkey-in-auth-modal
2 parents e8f952d + c394c40 commit 8043eb5

File tree

5 files changed

+22
-21
lines changed

5 files changed

+22
-21
lines changed

‎packages/template-retail-react-app/app/hooks/use-auth-modal.js‎

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@
44
* SPDX-License-Identifier: BSD-3-Clause
55
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
66
*/
7-
/* global PublicKeyCredential */
8-
import React, {useEffect, useState, useRef} from 'react'
7+
import React, {useEffect, useState} from 'react'
98
import PropTypes from 'prop-types'
109
import {defineMessage, useIntl} from 'react-intl'
1110
import {useForm} from 'react-hook-form'
@@ -276,12 +275,12 @@ export const AuthModal = ({
276275
// Show passkey registration modal only if Webauthn feature flag is enabled and compatible with the browser
277276
if (
278277
window.PublicKeyCredential &&
279-
PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable &&
280-
PublicKeyCredential.isConditionalMediationAvailable
278+
window.PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable &&
279+
window.PublicKeyCredential.isConditionalMediationAvailable
281280
) {
282281
Promise.all([
283-
PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable(),
284-
PublicKeyCredential.isConditionalMediationAvailable()
282+
window.PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable(),
283+
window.PublicKeyCredential.isConditionalMediationAvailable()
285284
]).then((results) => {
286285
if (results.every((r) => r === true)) {
287286
showToast()

‎packages/template-retail-react-app/app/hooks/use-passkey-login.js‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@
44
* SPDX-License-Identifier: BSD-3-Clause
55
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
66
*/
7-
/* global PublicKeyCredential */
87
import {getConfig} from '@salesforce/pwa-kit-runtime/utils/ssr-config'
98
import {useAuthHelper, AuthHelpers, useUsid} from '@salesforce/commerce-sdk-react'
109
import {encode as base64Encode} from 'base64-arraybuffer'
@@ -32,13 +31,16 @@ export const usePasskeyLogin = () => {
3231
}
3332

3433
// Availability of window.PublicKeyCredential means WebAuthn is supported in this browser
35-
if (!window.PublicKeyCredential || !PublicKeyCredential.isConditionalMediationAvailable) {
34+
if (
35+
!window.PublicKeyCredential ||
36+
!window.PublicKeyCredential.isConditionalMediationAvailable
37+
) {
3638
return
3739
}
3840

3941
// Check if conditional mediation is available. Conditional mediation is a feature of the WebAuthn API that allows passkeys to appear in the browser's standard autofill suggestions, alongside saved passwords. This allows users to sign in with a passkey using the standard username input field, rather than clicking a dedicated passkey login button.
4042
// https://developer.mozilla.org/en-US/docs/Web/API/CredentialsContainer/isConditionalMediationAvailable
41-
const isCMA = await PublicKeyCredential.isConditionalMediationAvailable()
43+
const isCMA = await window.PublicKeyCredential.isConditionalMediationAvailable()
4244
if (!isCMA) {
4345
return
4446
}
@@ -49,7 +51,7 @@ export const usePasskeyLogin = () => {
4951

5052
// Transform response for WebAuthn API to send to navigator.credentials.get()
5153
// https://developer.mozilla.org/en-US/docs/Web/API/PublicKeyCredential/parseRequestOptionsFromJSON_static
52-
const options = PublicKeyCredential.parseRequestOptionsFromJSON(
54+
const options = window.PublicKeyCredential.parseRequestOptionsFromJSON(
5355
startWebauthnAuthenticationResponse.publicKey
5456
)
5557

‎packages/template-retail-react-app/app/pages/checkout/partials/contact-info.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -167,14 +167,14 @@ const ContactInfo = ({isSocialEnabled = false, isPasswordlessEnabled = false, id
167167
const handlePasskeyLogin = async () => {
168168
try {
169169
await loginWithPasskey()
170+
handleMergeBasket()
170171
} catch (error) {
171172
setError(formatMessage(API_ERROR_MESSAGE))
172173
}
173174
}
174175

175176
if (!customer.isRegistered) {
176177
handlePasskeyLogin()
177-
handleMergeBasket()
178178
}
179179
}, [customer.isRegistered])
180180

‎packages/template-retail-react-app/app/pages/login/index.jsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
* SPDX-License-Identifier: BSD-3-Clause
55
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
66
*/
7-
/* global PublicKeyCredential */
7+
88
import React, {useEffect, useState} from 'react'
99
import PropTypes from 'prop-types'
1010
import {useIntl, defineMessage, FormattedMessage} from 'react-intl'
@@ -189,12 +189,12 @@ const Login = ({initialView = LOGIN_VIEW}) => {
189189
// Show passkey registration modal only if Webauthn feature flag is enabled and compatible with the browser
190190
if (
191191
window.PublicKeyCredential &&
192-
PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable &&
193-
PublicKeyCredential.isConditionalMediationAvailable
192+
window.PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable &&
193+
window.PublicKeyCredential.isConditionalMediationAvailable
194194
) {
195195
Promise.all([
196-
PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable(),
197-
PublicKeyCredential.isConditionalMediationAvailable()
196+
window.PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable(),
197+
window.PublicKeyCredential.isConditionalMediationAvailable()
198198
]).then((results) => {
199199
if (results.every((r) => r === true)) {
200200
showToast()

‎packages/template-retail-react-app/app/pages/registration/index.jsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
* SPDX-License-Identifier: BSD-3-Clause
55
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
66
*/
7-
/* global PublicKeyCredential */
7+
88
import React, {useEffect} from 'react'
99
import PropTypes from 'prop-types'
1010
import {useIntl, FormattedMessage} from 'react-intl'
@@ -63,12 +63,12 @@ const Registration = () => {
6363
if (isRegistered && config?.app?.login?.passkey?.enabled) {
6464
if (
6565
window.PublicKeyCredential &&
66-
PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable &&
67-
PublicKeyCredential.isConditionalMediationAvailable
66+
window.PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable &&
67+
window.PublicKeyCredential.isConditionalMediationAvailable
6868
) {
6969
Promise.all([
70-
PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable(),
71-
PublicKeyCredential.isConditionalMediationAvailable()
70+
window.PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable(),
71+
window.PublicKeyCredential.isConditionalMediationAvailable()
7272
]).then((results) => {
7373
if (results.every((r) => r === true)) {
7474
showToast()

0 commit comments

Comments
 (0)