WIP - Handle geolocation requests

Author: markmur

README.md

@@ -144,8 +144,8 @@ function App() {
 }
 ```
 
-See [Usage with the Storefront API](#usage-with-the-storefront-api) below on how
-to get a checkout URL to pass to the kit.
+See [usage with the Storefront API](#usage-with-the-storefront-api) below for details on how
+to obtain a checkout URL to pass to the kit.
 
 > [!NOTE]
 > The recommended usage of the library is through a

modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/CustomCheckoutEventProcessor.java

@@ -43,22 +43,58 @@ of this software and associated documentation files (the "Software"), to deal
 
 public class CustomCheckoutEventProcessor extends DefaultCheckoutEventProcessor {
   private final ReactApplicationContext reactContext;
-
   private final ObjectMapper mapper = new ObjectMapper();
 
+  // Geolocation-specific variables
+
+  private String geolocationOrigin;
+  private GeolocationPermissions.Callback geolocationCallback;
+  private boolean retainGeolocationForFutureRequests = true;
+
   public CustomCheckoutEventProcessor(Context context, ReactApplicationContext reactContext) {
     super(context);
-
     this.reactContext = reactContext;
   }
 
+  // Public methods
+
+  public void invokeGeolocationCallback(boolean allow) {
+    if (geolocationCallback != null) {
+      geolocationCallback.invoke(geolocationOrigin, allow, retainGeolocationForFutureRequests);
+      geolocationCallback = null;
+    }
+  }
+
+  // Lifecycle events
+
+  /**
+   * This method is called when the checkout sheet webpage requests geolocation
+   * permissions.
+   *
+   * Since the app needs to request permissions first before granting, we store
+   * the callback and origin in memory and emit a "geolocationRequest" event to
+   * the app. The app will then request the necessary geolocation permissions
+   * and invoke the native callback with the result.
+   *
+   * @param origin   - The origin of the request
+   * @param callback - The callback to invoke when the app requests permissions
+   */
   @Override
-  public void onGeolocationPermissionsShowPrompt(@NonNull String origin, @NonNull GeolocationPermissions.Callback callback) {
+  public void onGeolocationPermissionsShowPrompt(@NonNull String origin,
+      @NonNull GeolocationPermissions.Callback callback) {
+
+    // Store the callback and origin in memory. The kit will wait for the app to
+    // request permissions first before granting.
+    this.geolocationCallback = callback;
+    this.geolocationOrigin = origin;
+
+    // Emit a "geolocationRequest" event to the app.
     try {
-      String data = mapper.writeValueAsString(origin);
-      sendEventWithStringData("geolocation_permissions_prompt", data);
+      Map<String, Object> event = new HashMap();
+      event.put("origin", origin.toString());
+      sendEventWithStringData("geolocationRequest", mapper.writeValueAsString(event));
     } catch (IOException e) {
-      Log.e("ShopifyCheckoutSheetKit", "Error processing onGeolocationPermissionsShowPrompt", e);
+      Log.e("ShopifyCheckoutSheetKit", "Error emitting \"geolocationRequest\" event", e);
     }
   }
 
@@ -67,16 +103,6 @@ public void onGeolocationPermissionsHidePrompt() {
     super.onGeolocationPermissionsHidePrompt();
   }
 
-  @Override
-  public void onCheckoutCompleted(@NonNull CheckoutCompletedEvent event) {
-    try {
-      String data = mapper.writeValueAsString(event);
-      sendEventWithStringData("completed", data);
-    } catch (IOException e) {
-      Log.e("ShopifyCheckoutSheetKit", "Error processing completed event", e);
-    }
-  }
-
   @Override
   public void onWebPixelEvent(@NonNull PixelEvent event) {
     try {
@@ -97,6 +123,23 @@ public void onCheckoutFailed(CheckoutException checkoutError) {
     }
   }
 
+  @Override
+  public void onCheckoutCanceled() {
+    sendEvent("close", null);
+  }
+
+  @Override
+  public void onCheckoutCompleted(@NonNull CheckoutCompletedEvent event) {
+    try {
+      String data = mapper.writeValueAsString(event);
+      sendEventWithStringData("completed", data);
+    } catch (IOException e) {
+      Log.e("ShopifyCheckoutSheetKit", "Error processing completed event", e);
+    }
+  }
+
+  // Private
+
   private Map<String, Object> populateErrorDetails(CheckoutException checkoutError) {
     Map<String, Object> errorMap = new HashMap();
     errorMap.put("__typename", getErrorTypeName(checkoutError));
@@ -127,11 +170,6 @@ private String getErrorTypeName(CheckoutException error) {
     }
   }
 
-  @Override
-  public void onCheckoutCanceled() {
-    sendEvent("close", null);
-  }
-
   private void sendEvent(String eventName, @Nullable WritableNativeMap params) {
     reactContext
         .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)

modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/ShopifyCheckoutSheetKitModule.java

@@ -117,6 +117,57 @@ public void invalidateCache() {
     ShopifyCheckoutSheetKit.invalidate();
   }
 
+  @ReactMethod
+  public void getConfig(Promise promise) {
+    WritableNativeMap resultConfig = new WritableNativeMap();
+
+    resultConfig.putBoolean("preloading", checkoutConfig.getPreloading().getEnabled());
+    resultConfig.putString("colorScheme", colorSchemeToString(checkoutConfig.getColorScheme()));
+
+    promise.resolve(resultConfig);
+  }
+
+  @ReactMethod
+  public void setConfig(ReadableMap config) {
+    Context context = getReactApplicationContext();
+
+    ShopifyCheckoutSheetKit.configure(configuration -> {
+      if (config.hasKey("preloading")) {
+        configuration.setPreloading(new Preloading(config.getBoolean("preloading")));
+      }
+
+      if (config.hasKey("colorScheme")) {
+        ColorScheme colorScheme = getColorScheme(Objects.requireNonNull(config.getString("colorScheme")));
+        ReadableMap colorsConfig = config.hasKey("colors") ? config.getMap("colors") : null;
+        ReadableMap androidConfig = null;
+
+        if (colorsConfig != null && colorsConfig.hasKey("android")) {
+          androidConfig = colorsConfig.getMap("android");
+        }
+
+        if (this.isValidColorConfig(androidConfig)) {
+          ColorScheme colorSchemeWithOverrides = getColors(colorScheme, androidConfig);
+          if (colorSchemeWithOverrides != null) {
+            configuration.setColorScheme(colorSchemeWithOverrides);
+            checkoutConfig = configuration;
+            return;
+          }
+        }
+
+        configuration.setColorScheme(colorScheme);
+      }
+
+      checkoutConfig = configuration;
+    });
+  }
+
+  @ReactMethod
+  public void initiateGeolocationRequest(Boolean allow) {
+    checkoutEventProcessor.invokeGeolocationCallback(allow);
+  }
+
+  // Private
+
   private ColorScheme getColorScheme(String colorScheme) {
     switch (colorScheme) {
       case "web_default":
@@ -233,50 +284,6 @@ private ColorScheme getColors(ColorScheme colorScheme, ReadableMap config) {
     return null;
   }
 
-  @ReactMethod
-  public void setConfig(ReadableMap config) {
-    Context context = getReactApplicationContext();
-
-    ShopifyCheckoutSheetKit.configure(configuration -> {
-      if (config.hasKey("preloading")) {
-        configuration.setPreloading(new Preloading(config.getBoolean("preloading")));
-      }
-
-      if (config.hasKey("colorScheme")) {
-        ColorScheme colorScheme = getColorScheme(Objects.requireNonNull(config.getString("colorScheme")));
-        ReadableMap colorsConfig = config.hasKey("colors") ? config.getMap("colors") : null;
-        ReadableMap androidConfig = null;
-
-        if (colorsConfig != null && colorsConfig.hasKey("android")) {
-          androidConfig = colorsConfig.getMap("android");
-        }
-
-        if (this.isValidColorConfig(androidConfig)) {
-          ColorScheme colorSchemeWithOverrides = getColors(colorScheme, androidConfig);
-          if (colorSchemeWithOverrides != null) {
-            configuration.setColorScheme(colorSchemeWithOverrides);
-            checkoutConfig = configuration;
-            return;
-          }
-        }
-
-        configuration.setColorScheme(colorScheme);
-      }
-
-      checkoutConfig = configuration;
-    });
-  }
-
-  @ReactMethod
-  public void getConfig(Promise promise) {
-    WritableNativeMap resultConfig = new WritableNativeMap();
-
-    resultConfig.putBoolean("preloading", checkoutConfig.getPreloading().getEnabled());
-    resultConfig.putString("colorScheme", colorSchemeToString(checkoutConfig.getColorScheme()));
-
-    promise.resolve(resultConfig);
-  }
-
   private Color parseColor(String colorStr) {
     try {
       colorStr = colorStr.replace("#", "");

modules/@shopify/checkout-sheet-kit/src/context.tsx

@@ -23,8 +23,9 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SO
 
 import React, {useCallback, useMemo, useRef} from 'react';
 import type {PropsWithChildren} from 'react';
-import type {EmitterSubscription} from 'react-native';
+import {type EmitterSubscription} from 'react-native';
 import {ShopifyCheckoutSheet} from './index';
+import type {Features} from './index.d';
 import type {
   AddEventListener,
   RemoveEventListeners,
@@ -61,17 +62,19 @@ const ShopifyCheckoutSheetContext = React.createContext<Context>({
 });
 
 interface Props {
+  features?: Partial<Features>;
   configuration?: Configuration;
 }
 
 export function ShopifyCheckoutSheetProvider({
+  features,
   configuration,
   children,
 }: PropsWithChildren<Props>) {
   const instance = useRef<ShopifyCheckoutSheet | null>(null);
 
   if (!instance.current) {
-    instance.current = new ShopifyCheckoutSheet(configuration);
+    instance.current = new ShopifyCheckoutSheet(configuration, features);
   }
 
   const addEventListener: AddEventListener = useCallback(

modules/@shopify/checkout-sheet-kit/src/index.d.ts

@@ -28,6 +28,18 @@ import type {CheckoutException} from './errors';
 
 export type Maybe<T> = T | undefined;
 
+/**
+ * Configuration options for checkout sheet kit features
+ */
+export interface Features {
+  /**
+   * When enabled, the checkout will handle geolocation permission requests internally.
+   * If disabled, geolocation requests will emit a 'geolocationRequest' event that
+   * must be handled by the application.
+   */
+  handleGeolocationRequests: boolean;
+}
+
 export enum ColorScheme {
   automatic = 'automatic',
   light = 'light',
@@ -127,9 +139,15 @@ export type Configuration = CommonConfiguration &
       }
   );
 
-export type CheckoutEvent = 'close' | 'completed' | 'error' | 'pixel';
+export type CheckoutEvent =
+  | 'close'
+  | 'completed'
+  | 'error'
+  | 'geolocationRequest'
+  | 'pixel';
 
 export type CloseEventCallback = () => void;
+export type GeolocationRequestEventCallback = () => void;
 export type PixelEventCallback = (event: PixelEvent) => void;
 export type CheckoutExceptionCallback = (error: CheckoutException) => void;
 export type CheckoutCompletedEventCallback = (
@@ -162,6 +180,11 @@ function addEventListener(
   callback: PixelEventCallback,
 ): Maybe<EmitterSubscription>;
 
+function addEventListener(
+  event: 'geolocationRequest',
+  callback: GeolocationRequestEventCallback,
+): Maybe<EmitterSubscription>;
+
 function removeEventListeners(event: CheckoutEvent): void;
 
 export type AddEventListener = typeof addEventListener;
@@ -198,7 +221,11 @@ export interface ShopifyCheckoutSheetKit {
    */
   addEventListener: AddEventListener;
   /**
-   * Remove subscriptions to checkout events
+   * Remove subscriptions to checkout events.
    */
   removeEventListeners: RemoveEventListeners;
+  /**
+   * Cleans up any event callbacks to prevent memory leaks.
+   */
+  teardown(): void;
 }