binbot-charts 0.7.1 → 0.7.2

package/src/datafeed.ts

@@ -1,289 +0,0 @@
-import { getAllSymbols, makeApiRequest } from "./helpers";
-import { subscribeOnStream, unsubscribeFromStream } from "./streaming";
-
-enum BinanceResolutions {
-  one_second = "1s",
-  one_minute = "1m",
-  three_minute = "3m",
-  five_minute = "5m",
-  fifteen_minute = "15m",
-  thirty_minute = "30m",
-  one_hour = "1h",
-  two_hour = "2h",
-  four_hour = "4h",
-  six_hour = "6h",
-  eight_hour = "8h",
-  twelve_hour = "12h",
-  one_day = "1d",
-  three_day = "3d",
-  one_week = "1w",
-  one_month = "1M",
-}
-
-interface ConfigurationData {
-  supports_marks: boolean;
-  supports_timescale_marks: boolean;
-  supports_time: boolean;
-  supported_resolutions: string[];
-  exchanges: { value: string; name: string; desc: string }[];
-  symbols_types: { name: string; value: string }[];
-}
-
-const getConfigurationData = async (): Promise<ConfigurationData> => {
-  return {
-    supports_marks: true,
-    supports_timescale_marks: true,
-    supports_time: true,
-    supported_resolutions: [
-      "1S",
-      "1",
-      "3",
-      "5",
-      "15",
-      "30",
-      "60",
-      "120",
-      "240",
-      "360",
-      "480",
-      "720",
-      "1D",
-      "3D",
-      "1W",
-      "12M",
-    ],
-    exchanges: [
-      {
-        value: "Binance",
-        name: "Binance",
-        desc: "Binance",
-      },
-    ],
-    symbols_types: [
-      {
-        name: "crypto",
-        value: "crypto",
-      },
-    ],
-  };
-};
-
-interface TimescaleMark {
-  id: string;
-  time: number;
-  color: string;
-  label: string;
-  tooltip: string;
-}
-
-interface SymbolInfo {
-  name: string;
-  ticker: string;
-  description: string;
-  type: string;
-  session: string;
-  timezone: string;
-  exchange: string;
-  minmov: number;
-  pricescale: number;
-  has_daily: boolean;
-  has_intraday: boolean;
-  has_no_volume: boolean;
-  has_seconds: boolean;
-  seconds_multipliers: number[];
-  volume: string;
-  volume_precision: number;
-  data_status: string;
-  resolution: string;
-}
-
-interface PeriodParams {
-  from: number;
-  to: number;
-  firstDataRequest: boolean;
-}
-
-interface Bar {
-  time: number;
-  low: number;
-  high: number;
-  open: number;
-  close: number;
-  volume: number;
-}
-
-export default class Datafeed {
-  private streaming: any;
-  private timescaleMarks: TimescaleMark[];
-  private interval: string;
-  private configurationData: ConfigurationData | null = null;
-
-  constructor(timescaleMarks: TimescaleMark[] = [], interval: string = "1h") {
-    this.streaming = null;
-    this.timescaleMarks = timescaleMarks;
-    this.interval = interval;
-  }
-
-  onReady = async (callback: (data: ConfigurationData) => void): Promise<void> => {
-    this.configurationData = await getConfigurationData();
-    callback(this.configurationData);
-  };
-
-  searchSymbols = async (
-    userInput: string,
-    exchange: string,
-    symbolType: string,
-    onResultReadyCallback: (symbols: any[]) => void
-  ): Promise<void> => {
-    const symbols = await getAllSymbols(userInput);
-    onResultReadyCallback(symbols);
-  };
-
-  resolveSymbol = async (
-    symbolName: string,
-    onSymbolResolvedCallback: (symbolInfo: SymbolInfo) => void,
-    onResolveErrorCallback: (error: string) => void
-  ): Promise<void> => {
-    if (!symbolName) {
-      await onResolveErrorCallback("cannot resolve symbol");
-      return;
-    }
-
-    const symbolInfo = async (): Promise<SymbolInfo> => {
-
-      const symbolData = await makeApiRequest(`api/v3/exchangeInfo?symbol=${symbolName}`);
-      const priceScale = symbolData.symbols[0].baseAssetPrecision;
-
-      console.log("Symbol info:", 1 ** parseFloat(priceScale));
-
-      return {
-        name: symbolName,
-        ticker: symbolName,
-        description: symbolName,
-        type: "crypto",
-        session: "24x7",
-        timezone: "Etc/UTC",
-        exchange: "Binance",
-        minmov: 1,
-        pricescale: 10 ** parseFloat(priceScale),
-        has_daily: true,
-        has_intraday: true,
-        has_no_volume: false,
-        has_seconds: true,
-        seconds_multipliers: [1],
-        volume: "hundreds",
-        volume_precision: 9,
-        data_status: "streaming",
-        resolution: "1h",
-      };
-    };
-    const symbol = await symbolInfo();
-    onSymbolResolvedCallback(symbol);
-  };
-
-  getBars = async (
-    symbolInfo: SymbolInfo,
-    resolution: string,
-    periodParams: PeriodParams,
-    onHistoryCallback: (bars: Bar[], meta: { noData: boolean }) => void,
-    onErrorCallback: (error: any) => void
-  ): Promise<void> => {
-    const { from, to, firstDataRequest } = periodParams;
-    let interval = "60"; // 1 hour
-    // Calculate interval using resolution data
-    if (!/[a-zA-Z]$/.test(resolution)) {
-      if (parseInt(resolution) >= 60) {
-        interval = parseInt(resolution) / 60 + "h";
-      } else {
-        interval = resolution + "m";
-      }
-    } else {
-      interval = resolution.toLowerCase().replace(/[a-z]\b/g, (c) => c.toLowerCase());
-    }
-
-    let urlParameters = {
-      symbol: symbolInfo.name,
-      interval: interval,
-      startTime: Math.abs(from * 1000),
-      endTime: Math.abs(to * 1000),
-      limit: 600,
-    };
-
-    const query = Object.keys(urlParameters)
-      .map((name) => `${name}=${encodeURIComponent(urlParameters[name])}`)
-      .join("&");
-
-    try {
-      const data = await makeApiRequest(`api/v3/uiKlines?${query}`);
-      if ((data.Response && data.Response === "Error") || data.length === 0) {
-        // "noData" should be set if there is no data in the requested period.
-        onHistoryCallback([], {
-          noData: true,
-        });
-        return;
-      }
-      let bars: Bar[] = [];
-      data.forEach((bar: any) => {
-        if (bar[0] >= from * 1000 && bar[0] < to * 1000) {
-          bars = [
-            ...bars,
-            {
-              time: bar[0],
-              low: bar[3],
-              high: bar[2],
-              open: bar[1],
-              close: bar[4],
-              volume: bar[5],
-            },
-          ];
-        }
-      });
-      onHistoryCallback(bars, {
-        noData: false,
-      });
-    } catch (error) {
-      console.log("[getBars]: Get error", error);
-      onErrorCallback(error);
-    }
-  };
-
-  getTimescaleMarks(
-    symbolInfo: SymbolInfo,
-    from: number,
-    to: number,
-    onDataCallback: (marks: TimescaleMark[]) => void,
-    resolution: string
-  ): void {
-    if (this.timescaleMarks.length > 0) {
-      let timescaleMarks = Object.assign([], this.timescaleMarks);
-      onDataCallback(timescaleMarks);
-    }
-  }
-
-  async getServerTime(onServertimeCallback: (time: number) => void): Promise<void> {
-    const data = await makeApiRequest(`api/v3/time`);
-    const serverTime = data.serverTime / 1000;
-    onServertimeCallback(serverTime);
-  }
-
-  subscribeBars = (
-    symbolInfo: SymbolInfo,
-    resolution: string,
-    onRealtimeCallback: (bar: Bar) => void,
-    subscribeUID: string,
-    onResetCacheNeededCallback: () => void
-  ): void => {
-    subscribeOnStream(
-      symbolInfo,
-      resolution,
-      onRealtimeCallback,
-      subscribeUID,
-      onResetCacheNeededCallback,
-      this.interval
-    );
-  };
-
-  unsubscribeBars = (subscriberUID: string): void => {
-    unsubscribeFromStream(subscriberUID);
-  };
-}

