[web/native] Prevent text/multimedia from being pinned if they begin …

…a sidebar

Summary:
In the same way we handle reactions, we should prevent users from pinning messages (specifically text/multimedia) within a sidebar if they are the first message in the sidebar. We'll still allow other messages to be pinned in the sidebar.

Resolves https://linear.app/comm/issue/ENG-4847/not-possible-to-pin-the-source-messge

Depends on D9543

Test Plan: Confirmed that pinning messages in both a top-level thread and a sidebar still work as expected, and confirmed that the pin option doesn't appear for the first message in a sidebar on both `web` and `native`

Reviewers: atul, ginsu

Reviewed By: atul

Subscribers: ashoat, tomek, wyilio

Differential Revision: https://phab.comm.dev/D9544

native/chat/multimedia-message.react.js

@@ -242,10 +242,11 @@ const ConnectedMultimediaMessage: React.ComponentType<BaseProps> =
       props.item.threadInfo,
       props.item.messageInfo,
     );
-    const canTogglePins = threadHasPermission(
-      props.item.threadInfo,
-      threadPermissions.MANAGE_PINS,
-    );
+    const canTogglePins =
+      threadHasPermission(
+        props.item.threadInfo,
+        threadPermissions.MANAGE_PINS,
+      ) && props.item.threadInfo.sourceMessageID !== props.item.messageInfo.id;
 
     return (
       <MultimediaMessage

native/chat/text-message.react.js

@@ -291,10 +291,11 @@ const ConnectedTextMessage: React.ComponentType<BaseProps> =
       useCanEditMessageNative(props.item.threadInfo, props.item.messageInfo) &&
       !isThisMessageEdited;
 
-    const canTogglePins = threadHasPermission(
-      props.item.threadInfo,
-      threadPermissions.MANAGE_PINS,
-    );
+    const canTogglePins =
+      threadHasPermission(
+        props.item.threadInfo,
+        threadPermissions.MANAGE_PINS,
+      ) && props.item.threadInfo.sourceMessageID !== props.item.messageInfo.id;
 
     React.useEffect(() => clearMarkdownContextData, [clearMarkdownContextData]);
 

web/utils/tooltip-action-utils.js

@@ -276,7 +276,8 @@ function useMessageTogglePinAction(
 
   const canTogglePin =
     !isInvalidPinSource(messageInfo) &&
-    threadHasPermission(threadInfo, threadPermissions.MANAGE_PINS);
+    threadHasPermission(threadInfo, threadPermissions.MANAGE_PINS) &&
+    threadInfo.sourceMessageID !== item.messageInfo.id;
 
   const inputState = React.useContext(InputStateContext);