fix flow types in pixel component

paypal · Dec 19, 2024 · 09fa39a · 09fa39a
1 parent 2c30945
commit 09fa39a
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 14 deletions.
diff --git a/src/declarations.js b/src/declarations.js
@@ -8,6 +8,7 @@ declare var __PAYPAL_CHECKOUT__: {|
   __REMEMBERED_FUNDING__: $ReadOnlyArray<$Values<typeof FUNDING>>,
   __URI__: {|
     __BUTTONS__: string,
+    __PIXEL__: string,
     __CHECKOUT__: string,
     __CARD_FIELDS__: string,
     __CARD_FIELD__: string,

diff --git a/src/lib/appSwitchResume.js b/src/lib/appSwitchResume.js
@@ -1,14 +1,18 @@
 /* @flow */
+import { FUNDING } from "@paypal/sdk-constants/src";
+
 import { APP_SWITCH_RETURN_HASH } from "../constants";
 
 export type AppSwitchResumeParams = {|
-  orderID?: string,
-  vaultSessionID?: string,
+  orderID?: ?string,
+  vaultSessionID?: ?string,
   buttonSessionID: string,
-  payerID?: string,
-  billingToken?: string,
-  paymentID?: string,
-  subscriptionID?: string,
+  payerID?: ?string,
+  billingToken?: ?string,
+  vaultSetupToken?: ?string,
+  paymentID?: ?string,
+  subscriptionID?: ?string,
+  fundingSource?: ?$Values<typeof FUNDING>,
   checkoutState: "onApprove" | "onCancel" | "onError",
 |};
 
@@ -31,6 +35,8 @@ export function getAppSwitchResumeParams(): AppSwitchResumeParams | null {
   const billingToken = search.get("billingToken");
   const paymentID = search.get("paymentID");
   const subscriptionID = search.get("subscriptionID");
+  const vaultSetupToken = search.get("vaultSetupToken");
+  const fundingSource = search.get("fundingSource");
   if (buttonSessionID) {
     const params: AppSwitchResumeParams = {
       orderID,
@@ -40,6 +46,14 @@ export function getAppSwitchResumeParams(): AppSwitchResumeParams | null {
       billingToken,
       paymentID,
       subscriptionID,
+      // URLSearchParams get returns as string,
+      // but below code excepts a value from list of string.
+      // $FlowIgnore[incompatible-type]
+      fundingSource,
+      vaultSetupToken,
+      // the isPostApprovalAction already ensures
+      // that the function will exit if url hash is not one of supported values.
+      // $FlowIgnore[incompatible-type]
       checkoutState: urlHash,
     };
     return params;

diff --git a/src/zoid/buttons/component.jsx b/src/zoid/buttons/component.jsx
@@ -115,16 +115,16 @@ export const getButtonsComponent: () => ButtonsComponent = memoize(() => {
           return isAppSwitchResumeFlow();
         },
         resume: () => {
-          if (!isAppSwitchResumeFlow()) {
+          const resumeFlowParams = getAppSwitchResumeParams();
+          if (!resumeFlowParams) {
             throw new Error("Resume Flow is not supported.");
           }
-          const resumeFlowParams = getAppSwitchResumeParams();
           getLogger().metricCounter({
             namespace: "resume_flow.init.count",
             event: "info",
             dimensions: {
               orderID: Boolean(resumeFlowParams.orderID),
-              vaultSessionID: Boolean(resumeFlowParams.vaultSessionID),
+              vaultSessionID: Boolean(resumeFlowParams.vaultSetupToken),
               billingToken: Boolean(resumeFlowParams.billingToken),
               payerID: Boolean(resumeFlowParams.payerID),
             },

diff --git a/src/zoid/pixel/component.jsx b/src/zoid/pixel/component.jsx
@@ -51,7 +51,7 @@ import {
   SDK_SETTINGS,
 } from "@paypal/sdk-constants/src";
 
-import { storageState, sessionState } from "../../lib";
+import { storageState, sessionState, isAppSwitchResumeFlow } from "../../lib";
 import { type ButtonProps } from "../../ui/buttons/props";
 import { containerTemplate } from "../buttons/container";
 import { isSupportedNativeBrowser, getRenderedButtons } from "../buttons/util";
@@ -84,15 +84,14 @@ export const getPixelComponent: () => PixelComponent = memoize(() => {
         allowpaymentrequest: "allowpaymentrequest",
         scrolling: "no",
         title: FUNDING_BRAND_LABEL.PAYPAL,
-        width: 1,
-        height: 1,
+        width: "1px",
+        height: "1px",
       },
     },
 
     eligible: () => {
-      // TODO: add checks here to enable resume flow only if hasReturned is true
       return {
-        eligible: true,
+        eligible: isAppSwitchResumeFlow(),
       };
     },