binbot-charts 0.1.0 → 0.1.1

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,45 @@ 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 {
+    symbol = "AAPL",
+    interval = "D",
+    libraryPath = "/charting_library/",
+    timescaleMarks = [],
+    orderLines = []
+  } = _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(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: "calc(100vh)"
+    }
+  });
+}

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.1.0",
+  "version": "0.1.1",
   "name": "binbot-charts",
   "dependencies": {
     "@babel/cli": "^7.18.10",
@@ -9,7 +9,8 @@
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-scripts": "5.0.1",
-    "socket.io-client": "^4.5.2"
+    "socket.io-client": "^4.5.2",
+    "use-immer": "^0.7.0"
   },
   "scripts": {
     "start": "react-scripts start",