@atlaskit/link-datasource 2.5.10 → 2.5.12

package/dist/cjs/ui/jira-issues-modal/modal/ModalOld.js

@@ -0,0 +1,492 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PlainJiraIssuesConfigModalOld = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = require("react");
+var _react2 = require("@emotion/react");
+var _reactIntlNext = require("react-intl-next");
+var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
+var _intlMessagesProvider = require("@atlaskit/intl-messages-provider");
+var _modalDialog = require("@atlaskit/modal-dialog");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _analytics = require("../../../analytics");
+var _types = require("../../../analytics/types");
+var _ufoExperiences = require("../../../analytics/ufoExperiences");
+var _useColumnPickerRenderedFailedUfoExperience = require("../../../analytics/ufoExperiences/hooks/useColumnPickerRenderedFailedUfoExperience");
+var _useDataRenderedUfoExperience = require("../../../analytics/ufoExperiences/hooks/useDataRenderedUfoExperience");
+var _utils = require("../../../analytics/utils");
+var _adf = require("../../../common/utils/adf");
+var _fetchMessagesForLocale = require("../../../common/utils/locale/fetch-messages-for-locale");
+var _datasourceExperienceId = require("../../../contexts/datasource-experience-id");
+var _userInteractions = require("../../../contexts/user-interactions");
+var _useDatasourceTableState = require("../../../hooks/useDatasourceTableState");
+var _en = _interopRequireDefault(require("../../../i18n/en"));
+var _useAvailableSites2 = require("../../../services/useAvailableSites");
+var _accessRequired = require("../../common/error-state/access-required");
+var _messages = require("../../common/error-state/messages");
+var _modalLoadingError = require("../../common/error-state/modal-loading-error");
+var _noInstances = require("../../common/error-state/no-instances");
+var _noResults = require("../../common/error-state/no-results");
+var _initialStateView = require("../../common/initial-state-view");
+var _messages2 = require("../../common/initial-state-view/messages");
+var _cancelButton = require("../../common/modal/cancel-button");
+var _contentContainer = require("../../common/modal/content-container");
+var _countViewSmartLink = require("../../common/modal/count-view-smart-link");
+var _datasourceModal = require("../../common/modal/datasource-modal");
+var _useColumnResize2 = require("../../common/modal/datasources-table-in-modal-preview/use-column-resize");
+var _useColumnWrapping2 = require("../../common/modal/datasources-table-in-modal-preview/use-column-wrapping");
+var _displayViewDropDown = require("../../common/modal/display-view-dropdown/display-view-drop-down");
+var _searchCount = _interopRequireDefault(require("../../common/modal/search-count"));
+var _siteSelector = require("../../common/modal/site-selector");
+var _issueLikeTable = require("../../issue-like-table");
+var _utils2 = require("../../issue-like-table/utils");
+var _ui = require("../basic-filters/ui");
+var _isQueryTooComplex = require("../basic-filters/utils/isQueryTooComplex");
+var _jiraSearchContainer = require("../jira-search-container");
+var _jiraIssuesInitialStateSvg = require("./jira-issues-initial-state-svg");
+var _messages3 = require("./messages");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /* eslint-disable @atlaskit/platform/no-preconditioning */ /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+var getDisplayValue = function getDisplayValue(currentViewMode, itemCount) {
+  if (currentViewMode === 'table') {
+    return _types.DatasourceDisplay.DATASOURCE_TABLE;
+  }
+  return itemCount === 1 ? _types.DatasourceDisplay.INLINE : _types.DatasourceDisplay.DATASOURCE_INLINE;
+};
+var jqlSupportDocumentLink = 'https://support.atlassian.com/jira-service-management-cloud/docs/use-advanced-search-with-jira-query-language-jql/';
+var PlainJiraIssuesConfigModalOld = exports.PlainJiraIssuesConfigModalOld = function PlainJiraIssuesConfigModalOld(props) {
+  var datasourceId = props.datasourceId,
+    initialColumnCustomSizes = props.columnCustomSizes,
+    initialWrappedColumnKeys = props.wrappedColumnKeys,
+    onCancel = props.onCancel,
+    onInsert = props.onInsert,
+    _props$viewMode = props.viewMode,
+    viewMode = _props$viewMode === void 0 ? 'table' : _props$viewMode,
+    initialParameters = props.parameters,
+    urlBeingEdited = props.url,
+    initialVisibleColumnKeys = props.visibleColumnKeys;
+  var _useState = (0, _react.useState)(viewMode),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    currentViewMode = _useState2[0],
+    setCurrentViewMode = _useState2[1];
+  var _useState3 = (0, _react.useState)(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.cloudId),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    cloudId = _useState4[0],
+    setCloudId = _useState4[1];
+  var _useAvailableSites = (0, _useAvailableSites2.useAvailableSites)('jira', cloudId),
+    availableSites = _useAvailableSites.availableSites,
+    selectedJiraSite = _useAvailableSites.selectedSite;
+  var _useState5 = (0, _react.useState)(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.jql),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    jql = _useState6[0],
+    setJql = _useState6[1];
+  var _useState7 = (0, _react.useState)(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.jql),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    searchBarJql = _useState8[0],
+    setSearchBarJql = _useState8[1];
+  var _useState9 = (0, _react.useState)(initialVisibleColumnKeys),
+    _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+    visibleColumnKeys = _useState10[0],
+    setVisibleColumnKeys = _useState10[1];
+
+  // analytics related parameters
+  var searchCount = (0, _react.useRef)(0);
+  var userInteractions = (0, _userInteractions.useUserInteractions)();
+  var initialSearchMethod = (0, _platformFeatureFlags.fg)('platform.linking-platform.datasource.show-jlol-basic-filters') && !(0, _isQueryTooComplex.isQueryTooComplex)((initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.jql) || '') ? 'basic' : 'jql';
+  var _useState11 = (0, _react.useState)(initialSearchMethod),
+    _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+    currentSearchMethod = _useState12[0],
+    setCurrentSearchMethod = _useState12[1];
+  var searchMethodSearchedWith = (0, _react.useRef)(null);
+  var visibleColumnCount = (0, _react.useRef)((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
+  var basicFilterSelectionsSearchedWith = (0, _react.useRef)({});
+  var isSearchedWithComplexQuery = (0, _react.useRef)(false);
+  var parameters = (0, _react.useMemo)(function () {
+    return !!cloudId ? {
+      cloudId: cloudId,
+      jql: jql || ''
+    } : undefined;
+  }, [cloudId, jql]);
+  var isParametersSet = !!(jql && cloudId);
+  var _useColumnResize = (0, _useColumnResize2.useColumnResize)(initialColumnCustomSizes),
+    columnCustomSizes = _useColumnResize.columnCustomSizes,
+    onColumnResize = _useColumnResize.onColumnResize;
+  var _useColumnWrapping = (0, _useColumnWrapping2.useColumnWrapping)(initialWrappedColumnKeys),
+    wrappedColumnKeys = _useColumnWrapping.wrappedColumnKeys,
+    onWrappedColumnChange = _useColumnWrapping.onWrappedColumnChange;
+  var _useDatasourceTableSt = (0, _useDatasourceTableState.useDatasourceTableState)({
+      datasourceId: datasourceId,
+      parameters: isParametersSet ? parameters : undefined,
+      fieldKeys: visibleColumnKeys
+    }),
+    reset = _useDatasourceTableSt.reset,
+    status = _useDatasourceTableSt.status,
+    onNextPage = _useDatasourceTableSt.onNextPage,
+    responseItems = _useDatasourceTableSt.responseItems,
+    hasNextPage = _useDatasourceTableSt.hasNextPage,
+    columns = _useDatasourceTableSt.columns,
+    defaultVisibleColumnKeys = _useDatasourceTableSt.defaultVisibleColumnKeys,
+    loadDatasourceDetails = _useDatasourceTableSt.loadDatasourceDetails,
+    totalCount = _useDatasourceTableSt.totalCount,
+    _useDatasourceTableSt2 = _useDatasourceTableSt.extensionKey,
+    extensionKey = _useDatasourceTableSt2 === void 0 ? null : _useDatasourceTableSt2,
+    destinationObjectTypes = _useDatasourceTableSt.destinationObjectTypes;
+  var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
+  var experienceId = (0, _datasourceExperienceId.useDatasourceExperienceId)();
+  var analyticsPayload = (0, _react.useMemo)(function () {
+    return {
+      extensionKey: extensionKey,
+      destinationObjectTypes: destinationObjectTypes
+    };
+  }, [destinationObjectTypes, extensionKey]);
+  var resolvedWithNoResults = status === 'resolved' && !responseItems.length;
+  var jqlUrl = selectedJiraSite && jql && "".concat(selectedJiraSite.url, "/issues/?jql=").concat(encodeURI(jql));
+  var isInsertDisabled = !isParametersSet || status === 'rejected' || status === 'unauthorized' || status === 'loading';
+  var shouldShowIssueCount = !!totalCount && totalCount !== 1 && currentViewMode === 'table';
+  var isDataReady = (visibleColumnKeys || []).length > 0;
+  var hasNoJiraSites = availableSites && availableSites.length === 0;
+  (0, _react.useEffect)(function () {
+    if (availableSites) {
+      fireEvent('ui.modal.ready.datasource', {
+        instancesCount: availableSites.length,
+        schemasCount: null
+      });
+    }
+  }, [fireEvent, availableSites]);
+  (0, _react.useEffect)(function () {
+    var shouldStartUfoExperience = status === 'loading';
+    if (shouldStartUfoExperience) {
+      (0, _ufoExperiences.startUfoExperience)({
+        name: 'datasource-rendered'
+      }, experienceId);
+    }
+  }, [experienceId, status]);
+  (0, _useDataRenderedUfoExperience.useDataRenderedUfoExperience)({
+    status: status,
+    experienceId: experienceId,
+    itemCount: responseItems.length,
+    canBeLink: currentViewMode === 'inline',
+    extensionKey: extensionKey
+  });
+  (0, _react.useEffect)(function () {
+    var newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
+    visibleColumnCount.current = newVisibleColumnKeys.length;
+    setVisibleColumnKeys(newVisibleColumnKeys);
+  }, [initialVisibleColumnKeys, defaultVisibleColumnKeys]);
+  (0, _react.useEffect)(function () {
+    if (selectedJiraSite && (!cloudId || cloudId !== selectedJiraSite.cloudId)) {
+      setCloudId(selectedJiraSite.cloudId);
+    }
+  }, [cloudId, selectedJiraSite]);
+  var fireSingleItemViewedEvent = (0, _react.useCallback)(function () {
+    fireEvent('ui.link.viewed.singleItem', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+      searchMethod: (0, _utils.mapSearchMethod)(searchMethodSearchedWith.current)
+    }));
+  }, [analyticsPayload, fireEvent]);
+  var fireCountViewedEvent = (0, _react.useCallback)(function () {
+    fireEvent('ui.link.viewed.count', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+      searchMethod: (0, _utils.mapSearchMethod)(searchMethodSearchedWith.current),
+      totalItemCount: totalCount || 0
+    }));
+  }, [analyticsPayload, fireEvent, totalCount]);
+  var fireTableViewedEvent = (0, _react.useCallback)(function () {
+    if (isDataReady) {
+      fireEvent('ui.table.viewed.datasourceConfigModal', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+        totalItemCount: totalCount || 0,
+        searchMethod: (0, _utils.mapSearchMethod)(searchMethodSearchedWith.current),
+        displayedColumnCount: visibleColumnCount.current
+      }));
+    }
+  }, [analyticsPayload, fireEvent, totalCount, isDataReady]);
+  var fireIssueViewAnalytics = (0, _react.useCallback)(function () {
+    if (!totalCount) {
+      return;
+    }
+    if (totalCount > 1) {
+      fireTableViewedEvent();
+    } else if (totalCount === 1) {
+      fireSingleItemViewedEvent();
+    }
+  }, [fireSingleItemViewedEvent, fireTableViewedEvent, totalCount]);
+  (0, _react.useEffect)(function () {
+    var isResolved = status === 'resolved';
+    var isIssueViewMode = currentViewMode === 'table';
+    var isCountViewMode = currentViewMode === 'inline';
+    if (!isResolved) {
+      return;
+    }
+    if (isIssueViewMode) {
+      fireIssueViewAnalytics();
+    } else if (isCountViewMode) {
+      fireCountViewedEvent();
+    }
+  }, [currentViewMode, status, fireIssueViewAnalytics, fireCountViewedEvent]);
+  (0, _useColumnPickerRenderedFailedUfoExperience.useColumnPickerRenderedFailedUfoExperience)(status, experienceId);
+  var onSearch = (0, _react.useCallback)(function (newParameters, _ref) {
+    var searchMethod = _ref.searchMethod,
+      basicFilterSelections = _ref.basicFilterSelections,
+      isQueryComplex = _ref.isQueryComplex;
+    searchCount.current++;
+    searchMethodSearchedWith.current = searchMethod;
+    basicFilterSelectionsSearchedWith.current = basicFilterSelections;
+    isSearchedWithComplexQuery.current = isQueryComplex;
+    if (jql !== newParameters.jql) {
+      userInteractions.add(_types.DatasourceAction.QUERY_UPDATED);
+    }
+    setJql(newParameters.jql);
+    reset({
+      shouldForceRequest: true
+    });
+  }, [jql, reset, userInteractions]);
+  var onSiteSelection = (0, _react.useCallback)(function (site) {
+    userInteractions.add(_types.DatasourceAction.INSTANCE_UPDATED);
+    setJql('');
+    setCloudId(site.cloudId);
+    reset({
+      shouldForceRequest: true
+    });
+  }, [reset, userInteractions]);
+  var retrieveUrlForSmartCardRender = (0, _react.useCallback)(function () {
+    var _data$key;
+    var _responseItems = (0, _slicedToArray2.default)(responseItems, 1),
+      data = _responseItems[0];
+    // agreement with BE that we will use `key` for rendering smartlink
+    return data === null || data === void 0 || (_data$key = data.key) === null || _data$key === void 0 || (_data$key = _data$key.data) === null || _data$key === void 0 ? void 0 : _data$key.url;
+  }, [responseItems]);
+  var onInsertPressed = (0, _react.useCallback)(function (e, analyticsEvent) {
+    var _insertButtonClickedE;
+    if (!isParametersSet || !jql || !selectedJiraSite) {
+      return;
+    }
+
+    // During insertion, we want the JQL of the datasource to be whatever is in the search bar,
+    // even if the user didn't previously click search
+    var upToDateJql = searchBarJql !== null && searchBarJql !== void 0 ? searchBarJql : jql;
+    var upToDateJqlUrl = selectedJiraSite && jql && "".concat(selectedJiraSite.url, "/issues/?jql=").concat(encodeURIComponent(upToDateJql));
+    var filterSelectionCount = _ui.availableBasicFilterTypes.reduce(function (current, filter) {
+      var _basicFilterSelection;
+      return _objectSpread(_objectSpread({}, current), {}, (0, _defineProperty2.default)({}, "".concat(filter, "BasicFilterSelectionCount"), ((_basicFilterSelection = basicFilterSelectionsSearchedWith.current[filter]) === null || _basicFilterSelection === void 0 ? void 0 : _basicFilterSelection.length) || 0));
+    }, {});
+    var insertButtonClickedEvent = analyticsEvent.update({
+      actionSubjectId: 'insert',
+      attributes: _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+        totalItemCount: totalCount || 0,
+        displayedColumnCount: visibleColumnCount.current,
+        display: getDisplayValue(currentViewMode, totalCount || 0),
+        searchCount: searchCount.current,
+        searchMethod: (0, _utils.mapSearchMethod)(searchMethodSearchedWith.current),
+        actions: userInteractions.get(),
+        isQueryComplex: isSearchedWithComplexQuery.current
+      }, searchMethodSearchedWith.current === 'basic' ? _objectSpread({}, filterSelectionCount) : {}),
+      eventType: 'ui'
+    });
+
+    // additional event for tracking in confluence against JIM
+    var macroInsertedEvent = analyticsEvent.clone();
+    macroInsertedEvent === null || macroInsertedEvent === void 0 || macroInsertedEvent.update({
+      eventType: 'track',
+      action: 'inserted',
+      actionSubject: 'macro',
+      actionSubjectId: 'jlol',
+      attributes: _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+        totalItemCount: totalCount || 0,
+        displayedColumnCount: visibleColumnCount.current,
+        display: getDisplayValue(currentViewMode, totalCount || 0),
+        searchCount: searchCount.current,
+        searchMethod: (0, _utils.mapSearchMethod)(searchMethodSearchedWith.current),
+        actions: userInteractions.get()
+      })
+    });
+    var consumerEvent = (_insertButtonClickedE = insertButtonClickedEvent.clone()) !== null && _insertButtonClickedE !== void 0 ? _insertButtonClickedE : undefined;
+    insertButtonClickedEvent.fire(_analytics.EVENT_CHANNEL);
+    var firstIssueUrl = retrieveUrlForSmartCardRender();
+    if (currentViewMode === 'inline') {
+      macroInsertedEvent === null || macroInsertedEvent === void 0 || macroInsertedEvent.fire(_analytics.EVENT_CHANNEL);
+      var url = responseItems.length === 1 ? firstIssueUrl : upToDateJqlUrl;
+      onInsert({
+        type: 'inlineCard',
+        attrs: {
+          url: url
+        }
+      }, consumerEvent);
+    } else {
+      onInsert((0, _adf.buildDatasourceAdf)({
+        id: datasourceId,
+        parameters: {
+          cloudId: cloudId,
+          jql: upToDateJql // TODO support non JQL type
+        },
+        views: [{
+          type: 'table',
+          properties: {
+            columns: (visibleColumnKeys || []).map(function (key) {
+              var width = columnCustomSizes === null || columnCustomSizes === void 0 ? void 0 : columnCustomSizes[key];
+              var isWrapped = wrappedColumnKeys === null || wrappedColumnKeys === void 0 ? void 0 : wrappedColumnKeys.includes(key);
+              return _objectSpread(_objectSpread({
+                key: key
+              }, width ? {
+                width: width
+              } : {}), isWrapped ? {
+                isWrapped: isWrapped
+              } : {});
+            })
+          }
+        }]
+      }, upToDateJqlUrl), consumerEvent);
+    }
+  }, [isParametersSet, jql, selectedJiraSite, searchBarJql, analyticsPayload, totalCount, currentViewMode, retrieveUrlForSmartCardRender, responseItems.length, onInsert, datasourceId, cloudId, visibleColumnKeys, columnCustomSizes, wrappedColumnKeys, userInteractions]);
+  var handleViewModeChange = function handleViewModeChange(selectedMode) {
+    userInteractions.add(_types.DatasourceAction.DISPLAY_VIEW_CHANGED);
+    setCurrentViewMode(selectedMode);
+  };
+  var handleOnNextPage = (0, _react.useCallback)(function () {
+    var onNextPageProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    userInteractions.add(_types.DatasourceAction.NEXT_PAGE_SCROLLED);
+    onNextPage(onNextPageProps);
+  }, [onNextPage, userInteractions]);
+  var handleVisibleColumnKeysChange = (0, _react.useCallback)(function () {
+    var newVisibleColumnKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+    var columnAction = (0, _utils2.getColumnAction)(visibleColumnKeys || [], newVisibleColumnKeys);
+    userInteractions.add(columnAction);
+    visibleColumnCount.current = newVisibleColumnKeys.length;
+    setVisibleColumnKeys(newVisibleColumnKeys);
+  }, [visibleColumnKeys, userInteractions]);
+  var issueLikeDataTableView = (0, _react.useMemo)(function () {
+    return (0, _react2.jsx)(_contentContainer.ContentContainer, {
+      withTableBorder: true
+    }, (0, _react2.jsx)(_issueLikeTable.IssueLikeDataTableView, {
+      testId: "jira-datasource-table",
+      status: status,
+      columns: columns,
+      items: responseItems,
+      hasNextPage: hasNextPage,
+      visibleColumnKeys: visibleColumnKeys || defaultVisibleColumnKeys,
+      onNextPage: handleOnNextPage,
+      onLoadDatasourceDetails: loadDatasourceDetails,
+      onVisibleColumnKeysChange: handleVisibleColumnKeysChange,
+      extensionKey: extensionKey,
+      columnCustomSizes: columnCustomSizes,
+      onColumnResize: onColumnResize,
+      wrappedColumnKeys: wrappedColumnKeys,
+      onWrappedColumnChange: (0, _platformFeatureFlags.fg)('platform.linking-platform.datasource-word_wrap') ? onWrappedColumnChange : undefined
+    }));
+  }, [status, columns, responseItems, hasNextPage, visibleColumnKeys, defaultVisibleColumnKeys, handleOnNextPage, loadDatasourceDetails, handleVisibleColumnKeysChange, extensionKey, columnCustomSizes, onColumnResize, wrappedColumnKeys, onWrappedColumnChange]);
+  var renderCountModeContent = (0, _react.useCallback)(function () {
+    var selectedJiraSiteUrl = selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.url;
+    if (status === 'unauthorized') {
+      return (0, _react2.jsx)(_accessRequired.AccessRequired, {
+        url: selectedJiraSiteUrl || urlBeingEdited
+      });
+    } else if (status === 'empty' || !jql || !selectedJiraSiteUrl) {
+      return (0, _react2.jsx)(_countViewSmartLink.SmartCardPlaceholder, {
+        placeholderText: _messages3.modalMessages.issuesCountSmartCardPlaceholderText
+      });
+    } else {
+      var url;
+      if (responseItems.length === 1 && retrieveUrlForSmartCardRender()) {
+        url = retrieveUrlForSmartCardRender();
+      } else {
+        url = "".concat(selectedJiraSiteUrl, "/issues/?jql=").concat(encodeURIComponent(jql));
+      }
+      return (0, _react2.jsx)(_countViewSmartLink.SmartLink, {
+        url: url
+      });
+    }
+  }, [jql, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.url, status, urlBeingEdited, responseItems, retrieveUrlForSmartCardRender]);
+  var renderIssuesModeContent = (0, _react.useCallback)(function () {
+    var selectedJiraSiteUrl = selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.url;
+    if (status === 'rejected' && jqlUrl) {
+      return (0, _react2.jsx)(_modalLoadingError.ModalLoadingError, {
+        errorMessage: jqlUrl ? (0, _react2.jsx)(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages3.modalMessages.checkConnectionWithSource, {
+          values: {
+            a: function a(urlText) {
+              return (0, _react2.jsx)("a", {
+                href: jqlUrl
+              }, urlText);
+            }
+          }
+        })) : undefined
+      });
+    } else if (status === 'unauthorized') {
+      return (0, _react2.jsx)(_accessRequired.AccessRequired, {
+        url: selectedJiraSiteUrl || urlBeingEdited
+      });
+    } else if (resolvedWithNoResults || status === 'forbidden') {
+      return (0, _react2.jsx)(_noResults.NoResults, null);
+    } else if (status === 'empty' || !columns.length) {
+      // persist the empty state when making the initial /data request which contains the columns
+      return (0, _react2.jsx)(_contentContainer.ContentContainer, {
+        withTableBorder: !!jql
+      }, !!jql ? (0, _react2.jsx)(_issueLikeTable.EmptyState, {
+        testId: "jira-datasource-modal--empty-state"
+      }) : (0, _react2.jsx)(_initialStateView.InitialStateView, {
+        showBeta: !(0, _platformFeatureFlags.fg)('platform.linking-platform.datasource.show-jlol-basic-filters'),
+        icon: (0, _react2.jsx)(_jiraIssuesInitialStateSvg.JiraInitialStateSVG, null),
+        title: _messages3.modalMessages.searchJiraTitle,
+        description: currentSearchMethod === 'jql' ? _messages2.initialStateViewMessages.searchDescriptionForJQLSearch : _messages2.initialStateViewMessages.searchDescriptionForBasicSearch,
+        learnMoreLink: currentSearchMethod === 'jql' ? {
+          href: jqlSupportDocumentLink,
+          text: _messages2.initialStateViewMessages.learnMoreLink
+        } : undefined
+      }));
+    }
+    return issueLikeDataTableView;
+  }, [columns.length, currentSearchMethod, issueLikeDataTableView, jql, jqlUrl, resolvedWithNoResults, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.url, status, urlBeingEdited]);
+  var siteSelectorLabel = availableSites && availableSites.length > 1 ? _messages3.modalMessages.insertIssuesTitleManySites : _messages3.modalMessages.insertIssuesTitle;
+  var getCancelButtonAnalyticsPayload = (0, _react.useCallback)(function () {
+    return _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+      searchCount: searchCount.current,
+      actions: userInteractions.get()
+    });
+  }, [analyticsPayload, userInteractions]);
+  return (0, _react2.jsx)(_intlMessagesProvider.IntlMessagesProvider, {
+    defaultMessages: _en.default,
+    loaderFn: _fetchMessagesForLocale.fetchMessagesForLocale
+  }, (0, _react2.jsx)(_modalDialog.ModalTransition, null, (0, _react2.jsx)(_datasourceModal.DatasourceModal, {
+    testId: "jira-datasource-modal",
+    onClose: onCancel
+  }, (0, _react2.jsx)(_modalDialog.ModalHeader, null, (0, _react2.jsx)(_modalDialog.ModalTitle, null, (0, _react2.jsx)(_siteSelector.SiteSelector, {
+    availableSites: availableSites,
+    onSiteSelection: onSiteSelection,
+    selectedSite: selectedJiraSite,
+    testId: "jira-datasource-modal--site-selector",
+    label: siteSelectorLabel
+  })), !hasNoJiraSites && (0, _react2.jsx)(_displayViewDropDown.DisplayViewDropDown, {
+    onViewModeChange: handleViewModeChange,
+    viewMode: currentViewMode
+  })), (0, _react2.jsx)(_modalDialog.ModalBody, null, !hasNoJiraSites ? (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_jiraSearchContainer.JiraSearchContainer, {
+    setSearchBarJql: setSearchBarJql,
+    searchBarJql: searchBarJql,
+    isSearching: status === 'loading',
+    parameters: parameters,
+    onSearch: onSearch,
+    initialSearchMethod: initialSearchMethod,
+    onSearchMethodChange: setCurrentSearchMethod,
+    site: selectedJiraSite
+  }), currentViewMode === 'inline' ? renderCountModeContent() : renderIssuesModeContent()) : (0, _react2.jsx)(_noInstances.NoInstancesView, {
+    title: _messages.loadingErrorMessages.noAccessToJiraSitesTitle,
+    description: _messages.loadingErrorMessages.noAccessToJiraSitesDescription,
+    testId: "no-jira-instances-content"
+  })), (0, _react2.jsx)(_modalDialog.ModalFooter, null, shouldShowIssueCount && (0, _react2.jsx)(_searchCount.default, {
+    searchCount: totalCount,
+    url: jqlUrl,
+    prefixTextType: "issue",
+    testId: "jira-datasource-modal-total-issues-count"
+  }), (0, _react2.jsx)(_cancelButton.CancelButton, {
+    onCancel: onCancel,
+    getAnalyticsPayload: getCancelButtonAnalyticsPayload,
+    testId: "jira-datasource-modal--cancel-button"
+  }), !hasNoJiraSites && (0, _react2.jsx)(_standardButton.default, {
+    appearance: "primary",
+    onClick: onInsertPressed,
+    isDisabled: isInsertDisabled,
+    testId: "jira-datasource-modal--insert-button"
+  }, (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages3.modalMessages.insertIssuesButtonText))))));
+};

