@buoy-gg/impersonate 1.0.3-beta.0

package/lib/commonjs/impersonate/components/index.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "AVATAR_COLORS", {
+  enumerable: true,
+  get: function () {
+    return _UserAvatar.AVATAR_COLORS;
+  }
+});
+Object.defineProperty(exports, "DataNukeSettingsComponent", {
+  enumerable: true,
+  get: function () {
+    return _DataNukeSettings.DataNukeSettings;
+  }
+});
+Object.defineProperty(exports, "ImpersonateBanner", {
+  enumerable: true,
+  get: function () {
+    return _ImpersonateBanner.ImpersonateBanner;
+  }
+});
+Object.defineProperty(exports, "ImpersonateBannerMinimal", {
+  enumerable: true,
+  get: function () {
+    return _ImpersonateBanner.ImpersonateBannerMinimal;
+  }
+});
+Object.defineProperty(exports, "ImpersonateHistoryList", {
+  enumerable: true,
+  get: function () {
+    return _ImpersonateHistoryList.ImpersonateHistoryList;
+  }
+});
+Object.defineProperty(exports, "ImpersonateModal", {
+  enumerable: true,
+  get: function () {
+    return _ImpersonateModal.ImpersonateModal;
+  }
+});
+Object.defineProperty(exports, "ImpersonateStatusBar", {
+  enumerable: true,
+  get: function () {
+    return _ImpersonateStatusBar.ImpersonateStatusBar;
+  }
+});
+Object.defineProperty(exports, "UserAvatar", {
+  enumerable: true,
+  get: function () {
+    return _UserAvatar.UserAvatar;
+  }
+});
+Object.defineProperty(exports, "UserCard", {
+  enumerable: true,
+  get: function () {
+    return _UserCard.UserCard;
+  }
+});
+Object.defineProperty(exports, "UserSearchView", {
+  enumerable: true,
+  get: function () {
+    return _UserSearchView.UserSearchView;
+  }
+});
+Object.defineProperty(exports, "getAvatarColor", {
+  enumerable: true,
+  get: function () {
+    return _UserAvatar.getAvatarColor;
+  }
+});
+Object.defineProperty(exports, "getInitials", {
+  enumerable: true,
+  get: function () {
+    return _UserAvatar.getInitials;
+  }
+});
+var _UserSearchView = require("./UserSearchView");
+var _DataNukeSettings = require("./DataNukeSettings");
+var _ImpersonateHistoryList = require("./ImpersonateHistoryList");
+var _ImpersonateModal = require("./ImpersonateModal");
+var _ImpersonateBanner = require("./ImpersonateBanner");
+var _ImpersonateStatusBar = require("./ImpersonateStatusBar");
+var _UserAvatar = require("./UserAvatar");
+var _UserCard = require("./UserCard");

package/lib/commonjs/impersonate/hooks/index.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "REDUX_RESET_ACTION_TYPE", {
+  enumerable: true,
+  get: function () {
+    return _useAutoClearRedux.REDUX_RESET_ACTION_TYPE;
+  }
+});
+Object.defineProperty(exports, "useAsyncStorageAvailability", {
+  enumerable: true,
+  get: function () {
+    return _useAutoClearAsyncStorage.useAsyncStorageAvailability;
+  }
+});
+Object.defineProperty(exports, "useAutoClearAsyncStorage", {
+  enumerable: true,
+  get: function () {
+    return _useAutoClearAsyncStorage.useAutoClearAsyncStorage;
+  }
+});
+Object.defineProperty(exports, "useAutoClearReactQuery", {
+  enumerable: true,
+  get: function () {
+    return _useAutoClearReactQuery.useAutoClearReactQuery;
+  }
+});
+Object.defineProperty(exports, "useAutoClearRedux", {
+  enumerable: true,
+  get: function () {
+    return _useAutoClearRedux.useAutoClearRedux;
+  }
+});
+Object.defineProperty(exports, "useImpersonate", {
+  enumerable: true,
+  get: function () {
+    return _useImpersonate.useImpersonate;
+  }
+});
+Object.defineProperty(exports, "useImpersonateHistory", {
+  enumerable: true,
+  get: function () {
+    return _useImpersonateHistory.useImpersonateHistory;
+  }
+});
+Object.defineProperty(exports, "useReactQueryAvailability", {
+  enumerable: true,
+  get: function () {
+    return _useAutoClearReactQuery.useReactQueryAvailability;
+  }
+});
+Object.defineProperty(exports, "useReduxAvailability", {
+  enumerable: true,
+  get: function () {
+    return _useAutoClearRedux.useReduxAvailability;
+  }
+});
+var _useImpersonate = require("./useImpersonate");
+var _useImpersonateHistory = require("./useImpersonateHistory");
+var _useAutoClearReactQuery = require("./useAutoClearReactQuery");
+var _useAutoClearRedux = require("./useAutoClearRedux");
+var _useAutoClearAsyncStorage = require("./useAutoClearAsyncStorage");

