diff --git a/components/celestials/CelestialCard.vue b/components/celestials/CelestialCard.vue
index e92933f..cc19086 100644
--- a/components/celestials/CelestialCard.vue
+++ b/components/celestials/CelestialCard.vue
@@ -103,7 +103,7 @@ export default {
           timer: 3
         })
       }
-      this.$store.dispatch('toggleFav', this.celestial.id)
+      this.$store.dispatch('toggleFav', this.celestial)
     }
   }
 }
diff --git a/pages/favoris/index.vue b/pages/favoris/index.vue
index 09f6b33..3630973 100644
--- a/pages/favoris/index.vue
+++ b/pages/favoris/index.vue
@@ -17,14 +17,10 @@
 export default {
   name: 'Favourites',
 
-  data () {
-    return {
-      favourites: []
+  computed: {
+    favourites () {
+      return this.$store.state.user.favourites
     }
-  },
-
-  created () {
-    console.log(this.$store.state.user.favourites)
   }
 }
 </script>
diff --git a/store/index.js b/store/index.js
index 7c67051..f4ca41e 100644
--- a/store/index.js
+++ b/store/index.js
@@ -17,23 +17,23 @@ export const getters = {
 }
 
 export const mutations = {
-  addFav: (state, celestialId) => {
-    state.user.favourites.push({ id: celestialId })
+  addFav: (state, celestial) => {
+    state.user.favourites.push(celestial)
   },
-  removeFav: (state, celestialId) => {
+  removeFav: (state, celestial) => {
     state.user.favourites = state.user.favourites.filter(
-      fav => fav.id !== celestialId
+      fav => fav.id !== celestial.id
     )
   }
 }
 
 export const actions = {
-  toggleFav: ({ commit, getters }, celestialId) => {
+  toggleFav: ({ commit, getters }, celestial) => {
     // If the celestial is not faved
-    if (!getters.isFav(celestialId)) {
-      commit('addFav', celestialId)
+    if (!getters.isFav(celestial.id)) {
+      commit('addFav', celestial)
     } else {
-      commit('removeFav', celestialId)
+      commit('removeFav', celestial)
     }
   }
 }