feat: use vue-i18n 9 for vue3

src/components/misc/api-config.vue

@@ -23,9 +23,9 @@
 			</div>
 		</div>
 		<div class="api-url-info" v-else>
-			<i18n path="apiConfig.signInOn">
+			<i18n-t keypath="apiConfig.signInOn">
 				<span class="url" v-tooltip="apiUrl"> {{ apiDomain }} </span>
-			</i18n>
+			</i18n-t>
 			<br />
 			<a @click="() => (configureApi = true)">{{ $t('apiConfig.change') }}</a>
 		</div>

src/components/misc/create-edit.vue

@@ -43,6 +43,8 @@
 </template>
 
 <script>
+import { i18n } from '@/i18n'
+
 export default {
 	name: 'create-edit',
 	props: {
@@ -53,7 +55,7 @@ export default {
 		primaryLabel: {
 			type: String,
 			default() {
-				return this.$t('misc.create')
+				return i18n.global.t('misc.create')
 			},
 		},
 		primaryIcon: {

src/components/misc/error.vue

@@ -1,9 +1,9 @@
 <template>
 	<div class="notification is-danger">
-		<i18n path="loadingError.failed">
+		<i18n-t keypath="loadingError.failed">
 			<a @click="() => location.reload()">{{ $t('loadingError.tryAgain') }}</a>
 			<a href="https://vikunja.io/contact/" rel="noreferrer noopener nofollow" target="_blank">{{ $t('loadingError.contact') }}</a>
-		</i18n>
+		</i18n-t>
 	</div>
 </template>