Merge pull request #817 from interlay/tom/hotifx/vault-onboarding

Tom/hotifx/vault onboarding

.env.dev

@@ -43,7 +43,7 @@ REACT_APP_SQUID_URL="https://api-testnet.interlay.io/graphql/graphql"
 
 REACT_APP_BITCOIN_NETWORK="mainnet"
 REACT_APP_DEFAULT_ACCOUNT_SEED="//Alice"
-REACT_APP_PARACHAIN_URL="wss://kintsugi.api.onfinality.io/public-ws/"
+REACT_APP_PARACHAIN_URL="wss://api-kusama.interlay.io/parachain/explorer"
 REACT_APP_FAUCET_URL="https://api-dev-kintsugi.interlay.io/faucet"
 REACT_APP_RELAY_CHAIN_NAME="kusama"
 REACT_APP_RELAY_CHAIN_URL="wss://kusama-rpc.polkadot.io"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "interbtc-ui",
-  "version": "2.26.0",
+  "version": "2.26.1",
   "private": true,
   "dependencies": {
     "@craco/craco": "^6.1.1",

src/component-library/CTA/CTA.tsx

@@ -31,7 +31,7 @@ type CTAProps = Props & InheritAttrs & NativeAttrs;
 
 const CTA = forwardRef<HTMLButtonElement, CTAProps>(
   (
-    { children, loading, disabled, variant = 'primary', fullWidth, size = 'medium', onPress, ...props },
+    { children, loading, disabled, variant = 'primary', fullWidth, size = 'medium', onPress, onClick, ...props },
     ref
   ): JSX.Element => {
     const domRef = useDOMRef(ref);
@@ -49,7 +49,7 @@ const CTA = forwardRef<HTMLButtonElement, CTAProps>(
         variant={variant}
         size={size}
         isFocusVisible={isFocusVisible}
-        {...mergeProps(props, buttonProps, focusProps)}
+        {...mergeProps(props, buttonProps, focusProps, { onClick })}
       >
         {loading && (
           <LoadingWrapper>

src/pages/Vaults/VaultsOverview/components/CreateVaultWizard/DespositCollateralStep.tsx

@@ -80,8 +80,8 @@ const DepositCollateralStep = ({
     <>
       <ModalHeader color='secondary'>{t('vault.deposit_collateral')}</ModalHeader>
       <ModalDivider color='secondary' />
-      <ModalBody>
-        <form onSubmit={h(handleSubmit)}>
+      <form onSubmit={h(handleSubmit)}>
+        <ModalBody>
           <Stack spacing='double'>
             <TokenInput
               aria-labelledby={titleId}
@@ -112,21 +112,21 @@ const DepositCollateralStep = ({
               </StyledDItem>
             </StyledDl>
           </Stack>
-          {registerNewVaultMutation.isError && (
-            <ErrorModal
-              open={registerNewVaultMutation.isError}
-              onClose={() => registerNewVaultMutation.reset()}
-              title='Error'
-              description={registerNewVaultMutation.error?.message || ''}
-            />
-          )}
-        </form>
-      </ModalBody>
-      <ModalFooter>
-        <CTA type='submit' disabled={isBtnDisabled} fullWidth loading={registerNewVaultMutation.isLoading}>
-          {t('vault.deposit_collateral')}
-        </CTA>
-      </ModalFooter>
+        </ModalBody>
+        <ModalFooter>
+          <CTA type='submit' disabled={isBtnDisabled} fullWidth loading={registerNewVaultMutation.isLoading}>
+            {t('vault.deposit_collateral')}
+          </CTA>
+        </ModalFooter>
+      </form>
+      {registerNewVaultMutation.isError && (
+        <ErrorModal
+          open={registerNewVaultMutation.isError}
+          onClose={() => registerNewVaultMutation.reset()}
+          title='Error'
+          description={registerNewVaultMutation.error?.message || ''}
+        />
+      )}
     </>
   );
 };

src/pages/Vaults/VaultsOverview/components/CreateVaultWizard/DisclaimerStep.tsx

@@ -72,7 +72,7 @@ const DisclaimerStep = ({ onClickAgree }: DisclaimerStepProps): JSX.Element => {
         </Stack>
       </ModalBody>
       <ModalFooter>
-        <CTA size='large' fullWidth onClick={onClickAgree}>
+        <CTA size='large' fullWidth onPress={onClickAgree}>
           {t('vault.disclaimer.accept_risks_involved')}
         </CTA>
         <CTALink external to={INTERLAY_VAULT_DOCS_LINK} variant='secondary' size='large' fullWidth>