Showing connect wallet button on submit page when no wallet is connected (#1329)

* Showing connect wallet button on submit page when no wallet is connected

* Fixing connect button when form hasn't been filled out

src/components/Publish/Actions/index.tsx

@@ -5,6 +5,7 @@ import { FormikContextType, useFormikContext } from 'formik'
 import { FormPublishData } from '../_types'
 import { wizardSteps } from '../_constants'
 import SuccessConfetti from '@shared/SuccessConfetti'
+import { useWeb3 } from '../../../@context/Web3'
 
 export default function Actions({
   scrollToRef,
@@ -20,6 +21,14 @@ export default function Actions({
     isSubmitting,
     setFieldValue
   }: FormikContextType<FormPublishData> = useFormikContext()
+  const { connect, accountId } = useWeb3()
+
+  async function handleActivation(e: FormEvent<HTMLButtonElement>) {
+    // prevent accidentially submitting a form the button might be in
+    e.preventDefault()
+
+    await connect()
+  }
 
   function handleNext(e: FormEvent) {
     e.preventDefault()
@@ -65,13 +74,15 @@ export default function Actions({
             >
               Continue
             </Button>
+          ) : !accountId ? (
+            <Button type="submit" style="primary" onClick={handleActivation}>
+              Connect Wallet
+            </Button>
           ) : (
             <Button
               type="submit"
               style="primary"
-              disabled={
+              disabled={isSubmitting || !isValid}
-                values.user.accountId === '' || !isValid || isSubmitting
-              }
             >
               Submit
             </Button>