From f120568723e45b2571e1c99273b1b7540145353a Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Fri, 18 Oct 2024 18:11:04 +0200
Subject: [PATCH] feat: allow owners and moderators to export poll to JSON file

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 .../NewMessage/NewMessagePollEditor.vue       | 13 ++++++
 src/components/PollViewer/PollViewer.vue      | 44 +++++++++++++++----
 src/utils/fileDownload.ts                     | 30 +++++++++++++
 3 files changed, 79 insertions(+), 8 deletions(-)
 create mode 100644 src/utils/fileDownload.ts

diff --git a/src/components/NewMessage/NewMessagePollEditor.vue b/src/components/NewMessage/NewMessagePollEditor.vue
index 2275c620425..e7e63d45613 100644
--- a/src/components/NewMessage/NewMessagePollEditor.vue
+++ b/src/components/NewMessage/NewMessagePollEditor.vue
@@ -94,6 +94,12 @@
 					</template>
 					{{ t('spreed', 'Save as draft') }}
 				</NcActionButton>
+				<NcActionLink :href="exportPollURI" :download="exportPollFileName">
+					<template #icon>
+						<IconFileDownload :size="20" />
+					</template>
+					{{ t('spreed', 'Export draft to file') }}
+				</NcActionLink>
 			</NcActions>
 			<NcButton type="primary" :disabled="!isFilled" @click="createPoll">
 				{{ t('spreed', 'Create poll') }}
@@ -107,6 +113,7 @@ import { computed, nextTick, reactive, ref } from 'vue'
 
 import IconArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'
 import Close from 'vue-material-design-icons/Close.vue'
+import IconFileDownload from 'vue-material-design-icons/FileDownload.vue'
 import IconFileEdit from 'vue-material-design-icons/FileEdit.vue'
 import IconFileUpload from 'vue-material-design-icons/FileUpload.vue'
 import Plus from 'vue-material-design-icons/Plus.vue'
@@ -115,6 +122,7 @@ import { showError } from '@nextcloud/dialogs'
 import { t } from '@nextcloud/l10n'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink.js'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
@@ -127,6 +135,7 @@ import { hasTalkFeature } from '../../services/CapabilitiesManager.ts'
 import { EventBus } from '../../services/EventBus.js'
 import { usePollsStore } from '../../stores/polls.ts'
 import type { createPollParams } from '../../types/index.ts'
