fixup! feat:select existing talk roomfor convesations

Signed-off-by: greta <[email protected]>

src/components/Editor/AddTalkModal.vue

@@ -5,17 +5,23 @@
 		@open="fetchTalkConversations">
 		<div class="modal-content">
 			<h2>{{ t('calendar', 'Select a talk room from the list') }}</h2>
-			<ul>
-				<li v-for="conversation in talkConversations" :key="conversation.id">
-					<NcButton @click="selectConversation(conversation)">
-						{{ t('calendar', 'Select') }}
-					</NcButton>
-				</li>
-			</ul>
-			<h2>{{ t('calendar', 'Create a new talk room') }}</h2>
-			<NcButton @click="createTalkRoom">
-				{{ t('calendar', 'Create a new talk room') }}
-			</NcButton>
+			<div class="talk-room-list">
+				<ul>
+					<li v-for="conversation in talkConversations" :key="conversation.id">
+						<NcButton @click="selectConversation(conversation)">
+							{{ t('calendar', 'Select') }}
+						</NcButton>
+					</li>
+				</ul>
+			</div>
+			<div class="sticky-footer">
+				<NcButton @click="createTalkRoom">
+					<template #icon>
+						<IconAdd :size="20" />
+					</template>
+					{{ t('calendar', 'Create a new conversation') }}
+				</NcButton>
+			</div>
 		</div>
 	</NcModal>
 </template>
@@ -29,12 +35,17 @@ import axios from '@nextcloud/axios'
 import { createTalkRoom } from '../../services/talkService.js'
 import { showError, showSuccess } from '@nextcloud/dialogs'
 import { generateOcsUrl } from '@nextcloud/router'
+import IconAdd from 'vue-material-design-icons/Plus.vue'
+import useCalendarObjectInstanceStore from '../../store/calendarObjects.js'
+import { mapStores } from 'pinia';
+
 
 export default {
 	name: 'AddTalkModal',
 	components: {
 		NcButton,
 		NcModal,
+		IconAdd,
 	},
 	props: {
 		calendarObjectInstance: {
@@ -53,12 +64,16 @@ export default {
 			creatingTalkRoom: false,
 		}
 	},
+	computed: {
+		...mapStores(useCalendarObjectInstanceStore),
+
+	},
 	methods: {
 		async fetchTalkConversations() {
 			try {
 				const response = await axios.get(generateOcsUrl('apps/spreed/api/v1/room'))
 				this.talkConversations = response.data.ocs.data.filter(conversation =>
-					conversation.joinable || conversation.is_moderator,
+					conversation.joinable
 				)
 			} catch (error) {
 				console.error('Error fetching Talk conversations:', error)
@@ -113,5 +128,24 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="css" scoped>
+.talk-room-list {
+	flex: 1;
+	overflow-y: auto;
+	padding-bottom: 16px;
+}
+
+.sticky-footer {
+	position: sticky;
+	bottom: 0;
+	padding: 16px;
+	text-align: right;
+}
+h2 {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	text-align: center;
+	height: 30px;
+}
 </style>

src/views/EditSidebar.vue

@@ -91,10 +91,14 @@
 					@update:value="updateLocation" />
 				<AddTalkModal v-if="isModalOpen"
 					:conversations="talkConversations"
+					:calendar-object-instance="calendarObjectInstance"
 					@close="closeModal" />
 				<NcButton :disabled="isCreateTalkRoomButtonDisabled"
 					class="add-talk-button"
 					@click="openModal">
+					<template #icon>
+						<IconCheck :size="16" />
+					</template>
 					{{ t('calendar','Add Talk') }}
 				</NcButton>
 			</div>
@@ -326,6 +330,7 @@ import { mapStores, mapState } from 'pinia'
 import AddTalkModal from '../components/Editor/AddTalkModal.vue'
 import { createTalkRoom, doesContainTalkLink } from '../services/talkService.js'
 import { showError, showSuccess } from '@nextcloud/dialogs'
+import IconCheck from 'vue-material-design-icons/Check.vue'
 
 export default {
 	name: 'EditSidebar',
@@ -361,6 +366,7 @@ export default {
 		AttachmentsList,
 		CalendarPickerHeader,
 		PropertyTitle,
+		IconCheck,
 	},
 	mixins: [
 		EditorMixin,
@@ -761,13 +767,13 @@ export default {
 	display: flex;
 	align-items: center;
 	gap: 4px;
+	width: 100%;
 }
 .add-talk-button {
 	flex-shrink: 0;
 }
 .property-location {
 	margin-top: 10px;
-	margin-left: -43px;
 	flex-grow: 1;
 }
 .property-description {