fix(chat-message): update extractMentionsFromBody with optional chain…

…ing for matches to prevent unwanted error (#2432)

* fix(chat-message): update extractMentionsFromBody with optional chaining for matches to prevent unwanted error

* refactor: fix issue

src/components/notifications-feed/index.tsx

@@ -87,7 +87,8 @@ export class Container extends React.Component<Properties> {
   }
 
   renderError() {
-    return <div className={styles.Error}>{'this.props.error'}</div>;
+    const { error } = this.props;
+    return error ? <div className={styles.Error}>{error}</div> : null;
   }
 
   render() {
@@ -103,9 +104,9 @@ export class Container extends React.Component<Properties> {
           <div className={styles.Body}>
             <ol className={styles.Notifications}>{notifications.length > 0 && this.renderNotifications()}</ol>
 
-            {notifications.length === 0 && !loading && this.renderNoNotifications()}
+            {notifications.length === 0 && !loading && !error && this.renderNoNotifications()}
             {loading && this.renderLoading()}
-            {error && !loading && this.renderError()}
+            {error && this.renderError()}
           </div>
         </div>
       </div>

src/lib/chat/matrix/chat-message.ts

@@ -154,8 +154,8 @@ export async function mapEventToNotification(event) {
     },
   };
 
-  if (type === 'm.room.message') {
-    const mentions = extractMentionsFromBody(content.body);
+  if (type === 'm.room.message' && content?.body) {
+    const mentions = content.body ? extractMentionsFromBody(content.body) : [];
     if (mentions.length > 0) {
       return {
         ...baseNotification,
@@ -210,7 +210,7 @@ export async function mapEventToNotification(event) {
 
 function extractMentionsFromBody(body: string) {
   const mentionRegex = /@\[.*?\]\(user:(.*?)\)/g;
-  const matches = [...body.matchAll(mentionRegex)];
+  const matches = [...body?.matchAll(mentionRegex)];
   return matches.map((match) => match[1]);
 }
 

src/store/notifications/saga.ts

@@ -14,6 +14,7 @@ export function* fetchNotifications() {
 
     yield put(setNotifications(notificationsWithSenders));
   } catch (error: any) {
+    console.error('Error fetching notifications:', error);
     yield put(setError(error.message));
   } finally {
     yield put(setLoading(false));