chore: unify debounce timing for input handling

src/Forms.vue

@@ -165,7 +165,7 @@ import OcsResponse2Data from './utils/OcsResponse2Data.js'
 import PermissionTypes from './mixins/PermissionTypes.js'
 import Sidebar from './views/Sidebar.vue'
 import logger from './utils/Logger.js'
-import { FormState } from './models/FormStates.ts'
+import { FormState } from './models/Constants.ts'
 
 export default {
 	name: 'Forms',

src/components/AppNavigationForm.vue

@@ -123,7 +123,7 @@ import IconDeleteSvg from '@mdi/svg/svg/delete.svg?raw'
 
 import FormsIcon from './Icons/FormsIcon.vue'
 
-import { FormState } from '../models/FormStates.ts'
+import { FormState } from '../models/Constants.ts'
 import PermissionTypes from '../mixins/PermissionTypes.js'
 import logger from '../utils/Logger.js'
 

src/components/Questions/AnswerInput.vue

@@ -85,6 +85,7 @@ import NcActions from '@nextcloud/vue/components/NcActions'
 import NcActionButton from '@nextcloud/vue/components/NcActionButton'
 import NcButton from '@nextcloud/vue/components/NcButton'
 
+import { INPUT_DEBOUNCE_MS } from '../../models/Constants.ts'
 import OcsResponse2Data from '../../utils/OcsResponse2Data.js'
 import logger from '../../utils/Logger.js'
 
@@ -174,7 +175,7 @@ export default {
 		// As data instead of method, to have a separate debounce per AnswerInput
 		this.debounceOnInput = debounce((event) => {
 			return this.queue.add(() => this.onInput(event))
-		}, 500)
+		}, INPUT_DEBOUNCE_MS)
 	},
 
 	methods: {

src/components/Questions/QuestionFile.vue

@@ -163,6 +163,16 @@ import { loadState } from '@nextcloud/initial-state'
 import { showError } from '@nextcloud/dialogs'
 import { formatFileSize } from '@nextcloud/files'
 
+/**
+ * A constant object representing file size units in bytes.
+ *
+ * @example
+ * ```typescript
+ * const kilobytes = FILE_SIZE_UNITS.kb; // 1024
+ * const megabytes = FILE_SIZE_UNITS.mb; // 1048576
+ * const gigabytes = FILE_SIZE_UNITS.gb; // 1073741824
+ * ```
+ */
 const FILE_SIZE_UNITS = {
 	kb: 1024,
 	mb: 1024 ** 2,

src/components/Questions/QuestionMultiple.vue

@@ -194,12 +194,11 @@ import IconContentPaste from 'vue-material-design-icons/ContentPaste.vue'
 import IconRadioboxBlank from 'vue-material-design-icons/RadioboxBlank.vue'
 
 import AnswerInput from './AnswerInput.vue'
+import { QUESTION_EXTRASETTINGS_OTHER_PREFIX } from '../../models/Constants.ts'
 import QuestionMixin from '../../mixins/QuestionMixin.js'
 import OptionInputDialog from '../OptionInputDialog.vue'
 import QuestionMultipleMixin from '../../mixins/QuestionMultipleMixin.ts'
 
-const QUESTION_EXTRASETTINGS_OTHER_PREFIX = 'system-other-answer:'
-
 export default {
 	name: 'QuestionMultiple',
 

src/components/SidebarTabs/SettingsSidebarTab.vue

@@ -138,7 +138,7 @@ import TransferOwnership from './TransferOwnership.vue'
 
 import { directive as ClickOutside } from 'v-click-outside'
 import { loadState } from '@nextcloud/initial-state'
-import { FormState } from '../../models/FormStates.ts'
+import { FormState } from '../../models/Constants.ts'
 
 export default {
 	components: {

src/mixins/QuestionMixin.js

@@ -8,6 +8,7 @@ import { generateOcsUrl } from '@nextcloud/router'
 import axios from '@nextcloud/axios'
 import debounce from 'debounce'
 
+import { INPUT_DEBOUNCE_MS } from '../models/Constants.ts'
 import logger from '../utils/Logger.js'
 import OcsResponse2Data from '../utils/OcsResponse2Data.js'
 import Question from '../components/Questions/Question.vue'
@@ -214,7 +215,7 @@ export default {
 		onTitleChange: debounce(function (text) {
 			this.$emit('update:text', text)
 			this.saveQuestionProperty('text', text)
-		}, 200),
+		}, INPUT_DEBOUNCE_MS),
 
 		/**
 		 * Forward the description change to the parent and store to db
@@ -224,7 +225,7 @@ export default {
 		onDescriptionChange: debounce(function (description) {
 			this.$emit('update:description', description)
 			this.saveQuestionProperty('description', description)
-		}, 200),
+		}, INPUT_DEBOUNCE_MS),
 
 		/**
 		 * Forward the required change to the parent and store to db
@@ -234,7 +235,7 @@ export default {
 		onRequiredChange: debounce(function (isRequiredValue) {
 			this.$emit('update:isRequired', isRequiredValue)
 			this.saveQuestionProperty('isRequired', isRequiredValue)
-		}, 200),
+		}, INPUT_DEBOUNCE_MS),
 
 		/**
 		 * Create mapper to forward the required change to the parent and store to db
@@ -247,7 +248,7 @@ export default {
 			const newExtraSettings = { ...this.extraSettings, ...newSettings }
 			this.$emit('update:extraSettings', newExtraSettings)
 			this.saveQuestionProperty('extraSettings', newExtraSettings)
-		}, 200),
+		}, INPUT_DEBOUNCE_MS),
 
 		/**
 		 * Forward the technical-name change to the parent and store to db
@@ -257,7 +258,7 @@ export default {
 		onNameChange: debounce(function (name) {
 			this.$emit('update:name', name)
 			this.saveQuestionProperty('name', name)
-		}, 200),
+		}, INPUT_DEBOUNCE_MS),
 
 		/**
 		 * Forward the required change to the parent and store to db

src/mixins/QuestionMultipleMixin.ts

@@ -11,6 +11,7 @@ import { translate as t } from '@nextcloud/l10n'
 import { generateOcsUrl } from '@nextcloud/router'
 import { defineComponent } from 'vue'
 
+import { INPUT_DEBOUNCE_MS } from '../models/Constants.ts'
 import axios from '@nextcloud/axios'
 import debounce from 'debounce'
 import logger from '../utils/Logger'
@@ -82,7 +83,7 @@ export default defineComponent({
 		 * Debounced function to save options order
 		 */
 		onOptionsReordered() {
-			return debounce(this.saveOptionsOrder, 750)
+			return debounce(this.saveOptionsOrder, INPUT_DEBOUNCE_MS)
 		},
 	},
 

src/mixins/UserSearchMixin.js

@@ -7,6 +7,7 @@ import { getCurrentUser } from '@nextcloud/auth'
 import axios from '@nextcloud/axios'
 import debounce from 'debounce'
 
+import { INPUT_DEBOUNCE_MS } from '../models/Constants.ts'
 import OcsResponse2Data from '../utils/OcsResponse2Data.js'
 import logger from '../utils/Logger.js'
 import ShareTypes from './ShareTypes.js'
@@ -76,7 +77,7 @@ export default {
 		 */
 		debounceGetSuggestions: debounce(function (...args) {
 			this.getSuggestions(...args)
-		}, 300),
+		}, INPUT_DEBOUNCE_MS),
 
 		/**
 		 * Get suggestions

src/models/Constants.ts

@@ -0,0 +1,33 @@
+/**
+ * SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+/**
+ * Represents the state of a form.
+ *
+ * Possible values:
+ * - `FormActive` (0): The form is currently active and can be interacted with.
+ * - `FormClosed` (1): The form is closed and no longer accepting input.
+ * - `FormArchived` (2): The form is archived and stored for reference.
+ *
+ * Keep in sync with Constants.php
+ */
+export enum FormState {
+	FormActive = 0,
+	FormClosed = 1,
+	FormArchived = 2,
+}
+
+/**
+ * The debounce time in milliseconds for input events.
+ *
+ * This constant is used to limit the rate at which input-related
+ * operations are triggered, improving performance and user experience.
+ */
+export const INPUT_DEBOUNCE_MS = 400
+
+/**
+ * A constant representing the prefix used for identifying "other" answers
+ */
+export const QUESTION_EXTRASETTINGS_OTHER_PREFIX = 'system-other-answer:'

src/views/Create.vue

@@ -170,7 +170,7 @@ import NcNoteCard from '@nextcloud/vue/components/NcNoteCard'
 import IconLock from 'vue-material-design-icons/Lock.vue'
 import IconPlus from 'vue-material-design-icons/Plus.vue'
 
-import { FormState } from '../models/FormStates.ts'
+import { FormState, INPUT_DEBOUNCE_MS } from '../models/Constants.ts'
 import answerTypes from '../models/AnswerTypes.js'
 import Question from '../components/Questions/Question.vue'
 import QuestionLong from '../components/Questions/QuestionLong.vue'
@@ -367,10 +367,10 @@ export default {
 		 */
 		saveTitle: debounce(async function () {
 			this.saveFormProperty('title')
-		}, 200),
+		}, INPUT_DEBOUNCE_MS),
 		saveDescription: debounce(async function () {
 			this.saveFormProperty('description')
-		}, 200),
+		}, INPUT_DEBOUNCE_MS),
 
 		/**
 		 * Add a new question to the current form

src/views/Results.vue

@@ -264,7 +264,7 @@ import IconShareVariant from 'vue-material-design-icons/ShareVariant.vue'
 import IconTable from 'vue-material-design-icons/Table.vue'
 import IconTableSvg from '@mdi/svg/svg/table.svg?raw'
 
-import { FormState } from '../models/FormStates.ts'
+import { FormState } from '../models/Constants.ts'
 import ResultsSummary from '../components/Results/ResultsSummary.vue'
 import Submission from '../components/Results/Submission.vue'
 import TopBar from '../components/TopBar.vue'

src/views/Submit.vue

@@ -208,7 +208,7 @@ import IconCheckSvg from '@mdi/svg/svg/check.svg?raw'
 import IconRefreshSvg from '@mdi/svg/svg/refresh.svg?raw'
 import IconSendSvg from '@mdi/svg/svg/send.svg?raw'
 
-import { FormState } from '../models/FormStates.ts'
+import { FormState } from '../models/Constants.ts'
 import answerTypes from '../models/AnswerTypes.js'
 import logger from '../utils/Logger.js'