binbot-charts 0.2.9 → 0.2.12

package/dist/components/TVChartContainer.js

@@ -38,7 +38,22 @@ function TVChartContainer(_ref) {
   } = _ref;
   const containerRef = (0, _react.useRef)(null);
   const [chartOrderLines, setChartOrderLines] = (0, _useImmer.useImmer)([]);
+  const [widgetState, setWidgetState] = (0, _react.useState)(null);
+  const [symbolState, setSymbolState] = (0, _react.useState)(symbol);
   (0, _react.useEffect)(() => {
+    if (!widgetState) {
+      initializeChart();
+    }
+
+    if (orderLines && orderLines.length > 0) {
+      updateOrderLines(orderLines);
+    } // if (symbol !== symbolState) {
+    //   widgetState.setSymbol(symbol, interval);
+    // }
+
+  }, [orderLines]);
+
+  const initializeChart = () => {
     const widgetOptions = {
       symbol: symbol,
       datafeed: new _datafeed.default(timescaleMarks),
@@ -57,13 +72,8 @@ function TVChartContainer(_ref) {
     };
     const tvWidget = new _charting_library.widget(widgetOptions);
     tvWidget.onChartReady(() => {
-      if (orderLines.length > 0) {
-        orderLines.forEach(order => {
-          updateOrderLines(tvWidget, order);
-        });
-      }
-
-      tvWidget.subscribe("onTick", event => onTick(event)); // get latest bar for last price
+      tvWidget.subscribe("onTick", event => onTick(event));
+      setWidgetState(tvWidget); // get latest bar for last price
 
       const prices = async () => {
         const data = await tvWidget.activeChart().exportData({
@@ -75,33 +85,33 @@ function TVChartContainer(_ref) {
       };
 
       prices();
-    }); // returned function will be called on component unmount
-
-    return () => {
-      if (!tvWidget) {
-        tvWidget.remove();
-      }
-    };
-  }, [orderLines, timescaleMarks]);
+    });
+  };
 
-  const updateOrderLines = (tvWidget, order) => {
+  const updateOrderLines = orderLines => {
     if (chartOrderLines && chartOrderLines.length > 0) {
       chartOrderLines.forEach(item => {
-        if (item._data.bodyText == order.text) {
-          item.setText(order.text).setTooltip(order.tooltip).setQuantity(order.quantity).setPrice(order.price);
-        }
+        orderLines.forEach(order => {
+          if (item._data.bodyText == order.text) {
+            item.setText(order.text).setTooltip(order.tooltip).setQuantity(order.quantity).setPrice(order.price);
+          }
+        });
       });
     } else {
-      const lineStyle = order.lineStyle || 0;
-      const chartOrderLine = tvWidget.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);
-      setChartOrderLines(draft => {
-        draft.push(chartOrderLine);
-        return draft;
-      });
+      if (orderLines && orderLines.length > 0) {
+        orderLines.forEach(order => {
+          const lineStyle = order.lineStyle || 0;
+          const 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);
+          setChartOrderLines(draft => {
+            draft.push(chartOrderLine);
+            return draft;
+          });
+        });
+      }
     }
   };
 
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, console.log(chartOrderLines), /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
     ref: containerRef,
     style: {
       height: height

package/dist/components/datafeed.js

@@ -49,32 +49,36 @@ class Datafeed {
       onResultReadyCallback(symbols);
     });
 
-    _defineProperty(this, "resolveSymbol", (symbolName, onSymbolResolvedCallback, onResolveErrorCallback) => {
+    _defineProperty(this, "resolveSymbol", async (symbolName, onSymbolResolvedCallback, onResolveErrorCallback) => {
       if (!symbolName) {
-        onResolveErrorCallback("cannot resolve symbol");
+        await onResolveErrorCallback("cannot resolve symbol");
         return;
       }
 
-      const symbolInfo = {
-        ticker: symbolName,
-        name: symbolName,
-        ticker: symbolName,
-        description: symbolName,
-        type: "crypto",
-        session: "24x7",
-        timezone: "Etc/UTC",
-        exchange: "Binance",
-        minmov: 100,
-        pricescale: 100000,
-        has_intraday: true,
-        has_no_volume: false,
-        volume: "hundreds",
-        has_weekly_and_monthly: true,
-        volume_precision: 9,
-        data_status: "streaming",
-        resolution: "1h"
+      const symbolInfo = () => {
+        return {
+          ticker: symbolName,
+          name: symbolName,
+          ticker: symbolName,
+          description: symbolName,
+          type: "crypto",
+          session: "24x7",
+          timezone: "Etc/UTC",
+          exchange: "Binance",
+          minmov: 100,
+          pricescale: 100000,
+          has_intraday: true,
+          has_no_volume: false,
+          volume: "hundreds",
+          has_weekly_and_monthly: true,
+          volume_precision: 9,
+          data_status: "streaming",
+          resolution: "1h"
+        };
       };
-      onSymbolResolvedCallback(symbolInfo);
+
+      const symbol = await symbolInfo();
+      onSymbolResolvedCallback(symbol);
     });
 
     _defineProperty(this, "getBars", async (symbolInfo, resolution, periodParams, onHistoryCallback, onErrorCallback) => {

package/dist/components/helpers.js

@@ -3,18 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.generateSymbol = generateSymbol;
 exports.getAllSymbols = getAllSymbols;
 exports.makeApiRequest = makeApiRequest;
-exports.parseFullSymbol = parseFullSymbol;
 
 require("core-js/modules/es.promise.js");
 
-require("core-js/modules/es.regexp.exec.js");
-
-require("core-js/modules/es.string.match.js");
-
-// Make requests to CryptoCompare API
 async function makeApiRequest(path) {
   try {
     const response = await fetch("https://api.binance.com/".concat(path));
@@ -22,29 +15,6 @@ async function makeApiRequest(path) {
   } catch (error) {
     throw new Error("Binance request error: ".concat(error.status));
   }
-} // Generate a symbol ID from a pair of the coins
-
-
-function generateSymbol(exchange, fromSymbol, toSymbol) {
-  const short = "".concat(fromSymbol, "/").concat(toSymbol);
-  return {
-    short,
-    full: "".concat(exchange, ":").concat(short)
-  };
-}
-
-function parseFullSymbol(fullSymbol) {
-  const match = fullSymbol.match(/^(\w+):(\w+)\/(\w+)$/);
-
-  if (!match) {
-    return null;
-  }
-
-  return {
-    exchange: match[1],
-    fromSymbol: match[2],
-    toSymbol: match[3]
-  };
 }
 
 async function getAllSymbols(symbol) {

package/package.json

@@ -1,10 +1,9 @@
 {
-  "version": "0.2.9",
+  "version": "0.2.12",
   "name": "binbot-charts",
   "dependencies": {
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
-    "react-scripts": "^5.0.1",
     "use-immer": "^0.7.0"
   },
   "devDependencies": {
@@ -12,7 +11,8 @@
     "@babel/core": "^7.18.13",
     "@babel/polyfill": "^7.12.1",
     "@babel/preset-env": "^7.18.10",
-    "@babel/preset-typescript": "^7.18.6"
+    "@babel/preset-typescript": "^7.18.6",
+    "react-scripts": "^5.0.1"
   },
   "scripts": {
     "start": "react-scripts start",