@atlaskit/link-datasource 1.7.4 → 1.7.5

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/link-datasource
 
+## 1.7.5
+
+### Patch Changes
+
+- [#40232](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/40232) [`b8c29cec088`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b8c29cec088) - [ux] Make JQL mode to be selected by default
+
 ## 1.7.4
 
 ### Patch Changes

package/dist/cjs/analytics/constants.js

@@ -7,5 +7,5 @@ exports.packageMetaData = exports.EVENT_CHANNEL = void 0;
 var EVENT_CHANNEL = exports.EVENT_CHANNEL = 'media';
 var packageMetaData = exports.packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.7.4"
+  packageVersion: "1.7.5"
 };

package/dist/cjs/ui/assets-modal/modal/index.js

@@ -234,7 +234,7 @@ var analyticsContextAttributes = {
 };
 var analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.7.4",
+  packageVersion: "1.7.5",
   source: 'datasourceConfigModal'
 };
 var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {

package/dist/cjs/ui/jira-issues-modal/basic-search-input/messages.js

@@ -9,6 +9,6 @@ var basicSearchInputMessages = exports.basicSearchInputMessages = (0, _reactIntl
   basicTextSearchLabel: {
     id: 'linkDataSource.jira-issues.configmodal.basicTextSearchPlaceholder',
     description: 'Placeholder text for the search input box',
-    defaultMessage: 'Search'
+    defaultMessage: 'Search for issues by keyword'
   }
 });

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

@@ -1,11 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InitialStateView = void 0;
 var _react = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
+var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
+var _colors = require("@atlaskit/theme/colors");
 var _initialStateSvg = require("./assets/initial-state-svg");
 var _messages = require("./messages");
 /** @jsx jsx */
@@ -19,19 +22,38 @@ var svgAndTextsWrapperStyles = (0, _react.css)({
   textAlign: 'center',
   alignSelf: 'center',
   paddingTop: "var(--ds-space-600, 48px)",
-  paddingBottom: "var(--ds-space-600, 48px)"
+  paddingBottom: "var(--ds-space-600, 48px)",
+  width: '260px'
+});
+var betaTagStyles = (0, _react.css)({
+  display: 'flex'
 });
 var searchTitleStyles = (0, _react.css)({
-  fontWeight: "var(--ds-font-weight-semibold, 600)",
-  fontSize: "var(--ds-font-size-200, 16px)",
+  color: "var(--ds-text-subtlest, ".concat(_colors.N300, ")"),
+  fontWeight: "var(--ds-font-weight-medium, 500)",
+  fontSize: "var(--ds-font-size-300, 20px)",
   lineHeight: "var(--ds-font-lineHeight-300, 24px)",
   paddingTop: "var(--ds-space-200, 16px)",
-  paddingBottom: "var(--ds-space-100, 8px)"
+  paddingBottom: "var(--ds-space-100, 8px)",
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  gap: "var(--ds-space-100, 8px)"
+});
+var mainTextStyles = (0, _react.css)({
+  color: "var(--ds-text-subtlest, ".concat(_colors.N300, ")")
 });
+var learnMoreLinkStyles = (0, _react.css)({
+  paddingTop: "var(--ds-space-200, 16px)",
+  display: 'inline-block'
+});
+var methodToDescriptionMessage = {
+  basic: _messages.initialStateViewMessages.searchDescriptionForBasicSearch,
+  jql: _messages.initialStateViewMessages.searchDescriptionForJQLSearch
+};
 var jqlSupportDocumentLink = 'https://support.atlassian.com/jira-service-management-cloud/docs/use-advanced-search-with-jira-query-language-jql/';
-var InitialStateView = exports.InitialStateView = function InitialStateView() {
-  var _useIntl = (0, _reactIntlNext.useIntl)(),
-    formatMessage = _useIntl.formatMessage;
+var InitialStateView = exports.InitialStateView = function InitialStateView(_ref) {
+  var searchMethod = _ref.searchMethod;
   return (0, _react.jsx)("div", {
     css: initialStateViewContainerStyles,
     "data-testid": "jlol-datasource-modal--initial-state-view"
@@ -39,8 +61,15 @@ var InitialStateView = exports.InitialStateView = function InitialStateView() {
     css: svgAndTextsWrapperStyles
   }, (0, _react.jsx)(_initialStateSvg.InitialStateSVG, null), (0, _react.jsx)("div", {
     css: searchTitleStyles
-  }, formatMessage(_messages.initialStateViewMessages.searchTitle)), (0, _react.jsx)("div", null, formatMessage(_messages.initialStateViewMessages.searchDescription)), (0, _react.jsx)("a", {
+  }, (0, _react.jsx)("div", {
+    css: betaTagStyles
+  }, (0, _react.jsx)(_lozenge.default, {
+    appearance: "new"
+  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.initialStateViewMessages.beta))), (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.initialStateViewMessages.searchTitle)), (0, _react.jsx)("div", {
+    css: mainTextStyles
+  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, methodToDescriptionMessage[searchMethod])), searchMethod === 'jql' ? (0, _react.jsx)("a", {
     href: jqlSupportDocumentLink,
-    target: "_blank"
-  }, formatMessage(_messages.initialStateViewMessages.learnMoreLink))));
+    target: "_blank",
+    css: learnMoreLinkStyles
+  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.initialStateViewMessages.learnMoreLink)) : null));
 };

package/dist/cjs/ui/jira-issues-modal/initial-state-view/messages.js

@@ -11,14 +11,24 @@ var initialStateViewMessages = exports.initialStateViewMessages = (0, _reactIntl
     description: 'The initial modal search state title that gives the user some idea about how to get information',
     defaultMessage: 'Search for Jira issues'
   },
