From 01ebfcc3cfd9e9ca606f56280b1f0de71b3add03 Mon Sep 17 00:00:00 2001
From: CodeAlpha Intern <intern@codealpha.com>
Date: Fri, 22 May 2026 12:42:20 +0530
Subject: [PATCH] fix: prevent trim end input from stripping decimal points
 while typing

The Trim End input field previously bound its value directly to 'recipe.trimEnd'. Because 'trimEnd' is stored as a parsed float, typing a decimal point (e.g. '1.') caused the trailing decimal to be immediately stripped by parseFloat during the change handler, making it impossible to type decimal values manually.

Fix: Introduce a local 'endInput' state variable for the Trim End input, mirroring the existing architecture used for 'startInput'. This acts as an intermediary text state, allowing users to type decimals naturally while keeping the underlying recipe state synchronized.
---
 src/components/TrimControl.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/TrimControl.tsx b/src/components/TrimControl.tsx
index efe6bf47..6097139b 100644
--- a/src/components/TrimControl.tsx
+++ b/src/components/TrimControl.tsx
@@ -20,6 +20,7 @@ export default function TrimControl({ recipe, onChange, duration, file }: Props)
   const [startErrorMsg, setStartErrorMsg] = useState("");
   const [endErrorMsg, setEndErrorMsg] = useState("");
   const [startInput, setStartInput] = useState(recipe.trimStart.toString());
+  const [endInput, setEndInput] = useState(recipe.trimEnd !== null ? recipe.trimEnd.toString() : "");
 
   const { waveform, isLoading: waveformLoading } = useAudioWaveform(file);
   const hasAudio = waveform.length > 0;
@@ -28,6 +29,10 @@ export default function TrimControl({ recipe, onChange, duration, file }: Props)
     setStartInput(recipe.trimStart.toString());
   }, [recipe.trimStart]);
 
+  useEffect(() => {
+    setEndInput(recipe.trimEnd !== null ? recipe.trimEnd.toString() : "");
+  }, [recipe.trimEnd]);
+
   const clipLength = (recipe.trimEnd ?? duration) - recipe.trimStart;
 
   const handleStart = (val: string) => {
@@ -74,9 +79,12 @@ export default function TrimControl({ recipe, onChange, duration, file }: Props)
   };
 
   const handleEnd = (val: string) => {
+    setEndInput(val);
+
     if (val === "") {
       onChange({ trimEnd: null });
       setEnd(false);
+      setEndErrorMsg("");
       return;
     }
 
@@ -181,7 +189,7 @@ export default function TrimControl({ recipe, onChange, duration, file }: Props)
             min={0}
             max={duration > 0 ? duration : undefined}
             step={0.1}
-            value={recipe.trimEnd ?? ""}
+            value={endInput}
             spellCheck={false}
             onChange={(e) => handleEnd(e.target.value)}
             aria-label="Trim end time in seconds"