package/lib/commonjs/impersonate/hooks/useAutoClearAsyncStorage.js

@@ -0,0 +1,144 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAsyncStorageAvailability = useAsyncStorageAvailability;
+exports.useAutoClearAsyncStorage = useAutoClearAsyncStorage;
+var _react = require("react");
+/**
+ * useAutoClearAsyncStorage Hook
+ *
+ * Auto-detects AsyncStorage and provides a clear function.
+ * Follows the same pattern as useAutoClearReactQuery and useAutoClearRedux.
+ *
+ * This hook:
+ * 1. Dynamically requires @react-native-async-storage/async-storage
+ * 2. Returns a clearStorage function that removes all non-buoy keys
+ *
+ * IMPORTANT: This preserves all @buoy/* keys to avoid clearing our own state.
+ */
+
+// ============================================
+// Types
+// ============================================
+
+// Flag to prevent double-firing (synchronous check)
+let isClearing = false;
+// ============================================
+// Safe Module Loading
+// ============================================
+
+/**
+ * Safely attempt to load @react-native-async-storage/async-storage
+ */
+function getAsyncStorage() {
+  try {
+    // Dynamic require to handle cases where async-storage isn't installed
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    const AsyncStorage = require("@react-native-async-storage/async-storage").default;
+    return AsyncStorage;
+  } catch {
+    // @react-native-async-storage/async-storage not available
+    return null;
+  }
+}
+
+// ============================================
+// Main Hook
+// ============================================
+
+/**
+ * Hook to auto-detect AsyncStorage and provide clearing functionality.
+ *
+ * This clears all keys EXCEPT those starting with @buoy/ to preserve
+ * our own persisted state (impersonation settings, history, etc.).
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { isAvailable, clearStorage } = useAutoClearAsyncStorage();
+ *
+ *   if (isAvailable && clearStorage) {
+ *     // Clear all app data except Buoy state
+ *     await clearStorage();
+ *   }
+ * }
+ * ```
+ */
+function useAutoClearAsyncStorage() {
+  const [asyncStorage, setAsyncStorage] = (0, _react.useState)(null);
+  const [error, setError] = (0, _react.useState)(null);
+
+  // Check for AsyncStorage on mount
+  (0, _react.useEffect)(() => {
+    const storage = getAsyncStorage();
+    if (storage) {
+      setAsyncStorage(storage);
+      setError(null);
+    } else {
+      setError("@react-native-async-storage/async-storage is not installed");
+    }
+  }, []);
+
+  // Create the clearStorage function with guard to prevent double-firing
+  const clearStorage = (0, _react.useCallback)(async () => {
+    // Synchronous guard - set flag immediately before any async work
+    if (isClearing) {
+      return;
+    }
+    isClearing = true;
+    try {
+      if (asyncStorage) {
+        // Get all keys
+        const allKeys = await asyncStorage.getAllKeys();
+
+        // Filter out @buoy/* keys to preserve our own state
+        const keysToRemove = allKeys.filter(key => !key.startsWith("@buoy/") && !key.startsWith("@buoy-"));
+        if (keysToRemove.length > 0) {
+          await asyncStorage.multiRemove([...keysToRemove]);
+        }
+      }
+    } finally {
+      // Reset flag after a short delay to allow next legitimate call
+      setTimeout(() => {
+        isClearing = false;
+      }, 100);
+    }
+  }, [asyncStorage]);
+
+  // Memoize result
+  const result = (0, _react.useMemo)(() => {
+    if (!asyncStorage || error) {
+      return {
+        isAvailable: false,
+        error: error || "@react-native-async-storage/async-storage is not available",
+        clearStorage: null
+      };
+    }
+    return {
+      isAvailable: true,
+      error: null,
+      clearStorage
+    };
+  }, [asyncStorage, error, clearStorage]);
+  return result;
+}
+
+/**
+ * Lightweight check to see if AsyncStorage is available
+ * without creating the clear function
+ */
+function useAsyncStorageAvailability() {
+  const storage = getAsyncStorage();
+  if (!storage) {
+    return {
+      isInstalled: false,
+      error: "@react-native-async-storage/async-storage is not installed"
+    };
+  }
+  return {
+    isInstalled: true,
+    error: null
+  };
+}

package/lib/commonjs/impersonate/hooks/useAutoClearReactQuery.js