-  searchDescription: {
+  beta: {
+    id: 'linkDataSource.modal-initial-state.beta',
+    description: 'Beta lozenge',
+    defaultMessage: 'Beta'
+  },
+  searchDescriptionForBasicSearch: {
+    id: 'linkDataSource.modal-initial-state.searchDescription',
+    description: 'The initial modal search state helper message displayed under the search title when basic search mode is selected',
+    defaultMessage: 'Search by keyword for issues to insert.'
+  },
+  searchDescriptionForJQLSearch: {
     id: 'linkDataSource.modal-initial-state.searchDescription',
-    description: 'The initial modal search state helper message displayed under the search title',
-    defaultMessage: 'Start typing or use JQL to search.'
+    description: 'The initial modal search state helper message displayed under the search title when JQL search mode is selected',
+    defaultMessage: 'Use JQL (Jira Query Language) to search for issues.'
   },
   learnMoreLink: {
     id: 'linkDataSource.modal-initial-state.learnMoreLink',
     description: 'The link that displays under the search description to help people know more about JQL',
-    defaultMessage: 'Learn more about searching with JQL'
+    defaultMessage: 'Learn how to search with JQL'
   }
 });

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

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getInitialSearchMethod = exports.JiraSearchContainer = void 0;
+exports.JiraSearchContainer = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
@@ -30,13 +30,12 @@ var inputContainerStyles = (0, _react2.css)({
 });
 var DEFAULT_JQL_QUERY = 'created >= -30d order by created DESC';
 var JiraSearchMethodSwitcher = _modeSwitcher.ModeSwitcher;
-var getInitialSearchMethod = exports.getInitialSearchMethod = function getInitialSearchMethod(initialJql) {
-  return initialJql ? 'jql' : 'basic';
-};
 var JiraSearchContainer = exports.JiraSearchContainer = function JiraSearchContainer(props) {
   var isSearching = props.isSearching,
     parameters = props.parameters,
-    onSearch = props.onSearch;
+    onSearch = props.onSearch,
+    onSearchMethodChangeCallback = props.onSearchMethodChange,
+    initialSearchMethod = props.initialSearchMethod;
   var _ref = parameters || {},
     cloudId = _ref.cloudId,
     initialJql = _ref.jql;
@@ -46,7 +45,7 @@ var JiraSearchContainer = exports.JiraSearchContainer = function JiraSearchConta
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     basicSearchTerm = _useState2[0],
     setBasicSearchTerm = _useState2[1];
-  var _useState3 = (0, _react.useState)(getInitialSearchMethod(initialJql)),
+  var _useState3 = (0, _react.useState)(initialSearchMethod),
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
     currentSearchMethod = _useState4[0],
     setCurrentSearchMethod = _useState4[1];
@@ -64,10 +63,11 @@ var JiraSearchContainer = exports.JiraSearchContainer = function JiraSearchConta
     setOrderDirection = _useState10[1];
   var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
-  var onSearchModeChange = function onSearchModeChange(searchMode) {
-    setCurrentSearchMethod(searchMode);
-  };
-  var handleBasicSearchChange = function handleBasicSearchChange(e) {
+  var onSearchMethodChange = (0, _react.useCallback)(function (searchMethod) {
+    onSearchMethodChangeCallback(searchMethod);
+    setCurrentSearchMethod(searchMethod);
+  }, [onSearchMethodChangeCallback]);
+  var handleBasicSearchChange = (0, _react.useCallback)(function (e) {
     var rawSearch = e.currentTarget.value;
     setBasicSearchTerm(rawSearch);
     setJql((0, _buildJQL.buildJQL)({
@@ -75,8 +75,8 @@ var JiraSearchContainer = exports.JiraSearchContainer = function JiraSearchConta
       orderDirection: orderDirection,
       orderKey: orderKey
     }));
-  };
-  var onQueryChange = function onQueryChange(query) {
+  }, [orderDirection, orderKey]);
+  var onQueryChange = (0, _react.useCallback)(function (query) {
     var _query$split$map$filt, _fragments$at, _fragments$at2, _fragments$at3;
     // determine if order keys have been set so they can be saved and persisted when changes occur in basic search
     var fragments = (_query$split$map$filt = query === null || query === void 0 ? void 0 : query.split(/(^| )(order by)( |$)/i).map(function (item) {
@@ -92,8 +92,8 @@ var JiraSearchContainer = exports.JiraSearchContainer = function JiraSearchConta
       setOrderDirection(order);
     }
     setJql(query);
-  };
-  var handleSearch = function handleSearch() {
+  }, []);
+  var handleSearch = (0, _react.useCallback)(function () {
     onSearch({
       jql: jql
     }, currentSearchMethod);
@@ -102,7 +102,7 @@ var JiraSearchContainer = exports.JiraSearchContainer = function JiraSearchConta
     } else if (currentSearchMethod === 'jql') {
       fireEvent('ui.jqlEditor.searched', {});
     }
-  };
+  }, [currentSearchMethod, fireEvent, jql, onSearch]);
   var showBasicFilters = (0, _react.useMemo)(function () {
     if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.datasource.show-jlol-basic-filters')) {
       return true;
@@ -123,14 +123,14 @@ var JiraSearchContainer = exports.JiraSearchContainer = function JiraSearchConta
     onSearch: handleSearch,
     query: jql
   }), (0, _react2.jsx)(JiraSearchMethodSwitcher, {
-    onOptionValueChange: onSearchModeChange,
+    onOptionValueChange: onSearchMethodChange,
     selectedOptionValue: currentSearchMethod,
     options: [{
-      label: formatMessage(_messages.modeSwitcherMessages.basicTextSearchLabel),
-      value: 'basic'
-    }, {
       label: 'JQL',
       value: 'jql'
+    }, {
+      label: formatMessage(_messages.modeSwitcherMessages.basicTextSearchLabel),
+      value: 'basic'
     }]
   }));
 };

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

@@ -122,7 +122,12 @@ var PlainJiraIssuesConfigModal = exports.PlainJiraIssuesConfigModal = function P
   // analytics related parameters
   var searchCount = (0, _react.useRef)(0);
   var userInteractionActions = (0, _react.useRef)(new Set());
-  var lastSearchMethodRef = (0, _react.useRef)(null);
+  var initialSearchMethod = 'jql'; // TODO EDM-7688 This where we can add feature that decides if it's basic or jql based on JQL content (Regexp)
+  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 parameters = (0, _react.useMemo)(function () {
     return !!cloudId ? {
@@ -239,12 +244,12 @@ var PlainJiraIssuesConfigModal = exports.PlainJiraIssuesConfigModal = function P
   }, [cloudId, selectedJiraSite]);
   var fireSingleItemViewedEvent = (0, _react.useCallback)(function () {
     fireEvent('ui.link.viewed.singleItem', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
-      searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current)
+      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)(lastSearchMethodRef.current),
+      searchMethod: (0, _utils.mapSearchMethod)(searchMethodSearchedWith.current),
       totalItemCount: totalCount || 0
     }));
   }, [analyticsPayload, fireEvent, totalCount]);
