refactor: remove usage of this._uid in Vue components

src/components/AppNavigation/CalendarList.vue

@@ -117,7 +117,7 @@
 		<NcAppNavigationSpacer />
 
 		<!-- The header slot must be placed here, otherwise vuedraggable adds undefined as item to the array -->
 		<template>
 			<CalendarListItemLoadingPlaceholder v-if="loadingCalendars" />
 		</template>
 	</div>
@@ -190,10 +190,6 @@
 			serverCalendars: 'sortedCalendarsSubscriptions',
 		}),
 
-		loadingKeyCalendars() {
-			return this._uid + '-loading-placeholder-calendars'
-		},
-
 		isDelegationSupported() {
 			return isAfterVersion(34)
 		},

src/components/AppNavigation/EditCalendarModal/ShareItem.vue

@@ -85,9 +85,6 @@ export default {
 
 	computed: {
 		...mapStores(useCalendarsStore, usePrincipalsStore),
-		uid() {
-			return this._uid
-		},
 
 		/**
 		 * @return {string}

src/components/Editor/FreeBusy/FreeBusy.vue

@@ -271,6 +271,7 @@ import { isRTL } from '@nextcloud/l10n'
 import { NcActionButton, NcActions, NcButton, NcDateTimePickerNative, NcListItemIcon, NcModal, NcPopover, NcSelect, NcUserBubble } from '@nextcloud/vue'
 import { useIsMobile } from '@nextcloud/vue/composables/useIsMobile'
 import { mapState } from 'pinia'
+import { useId } from 'vue'
 import CheckIcon from 'vue-material-design-icons/Check.vue'
 import ChevronLeftIcon from 'vue-material-design-icons/ChevronLeft.vue'
 import ChevronRightIcon from 'vue-material-design-icons/ChevronRight.vue'
@@ -378,7 +379,8 @@ export default {
 
 	setup() {
 		const isMobile = useIsMobile()
-		return { isMobile }
+		const uniqueComponentId = useId()
+		return { isMobile, uniqueComponentId }
 	},
 
 	data() {
@@ -466,7 +468,7 @@ export default {
 			const organizer = new AttendeeProperty('ATTENDEE', this.organizer.attendeeProperty.email)
 			organizer.commonName = this.organizer.attendeeProperty.commonName
 			return [...attendees, organizer].map((a) => freeBusyEventSource(
-				this._uid,
+				this.uniqueComponentId,
 				this.organizer.attendeeProperty,
 				a,
 			))

src/components/Editor/FreeBusy/RoomAvailabilityModal.vue

@@ -75,6 +75,7 @@ import resourceTimelinePlugin from '@fullcalendar/resource-timeline'
 import FullCalendar from '@fullcalendar/vue3'
 import { NcButton, NcDateTimePickerNative, NcModal, NcPopover } from '@nextcloud/vue'
 import { mapState } from 'pinia'
+import { useId } from 'vue'
 import ChevronLeftIcon from 'vue-material-design-icons/ChevronLeft.vue'
 import ChevronRightIcon from 'vue-material-design-icons/ChevronRight.vue'
 import HelpCircleIcon from 'vue-material-design-icons/HelpCircleOutline.vue'
@@ -137,6 +138,11 @@ export default {
 		},
 	},
 
+	setup() {
+		const uniqueComponentId = useId()
+		return { uniqueComponentId }
+	},
+
 	data() {
 		return {
 			currentDate: this.startDate,
@@ -181,12 +187,12 @@ export default {
 		eventSources() {
 			return [
 				freeBusyResourceEventSource(
-					this._uid,
+					this.uniqueComponentId,
 					this.organizer.attendeeProperty,
 					this.attendees.map((a) => a.attendeeProperty),
 				),
 				freeBusyFakeBlockingEventSource(
-					this._uid,
+					this.uniqueComponentId,
 					this.resources,
 					this.currentStart,
 					this.currentEnd,

src/components/Editor/Repeat/RepeatFreqMonthlyOptions.vue

@@ -52,6 +52,7 @@ import {
 	NcButton,
 	NcCheckboxRadioSwitch,
 } from '@nextcloud/vue'
+import { useId } from 'vue'
 import RepeatFirstLastSelect from './RepeatFirstLastSelect.vue'
 import RepeatOnTheSelect from './RepeatOnTheSelect.vue'
 
@@ -81,6 +82,11 @@ export default {
 		},
 	},
 
+	setup() {
+		const radioInputId = useId() + '-radio-select'
+		return { radioInputId }
+	},
+
 	computed: {
 		/**
 		 * @return {object[]}
@@ -105,13 +111,6 @@ export default {
 		byMonthDayEnabled() {
 			return this.byMonthDay.length > 0
 		},
-
-		/**
-		 * @return {string}
-		 */
-		radioInputId() {
-			return this._uid + '-radio-select'
-		},
 	},
 
 	methods: {

src/components/Editor/Repeat/RepeatFreqYearlyOptions.vue

@@ -65,6 +65,7 @@ import {
 	NcButton,
 	NcCheckboxRadioSwitch,
 } from '@nextcloud/vue'
+import { useId } from 'vue'
 import RepeatFirstLastSelect from './RepeatFirstLastSelect.vue'
 import RepeatOnTheSelect from './RepeatOnTheSelect.vue'
 
@@ -99,6 +100,11 @@ export default {
 		},
 	},
 
+	setup() {
+		const radioInputId = useId() + '-radio-select'
+		return { radioInputId }
+	},
+
 	computed: {
 		/**
 		 * @return {object[]}
@@ -134,13 +140,6 @@ export default {
 		byMonthDayEnabled() {
 			return this.byMonthDay.length > 0
 		},
-
-		/**
-		 * @return {string}
-		 */
-		radioInputId() {
-			return this._uid + '-radio-select'
-		},
 	},
 
 	methods: {