Add and show Playlists sizes

.github/FUNDING.yml

@@ -3,8 +3,8 @@
 github: deluan
 patreon: # Replace with a single Patreon username
 open_collective: # Replace with a single Open Collective username
-liberapay: deluan
 ko_fi: deluan
+liberapay: deluan
 tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
 community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry
 issuehunt: # Replace with a single IssueHunt username

model/playlist.go

@@ -9,6 +9,7 @@ type Playlist struct {
 	Name      string     `json:"name"`
 	Comment   string     `json:"comment"`
 	Duration  float32    `json:"duration"`
+	Size      int64      `json:"size"`
 	SongCount int        `json:"songCount"`
 	Owner     string     `json:"owner"`
 	Public    bool       `json:"public"`

persistence/playlist_track_repository.go

@@ -140,19 +140,21 @@ func (r *playlistTrackRepository) Update(mediaFileIds []string) error {
 }
 
 func (r *playlistTrackRepository) updateStats() error {
-	// Get total playlist duration and count
+	// Get total playlist duration, size and count
-	statsSql := Select("sum(duration) as duration", "count(*) as count").From("media_file").
+	statsSql := Select("sum(duration) as duration", "sum(size) as size", "count(*) as count").
+		From("media_file").
 		Join("playlist_tracks f on f.media_file_id = media_file.id").
 		Where(Eq{"playlist_id": r.playlistId})
-	var res struct{ Duration, Count float32 }
+	var res struct{ Duration, Size, Count float32 }
 	err := r.queryOne(statsSql, &res)
 	if err != nil {
 		return err
 	}
 
-	// Update playlist's total duration and count
+	// Update playlist's total duration, size and count
 	upd := Update("playlist").
 		Set("duration", res.Duration).
+		Set("size", res.Size).
 		Set("song_count", res.Count).
 		Set("updated_at", time.Now()).
 		Where(Eq{"id": r.playlistId})

ui/src/playlist/PlaylistActions.js

@@ -16,10 +16,13 @@ import { playNext, addTracks, playTracks, shuffleTracks } from '../audioplayer'
 import { M3U_MIME_TYPE, REST_URL } from '../consts'
 import subsonic from '../subsonic'
 import PropTypes from 'prop-types'
+import { formatBytes } from '../common/SizeField'
+import { useMediaQuery } from '@material-ui/core'
 
 const PlaylistActions = ({ className, ids, data, record, ...rest }) => {
   const dispatch = useDispatch()
   const translate = useTranslate()
+  const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('md'))
 
   const handlePlay = React.useCallback(() => {
     dispatch(playTracks(data, ids))
@@ -87,7 +90,10 @@ const PlaylistActions = ({ className, ids, data, record, ...rest }) => {
       </Button>
       <Button
         onClick={handleDownload}
-        label={translate('resources.album.actions.download')}
+        label={
+          translate('resources.album.actions.download') +
+          (isDesktop ? ` (${formatBytes(record.size)})` : '')
+        }
       >
         <CloudDownloadOutlinedIcon />
       </Button>

ui/src/playlist/PlaylistDetails.js

@@ -2,7 +2,7 @@ import React from 'react'
 import { Card, CardContent, Typography } from '@material-ui/core'
 import { makeStyles } from '@material-ui/core/styles'
 import { useTranslate } from 'react-admin'
-import { DurationField } from '../common'
+import { DurationField, SizeField } from '../common'
 
 const useStyles = makeStyles((theme) => ({
   container: {
@@ -56,6 +56,8 @@ const PlaylistDetails = (props) => {
               })}
               {' · '}
               <DurationField record={record} source={'duration'} />
+              {' · '}
+              <SizeField record={record} source={'size'} />
             </span>
           ) : (
             <span>&nbsp;</span>