-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[CoW Amm Deployer] Calculate min amount out (#608)
* chore: replace module factory to single module design * fetch AMM info and show it to user * enable stop amm button and create tx * chore: add advanced options with min traded token 0 field * check if module is enable or not * run formatter
- Loading branch information
1 parent
3118a5c
commit cef6e71
Showing
5 changed files
with
265 additions
and
31 deletions.
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,149 @@ | ||
| "use client"; | ||
|
|
||
| import { useSafeAppsSDK } from "@gnosis.pm/safe-apps-react-sdk"; | ||
| import { | ||
| ArrowTopRightIcon, | ||
| Pencil2Icon, | ||
| PlusIcon, | ||
| StopIcon, | ||
| } from "@radix-ui/react-icons"; | ||
| import Link from "next/link"; | ||
| import { useRouter } from "next/navigation"; | ||
| import { gnosis, mainnet } from "viem/chains"; | ||
|
|
||
| import { Button } from "#/components"; | ||
| import { LinkComponent } from "#/components/Link"; | ||
| import { Spinner } from "#/components/Spinner"; | ||
| import WalletNotConnected from "#/components/WalletNotConnected"; | ||
| import { useRawTxData } from "#/hooks/useRawTxData"; | ||
| import { useRunningAMM } from "#/hooks/useRunningAmmInfo"; | ||
| import { TRANSACTION_TYPES } from "#/lib/transactionFactory"; | ||
| import { PRICE_ORACLES } from "#/lib/types"; | ||
| import { getBalancerPoolUrl } from "#/utils/balancerPoolUrl"; | ||
| import { ChainId } from "#/utils/chainsPublicClients"; | ||
| import { getUniV2PairUrl } from "#/utils/univ2pairUrl"; | ||
|
|
||
| import { PoolCompositionTable } from "./(components)/PoolCompositionTable"; | ||
|
|
||
| export function HomePageWrapper() { | ||
| const router = useRouter(); | ||
| const { sendTransactions } = useRawTxData(); | ||
| const { safe, connected } = useSafeAppsSDK(); | ||
| const { loaded, isAmmRunning, cowAmm } = useRunningAMM(); | ||
|
|
||
| if (!connected) { | ||
| return <WalletNotConnected />; | ||
| } | ||
|
|
||
| if (!loaded) { | ||
| return <Spinner />; | ||
| } | ||
|
|
||
| if (safe.chainId !== mainnet.id && safe.chainId !== gnosis.id) { | ||
| return ( | ||
| <div className="flex h-full w-full flex-col items-center rounded-3xl px-12 py-16 md:py-20"> | ||
| <div className="text-center text-3xl text-amber9"> | ||
| This app isn't available on this network | ||
| </div> | ||
| <div className="text-xl text-white"> | ||
| Please change to {gnosis.name} or {mainnet.name} | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| if (!isAmmRunning || !cowAmm) { | ||
| return ( | ||
| <div className="flex w-full justify-center"> | ||
| <div className="my-10 flex w-9/12 flex-col gap-y-5 justify center"> | ||
| <div className="flex items-center justify-between gap-x-8"> | ||
| <div className="flex flex-col gap-1"> | ||
| <h1 className="text-3xl text-slate12"> | ||
| CoW AMM (Automatic Market Maker) | ||
| </h1> | ||
| <span> | ||
| There isn't any AMM running. Create it to provide liquidity | ||
| without suffering with LVR. | ||
| </span> | ||
| </div> | ||
| <div className="flex gap-4"> | ||
| <LinkComponent | ||
| loaderColor="amber" | ||
| href={`/amm/new`} | ||
| content={ | ||
| <Button | ||
| className="flex items-center gap-1 py-3 px-6" | ||
| title="New order" | ||
| > | ||
| <PlusIcon /> | ||
| Create AMM | ||
| </Button> | ||
| } | ||
| /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| const priceOracleLink = | ||
| cowAmm.priceOracle === PRICE_ORACLES.BALANCER | ||
| ? getBalancerPoolUrl( | ||
| safe.chainId as ChainId, | ||
| cowAmm.priceOracleData?.balancerPoolId, | ||
| ) | ||
| : getUniV2PairUrl( | ||
| safe.chainId as ChainId, | ||
| cowAmm.priceOracleData?.uniswapV2PairAddress, | ||
| ); | ||
|
|
||
| return ( | ||
| <div className="flex w-full justify-center"> | ||
| <div className="my-10 flex w-9/12 flex-col gap-y-5 justify center"> | ||
| <div className="flex items-center justify-between gap-x-8"> | ||
| <div className="flex flex-col gap-1"> | ||
| <h1 className="text-3xl text-slate12"> | ||
| CoW AMM (Automatic Market Maker) | ||
| </h1> | ||
| <div className="flex flex-row gap-x-1 items-center"> | ||
| <span>Using price information from {cowAmm.priceOracle}</span> | ||
| {priceOracleLink && ( | ||
| <Link href={priceOracleLink} target="_blank"> | ||
| <ArrowTopRightIcon className="hover:text-slate11" /> | ||
| </Link> | ||
| )} | ||
| </div> | ||
| </div> | ||
| <div className="flex gap-4"> | ||
| <Button | ||
| className="flex items-center gap-1 py-3 px-6 " | ||
| color="tomato" | ||
| onClick={async () => { | ||
| await sendTransactions([ | ||
| { | ||
| type: TRANSACTION_TYPES.STOP_COW_AMM, | ||
| }, | ||
| ]); | ||
| router.refresh(); | ||
| }} | ||
| > | ||
| <StopIcon /> | ||
| Stop | ||
| </Button> | ||
| <Button className="flex items-center gap-1 py-3 px-6" disabled> | ||
| <Pencil2Icon /> | ||
| Edit | ||
| </Button> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col"> | ||
| <span className="text-xl my-2 border-b-2 border-blue7"> | ||
| AMM Composition | ||
| </span> | ||
| </div> | ||
| <PoolCompositionTable cowAmm={cowAmm} /> | ||
| </div> | ||
| </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,57 @@ | ||
| "use client"; | ||
|
|
||
| import * as AccordionPrimitive from "@radix-ui/react-accordion"; | ||
| import { ChevronDownIcon } from "@radix-ui/react-icons"; | ||
| import * as React from "react"; | ||
|
|
||
| import { cn } from "#/lib/utils"; | ||
|
|
||
| const Accordion = AccordionPrimitive.Root; | ||
|
|
||
| const AccordionItem = React.forwardRef< | ||
| React.ElementRef<typeof AccordionPrimitive.Item>, | ||
| React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item> | ||
| >(({ className, ...props }, ref) => ( | ||
| <AccordionPrimitive.Item | ||
| ref={ref} | ||
| className={cn("border-b", className)} | ||
| {...props} | ||
| /> | ||
| )); | ||
| AccordionItem.displayName = "AccordionItem"; | ||
|
|
||
| const AccordionTrigger = React.forwardRef< | ||
| React.ElementRef<typeof AccordionPrimitive.Trigger>, | ||
| React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger> | ||
| >(({ className, children, ...props }, ref) => ( | ||
| <AccordionPrimitive.Header className="flex"> | ||
| <AccordionPrimitive.Trigger | ||
| ref={ref} | ||
| className={cn( | ||
| "flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180", | ||
| className, | ||
| )} | ||
| {...props} | ||
| > | ||
| {children} | ||
| <ChevronDownIcon className="size-4 shrink-0 text-muted-foreground transition-transform duration-200" /> | ||
| </AccordionPrimitive.Trigger> | ||
| </AccordionPrimitive.Header> | ||
| )); | ||
| AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName; | ||
|
|
||
| const AccordionContent = React.forwardRef< | ||
| React.ElementRef<typeof AccordionPrimitive.Content>, | ||
| React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content> | ||
| >(({ className, children, ...props }, ref) => ( | ||
| <AccordionPrimitive.Content | ||
| ref={ref} | ||
| className="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down" | ||
| {...props} | ||
| > | ||
| <div className={cn("pb-4 pt-0", className)}>{children}</div> | ||
| </AccordionPrimitive.Content> | ||
| )); | ||
| AccordionContent.displayName = AccordionPrimitive.Content.displayName; | ||
|
|
||
| export { Accordion, AccordionContent, AccordionItem, AccordionTrigger }; |
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