package/dist/cjs/ui/jira-issues-modal/modal/index.js

@@ -41,20 +41,23 @@ var _cancelButton = require("../../common/modal/cancel-button");
 var _contentContainer = require("../../common/modal/content-container");
 var _countViewSmartLink = require("../../common/modal/count-view-smart-link");
 var _datasourceModal = require("../../common/modal/datasource-modal");
-var _displayViewDropDown = require("../../common/modal/display-view-dropdown/display-view-drop-down");
+var _useColumnResize2 = require("../../common/modal/datasources-table-in-modal-preview/use-column-resize");
+var _useColumnWrapping2 = require("../../common/modal/datasources-table-in-modal-preview/use-column-wrapping");
+var _modeSwitcher = require("../../common/modal/mode-switcher");
+var _useViewModeContext2 = require("../../common/modal/mode-switcher/useViewModeContext");
 var _searchCount = _interopRequireDefault(require("../../common/modal/search-count"));
 var _siteSelector = require("../../common/modal/site-selector");
 var _issueLikeTable = require("../../issue-like-table");
-var _useColumnResize2 = require("../../issue-like-table/use-column-resize");
-var _useColumnWrapping2 = require("../../issue-like-table/use-column-wrapping");
 var _utils2 = require("../../issue-like-table/utils");
 var _ui = require("../basic-filters/ui");
 var _isQueryTooComplex = require("../basic-filters/utils/isQueryTooComplex");
 var _jiraSearchContainer = require("../jira-search-container");
 var _jiraIssuesInitialStateSvg = require("./jira-issues-initial-state-svg");
 var _messages3 = require("./messages");
