@ethora/chat-component-rn 26.5.5 → 26.5.7

package/src/helpers/mimeToExtension.ts

@@ -0,0 +1,135 @@
+// MIME → file extension table for download/preview filename fallbacks.
+// Centralized so FilePreviewModal, MediaMessage, and any future media
+// surface share one source of truth. Keep additions sorted by category.
+
+const MIME_TO_EXT: Record<string, string> = {
+  // images
+  'image/jpeg': '.jpg',
+  'image/jpg': '.jpg',
+  'image/png': '.png',
+  'image/gif': '.gif',
+  'image/webp': '.webp',
+  'image/heic': '.heic',
+  'image/heif': '.heif',
+  'image/bmp': '.bmp',
+  'image/svg+xml': '.svg',
+  'image/tiff': '.tiff',
+
+  // video
+  'video/mp4': '.mp4',
+  'video/quicktime': '.mov',
+  'video/x-m4v': '.m4v',
+  'video/webm': '.webm',
+  'video/3gpp': '.3gp',
+  'video/x-matroska': '.mkv',
+  'video/mpeg': '.mpeg',
+
+  // audio
+  'audio/mpeg': '.mp3',
+  'audio/mp3': '.mp3',
+  'audio/mp4': '.m4a',
+  'audio/x-m4a': '.m4a',
+  'audio/wav': '.wav',
+  'audio/x-wav': '.wav',
+  'audio/aac': '.aac',
+  'audio/ogg': '.ogg',
+  'audio/flac': '.flac',
+  'audio/webm': '.weba',
+
+  // documents
+  'application/pdf': '.pdf',
+  'application/msword': '.doc',
+  'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
+    '.docx',
+  'application/vnd.ms-excel': '.xls',
+  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': '.xlsx',
+  'application/vnd.ms-powerpoint': '.ppt',
+  'application/vnd.openxmlformats-officedocument.presentationml.presentation':
+    '.pptx',
+  'text/plain': '.txt',
+  'text/csv': '.csv',
+  'text/html': '.html',
+  'application/json': '.json',
+  'application/xml': '.xml',
+  'text/xml': '.xml',
+  'application/rtf': '.rtf',
+
+  // archives
+  'application/zip': '.zip',
+  'application/x-rar-compressed': '.rar',
+  'application/x-7z-compressed': '.7z',
+  'application/gzip': '.gz',
+  'application/x-tar': '.tar',
+};
+
+const VALID_EXT_RE = /\.[a-z0-9]{1,8}$/i;
+
+/**
+ * Returns the conventional extension (including the leading dot) for a
+ * MIME type, or `.bin` as a last-resort fallback so callers never end up
+ * with an extension-less filename.
+ */
+export function getExtensionForMime(mime: string | undefined | null): string {
+  if (!mime) {return '.bin';}
+  const normalized = mime.toLowerCase().split(';')[0]!.trim();
+  return MIME_TO_EXT[normalized] || '.bin';
+}
+
+/**
+ * Parses a URL or file path and returns the last segment, URL-decoded,
+ * stripped of query/hash. Returns `''` when nothing usable is present.
+ */
+export function filenameFromUrl(url: string | undefined | null): string {
+  if (!url) {return '';}
+  try {
+    // Strip query + hash without depending on a real URL parser (some RN
+    // URLs from CDNs do not parse cleanly).
+    const noQuery = url.split('?')[0]!.split('#')[0]!;
+    const last = noQuery.split('/').pop() || '';
+    return decodeURIComponent(last);
+  } catch {
+    return '';
+  }
+}
+
+/**
+ * Ensures `fileName` ends with a valid extension. Strategy:
+ *   1. If the input already has an extension, return it unchanged.
+ *   2. Otherwise, derive the extension from `mime` and append it.
+ *   3. If `mime` is unknown, append `.bin`.
+ *
+ * Empty/falsy filenames get a `media_<timestamp>` base before the
+ * extension is appended so callers always get a usable filename.
+ */
+export function ensureFilenameHasExtension(
+  fileName: string | undefined | null,
+  mime: string | undefined | null
+): string {
+  const base =
+    (fileName && fileName.trim()) || `media_${Date.now()}`;
+  if (VALID_EXT_RE.test(base)) {return base;}
+  return `${base}${getExtensionForMime(mime)}`;
+}
+
+/**
+ * Best-effort filename derivation for a message bubble:
+ *   - server-provided `fileName`
+ *   - server-provided `originalName`
+ *   - URL pathname
+ *   - generic `media_<timestamp>` so we never render an empty label
+ *
+ * Always returns a string with a valid extension.
+ */
+export function deriveDisplayFilename(opts: {
+  fileName?: string | null;
+  originalName?: string | null;
+  url?: string | null;
+  mime?: string | null;
+}): string {
+  const candidate =
+    (opts.fileName && opts.fileName.trim()) ||
+    (opts.originalName && opts.originalName.trim()) ||
+    filenameFromUrl(opts.url) ||
+    '';
+  return ensureFilenameHasExtension(candidate, opts.mime);
+}

