151 lines
3.6 KiB
Vue
151 lines
3.6 KiB
Vue
<template>
|
|
<NcAppNavigationItem
|
|
:loading="loading"
|
|
:name="feed?.data?.title || url"
|
|
:to="toFeedUrl(url)">
|
|
<template #actions>
|
|
<NcActionButton
|
|
:aria-label="t('repod', 'Favorite')"
|
|
:model-value="feed?.isFavorite"
|
|
:name="t('repod', 'Favorite')"
|
|
:title="t('repod', 'Favorite')"
|
|
@update:modelValue="switchFavorite($event)">
|
|
<template #icon>
|
|
<StarPlusIcon v-if="!feed?.isFavorite" :size="20" />
|
|
<StarRemoveIcon v-if="feed?.isFavorite" :size="20" />
|
|
</template>
|
|
</NcActionButton>
|
|
<NcActionButton
|
|
:aria-label="t(`core`, 'Delete')"
|
|
:name="t(`core`, 'Delete')"
|
|
:title="t(`core`, 'Delete')"
|
|
@click="deleteSubscription">
|
|
<template #icon>
|
|
<DeleteIcon :size="20" />
|
|
</template>
|
|
</NcActionButton>
|
|
</template>
|
|
<template #icon>
|
|
<NcAvatar
|
|
:display-name="feed?.data?.author || feed?.data?.title"
|
|
:is-no-user="true"
|
|
:url="feed?.data?.imageUrl" />
|
|
<StarIcon v-if="feed?.isFavorite" class="star" :size="20" />
|
|
<AlertIcon v-if="failed" />
|
|
</template>
|
|
</NcAppNavigationItem>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { NcActionButton, NcAppNavigationItem, NcAvatar } from '@nextcloud/vue'
|
|
import { mapActions, mapState } from 'pinia'
|
|
import AlertIcon from 'vue-material-design-icons/Alert.vue'
|
|
import DeleteIcon from 'vue-material-design-icons/Delete.vue'
|
|
import type { PersonalSettingsPodcastDataInterface } from '../../utils/types.ts'
|
|
import StarIcon from 'vue-material-design-icons/Star.vue'
|
|
import StarPlusIcon from 'vue-material-design-icons/StarPlus.vue'
|
|
import StarRemoveIcon from 'vue-material-design-icons/StarRemove.vue'
|
|
import axios from '@nextcloud/axios'
|
|
import { generateUrl } from '@nextcloud/router'
|
|
import { showError } from '../../utils/toast.ts'
|
|
import { t } from '@nextcloud/l10n'
|
|
import { toFeedUrl } from '../../utils/url.ts'
|
|
import { useSubscriptions } from '../../store/subscriptions.ts'
|
|
|
|
export default {
|
|
name: 'Subscription',
|
|
components: {
|
|
AlertIcon,
|
|
DeleteIcon,
|
|
NcActionButton,
|
|
NcAppNavigationItem,
|
|
NcAvatar,
|
|
StarIcon,
|
|
StarPlusIcon,
|
|
StarRemoveIcon,
|
|
},
|
|
props: {
|
|
url: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
failed: false,
|
|
loading: true,
|
|
}
|
|
},
|
|
computed: {
|
|
...mapState(useSubscriptions, ['getSubByUrl', 'subs']),
|
|
feed() {
|
|
return this.getSubByUrl(this.url)
|
|
},
|
|
},
|
|
async mounted() {
|
|
try {
|
|
const podcastData =
|
|
await axios.get<PersonalSettingsPodcastDataInterface>(
|
|
generateUrl(
|
|
'/apps/gpoddersync/personal_settings/podcast_data?url={url}',
|
|
{
|
|
url: this.url,
|
|
},
|
|
),
|
|
)
|
|
this.addMetadatas(this.url, podcastData.data.data)
|
|
} catch (e) {
|
|
this.failed = true
|
|
console.error(e)
|
|
} finally {
|
|
this.loading = false
|
|
}
|
|
},
|
|
methods: {
|
|
...mapActions(useSubscriptions, ['fetch', 'addMetadatas', 'setFavorite']),
|
|
t,
|
|
toFeedUrl,
|
|
async deleteSubscription() {
|
|
if (
|
|
confirm(
|
|
t('repod', 'Are you sure you want to delete this subscription?'),
|
|
)
|
|
) {
|
|
try {
|
|
this.loading = true
|
|
await axios.post(
|
|
generateUrl('/apps/gpoddersync/subscription_change/create'),
|
|
{ add: [], remove: [this.url] },
|
|
)
|
|
} catch (e) {
|
|
console.error(e)
|
|
showError(t('repod', 'Error while removing the feed'))
|
|
} finally {
|
|
this.setFavorite(this.url, false)
|
|
this.loading = false
|
|
this.fetch()
|
|
}
|
|
}
|
|
},
|
|
switchFavorite(value: boolean) {
|
|
if (value) {
|
|
if (this.subs.filter((sub) => sub.isFavorite).length >= 10) {
|
|
showError(t('repod', 'You can only have 10 favorites'))
|
|
return
|
|
}
|
|
}
|
|
this.setFavorite(this.url, value)
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.star {
|
|
bottom: 2px;
|
|
color: yellow;
|
|
left: 22px;
|
|
position: absolute;
|
|
}
|
|
</style>
|