Add list type to album list view title

navidrome · Jul 29, 2020 · 8daac43 · 8daac43
1 parent d5da23a
commit 8daac43
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 6 deletions.
diff --git a/resources/i18n/pt.json b/resources/i18n/pt.json
@@ -47,7 +47,7 @@
                 "shuffle": "Aleatório"
             },
             "lists": {
-                "default": "Todos",
+                "all": "Todos",
                 "random": "Aleatório",
                 "recentlyAdded": "Recém-adicionados",
                 "recentlyPlayed": "Recém-tocados",

diff --git a/ui/src/album/AlbumList.js b/ui/src/album/AlbumList.js
@@ -12,7 +12,7 @@ import {
   useTranslate,
   useListParams,
 } from 'react-admin'
-import { List, useAlbumsPerPage } from '../common'
+import { List, Title, useAlbumsPerPage } from '../common'
 import { withWidth } from '@material-ui/core'
 import AlbumListActions from './AlbumListActions'
 import AlbumListView from './AlbumListView'
@@ -41,6 +41,18 @@ const AlbumFilter = (props) => {
   )
 }
 
+const AlbumListTitle = ({ albumListType }) => {
+  const translate = useTranslate()
+  let title = translate('resources.album.name', { smart_count: 2 })
+  if (albumListType) {
+    let listTitle = translate(`resources.album.lists.${albumListType}`, {
+      smart_count: 2,
+    })
+    title = `${title} - ${listTitle}`
+  }
+  return <Title subTitle={title} args={{ smart_count: 2 }} />
+}
+
 const AlbumList = (props) => {
   const { width, resource } = props
   const albumView = useSelector((state) => state.albumView)
@@ -54,12 +66,14 @@ const AlbumList = (props) => {
   })
   const isArtistView = !!(query.filter && query.filter.artist_id)
 
+  const albumListType = location.pathname
+    .replace(/^\/album/, '')
+    .replace(/^\//, '')
+
   // If it does not have filter/sort params (usually coming from Menu),
   // reload with correct filter/sort params
   if (!location.search) {
-    let type =
-      location.pathname.replace(/^\/album/, '').replace(/^\//, '') || 'all'
-
+    const type = albumListType || 'all'
     const listParams = albumLists[type]
     if (listParams) {
       return <Redirect to={`/album/${type}?${listParams.params}`} />
@@ -76,6 +90,7 @@ const AlbumList = (props) => {
         filters={<AlbumFilter />}
         perPage={perPage}
         pagination={<Pagination rowsPerPageOptions={perPageOptions} />}
+        title={<AlbumListTitle albumListType={albumListType} />}
       >
         {albumView.mode === ALBUM_MODE_LIST ? (
           <AlbumListView {...props} />

diff --git a/ui/src/i18n/en.json b/ui/src/i18n/en.json
@@ -48,7 +48,7 @@
                 "shuffle": "Shuffle"
             },
             "lists": {
-                "default": "All",
+                "all": "All",
                 "random": "Random",
                 "recentlyAdded": "Recently Added",
                 "recentlyPlayed": "Recently Played",