@ethora/chat-component-rn 26.5.21 → 26.6.11

package/src/hooks/useMessageTranslation.ts

@@ -0,0 +1,70 @@
+import { IMessage } from '../types/types';
+import { toBaseLanguage } from '../i18n/strings';
+
+export interface MessageTranslationState {
+  /** False when the message is already in the reader's language, or no
+   * translation is available — render the plain body, no quote. */
+  hasTranslation: boolean;
+  originalText: string;
+  /** Translation when hasTranslation, else the original — always safe to
+   * render directly. */
+  displayText: string;
+}
+
+// "42", "+1 (555) 123-4567", "3.14159" — text with no actual letters has
+// nothing to translate.
+const hasNoLetters = (text: string): boolean => !/\p{L}/u.test(text);
+
+/**
+ * Translation for ONE message, into the reader's language only. Ported
+ * verbatim from the web SDK (src/hooks/useMessageTranslation.ts).
+ *
+ * Pure and synchronous — no HTTP call. Every translation this client ever
+ * shows arrives over XMPP already: the sender tags outgoing messages with
+ * `<translate source="xx"/>` (see sendTextMessageWithTranslateTag) and
+ * whatever process attaches actual translations does so server-side,
+ * landing on `message.translations` when the stanza is parsed (see
+ * getDataFromXml). This function only ever reads that — it never calls a
+ * translation service itself, so there's nothing to fail when one isn't
+ * reachable, and nothing to await.
+ */
+export const useMessageTranslation = (
+  message: Pick<IMessage, 'body' | 'langSource' | 'translations'>,
+  readerLocale?: string,
+  enabled = true
+): MessageTranslationState => {
+  const originalText = message?.body || '';
+  const source = message?.langSource;
+  const targetBase = toBaseLanguage(readerLocale || 'en');
+  const sourceBase = toBaseLanguage(source);
+
+  // Nothing to do when we don't know the source language, the message is
+  // already in the reader's language (region ignored: en-US vs en-CA is the
+  // same language, not a translation job), or there's no actual text to
+  // translate (a bare number, a phone number, an emoji-only reaction).
+  const trimmedText = originalText.trim();
+  const needsTranslation =
+    enabled &&
+    !!trimmedText &&
+    !!source &&
+    sourceBase !== targetBase &&
+    !hasNoLetters(trimmedText);
+
+  const result = needsTranslation
+    ? message?.translations?.[readerLocale || '']?.translatedText ||
+      message?.translations?.[targetBase]?.translatedText
+    : undefined;
+
+  // A "translation" that's byte-identical to the original (mistagged
+  // langSource, a no-op from the source, matching proper nouns/numbers in
+  // otherwise-different text) is worse than nothing: it renders the same
+  // sentence twice. Treat identical-after-trim as "nothing to show".
+  const isRealTranslation =
+    !!result && result.trim() !== originalText.trim();
+
+  return {
+    hasTranslation: isRealTranslation,
+    originalText,
+    displayText: isRealTranslation ? (result as string) : originalText,
+  };
+};

package/src/hooks/usePushNotifications.ts

@@ -10,7 +10,8 @@ import { pushSubscriptionService } from '../services/pushSubscriptionService';
 import { useSelector, useDispatch } from 'react-redux';
 import { RootState } from '../roomStore';
 import { useLocalStorage } from './useLocalStorage';
