Ember localstorage adapter has different data when I refresh

I'm relatively new to Ember and have been struggling to build a simple CRUD app for learning purposes. I'm using localstorage-adapter to mock the backend. I'm having a horribly bad time debugging because Ember Inspector shows different data on different pages.

Right now I have full CRUD functionality except for updating. Say I create a new Song (S1) that's a part of an album (A1). I can change S1 to belong to another album (A2), and that saves and persists in local storage even if I refresh.

Now, if I decide I want to change S1's album back to A1, it'll save and display on the show page, but if I refresh, the album reverts to A2. If I go to the edit page, S1's album is listed as A2. If I refresh on the edit page, it changes to A1, but even if I click save it'll show A1 on the show page but if I refresh or go back to edit it goes back to A2... I find this especially weird because it did save properly (and persisted with page reloading) on the initial edit attempt. It's subsequent edit attempts that it doesn't save properly.

A song has a title and belongs to an album.

Songs Controller

import Ember from 'ember';

export default Ember.Controller.extend({
  actions: {
    updateValue(value) {
      this.set('model.song.newAlbum', value)
    },
    updateSong(model) {
      this.store.findRecord('song', model.get('id'))
        .then(song => {
          if (song.get('newAlbum')) {
            this.store.findRecord('album', song.get('newAlbum'))
              .then(album => {
                song.set('album', album);
                album.save();
              })
          }
        song.save();
      })
      .then(() => this.transitionToRoute('songs.show', model.get('id')));
    }
  }
});