binbot-charts 0.2.9 → 0.2.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -38,7 +38,30 @@ function TVChartContainer(_ref) {
38
38
  } = _ref;
39
39
  const containerRef = (0, _react.useRef)(null);
40
40
  const [chartOrderLines, setChartOrderLines] = (0, _useImmer.useImmer)([]);
41
+ const [widgetState, setWidgetState] = (0, _react.useState)(null);
41
42
  (0, _react.useEffect)(() => {
43
+ if (!widgetState) {
44
+ initializeChart();
45
+ }
46
+
47
+ if (orderLines && orderLines.length > 0) {
48
+ updateOrderLines(orderLines);
49
+ } // returned function will be called on component unmount
50
+
51
+
52
+ return () => {
53
+ componentUnMount();
54
+ };
55
+ }, [orderLines]);
56
+
57
+ const componentUnMount = () => {
58
+ if (widgetState !== null) {
59
+ widgetState.remove();
60
+ setWidgetState(null);
61
+ }
62
+ };
63
+
64
+ const initializeChart = () => {
42
65
  const widgetOptions = {
43
66
  symbol: symbol,
44
67
  datafeed: new _datafeed.default(timescaleMarks),
@@ -57,13 +80,8 @@ function TVChartContainer(_ref) {
57
80
  };
58
81
  const tvWidget = new _charting_library.widget(widgetOptions);
59
82
  tvWidget.onChartReady(() => {
60
- if (orderLines.length > 0) {
61
- orderLines.forEach(order => {
62
- updateOrderLines(tvWidget, order);
63
- });
64
- }
65
-
66
- tvWidget.subscribe("onTick", event => onTick(event)); // get latest bar for last price
83
+ tvWidget.subscribe("onTick", event => onTick(event));
84
+ setWidgetState(tvWidget); // get latest bar for last price
67
85
 
68
86
  const prices = async () => {
69
87
  const data = await tvWidget.activeChart().exportData({
@@ -75,33 +93,34 @@ function TVChartContainer(_ref) {
75
93
  };
76
94
 
77
95
  prices();
78
- }); // returned function will be called on component unmount
79
-
80
- return () => {
81
- if (!tvWidget) {
82
- tvWidget.remove();
83
- }
84
- };
85
- }, [orderLines, timescaleMarks]);
96
+ });
97
+ };
86
98
 
87
- const updateOrderLines = (tvWidget, order) => {
99
+ const updateOrderLines = orderLines => {
88
100
  if (chartOrderLines && chartOrderLines.length > 0) {
89
101
  chartOrderLines.forEach(item => {
90
- if (item._data.bodyText == order.text) {
91
- item.setText(order.text).setTooltip(order.tooltip).setQuantity(order.quantity).setPrice(order.price);
92
- }
102
+ orderLines.forEach(order => {
103
+ if (item._data.bodyText == order.text) {
104
+ item.setText(order.text).setTooltip(order.tooltip).setQuantity(order.quantity).setPrice(order.price);
105
+ }
106
+ });
93
107
  });
94
108
  } else {
95
- const lineStyle = order.lineStyle || 0;
96
- 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);
97
- setChartOrderLines(draft => {
98
- draft.push(chartOrderLine);
99
- return draft;
100
- });
109
+ if (orderLines && orderLines.length > 0) {
110
+ orderLines.forEach(order => {
111
+ // const lineStyle = order.lineStyle || 0;
112
+ 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)
113
+ .setLineLength(25).setLineColor(order.color).setBodyFont("inherit 14px Arial").setBodyBorderColor(order.color).setBodyTextColor(order.color).setPrice(order.price);
114
+ setChartOrderLines(draft => {
115
+ draft.push(chartOrderLine);
116
+ return draft;
117
+ });
118
+ });
119
+ }
101
120
  }
102
121
  };
103
122
 
104
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, console.log(chartOrderLines), /*#__PURE__*/_react.default.createElement("div", {
123
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
105
124
  ref: containerRef,
106
125
  style: {
107
126
  height: height
@@ -49,32 +49,36 @@ class Datafeed {
49
49
  onResultReadyCallback(symbols);
50
50
  });
51
51
 
52
- _defineProperty(this, "resolveSymbol", (symbolName, onSymbolResolvedCallback, onResolveErrorCallback) => {
52
+ _defineProperty(this, "resolveSymbol", async (symbolName, onSymbolResolvedCallback, onResolveErrorCallback) => {
53
53
  if (!symbolName) {
54
- onResolveErrorCallback("cannot resolve symbol");
54
+ await onResolveErrorCallback("cannot resolve symbol");
55
55
  return;
56
56
  }
57
57
 
58
- const symbolInfo = {
59
- ticker: symbolName,
60
- name: symbolName,
61
- ticker: symbolName,
62
- description: symbolName,
63
- type: "crypto",
64
- session: "24x7",
65
- timezone: "Etc/UTC",
66
- exchange: "Binance",
67
- minmov: 100,
68
- pricescale: 100000,
69
- has_intraday: true,
70
- has_no_volume: false,
71
- volume: "hundreds",
72
- has_weekly_and_monthly: true,
73
- volume_precision: 9,
74
- data_status: "streaming",
75
- resolution: "1h"
58
+ const symbolInfo = () => {
59
+ return {
60
+ ticker: symbolName,
61
+ name: symbolName,
62
+ ticker: symbolName,
63
+ description: symbolName,
64
+ type: "crypto",
65
+ session: "24x7",
66
+ timezone: "Etc/UTC",
67
+ exchange: "Binance",
68
+ minmov: 100,
69
+ pricescale: 100000,
70
+ has_intraday: true,
71
+ has_no_volume: false,
72
+ volume: "hundreds",
73
+ has_weekly_and_monthly: true,
74
+ volume_precision: 9,
75
+ data_status: "streaming",
76
+ resolution: "1h"
77
+ };
76
78
  };
77
- onSymbolResolvedCallback(symbolInfo);
79
+
80
+ const symbol = await symbolInfo();
81
+ onSymbolResolvedCallback(symbol);
78
82
  });
79
83
 
80
84
  _defineProperty(this, "getBars", async (symbolInfo, resolution, periodParams, onHistoryCallback, onErrorCallback) => {
package/package.json CHANGED
@@ -1,10 +1,9 @@
1
1
  {
2
- "version": "0.2.9",
2
+ "version": "0.2.10",
3
3
  "name": "binbot-charts",
4
4
  "dependencies": {
5
5
  "react": "^17.0.1",
6
6
  "react-dom": "^17.0.1",
7
- "react-scripts": "^5.0.1",
8
7
  "use-immer": "^0.7.0"
9
8
  },
10
9
  "devDependencies": {
@@ -12,7 +11,8 @@
12
11
  "@babel/core": "^7.18.13",
13
12
  "@babel/polyfill": "^7.12.1",
14
13
  "@babel/preset-env": "^7.18.10",
15
- "@babel/preset-typescript": "^7.18.6"
14
+ "@babel/preset-typescript": "^7.18.6",
15
+ "react-scripts": "^5.0.1"
16
16
  },
17
17
  "scripts": {
18
18
  "start": "react-scripts start",