fix nan on risk dashboard

pages/dashboard/risks.tsx

@@ -4,10 +4,15 @@ import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
 import { DashboardNavbar } from '.'
 import { Table, Td, Th, TrBody, TrHead } from '@components/shared/TableElements'
 import { useQuery } from '@tanstack/react-query'
-import mangoStore from '@store/mangoStore'
-import { getRiskStats } from '@blockworks-foundation/mango-v4'
+import { emptyWallet } from '@store/mangoStore'
+import {
+  MANGO_V4_ID,
+  MangoClient,
+  getRiskStats,
+} from '@blockworks-foundation/mango-v4'
 import { PublicKey } from '@solana/web3.js'
 import { formatNumericValue } from 'utils/numbers'
+import { AnchorProvider, web3 } from '@project-serum/anchor'
 
 export async function getStaticProps({ locale }: { locale: string }) {
   return {
@@ -19,9 +24,7 @@ export async function getStaticProps({ locale }: { locale: string }) {
 
 type TableData = {
   title: string
-  data: Array<
-    Record<string, { val: string | number | PublicKey; highlight: boolean }>
-  >
+  data: Array<Record<string, string | number | PublicKey>>
 }
 
 const formatValue = (val: string | number | PublicKey) => {
@@ -37,11 +40,27 @@ const formatValue = (val: string | number | PublicKey) => {
 
 const RiskDashboard: NextPage = () => {
   const { group } = useMangoGroup()
-  const client = mangoStore((s) => s.client)
 
   const { data, isLoading, isFetching } = useQuery(
     ['risks'],
-    () => group && getRiskStats(client, group),
+    () => {
+      const provider = new AnchorProvider(
+        new web3.Connection(
+          'https://mango.rpcpool.com/0f9acc0d45173b51bf7d7e09c1e5',
+          'processed'
+        ),
+        emptyWallet,
+        AnchorProvider.defaultOptions()
+      )
+      const client = MangoClient.connect(
+        provider,
+        'mainnet-beta',
+        MANGO_V4_ID['mainnet-beta']
+      )
+      if (group) {
+        return getRiskStats(client, group)
+      }
+    },
     {
       cacheTime: 1000 * 60 * 5,
       staleTime: 1000 * 60 * 5,
@@ -99,27 +118,18 @@ const RiskDashboard: NextPage = () => {
                         </thead>
                         <tbody>
                           {table.data.map((rowData, index: number) => {
+                            console.log('rowData', Object.values(rowData))
+
                             return (
                               <TrBody key={index}>
                                 {Object.values(rowData).map(
                                   (
-                                    col: {
-                                      val: string | number | PublicKey
-                                      highlight: boolean
-                                    },
+                                    val: string | number | PublicKey,
                                     idx: number
                                   ) => {
                                     return (
-                                      <Td
-                                        xBorder
-                                        className={
-                                          col.highlight
-                                            ? 'text-left text-th-warning'
-                                            : ''
-                                        }
-                                        key={idx}
-                                      >
-                                        {formatValue(col.val)}
+                                      <Td xBorder className={''} key={idx}>
+                                        {formatValue(val)}
                                       </Td>
                                     )
                                   }

store/mangoStore.ts

@@ -93,7 +93,7 @@ const ENDPOINTS = [
 const options = AnchorProvider.defaultOptions()
 export const CLUSTER: 'mainnet-beta' | 'devnet' = 'mainnet-beta'
 const ENDPOINT = ENDPOINTS.find((e) => e.name === CLUSTER) || ENDPOINTS[0]
-const emptyWallet = new EmptyWallet(Keypair.generate())
+export const emptyWallet = new EmptyWallet(Keypair.generate())
 
 const initMangoClient = (
   provider: AnchorProvider,