feat(ConversationIcon): highlight public conversations

Signed-off-by: Maksim Sukharev <[email protected]>

src/components/ConversationIcon.vue

@@ -49,18 +49,23 @@
 			:menu-container="menuContainer"
 			class="conversation-icon__avatar" />
 		<div v-if="showCall" class="overlap-icon">
-			<VideoIcon :size="20" :fill-color="'#E9322D'" />
+			<VideoIcon :size="20" fill-color="#E9322D" />
 			<span class="hidden-visually">{{ t('spreed', 'Call in progress') }}</span>
 		</div>
 		<div v-else-if="showFavorite" class="overlap-icon">
-			<Star :size="20" :fill-color="'#FFCC00'" />
+			<StarIcon :size="20" fill-color="#FFCC00" />
 			<span class="hidden-visually">{{ t('spreed', 'Favorite') }}</span>
 		</div>
+		<div v-if="!isOneToOne && isPublic" class="overlap-icon overlap-icon--public">
+			<LinkVariantIcon :size="20" />
+			<span class="hidden-visually">{{ t('spreed', 'Public conversation') }}</span>
+		</div>
 	</div>
 </template>
 
 <script>
-import Star from 'vue-material-design-icons/Star.vue'
+import LinkVariantIcon from 'vue-material-design-icons/LinkVariant.vue'
+import StarIcon from 'vue-material-design-icons/Star.vue'
 import VideoIcon from 'vue-material-design-icons/Video.vue'
 
 import { getCapabilities } from '@nextcloud/capabilities'
@@ -78,7 +83,9 @@ export default {
 
 	components: {
 		NcAvatar,
-		Star,
+		// Icons
+		LinkVariantIcon,
+		StarIcon,
 		VideoIcon,
 	},
 
@@ -214,6 +221,10 @@ export default {
 			return this.item.type === CONVERSATION.TYPE.ONE_TO_ONE
 		},
 
+		isPublic() {
+			return this.item.type === CONVERSATION.TYPE.PUBLIC
+		},
+
 		avatarUrl() {
 			if (!supportsAvatar) {
 				return undefined
@@ -256,6 +267,13 @@ export default {
 		line-height: 100%;
 		display: inline-block;
 		vertical-align: middle;
+		filter: drop-shadow(0 0 2px var(--color-main-background));
+
+		&--public {
+			top: auto;
+			bottom: 0;
+			color: var(--color-info);
+		}
 	}
 }