From 40b13d567225490a2ec7385dee0454858d47ed46 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adrian=20Brzezin=CC=81ski?= <a.brzezinski94@gmail.com>
Date: Thu, 28 Dec 2023 19:33:06 +0100
Subject: [PATCH] improve decode logic for oderbook

---
 components/trade/DepthChart.tsx |  6 +++---
 components/trade/Orderbook.tsx  | 23 +++++++++++++++++------
 pages/dashboard/index.tsx       |  4 +++-
 3 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/components/trade/DepthChart.tsx b/components/trade/DepthChart.tsx
index a12603e84..d4efc1737 100644
--- a/components/trade/DepthChart.tsx
+++ b/components/trade/DepthChart.tsx
@@ -316,11 +316,11 @@ const DepthChart = () => {
         </div>
       </div>
       <div
-        className={
+        className={`${
           increaseHeight ? 'h-[570px]' : isTablet ? 'h-[538px]' : 'h-[482px]'
-        }
+        }`}
       >
-        <ResponsiveContainer width="100%" height="100%">
+        <ResponsiveContainer width="100" height="100%">
           <AreaChart
             data={chartData}
             layout="vertical"
diff --git a/components/trade/Orderbook.tsx b/components/trade/Orderbook.tsx
index daf4e69ee..a36768c83 100644
--- a/components/trade/Orderbook.tsx
+++ b/components/trade/Orderbook.tsx
@@ -304,7 +304,7 @@ const Orderbook = () => {
         connection
           .getAccountInfoAndContext(bidsPk)
           .then(({ context, value: info }) => {
-            if (!info) return
+            if (!info || !isMarketReadyForDecode(market)) return
             const decodedBook = decodeBook(client, market, info, 'bids')
             set((state) => {
               state.selectedMarket.lastSeenSlot.bids = context.slot
@@ -319,8 +319,8 @@ const Orderbook = () => {
               mangoStore.getState().selectedMarket.lastSeenSlot.bids
             if (context.slot > lastSeenSlot) {
               const market = getMarket()
-              if (!market) return
-              const decodedBook = decodeBook(client, market, info, 'bids')
+              if (!isMarketReadyForDecode(market)) return
+              const decodedBook = decodeBook(client, market!, info, 'bids')
               if (decodedBook instanceof BookSide) {
                 updatePerpMarketOnGroup(decodedBook, 'bids')
               }
@@ -340,7 +340,7 @@ const Orderbook = () => {
         connection
           .getAccountInfoAndContext(asksPk)
           .then(({ context, value: info }) => {
-            if (!info) return
+            if (!info || !isMarketReadyForDecode(market)) return
             const decodedBook = decodeBook(client, market, info, 'asks')
             set((state) => {
               state.selectedMarket.asksAccount = decodedBook
@@ -355,8 +355,8 @@ const Orderbook = () => {
               mangoStore.getState().selectedMarket.lastSeenSlot.asks
             if (context.slot > lastSeenSlot) {
               const market = getMarket()
-              if (!market) return
-              const decodedBook = decodeBook(client, market, info, 'asks')
+              if (!isMarketReadyForDecode(market)) return
+              const decodedBook = decodeBook(client, market!, info, 'asks')
               if (decodedBook instanceof BookSide) {
                 updatePerpMarketOnGroup(decodedBook, 'asks')
               }
@@ -812,3 +812,14 @@ function usersOpenOrderPrices(market: Market | PerpMarket | null) {
   }
   return usersOpenOrderPrices
 }
+
+const isMarketReadyForDecode = (market: PerpMarket | Market | undefined) => {
+  if (
+    !market ||
+    (market instanceof Market &&
+      (!market.decoded.accountFlags.initialized ||
+        !(market.decoded.accountFlags.bids ^ market.decoded.accountFlags.asks)))
+  )
+    return false
+  else return true
+}
diff --git a/pages/dashboard/index.tsx b/pages/dashboard/index.tsx
index 4428b7d7e..e1624acad 100644
--- a/pages/dashboard/index.tsx
+++ b/pages/dashboard/index.tsx
@@ -953,7 +953,9 @@ const VaultData = ({ bank }: { bank: Bank }) => {
     <KeyValuePair
       label="Vault balance"
       value={
-        vault ? toUiDecimals(vault.amount.toNumber(), bank.mintDecimals) : '...'
+        vault
+          ? toUiDecimals(new BN(vault.amount.toString()), bank.mintDecimals)
+          : '...'
       }
     />
   )