package/src/helpers.ts

@@ -1,53 +0,0 @@
-import { useEffect, useRef } from "react";
-
-
-export async function makeApiRequest(path) {
-  try {
-    const response = await fetch(`https://api.binance.com/${path}`);
-    return response.json();
-  } catch (error) {
-    throw new Error(`Binance request error: ${error.status}`);
-  }
-}
-
-export async function getAllSymbols(symbol) {
-  let newSymbols = [];
-  try {
-    const data = await makeApiRequest(`api/v3/exchangeInfo?symbol=${symbol.toUpperCase()}`);
-    data.symbols.forEach(item => {
-      if (item.status === "TRADING") {
-        newSymbols.push({
-          symbol: item.symbol,
-          full_name: `${item.baseAsset}/${item.quoteAsset}`,
-          description: `Precision: ${item.quoteAssetPrecision}`,
-          exchange: "Binance",
-          ticker: item.symbol,
-          type: "crypto",
-        });
-      }
-    });
-  } catch (e) {
-    return newSymbols
-  }
-  return newSymbols;
-}
-
-export function usePrevious(value) {
-  const ref = useRef();
-  useEffect(() => {
-    ref.current = value;
-  });
-  return ref.current;
-}
-
-export function roundTime(ts: number): number {
-  /**
-   * @param ts a JavaScript new Date().getTime() timestamp
-   */
-  let time = new Date(ts);
-  time.setMinutes(0);
-  time.setSeconds(0)
-  time.setMilliseconds(0);
-  const roundFloor = time.getTime();
-  return roundFloor / 1000
-}

