Show that a Post/Comment has been edited

webapp/components/Comment/Comment.vue

@@ -12,20 +12,33 @@
   <div v-else :class="{ comment: true, 'disabled-content': comment.deleted || comment.disabled }">
     <ds-card :id="anchor">
       <ds-space margin-bottom="small" margin-top="small">
-        <hc-user :user="author" :date-time="comment.createdAt" />
+        <ds-flex>
+          <ds-flex-item width="40%">
+            <hc-user :user="author" :date-time="comment.createdAt" />
+          </ds-flex-item>
+          <ds-flex-item>
+            <ds-text v-if="comment.createdAt !== comment.updatedAt" color="softer" class="italics">
+              {{ this.$t('comment.edited') }}
+            </ds-text>
+          </ds-flex-item>
+          <ds-flex-item>
+            <ds-space margin-top="base">
+              <client-only>
+                <content-menu
+                  v-show="!openEditCommentMenu"
+                  placement="bottom-end"
+                  resource-type="comment"
+                  :resource="comment"
+                  :modalsData="menuModalsData"
+                  class="float-right"
+                  :is-owner="isAuthor(author.id)"
+                  @showEditCommentMenu="editCommentMenu"
+                />
+              </client-only>
+            </ds-space>
+          </ds-flex-item>
+        </ds-flex>
         <!-- Content Menu (can open Modals) -->
-        <client-only>
-          <content-menu
-            v-show="!openEditCommentMenu"
-            placement="bottom-end"
-            resource-type="comment"
-            :resource="comment"
-            :modalsData="menuModalsData"
-            class="float-right"
-            :is-owner="isAuthor(author.id)"
-            @showEditCommentMenu="editCommentMenu"
-          />
-        </client-only>
       </ds-space>
       <div v-if="openEditCommentMenu">
         <hc-comment-form
@@ -199,4 +212,8 @@ span.show-more-or-less {
   margin: 0px 20px;
   cursor: pointer;
 }
+
+.ds-text.italics {
+  font-style: italic;
+}
 </style>

webapp/graphql/CommentMutations.js

@@ -10,6 +10,7 @@ export default i18n => {
           contentExcerpt
           content
           createdAt
+          updatedAt
           disabled
           deleted
           author {
@@ -39,6 +40,7 @@ export default i18n => {
           contentExcerpt
           content
           createdAt
+          updatedAt
           disabled
           deleted
           author {

webapp/graphql/Fragments.js

@@ -40,6 +40,7 @@ export const postFragment = lang => gql`
     content
     contentExcerpt
     createdAt
+    updatedAt
     disabled
     deleted
     slug
@@ -64,6 +65,7 @@ export const commentFragment = lang => gql`
   fragment comment on Comment {
     id
     createdAt
+    updatedAt
     disabled
     deleted
     content

webapp/locales/de.json

@@ -2,7 +2,7 @@
   "maintenance": {
     "title": "Human Connection befindet sich in der Wartung",
     "explanation": "Zurzeit führen wir einige geplante Wartungsarbeiten durch, bitte versuch es später erneut.",
-    "questions": "Bei Fragen oder Problemen erreichst du uns per E-Mail an" 
+    "questions": "Bei Fragen oder Problemen erreichst du uns per E-Mail an"
   },
   "index": {
     "no-results": "Keine Beiträge gefunden.",
@@ -335,7 +335,8 @@
       "submit": "Kommentiere",
       "submitted": "Kommentar Gesendet",
       "updated": "Änderungen gespeichert"
-    }
+    },
+    "edited": "bearbeitet"
   },
   "comment": {
     "content": {
@@ -348,10 +349,11 @@
     "show": {
       "more": "mehr anzeigen",
       "less": "weniger anzeigen"
-    }
+    },
+    "edited": "bearbeitet"
   },
   "quotes": {
-    "african": {
+  "african": {
       "quote": "Viele kleine Leute an vielen kleinen Orten, die viele kleine Dinge tun, werden das Antlitz dieser Welt verändern.",
       "author": "Afrikanisches Sprichwort"
     }

webapp/locales/en.json

@@ -336,7 +336,8 @@
       "submit": "Comment",
       "submitted": "Comment Submitted",
       "updated": "Changes Saved"
-    }
+    },
+    "edited": "edited"
   },
   "comment": {
     "content": {
@@ -349,7 +350,8 @@
     "show": {
       "more": "show more",
       "less": "show less"
-    }
+    },
+    "edited": "edited"
   },
   "quotes": {
     "african": {

webapp/locales/pt.json

@@ -118,7 +118,11 @@
     },
     "takeAction": {
       "name": "Tomar uma ação"
-    }
+    },
+    "comment": {
+      "submit": "Commentar"
+    },
+    "edited": "editado"
   },
   "quotes": {
     "african": {
@@ -202,8 +206,18 @@
     "delete": "Apagar Contribuição"
   },
   "comment": {
-    "edit": "Editar Comentário",
+    "content": {
-    "delete": "Apagar Comentário"
+      "unavailable-placeholder": "… este commenttário não está disponível"
+    },
+    "menu": {
+      "edit": "Editar Comentário",
+      "delete": "Apagar Comentário"
+    },
+    "show": {
+      "more": "mostrar mais",
+      "less": "mostrar menos"
+    },
+    "edited": "editado"
   },
   "followButton": {
     "follow": "Seguir",
@@ -212,4 +226,4 @@
   "shoutButton": {
     "shouted": "Aclamou"
   }
-}
+}

webapp/pages/post/_id/_slug/index.vue

@@ -6,17 +6,30 @@
       :class="{ 'post-card': true, 'disabled-content': post.disabled }"
     >
       <ds-space margin-bottom="small" />
-      <hc-user :user="post.author" :date-time="post.createdAt" />
+      <ds-flex>
+        <ds-flex-item width="40%">
+          <hc-user :user="post.author" :date-time="post.createdAt" />
+        </ds-flex-item>
+        <ds-flex-item>
+          <ds-text v-if="post.createdAt !== post.updatedAt" color="softer" class="italics">
+            {{ this.$t('post.edited') }}
+          </ds-text>
+        </ds-flex-item>
+        <ds-flex-item>
+          <ds-space margin-top="base">
+            <client-only>
+              <content-menu
+                placement="bottom-end"
+                resource-type="contribution"
+                :resource="post"
+                :modalsData="menuModalsData"
+                :is-owner="isAuthor(post.author ? post.author.id : null)"
+              />
+            </client-only>
+          </ds-space>
+        </ds-flex-item>
+      </ds-flex>
       <!-- Content Menu (can open Modals) -->
-      <client-only>
-        <content-menu
-          placement="bottom-end"
-          resource-type="contribution"
-          :resource="post"
-          :modalsData="menuModalsData"
-          :is-owner="isAuthor(post.author ? post.author.id : null)"
-        />
-      </client-only>
       <ds-space margin-bottom="small" />
       <ds-heading tag="h3" no-margin class="hyphenate-text">{{ post.title }}</ds-heading>
       <ds-space margin-bottom="small" />