Merge pull request #40 from blockworks-foundation/round-to-ticksize

round initial limit price to ticksize

components/trade/AdvancedTradeForm.tsx

@@ -179,6 +179,21 @@ const AdvancedTradeForm = () => {
     })
   }, [])
 
+  const tickDecimals = useMemo(() => {
+    const group = mangoStore.getState().group
+    if (!group || !selectedMarket) return 1
+    let tickSize: number
+    if (selectedMarket instanceof Serum3Market) {
+      const market = group.getSerum3ExternalMarket(
+        selectedMarket.serumMarketExternal
+      )
+      tickSize = market.tickSize
+    } else {
+      tickSize = selectedMarket.tickSize
+    }
+    return getDecimalCount(tickSize)
+  }, [selectedMarket])
+
   /*
    * Updates the limit price on page load
    */
@@ -188,10 +203,10 @@ const AdvancedTradeForm = () => {
       if (!group || !oraclePrice) return
 
       set((s) => {
-        s.tradeForm.price = oraclePrice.toString()
+        s.tradeForm.price = oraclePrice.toFixed(tickDecimals)
       })
     }
-  }, [oraclePrice, tradeForm.price])
+  }, [oraclePrice, tickDecimals, tradeForm.price])
 
   /*
    * Updates the price and the quote size when a Market order is selected
@@ -204,29 +219,20 @@ const AdvancedTradeForm = () => {
       selectedMarket &&
       group
     ) {
-      let tickSize: number
-      if (selectedMarket instanceof Serum3Market) {
-        const market = group.getSerum3ExternalMarket(
-          selectedMarket.serumMarketExternal
-        )
-        tickSize = market.tickSize
-      } else {
-        tickSize = selectedMarket.tickSize
-      }
       if (!isNaN(parseFloat(tradeForm.baseSize))) {
         const baseSize = new Decimal(tradeForm.baseSize)?.toNumber()
         const quoteSize = baseSize * oraclePrice
         set((s) => {
-          s.tradeForm.price = oraclePrice.toFixed(getDecimalCount(tickSize))
+          s.tradeForm.price = oraclePrice.toFixed(tickDecimals)
-          s.tradeForm.quoteSize = quoteSize.toFixed(getDecimalCount(tickSize))
+          s.tradeForm.quoteSize = quoteSize.toFixed(tickDecimals)
         })
       } else {
         set((s) => {
-          s.tradeForm.price = oraclePrice.toFixed(getDecimalCount(tickSize))
+          s.tradeForm.price = oraclePrice.toFixed(tickDecimals)
         })
       }
     }
-  }, [oraclePrice, selectedMarket, tradeForm])
+  }, [oraclePrice, selectedMarket, tickDecimals, tradeForm])
 
   const handlePlaceOrder = useCallback(async () => {
     const client = mangoStore.getState().client

pages/trade.tsx

@@ -10,6 +10,7 @@ import type { NextPage } from 'next'
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
 import { useRouter } from 'next/router'
 import { useEffect } from 'react'
+import { getDecimalCount } from 'utils/numbers'
 
 export async function getStaticProps({ locale }: { locale: string }) {
   return {
@@ -58,12 +59,21 @@ const Trade: NextPage = () => {
         perpMarkets.find((m) => m.name === marketName)
 
       if (mkt) {
+        let tickSize = 4
+        if (mkt instanceof Serum3Market) {
+          const market = group.getSerum3ExternalMarket(mkt.serumMarketExternal)
+          tickSize = market.tickSize
+        } else {
+          tickSize = mkt.tickSize
+        }
         set((s) => {
           s.selectedMarket.name = marketName
           s.selectedMarket.current = mkt
           s.tradeForm = {
             ...DEFAULT_TRADE_FORM,
-            price: getOraclePriceForMarket(group, mkt).toString(),
+            price: getOraclePriceForMarket(group, mkt).toFixed(
+              getDecimalCount(tickSize)
+            ),
           }
         })
       }