react-autoql 3.4.5 → 3.4.9

package/dist/autoql.esm.js

@@ -11,7 +11,7 @@ import _regeneratorRuntime from '@babel/runtime/regenerator';
 import PropTypes, { shape, string, number, bool, oneOf, arrayOf, func, instanceOf, oneOfType, array } from 'prop-types';
 import { BsArrowBarDown, BsArrowBarUp } from 'react-icons/bs';
 import { BiLineChart } from 'react-icons/bi';
-import { MdError, MdPlayCircleOutline, MdLock, MdInfoOutline, MdContentCopy, MdClose } from 'react-icons/md';
+import { MdError, MdLockOpen, MdPlayCircleOutline, MdLock, MdInfoOutline, MdContentCopy, MdClose } from 'react-icons/md';
 import { FiAlertTriangle, FiTrash2, FiSettings, FiSend, FiPlus, FiPauseCircle, FiBellOff, FiBell, FiMoreHorizontal, FiMoreVertical, FiFilter, FiEye, FiDownload, FiDatabase, FiCheck, FiCalendar, FiArrowLeft } from 'react-icons/fi';
 import { IoIosSearch, IoIosHourglass, IoIosGlobe, IoIosCloseCircleOutline } from 'react-icons/io';
 import { TiSortNumerically } from 'react-icons/ti';
@@ -34,7 +34,7 @@ import disableScroll from 'disable-scroll';
 import HTMLRenderer from 'react-html-renderer';
 import { scaleOrdinal, scaleBand, scaleLinear } from 'd3-scale';
 import Autosuggest from 'react-autosuggest';
-import RecordRTC, { StereoAudioRecorder } from 'recordrtc';
+import SpeechRecognition from 'react-speech-recognition';
 import { ReactTabulator } from 'react-tabulator';
 import 'react-tabulator/lib/styles.css';
 import 'react-tabulator/css/bootstrap/tabulator_bootstrap.min.css';
@@ -57,7 +57,7 @@ import RGL, { WidthProvider } from 'react-grid-layout';
 import SplitterLayout from 'react-splitter-layout';
 import 'react-grid-layout/css/styles.css';
 import 'react-splitter-layout/lib/index.css';
