From d9493d8385e82c13560078010f13cb41a9397f7e Mon Sep 17 00:00:00 2001
From: Herpes3000 <61895715+randemgame@users.noreply.github.com>
Date: Sat, 16 Nov 2024 22:08:29 +0200
Subject: [PATCH] Actually do what previous commit said

Add JavaScript Key Event Handling: Capture the Enter key press within the title input field to insert a newline character.
---
 .../Scenes/SceneDetails/SceneEditPanel.scss   |  0
 .../Scenes/SceneDetails/SceneEditPanel.tsx    | 37 ++++++++++++++++++-
 2 files changed, 36 insertions(+), 1 deletion(-)
 delete mode 100644 ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.scss

diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.scss b/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.scss
deleted file mode 100644
index e69de29bb2d..00000000000
diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx
index c05657e9037..2eab79bafda 100644
--- a/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx
+++ b/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx
@@ -674,6 +674,37 @@ export const SceneEditPanel: React.FC<IProps> = ({
     return renderInputField("details", "textarea", "details", props);
   }
 
+  const [titleInput, setTitleInput] = useState(scene.title ?? "");
+
+  const handleTitleKeyPress = (
+    event: React.KeyboardEvent<HTMLInputElement>
+  ) => {
+    if (event.key === "Enter") {
+      event.preventDefault();
+      const newTitle = titleInput + "\n";
+      setTitleInput(newTitle);
+      formik.setFieldValue("title", newTitle);
+    }
+  };
+
+  function renderTitleField() {
+    return (
+      <Form.Control
+        className="text-input"
+        type="text"
+        value={titleInput}
+        onChange={(e) => {
+          const newValue = e.target.value;
+          setTitleInput(newValue);
+          formik.setFieldValue("title", newValue);
+        }}
+        onKeyPress={handleTitleKeyPress}
+        style={{ whiteSpace: "pre-wrap" }}
+        isInvalid={!!formik.errors.title}
+      />
+    );
+  }
+
   return (
     <div id="scene-edit-details">
       <Prompt
@@ -730,7 +761,11 @@ export const SceneEditPanel: React.FC<IProps> = ({
         </Row>
         <Row className="form-container px-3">
           <Col lg={7} xl={12}>
-            {renderInputField("title", "textarea")}
+            {renderField(
+              "title",
+              intl.formatMessage({ id: "title" }),
+              renderTitleField()
+            )}
             {renderInputField("code", "text", "scene_code")}
 
             {renderURLListField("urls", onScrapeSceneURL, urlScrapable)}