[BUGFIX] Fix cursor input going EOL (#77)

Author: Lemick

ui/src/components/forms/InlineMonacoEditor.tsx

@@ -10,7 +10,7 @@ type Props = {
   onChange: (value: string) => void;
 };
 
-const MIN_EDITOR_LINE = 18;
+const MIN_EDITOR_LINE = 16;
 const MAX_EDITOR_LINE = 50;
 
 const InlineMonacoEditor = ({ value = '', onChange, dataTestId }: Props) => {

ui/src/components/ui/Input.tsx

@@ -1,25 +1,34 @@
-import * as React from "react"
+import * as React from 'react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
+import { useEffect, useState } from 'react';
 
-export interface InputProps
-  extends React.InputHTMLAttributes<HTMLInputElement> {}
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
 
 const Input = React.forwardRef<HTMLInputElement, InputProps>(
-  ({ className, type, ...props }, ref) => {
+  ({ className, type, value, onChange, ...props }, ref) => {
+    const [storedValue, setStoredValue] = useState(value);
+
     return (
       <input
         type={type}
+        value={storedValue}
+        onChange={(event) => {
+          setStoredValue(event.target.value);
+          if (onChange) {
+            onChange(event);
+          }
+        }}
         className={cn(
-          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
           className
         )}
         ref={ref}
         {...props}
       />
-    )
+    );
   }
-)
-Input.displayName = "Input"
+);
+Input.displayName = 'Input';
 
-export { Input }
+export { Input };