From c66f9c885e0d09dbb64603d9a2ea11082695decd Mon Sep 17 00:00:00 2001
From: Nachtalb <info@nachtalb.io>
Date: Fri, 30 Apr 2021 23:53:57 +0200
Subject: [PATCH 1/2] Only scroll history when cursor is on first or last row

Needs to be on first to go up and on last to go down
---
 client/components/ChatInput.vue | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/client/components/ChatInput.vue b/client/components/ChatInput.vue
index d12b9405..35c68b7d 100644
--- a/client/components/ChatInput.vue
+++ b/client/components/ChatInput.vue
@@ -140,18 +140,28 @@ export default {
 				return;
 			}
 
+			const onRow = (
+				this.$refs.input.value.slice(null, this.$refs.input.selectionStart).match(/\n/g) ||
+				[]
+			).length;
+			const totalRows = (this.$refs.input.value.match(/\n/g) || []).length;
+
 			const {channel} = this;
 
 			if (channel.inputHistoryPosition === 0) {
 				channel.inputHistory[channel.inputHistoryPosition] = channel.pendingMessage;
 			}
 
-			if (key === "up") {
+			if (key === "up" && onRow === 0) {
 				if (channel.inputHistoryPosition < channel.inputHistory.length - 1) {
 					channel.inputHistoryPosition++;
+				} else {
+					return;
 				}
-			} else if (channel.inputHistoryPosition > 0) {
+			} else if (key === "down" && channel.inputHistoryPosition > 0 && onRow === totalRows) {
 				channel.inputHistoryPosition--;
+			} else {
+				return;
 			}
 
 			channel.pendingMessage = channel.inputHistory[channel.inputHistoryPosition];

From c5f6b4617fa03699b5e4c2628bd1ce57456c2fec Mon Sep 17 00:00:00 2001
From: Nachtalb <info@nachtalb.io>
Date: Sat, 1 May 2021 00:51:55 +0200
Subject: [PATCH 2/2] Preserve location on first and last line when scrolling
 through inputs

---
 client/components/ChatInput.vue | 33 +++++++++++++++++++++++++++------
 1 file changed, 27 insertions(+), 6 deletions(-)

diff --git a/client/components/ChatInput.vue b/client/components/ChatInput.vue
index 35c68b7d..49f4d6fb 100644
--- a/client/components/ChatInput.vue
+++ b/client/components/ChatInput.vue
@@ -140,11 +140,10 @@ export default {
 				return;
 			}
 
-			const onRow = (
-				this.$refs.input.value.slice(null, this.$refs.input.selectionStart).match(/\n/g) ||
-				[]
-			).length;
-			const totalRows = (this.$refs.input.value.match(/\n/g) || []).length;
+			const oldValue = this.$refs.input.value;
+			const oldPosition = this.$refs.input.selectionStart;
+			const onRow = (oldValue.slice(null, oldPosition).match(/\n/g) || []).length;
+			const totalRows = (oldValue.match(/\n/g) || []).length;
 
 			const {channel} = this;
 
@@ -165,7 +164,29 @@ export default {
 			}
 
 			channel.pendingMessage = channel.inputHistory[channel.inputHistoryPosition];
-			this.$refs.input.value = channel.pendingMessage;
+			const newValue = channel.pendingMessage;
+			this.$refs.input.value = newValue;
+
+			let newPosition;
+
+			if (key === "up") {
+				const lastIndexOfNewLine = newValue.lastIndexOf("\n");
+				const lastLine = newValue.slice(null, lastIndexOfNewLine);
+				newPosition =
+					oldPosition > lastLine.length
+						? newValue.length
+						: lastIndexOfNewLine + oldPosition + 1;
+			} else {
+				const lastPositionOnFirstLine =
+					newValue.indexOf("\n") === -1 ? newValue.length + 1 : newValue.indexOf("\n");
+				const relativeRowPos = oldPosition - oldValue.lastIndexOf("\n") - 1;
+				newPosition =
+					relativeRowPos > lastPositionOnFirstLine
+						? lastPositionOnFirstLine
+						: relativeRowPos;
+			}
+
+			this.$refs.input.setSelectionRange(newPosition, newPosition);
 			this.setInputSize();
 
 			return false;