feat: edit duration in cuesheet

apps/client/src/common/components/input/text-input/useReactiveTextInput.tsx

@@ -15,6 +15,7 @@ export default function useReactiveTextInput(
   options?: {
     submitOnEnter?: boolean;
     submitOnCtrlEnter?: boolean;
+    onCancelUpdate?: () => void;
   },
 ): UseReactiveTextInputReturn {
   const [text, setText] = useState<string>(initialText);
@@ -47,7 +48,9 @@ export default function useReactiveTextInput(
   const handleSubmit = useCallback(
     (valueToSubmit: string) => {
       // No need to update if it hasn't changed
-      if (valueToSubmit !== initialText) {
+      if (valueToSubmit === initialText) {
+        options?.onCancelUpdate?.();
+      } else {
         const cleanVal = valueToSubmit.trim();
         submitCallback(cleanVal);
         if (cleanVal !== valueToSubmit) {
@@ -56,7 +59,7 @@ export default function useReactiveTextInput(
       }
       setTimeout(() => ref.current?.blur()); // Immediate timeout to ensure text is set before bluring
     },
-    [initialText, ref, submitCallback],
+    [initialText, options, ref, submitCallback],
   );
 
   /**
@@ -66,8 +69,9 @@ export default function useReactiveTextInput(
   const handleEscape = useCallback(() => {
     // No need to update if it hasn't changed
     setText(initialText);
+    options?.onCancelUpdate?.();
     setTimeout(() => ref.current?.blur()); // Immediate timeout to ensure text is set before bluring
-  }, [initialText, ref]);
+  }, [initialText, options, ref]);
 
   const keyHandler = useMemo(() => {
     const hotKeys: HotkeyItem[] = [['Escape', handleEscape, { preventDefault: true }]];