Upgrade to Nextcloud vue 8.0.0

Signed-off-by: greta <[email protected]>

package.json

@@ -52,7 +52,7 @@
     "@nextcloud/paths": "^2.1.0",
     "@nextcloud/router": "^2.2.0",
     "@nextcloud/sharing": "^0.1.0",
-    "@nextcloud/vue": "^7.12.6",
+    "@nextcloud/vue": "^8.0.0",
     "b64-to-blob": "^1.2.19",
     "camelcase": "^8.0.0",
     "d3": "^7.8.5",

src/components/AppContent/CircleContent.vue

@@ -22,15 +22,15 @@
 
 <template>
 	<AppContent v-if="!circle">
-		<EmptyContent :title="t('contacts', 'Please select a circle')">
+		<EmptyContent :name="t('contacts', 'Please select a circle')">
 			<template #icon>
 				<IconCircles :size="20" />
 			</template>
 		</EmptyContent>
 	</AppContent>
 
 	<AppContent v-else-if="loading">
-		<EmptyContent :title="t('contacts', 'Loading circle …')">
+		<EmptyContent :name="t('contacts', 'Loading circle …')">
 			<template #icon>
 				<IconLoading :size="20" />
 			</template>
@@ -50,13 +50,13 @@
 			<!-- not a member -->
 			<template v-if="!circle.isMember">
 				<!-- Pending request validation -->
-				<EmptyContent v-if="circle.isPendingMember" :title="t('contacts', 'Your request to join this circle is pending approval')">
+				<EmptyContent v-if="circle.isPendingMember" :name="t('contacts', 'Your request to join this circle is pending approval')">
 					<template #icon>
 						<IconLoading :size="20" />
 					</template>
 				</EmptyContent>
 
-				<EmptyContent v-else :title="t('contacts', 'You are not a member of {circle}', { circle: circle.displayName})">
+				<EmptyContent v-else :name="t('contacts', 'You are not a member of {circle}', { circle: circle.displayName})">
 					<template #icon>
 						<IconCircles :size="20" />
 					</template>

src/components/AppContent/ContactsContent.vue

@@ -22,15 +22,15 @@
 
 <template>
 	<AppContent v-if="loading">
-		<EmptyContent :title="t('contacts', 'Loading contacts …')">
+		<EmptyContent :name="t('contacts', 'Loading contacts …')">
 			<template #icon>
 				<IconLoading :size="20" />
 			</template>
 		</EmptyContent>
 	</AppContent>
 
 	<AppContent v-else-if="isEmptyGroup && !isRealGroup">
-		<EmptyContent :title="t('contacts', 'There are no contacts yet')">
+		<EmptyContent :name="t('contacts', 'There are no contacts yet')">
 			<template #icon>
 				<IconContact :size="20" />
 			</template>
@@ -43,7 +43,7 @@
 	</AppContent>
 
 	<AppContent v-else-if="isEmptyGroup && isRealGroup">
-		<EmptyContent :title=" t('contacts', 'There are no contacts in this group')">
+		<EmptyContent :name=" t('contacts', 'There are no contacts in this group')">
 			<template #icon>
 				<IconContact :size="20" />
 			</template>

src/components/AppNavigation/CircleNavigationItem.vue

@@ -21,7 +21,7 @@
   -->
 <template>
 	<AppNavigationItem :key="circle.key"
-		:title="circle.displayName"
+		:name="circle.displayName"
 		:to="circle.router">
 		<template #icon>
 			<AccountStar v-if="circle.isOwner" :size="20" />

src/components/AppNavigation/ContactsSettings.vue

@@ -22,10 +22,10 @@
 
 <template>
 	<AppSettingsDialog id="app-settings-dialog"
-		:title="t('contacts', 'Contacts settings')"
+		:name="t('contacts', 'Contacts settings')"
 		:show-navigation="true"
 		:open.sync="showSettings">
