From 87315b1221d6c08ee612053d57948d8d0c461e34 Mon Sep 17 00:00:00 2001
From: Michel Roux <xefir@crystalyx.net>
Date: Mon, 29 Jan 2024 16:06:54 +0100
Subject: [PATCH] feat: better display the reading status for episodes (in
 episodes list / podcast section) (close #51)

---
 src/components/Feed/Episodes.vue | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/Feed/Episodes.vue b/src/components/Feed/Episodes.vue
index 0e699b2..a04b11c 100644
--- a/src/components/Feed/Episodes.vue
+++ b/src/components/Feed/Episodes.vue
@@ -19,6 +19,11 @@
 				<template #subname>
 					{{ episode.duration }}
 				</template>
+				<template #indicator>
+					<NcProgressBar v-if="episode.action && episode.action.action === 'PLAY'"
+						class="progress"
+						:value="episode.action.position * 100 / episode.action.total" />
+				</template>
 				<template #actions>
 					<NcActionButton v-if="!isCurrentEpisode(episode)" @click="load(episode)">
 						<template #icon>
@@ -48,7 +53,7 @@
 </template>
 
 <script>
-import { NcActionButton, NcAvatar, NcListItem, NcModal } from '@nextcloud/vue'
+import { NcActionButton, NcAvatar, NcListItem, NcModal, NcProgressBar } from '@nextcloud/vue'
 import Loading from '../Atoms/Loading.vue'
 import Modal from '../Atoms/Modal.vue'
 import PlayButton from 'vue-material-design-icons/Play.vue'
@@ -68,6 +73,7 @@ export default {
 		NcAvatar,
 		NcListItem,
 		NcModal,
+		NcProgressBar,
 		PlayButton,
 		StopButton,
 	},
@@ -121,4 +127,8 @@ export default {
 	.ended {
 		opacity: .4;
 	}
+
+	.progress {
+		margin-top: .4rem;
+	}
 </style>