From 84a28203221d203a171c32d85ca48b5b7bf9980d Mon Sep 17 00:00:00 2001
From: Chris Risner <chris@driv.ly>
Date: Tue, 29 Aug 2023 17:29:02 -0500
Subject: [PATCH] update to stop the payoffRequest from being submitted after
 the form is submitted

---
 src/components/Form.tsx                     | 2 +-
 src/components/sections/TradeInfo/index.tsx | 4 +++-
 src/hooks/usePayoffQuery.tsx                | 8 ++++++++
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/Form.tsx b/src/components/Form.tsx
index f09919f..af69760 100644
--- a/src/components/Form.tsx
+++ b/src/components/Form.tsx
@@ -187,7 +187,7 @@ export default function Form({ vdp }: Props) {
             }
           })}
           <Vehicle errors={errors} watchJoint={watchJoint} />
-          <TradeInfo errors={errors} />
+          <TradeInfo errors={errors} isSubmitting={isSubmitting} />
           <Agreement isError={isError} onClick={() => setError(false)} />
           <div className='mt-8 grid grid-cols-1 px-5 pt-10 md:ml-3 md:grid-cols-3'>
             <button
diff --git a/src/components/sections/TradeInfo/index.tsx b/src/components/sections/TradeInfo/index.tsx
index 923fbcc..3e36e43 100644
--- a/src/components/sections/TradeInfo/index.tsx
+++ b/src/components/sections/TradeInfo/index.tsx
@@ -12,9 +12,10 @@ import { FieldErrors, useFormContext } from 'react-hook-form'
 
 type TradeInfoProps = {
   errors: FieldErrors
+  isSubmitting: boolean
 }
 
-const TradeInfo = ({ errors }: TradeInfoProps) => {
+const TradeInfo = ({ errors, isSubmitting }: TradeInfoProps) => {
   const [payload, setPayload] = useState<any>({})
   const { lenders, lenderCats, isTrade, setTrade } = usePayoffLenders()
   const { watchTradeInVin } = useTradeQuery(setPayload)
@@ -23,6 +24,7 @@ const TradeInfo = ({ errors }: TradeInfoProps) => {
     lenders,
     payload,
     setPayload,
+    isSubmitting,
   })
   const customer = useCustomer((s) => s.customer)
   const methods = useFormContext()
diff --git a/src/hooks/usePayoffQuery.tsx b/src/hooks/usePayoffQuery.tsx
index 0a9f626..83a4397 100644
--- a/src/hooks/usePayoffQuery.tsx
+++ b/src/hooks/usePayoffQuery.tsx
@@ -11,11 +11,13 @@ const usePayoffQuery = ({
   lenders,
   payload,
   setPayload,
+  isSubmitting,
 }: {
   watchTradeInVin: string
   lenders: Record<string, any>[]
   payload: any
   setPayload: Dispatch<any>
+  isSubmitting: boolean
 }) => {
   const [customer, setCustomer] = useCustomer((s) => [s.customer, s.setCustomer])
   const { setValue, setFocus, watch } = useFormContext()
@@ -56,6 +58,12 @@ const usePayoffQuery = ({
     }
   }, [isLienOther, lenders, setFocus, setPayload, ssn, watchLienName, watchTradeInVin])
 
+  useEffect(() => {
+    if(isSubmitting) {
+      setReady(false)
+    }
+  },[isReady, isSubmitting, setReady])
+
   useEffect(() => {
     if (isReady && isTrade && Object.keys(payload)?.length > 0) {
       const getPayoff = async () => {