Hide 'show more history' button if there are no more messages

client/components/Chat.vue

@@ -57,7 +57,7 @@
 						ref="chat"
 						class="chat"
 					>
-						<div class="show-more">
+						<div :class="['show-more', { show: channel.moreHistoryAvailable }]">
 							<button
 								ref="loadMoreButton"
 								:disabled="channel.historyLoading || !$root.connected"

client/css/style.css

@@ -1080,6 +1080,7 @@ background on hover (unless active) */
 	padding-top: 15px;
 	padding-bottom: 0;
 	width: 100%;
+	display: none;
 }
 
 #chat .show-more .btn {

client/js/socket-events/more.js

@@ -18,6 +18,7 @@ socket.on("more", function(data) {
 		return;
 	}
 
+	channel.channel.moreHistoryAvailable = data.moreHistoryAvailable;
 	channel.channel.messages.unshift(...data.messages);
 	channel.channel.historyLoading = false;
 
@@ -26,8 +27,4 @@ socket.on("more", function(data) {
 		const position = chan.height() - heightOld;
 		scrollable.finish().scrollTop(position);
 	});
-
-	if (data.messages.length !== 100) {
-		scrollable.find(".show-more").removeClass("show");
-	}
 });

src/client.js

@@ -400,6 +400,7 @@ Client.prototype.more = function(data) {
 	return {
 		chan: chan.id,
 		messages: messages,
+		moreHistoryAvailable: index > 100,
 	};
 };
 

src/models/chan.js

@@ -178,12 +178,14 @@ Chan.prototype.getFilteredClone = function(lastActiveChannel, lastMessage) {
 				newChannel[prop] = this[prop]
 					.filter((m) => m.id > lastMessage)
 					.slice(-100);
+				newChannel.moreHistoryAvailable = this[prop].length > 100;
 			} else {
 				// If channel is active, send up to 100 last messages, for all others send just 1
 				// Client will automatically load more messages whenever needed based on last seen messages
-				const messagesToSend = lastActiveChannel === true || this.id === lastActiveChannel ? -100 : -1;
+				const messagesToSend = lastActiveChannel === true || this.id === lastActiveChannel ? 100 : 1;
 
-				newChannel[prop] = this[prop].slice(messagesToSend);
+				newChannel[prop] = this[prop].slice(-messagesToSend);
+				newChannel.moreHistoryAvailable = this[prop].length > messagesToSend;
 			}
 		} else {
 			newChannel[prop] = this[prop];