-		<AppSettingsSection id="general-settings" :title="t('contacts', 'General settings')">
+		<AppSettingsSection id="general-settings" :name="t('contacts', 'General settings')">
 			<CheckboxRadioSwitch :checked="enableSocialSync"
 				:loading="enableSocialSyncLoading"
 				:disabled="enableSocialSyncLoading"
@@ -40,7 +40,7 @@
 			</CheckboxRadioSwitch>
 			<SettingsSortContacts class="contacts-settings-modal__form__row" />
 		</AppSettingsSection>
-		<AppSettingsSection id="address-books" :title="t('contacts', 'Address books')">
+		<AppSettingsSection id="address-books" :name="t('contacts', 'Address books')">
 			<div class="contacts-settings-modal__form">
 				<div class="contacts-settings-modal__form__row">
 					<ul id="addressbook-list" class="addressbook-list">

src/components/AppNavigation/GroupNavigationItem.vue

@@ -22,7 +22,7 @@
 <template>
 	<AppNavigationItem :key="group.key"
 		:to="group.router"
-		:title="group.name">
+		:name="group.name">
 		<template #icon>
 			<IconContact :size="20" />
 		</template>

src/components/AppNavigation/RootNavigation.vue

@@ -34,7 +34,7 @@
 		<template #list>
 			<!-- All contacts group -->
 			<AppNavigationItem id="everyone"
-				:title="GROUP_ALL_CONTACTS"
+				:name="GROUP_ALL_CONTACTS"
 				:to="{
 					name: 'group',
 					params: { selectedGroup: GROUP_ALL_CONTACTS },
@@ -52,7 +52,7 @@
 			<!-- Organization chart -->
 			<AppNavigationItem v-if="existChart"
 				id="chart"
-				:title="CHART_ALL_CONTACTS"
+				:name="CHART_ALL_CONTACTS"
 				:to="{
 					name: 'chart',
 					params: { selectedChart: GROUP_ALL_CONTACTS },
@@ -62,7 +62,7 @@
 			<!-- Not grouped group -->
 			<AppNavigationItem v-if="ungroupedContacts.length > 0"
 				id="notgrouped"
-				:title="GROUP_NO_GROUP_CONTACTS"
+				:name="GROUP_NO_GROUP_CONTACTS"
 				:to="{
 					name: 'group',
 					params: { selectedGroup: GROUP_NO_GROUP_CONTACTS },
@@ -80,7 +80,7 @@
 			<!-- Recently contacted group -->
 			<AppNavigationItem v-if="isContactsInteractionEnabled && recentlyContactedContacts && recentlyContactedContacts.contacts.length > 0"
 				id="recentlycontacted"
-				:title="GROUP_RECENTLY_CONTACTED"
+				:name="GROUP_RECENTLY_CONTACTED"
 				:to="{
 					name: 'group',
 					params: { selectedGroup: GROUP_RECENTLY_CONTACTED },
@@ -98,7 +98,7 @@
 			<AppNavigationCaption id="newgroup"
 				:force-menu="true"
 				:menu-open.sync="isNewGroupMenuOpen"
-				:title="t('contacts', 'Contact groups')"
+				:name="t('contacts', 'Contact groups')"
 				@click.prevent.stop="toggleNewGroupMenu">
 				<template #actionsTriggerIcon>
 					<IconAdd :size="20" />
@@ -125,14 +125,14 @@
 			<template v-if="isCirclesEnabled">
 				<!-- Toggle groups ellipsis -->
 				<AppNavigationItem v-if="groupsMenu.length > ELLIPSIS_COUNT"
-					:title="collapseGroupsTitle"
+					:name="collapseGroupsTitle"
 					class="app-navigation__collapse"
 					icon=""
 					@click="onToggleGroups" />
 
 				<!-- New circle button caption and modal -->
 				<AppNavigationCaption id="newcircle"
-					:title="t('contacts', 'Circles')">
+					:name="t('contacts', 'Circles')">
 					<template #actions>
 						<NcActionButton @click="toggleNewCircleModal">
 							<template #icon>
@@ -155,7 +155,7 @@
 
 					<!-- Toggle circles ellipsis -->
 					<AppNavigationItem v-if="circlesMenu.length > ELLIPSIS_COUNT"
