fix: make sure icons in conversatioItem do not shrink

Author: Bilb

stylesheets/_modules.scss

@@ -321,7 +321,7 @@
 
 .module-conversation-list-item__header__name {
   flex-grow: 1;
-  flex-shrink: 1;
+  flex-shrink: 1000; // we need this to take all the shrinking instead of the ListItemIcons
   font-size: 14px;
   line-height: 18px;
 

ts/components/leftpane/conversation-list-item/HeaderItem.tsx

@@ -36,6 +36,7 @@ const NotificationSettingIcon = () => {
           iconType="mute"
           iconColor={'var(--conversation-tab-text-color)'}
           iconSize="small"
+          style={{ flexShrink: 0 }}
         />
       );
     case 'mentions_only':
@@ -44,6 +45,7 @@ const NotificationSettingIcon = () => {
           iconType="bell"
           iconColor={'var(--conversation-tab-text-color)'}
           iconSize="small"
+          style={{ flexShrink: 0 }}
         />
       );
     default:
@@ -63,7 +65,12 @@ const PinIcon = () => {
   const isPinned = useIsPinned(conversationId);
 
   return isPinned ? (
-    <SessionIcon iconType="pin" iconColor={'var(--conversation-tab-text-color)'} iconSize="small" />
+    <SessionIcon
+      iconType="pin"
+      iconColor={'var(--conversation-tab-text-color)'}
+      iconSize="small"
+      style={{ flexShrink: 0 }}
+    />
   ) : null;
 };
 
@@ -100,6 +107,7 @@ const MentionAtSymbol = styled.span`
   min-width: 16px;
   border-radius: 8px;
   cursor: pointer;
+  flex-shrink: 0;
 
   &:hover {
     filter: grayscale(0.7);