sanitize interst

src/components/LoanInterestInput.jsx

@@ -1,12 +1,33 @@
 import BaseInput from "./BaseInput";
+import OnlyDigitsEventMiddleware from "../eventMiddlewares/OnlyDigitsEventMiddleware";
+import MinMaxEventMiddleware from "../eventMiddlewares/MinMaxEventMiddleware";
 
-const LoanInterestInput = ({ onChangeCallback, loanInterest }) => (
-  <BaseInput
-    label="Interés (TIN)"
-    value={loanInterest}
-    onChangeCallback={onChangeCallback}
-    suffix="%"
-  />
-);
+const LoanInterestInput = ({ onChangeCallback, loanInterest }) => {
+  const decoratedChangeHandler = (event) => {
+    const digitDecoratedHandler = () => {
+      OnlyDigitsEventMiddleware({
+        event: event,
+        next: onChangeCallback,
+      });
+    };
+
+    const minMaxDecoratedHandler = MinMaxEventMiddleware({
+      event: event,
+      next: digitDecoratedHandler,
+      min: 0,
+    });
+
+    return minMaxDecoratedHandler;
+  };
+
+  return (
+    <BaseInput
+      label="Interés (TIN)"
+      value={loanInterest}
+      onChangeCallback={decoratedChangeHandler}
+      suffix="%"
+    />
+  );
+};
 
 export default LoanInterestInput;

src/eventMiddlewares/MinMaxEventMiddleware.js

@@ -3,14 +3,12 @@ const MinMaxEventMiddleware = ({ event, next, min = null, max = null }) => {
 
   if ((min || min === 0) && max) {
     if (min <= valueNumber && valueNumber <= max) {
-      console.log("min <= valueNumber <= max");
       next(event);
     }
     return;
   }
 
-  if (min) {
-    console.log("Min");
+  if (min || min === 0) {
     if (min <= valueNumber) {
       next(event);
     }
@@ -18,7 +16,6 @@ const MinMaxEventMiddleware = ({ event, next, min = null, max = null }) => {
   }
 
   if (max) {
-    console.log("Max");
     if (valueNumber <= max) {
       next(event);
     }