inbox items avatar clickable

daostack · Oct 30, 2023 · f26214e · f26214e
1 parent 5c3a84c
commit f26214e
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 10 deletions.
diff --git a/src/pages/common/components/FeedItem/context.ts b/src/pages/common/components/FeedItem/context.ts
@@ -42,6 +42,7 @@ export interface FeedItemBaseContentProps {
   hasImages?: boolean;
   isLoading?: boolean;
   shouldHideBottomContent?: boolean;
+  dmUserId?: string;
 }
 
 export interface GetLastMessageOptions {

diff --git a/src/pages/commonFeed/components/FeedLayout/FeedLayout.tsx b/src/pages/commonFeed/components/FeedLayout/FeedLayout.tsx
@@ -63,7 +63,6 @@ import {
 import { InfiniteScroll, TextEditorValue } from "@/shared/ui-kit";
 import {
   addQueryParam,
-  checkIsProject,
   deleteQueryParam,
   getParamsFromOneOfRoutes,
   getUserName,

diff --git a/src/pages/inbox/components/ChatChannelItem/ChatChannelItem.tsx b/src/pages/inbox/components/ChatChannelItem/ChatChannelItem.tsx
@@ -129,6 +129,7 @@ export const ChatChannelItem: FC<ChatChannelFeedLayoutItemProps> = (props) => {
       ownerId={userId}
       renderImage={renderImage}
       isImageRounded
+      dmUserId={dmUserId}
     />
   );
 };
diff --git a/src/pages/inbox/components/FeedItemBaseContent/FeedItemBaseContent.tsx b/src/pages/inbox/components/FeedItemBaseContent/FeedItemBaseContent.tsx
@@ -1,7 +1,11 @@
 import React, { FC, MouseEventHandler, useRef, useState } from "react";
 import classNames from "classnames";
 import { useLongPress } from "use-long-press";
-import { FeedCardTags, FeedItemBaseContentProps } from "@/pages/common";
+import {
+  FeedCardTags,
+  FeedItemBaseContentProps,
+  useFeedItemContext,
+} from "@/pages/common";
 import { PredefinedTypes } from "@/shared/models";
 import {
   ContextMenu,
@@ -36,10 +40,12 @@ export const FeedItemBaseContent: FC<FeedItemBaseContentProps> = (props) => {
     isImageRounded,
     isProject,
     discussionPredefinedType,
+    dmUserId,
   } = props;
   const contextMenuRef = useRef<ContextMenuRef>(null);
   const [isLongPressing, setIsLongPressing] = useState(false);
   const [isLongPressed, setIsLongPressed] = useState(false);
+  const { onUserSelect } = useFeedItemContext();
   const isContextMenuEnabled = Boolean(menuItems && menuItems.length > 0);
   const finalTitle =
     discussionPredefinedType === PredefinedTypes.General && commonName
@@ -97,6 +103,12 @@ export const FeedItemBaseContent: FC<FeedItemBaseContentProps> = (props) => {
     }
   };
 
+  const handleAvatarClick = () => {
+    if (onUserSelect && dmUserId) {
+      onUserSelect(dmUserId);
+    }
+  };
+
   return (
     <div
       className={classNames(styles.container, {
@@ -108,14 +120,16 @@ export const FeedItemBaseContent: FC<FeedItemBaseContentProps> = (props) => {
       onContextMenu={handleContextMenu}
       {...getLongPressProps()}
     >
-      {renderImage?.(imageClassName) || (
-        <CommonAvatar
-          name={commonName}
-          src={image}
-          className={imageClassName}
-          alt={imageAlt}
-        />
-      )}
+      <div onClick={handleAvatarClick}>
+        {renderImage?.(imageClassName) || (
+          <CommonAvatar
+            name={commonName}
+            src={image}
+            className={imageClassName}
+            alt={imageAlt}
+          />
+        )}
+      </div>
       <div className={styles.content}>
         <div className={styles.topContent}>
           <p