feat: create new poll from drafts

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

src/components/NewMessage/NewMessage.vue

@@ -148,6 +148,7 @@
 
 		<!-- Poll creation dialog -->
 		<NewMessagePollEditor v-if="showPollEditor"
+			ref="pollEditor"
 			:token="token"
 			@close="togglePollEditor" />
 
@@ -545,6 +546,7 @@ export default {
 		EventBus.on('upload-discard', this.handleUploadSideEffects)
 		EventBus.on('retry-message', this.handleRetryMessage)
 		EventBus.on('smart-picker-open', this.handleOpenTributeMenu)
+		EventBus.on('poll-editor-open', this.fillPollEditorFromDraft)
 		EventBus.on('poll-drafts-open', this.togglePollDraftHandler)
 
 		if (!this.$store.getters.areFileTemplatesInitialised) {
@@ -558,6 +560,7 @@ export default {
 		EventBus.off('upload-discard', this.handleUploadSideEffects)
 		EventBus.off('retry-message', this.handleRetryMessage)
 		EventBus.off('smart-picker-open', this.handleOpenTributeMenu)
+		EventBus.off('poll-editor-open', this.fillPollEditorFromDraft)
 		EventBus.off('poll-drafts-open', this.togglePollDraftHandler)
 	},
 
@@ -901,6 +904,17 @@ export default {
 			this.showPollEditor = !this.showPollEditor
 		},
 
+		fillPollEditorFromDraft(id) {
+			this.showPollEditor = true
+			this.$nextTick(() => {
+				if (id) {
+					this.$refs.pollEditor?.fillPollEditorFromDraft(id)
+				}
+				// Wait for editor to be mounted and filled before unmounting drafts dialog
+				this.togglePollDraftHandler()
+			})
+		},
+
 		togglePollDraftHandler() {
 			this.showPollDraftHandler = !this.showPollDraftHandler
 		},

src/components/NewMessage/NewMessagePollEditor.vue

@@ -113,6 +113,9 @@ const props = defineProps<{
 const emit = defineEmits<{
 	(event: 'close'): void,
 }>()
+defineExpose({
+	fillPollEditorFromDraft,
+})
 
 const supportPollDrafts = hasTalkFeature(props.token, 'talk-polls-drafts')
 
@@ -180,6 +183,24 @@ async function createPoll() {
 	}
 }
 
+/**
+ * Pre-fills form from the draft
+ * @param id poll draft ID
+ */
+function fillPollEditorFromDraft(id: number) {
+	fillPollForm(pollsStore.drafts[props.token][id])
+}
+
+/**
+ * Insert data into form fields
+ * @param payload data to fill with
+ */
+function fillPollForm(payload: createPollParams) {
+	for (const key of Object.keys(pollForm)) {
+		pollForm[key] = payload[key]
+	}
+}
+
 /**
  * Saves a poll draft for this conversation
  */

src/components/PollViewer/PollDraftHandler.vue

@@ -24,8 +24,14 @@
 				:key="item.id"
 				:token="token"
 				:name="item.question"
-				draft />
+				draft
+				@click="openPollEditor(item.id)" />
 		</div>
+		<template #actions>
+			<NcButton @click="openPollEditor(null)">
+				{{ t('spreed', 'Create new poll') }}
+			</NcButton>
+		</template>
 	</NcDialog>
 </template>
 
@@ -36,13 +42,15 @@ import IconPoll from 'vue-material-design-icons/Poll.vue'
 
 import { t } from '@nextcloud/l10n'
 
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcDialog from '@nextcloud/vue/dist/Components/NcDialog.js'
 
 import EmptyView from '../EmptyView.vue'
 import Poll from '../MessagesList/MessagesGroup/Message/MessagePart/Poll.vue'
 
 import { useStore } from '../../composables/useStore.js'
 import { hasTalkFeature } from '../../services/CapabilitiesManager.ts'
+import { EventBus } from '../../services/EventBus.js'
 import { usePollsStore } from '../../stores/polls.ts'
 
 const props = defineProps<{
@@ -63,6 +71,14 @@ if (supportPollDrafts && isModerator.value) {
 	pollsStore.getPollDrafts(props.token)
 }
 const pollDrafts = computed(() => supportPollDrafts ? pollsStore.getDrafts(props.token) : [])
+
+/**
+ * Opens poll editor pre-filled from the draft
+ * @param id poll draft ID
+ */
+function openPollEditor(id) {
+	EventBus.emit('poll-editor-open', id)
+}
 </script>
 
 <style lang="scss" scoped>