refs #46 Get favourites from api

src/renderer/components/TimelineSpace/Favorites.vue

@@ -1,11 +0,0 @@
-<template>
-  <div id="favorites">
-    fav
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'favorites'
-}
-</script>

src/renderer/components/TimelineSpace/Favourites.vue

@@ -0,0 +1,48 @@
+<template>
+  <div id="favourites">
+    <div class="fav" v-for="message in favourites" v-bind:key="message.id">
+      <toot :message="message"></toot>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import Toot from './Cards/Toot'
+
+export default {
+  name: 'favourites',
+  components: { Toot },
+  computed: {
+    ...mapState({
+      account: state => state.TimelineSpace.account,
+      favourites: state => state.TimelineSpace.Favourites.favourites
+    })
+  },
+  created () {
+    const loading = this.$loading({
+      lock: true,
+      text: 'Loading',
+      spinner: 'el-icon-loading',
+      background: 'rgba(0, 0, 0, 0.7)'
+    })
+    this.$store.dispatch('TimelineSpace/Favourites/fetchFavourites', this.account)
+      .then(() => {
+        loading.close()
+      })
+      .catch(() => {
+        loading.close()
+        this.$message({
+          message: 'Could not fetch favourites',
+          type: 'error'
+        })
+      })
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+#favourites {
+  margin-left: 16px;
+}
+</style>

src/renderer/components/TimelineSpace/SideMenu.vue

@@ -21,9 +21,9 @@
         <icon name="bell"></icon>
         <span>Notification</span>
       </el-menu-item>
-      <el-menu-item :index="`/${id()}/favorites`">
+      <el-menu-item :index="`/${id()}/favourites`">
         <icon name="star"></icon>
-        <span>Favorite</span>
+        <span>Favourite</span>
       </el-menu-item>
       <el-menu-item :index="`/${id()}/local`">
         <icon name="users"></icon>

src/renderer/router/index.js

@@ -36,9 +36,9 @@ export default new Router({
               component: require('@/components/TimelineSpace/Notifications').default
             },
             {
-              path: 'favorites',
-              name: 'favorites',
-              component: require('@/components/TimelineSpace/Favorites').default
+              path: 'favourites',
+              name: 'favourites',
+              component: require('@/components/TimelineSpace/Favourites').default
             },
             {
               path: 'local',

src/renderer/store/TimelineSpace.js

@@ -1,12 +1,14 @@
 import { ipcRenderer } from 'electron'
 import Mastodon from 'mastodon-api'
 import SideMenu from './TimelineSpace/SideMenu'
+import Favourites from './TimelineSpace/Favourites'
 import router from '../router'
 
 const TimelineSpace = {
   namespaced: true,
   modules: {
-    SideMenu
+    SideMenu,
+    Favourites
   },
   state: {
     account: {

src/renderer/store/TimelineSpace/Favourites.js

@@ -0,0 +1,32 @@
+import Mastodon from 'mastodon-api'
+
+const Favourites = {
+  namespaced: true,
+  state: {
+    favourites: []
+  },
+  mutations: {
+    insertFavourites (state, favourites) {
+      state.favourites = favourites
+    }
+  },
+  actions: {
+    fetchFavourites ({ commit }, account) {
+      return new Promise((resolve, reject) => {
+        const client = new Mastodon(
+          {
+            access_token: account.accessToken,
+            api_url: account.baseURL + '/api/v1'
+          }
+        )
+        client.get('/favourites', { limit: 40 }, (err, data, res) => {
+          if (err) return reject(err)
+          commit('insertFavourites', data)
+          resolve(res)
+        })
+      })
+    }
+  }
+}
+
+export default Favourites