+var _ModalOld = require("./ModalOld");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /* eslint-disable @atlaskit/platform/no-preconditioning */ /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */ /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+var DEFAULT_VIEW_MODE = 'table';
 var getDisplayValue = function getDisplayValue(currentViewMode, itemCount) {
   if (currentViewMode === 'table') {
     return _types.DatasourceDisplay.DATASOURCE_TABLE;
@@ -68,43 +71,41 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
     initialWrappedColumnKeys = props.wrappedColumnKeys,
     onCancel = props.onCancel,
     onInsert = props.onInsert,
-    _props$viewMode = props.viewMode,
-    viewMode = _props$viewMode === void 0 ? 'table' : _props$viewMode,
     initialParameters = props.parameters,
     urlBeingEdited = props.url,
     initialVisibleColumnKeys = props.visibleColumnKeys;
-  var _useState = (0, _react.useState)(viewMode),
+  var _useViewModeContext = (0, _useViewModeContext2.useViewModeContext)(),
+    currentViewMode = _useViewModeContext.currentViewMode;
+  var _useState = (0, _react.useState)(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.cloudId),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    currentViewMode = _useState2[0],
-    setCurrentViewMode = _useState2[1];
-  var _useState3 = (0, _react.useState)(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.cloudId),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    cloudId = _useState4[0],
-    setCloudId = _useState4[1];
+    cloudId = _useState2[0],
+    setCloudId = _useState2[1];
   var _useAvailableSites = (0, _useAvailableSites2.useAvailableSites)('jira', cloudId),
     availableSites = _useAvailableSites.availableSites,
     selectedJiraSite = _useAvailableSites.selectedSite;
+  var _useState3 = (0, _react.useState)(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.jql),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    jql = _useState4[0],
+    setJql = _useState4[1];
   var _useState5 = (0, _react.useState)(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.jql),
     _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    jql = _useState6[0],
-    setJql = _useState6[1];
-  var _useState7 = (0, _react.useState)(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.jql),
+    searchBarJql = _useState6[0],
+    setSearchBarJql = _useState6[1];
+  var _useState7 = (0, _react.useState)(initialVisibleColumnKeys),
     _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-    searchBarJql = _useState8[0],
-    setSearchBarJql = _useState8[1];
-  var _useState9 = (0, _react.useState)(initialVisibleColumnKeys),
-    _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-    visibleColumnKeys = _useState10[0],
-    setVisibleColumnKeys = _useState10[1];
+    visibleColumnKeys = _useState8[0],
+    setVisibleColumnKeys = _useState8[1];
 
   // analytics related parameters
   var searchCount = (0, _react.useRef)(0);
   var userInteractions = (0, _userInteractions.useUserInteractions)();
-  var initialSearchMethod = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.datasource.show-jlol-basic-filters') && !(0, _isQueryTooComplex.isQueryTooComplex)((initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.jql) || '') ? 'basic' : 'jql';
-  var _useState11 = (0, _react.useState)(initialSearchMethod),
-    _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
-    currentSearchMethod = _useState12[0],
-    setCurrentSearchMethod = _useState12[1];
+  var initialSearchMethod =
+  // eslint-disable-next-line @atlaskit/platform/no-preconditioning
+  (0, _platformFeatureFlags.fg)('platform.linking-platform.datasource.show-jlol-basic-filters') && !(0, _isQueryTooComplex.isQueryTooComplex)((initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.jql) || '') ? 'basic' : 'jql';
+  var _useState9 = (0, _react.useState)(initialSearchMethod),
+    _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+    currentSearchMethod = _useState10[0],
+    setCurrentSearchMethod = _useState10[1];
   var searchMethodSearchedWith = (0, _react.useRef)(null);
   var visibleColumnCount = (0, _react.useRef)((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
   var basicFilterSelectionsSearchedWith = (0, _react.useRef)({});
@@ -344,10 +345,6 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
       }, upToDateJqlUrl), consumerEvent);
     }
   }, [isParametersSet, jql, selectedJiraSite, searchBarJql, analyticsPayload, totalCount, currentViewMode, retrieveUrlForSmartCardRender, responseItems.length, onInsert, datasourceId, cloudId, visibleColumnKeys, columnCustomSizes, wrappedColumnKeys, userInteractions]);
