From f6f98a70039b0ebb13bd8f9665e2b9e0b20cff59 Mon Sep 17 00:00:00 2001
From: Michel Roux <xefir@crystalyx.net>
Date: Tue, 25 Jul 2023 22:07:35 +0200
Subject: [PATCH] Pic does something

---
 src/components/TopItem.vue              | 49 +++++++++++++++++++++++++
 src/components/{Top.vue => TopList.vue} | 11 ++----
 src/views/Discover.vue                  |  6 +--
 3 files changed, 56 insertions(+), 10 deletions(-)
 create mode 100644 src/components/TopItem.vue
 rename src/components/{Top.vue => TopList.vue} (91%)

diff --git a/src/components/TopItem.vue b/src/components/TopItem.vue
new file mode 100644
index 0000000..be01966
--- /dev/null
+++ b/src/components/TopItem.vue
@@ -0,0 +1,49 @@
+<template>
+	<a @click="addSubscription">
+		<img :src="imgUrl" :alt="author" :title="author">
+	</a>
+</template>
+
+<script>
+import axios from '@nextcloud/axios'
+import { generateUrl } from '@nextcloud/router'
+import { showError } from '@nextcloud/dialogs'
+
+export default {
+	name: 'TopItem',
+	components: {},
+	props: {
+		xmlUrl: {
+			type: String,
+			required: true,
+		},
+		imgUrl: {
+			type: String,
+			required: true,
+		},
+		author: {
+			type: String,
+			required: true,
+		},
+	},
+	methods: {
+		async addSubscription() {
+			try {
+				await axios.post(generateUrl('/apps/gpoddersync/subscription_change/create'), { add: [this.xmlUrl], remove: [] })
+			} catch (e) {
+				console.error(e)
+				showError(t('Error while adding the feed'))
+			}
+
+			this.$store.dispatch('subscriptions/fetch')
+		},
+	},
+}
+</script>
+
+<style scoped>
+	img {
+		height: 100%;
+		width: 100%;
+	}
+</style>
diff --git a/src/components/Top.vue b/src/components/TopList.vue
similarity index 91%
rename from src/components/Top.vue
rename to src/components/TopList.vue
index b8fd63b..87e3ff7 100644
--- a/src/components/Top.vue
+++ b/src/components/TopList.vue
@@ -12,7 +12,7 @@
 			<NcLoadingIcon v-if="loading" />
 			<ul v-if="!loading" class="tops">
 				<li v-for="top in tops" :key="top.id">
-					<img :src="top.imgURL" :alt="top.author" :title="top.author">
+					<TopItem :xml-url="top.xmlURL" :img-url="top.imgURL" :author="top.author" />
 				</li>
 			</ul>
 			<span class="caption">{{ t('Suggests by fyyd') }}</span>
@@ -22,15 +22,17 @@
 
 <script>
 import { NcLoadingIcon, NcSelect } from '@nextcloud/vue'
+import TopItem from './TopItem.vue'
 import axios from '@nextcloud/axios'
 import { generateUrl } from '@nextcloud/router'
 import { showError } from '@nextcloud/dialogs'
 
 export default {
-	name: 'Top',
+	name: 'TopList',
 	components: {
 		NcLoadingIcon,
 		NcSelect,
+		TopItem,
 	},
 	data() {
 		return {
@@ -72,11 +74,6 @@ export default {
 		flex-basis: 15%;
 	}
 
-	.tops li img {
-		height: 100%;
-		width: 100%;
-	}
-
 	.select {
 		min-width: 160px;
 	}
diff --git a/src/views/Discover.vue b/src/views/Discover.vue
index 587d736..414d0cb 100644
--- a/src/views/Discover.vue
+++ b/src/views/Discover.vue
@@ -5,7 +5,7 @@
 				<Magnify :size="20" />
 			</NcTextField>
 		</p>
-		<Top v-if="!search" />
+		<TopList v-if="!search" />
 		<AddRss v-if="!search" />
 	</div>
 </template>
@@ -14,7 +14,7 @@
 import AddRss from '../components/AddRss.vue'
 import Magnify from 'vue-material-design-icons/Magnify.vue'
 import { NcTextField } from '@nextcloud/vue'
-import Top from '../components/Top.vue'
+import TopList from '../components/TopList.vue'
 
 export default {
 	name: 'Discover',
@@ -22,7 +22,7 @@ export default {
 		AddRss,
 		Magnify,
 		NcTextField,
-		Top,
+		TopList,
 	},
 	data() {
 		return {