more shit

components/explore/RecentGainersLosers.tsx

@@ -2,7 +2,7 @@ import Change from '@components/shared/Change'
 import FormatNumericValue from '@components/shared/FormatNumericValue'
 import TokenLogo from '@components/shared/TokenLogo'
 import useListedMarketsWithMarketData, {
-  SerumMarketWithMarketData,
+  SpotMarketWithMarketData,
 } from 'hooks/useListedMarketsWithMarketData'
 import useMangoGroup from 'hooks/useMangoGroup'
 import { useRouter } from 'next/router'
@@ -28,7 +28,7 @@ dayjs.extend(relativeTime)
 
 export type BankWithMarketData = {
   bank: Bank
-  market: SerumMarketWithMarketData | undefined
+  market: SpotMarketWithMarketData | undefined
 }
 
 const CALLOUT_TILES_WRAPPER_CLASSES =
@@ -40,16 +40,16 @@ const RecentGainersLosers = () => {
   const { group } = useMangoGroup()
   const { banks } = useBanks()
   const {
-    serumMarketsWithData,
+    spotMarketsWithData,
     perpMarketsWithData,
     isLoading: loadingSerumMarkets,
   } = useListedMarketsWithMarketData()
   const groupLoaded = mangoStore((s) => s.groupLoaded)
 
   const banksWithMarketData = useMemo(() => {
-    if (!banks.length || !group || !serumMarketsWithData.length) return []
+    if (!banks.length || !group || !spotMarketsWithData.length) return []
     const banksWithMarketData = []
-    const usdcQuoteMarkets = serumMarketsWithData.filter(
+    const usdcQuoteMarkets = spotMarketsWithData.filter(
       (market) => market.quoteTokenIndex === 0,
     )
     for (const bank of banks) {
@@ -63,7 +63,7 @@ const RecentGainersLosers = () => {
       }
     }
     return banksWithMarketData
-  }, [banks, group, serumMarketsWithData])
+  }, [banks, group, spotMarketsWithData])
 
   const newlyListedMintInfo = useMemo(() => {
     if (!group) return []

components/explore/Spot.tsx

@@ -1,5 +1,5 @@
 import useListedMarketsWithMarketData, {
-  SerumMarketWithMarketData,
+  SpotMarketWithMarketData,
 } from 'hooks/useListedMarketsWithMarketData'
 import useMangoGroup from 'hooks/useMangoGroup'
 import { ChangeEvent, useMemo, useState } from 'react'
@@ -24,7 +24,7 @@ import { TOKEN_WATCHLIST_KEY } from 'utils/constants'
 
 export type BankWithMarketData = {
   bank: Bank
-  market: SerumMarketWithMarketData | undefined
+  market: SpotMarketWithMarketData | undefined
 }
 
 const generateSearchTerm = (item: BankWithMarketData, searchValue: string) => {
@@ -99,16 +99,16 @@ const Spot = () => {
   const { group } = useMangoGroup()
   const { banks } = useBanks()
   const { isDesktop } = useViewport()
-  const { serumMarketsWithData, isLoading: loadingMarketsData } =
+  const { spotMarketsWithData, isLoading: loadingMarketsData } =
     useListedMarketsWithMarketData()
   const [sortByKey, setSortByKey] = useState<AllowedKeys>('quote_volume_24h')
   const [search, setSearch] = useState('')
   const [showTableView, setShowTableView] = useState(true)
 
   const banksWithMarketData = useMemo(() => {
-    if (!banks.length || !group || !serumMarketsWithData.length) return []
+    if (!banks.length || !group || !spotMarketsWithData.length) return []
     const banksWithMarketData = []
-    const usdcQuoteMarkets = serumMarketsWithData.filter(
+    const usdcQuoteMarkets = spotMarketsWithData.filter(
       (market) => market.quoteTokenIndex === 0,
     )
     for (const bank of banks) {
@@ -122,7 +122,7 @@ const Spot = () => {
       }
     }
     return banksWithMarketData
-  }, [banks, group, serumMarketsWithData])
+  }, [banks, group, spotMarketsWithData])
 
   const sortedTokensToShow = useMemo(() => {
     if (!banksWithMarketData.length) return []

components/explore/SpotTable.tsx

@@ -28,7 +28,7 @@ import { useRouter } from 'next/router'
 import Decimal from 'decimal.js'
 import BankAmountWithValue from '@components/shared/BankAmountWithValue'
 import { BankWithMarketData } from './Spot'
-import { SerumMarketWithMarketData } from 'hooks/useListedMarketsWithMarketData'
+import { SpotMarketWithMarketData } from 'hooks/useListedMarketsWithMarketData'
 import Tooltip from '@components/shared/Tooltip'
 import TableTokenName from '@components/shared/TableTokenName'
 import { LinkButton } from '@components/shared/Button'
@@ -47,7 +47,7 @@ type TableData = {
   change: number
   depositRate: number
   tokenName: string
-  market: SerumMarketWithMarketData | undefined
+  market: SpotMarketWithMarketData | undefined
   price: number
   priceHistory: {
     price: number

components/modals/ModifyTvOrderModal.tsx

@@ -13,12 +13,12 @@ import {
   Serum3SelfTradeBehavior,
   Serum3Side,
 } from '@blockworks-foundation/mango-v4'
-import mangoStore from '@store/mangoStore'
+import mangoStore, { OpenbookOrder } from '@store/mangoStore'
 import { PublicKey } from '@solana/web3.js'
 import { notify } from 'utils/notifications'
 import { isMangoError } from 'types'
 import Button, { LinkButton } from '@components/shared/Button'
-import { findSerum3MarketPkInOpenOrders } from '@components/trade/OpenOrders'
+import { findSpotMarketPkInOpenOrders } from '@components/trade/OpenOrders'
 import useSelectedMarket from 'hooks/useSelectedMarket'
 import {
   floorToDecimal,
@@ -36,7 +36,7 @@ import SideBadge from '@components/shared/SideBadge'
 import { ArrowRightIcon } from '@heroicons/react/20/solid'
 
 interface ModifyModalProps {
-  order: Order | PerpOrder
+  order: Order | PerpOrder | OpenbookOrder
   price: string
 }
 
@@ -74,7 +74,7 @@ const ModifyTvOrderModal = ({
   }, [serumOrPerpMarket])
 
   const modifyOrder = useCallback(
-    async (o: PerpOrder | Order) => {
+    async (o: PerpOrder | Order | OpenbookOrder) => {
       const client = mangoStore.getState().client
       const group = mangoStore.getState().group
       const mangoAccount = mangoStore.getState().mangoAccount.current
@@ -102,8 +102,14 @@ const ModifyTvOrderModal = ({
             undefined,
           )
         } else {
-          const marketPk = findSerum3MarketPkInOpenOrders(o)
+          const marketPk = findSpotMarketPkInOpenOrders(o)
           if (!marketPk) return
+
+          if (o instanceof OpenbookOrder) {
+            console.error('not implemented!')
+            return;
+          }
+
           const market = group.getSerum3MarketByExternalMarket(
             new PublicKey(marketPk),
           )
@@ -140,7 +146,7 @@ const ModifyTvOrderModal = ({
       }
     },
     [
-      findSerum3MarketPkInOpenOrders,
+      findSpotMarketPkInOpenOrders,
       modifiedOrderPrice,
       modifiedOrderSize,
       tickDecimals,

components/modals/SpotMarketDetailsModal.tsx

@@ -2,7 +2,7 @@ import { ModalProps } from '../../types/modal'
 import Modal from '../shared/Modal'
 import { useTranslation } from 'next-i18next'
 import useSelectedMarket from 'hooks/useSelectedMarket'
-import { Serum3Market } from '@blockworks-foundation/mango-v4'
+import { OpenbookV2Market, Serum3Market } from '@blockworks-foundation/mango-v4'
 import Button from '@components/shared/Button'
 import { ExclamationTriangleIcon } from '@heroicons/react/20/solid'
 import { useMemo } from 'react'
@@ -11,7 +11,7 @@ import OracleProvider from '@components/shared/OracleProvider'
 import mangoStore from '@store/mangoStore'
 
 interface SpotMarketDetailsModalProps {
-  market: Serum3Market | undefined
+  market: Serum3Market | OpenbookV2Market | undefined
 }
 
 type ModalCombinedProps = SpotMarketDetailsModalProps & ModalProps

components/rewards/Claim.tsx

@@ -60,7 +60,6 @@ const RewardsComponent = dynamic(() => import('./RewardsComponents'), {
 })
 
 const ClaimPage = () => {
-  return null
   const [isClaiming, setIsClaiming] = useState(false)
   const [showTweetModal, setShowTweetModal] = useState(false)
   const [hasSeenTweetModal, setHasSeenTweetModal] = useState(false)

components/rewards/PromoBanner.tsx

@@ -17,7 +17,6 @@ import useMangoAccount from 'hooks/useMangoAccount'
 dayjs.extend(relativeTime)
 
 const PromoBanner = () => {
-  return null
   const [showBanner, setShowBanner] = useLocalStorageState(
     MANGO_MINTS_BANNER_KEY,
     {},

components/shared/BalancesTable.tsx

@@ -1,4 +1,4 @@
-import { Serum3Market } from '@blockworks-foundation/mango-v4'
+import { OpenbookV2Market, Serum3Market } from '@blockworks-foundation/mango-v4'
 import { ChevronDownIcon, NoSymbolIcon } from '@heroicons/react/20/solid'
 import mangoStore from '@store/mangoStore'
 import useMangoAccount from 'hooks/useMangoAccount'
@@ -367,6 +367,12 @@ const Balance = ({ bank }: { bank: BankWithBalance }) => {
         )
         minOrderDecimals = getDecimalCount(market.minOrderSize)
         tickDecimals = getDecimalCount(market.tickSize)
+      } else if (selectedMarket instanceof OpenbookV2Market) {
+        const market = group.getOpenbookV2ExternalMarket(
+          selectedMarket.openbookMarketExternal,
+        )
+        minOrderDecimals = market.baseDecimals
+        tickDecimals = market.quoteDecimals
       } else {
         minOrderDecimals = getDecimalCount(selectedMarket.minOrderSize)
         tickDecimals = getDecimalCount(selectedMarket.tickSize)

components/shared/FavoriteMarketButton.tsx

@@ -1,13 +1,13 @@
 import { StarIcon } from '@heroicons/react/24/outline'
 import { StarIcon as FilledStarIcon } from '@heroicons/react/20/solid'
-import { PerpMarket, Serum3Market } from '@blockworks-foundation/mango-v4'
+import { OpenbookV2Market, PerpMarket, Serum3Market } from '@blockworks-foundation/mango-v4'
 import useLocalStorageState from 'hooks/useLocalStorageState'
 import { DEFAULT_FAVORITE_MKTS, FAVORITE_MARKETS_KEY } from 'utils/constants'
 
 const FavoriteMarketButton = ({
   market,
 }: {
-  market: PerpMarket | Serum3Market
+  market: PerpMarket | Serum3Market | OpenbookV2Market
 }) => {
   const [favoriteMarkets, setFavoriteMarkets] = useLocalStorageState<string[]>(
     FAVORITE_MARKETS_KEY,

components/shared/MarketChange.tsx

@@ -1,7 +1,7 @@
 import { MinusSmallIcon } from '@heroicons/react/20/solid'
 import { DownTriangle, UpTriangle } from './DirectionTriangles'
 import FormatNumericValue from './FormatNumericValue'
-import { PerpMarket, Serum3Market } from '@blockworks-foundation/mango-v4'
+import { OpenbookV2Market, PerpMarket, Serum3Market } from '@blockworks-foundation/mango-v4'
 import { useMemo } from 'react'
 import SheenLoader from './SheenLoader'
 import useListedMarketsWithMarketData from 'hooks/useListedMarketsWithMarketData'
@@ -10,27 +10,30 @@ const MarketChange = ({
   market,
   size,
 }: {
-  market: PerpMarket | Serum3Market | undefined
+  market: PerpMarket | Serum3Market | OpenbookV2Market | undefined
   size?: 'small'
 }) => {
-  const { perpMarketsWithData, serumMarketsWithData, isLoading } =
+  const { perpMarketsWithData, spotMarketsWithData, isLoading } =
     useListedMarketsWithMarketData()
 
   const change = useMemo(() => {
-    if (!market || !perpMarketsWithData || !serumMarketsWithData) return 0
+    if (!market || !perpMarketsWithData || !spotMarketsWithData) return 0
     const isPerp = market instanceof PerpMarket
     if (isPerp) {
       const perpMarket = perpMarketsWithData.find(
         (m) => m.name.toLowerCase() === market.name.toLowerCase(),
       )
       return perpMarket?.rollingChange ? perpMarket.rollingChange : 0
-    } else {
-      const spotMarket = serumMarketsWithData.find(
-        (m) => m.name.toLowerCase() === market.name.toLowerCase(),
+    } else if (market instanceof Serum3Market) {
+      const spotMarket = spotMarketsWithData.find(
+        (m) => m.name.toLowerCase() === market.name.toLowerCase() && !m.isOpenbookV2,
       )
       return spotMarket?.rollingChange ? spotMarket.rollingChange : 0
+    } else {
+      const spotMarket = spotMarketsWithData.find((m) => m.name.toLowerCase() === market.name.toLowerCase() && m.isOpenbookV2)
+      return spotMarket?.rollingChange ? spotMarket.rollingChange : 0
     }
-  }, [perpMarketsWithData, serumMarketsWithData])
+  }, [perpMarketsWithData, spotMarketsWithData])
 
   return isLoading ? (
     <SheenLoader className="mt-0.5">

components/trade/AdvancedTradeForm.tsx

@@ -175,7 +175,10 @@ const AdvancedTradeForm = () => {
   }, [selectedMarket])
 
   const isInsured = useMemo(() => {
-    if (selectedMarket instanceof Serum3Market) {
+    if (
+      selectedMarket instanceof Serum3Market ||
+      selectedMarket instanceof OpenbookV2Market
+    ) {
       const group = mangoStore.getState().group
       return isTokenInsured(baseBank, group)
     } else {
@@ -576,7 +579,6 @@ const AdvancedTradeForm = () => {
 
   const isFormValid = useCallback(
     (form: TradeForm) => {
-      return true
       const { baseSize, price, orderType, side } = form
       const invalidFields: FormErrors = {}
       setFormErrors({})
@@ -1337,7 +1339,7 @@ const AdvancedTradeForm = () => {
                 setShowCreateAccountModal={setShowCreateAccountModal}
                 setShowDepositModal={setShowDepositModal}
                 sideNames={sideNames}
-                tooMuchSize={false}
+                tooMuchSize={tooMuchSize}
                 useMargin={savedCheckboxSettings.margin}
               />
             </div>

components/trade/MarketCloseModal.tsx

@@ -79,15 +79,15 @@ const MarketCloseModal: FunctionComponent<MarketCloseModalProps> = ({
         .then(({ context, value: info }) => {
           if (!info) return
           const decodedBook = decodeBook(client, perpMarket, info, 'bids')
-          setBids(decodeBookL2(decodedBook))
+          setBids(decodeBookL2(decodedBook, perpMarket, perpMarket))
           lastSeenBidsSlot = context.slot
         })
       bidSubscriptionId = connection.onAccountChange(
         bidsPk,
         (info, context) => {
           if (context.slot > lastSeenBidsSlot) {
             const decodedBook = decodeBook(client, perpMarket, info, 'bids')
-            setBids(decodeBookL2(decodedBook))
+            setBids(decodeBookL2(decodedBook, perpMarket, perpMarket))
           }
         },
         'processed',
@@ -101,15 +101,15 @@ const MarketCloseModal: FunctionComponent<MarketCloseModalProps> = ({
         .then(({ context, value: info }) => {
           if (!info) return
           const decodedBook = decodeBook(client, perpMarket, info, 'asks')
-          setAsks(decodeBookL2(decodedBook))
+          setAsks(decodeBookL2(decodedBook, perpMarket, perpMarket))
           lastSeenAsksSlot = context.slot
         })
       askSubscriptionId = connection.onAccountChange(
         asksPk,
         (info, context) => {
           if (context.slot > lastSeenAsksSlot) {
             const decodedBook = decodeBook(client, perpMarket, info, 'asks')
-            setAsks(decodeBookL2(decodedBook))
+            setAsks(decodeBookL2(decodedBook, perpMarket, perpMarket))
           }
         },
         'processed',