ENHANCEMENT: single post should only be triggered on a click on the 'date' and not the full post

Signed-off-by: Cyrille Bollu <cyrpub@bollu.be>

4 files changed, 32 insertions, 37 deletions

diff --git a/src/components/TimelineEntry.vue b/src/components/TimelineEntry.vue
index d6815280..61833343 100644
--- a/src/components/TimelineEntry.vue
+++ b/src/components/TimelineEntry.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="timeline-entry" @click="getSinglePostTimeline">
+	<div class="timeline-entry">
 		<div v-if="item.type === 'SocialAppNotification'">
 			{{ actionSummary }}
 		</div>
@@ -30,7 +30,6 @@
 </template>
 
 <script>
-import Logger from '../logger'
 import TimelinePost from './TimelinePost.vue'
 
 export default {
@@ -95,35 +94,6 @@ export default {
 		}
 	},
 	methods: {
-		getSinglePostTimeline(e) {
-
-			// Do not call the single-post view when clicking on a link, a post attachment miniature or the post's author
-			if (e.target.tagName === 'A' || e.target.tagName === 'IMG' || e.target.className.startsWith('post-author')) {
-				Logger.debug('will not call single-post', { event: e })
-				return
-			}
-
-			// Display internal or external post
-			if (!this.item.local) {
-				if (this.item.type === 'Note') {
-					window.open(this.item.id)
-				} else if (this.item.type === 'Announce') {
-					window.open(this.item.object)
-				} else {
-					Logger.warn("Don't know what to do with posts of type " + this.item.type, { post: this.item })
-				}
-			} else {
-				this.$router.push({ name: 'single-post',
-					params: {
-						account: this.item.actor_info.preferredUsername,
-						id: this.item.id,
-						localId: this.item.id.split('/')[this.item.id.split('/').length - 1],
-						type: 'single-post'
-					}
-				})
-			}
-
-		},
 		userDisplayName(actorInfo) {
 			return actorInfo.name !== '' ? actorInfo.name : actorInfo.preferredUsername
 		}
diff --git a/src/components/TimelinePost.vue b/src/components/TimelinePost.vue
index 69548669..4984d1af 100644
--- a/src/components/TimelinePost.vue
+++ b/src/components/TimelinePost.vue
@@ -26,9 +26,9 @@
 						</span>
 					</a>
 				</div>
-				<div :data-timestamp="timestamp" class="post-timestamp live-relative-timestamp">
+				<a :data-timestamp="timestamp" class="post-timestamp live-relative-timestamp" @click="getSinglePostTimeline">
 					{{ relativeTimestamp }}
-				</div>
+				</a>
 			</div>
 			<!-- eslint-disable-next-line vue/no-v-html -->
 			<div v-if="item.content" class="post-message">
@@ -64,6 +64,7 @@ import 'linkifyjs/string'
 import popoverMenu from './../mixins/popoverMenu'
 import currentUser from './../mixins/currentUserMixin'
 import PostAttachment from './PostAttachment.vue'
+import Logger from '../logger'
 import MessageContent from './MessageContent'
 import moment from '@nextcloud/moment'
 import { generateUrl } from '@nextcloud/router'
@@ -140,6 +141,31 @@ export default {
 		}
 	},
 	methods: {
+    /**
+     * @function getSinglePostTimeline
+     * @description Opens the timeline of the post clicked
+     */
+    getSinglePostTimeline(e) {
+      // Display internal or external post
+      if (!this.item.local) {
+        if (this.item.type === 'Note') {
+          window.open(this.item.id)
+        } else if (this.item.type === 'Announce') {
+          window.open(this.item.object)
+        } else {
+          Logger.warn("Don't know what to do with posts of type " + this.item.type, { post: this.item })
+        }
+      } else {
+        this.$router.push({ name: 'single-post',
+          params: {
+            account: this.item.actor_info.preferredUsername,
+            id: this.item.id,
+            localId: this.item.id.split('/')[this.item.id.split('/').length - 1],
+            type: 'single-post'
+          }
+        })
+      }
+    },
 		userDisplayName(actorInfo) {
 			return actorInfo.name !== '' ? actorInfo.name : actorInfo.preferredUsername
 		},
diff --git a/src/mixins/serverData.js b/src/mixins/serverData.js
index 7bd6ec06..eff54329 100644
--- a/src/mixins/serverData.js
+++ b/src/mixins/serverData.js
@@ -27,9 +27,9 @@
 export default {
 	computed: {
 		/** @description Returns the serverData object
-		 * @property {String}	account - The account that the user wants to follow (Only in 'OStatus.vue') 
-		 * @property cliUrl 
-		 * @property cloudAddress 
+		 * @property {String}	account - The account that the user wants to follow (Only in 'OStatus.vue')
+		 * @property cliUrl
+		 * @property cloudAddress
 		 * @property firstrun
 		 * @property isAdmin
 		 * @property {String}	local	- The local part of the account that the user wants to follow
diff --git a/src/views/TimelineSinglePost.vue b/src/views/TimelineSinglePost.vue
index e15c87ab..13a98f16 100644
--- a/src/views/TimelineSinglePost.vue
+++ b/src/views/TimelineSinglePost.vue
@@ -111,4 +111,3 @@ export default {
                 font-size: 150%;
         }
 </style>
-