@@ -0,0 +1,155 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAutoClearReactQuery = useAutoClearReactQuery;
+exports.useReactQueryAvailability = useReactQueryAvailability;
+var _react = require("react");
+/**
+ * useAutoClearReactQuery Hook
+ *
+ * Auto-detects React Query and provides a clear function.
+ * Uses the same pattern as @buoy-gg/redux's useAutoInstrumentRedux.
+ *
+ * This hook:
+ * 1. Dynamically requires @tanstack/react-query
+ * 2. Uses useQueryClient() to get the client from context
+ * 3. Returns a clearCache function that clears queries + mutations
+ */
+
+// ============================================
+// Types
+// ============================================
+
+// Flag to prevent double-firing (synchronous check)
+let isClearing = false;
+// ============================================
+// Safe Module Loading
+// ============================================
+
+/**
+ * Safely attempt to load @tanstack/react-query and get useQueryClient hook
+ */
+function getReactQueryUseQueryClient() {
+  try {
+    // Dynamic require to handle cases where react-query isn't installed
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    const reactQuery = require("@tanstack/react-query");
+    return reactQuery.useQueryClient;
+  } catch {
+    // @tanstack/react-query not available
+    return null;
+  }
+}
+
+// ============================================
+// Main Hook
+// ============================================
+
+/**
+ * Hook to auto-detect React Query and provide cache clearing functionality.
+ *
+ * This mirrors how the react-query package's QueryBrowserModal.tsx clears cache:
+ * `queryClient.getQueryCache().clear()`
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { isAvailable, clearCache } = useAutoClearReactQuery();
+ *
+ *   if (isAvailable && clearCache) {
+ *     // Can clear React Query cache
+ *     clearCache();
+ *   }
+ * }
+ * ```
+ */
+function useAutoClearReactQuery() {
+  // Check if @tanstack/react-query is available
+  const useQueryClientHook = getReactQueryUseQueryClient();
+  const isReactQueryInstalled = useQueryClientHook !== null;
+
+  // Try to get the query client using react-query's useQueryClient
+  // This must be called unconditionally due to hooks rules
+  let queryClient = null;
+  let clientError = null;
+  if (useQueryClientHook) {
+    try {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      queryClient = useQueryClientHook();
+    } catch (e) {
+      // Not inside a QueryClientProvider or other error
+      clientError = e instanceof Error ? e.message : "Failed to access QueryClient. Make sure your app is wrapped in a QueryClientProvider.";
+    }
+  } else {
+    clientError = "@tanstack/react-query is not installed";
+  }
+
+  // Create the clearCache function with guard to prevent double-firing
+  const clearCache = (0, _react.useCallback)(() => {
+    // Synchronous guard - set flag immediately before any async work
+    if (isClearing) {
+      return;
+    }
+    isClearing = true;
+    if (queryClient) {
+      // Clear both query and mutation caches
+      // This is the same approach used in @buoy-gg/react-query
+      queryClient.getQueryCache().clear();
+      queryClient.getMutationCache().clear();
+    }
+
+    // Reset flag after a short delay to allow next legitimate call
+    setTimeout(() => {
+      isClearing = false;
+    }, 100);
+  }, [queryClient]);
+
+  // Memoize result
+  const result = (0, _react.useMemo)(() => {
+    if (!isReactQueryInstalled || clientError || !queryClient) {
+      return {
+        isAvailable: false,
+        error: clientError,
+        clearCache: null
+      };
+    }
+    return {
+      isAvailable: true,
+      error: null,
+      clearCache
+    };
+  }, [isReactQueryInstalled, clientError, queryClient, clearCache]);
+  return result;
+}
+
+/**
+ * Lightweight hook to just check if React Query is available
+ * without getting the client
+ */
+function useReactQueryAvailability() {
+  const useQueryClientHook = getReactQueryUseQueryClient();
+  if (!useQueryClientHook) {
+    return {
+      isInstalled: false,
+      isConnected: false,
+      error: "@tanstack/react-query is not installed"
+    };
+  }
+  try {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const client = useQueryClientHook();
+    return {
+      isInstalled: true,
+      isConnected: client !== null && client !== undefined,
+      error: null
+    };
+  } catch (e) {
+    return {
+      isInstalled: true,
+      isConnected: false,
+      error: e instanceof Error ? e.message : "Not inside a QueryClientProvider"
+    };
+  }
+}

package/lib/commonjs/impersonate/hooks/useAutoClearRedux.js

