Merge branch 'main' into alpha

apis/birdeye/datafeed.ts

@@ -1,11 +1,14 @@
 import { makeApiRequest, parseResolution } from './helpers'
 import { subscribeOnStream, unsubscribeFromStream } from './streaming'
 import mangoStore from '@store/mangoStore'
+import {
+  DatafeedConfiguration,
+  LibrarySymbolInfo,
+  ResolutionString,
+  SearchSymbolResultItem,
+} from '@public/charting_library/charting_library'
 
-const lastBarsCache = new Map()
-
-const configurationData = {
-  supported_resolutions: [
+export const SUPPORTED_RESOLUTIONS = [
   '1',
   '3',
   '5',
@@ -16,7 +19,34 @@ const configurationData = {
   '240',
   '1D',
   '1W',
-  ],
+] as const
+
+type BaseBar = {
+  low: number
+  high: number
+  open: number
+  close: number
+}
+
+type KlineBar = BaseBar & {
+  volume: number
+  timestamp: number
+}
+
+type TradingViewBar = BaseBar & {
+  time: number
+}
+
+type Bar = KlineBar & TradingViewBar
+
+type SymbolInfo = LibrarySymbolInfo & {
+  address: string
+}
+
+const lastBarsCache = new Map()
+
+const configurationData = {
+  supported_resolutions: SUPPORTED_RESOLUTIONS,
   intraday_multipliers: ['1', '3', '5', '15', '30', '60', '120', '240'],
   exchanges: [],
 }
@@ -29,42 +59,101 @@ const configurationData = {
 //   return data.data.tokens
 // }
 
+export const queryBars = async (
+  tokenAddress: string,
+  resolution: typeof SUPPORTED_RESOLUTIONS[number],
+  periodParams: {
+    firstDataRequest: boolean
+    from: number
+    to: number
+  }
+): Promise<Bar[]> => {
+  const { from, to } = periodParams
+  const urlParameters = {
+    address: tokenAddress,
+    type: parseResolution(resolution),
+    time_from: from,
+    time_to: to,
+  }
+  const query = Object.keys(urlParameters)
+    .map(
+      (name: string) =>
+        `${name}=${encodeURIComponent((urlParameters as any)[name])}`
+    )
+    .join('&')
+
+  const data = await makeApiRequest(`defi/ohlcv/pair?${query}`)
+  if (!data.success || data.data.items.length === 0) {
+    return []
+  }
+  let bars: Bar[] = []
+  for (const bar of data.data.items) {
+    if (bar.unixTime >= from && bar.unixTime < to) {
+      const timestamp = bar.unixTime * 1000
+      bars = [
+        ...bars,
+        {
+          time: timestamp,
+          low: bar.l,
+          high: bar.h,
+          open: bar.o,
+          close: bar.c,
+          volume: bar.v,
+          timestamp,
+        },
+      ]
+    }
+  }
+  return bars
+}
+
 export default {
-  onReady: (callback: any) => {
+  onReady: (callback: (configuration: DatafeedConfiguration) => void) => {
     console.log('[onReady]: Method call')
-    setTimeout(() => callback(configurationData))
+    setTimeout(() => callback(configurationData as any))
   },
 
   searchSymbols: async (
-    _userInput: any,
-    _exchange: any,
-    _symbolType: any,
-    _onResultReadyCallback: any
+    _userInput: string,
+    _exchange: string,
+    _symbolType: string,
+    _onResultReadyCallback: (items: SearchSymbolResultItem[]) => void
   ) => {
     return
   },
 
   resolveSymbol: async (
-    symbolAddress: any,
-    onSymbolResolvedCallback: any,
-    _onResolveErrorCallback: any,
-    _extension: any
+    symbolAddress: string,
+    onSymbolResolvedCallback: (symbolInfo: SymbolInfo) => void
+    // _onResolveErrorCallback: any,
+    // _extension: any
   ) => {
-    console.log('[resolveSymbol]: Method call', symbolAddress)
+    console.log(
+      '[resolveSymbol]: Method call',
+      symbolAddress,
+      onSymbolResolvedCallback
+    )
     // const symbols = await getAllSymbols()
     // let symbolItem = symbols.find((item: any) => item.address === symbolAddress)
     // console.log('========symbols:', symbolItem, symbols)
-    let symbolItem: any
+    let symbolItem:
+      | {
+          address: string
+          type: string
+          symbol: string
+        }
+      | undefined
 
     if (!symbolItem) {
       symbolItem = {
         address: symbolAddress,
         type: 'pair',
+        symbol: '',
       }
     }
     const ticker = mangoStore.getState().selectedMarket.name
 
-    const symbolInfo = {
+    const symbolInfo: SymbolInfo = {
       address: symbolItem.address,
       ticker: symbolItem.address,
       name: symbolItem.symbol || symbolItem.address,
@@ -77,61 +166,51 @@ export default {
       has_intraday: true,
       has_no_volume: true,
       has_weekly_and_monthly: false,
-      supported_resolutions: configurationData.supported_resolutions,
+      supported_resolutions: configurationData.supported_resolutions as any,
       intraday_multipliers: configurationData.intraday_multipliers,
       volume_precision: 2,
       data_status: 'streaming',
+      full_name: '',
+      exchange: '',
+      listed_exchange: '',
+      format: 'price',
     }
 
     console.log('[resolveSymbol]: Symbol resolved', symbolAddress)
     onSymbolResolvedCallback(symbolInfo)
   },
-
   getBars: async (
-    symbolInfo: any,
-    resolution: any,
-    periodParams: any,
-    onHistoryCallback: any,
-    onErrorCallback: any
-  ) => {
-    const { from, to, firstDataRequest } = periodParams
-    console.log('[getBars]: Method call', symbolInfo, resolution, from, to)
-    const urlParameters = {
-      address: symbolInfo.address,
-      type: parseResolution(resolution),
-      time_from: from,
-      time_to: to,
+    symbolInfo: SymbolInfo,
+    resolution: ResolutionString,
+    periodParams: {
+      countBack: number
+      firstDataRequest: boolean
+      from: number
+      to: number
+    },
+    onHistoryCallback: (
+      bars: Bar[],
+      t: {
+        noData: boolean
       }
-    const query = Object.keys(urlParameters)
-      .map(
-        (name: any) =>
-          `${name}=${encodeURIComponent((urlParameters as any)[name])}`
-      )
-      .join('&')
+    ) => void,
+    onErrorCallback: (e: any) => void
+  ) => {
     try {
-      const data = await makeApiRequest(`defi/ohlcv/pair?${query}`)
-      if (!data.success || data.data.items.length === 0) {
+      const { firstDataRequest } = periodParams
+      const bars = await queryBars(
+        symbolInfo.address,
+        resolution as any,
+        periodParams
+      )
+      if (!bars || bars.length === 0) {
         // "noData" should be set if there is no data in the requested period.
         onHistoryCallback([], {
           noData: true,
         })
         return
       }
-      let bars: any = []
-      data.data.items.forEach((bar: any) => {
-        if (bar.unixTime >= from && bar.unixTime < to) {
-          bars = [
-            ...bars,
-            {
-              time: bar.unixTime * 1000,
-              low: bar.l,
-              high: bar.h,
-              open: bar.o,
-              close: bar.c,
-            },
-          ]
-        }
-      })
+
       if (firstDataRequest) {
         lastBarsCache.set(symbolInfo.address, {
           ...bars[bars.length - 1],
@@ -148,11 +227,11 @@ export default {
   },
 
   subscribeBars: (
-    symbolInfo: any,
-    resolution: any,
-    onRealtimeCallback: any,
-    subscriberUID: any,
-    onResetCacheNeededCallback: any
+    symbolInfo: SymbolInfo,
+    resolution: string,
+    onRealtimeCallback: (data: any) => void,
+    subscriberUID: string,
+    onResetCacheNeededCallback: () => void
   ) => {
     console.log(
       '[subscribeBars]: Method call with subscriberUID:',

components/trade/TradingViewChartKline.tsx

@@ -1,7 +1,6 @@
 import { Dispatch, SetStateAction, useEffect, useRef, useState } from 'react'
 import mangoStore from '@store/mangoStore'
 import klinecharts, { init, dispose } from 'klinecharts'
-import axios from 'axios'
 import { useViewport } from 'hooks/useViewport'
 import usePrevious from '@components/shared/usePrevious'
 import Modal from '@components/shared/Modal'
@@ -11,7 +10,6 @@ import {
   CHART_QUERY,
   DEFAULT_MAIN_INDICATORS,
   DEFAULT_SUB_INDICATOR,
-  HISTORY,
   mainTechnicalIndicatorTypes,
   MAIN_INDICATOR_CLASS,
   ONE_DAY_SECONDS,
@@ -20,11 +18,11 @@ import {
 } from 'utils/kLineChart'
 import Loading from '@components/shared/Loading'
 import clsx from 'clsx'
-import { API_URL, BE_API_KEY } from 'apis/birdeye/helpers'
 import { useTheme } from 'next-themes'
 import { COLORS } from 'styles/colors'
 import { IconButton } from '@components/shared/Button'
 import { ArrowsPointingOutIcon, XMarkIcon } from '@heroicons/react/20/solid'
+import { queryBars } from 'apis/birdeye/datafeed'
 
 const UPDATE_INTERVAL = 10000
 
@@ -60,24 +58,17 @@ const TradingViewChartKline = ({ setIsFullView, isFullView }: Props) => {
         ...baseQuery,
         time_from: from,
       }
-      const response = await axios.get(`${API_URL}defi/ohlcv/pair`, {
-        params: query,
-        headers: {
-          'X-API-KEY': BE_API_KEY,
-        },
+      const response = await queryBars(query.address, query.type, {
+        firstDataRequest: false,
+        from: query.time_from,
+        to: query.time_to,
       })
-      const newData = response.data.data.items as HISTORY[]
-      const dataSize = newData.length
+      const dataSize = response.length
       const dataList = []
       for (let i = 0; i < dataSize; i++) {
-        const row = newData[i]
+        const row = response[i]
         const kLineModel = {
-          open: row.o,
-          low: row.l,
-          high: row.h,
-          close: row.c,
-          volume: row.v,
-          timestamp: row.unixTime * 1000,
+          ...row,
         }
         dataList.push(kLineModel)
       }

hooks/useMarkPrice.tsx

@@ -31,7 +31,5 @@ export default function useMarkPrice() {
     }
   }, [orderbook, trades, markPrice])
 
-  console.log('markPrice', markPrice)
-
   return markPrice
 }

utils/kLineChart.ts

@@ -1,39 +1,34 @@
+import { SUPPORTED_RESOLUTIONS } from 'apis/birdeye/datafeed'
+
 export const ONE_HOUR_MINS = 60
 export const ONE_MINUTE_SECONDS = 60
 export const ONE_HOUR_SECONDS = ONE_HOUR_MINS * ONE_MINUTE_SECONDS
 export const ONE_DAY_SECONDS = ONE_HOUR_SECONDS * 24
 export type BASE_CHART_QUERY = {
   address: string
-  type: string
+  type: typeof SUPPORTED_RESOLUTIONS[number]
   time_to: number
 }
 export type CHART_QUERY = BASE_CHART_QUERY & {
   time_from: number
 }
-export type HISTORY = {
-  c: number
-  h: number
-  l: number
-  o: number
-  unixTime: number
-  v: number
-}
+
 //Translate values that api accepts to chart seconds
 export const RES_NAME_TO_RES_VAL: {
   [key: string]: {
-    val: string
+    val: typeof SUPPORTED_RESOLUTIONS[number]
     seconds: number
   }
 } = {
-  '1m': { val: '1M', seconds: ONE_MINUTE_SECONDS },
-  '5m': { val: '5M', seconds: 5 * ONE_MINUTE_SECONDS },
+  '1m': { val: '1', seconds: ONE_MINUTE_SECONDS },
+  '5m': { val: '5', seconds: 5 * ONE_MINUTE_SECONDS },
   '30m': {
-    val: `30M`,
+    val: `30`,
     seconds: (ONE_HOUR_MINS / 2) * ONE_MINUTE_SECONDS,
   },
-  '1H': { val: `1H`, seconds: ONE_HOUR_SECONDS },
-  '2H': { val: `2H`, seconds: ONE_HOUR_SECONDS * 2 },
-  '4H': { val: `4H`, seconds: ONE_HOUR_SECONDS * 4 },
+  '1H': { val: `60`, seconds: ONE_HOUR_SECONDS },
+  '2H': { val: `120`, seconds: ONE_HOUR_SECONDS * 2 },
+  '4H': { val: `240`, seconds: ONE_HOUR_SECONDS * 4 },
   '1D': { val: '1D', seconds: 24 * ONE_HOUR_SECONDS },
 }
 export const mainTechnicalIndicatorTypes = [