Merge pull request #260 from G7DAO/feat/update-bridge-sdk

removed gas fee view
G7DAO · Dec 19, 2024 · a15203d · a15203d
2 parents 28039d9 + c4a8cf6
commit a15203d
Show file tree

Hide file tree

Showing 8 changed files with 30 additions and 128 deletions.
diff --git a/webapps/world-builder-dashboard/src/components/bridge/bridge/BridgeView.tsx b/webapps/world-builder-dashboard/src/components/bridge/bridge/BridgeView.tsx
@@ -59,7 +59,6 @@ const BridgeView = ({
     selectedBridgeToken,
     selectedNetworkType,
     setSelectedNativeToken,
-    selectedNativeToken
   } = useBlockchainContext()
 
   const { isFetching: isFetchingTokenInformation, data: tokenInformation } = useTokenInformation({
@@ -249,35 +248,22 @@ const BridgeView = ({
           />
         )}
       <TransactionSummary
-        direction={direction}
         address={connectedAccount}
-        nativeBalance={Number(nativeTokenInformation?.tokenBalance)}
         transferTime={
           direction === 'DEPOSIT'
             ? `~${Math.floor((selectedLowNetwork.retryableCreationTimeout ?? 0) / 60)} min`
             : `~${Math.floor((selectedHighNetwork.challengePeriod ?? 0) / 60)} min`
         }
-        fee={Number(estimatedFee.data?.parentFee ?? 0)}
-        childFee={Number(estimatedFee.data?.childFee ?? 0)}
-        isEstimatingFee={estimatedFee.isFetching}
         value={Number(value)}
         ethRate={ethRate?.ethereum?.usd ?? 0}
         tokenRate={
           selectedBridgeToken.symbol === 'TG7T' || selectedBridgeToken.symbol === 'G7'
             ? 1
             : isCoinFetching
               ? 0.0
-              : coinUSDRate[selectedBridgeToken?.geckoId ?? ''].usd
+              : coinUSDRate[selectedBridgeToken?.geckoId ?? ''].usd ?? 0
         }
         tokenSymbol={tokenInformation?.symbol ?? ''}
-        gasNativeTokenSymbol={
-          selectedNativeToken?.symbol ?? ''
-        }
-        gasChildNativeTokenSymbol={
-          selectedHighNetwork.nativeCurrency?.symbol ?? ''
-        }
-        selectedLowChain={selectedLowNetwork}
-        selectedHighChain={selectedHighNetwork}
       />
       {networkErrorMessage && <div className={styles.networkErrorMessage}>{networkErrorMessage}</div>}
       {direction === 'DEPOSIT' && <div className={styles.manualGasMessageContainer}>
@@ -290,7 +276,7 @@ const BridgeView = ({
           `}
           label=' Gas requirements may change on the destination chain, requiring manual completion. Check the Activity tab for updates.'
           position='top'
-          className={styles.manualGasMessageTooltip }
+          className={styles.manualGasMessageTooltip}
         >
           <IconAlertCircle stroke='#FFFAEB' height={12} width={12} />
         </Tooltip>

diff --git a/webapps/world-builder-dashboard/src/components/bridge/bridge/MultiTokenApproval.tsx b/webapps/world-builder-dashboard/src/components/bridge/bridge/MultiTokenApproval.tsx
@@ -27,7 +27,7 @@ interface MultiTokenApprovalProps {
 }
 
 export const MultiTokenApproval: React.FC<MultiTokenApprovalProps> = ({ showApproval, setShowApproval, bridger, balance, nativeBalance, decimals, tokens, startingTokenIndex, onApprovalComplete, gasFees, amount }) => {
-  const { selectedNetworkType, getProvider, selectedNativeToken } = useBlockchainContext()
+  const { selectedNetworkType, getProvider } = useBlockchainContext()
   const queryClient = useQueryClient()
   const networks = getNetworks(selectedNetworkType)
 
@@ -185,11 +185,6 @@ export const MultiTokenApproval: React.FC<MultiTokenApprovalProps> = ({ showAppr
             <div className={styles.hintText}>
               Set token limit to allow the bridge contract to perform token transfers on your behalf. It cannot move funds without your permission.
             </div>
-            <div className={styles.hintBadge}>
-              <div className={styles.hintBadgeText}>
-                ~{gasFees[currentTokenIndex]} {currentTokenIndex === 0 ? selectedNativeToken?.symbol : tokens[currentTokenIndex].symbol} will be used for gas
-              </div>
-            </div>
           </div>
         ) : (
           <div>Invalid token selection</div>

diff --git a/webapps/world-builder-dashboard/src/components/bridge/bridge/TransactionSummary.tsx b/webapps/world-builder-dashboard/src/components/bridge/bridge/TransactionSummary.tsx
@@ -3,7 +3,6 @@ import styles from './TransactionSummary.module.css'
 import { Tooltip, useClipboard } from 'summon-ui/mantine'
 import { mantineBreakpoints } from '@/styles/breakpoints'
 import { useMediaQuery } from '@mantine/hooks'
-import { NetworkInterface } from '@/contexts/BlockchainContext'
 
 const formatCurrency = (value: number) => {
   const formatter = new Intl.NumberFormat('en-US', {
@@ -18,36 +17,18 @@ const formatCurrency = (value: number) => {
 interface TransactionSummaryProps {
   address: string | undefined
   transferTime: string
-  fee: number
-  isEstimatingFee: boolean
   value: number
-  nativeBalance: number
   ethRate: number
   tokenRate: number
   tokenSymbol: string
-  gasNativeTokenSymbol: string
-  gasChildNativeTokenSymbol: string
-  direction: 'DEPOSIT' | 'WITHDRAW'
-  selectedLowChain: NetworkInterface
-  selectedHighChain: NetworkInterface
-  childFee: number
 }
 const TransactionSummary: React.FC<TransactionSummaryProps> = ({
-  direction,
-  nativeBalance,
   address,
   transferTime,
-  fee,
-  isEstimatingFee,
   ethRate,
   tokenRate,
   tokenSymbol,
-  gasNativeTokenSymbol,
-  gasChildNativeTokenSymbol,
   value,
-  selectedHighChain,
-  selectedLowChain,
-  childFee
 }) => {
   const clipboard = useClipboard({ timeout: 700 })
 
@@ -93,86 +74,6 @@ const TransactionSummary: React.FC<TransactionSummaryProps> = ({
           <div className={styles.value}>{transferTime}</div>
         </div>
         <div className={styles.divider} />
-        {direction === 'DEPOSIT' ? (
-          <>
-            <div className={styles.dataRow}>
-              <div className={styles.itemName}>Estimated gas fee on {selectedLowChain.displayName}</div>
-              {!!fee ? (
-                <div className={styles.valueContainer}>
-                  <div
-                    className={styles.value}
-                    title={`Balance: ${String(nativeBalance)} ${gasNativeTokenSymbol}`}
-                  >{`${fee.toFixed(18).replace(/\.?0+$/, '')} ${gasNativeTokenSymbol}`}</div>
-                  {!!(fee * ethRate) && (
-                    <div className={styles.valueNote}>
-                      {formatCurrency(fee * ethRate)}
-                    </div>
-                  )}
-                </div>
-              ) : (
-                <div className={styles.valueNote}>{isEstimatingFee ? 'Estimating...' : `Can't estimate fee`}</div>
-              )}
-            </div>
-            <div className={styles.dataRow}>
-              <div className={styles.itemName}>Estimated gas fee on {selectedHighChain.displayName}</div>
-              {!!childFee ? (
-                <div className={styles.valueContainer}>
-                  <div
-                    className={styles.value}
-                    title={`Balance: ${String(nativeBalance)} ${gasChildNativeTokenSymbol}`}
-                  >{`${childFee.toFixed(18).replace(/\.?0+$/, '')} ${gasChildNativeTokenSymbol}`}</div>
-                  {!!(childFee * ethRate) && (
-                    <div className={styles.valueNote}>
-                      {formatCurrency(childFee * ethRate)}
-                    </div>
-                  )}
-                </div>
-              ) : (
-                <div className={styles.valueNote}>{isEstimatingFee ? 'Estimating...' : `Can't estimate fee`}</div>
-              )}
-            </div>
-          </>
-        ) : (
-          <>
-            <div className={styles.dataRow}>
-              <div className={styles.itemName}>Estimated gas fee on {selectedHighChain.displayName}</div>
-              {!!childFee ? (
-                <div className={styles.valueContainer}>
-                  <div
-                    className={styles.value}
-                    title={`Balance: ${String(nativeBalance)} ${gasChildNativeTokenSymbol}`}
-                  >{`${childFee.toFixed(18).replace(/\.?0+$/, '')} ${gasChildNativeTokenSymbol}`}</div>
-                  {!!(childFee * ethRate) && (
-                    <div className={styles.valueNote}>
-                      {formatCurrency(childFee * ethRate)}
-                    </div>
-                  )}
-                </div>
-              ) : (
-                <div className={styles.valueNote}>{isEstimatingFee ? 'Estimating...' : `Can't estimate fee`}</div>
-              )}
-            </div>
-            <div className={styles.dataRow}>
-              <div className={styles.itemName}>Estimated gas fee on {selectedLowChain.displayName}</div>
-              {!!fee ? (
-                <div className={styles.valueContainer}>
-                  <div
-                    className={styles.value}
-                    title={`Balance: ${String(nativeBalance)} ${gasNativeTokenSymbol}`}
-                  >{`${fee.toFixed(18).replace(/\.?0+$/, '')} ${gasNativeTokenSymbol}`}</div>
-                  {!!(fee * ethRate) && (
-                    <div className={styles.valueNote}>
-                      {formatCurrency(fee * ethRate)}
-                    </div>
-                  )}
-                </div>
-              ) : (
-                <div className={styles.valueNote}>{isEstimatingFee ? 'Estimating...' : `Can't estimate fee`}</div>
-              )}
-            </div>
-          </>
-        )}
-        <div className={styles.divider} />
         <div className={styles.dataRow}>
           <div className={styles.itemName}>You will receive</div>
           <div className={styles.valueContainer}>

diff --git a/...ps/world-builder-dashboard/src/components/notifications/NotificationsDropModal.module.css b/...ps/world-builder-dashboard/src/components/notifications/NotificationsDropModal.module.css
@@ -85,7 +85,7 @@
   background: var(--Warning-100, #fef0c7);
 }
 .iconCloseClaimable {
-  color: var(--Warning-700, #b54708);
+  stroke: #fff;
 }
 .iconCloseClaimable:hover {
   color: var(--Warning-800, #b54708);

diff --git a/webapps/world-builder-dashboard/src/contexts/BridgeNotificationsContext.tsx b/webapps/world-builder-dashboard/src/contexts/BridgeNotificationsContext.tsx
@@ -51,7 +51,7 @@ export const BridgeNotificationsProvider: React.FC<BridgeNotificationsProviderPr
       try {
         transactions = JSON.parse(transactionsString)
         if (Array.isArray(transactions) && transactions.some((t) => t.newTransaction)) {
-          const newTransactions = transactions.map((t: any) => ({ ...t, newTransaction: null }))
+          const newTransactions = transactions.map((t: any) => ({ ...t, newTransaction: null, seen: true }))
           localStorage.setItem(storageKey, JSON.stringify(newTransactions))
           setNewNotifications([])
         }

diff --git a/webapps/world-builder-dashboard/src/hooks/useBridgeTransfer.ts b/webapps/world-builder-dashboard/src/hooks/useBridgeTransfer.ts
@@ -208,6 +208,7 @@ export const useBridgeTransfer = () => {
           let transactions = transactionsString ? JSON.parse(transactionsString) : []
           const newTransactions: TransactionRecord[] = transactions.map((t: TransactionRecord) => {
             if (isDeposit ? t.lowNetworkHash === txHash : t.highNetworkHash === txHash) {
+              console.log(res?.transactionHash)
               return {
                 ...t,
                 completionTimestamp:  Date.now() / 1000,

diff --git a/webapps/world-builder-dashboard/src/hooks/useL2ToL1MessageStatus.ts b/webapps/world-builder-dashboard/src/hooks/useL2ToL1MessageStatus.ts
@@ -254,11 +254,10 @@ export const getNotifications = (transactions: TransactionRecord[]) => {
   const completedTransactions = transactions.filter((tx) =>
     tx.type === 'DEPOSIT' ? tx.status === 6 || tx.status === 9 || tx.status === 11 || tx.status === 12 : tx.completionTimestamp || tx.claimableTimestamp
   )
-  console.log(completedTransactions)
   const notifications: BridgeNotification[] = completedTransactions
     .map((ct) => {
       const timestamp = ct.completionTimestamp ?? ct.claimableTimestamp ?? Date.now() / 1000
-      
+
       return {
         status: ct.isFailed ? 'FAILED' : ct.completionTimestamp ? 'COMPLETED' : 'CLAIMABLE',
         type: ct.type,
@@ -329,17 +328,14 @@ export const usePendingTransactions = (connectedAccount: string | undefined): Us
 
         const updatedTransactions: TransactionRecord[] = []
 
-
         for (const t of transactions) {
           if (t.type === 'DEPOSIT') {
             if (t.status === BridgeTransferStatus.CCTP_COMPLETE) {
-              console.log(t)
               updatedTransactions.push({ ...t, claimableTimestamp: Date.now() / 1000, newTransaction: true })
             }
           }
           if (t.type === 'WITHDRAWAL') {
             if (t.status === ChildToParentMessageStatus.CONFIRMED || t.status === BridgeTransferStatus.CCTP_COMPLETE) {
-              console.log(t)
               if (!t.claimableTimestamp) {
                 updatedTransactions.push({ ...t, claimableTimestamp: Date.now() / 1000, newTransaction: true })
               }

diff --git a/webapps/world-builder-dashboard/vite.config.ts.timestamp-1734618911654-0405c445c9457.mjs b/webapps/world-builder-dashboard/vite.config.ts.timestamp-1734618911654-0405c445c9457.mjs
@@ -0,0 +1,23 @@
+// vite.config.ts
+import { resolve } from "path";
+import { defineConfig } from "file:///Users/memokhoury/Desktop/g7/protocol/webapps/world-builder-dashboard/node_modules/vite/dist/node/index.js";
+import react from "file:///Users/memokhoury/Desktop/g7/protocol/webapps/world-builder-dashboard/node_modules/@vitejs/plugin-react-swc/index.mjs";
+var __vite_injected_original_dirname = "/Users/memokhoury/Desktop/g7/protocol/webapps/world-builder-dashboard";
+var vite_config_default = defineConfig({
+  plugins: [react()],
+  resolve: {
+    alias: {
+      "@": resolve(__vite_injected_original_dirname, "./src")
+    }
+  },
+  css: {
+    postcss: "./postcss.config.js"
+  },
+  server: {
+    port: 3e3
+  }
+});
+export {
+  vite_config_default as default
+};
+//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcudHMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCIvVXNlcnMvbWVtb2tob3VyeS9EZXNrdG9wL2c3L3Byb3RvY29sL3dlYmFwcHMvd29ybGQtYnVpbGRlci1kYXNoYm9hcmRcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfZmlsZW5hbWUgPSBcIi9Vc2Vycy9tZW1va2hvdXJ5L0Rlc2t0b3AvZzcvcHJvdG9jb2wvd2ViYXBwcy93b3JsZC1idWlsZGVyLWRhc2hib2FyZC92aXRlLmNvbmZpZy50c1wiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9pbXBvcnRfbWV0YV91cmwgPSBcImZpbGU6Ly8vVXNlcnMvbWVtb2tob3VyeS9EZXNrdG9wL2c3L3Byb3RvY29sL3dlYmFwcHMvd29ybGQtYnVpbGRlci1kYXNoYm9hcmQvdml0ZS5jb25maWcudHNcIjtpbXBvcnQgeyByZXNvbHZlIH0gZnJvbSAncGF0aCdcbmltcG9ydCB7IGRlZmluZUNvbmZpZyB9IGZyb20gJ3ZpdGUnXG5pbXBvcnQgcmVhY3QgZnJvbSAnQHZpdGVqcy9wbHVnaW4tcmVhY3Qtc3djJ1xuXG4vLyBodHRwczovL3ZpdGVqcy5kZXYvY29uZmlnL1xuZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29uZmlnKHtcbiAgcGx1Z2luczogW3JlYWN0KCldLFxuICByZXNvbHZlOiB7XG4gICAgYWxpYXM6IHtcbiAgICAgICdAJzogcmVzb2x2ZShfX2Rpcm5hbWUsICcuL3NyYycpXG4gICAgfVxuICB9LFxuICBjc3M6IHtcbiAgICBwb3N0Y3NzOiAnLi9wb3N0Y3NzLmNvbmZpZy5qcydcbiAgfSxcbiAgc2VydmVyOiB7XG4gICAgcG9ydDogMzAwMFxuICB9XG59KVxuIl0sCiAgIm1hcHBpbmdzIjogIjtBQUFpWSxTQUFTLGVBQWU7QUFDelosU0FBUyxvQkFBb0I7QUFDN0IsT0FBTyxXQUFXO0FBRmxCLElBQU0sbUNBQW1DO0FBS3pDLElBQU8sc0JBQVEsYUFBYTtBQUFBLEVBQzFCLFNBQVMsQ0FBQyxNQUFNLENBQUM7QUFBQSxFQUNqQixTQUFTO0FBQUEsSUFDUCxPQUFPO0FBQUEsTUFDTCxLQUFLLFFBQVEsa0NBQVcsT0FBTztBQUFBLElBQ2pDO0FBQUEsRUFDRjtBQUFBLEVBQ0EsS0FBSztBQUFBLElBQ0gsU0FBUztBQUFBLEVBQ1g7QUFBQSxFQUNBLFFBQVE7QUFBQSxJQUNOLE1BQU07QUFBQSxFQUNSO0FBQ0YsQ0FBQzsiLAogICJuYW1lcyI6IFtdCn0K