@@ -0,0 +1,188 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.REDUX_RESET_ACTION_TYPE = void 0;
+exports.useAutoClearRedux = useAutoClearRedux;
+exports.useReduxAvailability = useReduxAvailability;
+var _react = require("react");
+/**
+ * useAutoClearRedux Hook
+ *
+ * Auto-detects Redux store and provides a reset function.
+ * Uses the same pattern as @buoy-gg/redux's useAutoInstrumentRedux.
+ *
+ * This hook:
+ * 1. Dynamically requires react-redux
+ * 2. Uses useStore() to get the store from context
+ * 3. Returns a resetStore function that dispatches a reset action
+ *
+ * IMPORTANT: Unlike React Query which has a universal .clear() method,
+ * Redux reset requires the app's reducer to handle the reset action.
+ * The default action type is '@@RESET' but can be customized.
+ *
+ * Example reducer handling:
+ * ```typescript
+ * const rootReducer = (state, action) => {
+ *   if (action.type === '@@RESET') {
+ *     return undefined; // Returns to initial state
+ *   }
+ *   return appReducer(state, action);
+ * };
+ * ```
+ */
+
+// ============================================
+// Types
+// ============================================
+
+// Flag to prevent double-firing (synchronous check)
+let isDispatching = false;
+
+/** The default action type dispatched to reset Redux state */
+const REDUX_RESET_ACTION_TYPE = exports.REDUX_RESET_ACTION_TYPE = "@@RESET";
+// ============================================
+// Safe Module Loading
+// ============================================
+
+/**
+ * Safely attempt to load react-redux and get useStore hook
+ */
+function getReactReduxUseStore() {
+  try {
+    // Dynamic require to handle cases where react-redux isn't installed
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    const reactRedux = require("react-redux");
+    return reactRedux.useStore;
+  } catch {
+    // react-redux not available
+    return null;
+  }
+}
+
+// ============================================
+// Main Hook
+// ============================================
+
+/**
+ * Hook to auto-detect Redux store and provide state reset functionality.
+ *
+ * This dispatches a reset action (default: '@@RESET') to the store.
+ * Your app's root reducer must handle this action to actually reset state.
+ *
+ * @example
+ * ```tsx
+ * // In your component:
+ * function MyComponent() {
+ *   const { isAvailable, resetStore } = useAutoClearRedux();
+ *
+ *   if (isAvailable && resetStore) {
+ *     resetStore(); // Dispatches { type: '@@RESET' }
+ *   }
+ * }
+ *
+ * // In your root reducer:
+ * const rootReducer = (state, action) => {
+ *   if (action.type === '@@RESET') {
+ *     // Return undefined to reset to initial state
+ *     // Or return a specific "logged out" state
+ *     return undefined;
+ *   }
+ *   return appReducer(state, action);
+ * };
+ * ```
+ */
+function useAutoClearRedux(options = {}) {
+  const {
+    resetActionType = REDUX_RESET_ACTION_TYPE
+  } = options;
+
+  // Check if react-redux is available
+  const useStoreHook = getReactReduxUseStore();
+  const isReactReduxInstalled = useStoreHook !== null;
+
+  // Try to get the store using react-redux's useStore
+  // This must be called unconditionally due to hooks rules
+  let store = null;
+  let storeError = null;
+  if (useStoreHook) {
+    try {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      store = useStoreHook();
+    } catch (e) {
+      // Not inside a Provider or other error
+      storeError = e instanceof Error ? e.message : "Failed to access Redux store. Make sure your app is wrapped in a Redux Provider.";
+    }
+  } else {
+    storeError = "react-redux is not installed";
+  }
+
+  // Create the resetStore function with guard to prevent double-firing
+  const resetStore = (0, _react.useCallback)(() => {
+    // Synchronous guard - set flag immediately before any async work
+    if (isDispatching) {
+      return;
+    }
+    isDispatching = true;
+    if (store) {
+      // Dispatch the reset action
+      // The app's root reducer must handle this to actually reset state
+      store.dispatch({
+        type: resetActionType
+      });
+    }
+
+    // Reset flag after a short delay to allow next legitimate call
+    setTimeout(() => {
+      isDispatching = false;
+    }, 100);
+  }, [store, resetActionType]);
+
+  // Memoize result
+  const result = (0, _react.useMemo)(() => {
+    if (!isReactReduxInstalled || storeError || !store) {
+      return {
+        isAvailable: false,
+        error: storeError,
+        resetStore: null
+      };
+    }
+    return {
+      isAvailable: true,
+      error: null,
+      resetStore
+    };
+  }, [isReactReduxInstalled, storeError, store, resetStore]);
+  return result;
+}
+
+/**
+ * Lightweight hook to just check if Redux is available
+ * without getting the store
+ */
+function useReduxAvailability() {
+  const useStoreHook = getReactReduxUseStore();
+  if (!useStoreHook) {
+    return {
+      isInstalled: false,
+      isConnected: false,
+      error: "react-redux is not installed"
+    };
+  }
+  try {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const store = useStoreHook();
+    return {
+      isInstalled: true,
+      isConnected: store !== null && store !== undefined,
+      error: null
+    };
+  } catch (e) {
+    return {
+      isInstalled: true,
+      isConnected: false,
+      error: e instanceof Error ? e.message : "Not inside a Redux Provider"
+    };
+  }
+}