Merge pull request #2630 from LibreSign/feat/create-sign-store

chore: create sign store

src/store/sign.js

@@ -0,0 +1,57 @@
+/*
+ * @copyright Copyright (c) 2024 Vitor Mattos <[email protected]>
+ *
+ * @author Vitor Mattos <[email protected]>
+ *
+ * @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/>.
+ */
+
+import { defineStore } from 'pinia'
+import { loadState } from '@nextcloud/initial-state'
+
+export const useSignStore = defineStore('sign', {
+	state: () => ({
+		errors: [],
+		pdf: '',
+		uuid: '',
+		document: {
+			filename: '',
+			description: '',
+			status: '',
+			statusText: '',
+			fileId: 0,
+			signers: [],
+			visibleElements: [],
+		},
+	}),
+
+	actions: {
+		initFromState() {
+			this.errors = loadState('libresign', 'errors', [])
+			this.pdf = loadState('libresign', 'pdf')
+			this.uuid = loadState('libresign', 'uuid', null)
+			this.document = {
+				filename: loadState('libresign', 'filename'),
+				description: loadState('libresign', 'description'),
+				status: loadState('libresign', 'status'),
+				statusText: loadState('libresign', 'statusText'),
+				fileId: loadState('libresign', 'fileId', 0),
+				signers: loadState('libresign', 'signers', []),
+				visibleElements: loadState('libresign', 'visibleElements', []),
+			}
+		},
+	},
+})

src/views/SignPDF/SignPDF.vue

@@ -6,10 +6,10 @@
 				<header>
 					<img class="pdf-icon" :src="PDFIcon">
 					<h1>
-						{{ document.filename }}
+						{{ signStore.document.filename }}
 						<br>
 						<Chip>
-							{{ document.statusText }}
+							{{ signStore.document.statusText }}
 						</Chip>
 					</h1>
 				</header>
@@ -24,16 +24,17 @@
 						{{ t('libresign', 'Document not available for signature.') }}
 					</div>
 					<Sign v-else-if="!loading"
-						v-bind="{ document, uuid, docType }"
+						v-bind="{ docType }"
 						@signed="onSigned" />
 				</main>
 			</div>
 		</NcAppNavigation>
 		<NcAppContent>
-			<PdfEditor ref="pdfEditor"
+			<PdfEditor v-if="mounted"
+				ref="pdfEditor"
 				width="100%"
 				height="100%"
-				:file-src="pdf.url"
+				:file-src="signStore.pdf.url"
 				:read-only="true"
 				@pdf-editor:end-init="updateSigners" />
 		</NcAppContent>
@@ -45,13 +46,13 @@ import NcContent from '@nextcloud/vue/dist/Components/NcContent.js'
 import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
 import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation.js'
 import isMobile from '@nextcloud/vue/dist/Mixins/isMobile.js'
-import { loadState } from '@nextcloud/initial-state'
 import { showErrors } from '../../helpers/errors.js'
 import PdfEditor from '../../Components/PdfEditor/PdfEditor.vue'
 import Chip from '../../Components/Chip.vue'
 import Sign from './_partials/Sign.vue'
 import PDFIcon from '../../../img/application-pdf.png'
 import { SIGN_STATUS } from '../../domains/sign/enum.js'
