From c16592806dadb18dd14f50438bf34e61097e3be9 Mon Sep 17 00:00:00 2001
From: "Dr. Matthias Jung" <jungma@eit.uni-kl.de>
Date: Wed, 1 Dec 2021 23:27:09 +0100
Subject: [PATCH] Added Line Wrapping to Codeview of CodeMirror (#9563)

* Added Line Wrapping to Codeview of CodeMirror

In the formated code fields line breaks are not done, which requires
scrolling. This might be configurable in the future.

* Make line-wrapping an opt-in options

Co-authored-by: rijkvanzanten <rijkvanzanten@me.com>
---
 app/src/interfaces/input-code/index.ts       | 14 +++++++++++++-
 app/src/interfaces/input-code/input-code.vue |  5 +++++
 app/src/lang/translations/en-US.yaml         |  1 +
 3 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/app/src/interfaces/input-code/index.ts b/app/src/interfaces/input-code/index.ts
index c4faf288d6..d781cad4a1 100644
--- a/app/src/interfaces/input-code/index.ts
+++ b/app/src/interfaces/input-code/index.ts
@@ -48,6 +48,18 @@ export default defineInterface({
 					width: 'half',
 					interface: 'boolean',
 				},
+				schema: {
+					default_value: true,
+				},
+			},
+			{
+				field: 'lineWrapping',
+				name: '$t:interfaces.input-code.line_wrapping',
+				type: 'boolean',
+				meta: {
+					width: 'half',
+					interface: 'boolean',
+				},
 				schema: {
 					default_value: false,
 				},
@@ -75,7 +87,7 @@ export default defineInterface({
 				name: '$t:language',
 				type: 'string',
 				meta: {
-					width: 'half',
+					width: 'full',
 					interface: 'select-dropdown',
 					options: { choices },
 				},
diff --git a/app/src/interfaces/input-code/input-code.vue b/app/src/interfaces/input-code/input-code.vue
index 76bdc5f3f1..9c2286dd9d 100644
--- a/app/src/interfaces/input-code/input-code.vue
+++ b/app/src/interfaces/input-code/input-code.vue
@@ -51,6 +51,10 @@ export default defineComponent({
 			type: Boolean,
 			default: true,
 		},
+		lineWrapping: {
+			type: Boolean,
+			default: false,
+		},
 		placeholder: {
 			type: String,
 			default: null,
@@ -237,6 +241,7 @@ export default defineComponent({
 				defaultOptions,
 				{
 					lineNumbers: props.lineNumber,
+					lineWrapping: props.lineWrapping,
 					readOnly: props.disabled ? 'nocursor' : false,
 					mode: props.language,
 					placeholder: props.placeholder,
diff --git a/app/src/lang/translations/en-US.yaml b/app/src/lang/translations/en-US.yaml
index 64679bf8bc..fe9626ed02 100644
--- a/app/src/lang/translations/en-US.yaml
+++ b/app/src/lang/translations/en-US.yaml
@@ -1257,6 +1257,7 @@ interfaces:
     code: Code
     description: Write or share code snippets
     line_number: Line Number
+    line_wrapping: Line Wrapping
     placeholder: Enter code here...
   system-collection:
     collection: Collection