Upgrade component names

Signed-off-by: Joas Schilling <[email protected]>

src/components/Activity.vue

@@ -21,7 +21,7 @@
 
 <template>
 	<li class="activity-entry">
-		<Avatar :class="[applyMonochromeIconColor, 'activity-entry__icon', 'activity-icon']"
+		<NcAvatar :class="[applyMonochromeIconColor, 'activity-entry__icon', 'activity-icon']"
 			:disable-menu="true"
 			:disable-tooltip="true"
 			:url="activity.icon"
@@ -37,8 +37,8 @@
 </template>
 
 <script>
-import Avatar from '@nextcloud/vue/dist/Components/Avatar.js'
-import UserBubble from '@nextcloud/vue/dist/Components/UserBubble.js'
+import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js'
+import NcUserBubble from '@nextcloud/vue/dist/Components/NcUserBubble.js'
 import RichText from '@juliushaertl/vue-richtext'
 import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip.js'
 
@@ -60,7 +60,7 @@ import OpenGraphRichArgument from './richArgumentsTypes/OpenGraphRichArgument.vu
 export default {
 	name: 'Activity',
 	components: {
-		Avatar,
+		NcAvatar,
 		RichText,
 	},
 	directives: {
@@ -158,12 +158,12 @@ export default {
 				}
 			case 'user':
 				return {
-					component: UserBubble,
+					component: NcUserBubble,
 					props: { displayName: richObject.name, user: richObject.id, url: richObject.link },
 				}
 			case 'group':
 				return {
-					component: UserBubble,
+					component: NcUserBubble,
 					props: {
 						avatarImage: 'icon-group',
 						displayName: richObject.name,

src/views/ActivityTab.vue

@@ -23,9 +23,11 @@
 <template>
 	<div :class="{ 'icon-loading': loading }">
 		<!-- error message -->
-		<EmptyContent v-if="error" icon="icon-error">
-			{{ error }}
-		</EmptyContent>
+		<NcEmptyContent v-if="error" :title="error">
+			<template #icon>
+				<span class="icon-error"></span>
+			</template>
+		</NcEmptyContent>
 		<template v-else>
 			<!-- activities content -->
 			<ul>
@@ -34,17 +36,20 @@
 					:activity="activity" />
 			</ul>
 
-			<EmptyContent v-if="activities.length === 0 && !loading" icon="icon-activity">
-				{{ t('activity', 'No activity yet') }}
-			</EmptyContent>
+			<NcEmptyContent v-if="activities.length === 0 && !loading"
+				:title="t('activity', 'No activity yet')">
+				<template #icon>
+					<span class="icon-activity"></span>
+				</template>
+			</NcEmptyContent>
 		</template>
 	</div>
 </template>
 
 <script>
 import { generateOcsUrl } from '@nextcloud/router'
 import axios from '@nextcloud/axios'
-import EmptyContent from '@nextcloud/vue/dist/Components/EmptyContent.js'
+import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
 
 import Activity from '../components/Activity.vue'
 import ActivityModel from '../models/ActivityModel.js'
@@ -55,7 +60,7 @@ export default {
 	name: 'ActivityTab',
 	components: {
 		Activity,
-		EmptyContent,
+		NcEmptyContent,
 	},
 	data() {
 		return {
@@ -135,3 +140,11 @@ export default {
 	},
 }
 </script>
+
+<style scoped lang="scss">
+::v-deep .empty-content__icon span {
+	background-size: 64px;
+	width: 64px;
+	height: 64px;
+}
+</style>

src/views/AdminSettings.vue

@@ -19,25 +19,25 @@
   -->
 
 <template>
-	<SettingsSection :title="t('activity', 'Notification')">
-		<CheckboxRadioSwitch type="checkbox"
+	<NcSettingsSection :title="t('activity', 'Notification')">
+		<NcCheckboxRadioSwitch type="checkbox"
 			:checked="emailEnabled"
 			@update:checked="toggleEmailEnabled({emailEnabled: $event})">
 			{{ t('activity', 'Enable notification emails') }}
-		</CheckboxRadioSwitch>
-	</SettingsSection>
+		</NcCheckboxRadioSwitch>
+	</NcSettingsSection>
 </template>
 
 <script>
 import { mapActions, mapState } from 'vuex'
-import CheckboxRadioSwitch from '@nextcloud/vue/dist/Components/CheckboxRadioSwitch.js'
-import SettingsSection from '@nextcloud/vue/dist/Components/SettingsSection.js'
+import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
+import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
 
 export default {
 	name: 'AdminSettings',
 	components: {
-		CheckboxRadioSwitch,
-		SettingsSection,
+		NcCheckboxRadioSwitch,
+		NcSettingsSection,
 	},
 
 	computed: {

src/views/DailySummary.vue

@@ -1,21 +1,21 @@
 <template>
-	<SettingsSection :title="t('activity', 'Daily activity summary')">
-		<CheckboxRadioSwitch :checked="activityDigestEnabled" @update:checked="toggleActivityDigestEnabled({activityDigestEnabled: $event})">
+	<NcSettingsSection :title="t('activity', 'Daily activity summary')">
+		<NcCheckboxRadioSwitch :checked="activityDigestEnabled" @update:checked="toggleActivityDigestEnabled({activityDigestEnabled: $event})">
 			{{ t('activity', 'Send daily activity summary in the morning') }}
-		</CheckboxRadioSwitch>
-	</SettingsSection>
+		</NcCheckboxRadioSwitch>
+	</NcSettingsSection>
 </template>
 
 <script>
-import CheckboxRadioSwitch from '@nextcloud/vue/dist/Components/CheckboxRadioSwitch.js'
-import SettingsSection from '@nextcloud/vue/dist/Components/SettingsSection.js'
+import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
+import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
 import { mapActions, mapState } from 'vuex'
 
 export default {
 	name: 'DailySummary',
 	components: {
-		CheckboxRadioSwitch,
-		SettingsSection,
+		NcCheckboxRadioSwitch,
+		NcSettingsSection,
 	},
 
 	computed: {

src/views/DefaultActivitySettings.vue

@@ -19,22 +19,22 @@
   -->
 
 <template>
-	<SettingsSection :title="t('activity', 'Default settings')"
+	<NcSettingsSection :title="t('activity', 'Default settings')"
 		:description="t('activity', 'Configure the default notification settings for new users.')">
 		<ActivityGrid />
-	</SettingsSection>
+	</NcSettingsSection>
 </template>
 
 <script>
 import { mapActions, mapState } from 'vuex'
-import SettingsSection from '@nextcloud/vue/dist/Components/SettingsSection.js'
+import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
 import ActivityGrid from '../components/ActivityGrid.vue'
 
 export default {
 	name: 'DefaultActivitySettings',
 	components: {
 		ActivityGrid,
-		SettingsSection,
+		NcSettingsSection,
 	},
 
 	computed: {

src/views/UserSettings.vue

@@ -19,23 +19,23 @@
   -->
 
 <template>
-	<SettingsSection :title="t('activity', 'Activity')"
+	<NcSettingsSection :title="t('activity', 'Activity')"
 		:description="settingDescription">
 		<ActivityGrid />
 		<EmailSettings />
-	</SettingsSection>
+	</NcSettingsSection>
 </template>
 
 <script>
 import { mapActions, mapState } from 'vuex'
-import SettingsSection from '@nextcloud/vue/dist/Components/SettingsSection.js'
+import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
 import EmailSettings from '../components/EmailSettings.vue'
 import ActivityGrid from '../components/ActivityGrid.vue'
 
 export default {
 	name: 'UserSettings',
 	components: {
-		SettingsSection,
+		NcSettingsSection,
 		EmailSettings,
 		ActivityGrid,
 	},