From cccae7c33327736b237a1d2026462b76042b3c29 Mon Sep 17 00:00:00 2001
From: dartcafe <github@dartcafe.de>
Date: Sun, 15 Oct 2023 21:06:25 +0200
Subject: [PATCH] move some ctas from vote page to cards

Signed-off-by: dartcafe <github@dartcafe.de>
---
 src/js/components/Actions/index.js            |   2 +-
 .../Actions/modules/ActionSendConfirmed.vue   | 113 +++++++++++++++
 .../modules/ActionSendConfirmedOptions.vue    | 129 ------------------
 src/js/views/Vote.vue                         |  33 +++--
 4 files changed, 137 insertions(+), 140 deletions(-)
 create mode 100644 src/js/components/Actions/modules/ActionSendConfirmed.vue
 delete mode 100644 src/js/components/Actions/modules/ActionSendConfirmedOptions.vue

diff --git a/src/js/components/Actions/index.js b/src/js/components/Actions/index.js
index 3e745cdf9..4a29bbfc0 100644
--- a/src/js/components/Actions/index.js
+++ b/src/js/components/Actions/index.js
@@ -1,5 +1,5 @@
 export { default as ActionChangeView } from './modules/ActionChangeView.vue'
 export { default as ActionDelete } from './modules/ActionDelete.vue'
-export { default as ActionSendConfirmedOptions } from './modules/ActionSendConfirmedOptions.vue'
+export { default as ActionSendConfirmed } from './modules/ActionSendConfirmed.vue'
 export { default as ActionSortOptions } from './modules/ActionSortOptions.vue'
 export { default as ActionToggleSidebar } from './modules/ActionToggleSidebar.vue'
