diff --git a/src/components/AppNavigation/CalendarList.vue b/src/components/AppNavigation/CalendarList.vue
index ec1a935db..63de07a12 100644
--- a/src/components/AppNavigation/CalendarList.vue
+++ b/src/components/AppNavigation/CalendarList.vue
@@ -74,7 +74,7 @@
 		</template>
 
 		<NcModal :show.sync="showOrderModal" @close="showOrderModal = false">
-			<CalendarOrderModal />
+			<CalendarOrderModal :passed-calendars="calendars" />
 		</NcModal>
 	</div>
 </template>
diff --git a/src/components/AppNavigation/CalendarList/CalendarOrderModal.vue b/src/components/AppNavigation/CalendarList/CalendarOrderModal.vue
index 6839cd442..ff4e70c93 100644
--- a/src/components/AppNavigation/CalendarList/CalendarOrderModal.vue
+++ b/src/components/AppNavigation/CalendarList/CalendarOrderModal.vue
@@ -50,7 +50,7 @@ import draggable from 'vuedraggable'
 import debounce from 'debounce'
 import { showError } from '@nextcloud/dialogs'
 import pLimit from 'p-limit'
-import { mapStores, mapState } from 'pinia'
+import { mapStores } from 'pinia'
 import useCalendarsStore from '../../../store/calendars.js'
 
 const limit = pLimit(1)
@@ -63,41 +63,44 @@ export default {
 		NcAppNavigationCaption,
 	},
 	props: {
-
+		passedCalendars: {
+			type: Array,
+			required: true,
+		},
 	},
 	data() {
 		return {
 			disableDragging: false,
-			sortedCalendars: {
-				personal: [],
-				shared: [],
-				deck: [],
-				hidden: [],
-			},
+			sortedCalendars: {},
 		}
 	},
 	computed: {
 		...mapStores(useCalendarsStore),
-		...mapState(useCalendarsStore, {
-			serverCalendars: 'sortedCalendarsSubscriptions',
-			calendars: 'calendars',
-		}),
 	},
-	mounted() {
-		this.calendars.forEach((calendar) => {
-			console.log(calendar)
-			if (calendar.isSharedWithMe) {
-				this.sortedCalendars.shared.push(calendar)
-				return
+	watch: {
+		passedCalendars(newVal) {
+			this.calendars = newVal
+			this.sortedCalendars = {
+				personal: [],
+				shared: [],
+				deck: [],
+				hidden: [],
 			}
 
-			if (calendar.url.includes('app-generated--deck--board')) {
-				this.sortedCalendars.deck.push(calendar)
-				return
-			}
+			this.calendars.forEach((calendar) => {
+				if (calendar.isSharedWithMe) {
+					this.sortedCalendars.shared.push(calendar)
+					return
+				}
+
+				if (calendar.url.includes('app-generated--deck--board')) {
+					this.sortedCalendars.deck.push(calendar)
+					return
+				}
 
-			this.sortedCalendars.personal.push(calendar)
-		})
+				this.sortedCalendars.personal.push(calendar)
+			})
+		},
 	},
 	methods: {
 		update: debounce(async function() {
@@ -112,6 +115,8 @@ export default {
 				return newOrderObj
 			}, {})
 
+			this.calendars = currentCalendars
+
 			try {
 				await limit(() => this.calendarsStore.updateCalendarListOrder({ newOrder }))
 			} catch (err) {