feat: only get template fields once selectedfeat/template-field-extraction-improvements

In order to improve the performance and flow of creating a new file
from a template, the `setFields` method will be deprecated and we
instead use a new property, `setFieldsUrl`, which allows apps to
specify an endpoint for extracting the template fields. This endpoint
is used by the template picker to request the fields only once the
user has selected a template, instead of fetching all template fields
before opening and causing a terribly slow experience.

Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>

1 files changed, 25 insertions, 6 deletions

diff --git a/apps/files/src/views/TemplatePicker.vue b/apps/files/src/views/TemplatePicker.vue
index 15286a220e9..12226e7b07b 100644
--- a/apps/files/src/views/TemplatePicker.vue
+++ b/apps/files/src/views/TemplatePicker.vue
@@ -57,7 +57,7 @@ import { translate as t } from '@nextcloud/l10n'
 import { generateRemoteUrl } from '@nextcloud/router'
 import { normalize, extname, join } from 'path'
 import { defineComponent } from 'vue'
-import { createFromTemplate, getTemplates } from '../services/Templates.js'
+import { createFromTemplate, getTemplates, getTemplateFields } from '../services/Templates.js'
 
 import NcEmptyContent from '@nextcloud/vue/components/NcEmptyContent'
 import NcModal from '@nextcloud/vue/components/NcModal'
@@ -215,7 +215,7 @@ export default defineComponent({
 			}
 		},
 
-		async createFile(templateFields) {
+		async createFile(templateFields = []) {
 			const currentDirectory = new URL(window.location.href).searchParams.get('dir') || '/'
 
 			// If the file doesn't have an extension, add the default one
@@ -274,14 +274,33 @@ export default defineComponent({
 		},
 
 		async onSubmit() {
-			if (this.selectedTemplate?.fields?.length > 0) {
+			const fieldsUrl = this.selectedTemplate?.fieldsUrl
+
+			if (!fieldsUrl) {
+				this.loading = true
+				return await this.createFile()
+			}
+
+			try {
+				const fields = await getTemplateFields(fieldsUrl)
+
+				if (fields.length < 1) {
+					this.loading = true
+					return await this.createFile()
+				}
+
 				spawnDialog(TemplateFiller, {
-					fields: this.selectedTemplate.fields,
 					onSubmit: this.createFile,
+					fields,
 				})
-			} else {
+			} catch (error) {
+				logger.error('Error while extracting fields from template', { error })
+				showError(t('files', 'Could not extract fields from template'))
+
+				// If fetching the template fields fails, we can create
+				// a file anyway without any fields filled
 				this.loading = true
-				await this.createFile()
+				await this.createFile([])
 			}
 		},
 	},