@atlaskit/link-datasource 3.19.2 → 3.20.0

package/dist/es2019/ui/confluence-search-modal/basic-filters/index.js

@@ -1,11 +1,16 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-import { Flex, xcss } from '@atlaskit/primitives';
+import { fg } from "@atlaskit/platform-feature-flags";
+import { Flex } from '@atlaskit/primitives/compiled';
+import BasicFilterContainerOld from './basic-filters-old';
 import { DateRangePicker } from './filters/date-range-picker';
 import EditedOrCreatedByFilter from './filters/edited-or-created-by';
 import { CLOLBasicFilters } from './types';
-const basicFilterContainerStyles = xcss({
-  paddingLeft: 'space.100'
-});
+const styles = {
+  basicFilterContainerStyles: "_19bvu2gc"
+};
 const BasicFilterContainer = ({
   cloudId,
   onChange,
@@ -26,7 +31,7 @@ const BasicFilterContainer = ({
     });
   };
   return /*#__PURE__*/React.createElement(Flex, {
-    xcss: basicFilterContainerStyles,
+    xcss: styles.basicFilterContainerStyles,
     gap: "space.100",
     testId: "clol-basic-filter-container"
   }, /*#__PURE__*/React.createElement(EditedOrCreatedByFilter, {
@@ -40,4 +45,11 @@ const BasicFilterContainer = ({
     filterName: `clol-basic-filter-${CLOLBasicFilters.lastModified}`
   }));
 };
-export default BasicFilterContainer;
+const BasicFilterContainerExported = props => {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(BasicFilterContainer, props);
+  } else {
+    return /*#__PURE__*/React.createElement(BasicFilterContainerOld, props);
+  }
+};
+export default BasicFilterContainerExported;

package/dist/es2019/ui/confluence-search-modal/confluence-search-container/confluence-search-container-old.js

@@ -0,0 +1,106 @@
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { useDebouncedCallback } from 'use-debounce';
+import { Flex, xcss } from '@atlaskit/primitives';
+import { BasicSearchInput } from '../../common/modal/basic-search-input';
+import { FILTER_SELECTION_DEBOUNCE_MS } from '../../common/modal/popup-select/constants';
+import BasicFilters from '../basic-filters';
+import { useBasicFilterHydration } from '../basic-filters/hooks/useBasicFilterHydration';
+import { CLOLBasicFilters } from '../basic-filters/types';
+import { searchMessages } from './messages';
+const basicSearchInputContainerStyles = xcss({
+  flexGrow: 1
+});
+const ConfluenceSearchContainer = ({
+  parameters: {
+    cloudId,
+    searchString: initialSearchValue,
+    lastModified,
+    lastModifiedFrom,
+    lastModifiedTo,
+    contributorAccountIds
+  },
+  isSearching,
+  onSearch
+}) => {
+  const {
+    hydrateUsersFromAccountIds,
+    users,
+    status,
+    reset: resetHydrationHook
+  } = useBasicFilterHydration();
+  const currentCloudId = useRef(cloudId);
+  const [initialContributorAccountIds, setInitialContributorAccountIds] = useState(contributorAccountIds !== null && contributorAccountIds !== void 0 ? contributorAccountIds : []);
+  const [searchBarSearchString, setSearchBarSearchString] = useState(initialSearchValue !== null && initialSearchValue !== void 0 ? initialSearchValue : '');
+  const [filterSelections, setFilterSelections] = useState(() => lastModified ? {
+    lastModified: [{
+      optionType: 'dateRange',
+      label: lastModified,
+      value: lastModified,
+      from: lastModifiedFrom,
+      to: lastModifiedTo
+    }]
+  } : {});
+  const handleSearchChange = useCallback(e => {
+    const rawSearch = e.currentTarget.value;
+    setSearchBarSearchString(rawSearch);
+  }, []);
+  const [debouncedBasicFilterSelectionChange] = useDebouncedCallback(filterValues => {
+    onSearch(searchBarSearchString, filterValues);
+  }, FILTER_SELECTION_DEBOUNCE_MS);
+  const handleBasicFilterSelectionChange = useCallback((filterType, options) => {
+    const updatedSelection = {
+      ...filterSelections,
+      [filterType]: Array.isArray(options) ? options : [options]
+    };
+    setFilterSelections(updatedSelection);
+    if (filterType === CLOLBasicFilters.lastModified) {
+      onSearch(searchBarSearchString, updatedSelection);
+    } else {
+      debouncedBasicFilterSelectionChange(updatedSelection);
+    }
+  }, [debouncedBasicFilterSelectionChange, filterSelections, onSearch, searchBarSearchString]);
+
+  // TODO: further refactoring in EDM-9573
+  // https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo/pull-requests/82725/overview?commentId=6827913
+  useEffect(() => {
+    if (currentCloudId.current !== cloudId) {
+      setInitialContributorAccountIds([]);
+      resetHydrationHook();
+      setSearchBarSearchString('');
+      setFilterSelections({});
+      currentCloudId.current = cloudId;
+    }
+  }, [cloudId, resetHydrationHook]);
+  useEffect(() => {
+    const hasAccountIds = (initialContributorAccountIds === null || initialContributorAccountIds === void 0 ? void 0 : initialContributorAccountIds.length) > 0;
+    if (hasAccountIds && status === 'empty') {
+      hydrateUsersFromAccountIds(initialContributorAccountIds);
+    }
+  }, [hydrateUsersFromAccountIds, initialContributorAccountIds, status]);
+  useEffect(() => {
+    if (status === 'resolved') {
+      setFilterSelections({
+        lastModified: filterSelections.lastModified,
+        editedOrCreatedBy: users
+      });
+    }
+  }, [users, status, filterSelections.lastModified]);
+  return /*#__PURE__*/React.createElement(Flex, {
+    alignItems: "center",
+    xcss: basicSearchInputContainerStyles
+  }, /*#__PURE__*/React.createElement(BasicSearchInput, {
+    testId: "confluence-search-datasource-modal",
+    isSearching: isSearching,
+    onChange: handleSearchChange,
+    onSearch: onSearch,
+    searchTerm: searchBarSearchString,
+    placeholder: searchMessages.searchLabel,
+    fullWidth: false
+  }), /*#__PURE__*/React.createElement(BasicFilters, {
+    cloudId: cloudId,
+    selections: filterSelections,
+    onChange: handleBasicFilterSelectionChange,
+    isHydrating: status === 'loading'
+  }));
+};
+export default ConfluenceSearchContainer;

package/dist/es2019/ui/confluence-search-modal/confluence-search-container/index.compiled.css

@@ -0,0 +1 @@
+._16jlkb7n{flex-grow:1}

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

@@ -1,15 +1,20 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { useDebouncedCallback } from 'use-debounce';
-import { Flex, xcss } from '@atlaskit/primitives';
+import { fg } from "@atlaskit/platform-feature-flags";
+import { Flex } from '@atlaskit/primitives/compiled';
 import { BasicSearchInput } from '../../common/modal/basic-search-input';
 import { FILTER_SELECTION_DEBOUNCE_MS } from '../../common/modal/popup-select/constants';
 import BasicFilters from '../basic-filters';
 import { useBasicFilterHydration } from '../basic-filters/hooks/useBasicFilterHydration';
 import { CLOLBasicFilters } from '../basic-filters/types';
+import ConfluenceSearchContainerOld from './confluence-search-container-old';
 import { searchMessages } from './messages';
-const basicSearchInputContainerStyles = xcss({
-  flexGrow: 1
-});
+const styles = {
+  basicSearchInputContainerStyles: "_16jlkb7n"
+};
 const ConfluenceSearchContainer = ({
   parameters: {
     cloudId,
@@ -87,7 +92,7 @@ const ConfluenceSearchContainer = ({
   }, [users, status, filterSelections.lastModified]);
   return /*#__PURE__*/React.createElement(Flex, {
     alignItems: "center",
-    xcss: basicSearchInputContainerStyles
+    xcss: styles.basicSearchInputContainerStyles
   }, /*#__PURE__*/React.createElement(BasicSearchInput, {
     testId: "confluence-search-datasource-modal",
     isSearching: isSearching,
@@ -103,4 +108,11 @@ const ConfluenceSearchContainer = ({
     isHydrating: status === 'loading'
   }));
 };
-export default ConfluenceSearchContainer;
+const ConfluenceSearchContainerExported = props => {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(ConfluenceSearchContainer, props);
+  } else {
+    return /*#__PURE__*/React.createElement(ConfluenceSearchContainerOld, props);
+  }
+};
+export default ConfluenceSearchContainerExported;

package/dist/es2019/ui/confluence-search-modal/modal/index.compiled.css

@@ -0,0 +1,3 @@
+._1e0c1txw{display:flex}
+._1tket9kd{min-height:72px}
+._4cvr1q9y{align-items:baseline}

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

@@ -1,18 +1,14 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _extends from "@babel/runtime/helpers/extends";
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 /* 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';
@@ -42,14 +38,13 @@ 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';
-const inputContainerStyles = xcss({
-  alignItems: 'baseline',
-  display: 'flex',
-  minHeight: '72px'
-});
+import { ConfluenceSearchConfigModalOld, PlainConfluenceSearchConfigModalOld } from './modal-old';
+const styles = {
+  inputContainerStyles: "_4cvr1q9y _1e0c1txw _1tket9kd"
+};
 const isValidParameters = parameters => !!(parameters && parameters.cloudId && Object.values(parameters).filter(v => v !== undefined).length > 1);
 const noop = () => '';
-export const PlainConfluenceSearchConfigModal = props => {
+export const PlainConfluenceSearchConfigModalNew = props => {
   const {
     onCancel,
     url: urlBeingEdited,
@@ -218,46 +213,46 @@ export const PlainConfluenceSearchConfigModal = props => {
   }, [currentViewMode, fireInlineViewedEvent, fireTableViewedEvent, status]);
   const renderTableModalContent = useCallback(() => {
     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]);
   const renderInlineLinkModalContent = useCallback(() => {
     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
       });
     }
@@ -306,52 +301,59 @@ export const PlainConfluenceSearchConfigModal = props => {
       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 const PlainConfluenceSearchConfigModal = props => {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(PlainConfluenceSearchConfigModalNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(PlainConfluenceSearchConfigModalOld, props);
+  }
 };
 const ConnectedConfluenceSearchConfigModal = createDatasourceModal({
   isValidParameters,
   dataProvider: 'confluence-search',
-  component: PlainConfluenceSearchConfigModal
+  component: PlainConfluenceSearchConfigModalNew
 });
-export const ConfluenceSearchConfigModal = props => {
-  return jsx(StoreContainer, null, jsx(ConnectedConfluenceSearchConfigModal, _extends({}, props, {
+export const 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
@@ -362,4 +364,11 @@ export const ConfluenceSearchConfigModal = props => {
       ...props.overrideParameters
     } : props.parameters
   })));
+};
+export const ConfluenceSearchConfigModal = props => {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(ConfluenceSearchConfigModalNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(ConfluenceSearchConfigModalOld, props);
+  }
 };