diff --git a/package.json b/package.json index 2c8eb04..17cb9ba 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,7 @@ "dependencies": { "@material-ui/core": "^4.11.4", "@material-ui/icons": "^4.11.2", + "@material-ui/lab": "^4.0.0-alpha.58", "@project-serum/anchor": "^0.5.1-beta.2", "@project-serum/serum": "^0.13.34", "@project-serum/sol-wallet-adapter": "^0.2.0", diff --git a/src/components/Info.tsx b/src/components/Info.tsx index e5cbd39..68fc431 100644 --- a/src/components/Info.tsx +++ b/src/components/Info.tsx @@ -9,14 +9,9 @@ import { Info } from "@material-ui/icons"; import PopupState, { bindTrigger, bindPopover } from "material-ui-popup-state"; import { PublicKey } from "@solana/web3.js"; import { useTokenList } from "./context/TokenList"; -import { useSwapContext } from "./context/Swap"; +import { useSwapContext, useSwapFair } from "./context/Swap"; import { useMint } from "./context/Mint"; -import { - useDexContext, - useMarketName, - useFair, - useFairRoute, -} from "./context/Dex"; +import { useDexContext, useMarketName, useFair } from "./context/Dex"; const useStyles = makeStyles((theme) => ({ infoLabel: { @@ -44,7 +39,7 @@ export function InfoLabel() { const { fromMint, toMint } = useSwapContext(); const fromMintInfo = useMint(fromMint); - const fair = useFairRoute(fromMint, toMint); + const fair = useSwapFair(); const tokenList = useTokenList(); let fromTokenInfo = tokenList.filter( diff --git a/src/components/Settings.tsx b/src/components/Settings.tsx index 50c6f4b..3456f2b 100644 --- a/src/components/Settings.tsx +++ b/src/components/Settings.tsx @@ -24,9 +24,10 @@ import { InputAdornment, Link, } from "@material-ui/core"; -import { SettingsOutlined as Settings } from "@material-ui/icons"; +import { ToggleButton } from "@material-ui/lab"; +import { SettingsOutlined as Settings, Close } from "@material-ui/icons"; import PopupState, { bindTrigger, bindPopover } from "material-ui-popup-state"; -import { useSwapContext } from "./context/Swap"; +import { useSwapContext, useSwapFair } from "./context/Swap"; import { useMarket, useOpenOrders } from "./context/Dex"; import { useTokenList } from "./context/TokenList"; import { useMint } from "./context/Mint"; @@ -78,29 +79,75 @@ export function SettingsButton() { } function SettingsDetails() { - const { slippage, setSlippage } = useSwapContext(); + const { slippage, setSlippage, fairOverride, setFairOverride } = + useSwapContext(); const [showSettingsDialog, setShowSettingsDialog] = useState(false); + const fair = useSwapFair(); return (
Settings
- Slippage tolerance - setSlippage(parseFloat(e.target.value))} - style={{ - display: "flex", - justifyContent: "center", - flexDirection: "column", - }} - InputProps={{ - endAdornment: %, - }} - /> +
+ Slippage tolerance + setSlippage(parseFloat(e.target.value))} + style={{ + display: "flex", + justifyContent: "center", + flexDirection: "column", + }} + InputProps={{ + endAdornment: %, + }} + /> +
+
+ Fair price +
+ setFairOverride(parseFloat(e.target.value))} + style={{ + marginRight: "10px", + flex: 1, + display: "flex", + justifyContent: "center", + flexDirection: "column", + }} + disabled={fairOverride === null} + /> + { + if (fair === undefined) { + console.error("Fair is undefined"); + return; + } + if (fairOverride === null) { + setFairOverride(fair); + } else { + setFairOverride(null); + } + }} + style={{ + paddingTop: "3px", + paddingBottom: "3px", + paddingLeft: "5px", + paddingRight: "5px", + borderRadius: "20px", + }} + > + Auto + +
+