Fixes broken channel page

api/funkwhale_api/audio/serializers.py

@@ -267,7 +267,7 @@ class ChannelSerializer(serializers.ModelSerializer):
         return obj.actor.received_follows.exclude(approved=False).count()
 
     def get_downloads_count(self, obj):
-        return getattr(obj, "_downloads_count", None)
+        return getattr(obj, "_downloads_count", None) or 0
 
     def get_actor(self, obj):
         if obj.attributed_to == actors.get_service_actor():

api/tests/audio/test_serializers.py

@@ -250,7 +250,7 @@ def test_channel_serializer_external_representation(factories, to_api_date):
         "metadata": {},
         "rss_url": channel.get_rss_url(),
         "url": channel.actor.url,
-        "downloads_count": None,
+        "downloads_count": 0,
     }
     expected["artist"]["description"] = common_serializers.ContentSerializer(
         content

changes/changelog.d/1729.bugfix

@@ -0,0 +1 @@
+Fixes channel page (#1729) (1729)

front/src/components/audio/ChannelEntries.vue

@@ -67,7 +67,7 @@ export default {
   props: {
     filters: { type: Object, required: true },
     limit: { type: Number, default: 10 },
-    defaultCover: { type: Object, required: true },
+    defaultCover: { type: Object, default: () => ({}) },
     isPodcast: { type: Boolean, required: true }
   },
   data () {

front/src/components/audio/track/Table.vue

@@ -108,7 +108,7 @@
       >
         <pagination
           :total="totalTracks"
-          :current=" tracks.length > 0 ? page : {currentPage}"
+          :current=" tracks.length > 0 ? page : currentPage"
           :paginate-by="paginateBy"
           @page-changed="updatePage"
         />
@@ -160,9 +160,10 @@
 <script>
 import _ from '@/lodash'
 import axios from 'axios'
-import TrackRow from '@/components/audio/track/Row'
-import TrackMobileRow from '@/components/audio/track/MobileRow'
-import Pagination from '@/components/Pagination'
+import TrackRow from '@/components/audio/track/Row.vue'
+import TrackMobileRow from '@/components/audio/track/MobileRow.vue'
+import Pagination from '@/components/Pagination.vue'
+import { unique } from '@/filters'
 
 export default {
   components: {
@@ -178,7 +179,7 @@ export default {
     showPosition: { type: Boolean, required: false, default: false },
     showArt: { type: Boolean, required: false, default: true },
     search: { type: Boolean, required: false, default: false },
-    filters: { type: Object, required: false, default: null },
+    filters: { type: Object, required: false, default: () => { return {} } },
     nextUrl: { type: String, required: false, default: null },
     displayActions: { type: Boolean, required: false, default: true },
     showDuration: { type: Boolean, required: false, default: true },
@@ -203,7 +204,8 @@ export default {
   },
   computed: {
     allTracks () {
-      return (this.tracks || []).concat(this.additionalTracks)
+      const tracks = (this.tracks || []).concat(this.additionalTracks)
+      return unique(tracks, 'id')
     },
 
     labels () {

front/src/components/channels/AlbumSelect.vue

@@ -2,7 +2,7 @@
   <div>
     <label for="album-dropdown">
       <translate
-        v-if="channel && channel.artist.content_category === 'podcast'"
+        v-if="channel && channel.artist && channel.artist.content_category === 'podcast'"
         key="1"
         translate-context="*/*/*"
       >Series</translate>
@@ -45,8 +45,8 @@ import axios from 'axios'
 
 export default {
   props: {
-    value: { type: String, required: true },
-    channel: { type: Object, required: true }
+    value: { type: Number, default: null },
+    channel: { type: Object, default: () => ({}) }
   },
   data () {
     return {
@@ -65,7 +65,7 @@ export default {
   methods: {
     async fetchData () {
       this.albums = []
-      if (!this.channel) {
+      if (!this.channel || !this.channel.artist) {
         return
       }
       this.isLoading = true

front/src/components/channels/LicenseSelect.vue

@@ -42,7 +42,7 @@
 import axios from 'axios'
 
 export default {
-  props: { value: { type: String, required: true } },
+  props: { value: { type: String, default: null } },
   data () {
     return {
       availableLicenses: [],

front/src/components/common/DangerousButton.vue

@@ -2,7 +2,7 @@
   <button
     :class="[{disabled: disabled}]"
     :disabled="disabled"
-    @click="showModal = true"
+    @click.prevent.stop="showModal = true"
   >
     <slot />
 

front/src/components/library/AlbumBase.vue

@@ -292,7 +292,7 @@ export default {
       return this.object.tracks_count
     },
     isChannel () {
-      return this.object.artist.channel
+      return this.object.artist.channel !== null
     },
     isSerie () {
       return this.object.artist.content_category === 'podcast'

front/src/filters.js

@@ -135,4 +135,13 @@ export function humanSize (bytes) {
 
 Vue.filter('humanSize', humanSize)
 
+// Removes duplicates from a list
+export function unique (list, property) {
+  property = property || 'id'
+  const unique = []
+  list.map(x => unique.filter(a => a[property] === x[property]).length > 0 ? null : unique.push(x))
+  return unique
+}
+Vue.filter('unique', unique)
+
 export default {}

front/src/views/channels/DetailBase.vue

@@ -196,6 +196,7 @@
                         href=""
                         @click.stop.prevent="showEditModal = true"
                       >
+                        <i class="edit icon" />
                         <translate translate-context="*/*/*/Verb">Edit…</translate>
                       </a>
                       <dangerous-button
@@ -203,6 +204,7 @@
                         :class="['ui', {loading: isLoading}, 'item']"
                         @confirm="remove()"
                       >
+                        <i class="ui trash icon" />
                         <translate translate-context="*/*/*/Verb">
                           Delete…
                         </translate>
@@ -505,6 +507,11 @@ export default {
   watch: {
     id () {
       this.fetchData()
+    },
+    '$store.state.channels.latestPublication' (v) {
+      if (v && v.uploads && v.channel.uuid === this.object.uuid) {
+        this.fetchData()
+      }
     }
   },
   async created () {
@@ -531,10 +538,8 @@ export default {
             self.$router.replace({ name: 'channels.detail', params: { id: actor.full_username } })
           }
         }
-        axios.get('tracks', { params: { channel: response.data.uuid, page_size: 1, playable: true, include_channels: true } }).then(response => {
-          self.totalTracks = response.data.count
-          self.isLoading = false
-        })
+        self.totalTracks = response.data.artist.tracks_count
+        self.isLoading = false
       })
       await channelPromise
     },

front/tests/unit/specs/filters/filters.spec.js

@@ -1,6 +1,6 @@
 import {expect} from 'chai'
 import moment from 'moment'
-import {truncate, ago, capitalize, year} from '@/filters'
+import {truncate, ago, capitalize, year, unique} from '@/filters'
 
 describe('filters', () => {
   describe('truncate', () => {
@@ -46,7 +46,14 @@ describe('filters', () => {
     it('works', () => {
       const input = 'hello world'
       let output = capitalize(input)
-      expect(output).to.equal('Hello world')
+      expect(output).to.deep.equal('Hello world')
+    })
+  })
+  describe('unique', () => {
+    it('works', () => {
+      const list = [{id: 1}, {id: 2}, {id: 3}, {id: 1}]
+      const dedupedList = unique(list, 'id')
+      expect(dedupedList).to.have.deep.members([{id: 1}, {id: 3}, {id: 2}])
     })
   })
 })