fix: MintStore Input Fix (teia-community#450)

Author: ryangtanaka-org

src/components/copyright/form/CustomCopyrightForm.jsx

@@ -125,7 +125,7 @@ export const ClausesDescriptions = ({ clauses }) => {
             return null
           } else if (key === 'expirationDateExists') {
             return (
-              <>
+              <React.Fragment key={key}>
                 <li key={key}>
                   {clauseLabels[key]}: {descriptions[key][value]}
                 </li>
@@ -142,7 +142,7 @@ export const ClausesDescriptions = ({ clauses }) => {
                       )
                     : 'None'}
                 </li>
-              </>
+              </React.Fragment>
             )
           } else if (key === 'addendum') {
             return <li key={key}>Addendum: {value ? '✅ Yes' : '🚫 No'}</li>

src/components/form/Form.jsx

@@ -15,14 +15,6 @@ function Form({ fields, defaultValues, children, onSubmit, onReset }) {
     formState: { errors },
   } = useFormContext()
 
-  // Watch all form values and update mintStore
-  const formValues = watch()
-  useEffect(() => {
-    if (Object.keys(formValues).length > 0) {
-      useMintStore.setState(formValues)
-    }
-  }, [formValues])
-
   return (
     <form style={{ width: '100%' }} onSubmit={handleSubmit(onSubmit)}>
       {fields.map((f) => {

src/components/form/MintForm.jsx

@@ -31,12 +31,13 @@ export default function MintForm() {
     isMonoType,
   } = useOutletContext()
   const navigate = useNavigate()
-  const { control } = useFormContext()
-  const { defaultValues } = useFormState({ control })
   const [needsCover, setNeedsCover] = useState(false)
   const [isTypedArt, setIsTypedArt] = useState(false)
   const [preview, setPreview] = useState(null)
 
+  // Get the current state from the mint store
+  const mintStoreState = useMintStore((state) => state)
+
   // Dynamically update conditional fields
   const fields = useMemo(() => {
     return mint_fields({
@@ -135,7 +136,7 @@ export default function MintForm() {
         </div>
       )}
       <Form
-        defaultValues={defaultValues}
+        defaultValues={mintStoreState}
         onSubmit={onSubmit}
         onReset={useMintStore.getState().reset}
         fields={fields}

src/components/preview/index.jsx

@@ -69,8 +69,6 @@ export const Preview = () => {
     st.isMonoType,
   ])
 
-  console.log('customLicenseData in Preview', customLicenseData)
-
   const { ignoreUriMap } = useSettings()
   const token_tags = tags
     ? tags === ''