@stokr/components-library 2.3.65-beta.10 → 2.3.65-beta.11

package/dist/components/Modal/PaymentModal.stories.js

@@ -1,57 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.PaymentModalOpen = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _PaymentModal = require("./PaymentModal");
-var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
-var _global = _interopRequireDefault(require("../../styles/global"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'Components Library/Modal',
-  component: _PaymentModal.PaymentModal,
-  argTypes: {
-    data: {
-      type: 'object',
-      defaultValue: false
-    },
-    isModalOpen: {
-      type: 'boolean',
-      defaultValue: false
-    },
-    onClose: {
-      type: 'function',
-      action: 'onClose'
-    }
-  }
-};
-const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_PaymentModal.PaymentModal, args)));
-const PaymentModalOpen = exports.PaymentModalOpen = Template.bind({});
-PaymentModalOpen.args = {
-  //children: 'I am the Child Element',
-  isModalOpen: true,
-  formatAmountInLink: true,
-  data: {
-    projectData: {
-      companyWallet: 'something'
-    },
-    tokeDecimals: 2,
-    currencyAmount: 32,
-    tokenAmount: '67',
-    tokenPrice: '345',
-    tokenSymbol: '$',
-    createdAt: Date.now(),
-    GAID: 'some gaid',
-    currencyType: 'lbtc'
-  }
-};
-
-// export const PaymentModalFullscreen = Template.bind({})
-// ModalFullscreen.args = {
-//   //children: 'I am the Child Element and I am Fullscreen',
-//   isOpen: true,
-//   //fullscreen: true,
-
-// }

package/dist/components/Modal/SideModal.stories.js

