diff --git a/src/views/user/settings/Caldav.vue b/src/views/user/settings/Caldav.vue
index 6d887a96f..3c7d5a473 100644
--- a/src/views/user/settings/Caldav.vue
+++ b/src/views/user/settings/Caldav.vue
@@ -78,6 +78,16 @@ import Message from '@/components/misc/message.vue'
 import CaldavTokenService from '@/services/caldavToken'
 import CaldavTokenModel from '@/models/caldavToken'
 
+const service = new CaldavTokenService()
+
+async function useToken() {
+	const tokens = ref<CaldavTokenModel[]>([])
+	tokens.value = await service.getAll()
+	return tokens
+}
+
+const tokens = useToken()
+
 const store = useStore()
 const {t} = useI18n()
 
@@ -88,13 +98,6 @@ const caldavEnabled = computed(() => store.state.config.caldavEnabled)
 const isLocalUser = computed(() => store.state.auth.info?.isLocalUser)
 const username = computed(() => store.state.auth.info?.username)
 
-const service = new CaldavTokenService()
-const tokens = ref<CaldavTokenModel[]>([])
-service.getAll()
-	.then((r: CaldavTokenModel[]) => {
-		tokens.value = r
-	})
-
 const newToken = ref(null)
 const createToken = async () => {
 	const r = await service.create({})