@inboxsdk/core 0.2.28-alpha.4 → 0.2.28-alpha.5

package/src/platform-implementation-js/dom-driver/inbox/views/inbox-thread-view.js

@@ -1,136 +1,101 @@
-/* @flow */
-
-import find from 'lodash/find';
-import { defn } from 'ud';
-import autoHtml from 'auto-html';
-import Kefir from 'kefir';
-import kefirBus from 'kefir-bus';
-import type { Bus } from 'kefir-bus';
-import kefirStopper from 'kefir-stopper';
-import BigNumber from 'bignumber.js';
-import delayAsap from '../../../lib/delay-asap';
-import idMap from '../../../lib/idMap';
-import querySelector from '../../../lib/dom/querySelectorOrFail';
-import makeMutationObserverChunkedStream from '../../../lib/dom/make-mutation-observer-chunked-stream';
-import type InboxDriver from '../inbox-driver';
-import type InboxMessageView from './inbox-message-view';
-import type ContentPanelViewDriver from '../../../driver-common/sidebar/ContentPanelViewDriver';
-import SimpleElementView from '../../../views/SimpleElementView';
-import CustomMessageView from '../../../views/conversations/custom-message-view';
-import parser from '../detection/thread/parser';
-import type { Parsed } from '../detection/thread/parser';
-import type { CustomMessageDescriptor } from '../../../views/conversations/custom-message-view';
-
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _find = _interopRequireDefault(require("lodash/find"));
+var _ud = require("ud");
+var _autoHtml = _interopRequireDefault(require("auto-html"));
+var _kefir = _interopRequireDefault(require("kefir"));
+var _kefirBus = _interopRequireDefault(require("kefir-bus"));
+var _kefirStopper = _interopRequireDefault(require("kefir-stopper"));
+var _bignumber = _interopRequireDefault(require("bignumber.js"));
+var _delayAsap = _interopRequireDefault(require("../../../lib/delay-asap"));
+var _idMap = _interopRequireDefault(require("../../../lib/idMap"));
+var _querySelectorOrFail = _interopRequireDefault(require("../../../lib/dom/querySelectorOrFail"));
+var _makeMutationObserverChunkedStream = _interopRequireDefault(require("../../../lib/dom/make-mutation-observer-chunked-stream"));
+var _SimpleElementView = _interopRequireDefault(require("../../../views/SimpleElementView"));
+var _customMessageView = _interopRequireDefault(require("../../../views/conversations/custom-message-view"));
+var _parser = _interopRequireDefault(require("../detection/thread/parser"));
 class InboxThreadView {
-  _element: HTMLElement;
-  _driver: InboxDriver;
-  _p: Parsed;
-  _eventStream: Bus<any> = kefirBus();
-  _messageViews: InboxMessageView[] = [];
-  _receivedMessageView = kefirStopper();
-  _stopper: Kefir.Observable<null>;
-  _ready: Kefir.Observable<void>;
-  _sidebarPanels: Set<ContentPanelViewDriver> = new Set();
-
-  constructor(element: HTMLElement, driver: InboxDriver, parsed: Parsed) {
+  constructor(element, driver, parsed) {
+    (0, _defineProperty2.default)(this, "_eventStream", (0, _kefirBus.default)());
+    (0, _defineProperty2.default)(this, "_messageViews", []);
+    (0, _defineProperty2.default)(this, "_receivedMessageView", (0, _kefirStopper.default)());
+    (0, _defineProperty2.default)(this, "_sidebarPanels", new Set());
     this._element = element;
     this._driver = driver;
     this._p = parsed;
-
-    this._stopper = this._eventStream
-      .ignoreValues()
-      .beforeEnd(() => null)
-      .toProperty();
-
+    this._stopper = this._eventStream.ignoreValues().beforeEnd(() => null).toProperty();
     this._driver.getThreadViewElementsMap().set(this._element, this);
-
-    this._ready = this._receivedMessageView
-      .flatMap(() => delayAsap())
-      .onValue(() => {
-        this._p = parser(this._element);
-      })
-      .toProperty();
-
+    this._ready = this._receivedMessageView.flatMap(() => (0, _delayAsap.default)()).onValue(() => {
+      this._p = (0, _parser.default)(this._element);
+    }).toProperty();
     if (this.isLoadingStub()) {
-      makeMutationObserverChunkedStream(this._element, {
+      (0, _makeMutationObserverChunkedStream.default)(this._element, {
         attributes: true,
-        attributeFilter: ['aria-busy'],
-      })
-        .takeUntilBy(this._stopper)
-        .onValue(() => {
-          if (!this.isLoadingStub()) {
-            this.destroy();
-          }
-        });
+        attributeFilter: ['aria-busy']
+      }).takeUntilBy(this._stopper).onValue(() => {
+        if (!this.isLoadingStub()) {
+          this.destroy();
+        }
+      });
     }
   }
-
-  isLoadingStub(): boolean {
+  isLoadingStub() {
     return this._element.getAttribute('aria-busy') === 'true';
   }
-
-  getEventStream(): Kefir.Observable<any> {
+  getEventStream() {
     return this._eventStream;
   }
-
-  getStopper(): Kefir.Observable<null> {
+  getStopper() {
     return this._stopper;
   }
-
-  addMessageViewDriver(messageView: InboxMessageView) {
+  addMessageViewDriver(messageView) {
     this._messageViews.push(messageView);
-    this._eventStream.plug(
-      messageView
-        .getEventStream()
-        .filter((event) => event.eventName === 'contactHover')
-    );
-    messageView
-      .getStopper()
-      .takeUntilBy(this._stopper)
-      .onValue(() => {
-        this._messageViews = this._messageViews.filter(
-          (m) => m !== messageView
-        );
-      });
+    this._eventStream.plug(messageView.getEventStream().filter(event => event.eventName === 'contactHover'));
+    messageView.getStopper().takeUntilBy(this._stopper).onValue(() => {
+      this._messageViews = this._messageViews.filter(m => m !== messageView);
+    });
     this._receivedMessageView.destroy();
   }
-
   getMessageViewDrivers() {
     return this._messageViews;
   }
-
-  getToolbarElement(): HTMLElement {
+  getToolbarElement() {
     if (!this._p.elements.toolbar) {
       throw new Error('Failed to find toolbar');
     }
     return this._p.elements.toolbar;
   }
-
-  getSubject(): string {
+  getSubject() {
     if (!this._p.elements.heading) {
       throw new Error('Failed to find subject');
     }
     return this._p.elements.heading.textContent;
   }
-
-  getThreadID(): string {
-    const { inboxThreadId } = this._p.attributes;
+  getThreadID() {
+    const {
+      inboxThreadId
+    } = this._p.attributes;
     if (!inboxThreadId) {
       throw new Error('Failed to find thread id');
     }
     if (/^msg-a:/.test(inboxThreadId)) {
       // eslint-disable-next-line no-console
-      console.warn(
-        'ThreadView.getThreadID() returned an incorrect thread ID. This method will be deprecated soon. Use getThreadIDAsync() instead which does not have this problem.'
-      );
+      console.warn('ThreadView.getThreadID() returned an incorrect thread ID. This method will be deprecated soon. Use getThreadIDAsync() instead which does not have this problem.');
     }
     const m = /\d+$/.exec(inboxThreadId);
     if (!m) throw new Error('Should not happen');
-    return new BigNumber(m[0]).toString(16);
+    return new _bignumber.default(m[0]).toString(16);
   }
-
-  async getThreadIDAsync(): Promise<string> {
-    const { inboxThreadId } = this._p.attributes;
+  async getThreadIDAsync() {
+    const {
+      inboxThreadId
+    } = this._p.attributes;
     if (!inboxThreadId) {
       throw new Error('Failed to find message id');
     }
@@ -140,35 +105,21 @@ class InboxThreadView {
       const firstMessage = this._messageViews[0];
       if (!firstMessage) throw new Error('Should not happen');
       const messageId = await firstMessage.getMessageIDAsync();
-
       return await this._driver.getThreadIdFromMessageId(messageId);
     } else {
       const m = /\d+$/.exec(inboxThreadId);
       if (!m) throw new Error('Should not happen');
-      return new BigNumber(m[0]).toString(16);
+      return new _bignumber.default(m[0]).toString(16);
     }
   }
-
-  registerHiddenCustomMessageNoticeProvider(
-    provider: (
-      numberCustomMessagesHidden: number,
-      numberNativeMessagesHidden: ?number,
-      unmountPromise: Promise<void>
-    ) => HTMLElement
-  ) {
+  registerHiddenCustomMessageNoticeProvider(provider) {
     throw new Error('not supported');
   }
-
-  addCustomMessage(
-    descriptorStream: Kefir.Observable<CustomMessageDescriptor>
-  ): CustomMessageView {
+  addCustomMessage(descriptorStream) {
     throw new Error('not supported');
   }
-
-  addSidebarContentPanel(descriptor: Kefir.Observable<Object>) {
-    const panel = this._driver
-      .getAppSidebarView()
-      .addSidebarContentPanel(descriptor);
+  addSidebarContentPanel(descriptor) {
+    const panel = this._driver.getAppSidebarView().addSidebarContentPanel(descriptor);
     this._sidebarPanels.add(panel);
     panel.getStopper().onValue(() => {
       this._sidebarPanels.delete(panel);
@@ -176,133 +127,94 @@ class InboxThreadView {
     this._stopper.takeUntilBy(panel.getStopper()).onValue(() => {
       panel.remove();
     });
-
-    descriptor
-      .takeUntilBy(this._stopper)
-      .takeUntilBy(panel.getStopper())
-      .take(1)
-      .onValue((descriptor) => {
-        const { stickyHeading } = this._p.elements;
-        if (!stickyHeading) return;
-
-        let iconArea = stickyHeading.querySelector(
-          '.' + idMap('sidebar_iconArea')
-        );
-        if (!iconArea) {
-          const _iconArea = (iconArea = document.createElement('div'));
-          iconArea.className = idMap('sidebar_iconArea');
-
-          this._driver
-            .getAppSidebarView()
-            .getOpenOrOpeningStream()
-            .takeUntilBy(this._stopper)
-            .onValue((open) => {
-              _iconArea.style.display = open ? 'none' : '';
-            });
-
-          stickyHeading.appendChild(iconArea);
-        }
-
-        const appName =
-          descriptor.appName ||
-          this._driver.getOpts().appName ||
-          descriptor.title;
-        const appIconUrl =
-          descriptor.appIconUrl ||
-          this._driver.getOpts().appIconUrl ||
-          descriptor.iconUrl;
-
-        // If there's an existing button for the app, then just increment its
-        // data-count attribute instead of adding a new button.
-        const existingButtonContainer = find(
-          iconArea.querySelectorAll('.' + idMap('sidebar_button_container')),
-          (el) => {
-            const button = el.querySelector('button');
-            if (!button || button.title !== appName) return false;
-            const img = button.querySelector('img');
-            if (!img || img.src !== appIconUrl) return false;
-            return true;
-          }
-        );
-
-        let container;
-        if (existingButtonContainer) {
-          const currentCount =
-            Number(existingButtonContainer.getAttribute('data-count')) || 1;
-          existingButtonContainer.setAttribute('data-count', currentCount + 1);
-          container = existingButtonContainer;
-        } else {
-          container = document.createElement('div');
-          container.className = idMap('sidebar_button_container');
-          container.innerHTML = autoHtml`
+    descriptor.takeUntilBy(this._stopper).takeUntilBy(panel.getStopper()).take(1).onValue(descriptor => {
+      const {
+        stickyHeading
+      } = this._p.elements;
+      if (!stickyHeading) return;
+      let iconArea = stickyHeading.querySelector('.' + (0, _idMap.default)('sidebar_iconArea'));
+      if (!iconArea) {
+        const _iconArea = iconArea = document.createElement('div');
+        iconArea.className = (0, _idMap.default)('sidebar_iconArea');
+        this._driver.getAppSidebarView().getOpenOrOpeningStream().takeUntilBy(this._stopper).onValue(open => {
+          _iconArea.style.display = open ? 'none' : '';
+        });
+        stickyHeading.appendChild(iconArea);
+      }
+      const appName = descriptor.appName || this._driver.getOpts().appName || descriptor.title;
+      const appIconUrl = descriptor.appIconUrl || this._driver.getOpts().appIconUrl || descriptor.iconUrl;
+
+      // If there's an existing button for the app, then just increment its
+      // data-count attribute instead of adding a new button.
+      const existingButtonContainer = (0, _find.default)(iconArea.querySelectorAll('.' + (0, _idMap.default)('sidebar_button_container')), el => {
+        const button = el.querySelector('button');
+        if (!button || button.title !== appName) return false;
+        const img = button.querySelector('img');
+        if (!img || img.src !== appIconUrl) return false;
+        return true;
+      });
+      let container;
+      if (existingButtonContainer) {
+        const currentCount = Number(existingButtonContainer.getAttribute('data-count')) || 1;
+        existingButtonContainer.setAttribute('data-count', currentCount + 1);
+        container = existingButtonContainer;
+      } else {
+        container = document.createElement('div');
+        container.className = (0, _idMap.default)('sidebar_button_container');
+        container.innerHTML = (0, _autoHtml.default)`
             <button class="inboxsdk__button_icon" type="button" title="${appName}">
               <img class="inboxsdk__button_iconImg" src="${appIconUrl}">
             </button>
           `;
-          querySelector(container, 'button').addEventListener(
-            'click',
-            (event: MouseEvent) => {
-              event.stopPropagation();
-              this._driver.getAppSidebarView().open();
-              panel.scrollIntoView();
-            },
-            true
-          );
-          iconArea.appendChild(container);
+        (0, _querySelectorOrFail.default)(container, 'button').addEventListener('click', event => {
+          event.stopPropagation();
+          this._driver.getAppSidebarView().open();
+          panel.scrollIntoView();
+        }, true);
+        iconArea.appendChild(container);
+      }
+      panel.getStopper().onValue(() => {
+        const currentCount = Number(container.getAttribute('data-count'));
+        if (currentCount <= 1) {
+          container.remove();
+        } else if (currentCount === 2) {
+          container.removeAttribute('data-count');
+        } else {
+          container.setAttribute('data-count', String(currentCount - 1));
         }
-
-        panel.getStopper().onValue(() => {
-          const currentCount = Number(container.getAttribute('data-count'));
-          if (currentCount <= 1) {
-            container.remove();
-          } else if (currentCount === 2) {
-            container.removeAttribute('data-count');
-          } else {
-            container.setAttribute('data-count', String(currentCount - 1));
-          }
-        });
       });
-
+    });
     return panel;
   }
-
   removePanels() {
-    this._sidebarPanels.forEach((panel) => {
+    this._sidebarPanels.forEach(panel => {
       panel.remove();
     });
   }
-
-  addNoticeBar(): SimpleElementView {
+  addNoticeBar() {
     const el = document.createElement('div');
-    el.className = idMap('thread_noticeBar');
-
-    const { heading } = this._p.elements;
+    el.className = (0, _idMap.default)('thread_noticeBar');
+    const {
+      heading
+    } = this._p.elements;
     if (!heading) {
       throw new Error('Failed to find subject');
     }
-
     heading.insertAdjacentElement('afterend', el);
-    const view = new SimpleElementView(el);
-
-    this._stopper
-      .takeUntilBy(Kefir.fromEvents(view, 'destroy'))
-      .onValue(() => view.destroy());
-
+    const view = new _SimpleElementView.default(el);
+    this._stopper.takeUntilBy(_kefir.default.fromEvents(view, 'destroy')).onValue(() => view.destroy());
     return view;
   }
-
-  addLabel(): SimpleElementView {
+  addLabel() {
     throw new Error('not supported');
   }
-
   getReadyStream() {
     return this._ready;
   }
-
   destroy() {
     this._driver.getThreadViewElementsMap().delete(this._element);
     this._eventStream.end();
   }
 }
-
-export default defn(module, InboxThreadView);
+var _default = (0, _ud.defn)(module, InboxThreadView);
+exports.default = _default;