🐛 app: fix onesignal web/native abstraction

app/_layout.tsx

@@ -20,7 +20,7 @@ import tamaguiConfig from "../tamagui.config";
 import alchemyConnector from "../utils/alchemyConnector";
 import { alchemyAPIKey, chain } from "../utils/constants";
 import handleError from "../utils/handleError";
-import useOneSignal from "../utils/onesignal";
+import useOneSignal from "../utils/useOneSignal";
 
 export { ErrorBoundary } from "expo-router";
 
@@ -53,6 +53,8 @@ export default function RootLayout() {
     ...FontAwesome.font,
   });
 
+  useOneSignal();
+
   useEffect(() => {
     if (error) throw error;
   }, [error]);

utils/constants.ts

@@ -14,7 +14,7 @@ export const alchemyGasPolicyId = process.env.EXPO_PUBLIC_ALCHEMY_GAS_POLICY_ID;
 export const turnkeyAPIPublicKey = process.env.EXPO_PUBLIC_TURNKEY_API_PUBLIC_KEY;
 export const turnkeyAPIPrivateKey = process.env.EXPO_PUBLIC_TURNKEY_API_PRIVATE_KEY;
 export const turnkeyOrganizationId = process.env.EXPO_PUBLIC_TURNKEY_ORGANIZATION_ID;
-export const oneSignalAPPId = process.env.EXPO_PUBLIC_ONE_SIGNAL_APP_ID;
+export const oneSignalAppId = process.env.EXPO_PUBLIC_ONE_SIGNAL_APP_ID;
 
 export const chain = {
   ...goerli,

utils/useOneSignal.ts

@@ -0,0 +1,57 @@
+import { useState, useEffect } from "react";
+import { Platform } from "react-native";
+import type OneSignalNative from "react-native-onesignal";
+import type OneSignalWeb from "react-onesignal";
+
+import { oneSignalAppId as appId } from "./constants";
+import handleError from "./handleError";
+
+const { initialization, login, logout } = (
+  Platform.OS === "web"
+    ? () => {
+        const OneSignal = (require("react-onesignal") as { default: typeof OneSignalWeb }).default; // eslint-disable-line @typescript-eslint/no-var-requires, unicorn/prefer-module
+        return {
+          initialization:
+            appId === undefined ? Promise.resolve() : OneSignal.init({ appId, allowLocalhostAsSecureOrigin: __DEV__ }),
+          login: (userId: string) => OneSignal.login(userId),
+          logout: () => OneSignal.logout(),
+        };
+      }
+    : () => {
+        const { OneSignal } = require("react-native-onesignal") as typeof OneSignalNative; // eslint-disable-line @typescript-eslint/no-var-requires, unicorn/prefer-module
+        return {
+          initialization: (() => {
+            if (appId !== undefined) OneSignal.initialize(appId);
+            return Promise.resolve();
+          })(),
+          login: (userId: string) => {
+            OneSignal.login(userId);
+            return Promise.resolve();
+          },
+          logout: () => {
+            OneSignal.logout();
+            return Promise.resolve();
+          },
+        };
+      }
+)();
+
+export default function useOneSignal({ userId }: { userId?: string } = {}) {
+  const [initialized, setInitialized] = useState(false);
+
+  useEffect(() => {
+    initialization
+      .then(() => {
+        setInitialized(true);
+      })
+      .catch(handleError);
+
+    if (userId && initialized) login(userId).catch(handleError);
+
+    return () => {
+      if (userId) logout().catch(handleError);
+    };
+  }, [userId, initialized]);
+
+  return initialized;
+}