@@ -252,7 +257,7 @@ var PlainJiraIssuesConfigModal = exports.PlainJiraIssuesConfigModal = function P
     if (isDataReady) {
       fireEvent('ui.table.viewed.datasourceConfigModal', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
         totalItemCount: totalCount || 0,
-        searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current),
+        searchMethod: (0, _utils.mapSearchMethod)(searchMethodSearchedWith.current),
         displayedColumnCount: visibleColumnCount.current
       }));
     }
@@ -283,7 +288,7 @@ var PlainJiraIssuesConfigModal = exports.PlainJiraIssuesConfigModal = function P
   (0, _useColumnPickerRenderedFailedUfoExperience.useColumnPickerRenderedFailedUfoExperience)(status, modalRenderInstanceId);
   var onSearch = (0, _react.useCallback)(function (newParameters, searchMethod) {
     searchCount.current++;
-    lastSearchMethodRef.current = searchMethod;
+    searchMethodSearchedWith.current = searchMethod;
     if (jql !== newParameters.jql) {
       userInteractionActions.current.add(_types.DatasourceAction.QUERY_UPDATED);
     }
@@ -329,7 +334,7 @@ var PlainJiraIssuesConfigModal = exports.PlainJiraIssuesConfigModal = function P
         displayedColumnCount: visibleColumnCount.current,
         display: getDisplayValue(currentViewMode, totalCount || 0),
         searchCount: searchCount.current,
-        searchMethod: (0, _utils.mapSearchMethod)(lastSearchMethodRef.current),
+        searchMethod: (0, _utils.mapSearchMethod)(searchMethodSearchedWith.current),
         actions: Array.from(userInteractionActions.current)
       }),
       eventType: 'ui'
@@ -450,7 +455,9 @@ var PlainJiraIssuesConfigModal = exports.PlainJiraIssuesConfigModal = function P
       }, !!jql ? (0, _react2.jsx)(_issueLikeTable.EmptyState, {
         testId: "jira-jql-datasource-modal--empty-state",
         isLoading: true
-      }) : (0, _react2.jsx)(_initialStateView.InitialStateView, null));
+      }) : (0, _react2.jsx)(_initialStateView.InitialStateView, {
+        searchMethod: currentSearchMethod
+      }));
     }
     var firstIssueUrl = retrieveUrlForSmartCardRender();
     if (responseItems.length === 1 && firstIssueUrl) {
@@ -461,7 +468,7 @@ var PlainJiraIssuesConfigModal = exports.PlainJiraIssuesConfigModal = function P
       }));
     }
     return issueLikeDataTableView;
