From 7e2c52b12cf6883f32716230b0fdcdad7a26632b Mon Sep 17 00:00:00 2001
From: Roger Braun <roger@rogerbraun.net>
Date: Thu, 3 Nov 2016 16:59:27 +0100
Subject: [PATCH] Add replies.

---
 src/components/post_status_form/post_status_form.js | 10 +++++++---
 src/components/status/status.js                     | 12 +++++++++++-
 src/components/status/status.vue                    | 11 +++++++----
 3 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index 596c9f58..0944d841 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -1,16 +1,20 @@
 import statusPoster from '../../services/status_poster/status_poster.service.js'
 
 const PostStatusForm = {
-  data() {
+  props: [
+    'replyTo'
+  ],
+  data () {
     return {
       newStatus: { }
     }
   },
   methods: {
-    postStatus(newStatus) {
+    postStatus (newStatus) {
       statusPoster.postStatus({
         status: newStatus.status,
-        store: this.$store
+        store: this.$store,
+        inReplyToStatusId: this.replyTo
       })
       this.newStatus = { }
     }
diff --git a/src/components/status/status.js b/src/components/status/status.js
index f3816daa..2e6565e8 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -1,8 +1,12 @@
 import Attachment from '../attachment/attachment.vue'
 import FavoriteButton from '../favorite_button/favorite_button.vue'
+import PostStatusForm from '../post_status_form/post_status_form.vue'
 
 const Status = {
   props: [ 'statusoid' ],
+  data: () => ({
+    replying: false
+  }),
   computed: {
     retweet () { return !!this.statusoid.retweeted_status },
     retweeter () { return this.statusoid.user.name },
@@ -16,7 +20,13 @@ const Status = {
   },
   components: {
     Attachment,
-    FavoriteButton
+    FavoriteButton,
+    PostStatusForm
+  },
+  methods: {
+    toggleReplying () {
+      this.replying = !this.replying
+    }
   }
 }
 
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 685ec244..ab827325 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -2,7 +2,7 @@
   <div class="status-el">
     <div v-if="retweet" class="media container retweet-info">
       <div class="media-left">
-        <i class='fa fa-retweet'></i>
+        <i class='fa icon-retweet'></i>
       </div>
       <div class="media-body">
         Retweeted by {{retweeter}}
@@ -34,8 +34,10 @@
 
         <div>
           <div class='status-actions'>
-            <div ng-click="toggleReplying()">
-              <i class='fa icon-reply'></i>
+            <div>
+              <a href="#" v-on:click.prevent="toggleReplying()">
+                <i class='fa icon-reply'></i>
+              </a>
             </div>
             <div>
               <i class='fa icon-retweet'></i>
@@ -43,7 +45,7 @@
             <favorite-button :status=status></favorite-button>
           </div>
 
-          <!-- <post-status-form ng-if="replying" toggle="toggleReplying" reply-to-status="status" reply-to="{{status.id}}"></post-status-form> -->
+          <post-status-form v-if="replying" :reply-to="status.id"></post-status-form>
         </div>
       </div>
     </div>
@@ -55,6 +57,7 @@
 <style lang="scss">
  .status-el {
      word-wrap: break-word;
+     word-break: break-word;
 
      a {
          word-break: break-all;