@@ -1,342 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.WithoutCloseButton = exports.WithContent = exports.NoDimmerClose = exports.LongContent = exports.DifferentWidths = exports.Basic = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _SideModal = _interopRequireDefault(require("./SideModal"));
-var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
-var _Button = _interopRequireDefault(require("../Button/Button.styles"));
-var _global = _interopRequireDefault(require("../../styles/global"));
-var _colors = _interopRequireDefault(require("../../styles/colors"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-var _default = exports.default = {
-  title: 'Components Library/Modal/SideModal',
-  component: _SideModal.default,
-  decorators: [Story => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(Story, null))],
-  argTypes: {
-    isOpen: {
-      control: 'boolean',
-      description: 'Controls modal visibility'
-    },
-    width: {
-      control: {
-        type: 'range',
-        min: 20,
-        max: 90,
-        step: 5
-      },
-      description: 'Width as percentage of screen',
-      defaultValue: 40
-    },
-    minWidth: {
-      control: 'number',
-      description: 'Minimum width in pixels',
-      defaultValue: 400
-    },
-    closeOnDimmerClick: {
-      control: 'boolean',
-      description: 'Close modal when clicking dimmed area',
-      defaultValue: true
-    },
-    showCloseButton: {
-      control: 'boolean',
-      description: 'Show close button',
-      defaultValue: true
-    }
-  }
-}; // Basic example
-const Basic = () => {
-  const [isOpen, setIsOpen] = (0, _react.useState)(false);
-  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(true)
-  }, "Open Side Modal"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
-    isOpen: isOpen,
-    onClose: () => setIsOpen(false)
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      padding: '40px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h2", {
-    style: {
-      marginBottom: '20px'
-    }
-  }, "Basic Side Modal"), /*#__PURE__*/_react.default.createElement("p", {
-    style: {
-      marginBottom: '16px',
-      lineHeight: '1.6'
-    }
-  }, "This is a basic side modal that slides in from the right. It takes 40% of the screen width by default."), /*#__PURE__*/_react.default.createElement("p", {
-    style: {
-      marginBottom: '16px',
-      lineHeight: '1.6'
-    }
-  }, "You can close it by clicking the X button, clicking outside, or pressing Escape."), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(false)
-  }, "Close Modal"))));
-};
-
-// Different widths
-exports.Basic = Basic;
-const DifferentWidths = () => {
-  const [isOpen30, setIsOpen30] = (0, _react.useState)(false);
-  const [isOpen40, setIsOpen40] = (0, _react.useState)(false);
-  const [isOpen60, setIsOpen60] = (0, _react.useState)(false);
-  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      display: 'flex',
-      flexDirection: 'column',
-      gap: '16px'
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen30(true)
-  }, "Open 30% Width"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen40(true)
-  }, "Open 40% Width"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen60(true)
-  }, "Open 60% Width")), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
-    isOpen: isOpen30,
-    onClose: () => setIsOpen30(false),
-    width: 30,
-    minWidth: 300
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      padding: '40px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h2", null, "30% Width Modal"), /*#__PURE__*/_react.default.createElement("p", null, "This modal takes 30% of the screen width."))), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
-    isOpen: isOpen40,
-    onClose: () => setIsOpen40(false),
-    width: 40,
-    minWidth: 400
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      padding: '40px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h2", null, "40% Width Modal"), /*#__PURE__*/_react.default.createElement("p", null, "This modal takes 40% of the screen width (default)."))), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
-    isOpen: isOpen60,
-    onClose: () => setIsOpen60(false),
-    width: 60,
-    minWidth: 500
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      padding: '40px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h2", null, "60% Width Modal"), /*#__PURE__*/_react.default.createElement("p", null, "This modal takes 60% of the screen width."))));
-};
-
-// With content example (like payout details)
-exports.DifferentWidths = DifferentWidths;
-const WithContent = () => {
-  const [isOpen, setIsOpen] = (0, _react.useState)(false);
-  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(true)
-  }, "View Payout Details"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
-    isOpen: isOpen,
-    onClose: () => setIsOpen(false)
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      padding: '40px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h1", {
-    style: {
-      fontSize: '24px',
-      fontWeight: 'bold',
-      marginBottom: '8px',
-      textTransform: 'uppercase'
-    }
-  }, "PAYOUT DETAILS"), /*#__PURE__*/_react.default.createElement("p", {
-    style: {
-      color: _colors.default.grey2,
-      marginBottom: '32px'
-    }
-  }, "View all payout information here."), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      marginBottom: '32px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h3", {
-    style: {
-      marginBottom: '16px',
-      fontSize: '16px'
-    }
-  }, "Status"), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      display: 'flex',
-      flexDirection: 'column',
-      gap: '16px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      display: 'flex',
-      alignItems: 'center',
-      gap: '8px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    style: {
-      color: _colors.default.freshGreen
-    }
-  }, "\u2713"), /*#__PURE__*/_react.default.createElement("span", {
-    style: {
-      fontWeight: 'bold'
-    }
-  }, "Initiated"), /*#__PURE__*/_react.default.createElement("span", {
-    style: {
-      color: _colors.default.grey2,
-      fontSize: '12px'
-    }
-  }, "12. AUG 2025 11:57")), /*#__PURE__*/_react.default.createElement("p", {
-    style: {
-      color: _colors.default.grey2,
-      fontSize: '14px',
-      marginLeft: '24px'
-    }
-  }, "Awaiting receipt of your funds.")))), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      backgroundColor: _colors.default.grey3,
-      padding: '20px',
-      borderRadius: '8px',
-      marginBottom: '24px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      marginBottom: '16px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("label", {
-    style: {
-      color: _colors.default.grey2,
-      fontSize: '12px'
-    }
-  }, "Amount"), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      display: 'flex',
-      alignItems: 'center',
-      gap: '8px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    style: {
-      fontSize: '20px',
-      fontWeight: 'bold'
-    }
-  }, "13.23145 BTC"))), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      marginBottom: '16px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("label", {
-    style: {
-      color: _colors.default.grey2,
-      fontSize: '12px'
-    }
-  }, "Wallet address"), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      fontWeight: 'bold'
-    }
-  }, "GAYiyo[...]LGXg")), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      marginBottom: '16px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("label", {
-    style: {
-      color: _colors.default.grey2,
-      fontSize: '12px'
-    }
-  }, "Period"), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      fontWeight: 'bold'
-    }
-  }, "01.10.2025. - 31.11.2025.")), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("label", {
-    style: {
-      color: _colors.default.grey2,
-      fontSize: '12px'
-    }
-  }, "Type"), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      fontWeight: 'bold'
-    }
-  }, "Interest"))), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      backgroundColor: _colors.default.grey3,
-      padding: '20px',
-      borderRadius: '8px',
-      marginBottom: '24px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("p", {
-    style: {
-      color: _colors.default.grey2,
-      fontSize: '14px',
-      marginBottom: '8px'
-    }
-  }, "To modify payout details or cancel this transaction, contact our support team at", ' ', /*#__PURE__*/_react.default.createElement("a", {
-    href: "mailto:support@stokr.io",
-    style: {
-      color: _colors.default.blue,
-      textDecoration: 'none'
-    }
-  }, "support@stokr.io"), ".")), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(false)
-  }, "Close"))));
-};
-
-// Without close button
-exports.WithContent = WithContent;
-const WithoutCloseButton = () => {
-  const [isOpen, setIsOpen] = (0, _react.useState)(false);
-  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(true)
-  }, "Open Modal (No Close Button)"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
-    isOpen: isOpen,
-    onClose: () => setIsOpen(false),
-    showCloseButton: false
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      padding: '40px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h2", null, "Modal Without Close Button"), /*#__PURE__*/_react.default.createElement("p", null, "This modal doesn't have a close button. You can only close it by:"), /*#__PURE__*/_react.default.createElement("ul", null, /*#__PURE__*/_react.default.createElement("li", null, "Clicking outside (on the dimmed area)"), /*#__PURE__*/_react.default.createElement("li", null, "Pressing Escape key"), /*#__PURE__*/_react.default.createElement("li", null, "Using the close button below")), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(false)
-  }, "Close Modal"))));
-};
-
-// Don't close on dimmer click
-exports.WithoutCloseButton = WithoutCloseButton;
-const NoDimmerClose = () => {
-  const [isOpen, setIsOpen] = (0, _react.useState)(false);
-  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(true)
-  }, "Open Modal (No Dimmer Close)"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
-    isOpen: isOpen,
-    onClose: () => setIsOpen(false),
-    closeOnDimmerClick: false
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      padding: '40px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h2", null, "Modal That Doesn't Close on Dimmer Click"), /*#__PURE__*/_react.default.createElement("p", null, "This modal won't close when you click outside. You must use the close button or Escape key."), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(false)
-  }, "Close Modal"))));
-};
-
-// Long content (scrollable)
-exports.NoDimmerClose = NoDimmerClose;
-const LongContent = () => {
-  const [isOpen, setIsOpen] = (0, _react.useState)(false);
-  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(true)
-  }, "Open Modal with Long Content"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
-    isOpen: isOpen,
-    onClose: () => setIsOpen(false)
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      padding: '40px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("h2", null, "Long Content Modal"), /*#__PURE__*/_react.default.createElement("p", null, "This modal has scrollable content:"), Array.from({
-    length: 50
-  }, (_, i) => /*#__PURE__*/_react.default.createElement("p", {
-    key: i,
-    style: {
-      marginBottom: '16px'
-    }
-  }, "This is paragraph ", i + 1, ". The modal should be scrollable when content exceeds the viewport height.")), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => setIsOpen(false)
-  }, "Close Modal"))));
-};
-exports.LongContent = LongContent;

