more accordian show states

components/adv-post-form.js

@@ -21,13 +21,18 @@ export function AdvPostInitial ({ forward, boost }) {
   }
 }
 
+const FormStatus = {
+  DIRTY: 'dirty',
+  ERROR: 'error'
+}
+
 export default function AdvPostForm ({ children, item, storageKeyPrefix }) {
   const me = useMe()
   const { merge } = useFeeButton()
   const router = useRouter()
   const [itemType, setItemType] = useState()
   const formik = useFormikContext()
-  const [show, setShow] = useState(undefined)
+  const [show, setShow] = useState(false)
 
   useEffect(() => {
     const isDirty = formik?.values.forward?.[0].nym !== '' || formik?.values.forward?.[0].pct !== '' ||
@@ -35,7 +40,7 @@ export default function AdvPostForm ({ children, item, storageKeyPrefix }) {
 
     // if the adv post form is dirty on first render, show the accordian
     if (isDirty) {
-      setShow(true)
+      setShow(FormStatus.DIRTY)
     }
 
     // HACK ... TODO: we should generically handle this kind of local storage stuff
@@ -56,7 +61,7 @@ export default function AdvPostForm ({ children, item, storageKeyPrefix }) {
     // force show the accordian if there is an error and the form is submitting
     const hasError = !!formik?.errors?.boost || formik?.errors?.forward?.length > 0
     // if it's open we don't want to collapse on submit
-    setShow(show => show || (hasError && formik?.isSubmitting))
+    setShow(show => hasError && formik?.isSubmitting ? FormStatus.ERROR : show)
   }, [formik?.isSubmitting])
 
   useEffect(() => {

components/job-form.js

@@ -166,9 +166,14 @@ export default function JobForm ({ item, sub }) {
   )
 }
 
+const FormStatus = {
+  DIRTY: 'dirty',
+  ERROR: 'error'
+}
+
 function PromoteJob ({ item, sub }) {
   const formik = useFormikContext()
-  const [show, setShow] = useState(undefined)
+  const [show, setShow] = useState(false)
   const [monthly, setMonthly] = useState(satsMin2Mo(item?.maxBid || 0))
   const [getAuctionPosition, { data }] = useLazyQuery(gql`
     query AuctionPosition($id: ID, $bid: Int!) {
@@ -185,14 +190,14 @@ function PromoteJob ({ item, sub }) {
 
   useEffect(() => {
     if (formik?.values?.maxBid !== 0) {
-      setShow(true)
+      setShow(FormStatus.DIRTY)
     }
   }, [formik?.values])
 
   useEffect(() => {
     const hasMaxBidError = !!formik?.errors?.maxBid
     // if it's open we don't want to collapse on submit
-    setShow(show => show || (hasMaxBidError && formik?.isSubmitting))
+    setShow(show => show || (hasMaxBidError && formik?.isSubmitting && FormStatus.ERROR))
   }, [formik?.isSubmitting])
 
   return (