Basic mention support.

I still have to think about how to integrate them in the state system...

4 files changed, 47 insertions, 2 deletions

diff --git a/src/components/mentions/mentions.js b/src/components/mentions/mentions.js
new file mode 100644
index 00000000..3563101b
--- /dev/null
+++ b/src/components/mentions/mentions.js
@@ -0,0 +1,28 @@
+import Status from '../status/status.vue'
+// Temporary
+import { prepareStatus, updateTimestampsInStatuses } from '../../modules/statuses.js'
+import { map } from 'lodash'
+
+const Mentions = {
+  data () {
+    return {
+      mentions: []
+    }
+  },
+  computed: {
+    username () {
+      return this.$route.params.username
+    }
+  },
+  components: {
+    Status
+  },
+  created () {
+    this.$store.state.api.backendInteractor.fetchMentions({username: this.username})
+      .then((mentions) => {
+        this.mentions = updateTimestampsInStatuses(map(mentions, prepareStatus))
+      })
+  }
+}
+
+export default Mentions
diff --git a/src/components/mentions/mentions.vue b/src/components/mentions/mentions.vue
new file mode 100644
index 00000000..a760719c
--- /dev/null
+++ b/src/components/mentions/mentions.vue
@@ -0,0 +1,12 @@
+<template>
+  <div class="timeline panel panel-default">
+    <div class="panel-heading">Mentions</div>
+    <div class="panel-body">
+      <div class="timeline">
+        <status v-for="status in mentions" :key="status.id" v-bind:statusoid="status"></status>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script src="./mentions.js"></script>
diff --git a/src/components/nav_panel/nav_panel.js b/src/components/nav_panel/nav_panel.js
index c2373a26..baeaaede 100644
--- a/src/components/nav_panel/nav_panel.js
+++ b/src/components/nav_panel/nav_panel.js
@@ -1,6 +1,6 @@
 const NavPanel = {
   computed: {
-    loggedIn () {
+    currentUser () {
       return this.$store.state.users.currentUser
     }
   }
diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue
index f463ef95..b709d914 100644
--- a/src/components/nav_panel/nav_panel.vue
+++ b/src/components/nav_panel/nav_panel.vue
@@ -2,11 +2,16 @@
   <div class="nav-panel">
     <div class="panel panel-default">
       <ul>
-        <li v-if='loggedIn'>
+        <li v-if='currentUser'>
           <router-link to='/main/friends'>
             Timeline
           </router-link>
         </li>
+        <li v-if='currentUser'>
+          <router-link :to="{ name: 'mentions', params: { username: currentUser.screen_name } }">
+            Mentions
+          </router-link>
+        </li>
         <li>
           <router-link to='/main/public'>
             Public Timeline