-import { setCurrentRoom, setPendingNotificationJid } from '../roomStore/roomsSlice';
+import { setPendingNotificationJid } from '../roomStore/roomsSlice';
+import { handleCallPush } from '../helpers/incomingCallFromPush';
 
 export function usePushNotifications() {
   const [fcmToken, setFcmToken] = useState<string | null>(null);
@@ -22,7 +23,11 @@ export function usePushNotifications() {
   const { set, get } = useLocalStorage('fcmToken');
 
   const handleNotificationPress = (remoteMessage: any) => {
-    console.log('[usePushNotifications] Notification pressed:', JSON.stringify(remoteMessage, null, 2));
+    // Tapping a call notification (or launching the app from one) should
+    // land on the ring screen, not on the chat room.
+    if (handleCallPush(remoteMessage?.data)) {
+      return;
+    }
 
     const jid = remoteMessage?.data?.jid || remoteMessage?.data?.chatJid || remoteMessage?.jid;
 
@@ -60,9 +65,16 @@ export function usePushNotifications() {
     );
 
     const unsubscribeForeground = onForegroundMessage((message) => {
+      // Calls first: a call push must open the ring screen, never an
+      // "OK / Open" alert. handleCallPush returns true for anything
+      // call-shaped, so we bail before the chat-notification path.
+      if (handleCallPush(message?.data)) {
+        return;
+      }
+
       setNotification(message);
 
-      const { notification: notif, data } = message;
+      const { notification: notif } = message;
       if (notif) {
         Alert.alert(
           notif.title || 'Notification',

package/src/hooks/useSendMessage.tsx

@@ -9,7 +9,7 @@ import {
   clearMessageFailure,
   markMessageFailed,
 } from '../roomStore/roomHeapSlice';
-import { uploadFileViaFetch } from '../networking/api-requests/auth.api';
+import { uploadFileMultipart } from '../networking/api-requests/auth.api';
 import { enqueueOutboundSend } from '../networking/outboundQueue';
 import { RootState, store } from '../roomStore';
 import { getGlobalXmppClient } from '../utils/clientRegistry';
@@ -70,6 +70,14 @@ export const useSendMessage = (_configOverride?: IConfig) => {
   const config = useSelector(
     (state: RootState) => state.chatSettingStore.config
   );
+  // The sender's own language, driven by the header globe picker (or the
+  // host via config.translates.readerLocale). Declared on every outgoing
+  // message as `<translate source>` so the backend can translate it for
+  // readers in other languages (see sendTextMessageWithTranslateTagStanza).
+  // Mirrors the web SDK, which always sends through the translate-tag path.
+  const langSource = useSelector(
+    (state: RootState) => state.chatSettingStore.langSource
+  );
   const editAction = useSelector((state: RootState) => state.rooms.editAction);
   const rooms = useSelector((state: RootState) => state.rooms.rooms);
 
@@ -150,6 +158,10 @@ export const useSendMessage = (_configOverride?: IConfig) => {
         date: optimisticDate,
         pending: true,
         isDeleted: false,
+        // Declare the sender's language on their own optimistic bubble so
+        // manual-mode readers see the Translate link on it too (parity with
+        // the web SDK, which stamps langSource on the optimistic message).
+        langSource: (langSource as any) || 'en',
         user: {
           ...(user as any),
           id: selfId,
@@ -208,7 +220,7 @@ export const useSendMessage = (_configOverride?: IConfig) => {
         // reducer's dedupe matches and the bubble flips pending → delivered
         // in-place (rather than rendering a second copy).
         const replaySend = (c: any) =>
-          c.sendMessage(
+          c.sendTextMessageWithTranslateTagStanza(
             activeRoomJID,
             user.firstName,
             user.lastName,
@@ -219,6 +231,7 @@ export const useSendMessage = (_configOverride?: IConfig) => {
             isReply || false,
             isChecked || false,
             mainMessage || '',
+            (langSource as any) || 'en',
             optimisticId
           );
 
@@ -291,7 +304,7 @@ export const useSendMessage = (_configOverride?: IConfig) => {
         });
       }
     },
-    [editAction, client, user, dispatch, handleMessageSent, handleMessageEdited, handleMessageFailed, reduxStore]
+    [editAction, client, user, langSource, dispatch, handleMessageSent, handleMessageEdited, handleMessageFailed, reduxStore]
   );
 
   const sendMedia = useCallback(
@@ -466,7 +479,7 @@ export const useSendMessage = (_configOverride?: IConfig) => {
         const fd = new FormData();
         fd.append('files', fileBlob as any);
         try {
-          return await uploadFileViaFetch(fd);
+          return await uploadFileMultipart(fd);
         } catch (err: any) {
           if (err?.response?.status === 500) {
             console.warn(
@@ -475,7 +488,7 @@ export const useSendMessage = (_configOverride?: IConfig) => {
             );
             const fd2 = new FormData();
             fd2.append('file', fileBlob as any);
-            return await uploadFileViaFetch(fd2);
+            return await uploadFileMultipart(fd2);
           }
           throw err;
         }