diff --git a/src/js/components/Actions/modules/ActionSendConfirmed.vue b/src/js/components/Actions/modules/ActionSendConfirmed.vue
new file mode 100644
index 000000000..e3b4db508
--- /dev/null
+++ b/src/js/components/Actions/modules/ActionSendConfirmed.vue
@@ -0,0 +1,113 @@
+<!--
+  - @copyright Copyright (c) 2021 René Gieling <github@dartcafe.de>
+  -
+  - @author René Gieling <github@dartcafe.de>
+  -
+  - @license GNU AGPL version 3 or any later version
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program.  If not, see <http://www.gnu.org/licenses/>.
+  -
+  -->
+
+<template>
+	<div class="action send-confirmations">
+		<NcButton v-tooltip="sendButtonCaption"
+			type="primary"
+			:aria-label="sendButtonCaption"
+			:disabled="disableButton"
+			@click="clickAction()">
+			<template #icon>
+				<EmailCheckIcon />
+			</template>
+			<template #default>
+				{{ t('polls', 'Send confirmation emails') }}
+			</template>
+		</NcButton>
+
+		<NcModal :show.sync="showModal"
+			:title="t('polls', 'Result of sent confirmation mails')"
+			size="small">
+			<div class="modal-confirmation-result">
+				<div v-if="confirmations?.countSentMails > 0" class="sent-confirmations">
+					<h2>{{ n('polls', '%n confirmation has been sent', '%n confirmations have been sent', confirmations.countSentMails) }}</h2>
+					<ul>
+						<li v-for="(item) in confirmations.sentMails" :key="item.displayName">
+							{{ item.displayName }} &lt;{{ item.emailAddress }}&gt;
+						</li>
+					</ul>
+				</div>
+				<div v-if="confirmations?.countAbortedMails > 0" class="error-confirmations">
+					<h2>{{ n('polls', '%n confirmation could not be sent', '%n confirmations could not be sent:', confirmations.countAbortedMails) }}</h2>
+					<ul>
+						<li v-for="(item) in confirmations.abortedMails" :key="item.displayName">
+							{{ item.displayName }} ({{ item.reason === 'InvalidMail' ? t('polls', 'No valid email address') : t('polls', 'Unknown error') }})
+						</li>
+					</ul>
+				</div>
+			</div>
+		</NcModal>
+	</div>
+</template>
+
+<script>
+import { NcButton, NcModal } from '@nextcloud/vue'
+import EmailCheckIcon from 'vue-material-design-icons/EmailCheck.vue' // view-comfy-outline
+import { PollsAPI } from '../../../Api/index.js'
+
+export default {
+	name: 'ActionSendConfirmed',
+
+	components: {
+		EmailCheckIcon,
+		NcButton,
+		NcModal,
+	},
+
+	data() {
+		return {
+			showModal: false,
+			sendButtonCaption: t('polls', 'Send information about confirmed options by email'),
+			confirmations: null,
+			disableButton: false,
+		}
+	},
+
+	methods: {
+		async clickAction() {
+			try {
+				this.disableButton = true
+				const result = await PollsAPI.sendConfirmation(this.$route.params.id)
+				this.disableButton = false
+				this.confirmations = result.data.confirmations
+				this.showModal = true
+			} catch (e) {
+				console.error(e)
+			}
+		},
+	},
+}
+</script>
+
+<style lang="scss">
+.modal-confirmation-result {
+	padding: 24px;
+	ul {
+		list-style: initial;
+	}
+
+	.sent-confirmations, .error-confirmations {
+		padding: 12px;
+	}
+}
+</style>
diff --git a/src/js/components/Actions/modules/ActionSendConfirmedOptions.vue b/src/js/components/Actions/modules/ActionSendConfirmedOptions.vue
deleted file mode 100644
index 8b2d59778..000000000
--- a/src/js/components/Actions/modules/ActionSendConfirmedOptions.vue
+++ /dev/null
@@ -1,129 +0,0 @@
-<!--
-  - @copyright Copyright (c) 2021 René Gieling <github@dartcafe.de>
-  -
-  - @author René Gieling <github@dartcafe.de>
-  -
-  - @license GNU AGPL version 3 or any later version
-  -
-  - This program is free software: you can redistribute it and/or modify
-  - it under the terms of the GNU Affero General Public License as
-  - published by the Free Software Foundation, either version 3 of the
-  - License, or (at your option) any later version.
-  -
-  - This program is distributed in the hope that it will be useful,
-  - but WITHOUT ANY WARRANTY; without even the implied warranty of
-  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-  - GNU Affero General Public License for more details.
-  -
-  - You should have received a copy of the GNU Affero General Public License
-  - along with this program.  If not, see <http://www.gnu.org/licenses/>.
-  -
-  -->
-
-<template>
-	<div class="action send-confirmations">
-		<div class="confirmation-button">
-			<h2>{{ headerCaption }}</h2>
-			<NcButton v-tooltip="sendButtonCaption"
-				:aria-label="sendButtonCaption"
-				@click="clickAction()">
-				<template #icon>
-					<EmailCheckIcon />
-				</template>
-				<template #default>
-					{{ t('polls', 'Send confirmation emails') }}
-				</template>
-			</NcButton>
-		</div>
-		<div v-if="confirmations" class="confirmation-info">
-			<div v-if="confirmations.sent" class="sent-confirmations">
-				<h2>{{ t('polls', 'Sent emails to:') }}</h2>
-				<ul>
-					<li v-for="(item) in confirmations.sent" :key="item">
-						{{ item }}
-					</li>
-				</ul>
-			</div>
-			<div v-if="confirmations.error" class="error-confirmations">
-				<h2>{{ t('polls', 'Emails could not be sent:') }}</h2>
-				<ul>
-					<li v-for="(item) in confirmations.error" :key="item">
-						{{ item }}
-					</li>
-				</ul>
-			</div>
-		</div>
-	</div>
-</template>
-
-<script>
-import { NcButton } from '@nextcloud/vue'
-import EmailCheckIcon from 'vue-material-design-icons/EmailCheck.vue' // view-comfy-outline
-import { showError, showSuccess } from '@nextcloud/dialogs'
-import { PollsAPI } from '../../../Api/index.js'
-
-export default {
-	name: 'ActionSendConfirmedOptions',
-
-	components: {
-		EmailCheckIcon,
-		NcButton,
-	},
-
-	data() {
-		return {
-			sendButtonCaption: t('polls', 'Send information about confirmed options by email'),
-			confirmations: null,
-			headerCaption: t('polls', 'Inform your participants about the confirmed options'),
-		}
-	},
-
-	methods: {
-		async clickAction() {
-			try {
-				const result = await PollsAPI.sendConfirmation(this.$route.params.id)
-				this.confirmations = result.data.confirmations
-				console.log(this.confirmations)
-				console.log(this.confirmations.countSentMails)
-				this.headerCaption = n('polls', 'Confirmations sent to %n recipient', 'Confirmations sent to %n recipients', this.confirmations.countSentMails)
-				this.confirmations.sentMails.forEach((confirmation) => {
-					showSuccess(t('polls', 'Confirmation sent to {participant} ({emailAddress})', { participant: confirmation.displayName, emailAddress: confirmation.emailAddress }))
-				})
-
-				this.confirmations.abortedMails.forEach((confirmation) => {
-					showError(t('polls', 'Confirmation could not be sent to {participant} ({emailAddress})', { participant: confirmation.displayName, emailAddress: confirmation.emailAddress }))
-				})
-			} catch (e) {
-				// ignore
-			}
-		},
-	},
-}
-</script>
-
-<style lang="scss">
-.action.send-confirmations {
-	display: flex;
-	flex-wrap: wrap;
-	gap: 44px;
-}
-
-.confirmation-result {
-	display: flex;
-}
-
-.confirmation-info {
-	display: flex;
-	flex-wrap: wrap;
-	flex: auto;
-	gap: 12px;
-}
-
-.sent-confirmations {
-	flex: auto;
-}
-
-.error-confirmations {
-	flex: auto;
-}
-</style>
diff --git a/src/js/views/Vote.vue b/src/js/views/Vote.vue
index 91e1061a9..561918f0b 100644
--- a/src/js/views/Vote.vue
+++ b/src/js/views/Vote.vue
@@ -43,10 +43,28 @@
 				</template>
 			</CardDiv>
 
