[WIP] Liquidity Bridge Integration #99
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -8,13 +8,17 @@ import BridgeSection from "../sections/bridge"; | |
| import { useAvailAccount } from "@/stores/availwallet"; | ||
| import { useAccount } from "wagmi"; | ||
| import { useTransactionsStore } from "@/stores/transactions"; | ||
| import TransactionModal from "../sections/bridge/review-section"; | ||
| import { useCommonStore } from "@/stores/common"; | ||
| import AdvancedSettings from "./settings"; | ||
|
|
||
| export default function Container() { | ||
| const [activeTab, setActiveTab] = useState("bridge"); | ||
|
|
||
| const { selected } = useAvailAccount(); | ||
| const { address } = useAccount(); | ||
| const { fetchAllTransactions, setTransactionLoader} = useTransactionsStore(); | ||
| const { reviewDialog: { isOpen: isModalOpen, onOpenChange: setIsModalOpen } } = useCommonStore(); | ||
|
|
||
| useEffect(()=>{ | ||
| (async () => { | ||
|
|
@@ -47,8 +51,8 @@ export default function Container() { | |
| id="container" | ||
| className="section_bg p-2 w-screen max-sm:rounded-none max-sm:!border-x-0 !max-w-xl " | ||
| > | ||
| <TabsList className="flex flex-row items-center justify-between bg-transparent !border-0 p-2 mb-6 mx-2 mt-2"> | ||
| <div className="flex flex-row items-center justify-between"> | ||
| <h1 className="font-ppmori items-center flex flex-row space-x-2 text-white text-opacity-80 text-2xl w-full "> | ||
| <span className="relative flex flex-row items-center justify-center"> | ||
| <TabsTrigger | ||
|
|
@@ -80,6 +84,7 @@ export default function Container() { | |
| </span> | ||
| </h1> | ||
| </div> | ||
| <AdvancedSettings/> | ||
| </TabsList> | ||
| <TabsContent id="bridge" value="bridge" className="flex-1"> | ||
| <BridgeSection/> | ||
|
|
@@ -92,6 +97,7 @@ export default function Container() { | |
| <TransactionSection /> | ||
| </TabsContent> | ||
| </Tabs> | ||
| <TransactionModal isOpen={isModalOpen} onClose={() => setIsModalOpen(false)} /> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change | ||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| @@ -0,0 +1,53 @@ | ||||||||||||||||
| import React, { useState } from 'react'; | ||||||||||||||||
| import { ArrowLeft, Info, Settings } from 'lucide-react'; | ||||||||||||||||
|
There was a problem hiding this comment. style: Info icon is imported but never used in the component
Suggested change
|
||||||||||||||||
| import { | ||||||||||||||||
| Dialog, | ||||||||||||||||
| DialogContent, | ||||||||||||||||
| DialogHeader, | ||||||||||||||||
| DialogTitle, | ||||||||||||||||
| } from "@/components/ui/dialog"; | ||||||||||||||||
| import { Switch } from "@/components/ui/switch"; | ||||||||||||||||
|
|
||||||||||||||||
| const AdvancedSettings = () => { | ||||||||||||||||
| const [isOpen, setIsOpen] = useState(false); | ||||||||||||||||
| const [autoClaim, setAutoClaim] = useState(true); | ||||||||||||||||
| const [slippage, setSlippage] = useState('0.5'); | ||||||||||||||||
|
There was a problem hiding this comment. logic: These states should be moved to a global store (e.g. useCommonStore) since they affect bridge behavior and need to persist between component remounts There was a problem hiding this comment. logic: slippage state is defined but never used in the UI or passed to bridge functions |
||||||||||||||||
|
|
||||||||||||||||
| return ( | ||||||||||||||||
| <> | ||||||||||||||||
| <Settings | ||||||||||||||||
| className="hover:text-white hover:cursor-pointer" | ||||||||||||||||
| onClick={() => setIsOpen(true)} | ||||||||||||||||
| /> | ||||||||||||||||
|
|
||||||||||||||||
| <Dialog open={isOpen} onOpenChange={setIsOpen}> | ||||||||||||||||
| <DialogContent className="bg-[#1A1C24] border-0 text-white"> | ||||||||||||||||
| <DialogHeader> | ||||||||||||||||
| <div className="flex items-center gap-2"> | ||||||||||||||||
| <ArrowLeft | ||||||||||||||||
| className="text-gray-400 hover:text-white hover:cursor-pointer" | ||||||||||||||||
| onClick={() => setIsOpen(false)} | ||||||||||||||||
| /> | ||||||||||||||||
|
Comment on lines
+27
to
+30
There was a problem hiding this comment. logic: Redundant close handler - the Dialog already handles closing via onOpenChange. Remove the onClick handler to avoid potential race conditions
Suggested change
|
||||||||||||||||
| <DialogTitle className="text-lg font-medium">Advanced Settings</DialogTitle> | ||||||||||||||||
| </div> | ||||||||||||||||
| </DialogHeader> | ||||||||||||||||
|
|
||||||||||||||||
| <div className="space-y-8 mt-4"> | ||||||||||||||||
| <div className="flex justify-between items-center"> | ||||||||||||||||
| <span className="text-white text-md text-opacity-70 font-ppmori"> | ||||||||||||||||
| Automatically claim on destination chain | ||||||||||||||||
| </span> | ||||||||||||||||
| <Switch | ||||||||||||||||
| className='data-[state=checked]:bg-green-600 data-[state=unchecked]:bg-gray-600' | ||||||||||||||||
| checked={autoClaim} | ||||||||||||||||
| onCheckedChange={setAutoClaim} | ||||||||||||||||
| /> | ||||||||||||||||
| </div> | ||||||||||||||||
| </div> | ||||||||||||||||
| </DialogContent> | ||||||||||||||||
| </Dialog> | ||||||||||||||||
| </> | ||||||||||||||||
| ); | ||||||||||||||||
| }; | ||||||||||||||||
|
|
||||||||||||||||
| export default AdvancedSettings; | ||||||||||||||||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,6 @@ | ||
| import { appConfig } from "@/config/default"; | ||
| import { TxnLifecyle } from "@/hooks/common/useTrackTxnStatus"; | ||
| import { Chain } from "@/types/common"; | ||
|
|
||
| export const getStepStatus = (step: number, status: TxnLifecyle) => { | ||
| if (step === 1) { | ||
|
|
@@ -12,4 +14,37 @@ export const getStepStatus = (step: number, status: TxnLifecyle) => { | |
| : "waiting"; | ||
| } | ||
| return "waiting"; | ||
| }; | ||
|
|
||
| export const chainToChainId = (chain: Chain) => { | ||
| switch (chain) { | ||
| case Chain.ETH: | ||
| return appConfig.networks.ethereum.id; | ||
| case Chain.BASE: | ||
| return appConfig.networks.base.id; | ||
| default: | ||
| throw new Error(`Unsupported chain: ${chain}`); | ||
| } | ||
| } | ||
|
Comment on lines
+19
to
+28
There was a problem hiding this comment. style: Chain.AVAIL case is missing in chainToChainId but exists in chainToAddresses. Consider if this is intentional. |
||
|
|
||
| export const chainToAddresses = (chain: Chain) => { | ||
| switch (chain) { | ||
| case Chain.ETH: | ||
| return { | ||
| tokenAddress: appConfig.contracts.ethereum.availToken, | ||
| bridgeAddress: appConfig.contracts.ethereum.bridge, | ||
| liquidityBridgeAddress: appConfig.contracts.ethereum.liquidityBridgeAddress, | ||
| } | ||
|
Comment on lines
+32
to
+37
There was a problem hiding this comment. logic: ETH chain returns different fields (bridgeAddress) compared to BASE and AVAIL. This inconsistency could cause runtime errors if code expects bridgeAddress to exist. |
||
| case Chain.BASE: | ||
| return { | ||
| tokenAddress: appConfig.contracts.base.availToken, | ||
| liquidityBridgeAddress: appConfig.contracts.base.liquidityBridgeAddress, | ||
| } | ||
| case Chain.AVAIL: | ||
| return { | ||
| liquidityBridgeAddress: appConfig.contracts.avail.liquidityBridgeAddress, | ||
| } | ||
| default: | ||
| throw new Error(`Unsupported chain: ${chain}`); | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,5 +1,5 @@ | ||
|
|
||
| import SubmitTransaction from "./submit-transaction"; | ||
| import FromField from "./fromfield"; | ||
| import ToField from "./tofield"; | ||
| import ChainSwapBtn from "../../chainselector/chainswapbtn"; | ||
|
|
@@ -9,10 +9,10 @@ export default function BridgeSection() { | |
| return ( | ||
| <div className="lg:p-4 p-2"> | ||
| <div className="md:space-y-4 w-full"> | ||
| <FromField/> | ||
| <ChainSwapBtn/> | ||
| <ToField /> | ||
| <SubmitTransaction /> | ||
| </div> | ||
| </div> | ||
| ); | ||
|
|
||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
logic: Missing default test environment URL. Should provide a test/staging URL similar to other API URLs in this file.