Before Vuex

src/components/AddRss.vue

@@ -0,0 +1,25 @@
+<template>
+	<ul>
+		<NcAppNavigationNewItem :title="t('', 'Add a RSS link')">
+			<template #icon>
+				<Plus size="20" />
+			</template>
+		</NcAppNavigationNewItem>
+	</ul>
+</template>
+
+<script>
+import { NcAppNavigationNewItem } from '@nextcloud/vue'
+import Plus from 'vue-material-design-icons/Plus.vue'
+
+export default {
+	name: 'AddRss',
+	components: {
+		NcAppNavigationNewItem,
+		Plus,
+	},
+	methods: {
+
+	},
+}
+</script>

src/components/Top.vue

@@ -37,8 +37,6 @@ export default {
 			showMore: true,
 		}
 	},
-	computed: {
-	},
 	async mounted() {
 		await this.fetch(10)
 	},

src/views/Discover.vue

@@ -6,29 +6,22 @@
 			</NcTextField>
 		</p>
 		<Top v-if="!search" />
-		<ul v-if="!search">
+		<AddRss v-if="!search" />
-			<NcAppNavigationNewItem :title="t('', 'Add a RSS link')">
-				<template #icon>
-					<Plus size="20" />
-				</template>
-			</NcAppNavigationNewItem>
-		</ul>
 	</div>
 </template>
 
 <script>
-import { NcAppNavigationNewItem, NcTextField } from '@nextcloud/vue'
+import AddRss from '../components/AddRss.vue'
 import Magnify from 'vue-material-design-icons/Magnify.vue'
-import Plus from 'vue-material-design-icons/Plus.vue'
+import { NcTextField } from '@nextcloud/vue'
 import Top from '../components/Top.vue'
 
 export default {
 	name: 'Discover',
 	components: {
+		AddRss,
 		Magnify,
-		NcAppNavigationNewItem,
 		NcTextField,
-		Plus,
 		Top,
 	},
 	data() {

src/views/Index.vue

@@ -11,7 +11,7 @@
 				</router-link>
 				<NcLoadingIcon v-if="loading" />
 				<ul v-if="!loading">
-					<NcAppNavigationItem v-for="subscription in subscriptions"
+					<NcAppNavigationItem v-for="subscription in sortedSubscriptions"
 						:key="subscription.id"
 						:loading="subscription.loading"
 						:title="subscription.title ?? subscription.url">
@@ -59,6 +59,14 @@ export default {
 			loading: true,
 		}
 	},
+	computed: {
+		sortedSubscriptions() {
+			return this.subscriptions.concat().sort((a, b) => {
+				if (a.title && b.title) return a.title.localeCompare(b.title)
+				return a.id - b.id
+			})
+		},
+	},
 	async mounted() {
 		try {
 			const metrics = await axios.get(generateUrl('/apps/gpoddersync/personal_settings/metrics'))
@@ -87,11 +95,6 @@ export default {
 			} else {
 				this.subscriptions[subscriptionId] = subscription
 			}
-
-			this.subscriptions.sort((a, b) => {
-				if (a.title && b.title) return a.title.localeCompare(b.title)
-				return a.id - b.id
-			})
 		},
 		async updateSubscriptionMeta(subscription) {
 			try {