From 097d9f7d73c59f56eb4cb789de85a44157e42d8c Mon Sep 17 00:00:00 2001
From: Herpes3000 <61895715+randemgame@users.noreply.github.com>
Date: Sun, 17 Nov 2024 03:08:21 +0200
Subject: [PATCH] prettier / validate / pressing enter in input field allows
 line breaks

couldn't figure out how to visually represent the line breaks in edit field (currently uses space character for new line)
line breaks are lost if any other change made to edit field. otherwise, works alright
---
 .../Scenes/SceneDetails/SceneEditPanel.tsx    | 24 +++++++++----------
 ui/v2.5/src/components/Scenes/styles.scss     |  6 ++---
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx
index c398bd5cd..2e1dfa49e 100644
--- a/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx
+++ b/ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx
@@ -64,8 +64,7 @@ export const SceneEditPanel: React.FC<IProps> = ({
 }) => {
   const intl = useIntl();
   const Toast = useToast();
-  const titleInputRef = useRef<HTMLInputElement>(null);  // Move ref hook to top
-
+  const titleInputRef = useRef<HTMLInputElement>(null);
 
   const [galleries, setGalleries] = useState<Gallery[]>([]);
   const [performers, setPerformers] = useState<Performer[]>([]);
@@ -677,9 +676,8 @@ export const SceneEditPanel: React.FC<IProps> = ({
   }
 
   function renderTitleField() {
-    const displayValue = formik.values.title.replace(/\n/g, ' ');
-    console.log("Rendering with value:", displayValue);
-    
+    const displayValue = formik.values.title.replace(/\n/g, " ");
+
     return (
       <Form.Control
         ref={titleInputRef}
@@ -693,16 +691,18 @@ export const SceneEditPanel: React.FC<IProps> = ({
           if (event.key === "Enter") {
             event.preventDefault();
             const cursorPosition = event.currentTarget.selectionStart ?? 0;
-            const newTitle = formik.values.title.substring(0, cursorPosition) + 
-                            '\n' + 
-                            formik.values.title.substring(cursorPosition);
-            console.log("New title:", newTitle);
+            const newTitle =
+              formik.values.title.substring(0, cursorPosition) +
+              "\n" +
+              formik.values.title.substring(cursorPosition);
             formik.setFieldValue("title", newTitle);
-            
-            // Safely restore cursor position
+
             setTimeout(() => {
               if (titleInputRef.current) {
-                titleInputRef.current.setSelectionRange(cursorPosition + 1, cursorPosition + 1);
+                titleInputRef.current.setSelectionRange(
+                  cursorPosition + 1,
+                  cursorPosition + 1
+                );
               }
             }, 0);
           }
diff --git a/ui/v2.5/src/components/Scenes/styles.scss b/ui/v2.5/src/components/Scenes/styles.scss
index 866f95e4c..4f5ea6def 100644
--- a/ui/v2.5/src/components/Scenes/styles.scss
+++ b/ui/v2.5/src/components/Scenes/styles.scss
@@ -24,9 +24,9 @@
 }
 
 .text-input {
-  white-space: normal !important;
-  overflow: hidden !important;
-  text-overflow: ellipsis !important;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: normal;
 }
 
 .performer-tag-container,