✨ add 4h and 1D intervals (#534)

src/components/Trade/TradeChart/OsmosisTheGraphDataFeed.ts

@@ -40,10 +40,19 @@ export class OsmosisTheGraphDataFeed implements IDatafeedChartApi {
     '15': '15m',
     '30': '30m',
     '60': '1h',
+    '240': '4h',
+    '1D': '1d',
+  }
+  minutesPerInterval: { [key: string]: number } = {
+    '15': 15,
+    '30': 30,
+    '60': 60,
+    '240': 60 * 4,
+    '1D': 60 * 24,
   }
 
   supportedPools: string[] = []
-  supportedResolutions = ['15', '30', '60'] as ResolutionString[]
+  supportedResolutions = ['15', '30', '60', '4h', 'D'] as ResolutionString[]
 
   constructor(debug = false, baseDecimals: number, baseDenom: string) {
     if (debug) console.log('Start TheGraph charting library datafeed')
@@ -113,19 +122,22 @@ export class OsmosisTheGraphDataFeed implements IDatafeedChartApi {
     })
   }
 
-  async resolveSymbol(pairName: string, onResolve: ResolveCallback, onError: ErrorCallback) {
-    setTimeout(() =>
-      onResolve({
+  resolveSymbol(pairName: string, onResolve: ResolveCallback, onError: ErrorCallback) {
+    pairName = this.getPairName(pairName)
+    setTimeout(() => {
+      const info: LibrarySymbolInfo = {
         ...defaultSymbolInfo,
         name: this.getDescription(pairName),
-        full_name: pairName,
+        full_name: this.getDescription(pairName),
         description: this.getDescription(pairName),
         ticker: this.getDescription(pairName),
         exchange: this.exchangeName,
         listed_exchange: this.exchangeName,
         supported_resolutions: this.supportedResolutions,
-      }),
-    )
+        base_name: [this.getDescription(pairName)],
+      } as LibrarySymbolInfo
+      onResolve(info)
+    })
   }
 
   async getBars(
@@ -136,7 +148,7 @@ export class OsmosisTheGraphDataFeed implements IDatafeedChartApi {
   ): Promise<void> {
     const interval = this.intervals[resolution]
 
-    let pair1 = symbolInfo.full_name
+    let pair1 = this.getPairName(symbolInfo.full_name)
     let pair2: string = ''
     let pair3: string = ''
 
@@ -198,13 +210,29 @@ export class OsmosisTheGraphDataFeed implements IDatafeedChartApi {
     await Promise.all([pair1Bars, pair2Bars, pair3Bars]).then(
       ([pair1Bars, pair2Bars, pair3Bars]) => {
         let bars = pair1Bars
+
+        if (!bars.length) {
+          onResult([], { noData: true })
+          return
+        }
+
         if (pair2Bars) {
           bars = this.combineBars(pair1Bars, pair2Bars)
         }
         if (pair3Bars) {
           bars = this.combineBars(bars, pair3Bars)
         }
-        onResult(bars)
+
+        const filler = Array.from({ length: this.batchSize - bars.length }).map((_, index) => ({
+          time: (bars[0]?.time || new Date().getTime()) - index * this.minutesPerInterval[resolution],
+          close: 0,
+          open: 0,
+          high: 0,
+          low: 0,
+          volume: 0,
+        }))
+
+        onResult([...filler, ...bars])
       },
     )
   }
@@ -282,6 +310,16 @@ export class OsmosisTheGraphDataFeed implements IDatafeedChartApi {
     return bars
   }
 
+  getPairName(name: string) {
+    if (name.includes(PAIR_SEPARATOR)) return name
+
+    const [symbol1, symbol2] = name.split('/')
+
+    const asset1 = ASSETS.find((asset) => asset.symbol === symbol1)
+    const asset2 = ASSETS.find((asset) => asset.symbol === symbol2)
+    return `${asset1?.denom}${PAIR_SEPARATOR}${asset2?.denom}`
+  }
+
   searchSymbols(): void {
     // Don't allow to search for symbols
   }

src/components/Trade/TradeChart/constants.ts

@@ -1,5 +1,6 @@
 import {
   ChartingLibraryFeatureset,
+  LibrarySymbolInfo,
   ResolutionString,
   SeriesFormat,
   Timezone,
@@ -26,7 +27,7 @@ export const overrides = {
   'linetooltrendline.linewidth': 2,
 }
 
-export const defaultSymbolInfo = {
+export const defaultSymbolInfo: Partial<LibrarySymbolInfo> = {
   listed_exchange: 'Osmosis',
   type: 'AMM',
   session: '24x7',
@@ -35,7 +36,7 @@ export const defaultSymbolInfo = {
   timezone: 'Etc/UTC' as Timezone,
   has_intraday: true,
   has_daily: true,
-  has_weekly_and_monthly: true,
+  has_weekly_and_monthly: false,
   format: 'price' as SeriesFormat,
   supported_resolutions: ['15'] as ResolutionString[],
 }