-			<CardDiv v-if="closed" type="warning">
+			<CardDiv v-if="acl.allowAddOptions && proposalsOpen && !closed" type="success">
+				{{ t('polls', 'You are asked to propose more options. ') }}
+				<p v-if="proposalsExpirySet && !proposalsExpired">
+					{{ t('polls', 'The proposal period ends {timeRelative}', { timeRelative: proposalsExpireRelative }) }}
+				</p>
+				<OptionProposals v-if="poll.type === 'textPoll'" />
+				<template #button>
+					<OptionProposals v-if="poll.type === 'datePoll'" />
+				</template>
+			</CardDiv>
+
+			<CardDiv v-if="closed && !showConfirmationMail" type="warning">
 				{{ t('polls', 'This poll is closed. No further action is possible.') }}
 			</CardDiv>
 
+			<CardDiv v-else-if="showConfirmationMail" type="success">
+				{{ t('polls', 'You have confirmed options. Inform your participants about the result via email.') }}
+				<template #button>
+					<ActionSendConfirmed />
+				</template>
+			</CardDiv>
+
 			<CardDiv v-else-if="share.locked" type="warning">
 				{{ lockedShareCardCaption }}
 			</CardDiv>
@@ -55,13 +73,6 @@
 				<MarkUpDescription />
 			</div>
 
-			<div v-if="acl.allowAddOptions && proposalsOpen && !closed" class="area__proposal">
-				<OptionProposals />
-			</div>
-			<div v-if="showConfirmationMail" class="area__confirmation">
-				<ActionSendConfirmedOptions />
-			</div>
-
 			<div class="area__main" :class="viewMode">
 				<VoteTable v-show="options.length" :view-mode="viewMode" />
 
@@ -115,12 +126,12 @@ import PollHeaderButtons from '../components/Poll/PollHeaderButtons.vue'
 import { CardDiv, HeaderBar } from '../components/Base/index.js'
 import DatePollIcon from 'vue-material-design-icons/CalendarBlank.vue'
 import TextPollIcon from 'vue-material-design-icons/FormatListBulletedSquare.vue'
-import { ActionSendConfirmedOptions } from '../components/Actions/index.js'
+import { ActionSendConfirmed } from '../components/Actions/index.js'
 
 export default {
 	name: 'Vote',
 	components: {
-		ActionSendConfirmedOptions,
+		ActionSendConfirmed,
 		NcAppContent,
 		NcButton,
 		NcEmptyContent,
@@ -159,6 +170,8 @@ export default {
 			viewMode: 'poll/viewMode',
 			proposalsAllowed: 'poll/proposalsAllowed',
 			proposalsOpen: 'poll/proposalsOpen',
+			proposalsExpirySet: 'poll/proposalsExpirySet',
+			proposalsExpireRelative: 'poll/proposalsExpireRelative',
 			countHiddenParticipants: 'poll/countHiddenParticipants',
 			safeTable: 'poll/safeTable',
 			confirmedOptions: 'options/confirmed',