From e3aa9fae2ac244e8f7742458cd4c4e3ced25484f Mon Sep 17 00:00:00 2001
From: Azri Kahar <42867097+azrikahar@users.noreply.github.com>
Date: Tue, 19 Oct 2021 00:14:50 +0800
Subject: [PATCH] Fix slug input (#8888)

* allow arrow keys in slug input

* enable preserveTrailingDash for slug input
---
 app/src/components/v-input/v-input.vue | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/app/src/components/v-input/v-input.vue b/app/src/components/v-input/v-input.vue
index d63f49d70e..7e7fe1b7f6 100644
--- a/app/src/components/v-input/v-input.vue
+++ b/app/src/components/v-input/v-input.vue
@@ -179,7 +179,17 @@ export default defineComponent({
 		function processValue(event: KeyboardEvent) {
 			if (!event.key) return;
 			const key = event.key.toLowerCase();
-			const systemKeys = ['meta', 'shift', 'alt', 'backspace', 'tab'];
+			const systemKeys = [
+				'meta',
+				'shift',
+				'alt',
+				'backspace',
+				'tab',
+				'arrowup',
+				'arrowdown',
+				'arrowleft',
+				'arrowright',
+			];
 			const value = (event.target as HTMLInputElement).value;
 
 			if (props.slug === true) {
@@ -233,7 +243,7 @@ export default defineComponent({
 			} else {
 				if (props.slug === true) {
 					const endsWithSpace = value.endsWith(' ');
-					value = slugify(value, { separator: props.slugSeparator });
+					value = slugify(value, { separator: props.slugSeparator, preserveTrailingDash: true });
 					if (endsWithSpace) value += props.slugSeparator;
 				}