Add Freighter support (#33)

* Trying to get freighter working to sign * re-throw unknown errors * Actually use @stellar/freighter-api * use sandbox network
spotlight301 · Oct 7, 2022 · 7ce11e6 · 7ce11e6
1 parent 12fe5bf
commit 7ce11e6
Show file tree

Hide file tree

Showing 10 changed files with 48 additions and 3,713 deletions.
diff --git a/components/molecules/deposits/index.tsx b/components/molecules/deposits/index.tsx
@@ -1,26 +1,50 @@
 import React from 'react'
+import * as SorobanSdk from 'soroban-sdk'
 import styles from './style.module.css'
 import { Utils } from '../../../shared/utils'
 import BigNumber from 'bignumber.js'
 import { Spacer } from '../../atoms/spacer'
+import * as convert from '../../../convert'
+import { Constants } from '../../../shared/constants'
+import { accountIdentifier } from '../../../shared/identifiers'
+import {
+  ContractValue,
+  useContractValue,
+} from '../../../wallet'
 
 export interface IDepositsProps {
   address: string
   decimals: number
   name?: string
   symbol?: string
   idCrowdfund: string
-  yourDeposits: BigNumber
 }
 
 export function Deposits(props: IDepositsProps) {
+  const useLoadDeposits = (): ContractValue => {
+    return useContractValue(
+      Constants.CrowndfundId,
+      'balance',
+      accountIdentifier(
+        SorobanSdk.StrKey.decodeEd25519PublicKey(props.address)
+      )
+    )
+  }
+
+  let yourDepositsXdr = useLoadDeposits()
+  const yourDeposits = convert.scvalToBigNumber(yourDepositsXdr.result)
+
+  if (yourDeposits.toNumber() <= 0) {
+    return <React.Fragment />
+  }
+
   return (
     <>
       <Spacer rem={2} />
       <h6>You’ve Pledged</h6>
       <div className={styles.pledgeContainer}>
         <span className={styles.values}>
-          {Utils.formatAmount(props.yourDeposits, props.decimals)}{' '}
+          {Utils.formatAmount(yourDeposits, props.decimals)}{' '}
           <span title={props.name}>{props.symbol}</span>
         </span>
         {/*<a>

diff --git a/components/molecules/form-pledge/index.tsx b/components/molecules/form-pledge/index.tsx
@@ -122,6 +122,8 @@ const FormPledge: FunctionComponent<IFormPledgeProps> = props => {
           status: 'error',
           error: e?.message || 'An error has occurred',
         })
+      } else {
+        throw e;
       }
     } finally {
       setSubmitting(false)
@@ -225,10 +227,6 @@ const FormPledge: FunctionComponent<IFormPledgeProps> = props => {
     const { activeChain, server } = useNetwork()
     const networkPassphrase = activeChain?.networkPassphrase ?? ''
 
-    // TODO: Replace with freighter wallet address
-    let address = 'GBZXN7PIRZGNMHGA7MUUUF4GWPY5AYPV6LY4UV2GL6VJGIQRXFDNMADI'
-    let secret = 'SC5O7VZUXDJ6JBDSZ74DSERXL7W3Y5LTOAMRF7RQRL3TAGAPS7LUVG3L'
-
     const { sendTransaction } = useSendTransaction()
 
     const amount = BigNumber(100)
@@ -246,7 +244,7 @@ const FormPledge: FunctionComponent<IFormPledgeProps> = props => {
           )
           let nonce = convert.bigNumberToScBigInt(BigNumber(0))
           const recipient = accountIdentifier(
-            SorobanSdk.StrKey.decodeEd25519PublicKey(address)
+            SorobanSdk.StrKey.decodeEd25519PublicKey(account)
           )
           const amountScVal = convert.bigNumberToScBigInt(
             amount.shiftedBy(decimals).decimalPlaces(0)

diff --git a/components/organisms/pledge/index.tsx b/components/organisms/pledge/index.tsx
@@ -42,18 +42,7 @@ const Pledge: FunctionComponent = () => {
     }
   }
 
-  const useLoadDeposits = (): ContractValue => {
-    return useContractValue(
-      Constants.CrowdfundId,
-      'balance',
-      accountIdentifier(
-        SorobanSdk.StrKey.decodeEd25519PublicKey(Constants.Address)
-      )
-    )
-  }
-
   let token = useLoadToken()
-  let yourDepositsXdr = useLoadDeposits()
   let deadline = useContractValue(Constants.CrowdfundId, 'deadline')
   let started = useContractValue(Constants.CrowdfundId, 'started')
   let targetAmountXdr = useContractValue(Constants.CrowdfundId, 'target')
@@ -74,7 +63,6 @@ const Pledge: FunctionComponent = () => {
       ) * 1000
     )
   const targetAmount = convert.scvalToBigNumber(targetAmountXdr.result)
-  const yourDeposits = convert.scvalToBigNumber(yourDepositsXdr.result)
 
   const startedDate =
     started.result &&
@@ -90,8 +78,7 @@ const Pledge: FunctionComponent = () => {
       token.decimals.loading ||
       token.name.loading ||
       token.symbol.loading ||
-      deadline.loading ||
-      yourDepositsXdr.loading
+      deadline.loading
     )
   }
 
@@ -134,20 +121,19 @@ const Pledge: FunctionComponent = () => {
                 decimals={tokenDecimals || 7}
                 networkPassphrase={networkPassphrase}
                 source={source}
-                address={Constants.Address}
+                address={account.address}
                 symbol={tokenSymbol}
               />
             ) : (
               <ConnectButton label="Connect wallet to pledge" isHigher={true} />
             ))}
-          {yourDeposits.toNumber() > 0 && (
+          {account && (
             <Deposits
-              address={Constants.Address}
+              address={account.address}
               decimals={tokenDecimals || 7}
               name={tokenName}
               symbol={tokenSymbol}
               idCrowdfund={Constants.CrowdfundId}
-              yourDeposits={yourDeposits}
             />
           )}
         </>