-  var handleViewModeChange = function handleViewModeChange(selectedMode) {
-    userInteractions.add(_types.DatasourceAction.DISPLAY_VIEW_CHANGED);
-    setCurrentViewMode(selectedMode);
-  };
   var handleOnNextPage = (0, _react.useCallback)(function () {
     var onNextPageProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     userInteractions.add(_types.DatasourceAction.NEXT_PAGE_SCROLLED);
@@ -377,7 +374,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
       columnCustomSizes: columnCustomSizes,
       onColumnResize: onColumnResize,
       wrappedColumnKeys: wrappedColumnKeys,
-      onWrappedColumnChange: (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.datasource-word_wrap') ? onWrappedColumnChange : undefined
+      onWrappedColumnChange: (0, _platformFeatureFlags.fg)('platform.linking-platform.datasource-word_wrap') ? onWrappedColumnChange : undefined
     }));
   }, [status, columns, responseItems, hasNextPage, visibleColumnKeys, defaultVisibleColumnKeys, handleOnNextPage, loadDatasourceDetails, handleVisibleColumnKeysChange, extensionKey, columnCustomSizes, onColumnResize, wrappedColumnKeys, onWrappedColumnChange]);
   var renderCountModeContent = (0, _react.useCallback)(function () {
@@ -429,7 +426,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
       }, !!jql ? (0, _react2.jsx)(_issueLikeTable.EmptyState, {
         testId: "jira-datasource-modal--empty-state"
       }) : (0, _react2.jsx)(_initialStateView.InitialStateView, {
-        showBeta: !(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.datasource.show-jlol-basic-filters'),
+        showBeta: !(0, _platformFeatureFlags.fg)('platform.linking-platform.datasource.show-jlol-basic-filters'),
         icon: (0, _react2.jsx)(_jiraIssuesInitialStateSvg.JiraInitialStateSVG, null),
         title: _messages3.modalMessages.searchJiraTitle,
         description: currentSearchMethod === 'jql' ? _messages2.initialStateViewMessages.searchDescriptionForJQLSearch : _messages2.initialStateViewMessages.searchDescriptionForBasicSearch,
@@ -460,10 +457,7 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
     selectedSite: selectedJiraSite,
     testId: "jira-datasource-modal--site-selector",
     label: siteSelectorLabel
-  })), !hasNoJiraSites && (0, _react2.jsx)(_displayViewDropDown.DisplayViewDropDown, {
-    onViewModeChange: handleViewModeChange,
-    viewMode: currentViewMode
-  })), (0, _react2.jsx)(_modalDialog.ModalBody, null, !hasNoJiraSites ? (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_jiraSearchContainer.JiraSearchContainer, {
+  })), !hasNoJiraSites && (0, _react2.jsx)(_modeSwitcher.DatasourceViewModeDropDown, null)), (0, _react2.jsx)(_modalDialog.ModalBody, null, !hasNoJiraSites ? (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_jiraSearchContainer.JiraSearchContainer, {
     setSearchBarJql: setSearchBarJql,
     searchBarJql: searchBarJql,
     isSearching: status === 'loading',
@@ -502,5 +496,8 @@ var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {
   attributes: _objectSpread({}, analyticsContextAttributes)
 });
 var JiraIssuesConfigModal = exports.JiraIssuesConfigModal = (0, _analyticsNext.withAnalyticsContext)(contextData)(function (props) {
-  return (0, _react2.jsx)(_datasourceExperienceId.DatasourceExperienceIdProvider, null, (0, _react2.jsx)(_userInteractions.UserInteractionsProvider, null, (0, _react2.jsx)(PlainJiraIssuesConfigModal, props)));
+  var _props$viewMode;
+  return (0, _react2.jsx)(_datasourceExperienceId.DatasourceExperienceIdProvider, null, (0, _react2.jsx)(_userInteractions.UserInteractionsProvider, null, (0, _platformFeatureFlags.fg)('platform-datasources-use-refactored-config-modal') ? (0, _react2.jsx)(_useViewModeContext2.DatasourceViewModeProvider, {
+    viewMode: (_props$viewMode = props.viewMode) !== null && _props$viewMode !== void 0 ? _props$viewMode : DEFAULT_VIEW_MODE
+  }, (0, _react2.jsx)(PlainJiraIssuesConfigModal, props)) : (0, _react2.jsx)(_ModalOld.PlainJiraIssuesConfigModalOld, props)));
 });

package/dist/es2019/i18n/cs.js

@@ -63,7 +63,6 @@ export default {
   'linkDataSource.confluence-search.configmodal.insertConfluenceTitleManySites': 'Vložit seznam Confluence z:',
   'linkDataSource.confluence-search.configmodal.insertResultsButtonText': 'Vložit výsledky',
   'linkDataSource.confluence-search.configmodal.placeholder.issues': '### Výsledky',
-  'linkDataSource.confluence-search.configmodal.resultsCountText': '{totalCount, plural, one {výsledek} few {výsledky} many {výsledku} other {výsledků}}',
   'linkDataSource.confluence-search.configmodal.searchLabel': 'Zadejte klíčová slova k vyhledání stránek, příloh a dalších položek.',
   'linkDataSource.confluence-search.no.confluence.sites.access.description': 'Chcete-li požádat o přístup, obraťte se na správce.',
   'linkDataSource.confluence-search.no.confluence.sites.access.title': 'Nemáte přístup k žádným webům Confluence',
@@ -80,7 +79,6 @@ export default {
   'linkDataSource.jira-issues.configmodal.insertIssuesButtonText': 'Vložit požadavky',
   'linkDataSource.jira-issues.configmodal.insertIssuesTitle': 'Vložit požadavky Jira',
   'linkDataSource.jira-issues.configmodal.insertIssuesTitleManySites': 'Vložit požadavky Jira z:',
-  'linkDataSource.jira-issues.configmodal.issue': '{totalCount, plural, one {požadavek} few {požadavky} many {požadavku} other {požadavků}}',
   'linkDataSource.jira-issues.configmodal.viewModeInlineLinkDescription': 'Zobrazit počet výsledků vyhledávání jako vložený chytrý odkaz',
   'linkDataSource.jira-issues.configmodal.viewModeInlineLinkLabel': 'Vložený odkaz',
   'linkDataSource.jira-issues.configmodal.viewModeListDescription': 'Zobrazit výsledky vyhledávání jako seznam',