fix(checkout): CHECKOUT-9388 Pass instance of error logger

Author: davidchin

packages/core/src/app/checkout/CheckoutApp.tsx

@@ -31,12 +31,6 @@ export interface CheckoutAppProps {
 const CheckoutApp = (props: CheckoutAppProps): ReactElement => {
     const { containerId, sentryConfig, publicPath, sentrySampleRate } = props;
 
-    const checkoutService = useMemo(() => createCheckoutService({
-        locale: getLanguageService().getLocale(),
-        shouldWarnMutation: process.env.NODE_ENV === 'development',
-    }), []);
-    const embeddedStylesheet = useMemo(() => createEmbeddedCheckoutStylesheet(), []);
-    const embeddedSupport = useMemo(() => createEmbeddedCheckoutSupport(getLanguageService()), []);
     const errorLogger = useMemo(() => createErrorLogger(
         { sentry: sentryConfig },
         {
@@ -45,6 +39,13 @@ const CheckoutApp = (props: CheckoutAppProps): ReactElement => {
             sampleRate: sentrySampleRate || 0.1,
         },
     ), []);
+    const checkoutService = useMemo(() => createCheckoutService({
+        locale: getLanguageService().getLocale(),
+        shouldWarnMutation: process.env.NODE_ENV === 'development',
+        errorLogger,
+    }), []);
+    const embeddedStylesheet = useMemo(() => createEmbeddedCheckoutStylesheet(), []);
+    const embeddedSupport = useMemo(() => createEmbeddedCheckoutSupport(getLanguageService()), []);
 
     useEffect(() => {
         ReactModal.setAppElement(`#${containerId}`);

packages/core/src/app/order/OrderConfirmationApp.tsx

@@ -34,19 +34,20 @@ const OrderConfirmationApp: React.FC<OrderConfirmationAppProps> = ({
     sentrySampleRate,
 }) => {
     const accountService = useMemo(() => new AccountService(), []);
+    const errorLogger = useMemo(() => createErrorLogger(
+        { sentry: sentryConfig },
+        {
+            errorTypes: ['UnrecoverableError'],
+            publicPath,
+            sampleRate: sentrySampleRate || 0.1,
+        },
+    ), []);
     const checkoutService = useMemo(() => createCheckoutService({
-            locale: getLanguageService().getLocale(),
-            shouldWarnMutation: process.env.NODE_ENV === 'development',
+        locale: getLanguageService().getLocale(),
+        shouldWarnMutation: process.env.NODE_ENV === 'development',
+        errorLogger,
     }), []);
     const embeddedStylesheet = useMemo(() => createEmbeddedCheckoutStylesheet(), []);
-    const errorLogger = useMemo(() => createErrorLogger(
-            { sentry: sentryConfig },
-            {
-                errorTypes: ['UnrecoverableError'],
-                publicPath,
-                sampleRate: sentrySampleRate || 0.1,
-            },
-    ), []);
 
     useEffect(() => {
         ReactModal.setAppElement(`#${containerId}`);