package/src/index.css

@@ -1,5 +0,0 @@
-body {
-	margin: 0;
-	padding: 0;
-	font-family: sans-serif;
-}

package/src/index.tsx

@@ -1,10 +0,0 @@
-import { createRoot } from "react-dom/client";
-import App from "./App"; // Ensure App is a default export from "./App"
-import "./index.css";
-
-const rootElement = document.getElementById("root");
-
-if (rootElement) {
-  const root = createRoot(rootElement);
-  root.render(<App />);
-}

package/src/main.tsx

@@ -1,151 +0,0 @@
-import { FC, useEffect, useRef, useState } from "react";
-import { useImmer } from "use-immer";
-import { type IOrderLine } from "./charting-library-interfaces";
-import {
-  ResolutionString,
-  widget,
-} from "./charting_library/";
-import Datafeed from "./datafeed";
-
-export interface OrderLine extends IOrderLine {
-  id: string;
-  lineStyle?: number;
-}
-
-interface TVChartContainerProps {
-  symbol?: string;
-  interval?: ResolutionString;
-  libraryPath?: string;
-  timescaleMarks?: any[];
-  orderLines?: OrderLine[];
-  height?: string;
-  onTick?: (event: any) => void;
-  getLatestBar?: (data: any) => void;
-}
-
-const TVChartContainer: FC<TVChartContainerProps> = ({
-  symbol = "BTCUSDT",
-  interval = "1h" as ResolutionString,
-  libraryPath = "/charting_library/",
-  timescaleMarks = [],
-  orderLines = [],
-  height = "calc(100vh - 80px)",
-  onTick,
-  getLatestBar,
-}) => {
-  const containerRef = useRef<HTMLDivElement | null>(null);
-
-  const [chartOrderLines, setChartOrderLines] = useImmer<any[]>([]);
-  const [widgetState, setWidgetState] = useImmer<any>(null);
-  const [symbolState] = useState<string | null>(null);
-  const prevTimescaleMarks = useRef<any[]>(timescaleMarks);
-
-  useEffect(() => {
-    if (!widgetState) {
-      initializeChart(interval);
-    }
-
-    if (orderLines && orderLines.length > 0) {
-      updateOrderLines(orderLines);
-    }
-
-    if (widgetState && symbol !== symbolState) {
-      widgetState.setSymbol(symbol, interval);
-    }
-
-    if (
-      widgetState &&
-      prevTimescaleMarks.current &&
-      timescaleMarks !== prevTimescaleMarks.current
-    ) {
-      widgetState._options.datafeed.timescaleMarks = timescaleMarks;
-      prevTimescaleMarks.current = timescaleMarks;
-    }
-  }, [orderLines, timescaleMarks]);
-
-  const initializeChart = (interval: ResolutionString) => {
-    const widgetOptions: any = {
-      symbol: symbol,
-      datafeed: new Datafeed(timescaleMarks, interval),
-      interval: interval,
-      container: containerRef.current,
-      library_path: libraryPath,
-      locale: "en",
-      fullscreen: false,
-      autosize: true,
-      studies_overrides: {},
-      symbol_search_request_delay: 1000,
-      overrides: {
-        volumePaneSize: "small",
-        "mainSeriesProperties.barStyle.dontDrawOpen": false,
-      },
-    };
-    const tvWidget = new widget(widgetOptions);
-
-    tvWidget.onChartReady(() => {
-      tvWidget.subscribe("onTick", (event: any) => onTick && onTick(event));
-      setWidgetState(tvWidget);
-
-      // get latest bar for last price
-      const prices = async () => {
-        const data = await tvWidget.activeChart().exportData({
-          includeTime: false,
-          includeSeries: true,
-          includedStudies: [],
-        });
-        getLatestBar && getLatestBar(data.data[data.data.length - 1]);
-      };
-      prices();
-    });
-  };
-
-  const updateOrderLines = (orderLines: OrderLine[]) => {
-    if (chartOrderLines && chartOrderLines.length > 0) {
-      chartOrderLines.forEach((item) => {
-        orderLines.forEach((order) => {
-          if (item.id == order.id) {
-            item
-              .setText(order.text)
-              .setTooltip(order.tooltip)
-              .setQuantity(order.quantity)
-              .setPrice(order.price);
-          }
-        });
-      });
-    } else {
-      if (widgetState && orderLines && orderLines.length > 0) {
-        orderLines.forEach((order) => {
-          const lineStyle = order.lineStyle || 0;
-          let chartOrderLine = widgetState
-            .chart()
-            .createOrderLine()
-            .setText(order.text)
-            .setTooltip(order.tooltip)
-            .setQuantity(order.quantity)
-            .setQuantityFont("inherit 14px Arial")
-            .setQuantityBackgroundColor(order.color)
-            .setQuantityBorderColor(order.color)
-            .setLineStyle(lineStyle)
-            .setLineLength(25)
-            .setLineColor(order.color)
-            .setBodyFont("inherit 14px Arial")
-            .setBodyBorderColor(order.color)
-            .setBodyTextColor(order.color)
-            .setPrice(order.price);
-
-          // set custom id easier search
-          chartOrderLine.id = order.id;
-
-          setChartOrderLines((draft) => {
-            draft.push(chartOrderLine);
-            return draft;
-          });
-        });
-      }
-    }
-  };
-
-  return <div ref={containerRef} style={{ height: height }} />;
-};
-
-export default TVChartContainer;

