[stable4.5] revert: Augment the category menu by system tags and already used categories

lib/Controller/ViewController.php

@@ -26,7 +26,6 @@
 namespace OCA\Calendar\Controller;
 
 use OCA\Calendar\Service\Appointments\AppointmentConfigService;
-use OCA\Calendar\Service\CategoriesService;
 use OCP\App\IAppManager;
 use OCP\AppFramework\Controller;
 use OCP\AppFramework\Http\FileDisplayResponse;
@@ -46,9 +45,6 @@ class ViewController extends Controller {
 	/** @var AppointmentConfigService */
 	private $appointmentConfigService;
 
-	/** @var CategoriesService */
-	private $categoriesService;
-
 	/** @var IInitialState */
 	private $initialStateService;
 
@@ -64,15 +60,13 @@ public function __construct(string $appName,
 		IRequest $request,
 		IConfig $config,
 		AppointmentConfigService $appointmentConfigService,
-		CategoriesService $categoriesService,
 		IInitialState $initialStateService,
 		IAppManager $appManager,
 		?string $userId,
 		IAppData $appData) {
 		parent::__construct($appName, $request);
 		$this->config = $config;
 		$this->appointmentConfigService = $appointmentConfigService;
-		$this->categoriesService = $categoriesService;
 		$this->initialStateService = $initialStateService;
 		$this->appManager = $appManager;
 		$this->userId = $userId;
@@ -143,7 +137,6 @@ public function index():TemplateResponse {
 		$this->initialStateService->provideInitialState('appointmentConfigs', $this->appointmentConfigService->getAllAppointmentConfigurations($this->userId));
 		$this->initialStateService->provideInitialState('disable_appointments', $disableAppointments);
 		$this->initialStateService->provideInitialState('can_subscribe_link', $canSubscribeLink);
-		$this->initialStateService->provideInitialState('categories', $this->categoriesService->getCategories($this->userId));
 		$this->initialStateService->provideInitialState('show_resources', $showResources);
 
 		return new TemplateResponse($this->appName, 'main');

src/components/Editor/Properties/PropertySelectMultiple.vue

@@ -42,9 +42,6 @@
 				:multiple="true"
 				:taggable="true"
 				track-by="label"
-				group-values="options"
-				group-label="group"
-				:group-select="false"
 				label="label"
 				@select="selectValue"
 				@tag="tag"
@@ -102,10 +99,6 @@ export default {
 			type: Boolean,
 			default: false,
 		},
-		customLabelHeading: {
-			type: String,
-			default: 'Custom Categories',
-		},
 	},
 	data() {
 		return {
@@ -118,56 +111,45 @@ export default {
 		},
 		options() {
 			const options = this.propModel.options.slice()
-			let customOptions = options.find((optionGroup) => optionGroup.group === this.customLabelHeading)
-			if (!customOptions) {
-				customOptions = {
-					group: this.customLabelHeading,
-					options: [],
-				}
-				options.unshift(customOptions)
-			}
 			for (const category of (this.selectionData ?? [])) {
-				if (this.findOption(category, options)) {
+				if (options.find(option => option.value === category.value)) {
 					continue
 				}
 
 				// Add pseudo options for unknown values
-				customOptions.options.push({
+				options.push({
 					value: category.value,
 					label: category.label,
 				})
 			}
 
 			for (const category of this.value) {
-				const categoryOption = { value: category, label: category }
-				if (!this.findOption(categoryOption, options)) {
-					customOptions.options.push(categoryOption)
+				if (!options.find(option => option.value === category)) {
+					options.push({ value: category, label: category })
 				}
 			}
 
 			if (this.customLabelBuffer) {
 				for (const category of this.customLabelBuffer) {
-					if (!this.findOption(category, options)) {
-						customOptions.options.push(category)
+					if (!options.find(option => option.value === category.value)) {
+						options.push(category)
 					}
 				}
 			}
 
-			for (const optionGroup of options) {
-				optionGroup.options = optionGroup.options.sort((a, b) => {
+			return options
+				.sort((a, b) => {
 					return a.label.localeCompare(
 						b.label,
 						getLocale().replace('_', '-'),
 						{ sensitivity: 'base' },
 					)
 				})
-			}
-			return options
 		},
 	},
 	created() {
 		for (const category of this.value) {
-			const option = this.findOption({ value: category }, this.options)
+			const option = this.options.find(option => option.value === category)
 			if (option) {
 				this.selectionData.push(option)
 			}
@@ -190,7 +172,7 @@ export default {
 
 			// store removed custom options to keep it in the option list
 			const options = this.propModel.options.slice()
-			if (!this.findOption(value, options)) {
+			if (!options.find(option => option.value === value.value)) {
 				if (!this.customLabelBuffer) {
 					this.customLabelBuffer = []
 				}
@@ -205,15 +187,6 @@ export default {
 			this.selectionData.push({ value, label: value })
 			this.$emit('add-single-value', value)
 		},
-		findOption(value, availableOptions) {
-			for (const optionGroup of availableOptions) {
-				const option = optionGroup.options.find(option => option.value === value.value)
-				if (option) {
-					return option
-				}
-			}
-			return undefined
-		},
 	},
 }
 </script>

src/components/Editor/Properties/PropertySelectMultipleColoredOption.vue

@@ -23,7 +23,7 @@
 
 <template>
 	<span class="property-select-multiple-colored-tag">
-		<div v-if="!isGroupLabel" class="property-select-multiple-colored-tag__color-indicator" :style="{ 'background-color': color }" />
+		<div class="property-select-multiple-colored-tag__color-indicator" :style="{ 'background-color': color}" />
 		<span class="property-select-multiple-colored-tag__label">{{ label }}</span>
 	</span>
 </template>
@@ -41,17 +41,14 @@ export default {
 		},
 	},
 	computed: {
-		isGroupLabel() {
-			return this.option.$isLabel && this.option.$groupLabel
-		},
 		label() {
 			const option = this.option
 			logger.debug('Option render', { option })
 			if (typeof this.option === 'string') {
 				return this.option
 			}
 
-			return this.option.$groupLabel ? this.option.$groupLabel : this.option.label
+			return this.option.label
 		},
 		colorObject() {
 			return uidToColor(this.label)

src/mixins/EditorMixin.js

@@ -33,7 +33,6 @@ import {
 } from 'vuex'
 import { translate as t } from '@nextcloud/l10n'
 import { removeMailtoPrefix } from '../utils/attendee.js'
-import { loadState } from '@nextcloud/initial-state'
 
 /**
  * This is a mixin for the editor. It contains common Vue stuff, that is
@@ -315,11 +314,6 @@ export default {
 		rfcProps() {
 			return getRFCProperties()
 		},
-		categoryOptions() {
-			const categories = { ...this.rfcProps.categories }
-			categories.options = loadState('calendar', 'categories', [])
-			return categories
-		},
 		/**
 		 * Returns whether or not this event can be downloaded from the server
 		 *

src/views/EditSidebar.vue

@@ -150,9 +150,8 @@
 
 				<PropertySelectMultiple :colored-options="true"
 					:is-read-only="isReadOnly"
-					:prop-model="categoryOptions"
+					:prop-model="rfcProps.categories"
 					:value="categories"
-					:custom-label-heading="t('calendar', 'Custom Categories')"
 					@add-single-value="addCategory"
 					@remove-single-value="removeCategory" />