-						:title="collapseCirclesTitle"
+						:name="collapseCirclesTitle"
 						class="app-navigation__collapse"
 						icon=""
 						@click="onToggleCircles" />

src/components/AppNavigation/Settings/SettingsAddressbook.vue

@@ -26,7 +26,7 @@
 		<li :class="{'addressbook--disabled': !addressbook.enabled}" class="addressbook">
 			<div class="addressbook__content">
 				<!-- addressbook name -->
-				<span class="addressbook__name" :title="addressbook.displayName">
+				<span class="addressbook__name" :name="addressbook.displayName">
 					{{ addressbook.enabled ? addressbook.displayName : t('contacts', '{addressbookname} (Disabled)', {addressbookname: addressbook.displayName}) }}
 				</span>
 
@@ -44,7 +44,7 @@
 			<Button v-if="!addressbook.readOnly"
 				v-tooltip.top="sharedWithTooltip"
 				:class="{'addressbook__share--shared': hasShares}"
-				:title="sharedWithTooltip"
+				:name="sharedWithTooltip"
 				href="#"
 				class="addressbook__share"
 				@click="toggleShare">

src/components/AppNavigation/Settings/SettingsImportContacts.vue

@@ -32,7 +32,7 @@
 			<Modal v-if="isOpened"
 				ref="modal"
 				class="import-contact__modal"
-				:title="t('contacts', 'Import contacts')"
+				:name="t('contacts', 'Import contacts')"
 				@close="toggleModal">
 				<section class="import-contact__modal-addressbook">
 					<h2>{{ t('contacts', 'Import contacts') }}</h2>

src/components/ContactDetails.vue

@@ -25,7 +25,7 @@
 	<AppContentDetails>
 		<!-- nothing selected or contact not found -->
 		<EmptyContent v-if="!contact"
-			:title="t('contacts', 'No contact selected')"
+			:name="t('contacts', 'No contact selected')"
 			:description="t('contacts', 'Select a contact on the list to begin')">
 			<template #icon>
 				<IconContact :size="20" />
@@ -188,7 +188,7 @@
 				id="qrcode-modal"
 				size="small"
 				:clear-view-delay="-1"
-				:title="contact.displayName"
+				:name="contact.displayName"
 				:close-button-contained="false"
 				@close="closeQrModal">
 				<img :src="`data:image/svg+xml;base64,${qrcode}`"
@@ -201,7 +201,7 @@
 			<Modal v-if="showPickAddressbookModal"
 				id="pick-addressbook-modal"
 				:clear-view-delay="-1"
-				:title="t('contacts', 'Pick an address book')"
+				:name="t('contacts', 'Pick an address book')"
 				@close="closePickAddressbookModal">
 				<NcSelect ref="pickAddressbook"
 					v-model="pickedAddressbook"
@@ -253,12 +253,12 @@
 					</Actions>
 					<NcButton v-if="isTalkEnabled && isInSystemAddressBook"
 						:aria-label="(t('contacts', 'Go to talk conversation'))"
-						:title="(t('contacts', 'Go to talk conversation'))"
+						:name="(t('contacts', 'Go to talk conversation'))"
 						class="icon-talk"
 						:href="callUrl" />
 					<NcButton v-if="profilePageLink"
 						:aria-label="(t('contacts','View profile'))"
-						:title="(t('contacts','View profile'))"
+						:name="(t('contacts','View profile'))"
 						:href="profilePageLink">
 						<template #icon>
 							<IconAccount :size="20" />

src/components/ContactsList/ContactsListItem.vue

@@ -2,7 +2,7 @@
 	<ListItem :id="id"
 		:key="source.key"
 		class="list-item-style envelope"
-		:title="source.displayName"
+		:name="source.displayName"
 		:to="{ name: 'contact', params: { selectedGroup: selectedGroup, selectedContact: source.key } }">
 		<!-- @slot Icon slot -->
 

src/components/EntityPicker/EntityPicker.vue

@@ -36,7 +36,7 @@
 			</div>
 
 			<!-- Loading -->