package/src/streaming.ts

@@ -1,124 +0,0 @@
-const channelToSubscription = new Map();
-
-declare global {
-  interface Window { socket: WebSocket; }
-}
-
-function setupSockets(subRequest) {
-  const socket: WebSocket = new WebSocket("wss://stream.binance.com:9443/ws");
-  window.socket = socket;
-  socket.onopen = (event) => {
-    console.log("[socket] Connected");
-    socket.send(JSON.stringify(subRequest));
-  };
-
-  socket.onclose = (reason) => {
-    console.log("[socket] Disconnected:", reason);
-  };
-
-  socket.onerror = (error) => {
-    console.log("[socket] Error:", error);
-  };
-
-  socket.onmessage = (e) => {
-    const data = JSON.parse(e.data);
-    if (data.e == undefined) {
-      // skip all non-TRADE events
-      return;
-    }
-    const {
-      s: symbol,
-      t: startTime,
-      T: closeTime,
-      i: interval,
-      o: open,
-      c: close,
-      h: high,
-      l: low,
-      v: volume,
-      n: trades,
-      q: quoteVolume,
-    } = data.k;
-
-    const channelString = `${symbol.toLowerCase()}@kline_${interval}`;
-    const subscriptionItem = channelToSubscription.get(channelString);
-    if (subscriptionItem === undefined) {
-      return;
-    }
-    const bar = {
-      time: startTime,
-      open: open,
-      high: high,
-      low: low,
-      close: close,
-      volume: volume,
-    };
-    // send data to every subscriber of that symbol
-    subscriptionItem.handlers.forEach((handler) => handler.callback(bar));
-  };
-}
-
-export function subscribeOnStream(
-  symbolInfo,
-  resolution,
-  onRealtimeCallback,
-  subscribeUID,
-  onResetCacheNeededCallback,
-  interval
-) {
-  const channelString = `${symbolInfo.name.toLowerCase()}@kline_${interval}`;
-  const handler = {
-    id: subscribeUID,
-    callback: onRealtimeCallback,
-  };
-  let subscriptionItem = channelToSubscription.get(channelString);
-  if (subscriptionItem) {
-    // already subscribed to the channel, use the existing subscription
-    subscriptionItem.handlers.push(handler);
-    return;
-  }
-  subscriptionItem = {
-    subscribeUID,
-    resolution,
-    handlers: [handler],
-  };
-  const subRequest = {
-    method: "SUBSCRIBE",
-    params: [channelString],
-    id: 1,
-  };
-  channelToSubscription.set(channelString, subscriptionItem);
-  setupSockets(subRequest);
-}
-
-export function unsubscribeFromStream(subscriberUID) {
-  // find a subscription with id === subscriberUID
-  for (const channelString of channelToSubscription.keys()) {
-    const subscriptionItem = channelToSubscription.get(channelString);
-    const handlerIndex = subscriptionItem.handlers.findIndex(
-      (handler) => handler.id === subscriberUID
-    );
-
-    if (handlerIndex !== -1) {
-      // remove from handlers
-      subscriptionItem.handlers.splice(handlerIndex, 1);
-
-      if (subscriptionItem.handlers.length === 0) {
-        // unsubscribe from the channel, if it was the last handler
-        console.log(
-          "[unsubscribeBars]: Unsubscribe from streaming. Channel:",
-          channelString
-        );
-        const subRequest = {
-          method: "UNSUBSCRIBE",
-          params: [channelString],
-          id: 1,
-        };
-        window.socket.send(JSON.stringify(subRequest));
-        channelToSubscription.delete(channelString);
-        window.socket = undefined;
-        break;
-      }
-    }
-  }
-}