From 7e593ad05bf6aa15d93ecd572b2b24a86b1c0d42 Mon Sep 17 00:00:00 2001
From: Eliot Berriot <contact@eliotberriot.com>
Date: Wed, 7 Mar 2018 23:02:33 +0100
Subject: [PATCH 1/2] Added year filter

---
 front/src/filters.js                          | 6 ++++++
 front/test/unit/specs/filters/filters.spec.js | 9 ++++++++-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/front/src/filters.js b/front/src/filters.js
index 22d93149b..afc393d40 100644
--- a/front/src/filters.js
+++ b/front/src/filters.js
@@ -35,6 +35,12 @@ export function momentFormat (date, format) {
 
 Vue.filter('moment', momentFormat)
 
+export function year (date) {
+  return moment(date).year()
+}
+
+Vue.filter('year', year)
+
 export function capitalize (str) {
   return str.charAt(0).toUpperCase() + str.slice(1)
 }
diff --git a/front/test/unit/specs/filters/filters.spec.js b/front/test/unit/specs/filters/filters.spec.js
index c2b43da44..f4789ca48 100644
--- a/front/test/unit/specs/filters/filters.spec.js
+++ b/front/test/unit/specs/filters/filters.spec.js
@@ -1,4 +1,4 @@
-import {truncate, markdown, ago, capitalize} from '@/filters'
+import {truncate, markdown, ago, capitalize, year} from '@/filters'
 
 describe('filters', () => {
   describe('truncate', () => {
@@ -32,6 +32,13 @@ describe('filters', () => {
       expect(output).to.equal('a few seconds ago')
     })
   })
+  describe('year', () => {
+    it('works', () => {
+      const input = '2017-07-13'
+      let output = year(input)
+      expect(output).to.equal(2017)
+    })
+  })
   describe('capitalize', () => {
     it('works', () => {
       const input = 'hello world'

From 1822fdf4499fb01b96eed5f2af6e5644d4e76e72 Mon Sep 17 00:00:00 2001
From: Eliot Berriot <contact@eliotberriot.com>
Date: Wed, 7 Mar 2018 23:03:46 +0100
Subject: [PATCH 2/2] Fix #116: On artist page, albums are not sorted by
 release date, if any

---
 changes/changelog.d/116.feature           | 1 +
 front/src/components/audio/album/Card.vue | 9 +++++----
 front/src/components/library/Artist.vue   | 7 ++++++-
 3 files changed, 12 insertions(+), 5 deletions(-)
 create mode 100644 changes/changelog.d/116.feature

diff --git a/changes/changelog.d/116.feature b/changes/changelog.d/116.feature
new file mode 100644
index 000000000..e17343401
--- /dev/null
+++ b/changes/changelog.d/116.feature
@@ -0,0 +1 @@
+On artist page, albums are not sorted by release date, if any (#116)
diff --git a/front/src/components/audio/album/Card.vue b/front/src/components/audio/album/Card.vue
index ea42f06a8..bb37b2b2f 100644
--- a/front/src/components/audio/album/Card.vue
+++ b/front/src/components/audio/album/Card.vue
@@ -6,12 +6,13 @@
           <img v-else src="../../../assets/audio/default-cover.png">
         </div>
         <div class="header">
-          <router-link class="discrete link" :to="{name: 'library.albums.detail', params: {id: album.id }}">{{ album.title }}</router-link>
+          <router-link class="discrete link" :to="{name: 'library.albums.detail', params: {id: album.id }}">{{ album.title }} </router-link>
         </div>
         <div class="meta">
-          By <router-link :to="{name: 'library.artists.detail', params: {id: album.artist.id }}">
-            {{ album.artist.name }}
-          </router-link>
+          <span>
+            By <router-link tag="span" :to="{name: 'library.artists.detail', params: {id: album.artist.id }}">
+              {{ album.artist.name }}</router-link>
+          </span><span class="time" v-if="album.release_date">– {{ album.release_date | year }}</span>
         </div>
         <div class="description" v-if="mode === 'rich'">
           <table class="ui very basic fixed single line compact unstackable table">
diff --git a/front/src/components/library/Artist.vue b/front/src/components/library/Artist.vue
index 7724428ca..9a546aa0e 100644
--- a/front/src/components/library/Artist.vue
+++ b/front/src/components/library/Artist.vue
@@ -31,7 +31,7 @@
       <div class="ui vertical stripe segment">
         <h2>Albums by this artist</h2>
         <div class="ui stackable doubling three column grid">
-          <div class="column" :key="album.id" v-for="album in albums">
+          <div class="column" :key="album.id" v-for="album in sortedAlbums">
             <album-card :mode="'rich'" class="fluid" :album="album"></album-card>
           </div>
         </div>
@@ -41,6 +41,7 @@
 </template>
 
 <script>
+import _ from 'lodash'
 import axios from 'axios'
 import logger from '@/logging'
 import backend from '@/audio/backend'
@@ -83,6 +84,10 @@ export default {
     }
   },
   computed: {
+    sortedAlbums () {
+      let a = this.albums || []
+      return _.orderBy(a, ['release_date'], ['asc'])
+    },
     totalTracks () {
       return this.albums.map((album) => {
         return album.tracks.length