Skip to content

Commit

Permalink
[NO CHANGELOG][Checkout Widget] Fix initial iframe url (#2070)
Browse files Browse the repository at this point in the history
  • Loading branch information
jhesgodi authored Aug 6, 2024
1 parent b2d6729 commit bc564a1
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 48 deletions.
2 changes: 1 addition & 1 deletion packages/checkout/widgets-lib/src/lib/constants.ts
Original file line number Diff line number Diff line change
Expand Up @@ -121,6 +121,6 @@ export const WITHDRAWAL_CLAIM_GAS_LIMIT = 91000;
*/
export const CHECKOUT_APP_URL = {
[ENV_DEVELOPMENT]: 'https://checkout.dev.immutable.com',
[Environment.SANDBOX]: 'http://localhost:3001',
[Environment.SANDBOX]: 'https://checkout.sandbox.immutable.com',
[Environment.PRODUCTION]: 'https://checkout.immutable.com',
};
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import {
Checkout,
CheckoutWidgetConfiguration,
CheckoutWidgetParams,
WalletProviderName,
} from '@imtbl/checkout-sdk';
import {
CheckoutActions,
Expand Down Expand Up @@ -34,8 +33,11 @@ export default function CheckoutWidget(props: CheckoutWidgetInputs) {
initialCheckoutState,
);
const checkoutReducerValues = useMemo(
() => ({ checkoutState, checkoutDispatch }),
[checkoutState, checkoutDispatch],
() => ({
checkoutState: { ...checkoutState, iframeUrl, checkout },
checkoutDispatch,
}),
[checkoutState, checkoutDispatch, iframeUrl, checkout],
);

useEffect(() => {
Expand All @@ -49,34 +51,6 @@ export default function CheckoutWidget(props: CheckoutWidgetInputs) {
});
}, [iframeUrl]);

useEffect(() => {
checkoutDispatch({
payload: {
type: CheckoutActions.SET_CHECKOUT,
checkout,
},
});

const connectProvider = async () => {
const createProviderResult = await checkout.createProvider({
walletProviderName: WalletProviderName.METAMASK,
});

const connectResult = await checkout.connect({
provider: createProviderResult.provider,
});

checkoutDispatch({
payload: {
type: CheckoutActions.SET_PROVIDER,
provider: connectResult.provider,
},
});
};

connectProvider();
}, [checkout]);

return (
<CheckoutContextProvider values={checkoutReducerValues}>
<CheckoutAppIframe />
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { PostMessageHandler } from '@imtbl/checkout-sdk';
import {
Dispatch,
ReactNode, useContext, useEffect,
Dispatch, ReactNode, useContext, useEffect,
} from 'react';
import {
CheckoutAction,
Expand All @@ -10,32 +9,42 @@ import {
CheckoutState,
} from './CheckoutContext';
import { ProviderRelay } from './ProviderRelay';
import { CHECKOUT_APP_URL } from '../../../lib';

type CheckoutContextProviderProps = {
values: {
checkoutState: CheckoutState,
checkoutDispatch: Dispatch<CheckoutAction>,
}, children: ReactNode
checkoutState: CheckoutState;
checkoutDispatch: Dispatch<CheckoutAction>;
};
children: ReactNode;
};
export function CheckoutContextProvider({ values, children }: CheckoutContextProviderProps) {
export function CheckoutContextProvider({
values,
children,
}: CheckoutContextProviderProps) {
const { checkoutState, checkoutDispatch } = values;
const { checkout } = checkoutState;
const { provider, checkoutAppIframe, postMessageHandler } = checkoutState;
const {
checkout,
provider,
checkoutAppIframe,
postMessageHandler,
iframeUrl,
} = checkoutState;

useEffect(() => {
if (!checkoutAppIframe || !checkout) return;
if (!checkoutAppIframe || !checkout || !iframeUrl) return;

const postMessageHandlerInstance = new PostMessageHandler({
targetOrigin: new URL(iframeUrl).origin,
eventTarget: checkoutAppIframe,
});

checkoutDispatch({
payload: {
type: CheckoutActions.SET_POST_MESSAGE_HANDLER,
postMessageHandler: new PostMessageHandler({
targetOrigin: CHECKOUT_APP_URL[checkout.config.environment],
eventTarget: checkoutAppIframe,
}),
postMessageHandler: postMessageHandlerInstance,
},
});
}, [checkoutAppIframe, checkout]);
}, [checkoutAppIframe, checkout, iframeUrl]);

useEffect(() => {
if (!provider || !postMessageHandler) return undefined;
Expand All @@ -55,7 +64,6 @@ export function CheckoutContextProvider({ values, children }: CheckoutContextPro
<CheckoutContext.Provider value={values}>
{children}
</CheckoutContext.Provider>

);
}

Expand Down

0 comments on commit bc564a1

Please sign in to comment.