-import SpeechRecognition from 'react-speech-recognition';
+import RecordRTC, { StereoAudioRecorder } from 'recordrtc';
 
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
@@ -479,7 +479,8 @@ var autoQLConfigDefault = {
   enableDrilldowns: true,
   enableNotifications: false,
   enableSlackSharing: true,
-  enableTeamsSharing: true
+  enableTeamsSharing: true,
+  enableCSVDownload: false
 };
 var themeConfigDefault = {
   theme: 'light',
@@ -923,7 +924,8 @@ var formatChartLabel = function formatChartLabel(_ref) {
     case 'PERCENT':
       {
         if (Number(d)) {
-          formattedLabel = Numbro(d).format({
+          var p = Number(d) / 100;
+          formattedLabel = Numbro(p).format({
             output: 'percent',
             mantissa: 0
           });
@@ -1050,7 +1052,8 @@ var formatElement = function formatElement(_ref2) {
         case 'PERCENT':
           {
             if (Number(element)) {
-              formattedElement = Numbro(element).format('0.00%');
+              var p = Number(element) / 100;
+              formattedElement = Numbro(p).format('0.00%');
 
               if (htmlElement) {
                 htmlElement.classList.add("comparison-value-".concat(element < 0 ? 'negative' : 'positive'));
@@ -1211,7 +1214,7 @@ var supportsPieChart = function supportsPieChart(columns, chartData) {
 
   return true;
 };
-var getSupportedDisplayTypes = function getSupportedDisplayTypes(response, chartData) {
+var getSupportedDisplayTypes = function getSupportedDisplayTypes(response, chartData, shouldExcludePieChart) {
   try {
     if (!_get(response, 'data.data.display_type')) {
       return [];
@@ -1248,7 +1251,7 @@ var getSupportedDisplayTypes = function getSupportedDisplayTypes(response, chart
       // column, we should be able to chart anything
       var _supportedDisplayTypes = ['table', 'column', 'bar', 'line'];
 
-      if (supportsPieChart(columns, chartData)) {
+      if (supportsPieChart(columns, chartData) && !shouldExcludePieChart) {
         _supportedDisplayTypes.push('pie');
       } // create pivot based on month and year
 
@@ -2514,6 +2517,12 @@ var Icon = /*#__PURE__*/function (_React$Component) {
             break;
           }
 
+        case 'unlock':
+          {
+            icon = /*#__PURE__*/React.createElement(MdLockOpen, null);
+            break;
+          }
+
         case 'warning':
           {
             icon = /*#__PURE__*/React.createElement(MdError, null);
@@ -2715,7 +2724,7 @@ var runQueryOnly = function runQueryOnly() {
       source = _ref4.source,
       AutoAEId = _ref4.AutoAEId;
 
-  var url = "".concat(domain, "/autoql/api/v2/query?key=").concat(apiKey);
+  var url = "".concat(domain, "/autoql/api/v1/query?key=").concat(apiKey);
   var finalUserSelection = transformUserSelection(userSelection);
   var data = {
     text: query,
@@ -3856,19 +3865,12 @@ var QueryInput = /*#__PURE__*/function (_React$Component) {
         type: "react-autoql-bubbles-outlined"
       })), _this.props.showLoadingDots && _this.state.isQueryRunning && /*#__PURE__*/React.createElement("div", {
         className: "input-response-loading-container"
-      }, /*#__PURE__*/React.createElement(LoadingDots, null)), _this.props.enableVoiceRecord && /*#__PURE__*/React.createElement(SpeechToTextBtn, {
+      }, /*#__PURE__*/React.createElement(LoadingDots, null)), _this.props.enableVoiceRecord && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SpeechToTextButtonBrowser, {
         onTranscriptChange: _this.onTranscriptChange,
         onFinalTranscript: _this.onFinalTranscript,
         themeConfig: _this.props.themeConfig,
         authentication: getAuthentication(_this.props.authentication)
-      }) // KEEP THIS FOR NOW
-      // <SpeechToTextButtonBrowser
-      //   onTranscriptChange={this.onTranscriptChange}
-      //   onFinalTranscript={this.onFinalTranscript}
-      //   themeConfig={this.props.themeConfig}
-      //   authentication={getAuthentication(this.props.authentication)}
-      // />
-      ));
+      }))));
     });
 
     return _this;
@@ -7517,6 +7519,7 @@ var Button = /*#__PURE__*/function (_React$Component) {
       return /*#__PURE__*/React.createElement(ErrorBoundary, null, /*#__PURE__*/React.createElement("button", {
         className: "react-autoql-btn\n          ".concat(_this.props.className || '', "\n          ").concat(type, "\n          ").concat(size, "\n          ").concat(isDisabled ? ' disabled' : ''),
         "data-test": "react-autoql-btn",
+        "data-multiline": _this.props.multiline,
         style: _objectSpread2({}, _this.props.style),
         onClick: _this.props.onClick,
         "data-tip": _this.props.tooltip,
@@ -7544,6 +7547,7 @@ _defineProperty(Button, "propTypes", {
   onClick: PropTypes.func,
   loading: PropTypes.bool,
   disabled: PropTypes.bool,
+  multiline: PropTypes.bool,
   tooltip: PropTypes.string
 });
 
@@ -7552,6 +7556,7 @@ _defineProperty(Button, "defaultProps", {
   loading: false,
   size: 'large',
   disabled: false,
+  multiline: false,
   tooltip: undefined,
   onClick: function onClick() {}
 });
@@ -10261,11 +10266,22 @@ var QueryOutput = /*#__PURE__*/function (_React$Component) {
       }
 
       var formattedColumns = columns.map(function (col, i) {
+        /**
+         * EDIT:
+         * We no longer want to default to one over the other. Howeever, 
+         * I would like to hang onto this code for now incase we do want to
+         * include either/or in some cases in the future
+         */
         // Regardless of the BE response, we want to default to percent
-        if ((col.type === 'RATIO' || col.type === 'NUMBER') && _get(getDataFormatting(_this.props.dataFormatting), 'comparisonDisplay') === 'PERCENT') {
-          col.type = 'PERCENT';
-        }
-
+        // if (
+        //   (col.type === 'RATIO' || col.type === 'NUMBER') &&
+        //   _get(
+        //     getDataFormatting(this.props.dataFormatting),
+        //     'comparisonDisplay'
+        //   ) === 'PERCENT'
+        // ) {
+        //   col.type = 'PERCENT'
+        // }
         col.field = "".concat(i);
         col.title = col.display_name;
         col.id = uuid.v4();
@@ -12925,8 +12941,8 @@ var NotificationItem = /*#__PURE__*/function (_React$Component) {
         var queryResponse = {
           data: _this.props.activeNotificationData
         };
-        _this.supportedDisplayTypes = getSupportedDisplayTypes(queryResponse);
-        var displayType = _this.supportedDisplayTypes.includes('column') ? 'column' : getDefaultDisplayType(queryResponse, _this.props.autoChartAggregations);
+        _this.supportedDisplayTypes = getSupportedDisplayTypes(queryResponse, undefined, true);
+        var displayType = _this.props.autoChartAggregations && _this.supportedDisplayTypes.includes('column') ? 'column' : getDefaultDisplayType(queryResponse, _this.props.autoChartAggregations);
 
         _this.setState({
           displayType: displayType
@@ -13255,7 +13271,7 @@ _defineProperty(NotificationItem, "defaultProps", {
   themeConfig: themeConfigDefault,
   activeNotificationData: undefined,
   showNotificationDetails: true,
-  autoChartAggregations: true,
+  autoChartAggregations: false,
   onRuleFetchCallback: function onRuleFetchCallback() {},
   onExpandCallback: function onExpandCallback() {},
   onDismissCallback: function onDismissCallback() {},
@@ -14887,7 +14903,7 @@ _defineProperty(NotificationFeed, "defaultProps", {
   themeConfig: themeConfigDefault,
   activeNotificationData: undefined,
   showNotificationDetails: true,
-  autoChartAggregations: true,
+  autoChartAggregations: false,
   showCreateAlertBtn: false,
   onCollapseCallback: function onCollapseCallback() {},
   onExpandCallback: function onExpandCallback() {},
@@ -15174,14 +15190,19 @@ var DataAlerts = /*#__PURE__*/function (_React$Component) {
           type: "hour-glass"
         }), _this.hasError(notification) ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
           type: "primary",
+          tooltip: "This Alert is no longer active. <br /> Click to re-initialze it.",
+          multiline: true,
           className: "react-autoql-re-initialize-btn",
-          tooltip: "Please re-initialize data alert",
           onClick: function onClick() {
-            return _this.props.handleInitialize(notification, _this.props.selectedDemoProjectId, _this.props.authentication);
+            _this.props.onAlertInitializationCallback(notification, _this.props.selectedDemoProjectId, _this.props.authentication);
+
+            _this.getDataAlerts();
           }
         }, /*#__PURE__*/React.createElement("span", {
           className: "react-autoql-re-initialize-btn-text"
-        }, "Re-Initialize")), /*#__PURE__*/React.createElement(Checkbox, {
+        }, /*#__PURE__*/React.createElement(Icon, {
+          type: "warning-triangle"
+        }), ' ', " Resend")), /*#__PURE__*/React.createElement(Checkbox, {
           themeConfig: getThemeConfig(_this.props.themeConfig),
           type: "switch",
           className: "react-autoql-notification-disable-checkbox"
@@ -15268,7 +15289,8 @@ _defineProperty(DataAlerts, "defaultProps", {
   authentication: authenticationDefault,
   themeConfig: themeConfigDefault,
   showCreateAlertBtn: false,
-  onErrorCallback: function onErrorCallback() {}
+  onErrorCallback: function onErrorCallback() {},
+  onAlertInitializationCallback: function onAlertInitializationCallback() {}
 });
 
 var getInitialStateData$2 = function getInitialStateData(initialData) {
@@ -17885,30 +17907,21 @@ var Input = /*#__PURE__*/function (_React$Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "renderToolbar", function () {
+      var _shouldShowButton;
+
       var displayType = _get(_this.props.responseRef, 'state.displayType');
 
       var response = _get(_this.props.responseRef, 'props.queryResponse');
 
       var isDataResponse = _get(response, 'data.data.display_type') === 'data';
-      var shouldShowButton = {
+      var shouldShowButton = (_shouldShowButton = {
         showFilterButton: isTableResponse(response, displayType) && !_this.areAllColumnsHidden() && _get(response, 'data.data.rows.length') > 1,
         showCopyButton: isTableResponse(response, displayType) && !_this.areAllColumnsHidden() && !!_get(response, 'data.data.rows.length'),
         showSaveAsCSVButton: isTableResponse(response, displayType) && !_this.areAllColumnsHidden() && !!_get(response, 'data.data.rows.length'),
         showSaveAsPNGButton: CHART_TYPES.includes(displayType),
         showHideColumnsButton: getAutoQLConfig$1(_this.props.autoQLConfig).enableColumnVisibilityManager && isTableResponse(response, displayType) && displayType !== 'pivot_table' && _get(response, 'data.data.columns.length') > 0,
-        showSQLButton: isDataResponse && getAutoQLConfig$1(_this.props.autoQLConfig).debug,
-        showDeleteButton: _this.props.enableDeleteBtn,
-        showReportProblemButton: !!_get(response, 'data.data.query_id'),
-        showCreateNotificationIcon: isDataResponse && getAutoQLConfig$1(_this.props.autoQLConfig).enableNotifications && !_this.isDrilldownResponse(),
-        showShareToSlackButton: false,
-        // This feature is disabled indefinitely
-        // isDataResponse &&
-        // getAutoQLConfig(this.props.autoQLConfig).enableSlackSharing,
-        showShareToTeamsButton: false // This feature is disabled indefinitely
-        // isDataResponse &&
-        // getAutoQLConfig(this.props.autoQLConfig).enableTeamsSharing,
-
-      };
+        showSQLButton: isDataResponse && getAutoQLConfig$1(_this.props.autoQLConfig).debug
+      }, _defineProperty(_shouldShowButton, "showSaveAsCSVButton", isDataResponse && getAutoQLConfig$1(_this.props.autoQLConfig).enableCSVDownload), _defineProperty(_shouldShowButton, "showDeleteButton", _this.props.enableDeleteBtn), _defineProperty(_shouldShowButton, "showReportProblemButton", !!_get(response, 'data.data.query_id')), _defineProperty(_shouldShowButton, "showCreateNotificationIcon", isDataResponse && getAutoQLConfig$1(_this.props.autoQLConfig).enableNotifications && !_this.isDrilldownResponse()), _defineProperty(_shouldShowButton, "showShareToSlackButton", false), _defineProperty(_shouldShowButton, "showShareToTeamsButton", false), _shouldShowButton);
       shouldShowButton.showMoreOptionsButton = shouldShowButton.showCopyButton || shouldShowButton.showSQLButton || shouldShowButton.showCreateNotificationIcon || shouldShowButton.showSaveAsCSVButton || shouldShowButton.showSaveAsPNGButton || shouldShowButton.showShareToSlackButton || shouldShowButton.showShareToTeamsButton; // If there is nothing to put in the toolbar, don't render it
 
       if (!Object.values(shouldShowButton).find(function (showButton) {
@@ -19130,12 +19143,13 @@ var DataMessenger = /*#__PURE__*/function (_React$Component) {
           hasError: true
         });
       } // WIP
-      // fetchConditions({ ...getAuthentication(this.props.authentication) }).then(
-      //   (response) => {
-      //     this.setState({ conditions: _get(response, 'data.data.data') })
-      //   }
-      // )
 
+
+      fetchConditions(_objectSpread2({}, getAuthentication(_this.props.authentication))).then(function (response) {
+        _this.setState({
+          conditions: _get(response, 'data.data.data')
+        });
+      });
     });
 
     _defineProperty(_assertThisInitialized(_this), "componentDidUpdate", function (prevProps, prevState) {
@@ -19732,32 +19746,35 @@ var DataMessenger = /*#__PURE__*/function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "renderOptionsDropdown", function () {
       if (_this.state.activePage === 'data-messenger') {
-        return /*#__PURE__*/React.createElement(Popover, {
+        return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+          id: "condition-dropdown",
+          style: {
+            justifyContent: 'left',
+            position: 'absolute',
+            right: 30
+          }
+        }, window.location.href.includes('localhost') || window.location.href.includes('chata-ai-test-page') ? /*#__PURE__*/React.createElement("button", {
+          id: "condition-dropdown",
+          onClick: function onClick() {
+            _this.setState({
+              isConditionLockingMenuOpen: !_this.state.isConditionLockingMenuOpen
+            });
+          },
+          className: "react-autoql-drawer-header-btn clear-all",
+          "data-tip": lang.dataMessengerOptions,
+          "data-for": "react-autoql-header-tooltip"
+        }, /*#__PURE__*/React.createElement(Icon, {
+          type: _get(_this.state.conditions, 'length') > 0 ? "lock" : "unlock"
+        })) : /*#__PURE__*/React.createElement("span", null)), /*#__PURE__*/React.createElement(Popover, {
           isOpen: _this.state.isOptionsDropdownOpen,
           onClickOutside: function onClickOutside() {
-            return _this.setState({
+            _this.setState({
               isOptionsDropdownOpen: false
             });
           },
           position: "bottom" // preferred position
           ,
-          content: /*#__PURE__*/React.createElement("div", null, window.location.href.includes('chata-ai-test-page') && /*#__PURE__*/React.createElement("div", {
-            className: "clear-messages-confirm-popover"
-          }, /*#__PURE__*/React.createElement("div", {
-            className: "react-autoql-menu-text",
-            onClick: function onClick() {
-              _this.setState({
-                isConditionLockingMenuOpen: true,
-                isOptionsDropdownOpen: false
-              });
-            }
-          }, /*#__PURE__*/React.createElement(Icon, {
-            type: "lock"
-          }), /*#__PURE__*/React.createElement("span", {
-            style: {
-              marginLeft: 5
-            }
-          }, lang.openConditionLocking))), /*#__PURE__*/React.createElement("div", {
+          content: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
             className: "clear-messages-confirm-popover"
           }, /*#__PURE__*/React.createElement("div", {
             className: "react-autoql-menu-text",
@@ -19799,7 +19816,7 @@ var DataMessenger = /*#__PURE__*/function (_React$Component) {
           "data-for": "react-autoql-header-tooltip"
         }, /*#__PURE__*/React.createElement(Icon, {
           type: "trash"
-        })));
+        }))));
       }
     });
 
@@ -19836,11 +19853,11 @@ var DataMessenger = /*#__PURE__*/function (_React$Component) {
         className: "react-autoql-header-left-container"
       }, /*#__PURE__*/React.createElement("button", {
         onClick: function onClick() {
-          _this.props.onHandleClick();
-
           _this.setState({
             isConditionLockingMenuOpen: false
           });
+
+          _this.props.onHandleClick();
         },
         className: "react-autoql-drawer-header-btn close",
         "data-tip": lang.closeDataMessenger,
@@ -19850,17 +19867,15 @@ var DataMessenger = /*#__PURE__*/function (_React$Component) {
       }))), /*#__PURE__*/React.createElement(Popover, {
         containerStyle: _this.getConditionMenuPosition(),
         isOpen: _this.state.isConditionLockingMenuOpen,
-        onClickOutside: function onClickOutside(e) {
-          if (_get(e, 'target.innerText') !== lang.openConditionLocking && !_includes(_get(e, 'target.className'), 'react-autosuggest__suggestion') && !_includes(_get(e, 'target.className'), 'condition-list-container')) {
-            _this.setState({
-              isConditionLockingMenuOpen: false
-            });
-          }
-        },
         position: "bottom",
         padding: 2,
         align: "center",
-        content: /*#__PURE__*/React.createElement(ConditionLockMenu, {
+        content: /*#__PURE__*/React.createElement("div", {
+          id: "condition-menu-dropdown",
+          style: {
+            display: 'block'
+          }
+        }, /*#__PURE__*/React.createElement(ConditionLockMenu, {
           authentication: getAuthentication(getAuthentication(_this.props.authentication)),
           containerWidth: _this.getDrawerWidth(),
           isOpen: _this.state.isConditionLockingMenuOpen,
@@ -19877,7 +19892,7 @@ var DataMessenger = /*#__PURE__*/function (_React$Component) {
               isConditionLockingMenuOpen: false
             });
           }
-        })
+        }))
       }, /*#__PURE__*/React.createElement("div", {
         className: "react-autoql-header-center-container"
       }, _this.renderHeaderTitle(), _this.renderShowSuccessMessage())), /*#__PURE__*/React.createElement("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-autoql",
-  "version": "3.4.5",
+  "version": "3.4.9",
   "description": "React Widget Library",
   "main": "dist/autoql.cjs.js",
   "module": "dist/autoql.esm.js",