feat(taskTypeSelect): show all task types inline

Signed-off-by: Julien Veyssier <julien-nc@posteo.net>

Author: julien-nc

src/components/AssistantTextProcessingForm.vue

@@ -10,7 +10,6 @@
 		<TaskTypeSelect
 			:value.sync="mySelectedTaskTypeId"
 			class="task-custom-select"
-			:inline="5"
 			:options="sortedTaskTypes"
 			@update:value="onTaskTypeUserChange" />
 		<div v-if="showHistory"
@@ -38,14 +37,6 @@
 				@load-task="onHistoryLoadTask" />
 		</div>
 		<div v-else class="task-input-output-form">
-			<!--h2 v-if="selectedTaskType"
-				class="task-name">
-				{{ selectedTaskType.name }}
-			</h2>
-			<span v-if="selectedTaskType"
-				class="task-description">
-				{{ selectedTaskType.description }}
-			</span-->
 			<AssistantFormInputs v-if="selectedTaskType"
 				:inputs.sync="myInputs"
 				:selected-task-id="selectedTaskId"

src/components/TaskTypeSelect.vue

@@ -8,7 +8,7 @@
 			@click="onTaskSelected(t)">
 			{{ t.name }}
 		</NcButton>
-		<NcActions v-if="actionTypes.length > 0"
+		<NcActions v-if="!onlyInline && actionTypes.length > 0"
 			:force-menu="true"
 			:container="$refs.taskTypeSelect">
 			<NcActionButton v-for="(t, i) in actionTypes"
@@ -49,9 +49,13 @@ export default {
 			type: Array,
 			required: true,
 		},
+		/**
+		 * Number of inline elements
+		 * All elements are inline if this prop is null
+		 */
 		inline: {
-			type: Number,
-			default: 3,
+			type: [Number, null],
+			default: null,
 		},
 	},
 
@@ -66,7 +70,13 @@ export default {
 	},
 
 	computed: {
+		onlyInline() {
+			return this.inline === null
+		},
 		buttonTypes() {
+			if (this.onlyInline) {
+				return this.options
+			}
 			// extra button replaces the last one
 			if (this.extraButtonType !== null) {
 				const types = this.options.slice(0, this.inline - 1)
@@ -104,6 +114,9 @@ export default {
 
 	methods: {
 		moveSelectedIfInMenu() {
+			if (this.onlyInline) {
+				return
+			}
 			// if the initially selected value is in the dropdown, get it out
 			const selectedAction = this.actionTypes.find(a => a.id === this.value)
 			if (this.actionTypes.find(a => a.id === this.value)) {