improve forms by adding select and float inputs

performance fix

app/src/components/Inputs/FloatInput.tsx

@@ -0,0 +1,30 @@
+import { useCallback, useState } from "react";
+import { z } from "zod";
+
+type FloatInputProps = {
+  value: number;
+  onChange: (value: number) => void;
+  id: string;
+};
+
+const FloatInput: React.FC<FloatInputProps> = ({ value, onChange, id }) => {
+  const [inputValue, setInputValue] = useState<string>(value.toString());
+
+  const handleInputChange = useCallback(
+    (e: React.ChangeEvent<HTMLInputElement>) => {
+      const val = e.target.value.replace(",", ".");
+      setInputValue(val);
+
+      const nextValue = z.coerce.number().min(-9999).max(9999).safeParse(val);
+
+      if (nextValue.success) {
+        onChange(nextValue.data);
+      }
+    },
+    [setInputValue, onChange]
+  );
+
+  return <input id={id} onChange={handleInputChange} value={inputValue} />;
+};
+
+export default FloatInput;