From 8e99bca82b0e7ed116ff72b9f49e99d9062f3480 Mon Sep 17 00:00:00 2001
From: Scott Bishel <scott.bishel@mattermost.com>
Date: Thu, 7 Mar 2024 08:01:14 -0700
Subject: [PATCH] MM-56980 add shared channel icon to searchable channel list
 (#26388)

* add shared channel icon to searchable channel list

* update css for shared channel icon

* update, so archive happens first
---
 .../src/components/browse_channels/browse_channels.scss  | 9 +++++++++
 .../channels/src/components/searchable_channel_list.tsx  | 9 +++++++++
 2 files changed, 18 insertions(+)

diff --git a/webapp/channels/src/components/browse_channels/browse_channels.scss b/webapp/channels/src/components/browse_channels/browse_channels.scss
index b6d76c1c76..b4eb5aadf2 100644
--- a/webapp/channels/src/components/browse_channels/browse_channels.scss
+++ b/webapp/channels/src/components/browse_channels/browse_channels.scss
@@ -170,6 +170,15 @@
                         opacity: 1;
                     }
                 }
+
+                .shared-channel-icon {
+                    width: 18px;
+                    height: 18px;
+                    margin-right: 6px;
+                    color: rgba(61, 60, 64, 0.75);
+                    font-size: 18px;
+                    line-height: 18px;
+                }
             }
 
             .more-modal__actions {
diff --git a/webapp/channels/src/components/searchable_channel_list.tsx b/webapp/channels/src/components/searchable_channel_list.tsx
index 6b370f2252..62767ad446 100644
--- a/webapp/channels/src/components/searchable_channel_list.tsx
+++ b/webapp/channels/src/components/searchable_channel_list.tsx
@@ -15,6 +15,7 @@ import MagnifyingGlassSVG from 'components/common/svg_images_components/magnifyi
 import LoadingScreen from 'components/loading_screen';
 import * as Menu from 'components/menu';
 import QuickInput from 'components/quick_input';
+import SharedChannelIndicator from 'components/shared_channel_indicator';
 import CheckboxCheckedIcon from 'components/widgets/icons/checkbox_checked_icon';
 import LoadingWrapper from 'components/widgets/loading/loading_wrapper';
 
@@ -129,6 +130,14 @@ export class SearchableChannelList extends React.PureComponent<Props, State> {
 
         if (isArchivedChannel(channel)) {
             channelTypeIcon = <ArchiveOutlineIcon size={18}/>;
+        } else if (channel.shared) {
+            channelTypeIcon = (
+                <SharedChannelIndicator
+                    className='shared-channel-icon'
+                    channelType={channel.type}
+                    withTooltip={true}
+                />
+            );
         } else if (isPrivateChannel(channel)) {
             channelTypeIcon = <LockOutlineIcon size={18}/>;
         } else {