mint form persist input fix and UI updates

src/atoms/modal/index.module.scss

@@ -15,6 +15,7 @@
 }
 
 .modalContent {
+  position: absolute;
   top: 0;
   background-color: var(--background-color);
   padding: 20px;

src/components/form/CustomCopyrightForm.jsx

@@ -19,7 +19,7 @@ const initialClauses = {
   exclusiveRights: 'none', // Options are 'none', 'majority', 'superMajority'
   retainCreatorRights: true, // When exclusive rights conditions are met, does the Creator retain their rights to their own work?
   releasePublicDomain: false,
-  requireAttribution: false,
+  requireAttribution: true,
   rightsAreTransferable: true,
   expirationDate: '',
   expirationDateExists: false,
@@ -165,10 +165,12 @@ export const ClausesDescriptions = ({ clauses }) => {
   )
 }
 
-function CustomCopyrightForm({ onChange, value }) {
+function CustomCopyrightForm({ onChange, value, defaultValue }) {
   const { watch } = useFormContext()
   const { license, minterName, address } = useOutletContext()
-  const [clauses, setClauses] = useState(initialClauses)
+  const [clauses, setClauses] = useState(
+    defaultValue?.clauses || initialClauses
+  )
   const [generatedDocument, setGeneratedDocument] = useState(
     'No Permissions Chosen'
   )
@@ -598,7 +600,8 @@ Unless stated otherwise (in this Agreement itself), this Agreement remains effec
           <Checkbox
             name="expirationDateExists"
             label="Add an Expiration Date to Clauses"
-            checked={clauses.expirationDateExists}
+            checked={clauses?.expirationDateExists}
+            defaultValue={defaultValue?.clauses?.expirationDateExists}
             onCheck={handleDateChange}
             className={styles.field}
           />
@@ -619,8 +622,9 @@ Unless stated otherwise (in this Agreement itself), this Agreement remains effec
             <h4>{clauseLabels.expirationDate}</h4>
             <Input
               type="date"
-              value={clauses.expirationDate}
+              value={clauses?.expirationDate}
               onChange={(e) => handleChange(e, 'expirationDate')}
+              defaultValue={defaultValue?.clauses?.expirationDate}
               className={styles.field}
             />
           </div>
@@ -634,6 +638,7 @@ Unless stated otherwise (in this Agreement itself), this Agreement remains effec
               value={clauses?.addendum || ''}
               onChange={handleInputChange}
               placeholder="Add additional notes, clauses, restrictions, scopes, etc."
+              defaultValue={defaultValue?.clauses?.addendum}
               className={styles.field}
             />
           </div>

src/components/form/Form.jsx

@@ -1,8 +1,9 @@
 import Button from '@atoms/button/Button'
 import { get } from 'lodash'
-import { memo } from 'react'
+import { memo, useEffect } from 'react'
 import { useFormContext } from 'react-hook-form'
 import { FormFields } from './FormFields'
+import { useMintStore } from '@context/mintStore'
 
 function Form({ fields, defaultValues, children, onSubmit, onReset }) {
   const {
@@ -14,6 +15,14 @@ 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) => {
@@ -24,7 +33,10 @@ function Form({ fields, defaultValues, children, onSubmit, onReset }) {
             register={register}
             value={value}
             control={control}
-            field={f}
+            field={{
+              ...f,
+              defaultValue: defaultValues?.[f.name],
+            }}
             error={get(errors, f.name)}
           />
         )

src/components/form/FormFields.jsx

@@ -64,6 +64,7 @@ export const FormFields = ({ value, field, error, register, control }) => {
           name={name}
           type={field.type}
           label={field.label}
+          defaultValue={field.defaultValue}
           placeholder={field.placeholder}
           {...register(name, field.rules)}
         >
@@ -77,6 +78,7 @@ export const FormFields = ({ value, field, error, register, control }) => {
           className={styles.field}
           label={field.label}
           placeholder={field.placeholder}
+          defaultValue={field.defaultValue}
           {...register(name, field.rules)}
         >
           <Line />
@@ -89,6 +91,7 @@ export const FormFields = ({ value, field, error, register, control }) => {
           className={styles.typed_field}
           label={field.label}
           placeholder={field.placeholder}
+          defaultValue={field.defaultValue}
           {...register(name, field.rules)}
         >
           <Line />
@@ -112,6 +115,7 @@ export const FormFields = ({ value, field, error, register, control }) => {
               search={field.type === 'select-search'}
               label={field.label}
               placeholder={field.placeholder}
+              defaultValue={field.defaultValue}
               onChange={onChange}
             />
           )}
@@ -129,6 +133,7 @@ export const FormFields = ({ value, field, error, register, control }) => {
               ref={ref}
               className={styles.field}
               label={field.label}
+              defaultValue={field.defaultValue}
               checked={value}
               onCheck={(v) => onChange(v)}
             />
@@ -311,7 +316,11 @@ export const FormFields = ({ value, field, error, register, control }) => {
           defaultValue={field.defaultValue}
           rules={field.rules}
           render={({ field: { onChange, value } }) => (
-            <CustomCopyrightForm onChange={onChange} value={value} />
+            <CustomCopyrightForm
+              onChange={onChange}
+              value={value}
+              defaultValue={field.defaultValue}
+            />
           )}
         />
       )

src/components/form/copyrightmodaltext.ts

@@ -61,7 +61,7 @@ export const copyrightModalText = {
     releasePublicDomain: `
         <p>This clause allows the work to be released to the public domain, effectively removing all copyright restrictions associated with it.</p>
         <p>By releasing the work to the public domain, the creator permits anyone to use, modify, and distribute the work without needing to seek permission or pay royalties. This can be a strategic decision for creators who wish to maximize the work's exposure and accessibility.</p>
-        <p>Public domain release is often irrevocable, meaning once a work is released to the public domain, the creator cannot reclaim the rights. Therefore, it's crucial for Creators to carefully consider the implications before making such a decision, especially since it can be easily referenced on the blockchain itself. ("Announcements" made on social media or other privately-owned platforms often do not constitute</p>
+        <p>Public domain release is often irrevocable, meaning once a work is released to the public domain, the creator cannot reclaim the rights. Therefore, it's crucial for Creators to carefully consider the implications before making such a decision, especially since it can be easily referenced on the blockchain itself. ("Announcements" made on social media or other privately-owned platforms may or may not be admissible as a declaration so it may be risky to assume so.</p>
         <p>This option can be particularly beneficial for educational, cultural, or philanthropic purposes, contributing to the broader public good by freely sharing creative works.</p>
         `,
     requireAttribution: `