Merge pull request #1868 from nextcloud/bugfix/1819/include_self_added_categories_in_list

Show self-added categories in list, making it easier to remove them

src/components/Editor/Properties/PropertySelectMultiple.vue

@@ -95,7 +95,17 @@ export default {
 			return !(this.isReadOnly && this.value.length === 0)
 		},
 		options() {
-			return this.propModel.options.slice().sort((a, b) => a.localeCompare(b, getLocale().replace('_', '-'), { sensitivity: 'base' }))
+			const options = this.propModel.options.slice()
+			for (const value of (this.value || [])) {
+				if (options.includes(value)) {
+					continue
+				}
+
+				options.push(value)
+			}
+
+			return options
+				.sort((a, b) => a.localeCompare(b, getLocale().replace('_', '-'), { sensitivity: 'base' }))
 		},
 	},
 	methods: {

src/components/Editor/Properties/PropertySelectMultipleColoredOption.vue

@@ -23,7 +23,7 @@
 <template>
 	<span class="property-select-multiple-colored-tag">
 		<div class="property-select-multiple-colored-tag__color-indicator" :style="{ 'background-color': color}" />
-		<span class="property-select-multiple-colored-tag__label">{{ option }}</span>
+		<span class="property-select-multiple-colored-tag__label">{{ label }}</span>
 	</span>
 </template>
 
@@ -34,13 +34,20 @@ export default {
 	name: 'PropertySelectMultipleColoredOption',
 	props: {
 		option: {
-			type: String,
+			type: [String, Object],
 			required: true,
 		},
 	},
 	computed: {
+		label() {
+			if (typeof this.option === 'string') {
+				return this.option
+			}
+
+			return this.option.label
+		},
 		colorObject() {
-			return uidToColor(this.option)
+			return uidToColor(this.label)
 		},
 		color() {
 			const color = this.colorObject