diff --git a/app/adapters/song.js b/app/adapters/song.js
index 6d04774..601d361 100644
--- a/app/adapters/song.js
+++ b/app/adapters/song.js
@@ -1,10 +1,14 @@
 import JSONAPIAdapter from '@ember-data/adapter/json-api';
+import ENV from 'remember-stuff/config/environment';
 
 export default class SongAdapter extends JSONAPIAdapter {
-  host = 'https://music.nebyoolae.com';
+  host = ENV.APP.MUSIC_API_ROOT;
   namespace = 'jsonapi/views';
+  viewType = 'songs';
+  viewId = 'songs_neb_5';
+  viewArgs = 'include=field_album_id,field_album_id.field_album_cover,field_artist_id';
 
   pathForType() {
-    return 'songs/songs_neb_5?include=field_album_id,field_album_id.field_album_cover,field_artist_id';
+    return `${this.viewType}/${this.viewId}?${this.viewArgs}`;
   }
 }
diff --git a/app/models/song.js b/app/models/song.js
index 68ae5ba..69af6ea 100644
--- a/app/models/song.js
+++ b/app/models/song.js
@@ -4,7 +4,9 @@ export default class SongModel extends Model {
   @attr title;
   @attr album;
   @attr artist;
-  @attr url;
+  @attr fileUrl;
+  @attr detailUrl;
+  @attr nid;
 
   get fullSongTitle() {
     return `${this.title} on ${this.album} by ${this.artist || ''}`;
diff --git a/app/routes/music.js b/app/routes/music.js
index 1989f93..45fa859 100644
--- a/app/routes/music.js
+++ b/app/routes/music.js
@@ -1,15 +1,32 @@
 import Route from '@ember/routing/route';
 import { service } from '@ember/service';
+import { action } from '@ember/object';
 
 export default class SongsRoute extends Route {
   @service store;
   @service headData;
 
+  // beforeModel() {
+  //   this.store.unloadAll('song');
+  // }
+
   model() {
+    console.log('this.store', this.store);
+
     return this.store.findAll('song');
   }
 
   afterModel() {
     this.headData.routeTitle = 'Songs';
   }
+
+  @action
+  loading(transition) {
+    transition.promise.finally(() => {
+      let start = new Date();
+      console.log(`Took ${new Date() - start}ms to load`);
+    });
+
+    return true;
+  }
 }
diff --git a/app/serializers/song.js b/app/serializers/song.js
index 6f63cb3..96830d1 100644
--- a/app/serializers/song.js
+++ b/app/serializers/song.js
@@ -3,6 +3,7 @@ import ENV from 'remember-stuff/config/environment';
 
 export default class SongSerializer extends JSONAPISerializer {
   normalize(type, payload) {
+    const remoteDetailUrl = `${ENV.APP.MUSIC_API_ROOT}${payload.path.alias}`;
     const remoteFileUrl = `${ENV.APP.MUSIC_API_ROOT}/${payload.field_local_link.uri.split('internal:/')[1]}`;
 
     return {
@@ -11,9 +12,11 @@ export default class SongSerializer extends JSONAPISerializer {
         type: type.modelName,
         attributes: {
           title: payload.title,
-          url: remoteFileUrl,
+          detailUrl: remoteDetailUrl,
+          fileUrl: remoteFileUrl,
           artist: payload.field_artist_id.name,
           album: payload.field_album_id.name,
+          nid: payload.drupal_internal__nid,
         },
       },
     };
diff --git a/app/templates/music.hbs b/app/templates/music.hbs
index b486ce2..d25588e 100644
--- a/app/templates/music.hbs
+++ b/app/templates/music.hbs
@@ -4,13 +4,25 @@
   <ul>
     {{#each @model as |song|}}
       <li>
-        <a href={{song.url}} target="_blank" rel="noopener noreferrer">
-          {{song.title}}
+        <a href={{song.detailUrl}} 
+          target="_blank" 
+          rel="noopener noreferrer"
+          title={{t "general.info"}}
+        >
+          <FaIcon @icon="circle-info" />
         </a>
+        <a href={{song.fileUrl}}
+          target="_blank" 
+          rel="noopener noreferrer"
+          title={{t "general.listen"}} 
+        >
+          <FaIcon @icon="ear-listen" />
+        </a>
+        <strong>{{song.title}}</strong>
         {{t "general.from"}}
-        <strong>{{song.album}}</strong>
-        {{t "general.to"}}
-        <em>{{song.artist}}</em>
+        <em>{{song.album}}</em>
+        {{t "general.by"}}
+        {{song.artist}}
       </li>
     {{/each}}
   </ul>