@atlaskit/link-datasource 3.19.2 → 3.20.0

package/dist/esm/ui/confluence-search-modal/modal/index.js

@@ -1,21 +1,17 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 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) { _defineProperty(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/ensure-feature-flag-prefix */
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { Fragment, useCallback, useEffect, useMemo, useRef } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+import React, { Fragment, useCallback, useEffect, useMemo, useRef } from 'react';
 import { FormattedMessage, useIntl } from 'react-intl-next';
 import { IntlMessagesProvider } from '@atlaskit/intl-messages-provider';
 import { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { Box, xcss } from '@atlaskit/primitives';
+import { Box } from '@atlaskit/primitives/compiled';
 import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { DatasourceAction, DatasourceSearchMethod } from '../../../analytics/types';
 import { RichIconSearch } from '../../../common/ui/rich-icon/search';
@@ -45,11 +41,10 @@ import { EmptyState } from '../../issue-like-table';
 import ConfluenceSearchContainer from '../confluence-search-container';
 import { ConfluenceSearchInitialStateSVGOld } from './confluence-search-initial-state-svg-old';
 import { confluenceSearchModalMessages } from './messages';
-var inputContainerStyles = xcss({
-  alignItems: 'baseline',
-  display: 'flex',
-  minHeight: '72px'
-});
+import { ConfluenceSearchConfigModalOld, PlainConfluenceSearchConfigModalOld } from './modal-old';
+var styles = {
+  inputContainerStyles: "_4cvr1q9y _1e0c1txw _1tket9kd"
+};
 var isValidParameters = function isValidParameters(parameters) {
   return !!(parameters && parameters.cloudId && Object.values(parameters).filter(function (v) {
     return v !== undefined;
@@ -58,7 +53,7 @@ var isValidParameters = function isValidParameters(parameters) {
 var noop = function noop() {
   return '';
 };
-export var PlainConfluenceSearchConfigModal = function PlainConfluenceSearchConfigModal(props) {
+export var PlainConfluenceSearchConfigModalNew = function PlainConfluenceSearchConfigModalNew(props) {
   var onCancel = props.onCancel,
     urlBeingEdited = props.url,
     overrideParameters = props.overrideParameters;
@@ -219,46 +214,46 @@ export var PlainConfluenceSearchConfigModal = function PlainConfluenceSearchConf
   }, [currentViewMode, fireInlineViewedEvent, fireTableViewedEvent, status]);
   var renderTableModalContent = useCallback(function () {
     if (status === 'rejected') {
-      return jsx(ModalLoadingError, null);
+      return /*#__PURE__*/React.createElement(ModalLoadingError, null);
     } else if (status === 'unauthorized') {
-      return jsx(AccessRequired, {
+      return /*#__PURE__*/React.createElement(AccessRequired, {
         url: selectedConfluenceSiteUrl || urlBeingEdited
       });
     } else if (resolvedWithNoResults || status === 'forbidden') {
-      return jsx(NoResults, null);
+      return /*#__PURE__*/React.createElement(NoResults, null);
     } else if (status === 'empty' || !columns.length) {
       // persist the empty state when making the initial /data request which contains the columns
       if (hasConfluenceSearchParams !== undefined) {
-        return jsx(EmptyState, {
+        return /*#__PURE__*/React.createElement(EmptyState, {
           testId: "confluence-search-datasource-modal--empty-state"
         });
       }
-      return jsx(ContentContainer, null, jsx(InitialStateView, {
-        icon: fg('bandicoots-update-sllv-icons') ? jsx(RichIconSearch, {
+      return /*#__PURE__*/React.createElement(ContentContainer, null, /*#__PURE__*/React.createElement(InitialStateView, {
+        icon: fg('bandicoots-update-sllv-icons') ? /*#__PURE__*/React.createElement(RichIconSearch, {
           size: "xlarge",
           alt: formatMessage(confluenceSearchModalMessages.initialViewSearchTitle)
-        }) : jsx(ConfluenceSearchInitialStateSVGOld, null),
+        }) : /*#__PURE__*/React.createElement(ConfluenceSearchInitialStateSVGOld, null),
         title: confluenceSearchModalMessages.initialViewSearchTitle,
         description: confluenceSearchModalMessages.initialViewSearchDescription
       }));
     }
-    return jsx(ContentContainer, {
+    return /*#__PURE__*/React.createElement(ContentContainer, {
       withTableBorder: true
-    }, jsx(DatasourcesTableInModalPreview, {
+    }, /*#__PURE__*/React.createElement(DatasourcesTableInModalPreview, {
       testId: "confluence-search-datasource-table"
     }));
   }, [status, resolvedWithNoResults, columns.length, selectedConfluenceSiteUrl, urlBeingEdited, hasConfluenceSearchParams, formatMessage]);
   var renderInlineLinkModalContent = useCallback(function () {
     if (status === 'unauthorized') {
-      return jsx(AccessRequired, {
+      return /*#__PURE__*/React.createElement(AccessRequired, {
         url: selectedConfluenceSiteUrl || urlBeingEdited
       });
     } else if (status === 'empty' || !selectedConfluenceSiteUrl) {
-      return jsx(SmartCardPlaceholder, {
+      return /*#__PURE__*/React.createElement(SmartCardPlaceholder, {
         placeholderText: confluenceSearchModalMessages.resultsCountSmartCardPlaceholderText
       });
     } else {
-      return confluenceSearchUrl && jsx(SmartLink, {
+      return confluenceSearchUrl && /*#__PURE__*/React.createElement(SmartLink, {
         url: confluenceSearchUrl
       });
     }
@@ -312,52 +307,59 @@ export var PlainConfluenceSearchConfigModal = function PlainConfluenceSearchConf
       actions: userInteractions.get()
     };
   }, [destinationObjectTypes, extensionKey, userInteractions]);
-  return jsx(IntlMessagesProvider, {
+  return /*#__PURE__*/React.createElement(IntlMessagesProvider, {
     defaultMessages: i18nEN,
     loaderFn: fetchMessagesForLocale
-  }, jsx(DatasourceModal, {
+  }, /*#__PURE__*/React.createElement(DatasourceModal, {
     testId: "confluence-search-datasource-modal",
     onClose: onCancel
-  }, jsx(ModalHeader, null, jsx(ModalTitle, null, jsx(SiteSelector, {
+  }, /*#__PURE__*/React.createElement(ModalHeader, null, /*#__PURE__*/React.createElement(ModalTitle, null, /*#__PURE__*/React.createElement(SiteSelector, {
     availableSites: availableSites,
     onSiteSelection: onSiteSelection,
     selectedSite: selectedConfluenceSite,
     testId: "confluence-search-datasource-modal--site-selector",
     label: siteSelectorLabel
-  })), !hasNoConfluenceSites && jsx(DatasourceViewModeDropDown, null)), jsx(ModalBody, null, !hasNoConfluenceSites ? jsx(Fragment, null, jsx(Box, {
-    xcss: inputContainerStyles
-  }, jsx(ConfluenceSearchContainer, {
+  })), !hasNoConfluenceSites && /*#__PURE__*/React.createElement(DatasourceViewModeDropDown, null)), /*#__PURE__*/React.createElement(ModalBody, null, !hasNoConfluenceSites ? /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.inputContainerStyles
+  }, /*#__PURE__*/React.createElement(ConfluenceSearchContainer, {
     isSearching: status === 'loading',
     onSearch: onSearch,
     parameters: parameters !== null && parameters !== void 0 ? parameters : {
       cloudId: ''
     }
-  })), currentViewMode === 'inline' ? renderInlineLinkModalContent() : renderTableModalContent()) : jsx(NoInstancesView, {
+  })), currentViewMode === 'inline' ? renderInlineLinkModalContent() : renderTableModalContent()) : /*#__PURE__*/React.createElement(NoInstancesView, {
     title: confluenceSearchModalMessages.noAccessToConfluenceSitesTitle,
     description: confluenceSearchModalMessages.noAccessToConfluenceSitesDescription,
     testId: 'no-confluence-instances-content'
-  })), jsx(ModalFooter, null, shouldShowResultsCount && confluenceSearchUrl && jsx(TableSearchCount, {
+  })), /*#__PURE__*/React.createElement(ModalFooter, null, shouldShowResultsCount && confluenceSearchUrl && /*#__PURE__*/React.createElement(TableSearchCount, {
     searchCount: totalCount,
     url: confluenceSearchUrl,
     prefixTextType: "result",
     testId: "confluence-search-datasource-modal-total-results-count"
-  }), jsx(CancelButton, {
+  }), /*#__PURE__*/React.createElement(CancelButton, {
     onCancel: onCancel,
     getAnalyticsPayload: getButtonAnalyticsPayload,
     testId: "confluence-search-modal--cancel-button"
-  }), !hasNoConfluenceSites && jsx(InsertButton, {
+  }), !hasNoConfluenceSites && /*#__PURE__*/React.createElement(InsertButton, {
     testId: "confluence-search-datasource-modal--insert-button",
     url: confluenceSearchUrl,
     getAnalyticsPayload: getButtonAnalyticsPayload
-  }, jsx(FormattedMessage, confluenceSearchModalMessages.insertResultsButtonText)))));
+  }, /*#__PURE__*/React.createElement(FormattedMessage, confluenceSearchModalMessages.insertResultsButtonText)))));
+};
+export var PlainConfluenceSearchConfigModal = function PlainConfluenceSearchConfigModal(props) {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(PlainConfluenceSearchConfigModalNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(PlainConfluenceSearchConfigModalOld, props);
+  }
 };
 var ConnectedConfluenceSearchConfigModal = createDatasourceModal({
   isValidParameters: isValidParameters,
   dataProvider: 'confluence-search',
-  component: PlainConfluenceSearchConfigModal
+  component: PlainConfluenceSearchConfigModalNew
 });
-export var ConfluenceSearchConfigModal = function ConfluenceSearchConfigModal(props) {
-  return jsx(StoreContainer, null, jsx(ConnectedConfluenceSearchConfigModal, _extends({}, props, {
+export var ConfluenceSearchConfigModalNew = function ConfluenceSearchConfigModalNew(props) {
+  return /*#__PURE__*/React.createElement(StoreContainer, null, /*#__PURE__*/React.createElement(ConnectedConfluenceSearchConfigModal, _extends({}, props, {
     /**
      * If the intial parameters are not valid, we will not initialise the modal state
      * with `overrideParameters`. This is to allow the modal to be opened without
@@ -365,4 +367,11 @@ export var ConfluenceSearchConfigModal = function ConfluenceSearchConfigModal(pr
      */
     parameters: props.overrideParameters && isValidParameters(props.parameters) ? _objectSpread(_objectSpread({}, props.parameters), props.overrideParameters) : props.parameters
   })));
+};
+export var ConfluenceSearchConfigModal = function ConfluenceSearchConfigModal(props) {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(ConfluenceSearchConfigModalNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(ConfluenceSearchConfigModalOld, props);
+  }
 };

package/dist/esm/ui/confluence-search-modal/modal/modal-old.js

@@ -0,0 +1,354 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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) { _defineProperty(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/ensure-feature-flag-prefix */
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import { Fragment, useCallback, useEffect, useMemo, useRef } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { jsx } from '@emotion/react';
+import { FormattedMessage } from 'react-intl-next';
+import { IntlMessagesProvider } from '@atlaskit/intl-messages-provider';
+import { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
+import { Box, xcss } from '@atlaskit/primitives';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
+import { DatasourceAction, DatasourceSearchMethod } from '../../../analytics/types';
+import { fetchMessagesForLocale } from '../../../common/utils/locale/fetch-messages-for-locale';
+import { useUserInteractions } from '../../../contexts/user-interactions';
+import i18nEN from '../../../i18n/en';
+import { useAvailableSites } from '../../../services/useAvailableSites';
+import { StoreContainer } from '../../../state';
+import { AccessRequired } from '../../common/error-state/access-required';
+import { ModalLoadingError } from '../../common/error-state/modal-loading-error';
+import { NoInstancesView } from '../../common/error-state/no-instances';
+import { NoResults } from '../../common/error-state/no-results';
+import { InitialStateView } from '../../common/initial-state-view';
+import { CancelButton } from '../../common/modal/cancel-button';
+import { ContentContainer } from '../../common/modal/content-container';
+import { SmartCardPlaceholder, SmartLink } from '../../common/modal/count-view-smart-link';
+import { useDatasourceContext } from '../../common/modal/datasource-context';
+import { DatasourceModal } from '../../common/modal/datasource-modal';
+import { createDatasourceModal } from '../../common/modal/datasource-modal/createDatasourceModal';
+import DatasourcesTableInModalPreview from '../../common/modal/datasources-table-in-modal-preview';
+import { InsertButton } from '../../common/modal/insert-button';
+import { DatasourceViewModeDropDown } from '../../common/modal/mode-switcher';
+import { useViewModeContext } from '../../common/modal/mode-switcher/useViewModeContext';
+import TableSearchCount from '../../common/modal/search-count';
+import { SiteSelector } from '../../common/modal/site-selector';
+import { EmptyState } from '../../issue-like-table';
+import ConfluenceSearchContainer from '../confluence-search-container';
+import { ConfluenceSearchInitialStateSVGOld } from './confluence-search-initial-state-svg-old';
+import { confluenceSearchModalMessages } from './messages';
+var inputContainerStyles = xcss({
+  alignItems: 'baseline',
+  display: 'flex',
+  minHeight: '72px'
+});
+var isValidParameters = function isValidParameters(parameters) {
+  return !!(parameters && parameters.cloudId && Object.values(parameters).filter(function (v) {
+    return v !== undefined;
+  }).length > 1);
+};
+export var PlainConfluenceSearchConfigModalOld = function PlainConfluenceSearchConfigModalOld(props) {
+  var onCancel = props.onCancel,
+    urlBeingEdited = props.url,
+    overrideParameters = props.overrideParameters;
+  var _useViewModeContext = useViewModeContext(),
+    currentViewMode = _useViewModeContext.currentViewMode;
+  var _useDatasourceContext = useDatasourceContext(),
+    visibleColumnKeys = _useDatasourceContext.visibleColumnKeys,
+    _useDatasourceContext2 = _useDatasourceContext.tableState,
+    reset = _useDatasourceContext2.reset,
+    status = _useDatasourceContext2.status,
+    responseItems = _useDatasourceContext2.responseItems,
+    _useDatasourceContext3 = _useDatasourceContext2.extensionKey,
+    extensionKey = _useDatasourceContext3 === void 0 ? null : _useDatasourceContext3,
+    destinationObjectTypes = _useDatasourceContext2.destinationObjectTypes,
+    totalCount = _useDatasourceContext2.totalCount,
+    columns = _useDatasourceContext2.columns,
+    visibleColumnCount = _useDatasourceContext.visibleColumnCount,
+    parameters = _useDatasourceContext.parameters,
+    setParameters = _useDatasourceContext.setParameters;
+  var _useAvailableSites = useAvailableSites('confluence', parameters === null || parameters === void 0 ? void 0 : parameters.cloudId),
+    availableSites = _useAvailableSites.availableSites,
+    selectedConfluenceSite = _useAvailableSites.selectedSite;
+
+  // analytics related parameters
+  var searchCount = useRef(0);
+  var userInteractions = useUserInteractions();
+  var setParametersWithOverrides = useCallback(function (setStateAction) {
+    if (typeof setStateAction !== 'function') {
+      setParameters(_objectSpread(_objectSpread({}, setStateAction), {}, {
+        cloudId: (setStateAction === null || setStateAction === void 0 ? void 0 : setStateAction.cloudId) || ''
+      }, overrideParameters));
+    } else {
+      setParameters(function (prev) {
+        return _objectSpread(_objectSpread(_objectSpread({}, prev), {}, {
+          cloudId: (prev === null || prev === void 0 ? void 0 : prev.cloudId) || ''
+        }, setStateAction(prev)), overrideParameters);
+      });
+    }
+  }, [setParameters, overrideParameters]);
+  var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
+  var hasNoConfluenceSites = availableSites && availableSites.length === 0;
+  useEffect(function () {
+    if (availableSites) {
+      fireEvent('ui.modal.ready.datasource', {
+        instancesCount: availableSites.length,
+        schemasCount: null
+      });
+    }
+  }, [fireEvent, availableSites]);
+
+  // TODO: further refactoring in EDM-9573
+  // https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo/pull-requests/82725/overview?commentId=6828283
+  useEffect(function () {
+    if (selectedConfluenceSite && (!(parameters !== null && parameters !== void 0 && parameters.cloudId) || (parameters === null || parameters === void 0 ? void 0 : parameters.cloudId) !== selectedConfluenceSite.cloudId)) {
+      /**
+       * This code is primarily to set the cloudId in the parameters when the site selector loads a default value
+       * but there is no "onChange" emitted from the site picker
+       */
+      setParameters(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          cloudId: selectedConfluenceSite.cloudId
+        });
+      });
+    }
+  }, [parameters, setParameters, selectedConfluenceSite]);
+
+  // TODO: further refactoring in EDM-9573
+  // https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo/pull-requests/82725/overview?commentId=6829171
+  var onSiteSelection = useCallback(function (site) {
+    userInteractions.add(DatasourceAction.INSTANCE_UPDATED);
+
+    /**
+     * Clear the state of the form filters when the site is changed
+     */
+    setParameters(function (prev) {
+      return _objectSpread(_objectSpread({}, prev), {}, {
+        searchString: undefined,
+        lastModified: undefined,
+        lastModifiedFrom: undefined,
+        lastModifiedTo: undefined,
+        contributorAccountIds: undefined,
+        cloudId: site.cloudId
+      });
+    });
+    reset({
+      shouldForceRequest: true
+    });
+  }, [reset, setParameters, userInteractions]);
+  var siteSelectorLabel = availableSites && availableSites.length > 1 ? confluenceSearchModalMessages.insertIssuesTitleManySites : confluenceSearchModalMessages.insertIssuesTitle;
+  var resolvedWithNoResults = status === 'resolved' && !responseItems.length;
+  var hasConfluenceSearchParams = selectedConfluenceSite && (parameters === null || parameters === void 0 ? void 0 : parameters.searchString);
+  var selectedConfluenceSiteUrl = selectedConfluenceSite === null || selectedConfluenceSite === void 0 ? void 0 : selectedConfluenceSite.url;
+  var confluenceSearchUrl = useMemo(function () {
+    var _parameters$contribut;
+    if (!selectedConfluenceSiteUrl || (parameters === null || parameters === void 0 ? void 0 : parameters.searchString) === undefined) {
+      return undefined;
+    }
+    var params = new URLSearchParams();
+    // we are appending "text" without checking searchString as we need the url to have "text" when a user does an empty search)
+    params.append('text', (parameters === null || parameters === void 0 ? void 0 : parameters.searchString) || '');
+    if (parameters !== null && parameters !== void 0 && (_parameters$contribut = parameters.contributorAccountIds) !== null && _parameters$contribut !== void 0 && _parameters$contribut.length) {
+      params.append('contributors', parameters.contributorAccountIds.join(','));
+    }
+    if (parameters !== null && parameters !== void 0 && parameters.lastModified) {
+      params.append('lastModified', parameters.lastModified);
+    }
+    if (parameters !== null && parameters !== void 0 && parameters.lastModifiedFrom) {
+      params.append('from', parameters.lastModifiedFrom);
+    }
+    if (parameters !== null && parameters !== void 0 && parameters.lastModifiedTo) {
+      params.append('to', parameters.lastModifiedTo);
+    }
+    return "".concat(selectedConfluenceSiteUrl, "/wiki/search?").concat(params.toString());
+  }, [parameters, selectedConfluenceSiteUrl]);
+  var analyticsPayload = useMemo(function () {
+    return {
+      extensionKey: extensionKey,
+      destinationObjectTypes: destinationObjectTypes,
+      searchCount: searchCount.current,
+      actions: userInteractions.get()
+    };
+  }, [destinationObjectTypes, extensionKey, userInteractions]);
+  var isDataReady = (visibleColumnKeys || []).length > 0;
+  var fireInlineViewedEvent = useCallback(function () {
+    fireEvent('ui.link.viewed.count', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+      searchMethod: DatasourceSearchMethod.DATASOURCE_SEARCH_QUERY,
+      totalItemCount: totalCount || 0
+    }));
+  }, [analyticsPayload, fireEvent, totalCount]);
+  var fireTableViewedEvent = useCallback(function () {
+    if (isDataReady) {
+      fireEvent('ui.table.viewed.datasourceConfigModal', _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+        totalItemCount: totalCount || 0,
+        searchMethod: DatasourceSearchMethod.DATASOURCE_SEARCH_QUERY,
+        displayedColumnCount: visibleColumnCount.current
+      }));
+    }
+  }, [isDataReady, fireEvent, analyticsPayload, totalCount, visibleColumnCount]);
+  useEffect(function () {
+    var isResolved = status === 'resolved';
+    var isTableViewMode = currentViewMode === 'table';
+    var isInlineViewMode = currentViewMode === 'inline';
+    if (!isResolved) {
+      return;
+    }
+    if (isTableViewMode) {
+      fireTableViewedEvent();
+    } else if (isInlineViewMode) {
+      fireInlineViewedEvent();
+    }
+  }, [currentViewMode, fireInlineViewedEvent, fireTableViewedEvent, status]);
+  var renderTableModalContent = useCallback(function () {
+    if (status === 'rejected') {
+      return jsx(ModalLoadingError, null);
+    } else if (status === 'unauthorized') {
+      return jsx(AccessRequired, {
+        url: selectedConfluenceSiteUrl || urlBeingEdited
+      });
+    } else if (resolvedWithNoResults || status === 'forbidden') {
+      return jsx(NoResults, null);
+    } else if (status === 'empty' || !columns.length) {
+      // persist the empty state when making the initial /data request which contains the columns
+      if (hasConfluenceSearchParams !== undefined) {
+        return jsx(EmptyState, {
+          testId: "confluence-search-datasource-modal--empty-state"
+        });
+      }
+      return jsx(ContentContainer, null, jsx(InitialStateView, {
+        icon: jsx(ConfluenceSearchInitialStateSVGOld, null),
+        title: confluenceSearchModalMessages.initialViewSearchTitle,
+        description: confluenceSearchModalMessages.initialViewSearchDescription
+      }));
+    }
+    return jsx(ContentContainer, {
+      withTableBorder: true
+    }, jsx(DatasourcesTableInModalPreview, {
+      testId: "confluence-search-datasource-table"
+    }));
+  }, [columns.length, selectedConfluenceSiteUrl, resolvedWithNoResults, status, urlBeingEdited, hasConfluenceSearchParams]);
+  var renderInlineLinkModalContent = useCallback(function () {
+    if (status === 'unauthorized') {
+      return jsx(AccessRequired, {
+        url: selectedConfluenceSiteUrl || urlBeingEdited
+      });
+    } else if (status === 'empty' || !selectedConfluenceSiteUrl) {
+      return jsx(SmartCardPlaceholder, {
+        placeholderText: confluenceSearchModalMessages.resultsCountSmartCardPlaceholderText
+      });
+    } else {
+      return confluenceSearchUrl && jsx(SmartLink, {
+        url: confluenceSearchUrl
+      });
+    }
+  }, [confluenceSearchUrl, selectedConfluenceSiteUrl, status, urlBeingEdited]);
+  var shouldShowResultsCount = !!totalCount && currentViewMode === 'table';
+  var onSearch = useCallback(function (newSearchString, filters) {
+    searchCount.current++;
+    userInteractions.add(DatasourceAction.QUERY_UPDATED);
+    if (filters) {
+      var editedOrCreatedBy = filters.editedOrCreatedBy,
+        lastModifiedList = filters.lastModified;
+      if (lastModifiedList) {
+        var updatedDateRangeOption = lastModifiedList.find(function (range) {
+          return range.value;
+        });
+        if ((updatedDateRangeOption === null || updatedDateRangeOption === void 0 ? void 0 : updatedDateRangeOption.optionType) === 'dateRange') {
+          setParametersWithOverrides(function (prev) {
+            return _objectSpread(_objectSpread({}, prev), {}, {
+              lastModified: updatedDateRangeOption.value,
+              lastModifiedFrom: updatedDateRangeOption.from,
+              lastModifiedTo: updatedDateRangeOption.to
+            });
+          });
+        }
+      }
+      if (editedOrCreatedBy) {
+        var accountIds = editedOrCreatedBy.map(function (user) {
+          return user.value;
+        });
+        setParametersWithOverrides(function (prev) {
+          return _objectSpread(_objectSpread({}, prev), {}, {
+            contributorAccountIds: accountIds
+          });
+        });
+      }
+    }
+    setParametersWithOverrides(function (prev) {
+      return _objectSpread(_objectSpread({}, prev), {}, {
+        searchString: newSearchString
+      });
+    });
+    reset({
+      shouldForceRequest: true
+    });
+  }, [reset, userInteractions, setParametersWithOverrides]);
+  var getButtonAnalyticsPayload = useCallback(function () {
+    return {
+      extensionKey: extensionKey,
+      destinationObjectTypes: destinationObjectTypes,
+      searchCount: searchCount.current,
+      actions: userInteractions.get()
+    };
+  }, [destinationObjectTypes, extensionKey, userInteractions]);
+  return jsx(IntlMessagesProvider, {
+    defaultMessages: i18nEN,
+    loaderFn: fetchMessagesForLocale
+  }, jsx(DatasourceModal, {
+    testId: "confluence-search-datasource-modal",
+    onClose: onCancel
+  }, jsx(ModalHeader, null, jsx(ModalTitle, null, jsx(SiteSelector, {
+    availableSites: availableSites,
+    onSiteSelection: onSiteSelection,
+    selectedSite: selectedConfluenceSite,
+    testId: "confluence-search-datasource-modal--site-selector",
+    label: siteSelectorLabel
+  })), !hasNoConfluenceSites && jsx(DatasourceViewModeDropDown, null)), jsx(ModalBody, null, !hasNoConfluenceSites ? jsx(Fragment, null, jsx(Box, {
+    xcss: inputContainerStyles
+  }, jsx(ConfluenceSearchContainer, {
+    isSearching: status === 'loading',
+    onSearch: onSearch,
+    parameters: parameters !== null && parameters !== void 0 ? parameters : {
+      cloudId: ''
+    }
+  })), currentViewMode === 'inline' ? renderInlineLinkModalContent() : renderTableModalContent()) : jsx(NoInstancesView, {
+    title: confluenceSearchModalMessages.noAccessToConfluenceSitesTitle,
+    description: confluenceSearchModalMessages.noAccessToConfluenceSitesDescription,
+    testId: 'no-confluence-instances-content'
+  })), jsx(ModalFooter, null, shouldShowResultsCount && confluenceSearchUrl && jsx(TableSearchCount, {
+    searchCount: totalCount,
+    url: confluenceSearchUrl,
+    prefixTextType: "result",
+    testId: "confluence-search-datasource-modal-total-results-count"
+  }), jsx(CancelButton, {
+    onCancel: onCancel,
+    getAnalyticsPayload: getButtonAnalyticsPayload,
+    testId: "confluence-search-modal--cancel-button"
+  }), !hasNoConfluenceSites && jsx(InsertButton, {
+    testId: "confluence-search-datasource-modal--insert-button",
+    url: confluenceSearchUrl,
+    getAnalyticsPayload: getButtonAnalyticsPayload
+  }, jsx(FormattedMessage, confluenceSearchModalMessages.insertResultsButtonText)))));
+};
+var ConnectedConfluenceSearchConfigModal = createDatasourceModal({
+  isValidParameters: isValidParameters,
+  dataProvider: 'confluence-search',
+  component: PlainConfluenceSearchConfigModalOld
+});
+export var ConfluenceSearchConfigModalOld = function ConfluenceSearchConfigModalOld(props) {
+  return jsx(StoreContainer, null, jsx(ConnectedConfluenceSearchConfigModal, _extends({}, props, {
+    /**
+     * If the intial parameters are not valid, we will not initialise the modal state
+     * with `overrideParameters`. This is to allow the modal to be opened without
+     * any initial parameters and require the user to perform a search.
+     */
+    parameters: props.overrideParameters && isValidParameters(props.parameters) ? _objectSpread(_objectSpread({}, props.parameters), props.overrideParameters) : props.parameters
+  })));
+};

package/dist/esm/ui/datasource-table-view/datasourceTableView.compiled.css

@@ -0,0 +1 @@
+._2rko1kw7{border-radius:inherit}

package/dist/esm/ui/datasource-table-view/datasourceTableView.js

@@ -1,13 +1,11 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+/* datasourceTableView.tsx generated by @compiled/babel-plugin v0.36.0 */
+import "./datasourceTableView.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { useCallback, useEffect, useRef } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
 import { withAnalyticsContext } from '@atlaskit/analytics-next';
 import { IntlMessagesProvider } from '@atlaskit/intl-messages-provider';
+import { fg } from "@atlaskit/platform-feature-flags";
 import { useDatasourceAnalyticsEvents } from '../../analytics';
 import { componentMetadata } from '../../analytics/constants';
 import { startUfoExperience } from '../../analytics/ufoExperiences';
@@ -27,9 +25,8 @@ import { ProviderAuthRequired } from '../common/error-state/provider-auth-requir
 import { IssueLikeDataTableView } from '../issue-like-table';
 import EmptyState from '../issue-like-table/empty-state';
 import { TableFooter } from '../table-footer';
-var containerStyles = css({
-  borderRadius: 'inherit'
-});
+import { DatasourceTableViewOld } from './datasourceTableViewOld';
+var containerStyles = null;
 var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAnalytics(_ref) {
   var datasourceId = _ref.datasourceId,
     parameters = _ref.parameters,
@@ -130,34 +127,33 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
     });
   }, [reset]);
   if (status === 'resolved' && !responseItems.length || status === 'forbidden') {
-    return jsx(NoResults, {
+    return /*#__PURE__*/React.createElement(NoResults, {
       onRefresh: handleErrorRefresh
     });
   }
   if (status === 'unauthorized') {
-    return authDetails !== null && authDetails !== void 0 && authDetails.length && authDetails.length > 0 ? jsx(ProviderAuthRequired, {
+    return authDetails !== null && authDetails !== void 0 && authDetails.length && authDetails.length > 0 ? /*#__PURE__*/React.createElement(ProviderAuthRequired, {
       auth: authDetails,
       extensionKey: extensionKey,
       providerName: providerName,
       onAuthSuccess: forcedReset,
       onAuthError: forcedReset,
       datasourceId: datasourceId
-    }) : jsx(AccessRequired, {
+    }) : /*#__PURE__*/React.createElement(AccessRequired, {
       url: url
     });
   }
   if (status === 'rejected') {
-    return jsx(LoadingError, {
+    return /*#__PURE__*/React.createElement(LoadingError, {
       onRefresh: handleErrorRefresh
     });
   }
-  return jsx(IntlMessagesProvider, {
+  return /*#__PURE__*/React.createElement(IntlMessagesProvider, {
     defaultMessages: i18nEN,
     loaderFn: fetchMessagesForLocale
-  }, jsx("div", {
-    css: containerStyles,
-    className: "datasource-table"
-  }, hasColumns ? jsx(IssueLikeDataTableView, {
+  }, /*#__PURE__*/React.createElement("div", {
+    className: ax(["_2rko1kw7", "datasource-table"])
+  }, hasColumns ? /*#__PURE__*/React.createElement(IssueLikeDataTableView, {
     testId: 'datasource-table-view',
     hasNextPage: hasNextPage,
     items: responseItems,
@@ -174,10 +170,10 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
     onWrappedColumnChange: onWrappedColumnChange,
     scrollableContainerHeight: ScrollableContainerHeight,
     extensionKey: extensionKey
-  }) : jsx(EmptyState, {
+  }) : /*#__PURE__*/React.createElement(EmptyState, {
     testId: "datasource-table-view-skeleton",
     isCompact: true
-  }), jsx(TableFooter, {
+  }), /*#__PURE__*/React.createElement(TableFooter, {
     datasourceId: datasourceId,
     itemCount: isDataReady ? totalCount : undefined,
     onRefresh: onRefresh,
@@ -185,6 +181,13 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
     url: url
   })));
 };
-export var DatasourceTableView = withAnalyticsContext(componentMetadata.tableView)(function (props) {
-  return jsx(StoreContainer, null, jsx(DatasourceExperienceIdProvider, null, jsx(DatasourceTableViewWithoutAnalytics, props)));
-});
+var DatasourceTableViewNew = withAnalyticsContext(componentMetadata.tableView)(function (props) {
+  return /*#__PURE__*/React.createElement(StoreContainer, null, /*#__PURE__*/React.createElement(DatasourceExperienceIdProvider, null, /*#__PURE__*/React.createElement(DatasourceTableViewWithoutAnalytics, props)));
+});
+export var DatasourceTableView = function DatasourceTableView(props) {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(DatasourceTableViewNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(DatasourceTableViewOld, props);
+  }
+};