@ethora/chat-component-rn 26.6.13 → 26.7.2

package/src/helpers/ensureScopedChatCache.ts

@@ -3,7 +3,7 @@ import { store } from '../roomStore';
 import { logout } from '../roomStore/chatSettingsSlice';
 import { setLogoutState } from '../roomStore/roomsSlice';
 import { asyncLocalStorage } from '../hooks/useLocalStorage';
-import { localStorageConstants } from './constants/LOCAL_STORAGE';
+import { secureUserStorage } from './secureUserStorage';
 import { clearRoomsRestCache } from '../networking/api-requests/rooms.api';
 import { clearPersistedState } from '../roomStore/persistence';
 import {
@@ -53,7 +53,7 @@ export async function ensureScopedChatCache(config?: IConfig): Promise<void> {
     clearRoomsRestCache();
     store.dispatch(setLogoutState());
     store.dispatch(logout());
-    await asyncLocalStorage(localStorageConstants.ETHORA_USER).remove();
+    await secureUserStorage().remove();
     await clearPersistedState();
   }
 

package/src/helpers/persistCrypto.ts

@@ -0,0 +1,127 @@
+import CryptoJS from 'crypto-js';
+import { secureGet, secureSet } from './secureKeyValue';
+
+// AES-256-CBC at rest for the bulk persisted state (message history +
+// room list) that `roomStore/persistence.ts` writes to AsyncStorage.
+// This is envelope encryption, not a SecureStore write of the payload
+// itself: expo-secure-store has historically capped a single value's
+// size on Android (chunking exists in newer releases, but the payload
+// here is unbounded — up to MESSAGE_LIMIT messages per room, times
+// every room), so only the small symmetric KEY goes through the
+// platform Keychain/Keystore (`secureKeyValue.ts`); the ciphertext
+// itself stays in plain AsyncStorage, unreadable without that key.
+const CIPHER_KEY_STORE_KEY = 'ethora_history_cipher_key';
+const ENVELOPE_VERSION = 1;
+const KEY_BYTES = 32; // AES-256
+const IV_BYTES = 16; // one AES block
+
+interface Envelope {
+  v: number;
+  iv: string; // base64
+  ct: string; // base64 ciphertext
+}
+
+/**
+ * `crypto-js`'s own `WordArray.random()` falls back to `Math.random()`
+ * when it can't detect a browser `window.crypto` — not safe for key/IV
+ * material. `react-native-get-random-values` (a REQUIRED peer
+ * dependency, imported at the top of `main.ts`/`index.js` before
+ * anything else in the SDK runs) polyfills the real thing onto
+ * `global.crypto.getRandomValues` instead; source bytes from that and
+ * hand them to crypto-js as a WordArray rather than trust its default.
+ */
+const randomWordArray = (byteLength: number): CryptoJS.lib.WordArray => {
+  const bytes = new Uint8Array(byteLength);
+  (global as any).crypto.getRandomValues(bytes);
+  const words: number[] = [];
+  for (let i = 0; i < bytes.length; i += 4) {
+    words.push(
+      ((bytes[i] || 0) << 24) |
+        ((bytes[i + 1] || 0) << 16) |
+        ((bytes[i + 2] || 0) << 8) |
+        (bytes[i + 3] || 0)
+    );
+  }
+  return CryptoJS.lib.WordArray.create(words, byteLength);
+};
+
+let cachedKeyPromise: Promise<CryptoJS.lib.WordArray> | null = null;
+
+/**
+ * One AES-256 key per install, generated on first use and persisted
+ * through the SecureStore/Keychain bridge. Reused across logins on
+ * purpose: the ciphertext it protects is deleted wholesale on logout
+ * (`clearPersistedState`), so there is no cross-account data for a
+ * stable key to expose — only the encrypted blob of whoever is
+ * currently logged in ever exists on disk at a given time.
+ */
+const loadOrCreateKey = (): Promise<CryptoJS.lib.WordArray> => {
+  if (cachedKeyPromise) {return cachedKeyPromise;}
+  cachedKeyPromise = (async () => {
+    const existing = await secureGet(CIPHER_KEY_STORE_KEY);
+    if (existing) {
+      return CryptoJS.enc.Base64.parse(existing);
+    }
+    const key = randomWordArray(KEY_BYTES);
+    await secureSet(CIPHER_KEY_STORE_KEY, CryptoJS.enc.Base64.stringify(key));
+    return key;
+  })();
+  return cachedKeyPromise;
+};
+
+/** Encrypt a JSON-serialisable payload for storage. Returns the string to persist. */
+export async function encryptForPersist(plaintext: string): Promise<string> {
+  const key = await loadOrCreateKey();
+  const iv = randomWordArray(IV_BYTES);
+  const encrypted = CryptoJS.AES.encrypt(plaintext, key, {
+    iv,
+    mode: CryptoJS.mode.CBC,
+    padding: CryptoJS.pad.Pkcs7,
+  });
+  const envelope: Envelope = {
+    v: ENVELOPE_VERSION,
+    iv: CryptoJS.enc.Base64.stringify(iv),
+    ct: encrypted.ciphertext.toString(CryptoJS.enc.Base64),
+  };
+  return JSON.stringify(envelope);
+}
+
+/**
+ * Decrypt a value previously written by `encryptForPersist`. Returns
+ * null (never throws) for anything that isn't a valid envelope for the
+ * current key — including a plaintext blob from a pre-encryption
+ * install: the app just re-hydrates that room/history from the server,
+ * same as any other empty-cache cold start.
+ */
+export async function decryptFromPersist(
+  stored: string
+): Promise<string | null> {
+  try {
+    const envelope = JSON.parse(stored) as Partial<Envelope>;
+    if (
+      !envelope ||
+      envelope.v !== ENVELOPE_VERSION ||
+      !envelope.iv ||
+      !envelope.ct
+    ) {
+      return null;
+    }
+    const key = await loadOrCreateKey();
+    const iv = CryptoJS.enc.Base64.parse(envelope.iv);
+    const ciphertext = CryptoJS.enc.Base64.parse(envelope.ct);
+    const decrypted = CryptoJS.AES.decrypt(
+      { ciphertext } as CryptoJS.lib.CipherParams,
+      key,
+      { iv, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 }
+    );
+    const plaintext = decrypted.toString(CryptoJS.enc.Utf8);
+    return plaintext || null;
+  } catch {
+    return null;
+  }
+}
+
+/** Test seam only. */
+export const __resetPersistCryptoKeyForTests = (): void => {
+  cachedKeyPromise = null;
+};

package/src/helpers/pickImageAsset.ts

@@ -0,0 +1,68 @@
+import { Alert, Linking } from 'react-native';
+import * as ImagePicker from 'expo-image-picker';
+
+/**
+ * A picked image in the shape React Native's FormData understands.
+ *
+ * NOT a web `File`: RN streams a multipart part straight from a `file://`
+ * uri and has no usable Blob/File/atob path. Screens ported from the web
+ * client used to carry base64 -> Blob -> File helpers that could never
+ * have run here.
+ */
+export interface PickedImage {
+  uri: string;
+  type: string;
+  name: string;
+}
+
+/**
+ * Ask for library permission, open the picker, and normalise the result.
+ *
+ * Returns `null` for every non-error outcome — permission refused, user
+ * cancelled — so call sites can simply keep their current value.
+ *
+ * Exists because the avatar pickers are wired to `onPress`, which hands
+ * the callback a SyntheticEvent. Storing that event as "the image" (what
+ * two screens used to do) rendered a pooled event as an <Image source>
+ * and then crashed with "Property is not configurable" when React tried
+ * to release it — on top of never letting the user pick anything.
+ */
+export const pickImageAsset = async (): Promise<PickedImage | null> => {
+  try {
+    // expo-image-picker owns the permission prompt internally and
+    // returns a `granted` flag.
+    const perm = await ImagePicker.requestMediaLibraryPermissionsAsync();
+    if (!perm.granted) {
+      Alert.alert(
+        'Permission required',
+        'Photo library permission is needed to select images.',
+        [
+          { text: 'Cancel', style: 'cancel' },
+          { text: 'Open Settings', onPress: () => Linking.openSettings() },
+        ]
+      );
+      return null;
+    }
+
+    const result = await ImagePicker.launchImageLibraryAsync({
+      mediaTypes: ['images'],
+      allowsEditing: true,
+      aspect: [1, 1],
+      quality: 0.8,
+    });
+    if (result.canceled || !result.assets?.[0]) {
+      return null;
+    }
+
+    const asset = result.assets[0];
+    const originalName = asset.fileName || asset.uri.split('/').pop();
+    return {
+      uri: asset.uri,
+      type: asset.mimeType || 'image/jpeg',
+      name: originalName || `image_${Date.now()}.jpg`,
+    };
+  } catch (error) {
+    console.error('Failed to pick an image:', error);
+    return null;
+  }
+};

package/src/helpers/resolveInitBeforeLoadUser.ts

@@ -6,8 +6,7 @@ import { IConfig, User } from '../types/types';
 import { store } from '../roomStore';
 import { setUser } from '../roomStore/chatSettingsSlice';
 import { walletToUsername } from './walletUsername';
-import { asyncLocalStorage } from '../hooks/useLocalStorage';
-import { localStorageConstants } from './constants/LOCAL_STORAGE';
+import { secureUserStorage } from './secureUserStorage';
 
 interface ResolveInitBeforeLoadUserOptions {
   config?: IConfig;
@@ -95,9 +94,7 @@ const readJwtIat = (token?: string | null): number => {
  */
 const adoptFresherPersistedSession = async (candidate: User): Promise<User> => {
   try {
-    const stored = await asyncLocalStorage<User>(
-      localStorageConstants.ETHORA_USER
-    ).get();
+    const stored = await secureUserStorage().get();
     if (!stored) {return candidate;}
 
     const sameUser =
@@ -329,13 +326,13 @@ export const resolveInitBeforeLoadUser = async (
 
   // Priority 5: persisted user in AsyncStorage
   try {
-    const storedUser = await asyncLocalStorage<User>(localStorageConstants.ETHORA_USER).get();
+    const storedUser = await secureUserStorage().get();
     if (storedUser && (storedUser.token || storedUser.refreshToken || storedUser.xmppPassword)) {
       const hydrated = await tryHydrateViaMy(storedUser, myEndpoint, signal).catch(
         () => null
       );
       if (hydrated && hasXmppCredentials(hydrated)) {return hydrated;}
-      await asyncLocalStorage(localStorageConstants.ETHORA_USER).remove();
+      await secureUserStorage().remove();
     }
   } catch {
     // ignore storage errors
@@ -407,9 +404,7 @@ export const refreshUserCredentialsForXmpp = async (
   // should already mirror this, but if the redux state got cleared
   // mid-session (logout race) this gives us one last shot.
   try {
-    const storedUser = await asyncLocalStorage<User>(
-      localStorageConstants.ETHORA_USER
-    ).get();
+    const storedUser = await secureUserStorage().get();
     if (
       storedUser &&
       (storedUser.token || storedUser.refreshToken || storedUser.xmppPassword)

package/src/helpers/secureKeyValue.ts

@@ -0,0 +1,80 @@
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { loadSecureStore } from './secureStoreRuntime';
+import { pushLog } from '../utils/devLogger';
+
+// Fallback keys are prefixed and namespaced away from every other
+// AsyncStorage key this SDK writes, so a host that never installs
+// expo-secure-store can still be told apart from one that used to lack
+// it and has since added it (see `secureSet`'s stale-fallback cleanup).
+const FALLBACK_PREFIX = '@ethora/secure-fallback:';
+
+let warnedFallback = false;
+const warnFallbackOnce = () => {
+  if (warnedFallback) {return;}
+  warnedFallback = true;
+  pushLog(
+    'warn',
+    'expo-secure-store is not installed — auth tokens, the XMPP ' +
+      'password, and the message-history cipher key are falling back ' +
+      'to plain AsyncStorage instead of the platform Keychain/Keystore. ' +
+      'Add the optional peer dependency `expo-secure-store` to your app ' +
+      'to store them securely.'
+  );
+};
+
+/**
+ * Small-value secure KV store: platform Keychain/Keystore via
+ * expo-secure-store when the host has it installed, plain (but still
+ * namespaced) AsyncStorage otherwise. NOT for bulk data — see
+ * `persistCrypto.ts`'s size note on why message history goes through
+ * AES instead of straight into this store.
+ */
+export async function secureGet(key: string): Promise<string | null> {
+  const store = loadSecureStore();
+  if (store) {
+    try {
+      return await store.getItemAsync(key);
+    } catch (e) {
+      pushLog('warn', `secureStore: getItemAsync(${key}) failed`, e);
+      return null;
+    }
+  }
+  warnFallbackOnce();
+  return AsyncStorage.getItem(FALLBACK_PREFIX + key);
+}
+
+export async function secureSet(key: string, value: string): Promise<void> {
+  const store = loadSecureStore();
+  if (store) {
+    try {
+      await store.setItemAsync(key, value);
+      // Clean up a stale plaintext fallback copy from before this host
+      // added expo-secure-store — otherwise it sits on disk forever.
+      AsyncStorage.removeItem(FALLBACK_PREFIX + key).catch(() => undefined);
+      return;
+    } catch (e) {
+      pushLog('warn', `secureStore: setItemAsync(${key}) failed`, e);
+      return;
+    }
+  }
+  warnFallbackOnce();
+  await AsyncStorage.setItem(FALLBACK_PREFIX + key, value);
+}
+
+export async function secureRemove(key: string): Promise<void> {
+  const store = loadSecureStore();
+  if (store) {
+    try {
+      await store.deleteItemAsync(key);
+    } catch {
+      // Key may simply not exist — deleteItemAsync throwing here isn't
+      // actionable either way.
+    }
+  }
+  await AsyncStorage.removeItem(FALLBACK_PREFIX + key).catch(() => undefined);
+}
+
+/** Test seam only. */
+export const __resetSecureKeyValueWarningForTests = (): void => {
+  warnedFallback = false;
+};

package/src/helpers/secureStoreRuntime.ts

@@ -0,0 +1,62 @@
+/**
+ * Optional-dependency bridge for `expo-secure-store` — the Keychain
+ * (iOS) / Keystore-backed EncryptedSharedPreferences (Android) API.
+ *
+ * Mirrors `components/VideoCalls/livekitRuntime.ts`: a plain top-level
+ * `import ... from 'expo-secure-store'` is not allowed anywhere in the
+ * SDK, since Metro resolves imports at bundle time and a host that
+ * hasn't added this optional peer dependency would fail to build over
+ * a feature it never opted into. Everything goes through
+ * `loadSecureStore()`, which requires the module lazily and returns
+ * null when it isn't installed — callers fall back to plain
+ * AsyncStorage rather than crash (see `secureKeyValue.ts`).
+ */
+
+export interface SecureStoreRuntime {
+  getItemAsync: (key: string) => Promise<string | null>;
+  setItemAsync: (key: string, value: string) => Promise<void>;
+  deleteItemAsync: (key: string) => Promise<void>;
+}
+
+let cached: SecureStoreRuntime | null | undefined;
+
+/**
+ * Resolve the SecureStore runtime, or null when the optional native
+ * package isn't installed in the host app. Result is memoised
+ * (including the failure) so a missing dependency doesn't re-throw on
+ * every read/write.
+ */
+export const loadSecureStore = (): SecureStoreRuntime | null => {
+  if (cached !== undefined) {
+    return cached;
+  }
+
+  try {
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    const mod = require('expo-secure-store');
+    if (
+      typeof mod?.getItemAsync !== 'function' ||
+      typeof mod?.setItemAsync !== 'function' ||
+      typeof mod?.deleteItemAsync !== 'function'
+    ) {
+      cached = null;
+    } else {
+      cached = {
+        getItemAsync: mod.getItemAsync,
+        setItemAsync: mod.setItemAsync,
+        deleteItemAsync: mod.deleteItemAsync,
+      };
+    }
+  } catch {
+    cached = null;
+  }
+
+  return cached;
+};
+
+export const isSecureStoreAvailable = (): boolean => loadSecureStore() !== null;
+
+/** Test seam only. */
+export const __resetSecureStoreRuntimeForTests = (): void => {
+  cached = undefined;
+};

package/src/helpers/secureUserStorage.ts

@@ -0,0 +1,80 @@
+import { User } from '../types/types';
+import { asyncLocalStorage } from '../hooks/useLocalStorage';
+import { localStorageConstants } from './constants/LOCAL_STORAGE';
+import { secureGet, secureSet, secureRemove } from './secureKeyValue';
+
+// Keychain (iOS) / Keystore-backed EncryptedSharedPreferences (Android)
+// keys for the four live bearer credentials on `User`. Deliberately one
+// key per field rather than one JSON blob: expo-secure-store historically
+// caps a single value's size on Android, and four short JWTs each stay
+// comfortably under that ceiling where one combined blob might not.
+const SECRET_KEYS = {
+  token: 'ethora_auth_token',
+  refreshToken: 'ethora_auth_refresh_token',
+  xmppPassword: 'ethora_auth_xmpp_password',
+  fileToken: 'ethora_auth_file_token',
+} as const;
+
+type SecretField = keyof typeof SECRET_KEYS;
+const SECRET_FIELDS = Object.keys(SECRET_KEYS) as SecretField[];
+
+/**
+ * Persisted-user storage, split across two backends behind the exact
+ * same `{ get, set, remove }` shape `asyncLocalStorage<User>(...)`
+ * already exposed — every existing call site swaps in by changing only
+ * the constructor call, `get()`/`set()`/`remove()` keep returning/taking
+ * a complete `User`.
+ *
+ * The four live credentials (REST access + refresh token, XMPP
+ * password, secure-media fileToken) never touch plain AsyncStorage:
+ * they go through `secureGet`/`secureSet`/`secureRemove` (platform
+ * Keychain/Keystore, falling back to namespaced AsyncStorage only when
+ * the host hasn't installed the optional `expo-secure-store` peer dep).
+ * Everything else on `User` — name, avatar, ids, xmppUsername, wallet
+ * address, none of it a bearer credential — keeps living under the
+ * existing `ETHORA_USER` AsyncStorage key, unchanged.
+ */
+export function secureUserStorage() {
+  const get = async (): Promise<User | null> => {
+    const profile = await asyncLocalStorage<User>(
+      localStorageConstants.ETHORA_USER
+    ).get();
+    if (!profile) {return null;}
+
+    const secretValues = await Promise.all(
+      SECRET_FIELDS.map((field) => secureGet(SECRET_KEYS[field]))
+    );
+
+    const merged: User = { ...profile };
+    SECRET_FIELDS.forEach((field, i) => {
+      (merged as any)[field] = secretValues[i] || '';
+    });
+    return merged;
+  };
+
+  const set = async (user: User): Promise<void> => {
+    const profile: any = { ...user };
+    for (const field of SECRET_FIELDS) {
+      profile[field] = '';
+    }
+
+    await Promise.all([
+      asyncLocalStorage<User>(localStorageConstants.ETHORA_USER).set(profile),
+      ...SECRET_FIELDS.map((field) => {
+        const value = user?.[field] as string | undefined;
+        return value
+          ? secureSet(SECRET_KEYS[field], value)
+          : secureRemove(SECRET_KEYS[field]);
+      }),
+    ]);
+  };
+
+  const remove = async (): Promise<void> => {
+    await Promise.all([
+      asyncLocalStorage(localStorageConstants.ETHORA_USER).remove(),
+      ...SECRET_FIELDS.map((field) => secureRemove(SECRET_KEYS[field])),
+    ]);
+  };
+
+  return { get, set, remove };
+}

package/src/hooks/useLogout.tsx

@@ -9,7 +9,7 @@ import { clearHeap } from '../roomStore/roomHeapSlice';
 import { pushSubscriptionService } from '../services/pushSubscriptionService';
 import { clearRoomsRestCache } from '../networking/api-requests/rooms.api';
 import { clearPersistedState } from '../roomStore/persistence';
-import { localStorageConstants } from '../helpers/constants/LOCAL_STORAGE';
+import { secureUserStorage } from '../helpers/secureUserStorage';
 
 // AsyncStorage keys the library writes but that aren't cleared by any
 // slice reducer. Listed here so a single logout call wipes the full
@@ -120,17 +120,23 @@ const logoutService = {
 
     // 6. Stray keys the slices don't touch.
     try {
-      await AsyncStorage.multiRemove([
-        ...LIBRARY_STRAY_KEYS,
-        // Belt-and-suspenders: the chat slice's `logout` reducer
-        // schedules an async remove of ETHORA_USER fire-and-forget;
-        // re-issue it here so the disk is provably clean before this
-        // Promise resolves.
-        localStorageConstants.ETHORA_USER,
-      ]);
+      await AsyncStorage.multiRemove(LIBRARY_STRAY_KEYS);
     } catch (e) {
       console.warn('logoutService: stray-key clear failed', e);
     }
+
+    // 7. Belt-and-suspenders: the chat slice's `logout` reducer already
+    //    fires an async ETHORA_USER removal, but re-issue it here (via
+    //    the same secureUserStorage split the reducer uses) so BOTH the
+    //    plain-AsyncStorage profile half AND the Keychain/Keystore
+    //    secrets are provably gone before this Promise resolves — a bare
+    //    `AsyncStorage.removeItem(ETHORA_USER)` here would only clear the
+    //    profile half and leave the tokens behind.
+    try {
+      await secureUserStorage().remove();
+    } catch (e) {
+      console.warn('logoutService: secure user storage clear failed', e);
+    }
   },
 };
 

package/src/main.ts

@@ -32,7 +32,7 @@ export { XmppProvider } from './context/xmppProvider';
 // Hooks that consumers usually need (badge counts, logout, push, etc.).
 export { useUnread } from './hooks/useUnreadMessagesCounter';
 export { useChatRoomFocus } from './hooks/useChatRoomFocus';
-export { logoutService } from './hooks/useLogout';
+export { logoutService, useLogout } from './hooks/useLogout';
 export { useQRCodeChat, handleQRChatId } from './hooks/useQRCodeChatHandler';
 export { resendMessage } from './utils/resendMessage';
 // Font loader, exposed so hosts can also load the font outside <Chat> if needed.

package/src/networking/authRefresh.ts

@@ -1,8 +1,7 @@
 import http from './apiClient';
 import { store } from '../roomStore';
 import { refreshTokens } from '../roomStore/chatSettingsSlice';
-import { asyncLocalStorage } from '../hooks/useLocalStorage';
-import { localStorageConstants } from '../helpers/constants/LOCAL_STORAGE';
+import { secureUserStorage } from '../helpers/secureUserStorage';
 import { pushLog } from '../utils/devLogger';
 import { User } from '../types/types';
 
@@ -163,9 +162,7 @@ const readCurrentRefreshToken = async (): Promise<string> => {
     return fromStore;
   }
 
-  const stored = await asyncLocalStorage<User>(
-    localStorageConstants.ETHORA_USER
-  ).get();
+  const stored = await secureUserStorage().get();
   return stored?.refreshToken || '';
 };
 
@@ -190,7 +187,7 @@ const persistTokens = async (result: RefreshResult): Promise<void> => {
     // Write the post-dispatch snapshot rather than a read-modify-write
     // merge, so this can't race the reducer's own write back to a
     // stale copy of the surrounding user fields.
-    await asyncLocalStorage<User>(localStorageConstants.ETHORA_USER).set(
+    await secureUserStorage().set(
       store.getState().chatSettingStore.user as User
     );
   } catch (error) {
@@ -204,9 +201,7 @@ const persistTokens = async (result: RefreshResult): Promise<void> => {
  * web build and this one stay structurally identical.
  */
 const adoptStoredTokens = async (): Promise<RefreshResult | null> => {
-  const stored = await asyncLocalStorage<User>(
-    localStorageConstants.ETHORA_USER
-  ).get();
+  const stored = await secureUserStorage().get();
   if (!stored?.refreshToken || !stored?.token) {
     return null;
   }

package/src/roomStore/chatSettingsSlice.ts

@@ -11,8 +11,7 @@ import {
 } from '../types/types';
 import { Iso639_1Codes } from '../types/models/language.model';
 import type { TranslateMode } from '../utils/translateModePolicy';
-import { localStorageConstants } from '../helpers/constants/LOCAL_STORAGE';
-import { asyncLocalStorage } from '../hooks/useLocalStorage';
+import { secureUserStorage } from '../helpers/secureUserStorage';
 
 export interface ChatState {
   user: User;
@@ -113,9 +112,7 @@ const initialState: ChatState = {
 const reducers = {
   setUser: (state: WritableDraft<ChatState>, action: PayloadAction<User>) => {
     state.user = unpackAndTransform(action.payload);
-    asyncLocalStorage(localStorageConstants.ETHORA_USER).set(
-      unpackAndTransform(action.payload)
-    );
+    secureUserStorage().set(unpackAndTransform(action.payload));
   },
   updateUser(state: WritableDraft<ChatState>, action: PayloadAction<{ updates: Partial<User> }>) {
     const { updates } = action.payload;
@@ -186,7 +183,7 @@ const reducers = {
     state.client = undefined;
     state.langSource = undefined;
     state.translateMode = undefined;
-    asyncLocalStorage(localStorageConstants.ETHORA_USER).remove();
+    secureUserStorage().remove();
   },
   setLangSource: (
     state: WritableDraft<ChatState>,