-  }, [status, jqlUrl, resolvedWithNoResults, columns.length, retrieveUrlForSmartCardRender, responseItems.length, issueLikeDataTableView, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.displayName, jql]);
+  }, [status, jqlUrl, resolvedWithNoResults, columns.length, retrieveUrlForSmartCardRender, responseItems.length, issueLikeDataTableView, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.displayName, jql, currentSearchMethod]);
   return (0, _react2.jsx)(_modalDialog.ModalTransition, null, (0, _react2.jsx)(_modalDialog.default, {
     testId: 'jira-jql-datasource-modal',
     onClose: onCancel,
@@ -492,7 +499,9 @@ var PlainJiraIssuesConfigModal = exports.PlainJiraIssuesConfigModal = function P
   })), (0, _react2.jsx)(_modalDialog.ModalBody, null, (0, _react2.jsx)(_jiraSearchContainer.JiraSearchContainer, {
     isSearching: status === 'loading',
     parameters: parameters,
-    onSearch: onSearch
+    onSearch: onSearch,
+    initialSearchMethod: initialSearchMethod,
+    onSearchMethodChange: setCurrentSearchMethod
   }), currentViewMode === 'count' ? renderCountModeContent() : renderIssuesModeContent()), (0, _react2.jsx)(_modalDialog.ModalFooter, null, shouldShowIssueCount && (0, _react2.jsx)("div", {
     "data-testid": "jira-jql-datasource-modal-total-issues-count",
     css: issueCountStyles

package/dist/es2019/analytics/constants.js

@@ -1,5 +1,5 @@
 export const EVENT_CHANNEL = 'media';
 export const packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.7.4"
+  packageVersion: "1.7.5"
 };

package/dist/es2019/ui/assets-modal/modal/index.js

@@ -194,7 +194,7 @@ const analyticsContextAttributes = {
 };
 const analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.7.4",
+  packageVersion: "1.7.5",
   source: 'datasourceConfigModal'
 };
 const contextData = {

package/dist/es2019/ui/jira-issues-modal/basic-search-input/messages.js

@@ -3,6 +3,6 @@ export const basicSearchInputMessages = defineMessages({
   basicTextSearchLabel: {
     id: 'linkDataSource.jira-issues.configmodal.basicTextSearchPlaceholder',
     description: 'Placeholder text for the search input box',
-    defaultMessage: 'Search'
+    defaultMessage: 'Search for issues by keyword'
   }
 });

package/dist/es2019/ui/jira-issues-modal/initial-state-view/index.js

@@ -1,7 +1,9 @@
 /** @jsx jsx */
 
 import { css, jsx } from '@emotion/react';
-import { useIntl } from 'react-intl-next';
+import { FormattedMessage } from 'react-intl-next';
+import Lozenge from '@atlaskit/lozenge';
+import { N300 } from '@atlaskit/theme/colors';
 import { InitialStateSVG } from './assets/initial-state-svg';
 import { initialStateViewMessages } from './messages';
 const initialStateViewContainerStyles = css({
@@ -13,29 +15,53 @@ const svgAndTextsWrapperStyles = css({
   textAlign: 'center',
   alignSelf: 'center',
   paddingTop: "var(--ds-space-600, 48px)",
-  paddingBottom: "var(--ds-space-600, 48px)"
+  paddingBottom: "var(--ds-space-600, 48px)",
+  width: '260px'
+});
+const betaTagStyles = css({
+  display: 'flex'
 });
 const searchTitleStyles = css({
-  fontWeight: "var(--ds-font-weight-semibold, 600)",
-  fontSize: "var(--ds-font-size-200, 16px)",
+  color: `var(--ds-text-subtlest, ${N300})`,
+  fontWeight: "var(--ds-font-weight-medium, 500)",
+  fontSize: "var(--ds-font-size-300, 20px)",
   lineHeight: "var(--ds-font-lineHeight-300, 24px)",
   paddingTop: "var(--ds-space-200, 16px)",
-  paddingBottom: "var(--ds-space-100, 8px)"
+  paddingBottom: "var(--ds-space-100, 8px)",
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  gap: "var(--ds-space-100, 8px)"
+});
+const mainTextStyles = css({
+  color: `var(--ds-text-subtlest, ${N300})`
+});
+const learnMoreLinkStyles = css({
+  paddingTop: "var(--ds-space-200, 16px)",
+  display: 'inline-block'
 });
+const methodToDescriptionMessage = {
+  basic: initialStateViewMessages.searchDescriptionForBasicSearch,
+  jql: initialStateViewMessages.searchDescriptionForJQLSearch
+};
 const jqlSupportDocumentLink = 'https://support.atlassian.com/jira-service-management-cloud/docs/use-advanced-search-with-jira-query-language-jql/';
-export const InitialStateView = () => {
-  const {
-    formatMessage
-  } = useIntl();
-  return jsx("div", {
-    css: initialStateViewContainerStyles,
-    "data-testid": "jlol-datasource-modal--initial-state-view"
-  }, jsx("div", {
-    css: svgAndTextsWrapperStyles
-  }, jsx(InitialStateSVG, null), jsx("div", {
-    css: searchTitleStyles
-  }, formatMessage(initialStateViewMessages.searchTitle)), jsx("div", null, formatMessage(initialStateViewMessages.searchDescription)), jsx("a", {
-    href: jqlSupportDocumentLink,
-    target: "_blank"
-  }, formatMessage(initialStateViewMessages.learnMoreLink))));
-};
+export const InitialStateView = ({
+  searchMethod
+}) => jsx("div", {
+  css: initialStateViewContainerStyles,
+  "data-testid": "jlol-datasource-modal--initial-state-view"
+}, jsx("div", {
+  css: svgAndTextsWrapperStyles
+}, jsx(InitialStateSVG, null), jsx("div", {
+  css: searchTitleStyles
+}, jsx("div", {
+  css: betaTagStyles
+}, jsx(Lozenge, {
+  appearance: "new"
+}, jsx(FormattedMessage, initialStateViewMessages.beta))), jsx(FormattedMessage, initialStateViewMessages.searchTitle)), jsx("div", {
+  css: mainTextStyles
+}, jsx(FormattedMessage, methodToDescriptionMessage[searchMethod])), searchMethod === 'jql' ? jsx("a", {
+  href: jqlSupportDocumentLink,
+  target: "_blank",
+  css: learnMoreLinkStyles
+}, jsx(FormattedMessage, initialStateViewMessages.learnMoreLink)) : null));

package/dist/es2019/ui/jira-issues-modal/initial-state-view/messages.js

@@ -5,14 +5,24 @@ export const initialStateViewMessages = defineMessages({
     description: 'The initial modal search state title that gives the user some idea about how to get information',
     defaultMessage: 'Search for Jira issues'
   },
-  searchDescription: {
+  beta: {
+    id: 'linkDataSource.modal-initial-state.beta',
+    description: 'Beta lozenge',
+    defaultMessage: 'Beta'
+  },
+  searchDescriptionForBasicSearch: {
+    id: 'linkDataSource.modal-initial-state.searchDescription',
+    description: 'The initial modal search state helper message displayed under the search title when basic search mode is selected',
+    defaultMessage: 'Search by keyword for issues to insert.'
+  },
+  searchDescriptionForJQLSearch: {
     id: 'linkDataSource.modal-initial-state.searchDescription',
-    description: 'The initial modal search state helper message displayed under the search title',
-    defaultMessage: 'Start typing or use JQL to search.'
+    description: 'The initial modal search state helper message displayed under the search title when JQL search mode is selected',
+    defaultMessage: 'Use JQL (Jira Query Language) to search for issues.'
   },
   learnMoreLink: {
     id: 'linkDataSource.modal-initial-state.learnMoreLink',
     description: 'The link that displays under the search description to help people know more about JQL',
-    defaultMessage: 'Learn more about searching with JQL'
+    defaultMessage: 'Learn how to search with JQL'
   }
 });

package/dist/es2019/ui/jira-issues-modal/jira-search-container/index.js

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import React, { useMemo, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { css, jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
@@ -18,14 +18,13 @@ const inputContainerStyles = css({
 });
 const DEFAULT_JQL_QUERY = 'created >= -30d order by created DESC';
 const JiraSearchMethodSwitcher = ModeSwitcher;
-export const getInitialSearchMethod = initialJql => {
-  return initialJql ? 'jql' : 'basic';
-};
 export const JiraSearchContainer = props => {
   const {
     isSearching,
     parameters,
-    onSearch
+    onSearch,
+    onSearchMethodChange: onSearchMethodChangeCallback,
+    initialSearchMethod
   } = props;
   const {
     cloudId,
@@ -35,17 +34,18 @@ export const JiraSearchContainer = props => {
     formatMessage
   } = useIntl();
   const [basicSearchTerm, setBasicSearchTerm] = useState('');
-  const [currentSearchMethod, setCurrentSearchMethod] = useState(getInitialSearchMethod(initialJql));
+  const [currentSearchMethod, setCurrentSearchMethod] = useState(initialSearchMethod);
   const [jql, setJql] = useState(initialJql || DEFAULT_JQL_QUERY);
   const [orderKey, setOrderKey] = useState();
   const [orderDirection, setOrderDirection] = useState();
   const {
     fireEvent
   } = useDatasourceAnalyticsEvents();
-  const onSearchModeChange = searchMode => {
-    setCurrentSearchMethod(searchMode);
-  };
-  const handleBasicSearchChange = e => {
+  const onSearchMethodChange = useCallback(searchMethod => {
+    onSearchMethodChangeCallback(searchMethod);
+    setCurrentSearchMethod(searchMethod);
+  }, [onSearchMethodChangeCallback]);
+  const handleBasicSearchChange = useCallback(e => {
     const rawSearch = e.currentTarget.value;
     setBasicSearchTerm(rawSearch);
     setJql(buildJQL({
@@ -53,8 +53,8 @@ export const JiraSearchContainer = props => {
       orderDirection,
       orderKey
     }));
-  };
-  const onQueryChange = query => {
+  }, [orderDirection, orderKey]);
+  const onQueryChange = useCallback(query => {
     var _query$split$map$filt, _fragments$at, _fragments$at2, _fragments$at3;
     // determine if order keys have been set so they can be saved and persisted when changes occur in basic search
     const fragments = (_query$split$map$filt = query === null || query === void 0 ? void 0 : query.split(/(^| )(order by)( |$)/i).map(item => item.trim()).filter(Boolean)) !== null && _query$split$map$filt !== void 0 ? _query$split$map$filt : [];
@@ -68,8 +68,8 @@ export const JiraSearchContainer = props => {
       setOrderDirection(order);
     }
     setJql(query);
-  };
-  const handleSearch = () => {
+  }, []);
+  const handleSearch = useCallback(() => {
     onSearch({
       jql
     }, currentSearchMethod);
@@ -78,7 +78,7 @@ export const JiraSearchContainer = props => {
     } else if (currentSearchMethod === 'jql') {
       fireEvent('ui.jqlEditor.searched', {});
     }
-  };
+  }, [currentSearchMethod, fireEvent, jql, onSearch]);
   const showBasicFilters = useMemo(() => {
     if (getBooleanFF('platform.linking-platform.datasource.show-jlol-basic-filters')) {
       return true;
@@ -99,14 +99,14 @@ export const JiraSearchContainer = props => {
     onSearch: handleSearch,
     query: jql
   }), jsx(JiraSearchMethodSwitcher, {
-    onOptionValueChange: onSearchModeChange,
+    onOptionValueChange: onSearchMethodChange,
     selectedOptionValue: currentSearchMethod,
     options: [{
-      label: formatMessage(modeSwitcherMessages.basicTextSearchLabel),
-      value: 'basic'
-    }, {
       label: 'JQL',
       value: 'jql'
+    }, {
+      label: formatMessage(modeSwitcherMessages.basicTextSearchLabel),
+      value: 'basic'
     }]
   }));
 };

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

@@ -92,7 +92,9 @@ export const PlainJiraIssuesConfigModal = props => {
   // analytics related parameters
   const searchCount = useRef(0);
   const userInteractionActions = useRef(new Set());
-  const lastSearchMethodRef = useRef(null);
+  const initialSearchMethod = 'jql'; // TODO EDM-7688 This where we can add feature that decides if it's basic or jql based on JQL content (Regexp)
+  const [currentSearchMethod, setCurrentSearchMethod] = useState(initialSearchMethod);
+  const searchMethodSearchedWith = useRef(null);
   const visibleColumnCount = useRef((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
   const parameters = useMemo(() => !!cloudId ? {
     cloudId,
@@ -188,13 +190,13 @@ export const PlainJiraIssuesConfigModal = props => {
   const fireSingleItemViewedEvent = useCallback(() => {
     fireEvent('ui.link.viewed.singleItem', {
       ...analyticsPayload,
-      searchMethod: mapSearchMethod(lastSearchMethodRef.current)
+      searchMethod: mapSearchMethod(searchMethodSearchedWith.current)
     });
   }, [analyticsPayload, fireEvent]);
   const fireCountViewedEvent = useCallback(() => {
     fireEvent('ui.link.viewed.count', {
       ...analyticsPayload,
-      searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+      searchMethod: mapSearchMethod(searchMethodSearchedWith.current),
       totalItemCount: totalCount || 0
     });
   }, [analyticsPayload, fireEvent, totalCount]);
@@ -203,7 +205,7 @@ export const PlainJiraIssuesConfigModal = props => {
       fireEvent('ui.table.viewed.datasourceConfigModal', {
         ...analyticsPayload,
         totalItemCount: totalCount || 0,
-        searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+        searchMethod: mapSearchMethod(searchMethodSearchedWith.current),
         displayedColumnCount: visibleColumnCount.current
       });
     }
@@ -234,7 +236,7 @@ export const PlainJiraIssuesConfigModal = props => {
   useColumnPickerRenderedFailedUfoExperience(status, modalRenderInstanceId);
   const onSearch = useCallback((newParameters, searchMethod) => {
     searchCount.current++;
-    lastSearchMethodRef.current = searchMethod;
+    searchMethodSearchedWith.current = searchMethod;
     if (jql !== newParameters.jql) {
       userInteractionActions.current.add(DatasourceAction.QUERY_UPDATED);
     }
@@ -281,7 +283,7 @@ export const PlainJiraIssuesConfigModal = props => {
         displayedColumnCount: visibleColumnCount.current,
         display: getDisplayValue(currentViewMode, totalCount || 0),
         searchCount: searchCount.current,
-        searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+        searchMethod: mapSearchMethod(searchMethodSearchedWith.current),
         actions: Array.from(userInteractionActions.current)
       },
       eventType: 'ui'
@@ -397,7 +399,9 @@ export const PlainJiraIssuesConfigModal = props => {
       }, !!jql ? jsx(EmptyState, {
         testId: `jira-jql-datasource-modal--empty-state`,
         isLoading: true
-      }) : jsx(InitialStateView, null));
+      }) : jsx(InitialStateView, {
+        searchMethod: currentSearchMethod
+      }));
     }
     const firstIssueUrl = retrieveUrlForSmartCardRender();
     if (responseItems.length === 1 && firstIssueUrl) {
@@ -408,7 +412,7 @@ export const PlainJiraIssuesConfigModal = props => {
       }));
     }
     return issueLikeDataTableView;
-  }, [status, jqlUrl, resolvedWithNoResults, columns.length, retrieveUrlForSmartCardRender, responseItems.length, issueLikeDataTableView, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.displayName, jql]);
+  }, [status, jqlUrl, resolvedWithNoResults, columns.length, retrieveUrlForSmartCardRender, responseItems.length, issueLikeDataTableView, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.displayName, jql, currentSearchMethod]);
   return jsx(ModalTransition, null, jsx(Modal, {
     testId: 'jira-jql-datasource-modal',
     onClose: onCancel,
@@ -439,7 +443,9 @@ export const PlainJiraIssuesConfigModal = props => {
   })), jsx(ModalBody, null, jsx(JiraSearchContainer, {
     isSearching: status === 'loading',
     parameters: parameters,
-    onSearch: onSearch
+    onSearch: onSearch,
+    initialSearchMethod: initialSearchMethod,
+    onSearchMethodChange: setCurrentSearchMethod
   }), currentViewMode === 'count' ? renderCountModeContent() : renderIssuesModeContent()), jsx(ModalFooter, null, shouldShowIssueCount && jsx("div", {
     "data-testid": "jira-jql-datasource-modal-total-issues-count",
     css: issueCountStyles

package/dist/esm/analytics/constants.js

@@ -1,5 +1,5 @@
 export var EVENT_CHANNEL = 'media';
 export var packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.7.4"
+  packageVersion: "1.7.5"
 };

package/dist/esm/ui/assets-modal/modal/index.js

@@ -225,7 +225,7 @@ var analyticsContextAttributes = {
 };
 var analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.7.4",
+  packageVersion: "1.7.5",
   source: 'datasourceConfigModal'
 };
 var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {

package/dist/esm/ui/jira-issues-modal/basic-search-input/messages.js

@@ -3,6 +3,6 @@ export var basicSearchInputMessages = defineMessages({
   basicTextSearchLabel: {
     id: 'linkDataSource.jira-issues.configmodal.basicTextSearchPlaceholder',
     description: 'Placeholder text for the search input box',
-    defaultMessage: 'Search'
+    defaultMessage: 'Search for issues by keyword'
   }
 });

package/dist/esm/ui/jira-issues-modal/initial-state-view/index.js

@@ -1,7 +1,9 @@
 /** @jsx jsx */
 
 import { css, jsx } from '@emotion/react';
-import { useIntl } from 'react-intl-next';
+import { FormattedMessage } from 'react-intl-next';
+import Lozenge from '@atlaskit/lozenge';
+import { N300 } from '@atlaskit/theme/colors';
 import { InitialStateSVG } from './assets/initial-state-svg';
 import { initialStateViewMessages } from './messages';
 var initialStateViewContainerStyles = css({
@@ -13,19 +15,38 @@ var svgAndTextsWrapperStyles = css({
   textAlign: 'center',
   alignSelf: 'center',
   paddingTop: "var(--ds-space-600, 48px)",
-  paddingBottom: "var(--ds-space-600, 48px)"
+  paddingBottom: "var(--ds-space-600, 48px)",
+  width: '260px'
+});
+var betaTagStyles = css({
+  display: 'flex'
 });
 var searchTitleStyles = css({
-  fontWeight: "var(--ds-font-weight-semibold, 600)",
-  fontSize: "var(--ds-font-size-200, 16px)",
+  color: "var(--ds-text-subtlest, ".concat(N300, ")"),
+  fontWeight: "var(--ds-font-weight-medium, 500)",
+  fontSize: "var(--ds-font-size-300, 20px)",
   lineHeight: "var(--ds-font-lineHeight-300, 24px)",
   paddingTop: "var(--ds-space-200, 16px)",
-  paddingBottom: "var(--ds-space-100, 8px)"
+  paddingBottom: "var(--ds-space-100, 8px)",
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  gap: "var(--ds-space-100, 8px)"
+});
+var mainTextStyles = css({
+  color: "var(--ds-text-subtlest, ".concat(N300, ")")
 });
+var learnMoreLinkStyles = css({
+  paddingTop: "var(--ds-space-200, 16px)",
+  display: 'inline-block'
+});
+var methodToDescriptionMessage = {
+  basic: initialStateViewMessages.searchDescriptionForBasicSearch,
+  jql: initialStateViewMessages.searchDescriptionForJQLSearch
+};
 var jqlSupportDocumentLink = 'https://support.atlassian.com/jira-service-management-cloud/docs/use-advanced-search-with-jira-query-language-jql/';
-export var InitialStateView = function InitialStateView() {
-  var _useIntl = useIntl(),
-    formatMessage = _useIntl.formatMessage;
+export var InitialStateView = function InitialStateView(_ref) {
+  var searchMethod = _ref.searchMethod;
   return jsx("div", {
     css: initialStateViewContainerStyles,
     "data-testid": "jlol-datasource-modal--initial-state-view"
@@ -33,8 +54,15 @@ export var InitialStateView = function InitialStateView() {
     css: svgAndTextsWrapperStyles
   }, jsx(InitialStateSVG, null), jsx("div", {
     css: searchTitleStyles
-  }, formatMessage(initialStateViewMessages.searchTitle)), jsx("div", null, formatMessage(initialStateViewMessages.searchDescription)), jsx("a", {
+  }, jsx("div", {
+    css: betaTagStyles
+  }, jsx(Lozenge, {
+    appearance: "new"
+  }, jsx(FormattedMessage, initialStateViewMessages.beta))), jsx(FormattedMessage, initialStateViewMessages.searchTitle)), jsx("div", {
+    css: mainTextStyles
+  }, jsx(FormattedMessage, methodToDescriptionMessage[searchMethod])), searchMethod === 'jql' ? jsx("a", {
     href: jqlSupportDocumentLink,
-    target: "_blank"
-  }, formatMessage(initialStateViewMessages.learnMoreLink))));
+    target: "_blank",
+    css: learnMoreLinkStyles
+  }, jsx(FormattedMessage, initialStateViewMessages.learnMoreLink)) : null));
 };

package/dist/esm/ui/jira-issues-modal/initial-state-view/messages.js

@@ -5,14 +5,24 @@ export var initialStateViewMessages = defineMessages({
     description: 'The initial modal search state title that gives the user some idea about how to get information',
     defaultMessage: 'Search for Jira issues'
   },
-  searchDescription: {
+  beta: {
+    id: 'linkDataSource.modal-initial-state.beta',
+    description: 'Beta lozenge',
+    defaultMessage: 'Beta'
+  },
+  searchDescriptionForBasicSearch: {
+    id: 'linkDataSource.modal-initial-state.searchDescription',
+    description: 'The initial modal search state helper message displayed under the search title when basic search mode is selected',
+    defaultMessage: 'Search by keyword for issues to insert.'
+  },
+  searchDescriptionForJQLSearch: {
     id: 'linkDataSource.modal-initial-state.searchDescription',
-    description: 'The initial modal search state helper message displayed under the search title',
-    defaultMessage: 'Start typing or use JQL to search.'
+    description: 'The initial modal search state helper message displayed under the search title when JQL search mode is selected',
+    defaultMessage: 'Use JQL (Jira Query Language) to search for issues.'
   },
   learnMoreLink: {
     id: 'linkDataSource.modal-initial-state.learnMoreLink',
     description: 'The link that displays under the search description to help people know more about JQL',
-    defaultMessage: 'Learn more about searching with JQL'
+    defaultMessage: 'Learn how to search with JQL'
   }
 });

package/dist/esm/ui/jira-issues-modal/jira-search-container/index.js

@@ -1,6 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /** @jsx jsx */
-import React, { useMemo, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { css, jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
@@ -19,13 +19,12 @@ var inputContainerStyles = css({
 });
 var DEFAULT_JQL_QUERY = 'created >= -30d order by created DESC';
 var JiraSearchMethodSwitcher = ModeSwitcher;
-export var getInitialSearchMethod = function getInitialSearchMethod(initialJql) {
-  return initialJql ? 'jql' : 'basic';
-};
 export var JiraSearchContainer = function JiraSearchContainer(props) {
   var isSearching = props.isSearching,
     parameters = props.parameters,
-    onSearch = props.onSearch;
+    onSearch = props.onSearch,
+    onSearchMethodChangeCallback = props.onSearchMethodChange,
+    initialSearchMethod = props.initialSearchMethod;
   var _ref = parameters || {},
     cloudId = _ref.cloudId,
     initialJql = _ref.jql;
@@ -35,7 +34,7 @@ export var JiraSearchContainer = function JiraSearchContainer(props) {
     _useState2 = _slicedToArray(_useState, 2),
     basicSearchTerm = _useState2[0],
     setBasicSearchTerm = _useState2[1];
-  var _useState3 = useState(getInitialSearchMethod(initialJql)),
+  var _useState3 = useState(initialSearchMethod),
     _useState4 = _slicedToArray(_useState3, 2),
     currentSearchMethod = _useState4[0],
     setCurrentSearchMethod = _useState4[1];
@@ -53,10 +52,11 @@ export var JiraSearchContainer = function JiraSearchContainer(props) {
     setOrderDirection = _useState10[1];
   var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
     fireEvent = _useDatasourceAnalyti.fireEvent;
-  var onSearchModeChange = function onSearchModeChange(searchMode) {
-    setCurrentSearchMethod(searchMode);
-  };
-  var handleBasicSearchChange = function handleBasicSearchChange(e) {
+  var onSearchMethodChange = useCallback(function (searchMethod) {
+    onSearchMethodChangeCallback(searchMethod);
+    setCurrentSearchMethod(searchMethod);
+  }, [onSearchMethodChangeCallback]);
+  var handleBasicSearchChange = useCallback(function (e) {
     var rawSearch = e.currentTarget.value;
     setBasicSearchTerm(rawSearch);
     setJql(buildJQL({
@@ -64,8 +64,8 @@ export var JiraSearchContainer = function JiraSearchContainer(props) {
       orderDirection: orderDirection,
       orderKey: orderKey
     }));
-  };
-  var onQueryChange = function onQueryChange(query) {
+  }, [orderDirection, orderKey]);
+  var onQueryChange = useCallback(function (query) {
     var _query$split$map$filt, _fragments$at, _fragments$at2, _fragments$at3;
     // determine if order keys have been set so they can be saved and persisted when changes occur in basic search
     var fragments = (_query$split$map$filt = query === null || query === void 0 ? void 0 : query.split(/(^| )(order by)( |$)/i).map(function (item) {
@@ -81,8 +81,8 @@ export var JiraSearchContainer = function JiraSearchContainer(props) {
       setOrderDirection(order);
     }
     setJql(query);
-  };
-  var handleSearch = function handleSearch() {
+  }, []);
+  var handleSearch = useCallback(function () {
     onSearch({
       jql: jql
     }, currentSearchMethod);
@@ -91,7 +91,7 @@ export var JiraSearchContainer = function JiraSearchContainer(props) {
     } else if (currentSearchMethod === 'jql') {
       fireEvent('ui.jqlEditor.searched', {});
     }
-  };
+  }, [currentSearchMethod, fireEvent, jql, onSearch]);
   var showBasicFilters = useMemo(function () {
     if (getBooleanFF('platform.linking-platform.datasource.show-jlol-basic-filters')) {
       return true;
@@ -112,14 +112,14 @@ export var JiraSearchContainer = function JiraSearchContainer(props) {
     onSearch: handleSearch,
     query: jql
   }), jsx(JiraSearchMethodSwitcher, {
-    onOptionValueChange: onSearchModeChange,
+    onOptionValueChange: onSearchMethodChange,
     selectedOptionValue: currentSearchMethod,
     options: [{
-      label: formatMessage(modeSwitcherMessages.basicTextSearchLabel),
-      value: 'basic'
-    }, {
       label: 'JQL',
       value: 'jql'
+    }, {
+      label: formatMessage(modeSwitcherMessages.basicTextSearchLabel),
+      value: 'basic'
     }]
   }));
 };

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

@@ -113,7 +113,12 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
   // analytics related parameters
   var searchCount = useRef(0);
   var userInteractionActions = useRef(new Set());
-  var lastSearchMethodRef = useRef(null);
+  var initialSearchMethod = 'jql'; // TODO EDM-7688 This where we can add feature that decides if it's basic or jql based on JQL content (Regexp)
+  var _useState11 = useState(initialSearchMethod),
+    _useState12 = _slicedToArray(_useState11, 2),
+    currentSearchMethod = _useState12[0],
+    setCurrentSearchMethod = _useState12[1];
+  var searchMethodSearchedWith = useRef(null);
   var visibleColumnCount = useRef((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
   var parameters = useMemo(function () {
     return !!cloudId ? {
@@ -230,12 +235,12 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
   }, [cloudId, selectedJiraSite]);
   var fireSingleItemViewedEvent = useCallback(function () {
     fireEvent('ui.link.viewed.singleItem', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
-      searchMethod: mapSearchMethod(lastSearchMethodRef.current)
+      searchMethod: mapSearchMethod(searchMethodSearchedWith.current)
     }));
   }, [analyticsPayload, fireEvent]);
   var fireCountViewedEvent = useCallback(function () {
     fireEvent('ui.link.viewed.count', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
-      searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+      searchMethod: mapSearchMethod(searchMethodSearchedWith.current),
       totalItemCount: totalCount || 0
     }));
   }, [analyticsPayload, fireEvent, totalCount]);
@@ -243,7 +248,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
     if (isDataReady) {
       fireEvent('ui.table.viewed.datasourceConfigModal', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
         totalItemCount: totalCount || 0,
-        searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+        searchMethod: mapSearchMethod(searchMethodSearchedWith.current),
         displayedColumnCount: visibleColumnCount.current
       }));
     }
@@ -274,7 +279,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
   useColumnPickerRenderedFailedUfoExperience(status, modalRenderInstanceId);
   var onSearch = useCallback(function (newParameters, searchMethod) {
     searchCount.current++;
-    lastSearchMethodRef.current = searchMethod;
+    searchMethodSearchedWith.current = searchMethod;
     if (jql !== newParameters.jql) {
       userInteractionActions.current.add(DatasourceAction.QUERY_UPDATED);
     }
@@ -320,7 +325,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
         displayedColumnCount: visibleColumnCount.current,
         display: getDisplayValue(currentViewMode, totalCount || 0),
         searchCount: searchCount.current,
-        searchMethod: mapSearchMethod(lastSearchMethodRef.current),
+        searchMethod: mapSearchMethod(searchMethodSearchedWith.current),
         actions: Array.from(userInteractionActions.current)
       }),
       eventType: 'ui'
@@ -441,7 +446,9 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
       }, !!jql ? jsx(EmptyState, {
         testId: "jira-jql-datasource-modal--empty-state",
         isLoading: true
-      }) : jsx(InitialStateView, null));
+      }) : jsx(InitialStateView, {
+        searchMethod: currentSearchMethod
+      }));
     }
     var firstIssueUrl = retrieveUrlForSmartCardRender();
     if (responseItems.length === 1 && firstIssueUrl) {
@@ -452,7 +459,7 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
       }));
     }
     return issueLikeDataTableView;
-  }, [status, jqlUrl, resolvedWithNoResults, columns.length, retrieveUrlForSmartCardRender, responseItems.length, issueLikeDataTableView, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.displayName, jql]);
+  }, [status, jqlUrl, resolvedWithNoResults, columns.length, retrieveUrlForSmartCardRender, responseItems.length, issueLikeDataTableView, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.displayName, jql, currentSearchMethod]);
   return jsx(ModalTransition, null, jsx(Modal, {
     testId: 'jira-jql-datasource-modal',
     onClose: onCancel,
@@ -483,7 +490,9 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
   })), jsx(ModalBody, null, jsx(JiraSearchContainer, {
     isSearching: status === 'loading',
     parameters: parameters,
-    onSearch: onSearch
+    onSearch: onSearch,
+    initialSearchMethod: initialSearchMethod,
+    onSearchMethodChange: setCurrentSearchMethod
   }), currentViewMode === 'count' ? renderCountModeContent() : renderIssuesModeContent()), jsx(ModalFooter, null, shouldShowIssueCount && jsx("div", {
     "data-testid": "jira-jql-datasource-modal-total-issues-count",
     css: issueCountStyles

package/dist/types/ui/jira-issues-modal/initial-state-view/index.d.ts

@@ -1,3 +1,8 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
-export declare const InitialStateView: () => jsx.JSX.Element;
+import { JiraSearchMethod } from '../../../common/types';
+interface InitialStateViewProps {
+    searchMethod: JiraSearchMethod;
+}
+export declare const InitialStateView: ({ searchMethod }: InitialStateViewProps) => jsx.JSX.Element;
+export {};

package/dist/types/ui/jira-issues-modal/initial-state-view/messages.d.ts

@@ -4,7 +4,17 @@ export declare const initialStateViewMessages: {
         description: string;
         defaultMessage: string;
     };
-    searchDescription: {
+    beta: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    searchDescriptionForBasicSearch: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    searchDescriptionForJQLSearch: {
         id: string;
         description: string;
         defaultMessage: string;

package/dist/types/ui/jira-issues-modal/jira-search-container/index.d.ts

@@ -4,7 +4,8 @@ import { JiraIssueDatasourceParameters, JiraIssueDatasourceParametersQuery } fro
 export interface SearchContainerProps {
     isSearching?: boolean;
     onSearch: (query: JiraIssueDatasourceParametersQuery, searchMethod: JiraSearchMethod) => void;
+    initialSearchMethod: JiraSearchMethod;
+    onSearchMethodChange: (searchMethod: JiraSearchMethod) => void;
     parameters?: JiraIssueDatasourceParameters;
 }
-export declare const getInitialSearchMethod: (initialJql?: string) => JiraSearchMethod;
 export declare const JiraSearchContainer: (props: SearchContainerProps) => jsx.JSX.Element;

package/dist/types-ts4.5/ui/jira-issues-modal/initial-state-view/index.d.ts

@@ -1,3 +1,8 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
-export declare const InitialStateView: () => jsx.JSX.Element;
+import { JiraSearchMethod } from '../../../common/types';
+interface InitialStateViewProps {
+    searchMethod: JiraSearchMethod;
+}
+export declare const InitialStateView: ({ searchMethod }: InitialStateViewProps) => jsx.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/jira-issues-modal/initial-state-view/messages.d.ts

@@ -4,7 +4,17 @@ export declare const initialStateViewMessages: {
         description: string;
         defaultMessage: string;
     };
-    searchDescription: {
+    beta: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    searchDescriptionForBasicSearch: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    searchDescriptionForJQLSearch: {
         id: string;
         description: string;
         defaultMessage: string;

package/dist/types-ts4.5/ui/jira-issues-modal/jira-search-container/index.d.ts

@@ -4,7 +4,8 @@ import { JiraIssueDatasourceParameters, JiraIssueDatasourceParametersQuery } fro
 export interface SearchContainerProps {
     isSearching?: boolean;
     onSearch: (query: JiraIssueDatasourceParametersQuery, searchMethod: JiraSearchMethod) => void;
+    initialSearchMethod: JiraSearchMethod;
+    onSearchMethodChange: (searchMethod: JiraSearchMethod) => void;
     parameters?: JiraIssueDatasourceParameters;
 }
-export declare const getInitialSearchMethod: (initialJql?: string) => JiraSearchMethod;
 export declare const JiraSearchContainer: (props: SearchContainerProps) => jsx.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-datasource",
-  "version": "1.7.4",
+  "version": "1.7.5",
   "description": "UI Components to support linking platform dataset feature",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"