82 lines
1.8 KiB
Vue

<template>
<AppNavigation>
<template #list>
<NcAppContentList>
<router-link to="/discover">
<NcAppNavigationNew :text="t('repod', 'Add a podcast')">
<template #icon>
<PlusIcon :size="20" />
</template>
</NcAppNavigationNew>
</router-link>
<Loading v-if="loading" />
<NcAppNavigationList v-if="!loading">
<Subscription
v-for="url of getFavorites.map((fav) => fav.url)"
:key="url"
:url="url" />
<Subscription
v-for="url of getSubscriptions.filter(
(sub) =>
!getFavorites.map((fav) => fav.url).includes(sub),
)"
:key="url"
:url="url" />
</NcAppNavigationList>
</NcAppContentList>
</template>
<template #footer>
<Settings />
</template>
</AppNavigation>
</template>
<script>
import {
NcAppContentList,
NcAppNavigationList,
NcAppNavigationNew,
} from '@nextcloud/vue'
import { mapActions, mapState } from 'pinia'
import AppNavigation from '../Atoms/AppNavigation.vue'
import Loading from '../Atoms/Loading.vue'
import PlusIcon from 'vue-material-design-icons/Plus.vue'
import Settings from '../Settings/Settings.vue'
import Subscription from './Subscription.vue'
import { showError } from '../../utils/toast.js'
import { useSubscriptions } from '../../store/subscriptions.js'
export default {
name: 'Subscriptions',
components: {
AppNavigation,
Loading,
NcAppContentList,
NcAppNavigationList,
NcAppNavigationNew,
PlusIcon,
Settings,
Subscription,
},
data: () => ({
loading: true,
}),
computed: {
...mapState(useSubscriptions, ['getSubscriptions', 'getFavorites']),
},
async mounted() {
try {
await this.fetch()
} catch (e) {
console.error(e)
showError(t('repod', 'Could not fetch subscriptions'))
} finally {
this.loading = false
}
},
methods: {
...mapActions(useSubscriptions, ['fetch']),
},
}
</script>