chore: remove token validation

src/components/cardFields/PayPalCardFieldsProvider.test.tsx

@@ -8,7 +8,6 @@ import { PayPalScriptProvider } from "../PayPalScriptProvider";
 import { PayPalCardFieldsProvider } from "./PayPalCardFieldsProvider";
 import {
     CARD_FIELDS_DUPLICATE_CHILDREN_ERROR,
-    EMPTY_BRAINTREE_AUTHORIZATION_ERROR_MESSAGE,
 } from "../../constants";
 import { PayPalNumberField } from "./PayPalNumberField";
 import { PayPalCVVField } from "./PayPalCVVField";
@@ -111,31 +110,6 @@ describe("PayPalCardFieldsProvider", () => {
         spyConsoleError.mockRestore();
     });
 
-    test("should throw an Error using the component with PayPalScriptProvider without dataClientToken", async () => {
-        const spyConsoleError = jest
-            .spyOn(console, "error")
-            .mockImplementation();
-
-        render(
-            <PayPalScriptProvider options={{ clientId: "" }}>
-                <PayPalCardFieldsProvider
-                    onApprove={mockOnApprove}
-                    createOrder={mockCreateOrder}
-                    onError={mockOnError}
-                >
-                    <></>
-                </PayPalCardFieldsProvider>
-            </PayPalScriptProvider>,
-            { wrapper }
-        );
-
-        await waitFor(() => expect(onError).toHaveBeenCalled());
-        expect(onError.mock.calls[0][0].message).toEqual(
-            EMPTY_BRAINTREE_AUTHORIZATION_ERROR_MESSAGE
-        );
-        spyConsoleError.mockRestore();
-    });
-
     test("should throw an Error using the component with duplicate fields", async () => {
         const spyConsoleError = jest
             .spyOn(console, "error")

src/components/cardFields/PayPalCardFieldsProvider.tsx

@@ -1,7 +1,6 @@
 import React, { ReactNode, useEffect, useRef, useState } from "react";
 
-import { SCRIPT_LOADING_STATE } from "../../types";
-import { useScriptProviderContext } from "../../hooks/scriptProviderHooks";
+import { usePayPalScriptReducer } from "../../hooks/scriptProviderHooks";
 import { getPayPalWindowNamespace } from "../../utils";
 import { SDK_SETTINGS } from "../../constants";
 import { generateMissingCardFieldsError } from "./utils";
@@ -21,7 +20,7 @@ export const PayPalCardFieldsProvider = ({
     children,
     ...props
 }: CardFieldsProviderProps): JSX.Element => {
-    const [{ options, loadingStatus }] = useScriptProviderContext();
+    const [{ isResolved, options }] = usePayPalScriptReducer();
     const { fields, registerField, unregisterField } =
         usePayPalCardFieldsRegistry();
 
@@ -34,7 +33,7 @@ export const PayPalCardFieldsProvider = ({
     const [, setError] = useState(null);
 
     useEffect(() => {
-        if (!(loadingStatus === SCRIPT_LOADING_STATE.RESOLVED)) {
+        if (!isResolved) {
             return;
         }
 
@@ -74,7 +73,7 @@ export const PayPalCardFieldsProvider = ({
             setCardFieldsForm(null);
             cardFieldsInstance.current = null;
         };
-    }, [loadingStatus]); // eslint-disable-line react-hooks/exhaustive-deps
+    }, [isResolved]); // eslint-disable-line react-hooks/exhaustive-deps
 
     if (!isEligible) {
         // TODO: What should be returned here?

src/components/cardFields/__snapshots__/PayPalCardFieldsProvider.test.tsx.snap

@@ -1,3 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`PayPalCardFieldsProvider should throw an error when the 'card-fields' component is missing from the components list passed to the PayPalScriptProvider 1`] = `"Invalid authorization data. Use dataClientToken or dataUserIdToken to authorize."`;
+exports[`PayPalCardFieldsProvider should throw an error when the 'card-fields' component is missing from the components list passed to the PayPalScriptProvider 1`] = `
+"Unable to render <PayPalCardFieldsProvider /> because window.paypal.CardFields is undefined.
+To fix the issue, add 'card-fields' to the list of components passed to the parent PayPalScriptProvider: <PayPalScriptProvider options={{ components: 'buttons,messages,card-fields'}}>"
+`;