duration sanitized

src/components/LoanDurationInput.jsx

@@ -1,12 +1,34 @@
 import BaseInput from "./BaseInput";
+import OnlyDigitsEventMiddleware from "../eventMiddlewares/OnlyDigitsEventMiddleware";
+import MinMaxEventMiddleware from "../eventMiddlewares/MinMaxEventMiddleware";
 
-const LoanDurationInput = ({ onChangeCallback, loanDuration }) => (
+const LoanDurationInput = ({ onChangeCallback, loanDuration }) => {
-  <BaseInput
+  const decoratedChangeHandler = (event) => {
-    label="Duración"
+    const digitDecoratedHandler = () => {
-    value={loanDuration}
+      OnlyDigitsEventMiddleware({
-    onChangeCallback={onChangeCallback}
+        event: event,
-    suffix="Meses"
+        next: onChangeCallback,
-  />
+      });
-);
+    };
 
-export default LoanDurationInput;
+    const minMaxDecoratedHandler = MinMaxEventMiddleware({
+      event: event,
+      next: digitDecoratedHandler,
+      min: 1,
+      max: 360,
+    });
+
+    return minMaxDecoratedHandler;
+  };
+
+  return (
+    <BaseInput
+      label="Duración"
+      value={loanDuration}
+      onChangeCallback={decoratedChangeHandler}
+      suffix="Meses"
+    />
+  );
+};
+
+export default LoanDurationInput;