+import { useSignStore } from '../../store/sign.js'
 
 export default {
 	name: 'SignPDF',
@@ -66,22 +67,15 @@ export default {
 	mixins: [
 		isMobile,
 	],
+	setup() {
+		const signStore = useSignStore()
+		return { signStore }
+	},
 	data() {
 		return {
 			loading: true,
-			errors: loadState('libresign', 'errors', []),
-			pdf: loadState('libresign', 'pdf'),
-			uuid: loadState('libresign', 'uuid', null) ?? this.$route.params.uuid,
+			mounted: false,
 			PDFIcon,
-			document: {
-				filename: loadState('libresign', 'filename'),
-				description: loadState('libresign', 'description'),
-				status: loadState('libresign', 'status'),
-				statusText: loadState('libresign', 'statusText'),
-				fileId: loadState('libresign', 'fileId', 0),
-				signers: loadState('libresign', 'signers', []),
-				visibleElements: loadState('libresign', 'visibleElements', []),
-			},
 		}
 	},
 	computed: {
@@ -92,17 +86,22 @@ export default {
 		},
 	},
 	mounted() {
-		showErrors(this.errors)
+		this.signStore.initFromState()
+		this.mounted = true
+		if (!this.signStore.uuid) {
+			this.signStore.uuid = this.$route.params.uuid
+		}
+		showErrors(this.signStore.errors)
 	},
 	methods: {
 		signEnabled() {
-			return SIGN_STATUS.ABLE_TO_SIGN === this.document.status
-				|| SIGN_STATUS.PARTIAL_SIGNED === this.document.status
+			return SIGN_STATUS.ABLE_TO_SIGN === this.signStore.document.status
+				|| SIGN_STATUS.PARTIAL_SIGNED === this.signStore.document.status
 		},
 		updateSigners(data) {
-			this.document.signers.forEach(signer => {
-				if (this.document.visibleElements) {
-					this.document.visibleElements.forEach(element => {
+			this.signStore.document.signers.forEach(signer => {
+				if (this.signStore.document.visibleElements) {
+					this.signStore.document.visibleElements.forEach(element => {
 						if (element.signRequestId === signer.signRequestId) {
 							const object = structuredClone(signer)
 							object.readOnly = true

src/views/SignPDF/_partials/Sign.vue

@@ -99,15 +99,15 @@
 		</NcModal>
 		<SMSManager v-if="signMethodsStore.modal.sms"
 			:phone-number="user?.account?.phoneNumber"
-			:uuid="uuid"
-			:file-id="document.fileId"
+			:uuid="signStore.uuid"
+			:file-id="signStore.document.fileId"
 			@change="signWithSMSCode"
 			@update:phone="val => $emit('update:phone', val)"
 			@close="signMethodsStore.closeModal('sms')" />
 
 		<EmailManager v-if="signMethodsStore.modal.emailToken"
-			:uuid="uuid"
-			:file-id="document.fileId"
+			:uuid="signStore.uuid"
+			:file-id="signStore.document.fileId"
 			@change="signWithEmailToken"
 			@close="signMethodsStore.closeModal('emailToken')" />
 	</div>
@@ -128,6 +128,7 @@ import PreviewSignature from '../../../Components/PreviewSignature/PreviewSignat
 import Draw from '../../../Components/Draw/Draw.vue'
 import NcPasswordField from '@nextcloud/vue/dist/Components/NcPasswordField.js'
 import CreatePassword from '../../../views/CreatePassword.vue'
+import { useSignStore } from '../../../store/sign.js'
 import { useSignMethodsStore } from '../../../store/signMethods.js'
 import { useSignatureElementsStore } from '../../../store/signatureElements.js'
 
@@ -145,24 +146,17 @@ export default {
 		Draw,
 	},
 	props: {
-		uuid: {
-			type: String,
-			required: true,
-		},
-		document: {
-			type: Object,
-			required: true,
-		},
 		docType: {
 			type: String,
 			required: false,
 			default: 'default',
 		},
 	},
 	setup() {
+		const signStore = useSignStore()
 		const signMethodsStore = useSignMethodsStore()
 		const signatureElementsStore = useSignatureElementsStore()
-		return { signMethodsStore, signatureElementsStore }
+		return { signStore, signMethodsStore, signatureElementsStore }
 	},
 	data() {
 		return {
@@ -177,13 +171,13 @@ export default {
 	},
 	computed: {
 		elements() {
-			const signer = this.document?.signers.find(row => row.me) || {}
+			const signer = this.signStore.document?.signers.find(row => row.me) || {}
 
 			if (!signer.signRequestId) {
 				return []
 			}
 
-			const visibleElements = (this.document?.visibleElements || [])
+			const visibleElements = (this.signStore.document?.visibleElements || [])
 				.filter(row => {
 					return this.signatureElementsStore.hasSignatureOfType(row.type)
 						&& row.signRequestId === signer.signRequestId
@@ -200,7 +194,7 @@ export default {
 			return this.elements.length > 0
 		},
 		needCreateSignature() {
-			return this.document?.visibleElements.length > 0
+			return this.signStore.document?.visibleElements.length > 0
 				&& !this.hasSignatures
 		},
 		ableToSign() {
@@ -276,10 +270,10 @@ export default {
 			}
 			try {
 				let url = ''
-				if (this.document.fileId > 0) {
-					url = generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', { fileId: this.document.fileId })
+				if (this.signStore.document.fileId > 0) {
+					url = generateOcsUrl('/apps/libresign/api/v1/sign/file_id/{fileId}', { fileId: this.signStore.document.fileId })
 				} else {
-					url = generateOcsUrl('/apps/libresign/api/v1/sign/uuid/{uuid}', { uuid: this.uuid })
+					url = generateOcsUrl('/apps/libresign/api/v1/sign/uuid/{uuid}', { uuid: this.signStore.uuid })
 				}
 
 				const { data } = await axios.post(url, payload)