-			<EmptyContent v-if="loading" :title="t('contacts', 'Loading …')">
+			<EmptyContent v-if="loading" :name="t('contacts', 'Loading …')">
 				<template #icon>
 					<IconLoading :size="20" />
 				</template>
@@ -55,7 +55,7 @@
 				</transition-group>
 
 				<!-- No recommendations -->
-				<EmptyContent v-if="dataSet.length === 0" :title="t('contacts', 'Search for people to add')">
+				<EmptyContent v-if="dataSet.length === 0" :name="t('contacts', 'Search for people to add')">
 					<template #icon>
 						<IconSearch :size="20" />
 					</template>
@@ -70,7 +70,7 @@
 					:estimate-size="44"
 					:extra-props="{ selection: selectionSet, onClick }" />
 
-				<EmptyContent v-else-if="searchQuery" :title="t('contacts', 'No results')">
+				<EmptyContent v-else-if="searchQuery" :name="t('contacts', 'No results')">
 					<template #icon>
 						<IconSearch :size="20" />
 					</template>

src/components/MemberList.vue

@@ -23,21 +23,21 @@
 <template>
 	<AppContentList v-if="!hasMembers" class="members-list">
 		<template v-if="loading">
-			<EmptyContent :title="t('contacts', 'Loading members list …')">
+			<EmptyContent :name="t('contacts', 'Loading members list …')">
 				<template #icon>
 					<IconLoading :size="20" />
 				</template>
 			</EmptyContent>
 		</template>
 		<template v-else-if="!circle.isMember">
-			<EmptyContent :title="t('contacts', 'The list of members is only visible to members of this circle')">
+			<EmptyContent :name="t('contacts', 'The list of members is only visible to members of this circle')">
 				<template #icon>
 					<IconContact :size="20" />
 				</template>
 			</EmptyContent>
 		</template>
 		<template v-else>
-			<EmptyContent :title="t('contacts', 'You currently have no access to the member list')">
+			<EmptyContent :name="t('contacts', 'You currently have no access to the member list')">
 				<template #icon>
 					<IconContact :size="20" />
 				</template>

src/components/MembersList/MembersListItem.vue

@@ -31,7 +31,7 @@
 		:avatar-size="44"
 		:is-no-user="!source.isUser"
 		:subtitle="levelName"
-		:title="source.displayName"
+		:name="source.displayName"
 		:user="source.userId"
 		class="members-list__item">
 		<!-- Accept invite -->

src/components/ProcessingScreen.vue

@@ -1,7 +1,7 @@
 <template>
 	<div>
 		<EmptyContent :description="desc"
-			:title="title"
+			:name="title"
 			class="processing-screen__wrapper">
 			<template #icon>
 				<IconContact :size="20" />

src/components/Properties/PropertyDateTime.vue

@@ -58,7 +58,7 @@
 
 			<div class="property__value">
 				<!-- Real input where the picker shows -->
-				<DatetimePicker v-if="!isReadOnly"
+				<DateTimePicker v-if="!isReadOnly"
 					:value="vcardTimeLocalValue.toJSDate()"
 					:minute-step="10"
 					:lang="lang"
@@ -89,7 +89,7 @@
 import debounce from 'debounce'
 import moment from 'moment'
 import {
-	NcDatetimePicker as DatetimePicker,
+	NcDateTimePicker as DateTimePicker,
 	NcSelect,
 } from '@nextcloud/vue'
 import { getLocale } from '@nextcloud/l10n'
@@ -104,7 +104,7 @@ export default {
 
 	components: {
 		NcSelect,
-		DatetimePicker,
+		DateTimePicker,
 		PropertyTitle,
 		PropertyActions,
 	},

src/views/Processing/ImportView.vue

@@ -25,7 +25,7 @@
 		<ProcessingScreen :progress="progress"
 			:total="total"
 			:desc="failed > 0 ? importFailed : ''"
-			:title="total === progress
+			:name="total === progress
 				? importedHeader
 				: importingHeader" />
 		<div class="close__button">