package/src/helpers/resolveInitBeforeLoadUser.ts

@@ -237,4 +237,83 @@ export const applyResolvedUserToStore = (user?: User | null) => {
   store.dispatch(setUser(user));
 };
 
+/**
+ * Re-mints a User with a fresh xmppPassword for the XMPP credentials-
+ * provider path (bug #17). Unlike `resolveInitBeforeLoadUser` this
+ * ALWAYS hydrates via the chosen auth path even if the cached user
+ * already had xmppCredentials — that's the whole point, the old ones
+ * are stale.
+ *
+ * Selection order:
+ *   1. `jwtLogin` — re-exchange the JWT via `/users/client`.
+ *   2. Anything else (`userLogin` / `customLogin` / store / persisted)
+ *      — `tryHydrateViaMy` on the current user, which calls
+ *      `/users/my` and, on 401, refreshes the access token via
+ *      `/users/login/refresh` and retries.
+ *
+ * Returns `null` only when nothing usable is available — the caller
+ * (xmppProvider) falls back to the cached creds in that case.
+ */
+export const refreshUserCredentialsForXmpp = async (
+  config?: IConfig,
+  signal?: AbortSignal
+): Promise<User | null> => {
+  if (signal?.aborted) {return null;}
+
+  // Priority 1: jwtLogin — same path as `resolveInitBeforeLoadUser`
+  // priority 3. We always re-exchange because the original JWT may
+  // itself have expired (and the consumer is expected to swap
+  // `config.jwtLogin.token` for a fresh one before then).
+  if (config?.jwtLogin?.enabled && config?.jwtLogin?.token) {
+    try {
+      const fresh = await loginViaJwt(config.jwtLogin.token);
+      const normalized = normalizeUserForXmpp(fresh);
+      if (normalized && hasXmppCredentials(normalized)) {return normalized;}
+    } catch (error) {
+      if (signal?.aborted || isAbortError(error)) {return null;}
+      // fall through to /users/my path
+    }
+  }
+
+  const myEndpoint = config?.initBeforeLoadAuth?.myEndpoint || '/users/my';
+
+  // Priority 2: redux store user (covers userLogin + customLogin +
+  // anything previously persisted into chatSettingStore.user). The
+  // user must have at least a refreshToken for the refresh chain to
+  // produce something useful.
+  const currentUser = store.getState().chatSettingStore.user;
+  if (currentUser?.token || currentUser?.refreshToken) {
+    const hydrated = await tryHydrateViaMy(
+      currentUser as User,
+      myEndpoint,
+      signal
+    ).catch(() => null);
+    if (hydrated && hasXmppCredentials(hydrated)) {return hydrated;}
+  }
+
+  // Priority 3: persisted user in AsyncStorage — defensive; the store
+  // 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();
+    if (
+      storedUser &&
+      (storedUser.token || storedUser.refreshToken || storedUser.xmppPassword)
+    ) {
+      const hydrated = await tryHydrateViaMy(
+        storedUser,
+        myEndpoint,
+        signal
+      ).catch(() => null);
+      if (hydrated && hasXmppCredentials(hydrated)) {return hydrated;}
+    }
+  } catch {
+    // ignore storage errors
+  }
+
+  return null;
+};
+
 export default resolveInitBeforeLoadUser;

