From 395be41728d67ea64eed8bdea6b9c4cbdc4c4ab8 Mon Sep 17 00:00:00 2001
From: Pavel Djundik <xPaw@users.noreply.github.com>
Date: Thu, 13 Sep 2018 12:16:27 +0300
Subject: [PATCH] Move message time formatting to Vue as computed

---
 client/components/App.vue         |  2 --
 client/components/Chat.vue        | 10 ++++------
 client/components/Message.vue     | 10 +++++++++-
 client/components/MessageList.vue |  5 ++---
 client/js/libs/handlebars/tz.js   | 10 ----------
 client/js/vue.js                  |  2 --
 6 files changed, 15 insertions(+), 24 deletions(-)
 delete mode 100644 client/js/libs/handlebars/tz.js

diff --git a/client/components/App.vue b/client/components/App.vue
index 9cf764b5..a8d828c7 100644
--- a/client/components/App.vue
+++ b/client/components/App.vue
@@ -61,7 +61,6 @@
 		<article id="windows">
 			<Chat
 				v-if="activeChannel"
-				:settings="settings"
 				:network="activeChannel.network"
 				:channel="activeChannel.channel" />
 			<div
@@ -107,7 +106,6 @@ export default {
 		Chat,
 	},
 	props: {
-		settings: Object,
 		activeChannel: Object,
 		networks: Array,
 	},
diff --git a/client/components/Chat.vue b/client/components/Chat.vue
index 9f83193e..eb714384 100644
--- a/client/components/Chat.vue
+++ b/client/components/Chat.vue
@@ -6,9 +6,9 @@
 			id="chat"
 			:data-id="channel.id"
 			:class="{
-				'hide-motd': !settings.motd,
-				'colored-nicks': settings.coloredNicks,
-				'show-seconds': settings.showSeconds,
+				'hide-motd': !this.$root.settings.motd,
+				'colored-nicks': this.$root.settings.coloredNicks,
+				'show-seconds': this.$root.settings.showSeconds,
 		}">
 			<div
 				:id="'chan-' + channel.id"
@@ -59,8 +59,7 @@
 					class="chat-content">
 					<MessageList
 						:network="network"
-						:channel="channel"
-						:settings="settings" />
+						:channel="channel" />
 					<ChatUserList
 						v-if="channel.type === 'channel'"
 						:channel="channel" />
@@ -96,7 +95,6 @@ export default {
 		ChatUserList,
 	},
 	props: {
-		settings: Object,
 		network: Object,
 		channel: Object,
 	},
diff --git a/client/components/Message.vue b/client/components/Message.vue
index 9a604968..2a20fe8e 100644
--- a/client/components/Message.vue
+++ b/client/components/Message.vue
@@ -5,7 +5,7 @@
 		:data-from="message.from && message.from.nick">
 		<span
 			:aria-label="message.time | localetime"
-			class="time tooltipped tooltipped-e">{{ message.time | tz }}</span>
+			class="time tooltipped tooltipped-e">{{ messageTime }}</span>
 		<template v-if="message.type === 'unhandled'">
 			<span class="from">[{{ message.command }}]</span>
 			<span class="content">
@@ -60,6 +60,9 @@ import LinkPreview from "./LinkPreview.vue";
 import ParsedMessage from "./ParsedMessage.vue";
 import MessageTypes from "./MessageTypes";
 
+const moment = require("moment");
+const constants = require("../js/constants");
+
 MessageTypes.ParsedMessage = ParsedMessage;
 MessageTypes.LinkPreview = LinkPreview;
 MessageTypes.Username = Username;
@@ -73,6 +76,11 @@ export default {
 		keepScrollPosition: Function,
 	},
 	computed: {
+		messageTime() {
+			const format = this.$root.settings.showSeconds ? constants.timeFormats.msgWithSeconds : constants.timeFormats.msgDefault;
+
+			return moment(this.message.time).format(format);
+		},
 		messageComponent() {
 			return "message-" + this.message.type;
 		},
diff --git a/client/components/MessageList.vue b/client/components/MessageList.vue
index b9addc50..a11866dc 100644
--- a/client/components/MessageList.vue
+++ b/client/components/MessageList.vue
@@ -80,7 +80,6 @@ export default {
 		DateMarker,
 	},
 	props: {
-		settings: Object,
 		network: Object,
 		channel: Object,
 	},
@@ -91,12 +90,12 @@ export default {
 			}
 
 			// If actions are hidden, just return a message list with them excluded
-			if (this.settings.statusMessages === "hidden") {
+			if (this.$root.settings.statusMessages === "hidden") {
 				return this.channel.messages.filter((message) => !constants.condensedTypes.includes(message.type));
 			}
 
 			// If actions are not condensed, just return raw message list
-			if (this.settings.statusMessages !== "condensed") {
+			if (this.$root.settings.statusMessages !== "condensed") {
 				return this.channel.messages;
 			}
 
diff --git a/client/js/libs/handlebars/tz.js b/client/js/libs/handlebars/tz.js
deleted file mode 100644
index 8ec5b47e..00000000
--- a/client/js/libs/handlebars/tz.js
+++ /dev/null
@@ -1,10 +0,0 @@
-"use strict";
-
-const moment = require("moment");
-const constants = require("../../constants");
-
-module.exports = function(time) {
-	const options = require("../../options");
-	const format = options.settings.showSeconds ? constants.timeFormats.msgWithSeconds : constants.timeFormats.msgDefault;
-	return moment(time).format(format);
-};
diff --git a/client/js/vue.js b/client/js/vue.js
index eabd27d7..3727666b 100644
--- a/client/js/vue.js
+++ b/client/js/vue.js
@@ -3,12 +3,10 @@
 const Vue = require("vue").default;
 const App = require("../components/App.vue").default;
 const roundBadgeNumber = require("./libs/handlebars/roundBadgeNumber");
-const tz = require("./libs/handlebars/tz");
 const localetime = require("./libs/handlebars/localetime");
 const friendlysize = require("./libs/handlebars/friendlysize");
 const colorClass = require("./libs/handlebars/colorClass");
 
-Vue.filter("tz", tz);
 Vue.filter("localetime", localetime);
 Vue.filter("friendlysize", friendlysize);
 Vue.filter("colorClass", colorClass);