binbot-charts 0.1.0 → 0.1.4

package/dist/components/TVChartContainer.js

@@ -5,7 +5,7 @@ require("core-js/modules/web.dom-collections.iterator.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = TVChartContainer;
 
 var _react = _interopRequireWildcard(require("react"));
 
@@ -19,73 +19,47 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-class TVChartContainer extends _react.PureComponent {
-  constructor(props) {
-    super(props);
-
-    _defineProperty(this, "tvWidget", null);
-
-    this.ref = /*#__PURE__*/_react.default.createRef();
-  }
-
-  componentDidMount() {
+function TVChartContainer(_ref) {
+  let {
+    apiKey,
+    symbol = "Binance:APE/USDT",
+    interval = "1D",
+    libraryPath = "/charting_library/",
+    timescaleMarks = [],
+    orderLines = [],
+    height = "calc(100vh - 80px)"
+  } = _ref;
+  const containerRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
     const widgetOptions = {
-      symbol: this.props.symbol,
-      // BEWARE: no trailing slash is expected in feed URL
-      datafeed: new _datafeed.default(this.props.timescaleMarks),
-      interval: this.props.interval,
-      container: this.ref.current,
-      library_path: this.props.libraryPath,
+      symbol: symbol,
+      datafeed: new _datafeed.default(apiKey, timescaleMarks),
+      interval: interval,
+      container: containerRef.current,
+      library_path: libraryPath,
       locale: "en",
-      fullscreen: this.props.fullscreen,
-      autosize: this.props.autosize,
-      studies_overrides: this.props.studiesOverrides
+      fullscreen: false,
+      autosize: true,
+      studies_overrides: {}
     };
     const tvWidget = new _charting_library.widget(widgetOptions);
-    this.tvWidget = tvWidget;
     tvWidget.onChartReady(() => {
-      this.props.orderLines.forEach(element => {
-        tvWidget.chart().createPositionLine().setText(element.text).setTooltip(element.tooltip) // .setProtectTooltip("Protect position")
-        // .setCloseTooltip("Close position")
-        // .setReverseTooltip("Reverse position")
-        .setQuantity(element.quantity).setQuantityBackgroundColor(element.color).setQuantityBorderColor(element.color) // .setExtendLeft(false)
-        .setLineStyle(0).setLineLength(25).setLineColor(element.color).setBodyBackgroundColor(element.color).setBodyBorderColor(element.color).setBodyTextColor(element.color).setPrice(element.price);
+      orderLines.forEach(element => {
+        tvWidget.chart().createPositionLine().setText(element.text).setTooltip(element.tooltip).setQuantity(element.quantity).setQuantityBackgroundColor(element.color).setQuantityBorderColor(element.color).setLineStyle(0).setLineLength(25).setLineColor(element.color).setBodyBorderColor(element.color).setBodyTextColor(element.color).setPrice(element.price);
       });
-    });
-  }
-
-  componentWillUnmount() {
-    if (this.tvWidget !== null) {
-      this.tvWidget.remove();
-      this.tvWidget = null;
-    }
-  }
+    }); // returned function will be called on component unmount 
 
-  render() {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      ref: this.ref,
-      style: {
-        height: "calc(100vh - 80px)"
+    return () => {
+      if (this.tvWidget !== null) {
+        this.tvWidget.remove();
+        this.tvWidget = null;
       }
-    });
-  }
-
-}
-
-exports.default = TVChartContainer;
-
-_defineProperty(TVChartContainer, "defaultProps", {
-  symbol: "AAPL",
-  interval: "D",
-  datafeedUrl: "https://demo_feed.tradingview.com",
-  libraryPath: "/charting_library/",
-  chartsStorageUrl: "https://saveload.tradingview.com",
-  chartsStorageApiVersion: "1.1",
-  clientId: "tradingview.com",
-  userId: "public_user_id",
-  fullscreen: false,
-  autosize: true,
-  studiesOverrides: {}
-});
+    };
+  }, []);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: containerRef,
+    style: {
+      height: height
+    }
+  });
+}

