@atlaskit/editor-plugin-card/dist/es2019/ui/EditorLinkingPlatformAnalytics/DatasourceEvents.js

Card plugin for @atlaskit/editor-core

import { useEffect, useMemo } from 'react';
import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
import { useDatasourceLifecycleAnalytics } from '@atlaskit/link-analytics';
import { EVENT, EVENT_SUBJECT } from '../analytics/types';
import { getMethod } from './common';
function getDatasourceDisplay(datasourceAttrs) {
  var _datasourceAttrs$data;
  return (_datasourceAttrs$data = datasourceAttrs.datasource.views[0]) === null || _datasourceAttrs$data === void 0 ? void 0 : _datasourceAttrs$data.type;
}
function getDisplayedColumnCount(datasourceAttrs) {
  var _datasourceAttrs$data2, _datasourceAttrs$data3, _datasourceAttrs$data4, _datasourceAttrs$data5;
  return (_datasourceAttrs$data2 = (_datasourceAttrs$data3 = datasourceAttrs.datasource.views[0]) === null || _datasourceAttrs$data3 === void 0 ? void 0 : (_datasourceAttrs$data4 = _datasourceAttrs$data3.properties) === null || _datasourceAttrs$data4 === void 0 ? void 0 : (_datasourceAttrs$data5 = _datasourceAttrs$data4.columns) === null || _datasourceAttrs$data5 === void 0 ? void 0 : _datasourceAttrs$data5.length) !== null && _datasourceAttrs$data2 !== void 0 ? _datasourceAttrs$data2 : undefined;
}
function getSearchMethod(creationMethod, metadata) {
  if (creationMethod === 'editor_paste' || creationMethod === 'editor_type') {
    return '';
  }
  const {
    sourceEvent
  } = metadata;
  if (sourceEvent instanceof UIAnalyticsEvent) {
    var _event$payload$attrib;
    const event = sourceEvent;
    return (_event$payload$attrib = event.payload.attributes) === null || _event$payload$attrib === void 0 ? void 0 : _event$payload$attrib.searchMethod;
  }
  return 'unknown';
}
function getAnalyticAttributesFromNode(datasourceAttrs, metadata) {
  const {
    url,
    datasource: {
      id: datasourceId,
      parameters
    }
  } = datasourceAttrs;
  const display = getDatasourceDisplay(datasourceAttrs);
  let inputMethod = '';
  let actions = [];
  if (metadata.inputMethod) {
    var _getMethod;
    inputMethod = (_getMethod = getMethod(metadata)) !== null && _getMethod !== void 0 ? _getMethod : '';
  } else if (metadata.sourceEvent instanceof UIAnalyticsEvent) {
    var _metadata$sourceEvent, _metadata$sourceEvent2;
    inputMethod = (_metadata$sourceEvent = metadata.sourceEvent.payload.attributes) === null || _metadata$sourceEvent === void 0 ? void 0 : _metadata$sourceEvent.inputMethod;
    actions = (_metadata$sourceEvent2 = metadata.sourceEvent.payload.attributes) === null || _metadata$sourceEvent2 === void 0 ? void 0 : _metadata$sourceEvent2.actions;
  }
  const displayedColumnCount = getDisplayedColumnCount(datasourceAttrs);
  const searchMethod = getSearchMethod(inputMethod, metadata);
  return {
    actions,
    inputMethod,
    datasourceId,
    display,
    displayedColumnCount,
    parameters,
    searchMethod,
    url
  };
}

/**
 * Subscribes to the events occuring in the card
 * plugin and fires analytics events accordingly
 */
export const DatasourceEventsBinding = ({
  cardPluginEvents
}) => {
  const {
    datasourceCreated,
    datasourceUpdated,
    datasourceDeleted
  } = useDatasourceLifecycleAnalytics();
  const eventHandlers = useMemo(() => {
    return {
      [EVENT.CREATED]: ({
        node,
        nodeContext,
        ...metadata
      }) => {
        const attributes = getAnalyticAttributesFromNode(node.attrs, metadata);
        const {
          actions,
          inputMethod,
          datasourceId,
          display,
          displayedColumnCount,
          parameters,
          searchMethod,
          url
        } = attributes;
        datasourceCreated({
          datasourceId,
          parameters,
          url
        }, null, {
          actions,
          creationMethod: inputMethod,
          display,
          ...(typeof displayedColumnCount === 'number' ? {
            displayedColumnCount
          } : {}),
          nodeContext,
          searchMethod
        });
      },
      [EVENT.UPDATED]: ({
        node,
        nodeContext,
        ...metadata
      }) => {
        const attributes = getAnalyticAttributesFromNode(node.attrs, metadata);
        const {
          actions,
          datasourceId,
          display,
          displayedColumnCount,
          inputMethod,
          parameters,
          searchMethod,
          url
        } = attributes;
        datasourceUpdated({
          datasourceId,
          parameters,
          url
        }, null, {
          actions,
          display,
          displayedColumnCount,
          nodeContext,
          searchMethod,
          updateMethod: inputMethod
        });
      },
      [EVENT.DELETED]: ({
        node,
        nodeContext,
        ...metadata
      }) => {
        const attributes = getAnalyticAttributesFromNode(node.attrs, metadata);
        const {
          datasourceId,
          display,
          displayedColumnCount,
          inputMethod,
          parameters,
          searchMethod,
          url
        } = attributes;
        datasourceDeleted({
          datasourceId,
          parameters,
          url
        }, null, {
          deleteMethod: inputMethod,
          display,
          displayedColumnCount,
          nodeContext,
          searchMethod
        });
      }
    };
  }, [datasourceCreated, datasourceUpdated, datasourceDeleted]);

  /**
   * Subscribe to datasource events
   */
  useEffect(() => {
    const unsubscribe = cardPluginEvents.subscribe(({
      event,
      subject,
      data
    }) => {
      if (subject === EVENT_SUBJECT.DATASOURCE) {
        eventHandlers[event](data);
      }
    });
    return () => unsubscribe();
  }, [eventHandlers, cardPluginEvents]);
  return null;
};