Skip to content

Commit

Permalink
revert changes from #1527
Browse files Browse the repository at this point in the history
  • Loading branch information
joeluong-sfcc committed Dec 5, 2023
1 parent 3531438 commit 2164c3a
Show file tree
Hide file tree
Showing 5 changed files with 22 additions and 52 deletions.
1 change: 0 additions & 1 deletion packages/commerce-sdk-react/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
## v1.2.0-preview.0 (Nov 30, 2023)
- Add StorefrontPreview component 'onContextChange' property. [#1527](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1527)

## v1.1.0 (Nov 03, 2023)

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -99,14 +99,6 @@ describe('Storefront Preview Component', function () {
expect(window.STOREFRONT_PREVIEW.getToken).toBeDefined()
})

test('onContextChange is defined in window.STOREFRONT_PREVIEW when it is defined', () => {
window.STOREFRONT_PREVIEW = {}
;(detectStorefrontPreview as jest.Mock).mockReturnValue(true)

render(<StorefrontPreview enabled={true} getToken={() => 'my-token'} onContextChange={() => undefined} />)
expect(window.STOREFRONT_PREVIEW.onContextChange).toBeDefined()
})

test('experimental unsafe props are defined', () => {
expect(window.STOREFRONT_PREVIEW.experimentalUnsafeNavigate).toBeDefined()
})
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,11 @@
import React, {useEffect} from 'react'
import PropTypes from 'prop-types'
import {Helmet} from 'react-helmet'
import {CustomPropTypes, detectStorefrontPreview, getClientScript} from './utils'
import {detectStorefrontPreview, getClientScript} from './utils'
import {useHistory} from 'react-router-dom'
import type {LocationDescriptor} from 'history'

type GetToken = () => string | undefined | Promise<string | undefined>
type ContextChangeHandler = () => void | Promise<void>
type OptionalWhenDisabled<T> = ({enabled?: true} & T) | ({enabled: false} & Partial<T>)

/**
*
Expand All @@ -25,21 +23,19 @@ type OptionalWhenDisabled<T> = ({enabled?: true} & T) | ({enabled: false} & Part
export const StorefrontPreview = ({
children,
enabled = true,
getToken,
onContextChange
getToken
}: React.PropsWithChildren<
// Props are only required when Storefront Preview is enabled
OptionalWhenDisabled<{getToken: GetToken; onContextChange?: ContextChangeHandler}>
// getToken is required unless enabled is false
{enabled?: true; getToken: GetToken} | {enabled: false; getToken?: GetToken}
>) => {
const history = useHistory()
const isHostTrusted = detectStorefrontPreview()

useEffect(() => {
if (enabled && isHostTrusted) {
window.STOREFRONT_PREVIEW = {
...window.STOREFRONT_PREVIEW,
getToken,
onContextChange,
experimentalUnsafeNavigate: (
path: LocationDescriptor<unknown>,
action: 'push' | 'replace' = 'push',
Expand All @@ -49,7 +45,7 @@ export const StorefrontPreview = ({
}
}
}
}, [enabled, getToken, onContextChange])
}, [enabled, getToken])

return (
<>
Expand All @@ -71,11 +67,19 @@ export const StorefrontPreview = ({
StorefrontPreview.propTypes = {
children: PropTypes.node,
enabled: PropTypes.bool,
// A custom prop type function to only require this prop if enabled is true. Ultimately we would like
// to get to a place where both these props are simply optional and we will provide default implementations.
// This would make the API simpler to use.
getToken: CustomPropTypes.requiredFunctionWhenEnabled,
onContextChange: PropTypes.func
// a custom prop type function to only require this prop if enabled is true.
getToken: function (props: any, propName: any, componentName: any) {
if (
props['enabled'] === true &&
(props[propName] === undefined || typeof props[propName] !== 'function')
) {
return new Error(
`${String(propName)} is a required function for ${String(
componentName
)} when enabled is true`
)
}
}
}

export default StorefrontPreview
Original file line number Diff line number Diff line change
Expand Up @@ -24,28 +24,3 @@ export const getClientScript = () => {
? `${parentOrigin}/mobify/bundle/development/static/storefront-preview.js`
: `${parentOrigin}/cc/b2c/preview/preview.client.js`
}

// Custom Prop Types.
export const CustomPropTypes = {
/**
* This custom PropType ensures that the prop is only required when the known prop
* "enabled" is set to "true".
*
* @param props
* @param propName
* @param componentName
* @returns
*/
requiredFunctionWhenEnabled: (props: any, propName: any, componentName: any) => {
if (
props['enabled'] === true &&
(props[propName] === undefined || typeof props[propName] !== 'function')
) {
return new Error(
`${String(propName)} is a required function for ${String(
componentName
)} when enabled is true`
)
}
}
}
6 changes: 3 additions & 3 deletions packages/commerce-sdk-react/src/constant.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
* This list contains domains that can host code in iframe
*/
export const IFRAME_HOST_ALLOW_LIST = Object.freeze([
'https://runtime.commercecloud.com',
'https://runtime-admin-staging.mobify-storefront.com',
'https://runtime-admin-preview.mobify-storefront.com'
'runtime.commercecloud.com',
'runtime-admin-staging.mobify-storefront.com',
'runtime-admin-preview.mobify-storefront.com'
])

0 comments on commit 2164c3a

Please sign in to comment.