+import { convertToJSONDataURI } from '../../utils/fileDownload.ts'
 import { validatePollForm } from '../../utils/validatePollForm.ts'
 
 const props = defineProps<{
@@ -176,6 +185,10 @@ const isMultipleAnswer = computed({
 })
 
 const isModerator = computed(() => (store.getters as unknown).isModerator)
+
+const exportPollURI = computed(() => convertToJSONDataURI(pollForm))
+const exportPollFileName = `Talk Poll ${new Date().toISOString().slice(0, 10)}`
+
 /**
  * Remove a previously added option
  * @param index option index
diff --git a/src/components/PollViewer/PollViewer.vue b/src/components/PollViewer/PollViewer.vue
index a9db98079e7..d11db55e553 100644
--- a/src/components/PollViewer/PollViewer.vue
+++ b/src/components/PollViewer/PollViewer.vue
@@ -78,6 +78,12 @@
 						</template>
 						{{ t('spreed', 'Save as draft') }}
 					</NcActionButton>
+					<NcActionLink v-if="supportPollDrafts" :href="exportPollURI" :download="exportPollFileName">
+						<template #icon>
+							<IconFileDownload :size="20" />
+						</template>
+						{{ t('spreed', 'Export draft to file') }}
+					</NcActionLink>
 					<NcActionButton class="critical" @click="endPoll">
 						{{ t('spreed', 'End poll') }}
 						<template #icon>
@@ -86,13 +92,21 @@
 					</NcActionButton>
 				</NcActions>
 			</div>
-			<div v-else-if="supportPollDrafts && isModerator" class="poll-modal__actions">
-				<NcButton type="tertiary" @click="createPollDraft">
-					<template #icon>
-						<IconFileEdit :size="20" />
-					</template>
-					{{ t('spreed', 'Save as draft') }}
-				</NcButton>
+			<div v-else-if="supportPollDrafts && selfIsOwnerOrModerator" class="poll-modal__actions">
+				<NcActions force-menu>
+					<NcActionButton v-if="isModerator" @click="createPollDraft">
+						<template #icon>
+							<IconFileEdit :size="20" />
+						</template>
+						{{ t('spreed', 'Save as draft') }}
+					</NcActionButton>
+					<NcActionLink :href="exportPollURI" :download="exportPollFileName">
+						<template #icon>
+							<IconFileDownload :size="20" />
+						</template>
+						{{ t('spreed', 'Export draft to file') }}
+					</NcActionLink>
+				</NcActions>
 			</div>
 		</div>
 		<NcLoadingIcon v-else class="poll-modal__loading" />
@@ -102,14 +116,15 @@
 <script>
 import { computed, ref } from 'vue'
 
+import IconFileDownload from 'vue-material-design-icons/FileDownload.vue'
 import IconFileEdit from 'vue-material-design-icons/FileEdit.vue'
 import FileLock from 'vue-material-design-icons/FileLock.vue'
 import PollIcon from 'vue-material-design-icons/Poll.vue'
 
-import { showSuccess } from '@nextcloud/dialogs'
 import { t, n } from '@nextcloud/l10n'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink.js'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
@@ -125,6 +140,7 @@ import { POLL } from '../../constants.js'
 import { hasTalkFeature } from '../../services/CapabilitiesManager.ts'
 import { EventBus } from '../../services/EventBus.js'
 import { usePollsStore } from '../../stores/polls.ts'
+import { convertToJSONDataURI } from '../../utils/fileDownload.ts'
 
 export default {
 	name: 'PollViewer',
@@ -132,6 +148,7 @@ export default {
 	components: {
 		NcActions,
 		NcActionButton,
+		NcActionLink,
 		NcCheckboxRadioSwitch,
 		NcLoadingIcon,
 		NcModal,
@@ -140,6 +157,7 @@ export default {
 		PollVotersDetails,
 		// icons
 		FileLock,
+		IconFileDownload,
 		IconFileEdit,
 		PollIcon,
 	},
@@ -159,6 +177,14 @@ export default {
 		const poll = computed(() => pollsStore.getPoll(token.value, id.value))
 		const supportPollDrafts = computed(() => hasTalkFeature(token.value, 'talk-polls-drafts'))
 
+		const exportPollURI = computed(() => convertToJSONDataURI({
+			question: poll.value.question,
+			options: poll.value.options,
+			resultMode: poll.value.resultMode,
+			maxVotes: poll.value.maxVotes,
+		}))
+		const exportPollFileName = `Talk Poll ${new Date().toISOString().slice(0, 10)}`
+
 		return {
 			isInCall: useIsInCall(),
 			pollsStore,
@@ -171,6 +197,8 @@ export default {
 			token,
 			poll,
 			supportPollDrafts,
+			exportPollURI,
+			exportPollFileName,
 		}
 	},
 
diff --git a/src/utils/fileDownload.ts b/src/utils/fileDownload.ts
new file mode 100644
index 00000000000..cc0f0acb265
--- /dev/null
+++ b/src/utils/fileDownload.ts
@@ -0,0 +1,30 @@
+/**
+ * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+/**
+ * Converts given payload to Data URI scheme
+ * data:[<mediatype>][;base64],<data>
+ *
+ * @param payload data to convert
+ * @param mediatype a MIME type string
+ * @param base64Token an optional base64 token if non-textual data is given
+ */
+const convertToDataURI = function(payload: string, mediatype: string = 'text/plain;charset=US-ASCII', base64Token: string = ''): string {
+	return 'data:' + mediatype + base64Token + ',' + encodeURIComponent(payload)
+}
+
+/**
+ * Converts given JS object to Data URI scheme
+ *
+ * @param payload JS object to convert
+ */
+const convertToJSONDataURI = function(payload: object): string {
+	return convertToDataURI(JSON.stringify(payload, null, 2), 'application/json;charset=utf-8')
+}
+
+export {
+	convertToDataURI,
+	convertToJSONDataURI,
+}