package/dist/components/MultiProgressBar/MultiProgressBar.stories.js

@@ -1,67 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.MPBarMin30 = exports.MPBarMax70Fill65 = exports.MPBarAllparts = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _MultiProgressBar = _interopRequireDefault(require("./MultiProgressBar"));
-var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
-var _global = _interopRequireDefault(require("../../styles/global"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'Components Library/Multi Progress Bar',
-  component: _MultiProgressBar.default,
-  argTypes: {
-    backParts: {
-      type: 'array of shape',
-      defaultValue: [{
-        value: 0
-      }, {
-        label: ''
-      }]
-    },
-    fillParts: {
-      type: 'array of shape',
-      defaultValue: [{
-        value: 0
-      }, {
-        label: ''
-      }]
-    },
-    fill: {
-      type: 'number',
-      defaultValue: 0
-    }
-  }
-}; // backpart: minumum fill
-// fillparts: maximum fill
-// fill: fill between min and max
-const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_MultiProgressBar.default, args)));
-const MPBarMin30 = exports.MPBarMin30 = Template.bind({});
-MPBarMin30.args = {
-  backParts: [{
-    value: 30,
-    label: 'backparts - minumum fill'
-  }]
-};
-const MPBarMax70Fill65 = exports.MPBarMax70Fill65 = Template.bind({});
-MPBarMax70Fill65.args = {
-  fillParts: [{
-    value: 70,
-    label: 'fillparts - maximum fill'
-  }],
-  fill: 65
-};
-const MPBarAllparts = exports.MPBarAllparts = Template.bind({});
-MPBarAllparts.args = {
-  backParts: [{
-    value: 7,
-    label: 'backparts - minumum fill'
-  }],
-  fillParts: [{
-    value: 60,
-    label: 'fillparts - maximum fill'
-  }],
-  fill: 50
-};

package/dist/components/Newsletter/Newsletter.stories.js

