@atlaskit/link-datasource 1.16.5 → 1.17.1

package/dist/esm/ui/jira-issues-modal/basic-filters/ui/async-popup-select/index.js

@@ -1,10 +1,11 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _extends from "@babel/runtime/helpers/extends";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 var _excluded = ["isOpen"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { useIntl } from 'react-intl-next';
 import { useDebouncedCallback } from 'use-debounce';
 import { CheckboxOption, PopupSelect } from '@atlaskit/select';
@@ -31,7 +32,6 @@ var AsyncPopupSelect = function AsyncPopupSelect(_ref) {
     isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
-  var pickerRef = useRef(null);
   var _useState = useState(''),
     _useState2 = _slicedToArray(_useState, 2),
     searchTerm = _useState2[0],
@@ -40,6 +40,10 @@ var AsyncPopupSelect = function AsyncPopupSelect(_ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     selectedOptions = _useState4[0],
     setSelectedOptions = _useState4[1];
+  var _useState5 = useState(selectedOptions),
+    _useState6 = _slicedToArray(_useState5, 2),
+    sortedOptions = _useState6[0],
+    setSortedOptions = _useState6[1];
   var _useFilterOptions = useFilterOptions({
       filterType: filterType,
       cloudId: cloudId
@@ -80,14 +84,46 @@ var AsyncPopupSelect = function AsyncPopupSelect(_ref) {
     setSelectedOptions(newValue);
     onSelectionChange(newValue);
   };
-  var handleOpenPopup = useCallback(function () {
-    if (status === 'empty' || status === 'rejected') {
-      // if user searches and gets status as rejected, we want the dropdown to try load the request with searchString when the user reopens the dropdown
-      fetchFilterOptions({
-        searchString: searchTerm
+  var sortOptionsOnPopupOpen = useCallback(function () {
+    if (selectedOptions.length === 0) {
+      setSortedOptions(filterOptions);
+      return;
+    }
+    var nonSelectedOptions = filterOptions.filter(function (option) {
+      return !selectedOptions.find(function (selectedOption) {
+        return selectedOption.value === option.value;
+      });
+    });
+    var newOptions = [].concat(_toConsumableArray(selectedOptions), _toConsumableArray(nonSelectedOptions));
+    setSortedOptions(newOptions);
+  }, [selectedOptions, filterOptions]);
+  var sortOptionsOnResolve = useCallback(function () {
+    var newOptions = filterOptions.filter(function (option) {
+      return !sortedOptions.find(function (sortedOption) {
+        return sortedOption.value === option.value;
+      });
+    });
+    var shouldSetSortOptions = false;
+    if (sortedOptions.length !== filterOptions.length) {
+      shouldSetSortOptions = true;
+    } else {
+      sortedOptions.forEach(function (sortedOption) {
+        if (!filterOptions.some(function (filterOption) {
+          return filterOption.value === sortedOption.value;
+        })) {
+          shouldSetSortOptions = true;
+        }
       });
     }
-  }, [fetchFilterOptions, searchTerm, status]);
+    if (shouldSetSortOptions) {
+      var sortedOptionsFiltered = sortedOptions.filter(function (sortedOption) {
+        return filterOptions.some(function (filterOption) {
+          return filterOption.value === sortedOption.value;
+        });
+      });
+      setSortedOptions([].concat(_toConsumableArray(sortedOptionsFiltered), _toConsumableArray(newOptions)));
+    }
+  }, [filterOptions, sortedOptions]);
   var handleShowMore = useCallback(function () {
     if (pageCursor) {
       fetchFilterOptions({
@@ -96,28 +132,34 @@ var AsyncPopupSelect = function AsyncPopupSelect(_ref) {
       });
     }
   }, [fetchFilterOptions, pageCursor, searchTerm]);
+  var handleOpenPopup = useCallback(function () {
+    if (status === 'empty' || status === 'rejected') {
+      // if user searches and gets status as rejected, we want the dropdown to try load the request with searchString when the user reopens the dropdown
+      fetchFilterOptions({
+        searchString: searchTerm
+      });
+    } else if (status === 'resolved') {
+      sortOptionsOnPopupOpen();
+    }
+  }, [fetchFilterOptions, searchTerm, sortOptionsOnPopupOpen, status]);
   useEffect(function () {
     if (status === 'resolved') {
-      var _pickerRef$current;
-      // necessary to refocus the search input after the loading state
-      pickerRef === null || pickerRef === void 0 || (_pickerRef$current = pickerRef.current) === null || _pickerRef$current === void 0 || (_pickerRef$current = _pickerRef$current.selectRef) === null || _pickerRef$current === void 0 || (_pickerRef$current = _pickerRef$current.inputRef) === null || _pickerRef$current === void 0 || _pickerRef$current.focus();
+      sortOptionsOnResolve();
     }
-  }, [status]);
+  }, [sortOptionsOnResolve, status]);
   var filterOptionsLength = filterOptions.length;
   var isError = status === 'rejected';
   var isLoading = status === 'loading' || status === 'empty';
   var isLoadingMore = status === 'loadingMore';
   var isEmpty = status === 'resolved' && filterOptionsLength === 0;
+  var popupSelectOptions = isLoading || isError ? [] : sortedOptions; // if not set to [], then on loading, no loading UI will be shown
   var areAllResultsLoaded = filterOptions.length === totalCount;
   var shouldShowFooter = (status === 'resolved' || isLoadingMore) && filterOptions.length > 0; // footer should not disappear when there is an inline spinner for loading more data
   var shouldDisplayShowMoreButton = status === 'resolved' && !!pageCursor && !areAllResultsLoaded;
-  var options = isLoading || isError ? [] : filterOptions; // if not set to [], for eg: on loading, no loading UI will be shown
-
   return /*#__PURE__*/React.createElement(PopupSelect, {
     isMulti: true,
     maxMenuWidth: 300,
     minMenuWidth: 300,
-    ref: pickerRef,
     testId: "jlol-basic-filter-popup-select",
     inputId: "jlol-basic-filter-popup-select--input"
     /*
@@ -153,7 +195,7 @@ var AsyncPopupSelect = function AsyncPopupSelect(_ref) {
       IndicatorSeparator: undefined // disables the | separator between search input and icon
     },
 
-    options: options,
+    options: popupSelectOptions,
     value: selectedOptions,
     filterOption: noFilterOptions,
     formatOptionLabel: formatOptionLabel,
@@ -164,6 +206,7 @@ var AsyncPopupSelect = function AsyncPopupSelect(_ref) {
         triggerProps = _objectWithoutProperties(_ref3, _excluded);
       return /*#__PURE__*/React.createElement(PopupTrigger, _extends({}, triggerProps, {
         filterType: filterType,
+        selectedOptions: selectedOptions,
         isSelected: isOpen,
         onClick: handleOpenPopup,
         isDisabled: isDisabled

package/dist/esm/ui/jira-issues-modal/basic-filters/ui/async-popup-select/trigger.js

@@ -1,23 +1,46 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { forwardRef } from 'react';
 import { FormattedMessage } from 'react-intl-next';
+import Badge from '@atlaskit/badge';
 import Button from '@atlaskit/button/standard-button';
 import ChevronDownIcon from '@atlaskit/icon/glyph/chevron-down';
+import { Box, Flex, xcss } from '@atlaskit/primitives';
 import { asyncPopupSelectMessages } from './messages';
+var triggerButtonLabelStyles = xcss({
+  textOverflow: 'ellipsis',
+  overflow: 'hidden',
+  maxWidth: '150px'
+});
+var badgeStyles = xcss({
+  marginLeft: 'space.050'
+});
 var PopupTrigger = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var filterType = _ref.filterType,
     isSelected = _ref.isSelected,
     isDisabled = _ref.isDisabled,
-    onClick = _ref.onClick;
+    onClick = _ref.onClick,
+    selectedOptions = _ref.selectedOptions;
+  var _ref2 = selectedOptions || [],
+    _ref3 = _slicedToArray(_ref2, 1),
+    firstOption = _ref3[0];
+  var hasOptions = selectedOptions && selectedOptions.length > 0;
   return /*#__PURE__*/React.createElement(Button, {
     ref: ref,
     appearance: "default",
-    isSelected: isSelected,
+    isSelected: isSelected || hasOptions,
     isDisabled: isDisabled,
     onClick: onClick,
     testId: "jlol-basic-filter-".concat(filterType, "-trigger"),
     iconAfter: /*#__PURE__*/React.createElement(ChevronDownIcon, {
       label: ""
     })
-  }, /*#__PURE__*/React.createElement(FormattedMessage, asyncPopupSelectMessages["".concat(filterType, "Label")]));
+  }, /*#__PURE__*/React.createElement(Flex, null, /*#__PURE__*/React.createElement(Box, {
+    xcss: triggerButtonLabelStyles
+  }, /*#__PURE__*/React.createElement(FormattedMessage, asyncPopupSelectMessages["".concat(filterType, "Label")]), firstOption && /*#__PURE__*/React.createElement(React.Fragment, null, ": ", firstOption.label)), selectedOptions && selectedOptions.length > 1 && /*#__PURE__*/React.createElement(Flex, {
+    xcss: badgeStyles,
+    alignItems: "center"
+  }, /*#__PURE__*/React.createElement(Badge, {
+    appearance: "primary"
+  }, "+", selectedOptions.length - 1))));
 });
 export default PopupTrigger;

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

@@ -1,5 +1,5 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import React, { useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { Flex, xcss } from '@atlaskit/primitives';
 import { isValidJql } from '../utils';
 import AsyncPopupSelect from './async-popup-select';
@@ -11,14 +11,17 @@ var BasicFilterContainer = function BasicFilterContainer(_ref) {
   var jql = _ref.jql,
     cloudId = _ref.cloudId;
   var _useState = useState([]),
-    _useState2 = _slicedToArray(_useState, 1),
-    selection = _useState2[0];
+    _useState2 = _slicedToArray(_useState, 2),
+    selection = _useState2[0],
+    setSelection = _useState2[1];
   useEffect(function () {
     if (isValidJql(jql)) {
       // hydrate hook call goes in here
     }
   }, [jql]);
-  var handleSelectionChange = function handleSelectionChange() {};
+  var handleSelectionChange = useCallback(function (options) {
+    setSelection(options);
+  }, [setSelection]);
   return /*#__PURE__*/React.createElement(Flex, {
     xcss: basicFilterContainerStyles,
     gap: "space.100",

package/dist/types/analytics/generated/analytics.types.d.ts

@@ -3,7 +3,7 @@
  *
  * Generates Typescript types for analytics events from analytics.spec.yaml
  *
- * @codegen <<SignedSource::ddaee20abebe8b4891d75f243120dce8>>
+ * @codegen <<SignedSource::d3722446f615a812f3e336474f9d8d3c>>
  * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource
  */
 export type PackageMetaDataType = {
@@ -90,6 +90,22 @@ export type ErrorShownBasicSearchDropdownAttributesType = {
     reason: 'agg' | 'network' | 'unknown';
 };
 export type AqlEditorSearchedAttributesType = {};
+export type GetWorkspaceIdSuccessAttributesType = {};
+export type GetWorkspaceIdFailedAttributesType = {
+    statusCodeGroup: '1xx' | '3xx' | '4xx' | '5xx' | 'unknown';
+};
+export type ValidateAqlSuccessAttributesType = {};
+export type ValidateAqlFailedAttributesType = {
+    statusCodeGroup: '1xx' | '3xx' | '4xx' | '5xx' | 'unknown';
+};
+export type ObjectSchemaSuccessAttributesType = {};
+export type ObjectSchemaFailedAttributesType = {
+    statusCodeGroup: '1xx' | '3xx' | '4xx' | '5xx' | 'unknown';
+};
+export type ObjectSchemasSuccessAttributesType = {};
+export type ObjectSchemasFailedAttributesType = {
+    statusCodeGroup: '1xx' | '3xx' | '4xx' | '5xx' | 'unknown';
+};
 export type AnalyticsEventAttributes = {
     /**
      * Fires when user sees modal dialog. */
@@ -148,5 +164,29 @@ export type AnalyticsEventAttributes = {
     /**
      * Fired when search is initiated via the search icon or enter key press for aql editor input field. */
     'ui.aqlEditor.searched': AqlEditorSearchedAttributesType;
+    /**
+     * Fired when fetching a workspace Id is successful. */
+    'operational.getWorkspaceId.success': GetWorkspaceIdSuccessAttributesType;
+    /**
+     * Fired when fetching a workspace Id fails. */
+    'operational.getWorkspaceId.failed': GetWorkspaceIdFailedAttributesType;
+    /**
+     * Fired when making a request to validateAQL is successful. */
+    'operational.validateAql.success': ValidateAqlSuccessAttributesType;
+    /**
+     * Fired when making a request to validateAQL fails. */
+    'operational.validateAql.failed': ValidateAqlFailedAttributesType;
+    /**
+     * Fired when fetching an object schema is successful. */
+    'operational.objectSchema.success': ObjectSchemaSuccessAttributesType;
+    /**
+     * Fired when fetching an object schema fails. */
+    'operational.objectSchema.failed': ObjectSchemaFailedAttributesType;
+    /**
+     * Fired when fetching object schemas is successful. */
+    'operational.objectSchemas.success': ObjectSchemasSuccessAttributesType;
+    /**
+     * Fired when fetching object schemas fails. */
+    'operational.objectSchemas.failed': ObjectSchemasFailedAttributesType;
 };
 export type EventKey = keyof AnalyticsEventAttributes;

package/dist/types/services/cmdbService.d.ts

@@ -1,7 +1,11 @@
+import { EventKey } from '../analytics/generated/analytics.types';
+import createEventPayload from '../analytics/generated/create-event-payload';
 import { AqlValidateResponse, FetchObjectSchemasResponse } from '../types/assets/types';
-export declare const getWorkspaceId: () => Promise<string>;
+type AnalyticsFireEvent = <K extends EventKey>(...params: Parameters<typeof createEventPayload<K>>) => void;
+export declare const getWorkspaceId: (fireEvent?: AnalyticsFireEvent) => Promise<string>;
 export declare const validateAql: (workspaceId: string, data: {
     qlQuery: string;
-}) => Promise<AqlValidateResponse>;
-export declare const fetchObjectSchema: (workspaceId: string, schemaId: string) => Promise<import("../types/assets/types").ObjectSchema>;
-export declare const fetchObjectSchemas: (workspaceId: string, query?: string) => Promise<FetchObjectSchemasResponse>;
+}, fireEvent?: AnalyticsFireEvent) => Promise<AqlValidateResponse>;
+export declare const fetchObjectSchema: (workspaceId: string, schemaId: string, fireEvent?: AnalyticsFireEvent) => Promise<import("../types/assets/types").ObjectSchema>;
+export declare const fetchObjectSchemas: (workspaceId: string, query?: string, fireEvent?: AnalyticsFireEvent) => Promise<FetchObjectSchemasResponse>;
+export {};

package/dist/types/ui/jira-issues-modal/basic-filters/ui/async-popup-select/trigger.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
-import { BasicFilterFieldType } from '../../types';
+import { BasicFilterFieldType, SelectOption } from '../../types';
 export interface PopupTriggerProps {
     filterType: BasicFilterFieldType;
+    selectedOptions?: ReadonlyArray<SelectOption>;
     isSelected?: boolean;
     isDisabled?: boolean;
     onClick?: () => void;

package/dist/types-ts4.5/analytics/generated/analytics.types.d.ts

@@ -3,7 +3,7 @@
  *
  * Generates Typescript types for analytics events from analytics.spec.yaml
  *
- * @codegen <<SignedSource::ddaee20abebe8b4891d75f243120dce8>>
+ * @codegen <<SignedSource::d3722446f615a812f3e336474f9d8d3c>>
  * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen link-datasource
  */
 export type PackageMetaDataType = {
@@ -90,6 +90,22 @@ export type ErrorShownBasicSearchDropdownAttributesType = {
     reason: 'agg' | 'network' | 'unknown';
 };
 export type AqlEditorSearchedAttributesType = {};
+export type GetWorkspaceIdSuccessAttributesType = {};
+export type GetWorkspaceIdFailedAttributesType = {
+    statusCodeGroup: '1xx' | '3xx' | '4xx' | '5xx' | 'unknown';
+};
+export type ValidateAqlSuccessAttributesType = {};
+export type ValidateAqlFailedAttributesType = {
+    statusCodeGroup: '1xx' | '3xx' | '4xx' | '5xx' | 'unknown';
+};
+export type ObjectSchemaSuccessAttributesType = {};
+export type ObjectSchemaFailedAttributesType = {
+    statusCodeGroup: '1xx' | '3xx' | '4xx' | '5xx' | 'unknown';
+};
+export type ObjectSchemasSuccessAttributesType = {};
+export type ObjectSchemasFailedAttributesType = {
+    statusCodeGroup: '1xx' | '3xx' | '4xx' | '5xx' | 'unknown';
+};
 export type AnalyticsEventAttributes = {
     /**
      * Fires when user sees modal dialog. */
@@ -148,5 +164,29 @@ export type AnalyticsEventAttributes = {
     /**
      * Fired when search is initiated via the search icon or enter key press for aql editor input field. */
     'ui.aqlEditor.searched': AqlEditorSearchedAttributesType;
+    /**
+     * Fired when fetching a workspace Id is successful. */
+    'operational.getWorkspaceId.success': GetWorkspaceIdSuccessAttributesType;
+    /**
+     * Fired when fetching a workspace Id fails. */
+    'operational.getWorkspaceId.failed': GetWorkspaceIdFailedAttributesType;
+    /**
+     * Fired when making a request to validateAQL is successful. */
+    'operational.validateAql.success': ValidateAqlSuccessAttributesType;
+    /**
+     * Fired when making a request to validateAQL fails. */
+    'operational.validateAql.failed': ValidateAqlFailedAttributesType;
+    /**
+     * Fired when fetching an object schema is successful. */
+    'operational.objectSchema.success': ObjectSchemaSuccessAttributesType;
+    /**
+     * Fired when fetching an object schema fails. */
+    'operational.objectSchema.failed': ObjectSchemaFailedAttributesType;
+    /**
+     * Fired when fetching object schemas is successful. */
+    'operational.objectSchemas.success': ObjectSchemasSuccessAttributesType;
+    /**
+     * Fired when fetching object schemas fails. */
+    'operational.objectSchemas.failed': ObjectSchemasFailedAttributesType;
 };
 export type EventKey = keyof AnalyticsEventAttributes;

package/dist/types-ts4.5/services/cmdbService.d.ts

@@ -1,7 +1,11 @@
+import { EventKey } from '../analytics/generated/analytics.types';
+import createEventPayload from '../analytics/generated/create-event-payload';
 import { AqlValidateResponse, FetchObjectSchemasResponse } from '../types/assets/types';
-export declare const getWorkspaceId: () => Promise<string>;
+type AnalyticsFireEvent = <K extends EventKey>(...params: Parameters<typeof createEventPayload<K>>) => void;
+export declare const getWorkspaceId: (fireEvent?: AnalyticsFireEvent) => Promise<string>;
 export declare const validateAql: (workspaceId: string, data: {
     qlQuery: string;
-}) => Promise<AqlValidateResponse>;
-export declare const fetchObjectSchema: (workspaceId: string, schemaId: string) => Promise<import("../types/assets/types").ObjectSchema>;
-export declare const fetchObjectSchemas: (workspaceId: string, query?: string) => Promise<FetchObjectSchemasResponse>;
+}, fireEvent?: AnalyticsFireEvent) => Promise<AqlValidateResponse>;
+export declare const fetchObjectSchema: (workspaceId: string, schemaId: string, fireEvent?: AnalyticsFireEvent) => Promise<import("../types/assets/types").ObjectSchema>;
+export declare const fetchObjectSchemas: (workspaceId: string, query?: string, fireEvent?: AnalyticsFireEvent) => Promise<FetchObjectSchemasResponse>;
+export {};

package/dist/types-ts4.5/ui/jira-issues-modal/basic-filters/ui/async-popup-select/trigger.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
-import { BasicFilterFieldType } from '../../types';
+import { BasicFilterFieldType, SelectOption } from '../../types';
 export interface PopupTriggerProps {
     filterType: BasicFilterFieldType;
+    selectedOptions?: ReadonlyArray<SelectOption>;
     isSelected?: boolean;
     isDisabled?: boolean;
     onClick?: () => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-datasource",
-  "version": "1.16.5",
+  "version": "1.17.1",
   "description": "UI Components to support linking platform dataset feature",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -33,6 +33,7 @@
     "@atlaskit/adf-schema": "^32.0.0",
     "@atlaskit/analytics-next": "^9.1.3",
     "@atlaskit/avatar": "^21.4.0",
+    "@atlaskit/badge": "^15.1.16",
     "@atlaskit/button": "^16.16.0",
     "@atlaskit/editor-prosemirror": "1.1.0",
     "@atlaskit/empty-state": "^7.5.0",
@@ -46,7 +47,7 @@
     "@atlaskit/jql-editor-autocomplete-rest": "^2.0.0",
     "@atlaskit/link-client-extension": "^1.8.0",
     "@atlaskit/linking-common": "^4.18.0",
-    "@atlaskit/linking-types": "^8.4.0",
+    "@atlaskit/linking-types": "^8.5.0",
     "@atlaskit/lozenge": "^11.4.0",
     "@atlaskit/modal-dialog": "^12.8.0",
     "@atlaskit/platform-feature-flags": "^0.2.4",
@@ -58,11 +59,11 @@
     "@atlaskit/select": "^16.7.0",
     "@atlaskit/smart-card": "^26.42.0",
     "@atlaskit/spinner": "^15.6.0",
-    "@atlaskit/tag": "^11.6.0",
+    "@atlaskit/tag": "^12.0.0",
     "@atlaskit/textfield": "5.6.8",
     "@atlaskit/theme": "^12.6.0",
     "@atlaskit/tokens": "^1.28.0",
-    "@atlaskit/tooltip": "^17.8.0",
+    "@atlaskit/tooltip": "^18.0.0",
     "@atlaskit/ufo": "^0.2.4",
     "@atlassianlabs/jql-editor": "^2.0.1",
     "@babel/runtime": "^7.0.0",