Fix react-native package lint issues

Author: mattinannt

packages/react-native/src/components/formbricks.tsx

@@ -1,9 +1,9 @@
+import React, { useCallback, useEffect, useSyncExternalStore } from "react";
+import { View } from "react-native";
 import { SurveyWebView } from "@/components/survey-web-view";
 import { Logger } from "@/lib/common/logger";
 import { setup } from "@/lib/common/setup";
 import { SurveyStore } from "@/lib/survey/store";
-import React, { useCallback, useEffect, useSyncExternalStore } from "react";
-import { View } from "react-native";
 
 interface FormbricksProps {
   appUrl: string;

packages/react-native/src/components/survey-web-view.tsx

@@ -1,13 +1,13 @@
 /* eslint-disable no-console -- debugging*/
+import React, { type JSX, useEffect, useRef, useState } from "react";
+import { KeyboardAvoidingView, Modal, View, StyleSheet } from "react-native";
+import { WebView, type WebViewMessageEvent } from "react-native-webview";
 import { RNConfig } from "@/lib/common/config";
 import { Logger } from "@/lib/common/logger";
 import { filterSurveys, getLanguageCode, getStyling } from "@/lib/common/utils";
 import { SurveyStore } from "@/lib/survey/store";
 import { type TUserState, ZJsRNWebViewOnMessageData } from "@/types/config";
 import type { TSurvey, SurveyContainerProps } from "@/types/survey";
-import React, { type JSX, useEffect, useRef, useState } from "react";
-import { KeyboardAvoidingView, Modal, View, StyleSheet } from "react-native";
-import { WebView, type WebViewMessageEvent } from "react-native-webview";
 
 const logger = Logger.getInstance();
 logger.configure({ logLevel: "debug" });
@@ -21,15 +21,15 @@ interface SurveyWebViewProps {
 
 export function SurveyWebView(
   props: SurveyWebViewProps
-): JSX.Element | undefined {
+): JSX.Element | null {
   const webViewRef = useRef(null);
   const [isSurveyRunning, setIsSurveyRunning] = useState(false);
   const [showSurvey, setShowSurvey] = useState(false);
   const [appConfig, setAppConfig] = useState<RNConfig | null>(null);
   const [languageCode, setLanguageCode] = useState("default");
 
   useEffect(() => {
-    const fetchConfig = async () => {
+    const fetchConfig = async (): Promise<void> => {
       const config = await RNConfig.getInstance();
       setAppConfig(config);
     };
@@ -87,7 +87,7 @@ export function SurveyWebView(
   }, [props.survey.delay, isSurveyRunning, props.survey.name]);
 
   if (!appConfig) {
-    return;
+    return null;
   }
 
   const project = appConfig.get().environment.data.project;

packages/react-native/src/index.ts

@@ -38,4 +38,4 @@ export const logout = async (): Promise<void> => {
   await queue.wait();
 };
 
-export { Formbricks as default } from "@/components/formbricks";
+export { Formbricks } from "@/components/formbricks";

packages/react-native/src/lib/common/api.ts

@@ -1,11 +1,11 @@
 import { wrapThrowsAsync } from "@/lib/common/utils";
 import {
-  ApiResponse,
-  ApiSuccessResponse,
-  CreateOrUpdateUserResponse,
+  type ApiResponse,
+  type ApiSuccessResponse,
+  type CreateOrUpdateUserResponse,
 } from "@/types/api";
-import { TEnvironmentState } from "@/types/config";
-import { ApiErrorResponse, Result, err, ok } from "@/types/error";
+import { type TEnvironmentState } from "@/types/config";
+import { type ApiErrorResponse, type Result, err, ok } from "@/types/error";
 
 export const makeRequest = async <T>(
   appUrl: string,

packages/react-native/src/lib/common/config.ts

@@ -11,6 +11,7 @@ export class RNConfig {
 
   private config: TConfig | null = null;
 
+  // eslint-disable-next-line @typescript-eslint/no-empty-function -- singleton constructor
   private constructor() {}
 
   public async init(): Promise<void> {
@@ -24,7 +25,7 @@ export class RNConfig {
     }
   }
 
-  static async getInstance(): Promise<RNConfig> {
+  public static async getInstance(): Promise<RNConfig> {
     RNConfig.instance ??= new RNConfig();
     await RNConfig.instance.init();
     return RNConfig.instance;

packages/react-native/src/lib/common/event-listeners.ts

@@ -7,8 +7,8 @@ import { addUserStateExpiryCheckListener, clearUserStateExpiryCheckListener } fr
 let areRemoveEventListenersAdded = false;
 
 export const addEventListeners = (): void => {
-  addEnvironmentStateExpiryCheckListener();
-  addUserStateExpiryCheckListener();
+  void addEnvironmentStateExpiryCheckListener();
+  void addUserStateExpiryCheckListener();
 };
 
 export const addCleanupEventListeners = (): void => {

packages/react-native/src/lib/common/setup.ts

@@ -50,10 +50,10 @@ export const migrateUserStateAddContactId = async (): Promise<{
       return { changed: false };
     }
 
-    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- data could be undefined
+     
     if (
-      !existingConfig.user?.data?.contactId &&
-      existingConfig.user?.data?.userId
+      !existingConfig.user?.data.contactId &&
+      existingConfig.user?.data.userId
     ) {
       return { changed: true };
     }
@@ -63,7 +63,9 @@ export const migrateUserStateAddContactId = async (): Promise<{
 };
 
 // Helper: Handle missing field error
-function handleMissingField(field: string) {
+function handleMissingField(
+  field: string
+): Result<void, MissingFieldError> {
   const logger = Logger.getInstance();
   logger.debug(`No ${field} provided`);
   return err({
@@ -91,21 +93,21 @@ async function syncEnvironmentStateIfExpired(
 
   if (environmentStateResponse.ok) {
     return ok(environmentStateResponse.data);
-  } else {
-    logger.error(
-      `Error fetching environment state: ${environmentStateResponse.error.code} - ${environmentStateResponse.error.responseMessage ?? ""}`
-    );
-
-    return err({
-      code: "network_error",
-      message: "Error fetching environment state",
-      status: 500,
-      url: new URL(
-        `${configInput.appUrl}/api/v1/client/${configInput.environmentId}/environment`
-      ),
-      responseMessage: environmentStateResponse.error.message,
-    });
   }
+
+  logger.error(
+    `Error fetching environment state: ${environmentStateResponse.error.code} - ${environmentStateResponse.error.responseMessage ?? ""}`
+  );
+
+  return err({
+    code: "network_error",
+    message: "Error fetching environment state",
+    status: 500,
+    url: new URL(
+      `${configInput.appUrl}/api/v1/client/${configInput.environmentId}/environment`
+    ),
+    responseMessage: environmentStateResponse.error.message,
+  });
 }
 
 // Helper: Sync user state if expired
@@ -125,7 +127,7 @@ async function syncUserStateIfExpired(
 
   logger.debug("Person state expired. Syncing.");
 
-  if (userState?.data?.userId) {
+  if (userState?.data.userId) {
     const updatesResponse = await sendUpdatesToBackend({
       appUrl: configInput.appUrl,
       environmentId: configInput.environmentId,
@@ -135,23 +137,23 @@ async function syncUserStateIfExpired(
     });
     if (updatesResponse.ok) {
       return ok(updatesResponse.data.state);
-    } else {
-      logger.error(
-        `Error updating user state: ${updatesResponse.error.code} - ${updatesResponse.error.responseMessage ?? ""}`
-      );
-      return err({
-        code: "network_error",
-        message: "Error updating user state",
-        status: 500,
-        url: new URL(
-          `${configInput.appUrl}/api/v1/client/${configInput.environmentId}/update/contacts/${userState.data.userId}`
-        ),
-        responseMessage: "Unknown error",
-      } as const);
     }
-  } else {
-    return ok(DEFAULT_USER_STATE_NO_USER_ID);
+
+    logger.error(
+      `Error updating user state: ${updatesResponse.error.code} - ${updatesResponse.error.responseMessage ?? ""}`
+    );
+    return err({
+      code: "network_error",
+      message: "Error updating user state",
+      status: 500,
+      url: new URL(
+        `${configInput.appUrl}/api/v1/client/${configInput.environmentId}/update/contacts/${userState.data.userId}`
+      ),
+      responseMessage: "Unknown error",
+    } as const);
   }
+
+  return ok(DEFAULT_USER_STATE_NO_USER_ID);
 }
 
 // Helper: Update app config with synced states
@@ -199,22 +201,35 @@ const createNewConfigAndSync = async (
       appUrl: configInput.appUrl,
       environmentId: configInput.environmentId,
     });
-    if (!environmentStateResponse.ok) {
-      throw environmentStateResponse.error;
+
+    if (environmentStateResponse.ok) {
+      const personState = DEFAULT_USER_STATE_NO_USER_ID;
+      const environmentState = environmentStateResponse.data;
+      const filteredSurveys = filterSurveys(environmentState, personState);
+      appConfig.update({
+        appUrl: configInput.appUrl,
+        environmentId: configInput.environmentId,
+        user: personState,
+        environment: environmentState,
+        filteredSurveys,
+      });
+      return;
     }
-    const personState = DEFAULT_USER_STATE_NO_USER_ID;
-    const environmentState = environmentStateResponse.data;
-    const filteredSurveys = filterSurveys(environmentState, personState);
-    appConfig.update({
-      appUrl: configInput.appUrl,
-      environmentId: configInput.environmentId,
-      user: personState,
-      environment: environmentState,
-      filteredSurveys,
+
+    await handleErrorOnFirstSetup({
+      code: environmentStateResponse.error.code,
+      responseMessage:
+        environmentStateResponse.error.responseMessage ??
+        environmentStateResponse.error.message,
     });
-  } catch (e) {
+  } catch (e: unknown) {
+    const setupError = normalizeSetupError(e);
     await handleErrorOnFirstSetup(
-      e as { code: string; responseMessage: string }
+      {
+        code: setupError.code ?? "network_error",
+        responseMessage:
+          setupError.responseMessage ?? setupError.message ?? "Unknown error",
+      }
     );
   }
 };
@@ -260,10 +275,10 @@ const finalizeSetup = (): void => {
 };
 
 // Helper: Load existing config
-const loadExistingConfig = async (
+const loadExistingConfig = (
   appConfig: RNConfig,
   logger: ReturnType<typeof Logger.getInstance>
-): Promise<TConfig | undefined> => {
+): TConfig | undefined => {
   let existingConfig: TConfig | undefined;
   try {
     existingConfig = appConfig.get();
@@ -294,7 +309,7 @@ export const setup = async (
     return okVoid();
   }
 
-  const existingConfig = await loadExistingConfig(appConfig, logger);
+  const existingConfig = loadExistingConfig(appConfig, logger);
   if (shouldReturnEarlyForErrorState(existingConfig, logger)) {
     return okVoid();
   }
@@ -369,8 +384,6 @@ export const checkSetup = (): Result<void, NotSetupError> => {
 
   return okVoid();
 };
-
-// eslint-disable-next-line @typescript-eslint/require-await -- disabled for now
 export const tearDown = async (): Promise<void> => {
   const logger = Logger.getInstance();
   const appConfig = await RNConfig.getInstance();
@@ -425,3 +438,27 @@ export const handleErrorOnFirstSetup = async (e: {
 
   throw new Error("Could not set up formbricks");
 };
+
+const normalizeSetupError = (
+  error: unknown
+): Partial<{
+  code: string;
+  responseMessage: string;
+  message: string;
+}> => {
+  if (typeof error !== "object" || error === null) {
+    return {};
+  }
+
+  const candidate = error as Record<string, unknown>;
+
+  return {
+    code: typeof candidate.code === "string" ? candidate.code : undefined,
+    responseMessage:
+      typeof candidate.responseMessage === "string"
+        ? candidate.responseMessage
+        : undefined,
+    message:
+      typeof candidate.message === "string" ? candidate.message : undefined,
+  };
+};

packages/react-native/src/lib/common/storage.ts

@@ -1,7 +1,14 @@
-import AsyncStorageModule from "@react-native-async-storage/async-storage";
+import AsyncStorageModule, {
+  type AsyncStorageStatic,
+} from "@react-native-async-storage/async-storage";
 
-const AsyncStorage =
-  // @ts-expect-error: Some bundlers put the module on .default
-  AsyncStorageModule.default ?? AsyncStorageModule;
+type AsyncStorageModuleWithDefault = AsyncStorageStatic & {
+  default?: AsyncStorageStatic;
+};
+
+const asyncStorageModule = AsyncStorageModule as AsyncStorageModuleWithDefault;
+
+const AsyncStorage: AsyncStorageStatic =
+  asyncStorageModule.default ?? asyncStorageModule;
 
 export { AsyncStorage };

packages/react-native/src/lib/common/tests/api.test.ts

@@ -1,7 +1,7 @@
 // api.test.ts
+import { beforeEach, describe, expect, test, vi } from "vitest";
 import { ApiClient, makeRequest } from "@/lib/common/api";
 import type { TEnvironmentState } from "@/types/config";
-import { beforeEach, describe, expect, test, vi } from "vitest";
 
 // Mock fetch
 const mockFetch = vi.fn();

packages/react-native/src/lib/common/tests/config.test.ts

@@ -1,9 +1,9 @@
 // config.test.ts
 import AsyncStorage from "@react-native-async-storage/async-storage";
 import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
-import { mockConfig } from "./__mocks__/config.mock";
 import { RNConfig, RN_ASYNC_STORAGE_KEY } from "@/lib/common/config";
 import type { TConfig, TConfigUpdateInput } from "@/types/config";
+import { mockConfig } from "./__mocks__/config.mock";
 
 // Define mocks outside of any describe block