feat: import and export polls

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

src/components/NewMessage/NewMessagePollEditor.vue

@@ -13,6 +13,18 @@
 			{{ t('spreed', 'Question') }}
 		</p>
 		<NcTextField :value.sync="pollForm.question" :label="t('spreed', 'Ask a question')" v-on="$listeners" />
+		<!--native file picker, hidden -->
+		<input id="poll-upload"
+			ref="pollImport"
+			type="file"
+			class="hidden-visually"
+			@change="importPoll">
+		<NcButton class="poll-editor__button"
+			type="secondary"
+			wide
+			@click="triggerImport">
+			{{ t('spreed', 'Import poll from file') }}
+		</NcButton>
 
 		<!-- Poll options -->
 		<p class="poll-editor__caption">
@@ -58,6 +70,9 @@
 			<NcButton type="tertiary" @click="dismissEditor">
 				{{ t('spreed', 'Dismiss') }}
 			</NcButton>
+			<NcButton type="secondary" :disabled="!isFilled" @click="exportPoll">
+				{{ t('spreed', 'Export') }}
+			</NcButton>
 			<NcButton type="primary" :disabled="!isFilled" @click="createPoll">
 				{{ t('spreed', 'Create poll') }}
 			</NcButton>
@@ -154,6 +169,41 @@ export default {
 			}
 		},
 
+		triggerImport() {
+			this.$refs.pollImport.click()
+		},
+
+		importPoll(event) {
+			if (!event?.target?.files?.[0]) {
+				return
+			}
+
+			const reader = new FileReader()
+			reader.onload = (e) => {
+				try {
+					const jsonObject = JSON.parse(e.target.result)
+					for (const key of Object.keys(this.pollForm)) {
+						this.pollForm[key] = jsonObject[key]
+					}
+				} catch (error) {
+					console.error('Error while parsing JSON:', error)
+				}
+			}
+
+			reader.readAsText(event.target.files[0])
+		},
+
+		exportPoll() {
+			const jsonString = JSON.stringify(this.pollForm, null, 2)
+			const blob = new Blob([jsonString], { type: 'application/json' })
+
+			const link = document.createElement('a')
+			link.href = URL.createObjectURL(blob)
+			link.download = `Talk Poll ${new Date().toISOString().slice(0, 10)}`
+			document.body.appendChild(link)
+			link.click()
+			document.body.removeChild(link)
+		},
 	},
 }
 </script>
@@ -167,6 +217,10 @@ export default {
 		color: var(--color-primary-element);
 	}
 
+	&__button {
+		margin-block: 8px;
+	}
+
 	&__option {
 		display: flex;
 		align-items: flex-end;