@@ -1,16 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.NewsletterStokr = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Newsletter = _interopRequireDefault(require("./Newsletter"));
-var _global = _interopRequireDefault(require("../../styles/global"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'Components Library/Newsletter',
-  component: _Newsletter.default
-};
-const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_Newsletter.default, args));
-const NewsletterStokr = exports.NewsletterStokr = Template.bind({});

package/dist/components/NotificationContext/NotificationContext.js

@@ -1,141 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.NotificationProvider = exports.NotificationConsumer = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _socket = _interopRequireDefault(require("socket.io-client"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-const NotificationContext = /*#__PURE__*/_react.default.createContext();
-class NotificationProvider extends _react.Component {
-  constructor() {
-    super(...arguments);
-    _defineProperty(this, "socket", {});
-    _defineProperty(this, "projectSocket", {});
-    _defineProperty(this, "state", {
-      notifications: [],
-      projectNotifications: []
-    });
-    _defineProperty(this, "connectToSocket", () => {
-      const {
-        userId
-      } = this.props;
-      this.socket = (0, _socket.default)(process.env.REACT_APP_NOTIFICATION_API_URL, {
-        path: '/notification'
-      });
-      this.setSocketEvents();
-      this.setState({
-        notifications: []
-      }, () => {
-        this.socket.emit('login_to_socket', {
-          userId
-        });
-      });
-    });
-    _defineProperty(this, "connectToProjectSocket", () => {
-      const {
-        projectId
-      } = this.props;
-      this.projectSocket = (0, _socket.default)(process.env.REACT_APP_NOTIFICATION_API_URL, {
-        path: '/notification'
-      });
-      this.setProjectSocketEvents();
-      this.setState({
-        projectNotifications: []
-      }, () => {
-        this.projectSocket.emit('login_to_socket', {
-          userId: projectId
-        });
-      });
-    });
-    _defineProperty(this, "setSocketEvents", () => {
-      this.socket.on('has_error', this.onHasError);
-      this.socket.on('notification', this.onNotification);
-    });
-    _defineProperty(this, "setProjectSocketEvents", () => {
-      this.projectSocket.on('has_error', this.onHasError);
-      this.projectSocket.on('notification', this.onProjectNotification);
-    });
-    _defineProperty(this, "onHasError", data => {
-      console.warn(data);
-    });
-    _defineProperty(this, "onNotification", notification => {
-      this.setState(prevState => ({
-        notifications: [notification, ...prevState.notifications]
-      }));
-    });
-    _defineProperty(this, "onProjectNotification", notification => {
-      this.setState(prevState => ({
-        projectNotifications: [notification, ...prevState.projectNotifications]
-      }));
-    });
-    _defineProperty(this, "markAsRead", userNotificationId => {
-      const {
-        notifications
-      } = this.state;
-      this.socket.emit('mark_as_read', {
-        userNotificationId
-      });
-      this.setState({
-        notifications: notifications.filter(notificationItem => notificationItem._id !== userNotificationId)
-      });
-    });
-  }
-  componentDidMount() {
-    const {
-      userId,
-      projectId
-    } = this.props;
-    if (userId !== '') {
-      //this.connectToSocket();
-    }
-    if (projectId !== '') {
-      //this.connectToProjectSocket();
-    }
-  }
-  componentDidUpdate(prevProps) {
-    const {
-      userId,
-      projectId
-    } = this.props;
-    if (prevProps.userId === '' && userId !== '') {
-      //this.connectToSocket()
-    }
-    if (prevProps.projectId === '' && projectId !== '') {
-      this.connectToProjectSocket();
-    }
-  }
-  render() {
-    const {
-      children
-    } = this.props;
-    const {
-      notifications,
-      projectNotifications
-    } = this.state;
-    return /*#__PURE__*/_react.default.createElement(NotificationContext.Provider, {
-      value: {
-        notifications: notifications.filter(notification => !notification.isRead),
-        projectNotifications,
-        markAsRead: this.markAsRead
-      }
-    }, children);
-  }
-}
-exports.NotificationProvider = NotificationProvider;
-NotificationProvider.propTypes = {
-  children: _propTypes.default.node.isRequired,
-  userId: _propTypes.default.string,
-  projectId: _propTypes.default.string
-};
-NotificationProvider.defaultProps = {
-  userId: '',
-  projectId: ''
-};
-const NotificationConsumer = exports.NotificationConsumer = NotificationContext.Consumer;