refactor: remove isValidFrom state

bleu · Nov 13, 2023 · bf464a6 · bf464a6
1 parent 0937ca7
commit bf464a6
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 30 deletions.
diff --git a/apps/cow-tools/src/app/milkman/(components)/orderForm/Overview.tsx b/apps/cow-tools/src/app/milkman/(components)/orderForm/Overview.tsx
@@ -1,16 +1,14 @@
 import { formatDateToLocalDatetime } from "@bleu-fi/utils/date";
 import { formatNumber } from "@bleu-fi/utils/formatNumber";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { ExclamationTriangleIcon } from "@radix-ui/react-icons";
-import { useEffect, useState } from "react";
+import { useEffect } from "react";
 import { FieldValues, useForm } from "react-hook-form";
 import { formatUnits } from "viem";
 
 import { TokenSelect } from "#/app/milkman/(components)/TokenSelect";
 import { TransactionStatus } from "#/app/milkman/utils/type";
 import { Checkbox } from "#/components/Checkbox";
 import { Input } from "#/components/Input";
-import { Tooltip } from "#/components/Tooltip";
 import { Form, FormMessage } from "#/components/ui/form";
 import { useSafeBalances } from "#/hooks/useSafeBalances";
 import { orderOverviewSchema } from "#/lib/schema";
@@ -34,7 +32,6 @@ export function FormOrderOverview({
   const {
     register,
     setValue,
-    clearErrors,
     formState: { errors },
     watch,
   } = form;
@@ -56,10 +53,6 @@ export function FormOrderOverview({
     ? 0
     : formatUnits(BigInt(tokenSell?.balance), tokenSell?.tokenInfo.decimals);
 
-  const [isValidFromNeeded, setIsValidFromNeeded] = useState(
-    !!defaultValues?.validFrom,
-  );
-
   useEffect(() => {
     if (
       loaded &&
@@ -71,13 +64,6 @@ export function FormOrderOverview({
     }
   }, [loaded]);
 
-  useEffect(() => {
-    if (isValidFromNeeded === false) {
-      setValue("validFrom", undefined);
-      clearErrors("validFrom");
-    }
-  }, [isValidFromNeeded]);
-
   function getHandleSelectToken(variable: "tokenBuy" | "tokenSell") {
     return (token: tokenPriceChecker) => {
       setValue(variable, {
@@ -130,33 +116,32 @@ export function FormOrderOverview({
             </div>
           </div>
           <div className="flex w-1/2 items-start gap-2">
-            <div className="w-full flex items-end">
+            <div className="w-full flex flex-col">
               <Input
                 type="number"
                 label="Amount to sell"
                 placeholder="0.0"
+                step={10 ** -defaultValues?.tokenSellAmount.decimals || 10e-18}
                 defaultValue={defaultValues?.tokenSellAmount}
                 {...register("tokenSellAmount")}
               />
               {formData.tokenSellAmount > Number(walletAmount) && (
-                <div className="m-2">
-                  <Tooltip content="You don't have enough funds of this token.">
-                    <ExclamationTriangleIcon className="h-5 w-5 text-amber9 hover:text-amber9" />
-                  </Tooltip>
+                <div className="mt-1">
+                  <FormMessage className="h-6 text-sm text-amber9">
+                    <span>Insufficient funds of this token.</span>
+                  </FormMessage>
                 </div>
               )}
             </div>
           </div>
         </div>
       </div>
       <div className="w-full flex flex-col">
-        <div className="w-full flex">
-          <TokenSelect
-            onSelectToken={getHandleSelectToken("tokenBuy")}
-            tokenType="buy"
-            selectedToken={formData.tokenBuy ?? undefined}
-          />
-        </div>
+        <TokenSelect
+          onSelectToken={getHandleSelectToken("tokenBuy")}
+          tokenType="buy"
+          selectedToken={formData.tokenBuy ?? undefined}
+        />
         {errors.tokenBuy && (
           <FormMessage className="mt-1 h-6 text-sm text-tomato10">
             <span>{errors.tokenBuy.message}</span>
@@ -186,11 +171,13 @@ export function FormOrderOverview({
 
       <Checkbox
         id="isValidFromNeeded"
-        checked={isValidFromNeeded}
-        onChange={() => setIsValidFromNeeded(!isValidFromNeeded)}
+        checked={formData.isValidFromNeeded}
         label="Order will need valid from"
+        onChange={() =>
+          setValue("isValidFromNeeded", !formData.isValidFromNeeded)
+        }
       />
-      {isValidFromNeeded && (
+      {formData.isValidFromNeeded && (
         <div>
           <Input
             type="datetime-local"

diff --git a/apps/cow-tools/src/lib/schema.ts b/apps/cow-tools/src/lib/schema.ts
@@ -26,6 +26,7 @@ export const orderOverviewSchema = z
     tokenSellAmount: z.coerce.number().positive(),
     tokenBuy: baseTokenAddress,
     receiverAddress: basicAddressSchema,
+    isValidFromNeeded: z.coerce.boolean(),
     validFrom: z.coerce.string().optional(),
   })
   .refine(