package/dist/components/datafeed.js

@@ -21,60 +21,40 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-const lastBarsCache = new Map();
 const exchange = "Binance";
-const configurationData = {
-  // trading_options: true,
-  supports_marks: true,
-  supports_time: true,
-  supports_timescale_marks: true,
-  supported_resolutions: ["1D", "1W", "1M"],
-  exchanges: [{
-    value: "Binance",
-    name: "Binance",
-    desc: "Binance"
-  }],
-  symbols_types: [{
-    name: "crypto",
-    value: "crypto"
-  }]
-};
-
-async function getAllSymbols() {
-  const data = await (0, _helpers.makeApiRequest)("data/v3/all/exchanges");
-  let allSymbols = [];
-  const pairs = data.Data[exchange].pairs;
-
-  for (const leftPairPart of Object.keys(pairs)) {
-    const symbols = pairs[leftPairPart].map(rightPairPart => {
-      const symbol = (0, _helpers.generateSymbol)(exchange, leftPairPart, rightPairPart);
-      return {
-        symbol: symbol.short,
-        full_name: symbol.full,
-        description: symbol.short,
-        exchange: exchange,
-        type: "crypto"
-      };
-    });
-    allSymbols = [...allSymbols, ...symbols];
-  }
+const lastBarsCache = new Map();
 
-  return allSymbols;
-}
+const getConfigurationData = async () => {
+  return {
+    supports_marks: true,
+    supports_time: true,
+    supports_timescale_marks: true,
+    selected_resolution: "m",
+    exchanges: [{
+      value: "Binance",
+      name: "Binance",
+      desc: "Binance"
+    }],
+    symbols_types: [{
+      name: "crypto",
+      value: "crypto"
+    }]
+  };
+};
 
 class Datafeed {
-  constructor() {
-    let timescaleMarks = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-    let lineOrders = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+  constructor(apiKey) {
+    let timescaleMarks = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+    let lineOrders = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
 
-    _defineProperty(this, "onReady", callback => {
-      console.log("[onReady]: Method call");
-      setTimeout(() => callback(configurationData));
+    _defineProperty(this, "onReady", async callback => {
+      this.configurationData = await getConfigurationData(this.apiKey);
+      callback(this.configurationData);
     });
 
     _defineProperty(this, "searchSymbols", async (userInput, exchange, symbolType, onResultReadyCallback) => {
       console.log("[searchSymbols]: Method call");
-      const symbols = await getAllSymbols();
+      const symbols = await (0, _helpers.getAllSymbols)(exchange);
       const newSymbols = symbols.filter(symbol => {
         const isExchangeValid = exchange === "" || symbol.exchange === exchange;
         const isFullSymbolContainsInput = symbol.full_name.toLowerCase().indexOf(userInput.toLowerCase()) !== -1;
@@ -84,8 +64,7 @@ class Datafeed {
     });
 
     _defineProperty(this, "resolveSymbol", async (symbolName, onSymbolResolvedCallback, onResolveErrorCallback) => {
-      console.log("[resolveSymbol]: Method call", symbolName);
-      const symbols = await getAllSymbols();
+      const symbols = await (0, _helpers.getAllSymbols)(exchange);
       const symbolItem = symbols.find(_ref => {
         let {
           full_name
@@ -94,7 +73,6 @@ class Datafeed {
       });
 
       if (!symbolItem) {
-        console.log("[resolveSymbol]: Cannot resolve symbol", symbolName);
         onResolveErrorCallback("cannot resolve symbol");
         return;
       }
@@ -112,11 +90,9 @@ class Datafeed {
         has_intraday: true,
         has_no_volume: false,
         has_weekly_and_monthly: false,
-        supported_resolutions: ["1D", "1W", "1M"],
         volume_precision: 4,
         data_status: "streaming"
       };
-      console.log("[resolveSymbol]: Symbol resolved", symbolName);
       onSymbolResolvedCallback(symbolInfo);
     });
 
@@ -176,24 +152,30 @@ class Datafeed {
     });
 
     _defineProperty(this, "subscribeBars", (symbolInfo, resolution, onRealtimeCallback, subscribeUID, onResetCacheNeededCallback) => {
-      console.log("[subscribeBars]: Method call with subscribeUID:", subscribeUID);
+      console.log('[subscribeBars]: Method call with subscribeUID:', subscribeUID);
       (0, _streaming.subscribeOnStream)(symbolInfo, resolution, onRealtimeCallback, subscribeUID, onResetCacheNeededCallback, lastBarsCache.get(symbolInfo.full_name));
     });
 
     _defineProperty(this, "unsubscribeBars", subscriberUID => {
-      console.log("[unsubscribeBars]: Method call with subscriberUID:", subscriberUID);
+      console.log('[unsubscribeBars]: Method call with subscriberUID:', subscriberUID);
       (0, _streaming.unsubscribeFromStream)(subscriberUID);
     });
 
     this.timescaleMarks = timescaleMarks;
     this.lineOrders = lineOrders;
+    this.apiKey = apiKey;
   }
 
   getTimescaleMarks(symbolInfo, from, to, onDataCallback, resolution) {
-    let timescaleMarks = [];
-
     if (this.timescaleMarks.length > 0) {
-      timescaleMarks = this.timescaleMarks;
+      let timescaleMarks = [];
+      this.timescaleMarks.forEach(mark => {
+        let time = new Date(mark.time * 1000);
+        time.setHours(1, 0, 0, 0);
+        const roundFloor = time.getTime() / 1000;
+        mark.time = roundFloor;
+        timescaleMarks.push(mark);
+      });
       onDataCallback(timescaleMarks);
     }
   }

package/dist/components/helpers.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.generateSymbol = generateSymbol;
+exports.getAllSymbols = getAllSymbols;
 exports.makeApiRequest = makeApiRequest;
 exports.parseFullSymbol = parseFullSymbol;
 
@@ -13,6 +14,8 @@ require("core-js/modules/es.regexp.exec.js");
 
 require("core-js/modules/es.string.match.js");
 
+require("core-js/modules/web.dom-collections.iterator.js");
+
 // Make requests to CryptoCompare API
 async function makeApiRequest(path) {
   try {
@@ -44,4 +47,26 @@ function parseFullSymbol(fullSymbol) {
     fromSymbol: match[2],
     toSymbol: match[3]
   };
+}
+
+async function getAllSymbols(exchange) {
+  const data = await makeApiRequest("data/v3/all/exchanges");
+  let allSymbols = [];
+  const pairs = data.Data[exchange].pairs;
+
+  for (const leftPairPart of Object.keys(pairs)) {
+    const symbols = pairs[leftPairPart].map(rightPairPart => {
+      const symbol = generateSymbol(exchange, leftPairPart, rightPairPart);
+      return {
+        symbol: symbol.short,
+        full_name: symbol.full,
+        description: symbol.short,
+        exchange: exchange,
+        type: "crypto"
+      };
+    });
+    allSymbols = [...allSymbols, ...symbols];
+  }
+
+  return allSymbols;
 }

package/dist/components/index.js

@@ -3,6 +3,24 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "IOrderLine", {
+  enumerable: true,
+  get: function get() {
+    return _chartingLibraryInterfaces.IOrderLine;
+  }
+});
+Object.defineProperty(exports, "ITimescaleMarks", {
+  enumerable: true,
+  get: function get() {
+    return _chartingLibraryInterfaces.ITimescaleMarks;
+  }
+});
+Object.defineProperty(exports, "IWidgetOptions", {
+  enumerable: true,
+  get: function get() {
+    return _chartingLibraryInterfaces.IWidgetOptions;
+  }
+});
 Object.defineProperty(exports, "TVChartContainer", {
   enumerable: true,
   get: function get() {
@@ -12,4 +30,6 @@ Object.defineProperty(exports, "TVChartContainer", {
 
 var _TVChartContainer = _interopRequireDefault(require("./TVChartContainer"));
 
+var _chartingLibraryInterfaces = require("./charting-library-interfaces");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/components/streaming.js

@@ -28,20 +28,20 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-const socket = (0, _socket.default)("wss://streamer.cryptocompare.com");
+const socket = (0, _socket.default)('wss://streamer.cryptocompare.com');
 const channelToSubscription = new Map();
-socket.on("connect", () => {
-  console.log("[socket] Connected");
+socket.on('connect', () => {
+  console.log('[socket] Connected');
 });
-socket.on("disconnect", reason => {
-  console.log("[socket] Disconnected:", reason);
+socket.on('disconnect', reason => {
+  console.log('[socket] Disconnected:', reason);
 });
-socket.on("error", error => {
-  console.log("[socket] Error:", error);
+socket.on('error', error => {
+  console.log('[socket] Error:', error);
 });
-socket.on("m", data => {
-  console.log("[socket] Message:", data);
-  const [eventTypeStr, exchange, fromSymbol, toSymbol, tradeTimeStr, tradePriceStr] = data.split("~");
+socket.on('m', data => {
+  console.log('[socket] Message:', data);
+  const [eventTypeStr, exchange, fromSymbol, toSymbol,,, tradeTimeStr,, tradePriceStr] = data.split('~');
 
   if (parseInt(eventTypeStr) !== 0) {
     // skip all non-TRADE events
@@ -69,14 +69,14 @@ socket.on("m", data => {
       low: tradePrice,
       close: tradePrice
     };
-    console.log("[socket] Generate new bar", bar);
+    console.log('[socket] Generate new bar', bar);
   } else {
     bar = _objectSpread(_objectSpread({}, lastDailyBar), {}, {
       high: Math.max(lastDailyBar.high, tradePrice),
       low: Math.min(lastDailyBar.low, tradePrice),
       close: tradePrice
     });
-    console.log("[socket] Update the latest bar by price", tradePrice);
+    console.log('[socket] Update the latest bar by price', tradePrice);
   }
 
   subscriptionItem.lastDailyBar = bar; // send data to every subscriber of that symbol
@@ -112,8 +112,8 @@ function subscribeOnStream(symbolInfo, resolution, onRealtimeCallback, subscribe
     handlers: [handler]
   };
   channelToSubscription.set(channelString, subscriptionItem);
-  console.log("[subscribeBars]: Subscribe to streaming. Channel:", channelString);
-  socket.emit("SubAdd", {
+  console.log('[subscribeBars]: Subscribe to streaming. Channel:', channelString);
+  socket.emit('SubAdd', {
     subs: [channelString]
   });
 }
@@ -130,8 +130,8 @@ function unsubscribeFromStream(subscriberUID) {
 
       if (subscriptionItem.handlers.length === 0) {
         // unsubscribe from the channel, if it was the last handler
-        console.log("[unsubscribeBars]: Unsubscribe from streaming. Channel:", channelString);
-        socket.emit("SubRemove", {
+        console.log('[unsubscribeBars]: Unsubscribe from streaming. Channel:', channelString);
+        socket.emit('SubRemove', {
           subs: [channelString]
         });
         channelToSubscription.delete(channelString);

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.1.0",
+  "version": "0.1.4",
   "name": "binbot-charts",
   "dependencies": {
     "@babel/cli": "^7.18.10",
@@ -8,13 +8,14 @@
     "@babel/preset-env": "^7.18.10",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
-    "react-scripts": "5.0.1",
-    "socket.io-client": "^4.5.2"
+    "react-scripts": "^5.0.1",
+    "socket.io": "1.7.2",
+    "use-immer": "^0.7.0"
   },
   "scripts": {
     "start": "react-scripts start",
     "build": "rm -rf dist && NODE_ENV=production babel src/components/ -d dist/components && cp -r src/charting_library dist/charting_library",
-    "release": "yarn build && npm publish"
+    "release": "yarn build && yarn publish"
   },
   "description": "Binbot charts is the default candlestick bars chart used in terminal.binbot.com to render bots graphically.",
   "repository": {