package/src/hooks/useChatWrapperInit.ts

@@ -119,10 +119,8 @@ const useChatWrapperInit = ({
                 user.xmppUsername || user?.defaultWallet?.walletAddress,
                 user?.xmppPassword,
                 config?.xmppSettings
-              ).then((client) => {
-                console.log(' Client initialized', client?.status);
-                return client;
-              });
+              );
+              console.log(' Client initialized', newClient?.status);
 
               if (roomsList && Object.keys(roomsList).length > 0) {
                 console.log(
@@ -156,27 +154,29 @@ const useChatWrapperInit = ({
                   await newClient.getRoomsStanza();
                 }
               }
-              await newClient
-                .getChatsPrivateStoreRequestStanza()
-                .then(
-                  async (
-                    roomTimestampObject: any
-                  ) => {
-                    console.log(
-                      'Got chats private store',
-                      roomTimestampObject?.length || 0
-                    );
-                    updatedChatLastTimestamps(roomTimestampObject, dispatch);
-                    if (!hasSyncedHistoryRef.current) {
-                      console.log('Updating messages till last');
-                      await updateMessagesTillLast(rooms, newClient);
-                      hasSyncedHistoryRef.current = true;
-                    }
-                    setClient(newClient);
-                    setConnectionLost(false);
-                    console.log('Initialization complete');
-                  }
+              try {
+                const roomTimestampObject: any =
+                  await newClient.getChatsPrivateStoreRequestStanza();
+                console.log(
+                  'Got chats private store',
+                  roomTimestampObject?.length || 0
                 );
+                if (roomTimestampObject) {
+                  updatedChatLastTimestamps(roomTimestampObject, dispatch);
+                }
+                if (!hasSyncedHistoryRef.current) {
+                  console.log('Updating messages till last');
+                  await updateMessagesTillLast(rooms, newClient);
+                  hasSyncedHistoryRef.current = true;
+                }
+                setClient(newClient);
+                setConnectionLost(false);
+                console.log('Initialization complete');
+              } catch (err) {
+                console.warn('privateStore/timestamps failed', err);
+                setClient(newClient);
+                setConnectionLost(false);
+              }
 
               {
                 config?.refreshTokens?.enabled && refresh();
@@ -204,29 +204,34 @@ const useChatWrapperInit = ({
             }
             setInited(true);
             console.log(' Getting chats private store for existing client');
-            await client
-              .getChatsPrivateStoreRequestStanza()
-              .then(
-                async (
-                  roomTimestampObject: any
-                ) => {
-                  console.log(
-                    'Got chats private store for existing client',
-                    roomTimestampObject?.length || 0
-                  );
-                  updatedChatLastTimestamps(roomTimestampObject, dispatch);
-                  if (!hasSyncedHistoryRef.current) {
-                    console.log(
-                      'Updating messages till last for existing client'
-                    );
-                    await updateMessagesTillLast(rooms, client);
-                    hasSyncedHistoryRef.current = true;
-                  }
-                  setClient(client);
-                  setConnectionLost(false);
-                  console.log(' Initialization complete for existing client');
-                }
+            try {
+              const roomTimestampObject: any =
+                await client.getChatsPrivateStoreRequestStanza();
+              console.log(
+                'Got chats private store for existing client',
+                roomTimestampObject?.length || 0
               );
+              if (roomTimestampObject) {
+                updatedChatLastTimestamps(roomTimestampObject, dispatch);
+              }
+              if (!hasSyncedHistoryRef.current) {
+                console.log(
+                  'Updating messages till last for existing client'
+                );
+                await updateMessagesTillLast(rooms, client);
+                hasSyncedHistoryRef.current = true;
+              }
+              setClient(client);
+              setConnectionLost(false);
+              console.log(' Initialization complete for existing client');
+            } catch (err) {
+              console.warn(
+                'privateStore/timestamps failed (existing client)',
+                err
+              );
+              setClient(client);
+              setConnectionLost(false);
+            }
             {
               config?.refreshTokens?.enabled && refresh();
             }

package/src/hooks/useEventHandlers.tsx

@@ -23,10 +23,17 @@ interface MessageEditedEvent {
   user: any;
 }
 
+interface MessageRetryEvent {
+  messageId: string;
+  roomJID: string;
+  messageType: 'text' | 'media';
+}
+
 export interface EventHandlersHook {
   handleMessageSent: (event: MessageSentEvent) => Promise<void>;
   handleMessageFailed: (event: MessageFailedEvent) => void;
   handleMessageEdited: (event: MessageEditedEvent) => void;
+  handleMessageRetry: (event: MessageRetryEvent) => void;
 }
 
 export const useEventHandlers = (config?: IConfig): EventHandlersHook => {
@@ -77,5 +84,21 @@ export const useEventHandlers = (config?: IConfig): EventHandlersHook => {
     [config]
   );
 
-  return { handleMessageSent, handleMessageFailed, handleMessageEdited };
+  const handleMessageRetry = useCallback(
+    (event: MessageRetryEvent) => {
+      try {
+        config?.eventHandlers?.onMessageRetry?.(event);
+      } catch (error) {
+        console.error('Error in message retry handler:', error);
+      }
+    },
+    [config]
+  );
+
+  return {
+    handleMessageSent,
+    handleMessageFailed,
+    handleMessageEdited,
+    handleMessageRetry,
+  };
 };

package/src/hooks/useMessageHeapState.tsx

@@ -3,9 +3,13 @@ import { RootState } from '../roomStore';
 
 export const useMessageHeapState = () => {
   const queue = useSelector(
-    (state: RootState) => state.roomHeapSlice.messageHeap
+    (state: RootState) => state.roomHeapSlice?.messageHeap
+  );
+  const failedMessages = useSelector(
+    (state: RootState) => state.roomHeapSlice?.failedMessages
   );
   const idSet = new Set(queue?.map((m) => m.id) ?? []);
+  const failedIdSet = new Set(Object.keys(failedMessages || {}));
 
-  return { queue, idSet };
+  return { queue, idSet, failedMessages, failedIdSet };
 };

package/src/hooks/useSendMessage.tsx

@@ -3,7 +3,11 @@ import { v4 as uuidv4 } from 'uuid';
 import { useXmppClient } from '../context/xmppProvider';
 import { useDispatch, useSelector } from 'react-redux';
 import { addRoomMessage, setEditAction } from '../roomStore/roomsSlice';
-import { addMessageToHeap } from '../roomStore/roomHeapSlice';
+import {
+  addMessageToHeap,
+  clearMessageFailure,
+  markMessageFailed,
+} from '../roomStore/roomHeapSlice';
 import { uploadFile } from '../networking/api-requests/auth.api';
 import { RootState } from '../roomStore';
 import { useEventHandlers } from './useEventHandlers';
@@ -38,8 +42,13 @@ export const useSendMessage = (_configOverride?: IConfig) => {
     handleMessageSent,
     handleMessageFailed,
     handleMessageEdited,
+    handleMessageRetry,
   } = useEventHandlers(config);
 
+  const failedMessages = useSelector(
+    (state: RootState) => state.roomHeapSlice?.failedMessages || {}
+  );
+
   const sendMessage = useCallback(
     async (
       message: string,
@@ -140,6 +149,17 @@ export const useSendMessage = (_configOverride?: IConfig) => {
           messageType: 'text',
         });
       } catch (error) {
+        dispatch(
+          markMessageFailed({
+            kind: 'text',
+            id: optimisticId,
+            roomJID: activeRoomJID,
+            body: message,
+            isReply,
+            isChecked,
+            mainMessage,
+          })
+        );
         handleMessageFailed({
           message,
           roomJID: activeRoomJID,
@@ -158,11 +178,12 @@ export const useSendMessage = (_configOverride?: IConfig) => {
       activeRoomJID: string,
       isReply: boolean = false,
       isChecked: boolean = false,
-      mainMessage: string = ''
+      mainMessage: string = '',
+      existingId?: string
     ) => {
       client?.onCriticalSend?.(activeRoomJID);
 
-      const id = `send-media-message:${uuidv4()}`;
+      const id = existingId || `send-media-message:${uuidv4()}`;
       const optimisticTimestamp = Date.now();
       const optimisticDate = new Date(optimisticTimestamp).toISOString();
       const selfId =
@@ -171,7 +192,7 @@ export const useSendMessage = (_configOverride?: IConfig) => {
         `${user?.firstName || ''} ${user?.lastName || ''}`.trim() || selfId;
       const fileSizeStr = data?.size != null ? String(data.size) : '';
 
-      if (!config?.disableSentLogic) {
+      if (!config?.disableSentLogic && !existingId) {
         dispatch(
           addRoomMessage({
             roomJID: activeRoomJID,
@@ -290,6 +311,18 @@ export const useSendMessage = (_configOverride?: IConfig) => {
           requestUrl: error?.config?.url,
           axiosMessage: error?.message,
         });
+        dispatch(
+          markMessageFailed({
+            kind: 'media',
+            id,
+            roomJID: activeRoomJID,
+            data,
+            type,
+            isReply,
+            isChecked,
+            mainMessage,
+          })
+        );
         handleMessageFailed({
           message: 'media',
           roomJID: activeRoomJID,
@@ -301,6 +334,43 @@ export const useSendMessage = (_configOverride?: IConfig) => {
     [client, config, user, dispatch, handleMessageSent, handleMessageFailed]
   );
 
+  // Retry a previously-failed send by replaying the saved payload from
+  // the heap. Clears the failure flag first so the bubble flips back to
+  // "sending..."; if the retry fails again `markMessageFailed` re-arms
+  // it. No-op when the id isn't in the failed map.
+  const retryMessage = useCallback(
+    async (failedId: string) => {
+      const payload = failedMessages[failedId];
+      if (!payload) {return;}
+      dispatch(clearMessageFailure(failedId));
+      handleMessageRetry({
+        messageId: failedId,
+        roomJID: payload.roomJID,
+        messageType: payload.kind,
+      });
+      if (payload.kind === 'text') {
+        await sendMessage(
+          payload.body,
+          payload.roomJID,
+          payload.isReply,
+          payload.isChecked,
+          payload.mainMessage
+        );
+      } else {
+        await sendMedia(
+          payload.data,
+          payload.type,
+          payload.roomJID,
+          payload.isReply,
+          payload.isChecked,
+          payload.mainMessage,
+          failedId
+        );
+      }
+    },
+    [failedMessages, dispatch, handleMessageRetry, sendMessage, sendMedia]
+  );
+
   // ChatRoom/ThreadWrapper consume this as the "edit branch" of send.
   // It mirrors the edit path inside `sendMessage` so callers can wire it
   // up directly when `editAction.isEdit` is true.
@@ -355,6 +425,7 @@ export const useSendMessage = (_configOverride?: IConfig) => {
     sendMessage,
     sendMedia,
     sendEditMessage,
+    retryMessage,
     isLastMessageFromUserAndProcessing,
   };
 };

package/src/networking/api-requests/auth.api.ts

@@ -134,7 +134,11 @@ export function uploadFile(formData: FormData) {
     headers: {
       Authorization: token,
       Accept: '*/*',
-      'Content-Type': 'multipart/form-data',
+      'Content-Type': null,
+    },
+    transformRequest: (data: any, headers: any) => {
+      if (headers?.delete) {headers.delete('Content-Type');}
+      return data;
     },
   });
 }