(slot) add rooms-header named slot

Author: antoine92190

README.md

@@ -436,6 +436,12 @@ messageActionHandler({ roomId, action }) {
 
 (5) `replyMessage` object is available when the user replied to another message by clicking the corresponding icon, and contains the message information that was clicked
 
+## Named Slots
+
+| Slot         | Action                                                     |
+| ------------ | ---------------------------------------------------------- |
+| rooms-header | Add a template on top of rooms list (above the search bar) |
+
 ## Using with Firestore
 
 ### Source code

demo/src/ChatContainer.vue

@@ -65,7 +65,8 @@
 			@messageActionHandler="messageActionHandler"
 			@sendMessageReaction="sendMessageReaction"
 			@typingMessage="typingMessage"
-		/>
+		>
+		</chat-window>
 	</div>
 </template>
 

src/ChatWindow/ChatWindow.vue

@@ -14,7 +14,11 @@
 				@fetchRoom="fetchRoom"
 				@addRoom="addRoom"
 			>
+				<template v-slot:rooms-header>
+					<slot name="rooms-header"></slot>
+				</template>
 			</rooms-list>
+
 			<room
 				:currentUserId="currentUserId"
 				:rooms="rooms"

src/ChatWindow/RoomsList.vue

@@ -4,6 +4,8 @@
 		:class="{ 'rooms-container-full': isMobile }"
 		v-if="showRoomsList"
 	>
+		<slot name="rooms-header"></slot>
+
 		<div class="box-search">
 			<div class="icon-search">
 				<svg-icon name="search" />