@atlaskit/link-datasource 2.4.0 → 2.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.js +21 -5
  3. package/dist/cjs/ui/confluence-search-modal/basic-filters/index.js +2 -1
  4. package/dist/es2019/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.js +20 -6
  5. package/dist/es2019/ui/confluence-search-modal/basic-filters/index.js +2 -1
  6. package/dist/esm/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.js +22 -6
  7. package/dist/esm/ui/confluence-search-modal/basic-filters/index.js +2 -1
  8. package/dist/types/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.d.ts +2 -1
  9. package/dist/types-ts4.5/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.d.ts +2 -1
  10. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/link-datasource
2
2
 
3
+ ## 2.4.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#113044](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/113044)
8
+ [`2370431d9d611`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2370431d9d611) -
9
+ Add analytics events(opened, closed) for lastModified confluence SLLV filter.
10
+
3
11
  ## 2.4.0
4
12
 
5
13
  ### Minor Changes
package/dist/cjs/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.js CHANGED
@@ -15,6 +15,7 @@ var _error = _interopRequireDefault(require("@atlaskit/icon/glyph/error"));
15
15
  var _popup = _interopRequireDefault(require("@atlaskit/popup"));
16
16
  var _colors = require("@atlaskit/theme/colors");
17
17
  var _constants = require("@atlaskit/theme/constants");
18
+ var _analytics = require("../../../../../analytics");
18
19
  var _messages = require("./messages");
19
20
  var _PopupComponent = require("./PopupComponent");
20
21
  var _styled = require("./styled");
@@ -28,7 +29,9 @@ var dateRangeValues = ['anyTime', 'today', 'yesterday', 'past7Days', 'past30Days
28
29
  var defaultOptionValue = 'anyTime';
29
30
  var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref) {
30
31
  var onSelectionChange = _ref.onSelectionChange,
31
- selection = _ref.selection;
32
+ selection = _ref.selection,
33
+ _ref$filterName = _ref.filterName,
34
+ filterName = _ref$filterName === void 0 ? 'datasource-date-range-picker' : _ref$filterName;
32
35
  var _ref2 = selection || {},
33
36
  selectedValue = _ref2.value,
34
37
  fromDate = _ref2.from,
@@ -38,6 +41,8 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref) {
38
41
  locale = _useIntl.locale,
39
42
  formatMessage = _useIntl.formatMessage,
40
43
  formatDate = _useIntl.formatDate;
44
+ var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
45
+ fireEvent = _useDatasourceAnalyti.fireEvent;
41
46
  var _useState = (0, _react.useState)(selectedValue),
42
47
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
43
48
  currentOption = _useState2[0],
@@ -50,11 +55,17 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref) {
50
55
  _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
51
56
  customToDate = _useState6[0],
52
57
  setCustomToDate = _useState6[1];
53
- var _useState7 = (0, _react.useState)(false),
58
+ var _useState7 = (0, _react.useState)(undefined),
54
59
  _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
55
60
  isPickerOpen = _useState8[0],
56
61
  setIsPickerOpen = _useState8[1];
57
62
  var isCustomSelected = currentOption === 'custom';
63
+ var analyticsPayload = (0, _react.useMemo)(function () {
64
+ return {
65
+ filterName: filterName,
66
+ selectionCount: (currentOption !== null && currentOption !== void 0 ? currentOption : defaultOptionValue) === defaultOptionValue ? 0 : 1
67
+ };
68
+ }, [filterName, currentOption]);
58
69
  var invalidDateRange = (0, _utils.useInvalidDateRange)(customFromDate, customToDate);
59
70
  var handleClickUpdateDateRange = function handleClickUpdateDateRange() {
60
71
  onSelectionChange({
@@ -81,10 +92,15 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref) {
81
92
  return;
82
93
  }
83
94
  setIsPickerOpen(true);
84
- return;
95
+ fireEvent('ui.dropdown.opened.basicSearchDropdown', analyticsPayload);
85
96
  };
97
+ (0, _react.useEffect)(function () {
98
+ if (isPickerOpen === false) {
99
+ fireEvent('ui.dropdown.closed.basicSearchDropdown', analyticsPayload);
100
+ }
101
+ }, [analyticsPayload, fireEvent, isPickerOpen]);
86
102
  return /*#__PURE__*/_react.default.createElement(_popup.default, {
87
- isOpen: isPickerOpen,
103
+ isOpen: !!isPickerOpen,
88
104
  onClose: handlePickerToggle,
89
105
  popupComponent: _PopupComponent.PopupComponent,
90
106
  zIndex: _constants.layers.modal(),
@@ -164,7 +180,7 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref) {
164
180
  placement: "bottom-start",
165
181
  trigger: function trigger(triggerProps) {
166
182
  var labelText = (0, _utils.getCurrentOptionLabel)(formatDate, formatMessage, selectedValue, toDate, fromDate);
167
- var isSelected = !!selectedValue || isPickerOpen;
183
+ var isSelected = !!selectedValue || !!isPickerOpen;
168
184
  return /*#__PURE__*/_react.default.createElement(_trigger.PopupTrigger, {
169
185
  triggerProps: triggerProps,
170
186
  isSelected: isSelected,
package/dist/cjs/ui/confluence-search-modal/basic-filters/index.js CHANGED
@@ -46,7 +46,8 @@ var BasicFilterContainer = function BasicFilterContainer(_ref) {
46
46
  isHydrating: isHydrating
47
47
  }), /*#__PURE__*/_react.default.createElement(_dateRangePicker.DateRangePicker, {
48
48
  selection: lastModifiedSelection,
49
- onSelectionChange: onDateRangePickerChange
49
+ onSelectionChange: onDateRangePickerChange,
50
+ filterName: "clol-basic-filter-".concat(_types.CLOLBasicFilters.lastModified)
50
51
  }));
51
52
  };
52
53
  var _default = exports.default = BasicFilterContainer;
package/dist/es2019/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.js CHANGED
@@ -1,10 +1,11 @@
1
- import React, { useCallback, useState } from 'react';
1
+ import React, { useCallback, useEffect, useMemo, useState } from 'react';
2
2
  import { FormattedMessage, useIntl } from 'react-intl-next';
3
3
  import { DatePicker } from '@atlaskit/datetime-picker';
4
4
  import ErrorIcon from '@atlaskit/icon/glyph/error';
5
5
  import Popup from '@atlaskit/popup';
6
6
  import { R400 } from '@atlaskit/theme/colors';
7
7
  import { layers } from '@atlaskit/theme/constants';
8
+ import { useDatasourceAnalyticsEvents } from '../../../../../analytics';
8
9
  import { dateRangeMessages } from './messages';
9
10
  import { PopupComponent } from './PopupComponent';
10
11
  import { CustomDateWrapper, CustomDropdown, CustomDropdownItem, DatePickersWrapper, DateRangeErrorMessage, SelectDateRangeButton } from './styled';
@@ -14,7 +15,8 @@ const dateRangeValues = ['anyTime', 'today', 'yesterday', 'past7Days', 'past30Da
14
15
  const defaultOptionValue = 'anyTime';
15
16
  export const DateRangePicker = ({
16
17
  onSelectionChange,
17
- selection
18
+ selection,
19
+ filterName = 'datasource-date-range-picker'
18
20
  }) => {
19
21
  const {
20
22
  value: selectedValue,
@@ -27,11 +29,18 @@ export const DateRangePicker = ({
27
29
  formatMessage,
28
30
  formatDate
29
31
  } = useIntl();
32
+ const {
33
+ fireEvent
34
+ } = useDatasourceAnalyticsEvents();
30
35
  const [currentOption, setCurrentOption] = useState(selectedValue);
31
36
  const [customFromDate, setCustomFromDate] = useState(fromDate);
32
37
  const [customToDate, setCustomToDate] = useState(toDate);
33
- const [isPickerOpen, setIsPickerOpen] = useState(false);
38
+ const [isPickerOpen, setIsPickerOpen] = useState(undefined);
34
39
  const isCustomSelected = currentOption === 'custom';
40
+ const analyticsPayload = useMemo(() => ({
41
+ filterName,
42
+ selectionCount: (currentOption !== null && currentOption !== void 0 ? currentOption : defaultOptionValue) === defaultOptionValue ? 0 : 1
43
+ }), [filterName, currentOption]);
35
44
  const invalidDateRange = useInvalidDateRange(customFromDate, customToDate);
36
45
  const handleClickUpdateDateRange = () => {
37
46
  onSelectionChange({
@@ -58,10 +67,15 @@ export const DateRangePicker = ({
58
67
  return;
59
68
  }
60
69
  setIsPickerOpen(true);
61
- return;
70
+ fireEvent('ui.dropdown.opened.basicSearchDropdown', analyticsPayload);
62
71
  };
72
+ useEffect(() => {
73
+ if (isPickerOpen === false) {
74
+ fireEvent('ui.dropdown.closed.basicSearchDropdown', analyticsPayload);
75
+ }
76
+ }, [analyticsPayload, fireEvent, isPickerOpen]);
63
77
  return /*#__PURE__*/React.createElement(Popup, {
64
- isOpen: isPickerOpen,
78
+ isOpen: !!isPickerOpen,
65
79
  onClose: handlePickerToggle,
66
80
  popupComponent: PopupComponent,
67
81
  zIndex: layers.modal(),
@@ -131,7 +145,7 @@ export const DateRangePicker = ({
131
145
  placement: "bottom-start",
132
146
  trigger: triggerProps => {
133
147
  const labelText = getCurrentOptionLabel(formatDate, formatMessage, selectedValue, toDate, fromDate);
134
- const isSelected = !!selectedValue || isPickerOpen;
148
+ const isSelected = !!selectedValue || !!isPickerOpen;
135
149
  return /*#__PURE__*/React.createElement(PopupTrigger, {
136
150
  triggerProps: triggerProps,
137
151
  isSelected: isSelected,
package/dist/es2019/ui/confluence-search-modal/basic-filters/index.js CHANGED
@@ -36,7 +36,8 @@ const BasicFilterContainer = ({
36
36
  isHydrating: isHydrating
37
37
  }), /*#__PURE__*/React.createElement(DateRangePicker, {
38
38
  selection: lastModifiedSelection,
39
- onSelectionChange: onDateRangePickerChange
39
+ onSelectionChange: onDateRangePickerChange,
40
+ filterName: `clol-basic-filter-${CLOLBasicFilters.lastModified}`
40
41
  }));
41
42
  };
42
43
  export default BasicFilterContainer;
package/dist/esm/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.js CHANGED
@@ -2,13 +2,14 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
3
  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; }
4
4
  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; }
5
- import React, { useCallback, useState } from 'react';
5
+ import React, { useCallback, useEffect, useMemo, useState } from 'react';
6
6
  import { FormattedMessage, useIntl } from 'react-intl-next';
7
7
  import { DatePicker } from '@atlaskit/datetime-picker';
8
8
  import ErrorIcon from '@atlaskit/icon/glyph/error';
9
9
  import Popup from '@atlaskit/popup';
10
10
  import { R400 } from '@atlaskit/theme/colors';
11
11
  import { layers } from '@atlaskit/theme/constants';
12
+ import { useDatasourceAnalyticsEvents } from '../../../../../analytics';
12
13
  import { dateRangeMessages } from './messages';
13
14
  import { PopupComponent } from './PopupComponent';
14
15
  import { CustomDateWrapper, CustomDropdown, CustomDropdownItem, DatePickersWrapper, DateRangeErrorMessage, SelectDateRangeButton } from './styled';
@@ -18,7 +19,9 @@ var dateRangeValues = ['anyTime', 'today', 'yesterday', 'past7Days', 'past30Days
18
19
  var defaultOptionValue = 'anyTime';
19
20
  export var DateRangePicker = function DateRangePicker(_ref) {
20
21
  var onSelectionChange = _ref.onSelectionChange,
21
- selection = _ref.selection;
22
+ selection = _ref.selection,
23
+ _ref$filterName = _ref.filterName,
24
+ filterName = _ref$filterName === void 0 ? 'datasource-date-range-picker' : _ref$filterName;
22
25
  var _ref2 = selection || {},
23
26
  selectedValue = _ref2.value,
24
27
  fromDate = _ref2.from,
@@ -28,6 +31,8 @@ export var DateRangePicker = function DateRangePicker(_ref) {
28
31
  locale = _useIntl.locale,
29
32
  formatMessage = _useIntl.formatMessage,
30
33
  formatDate = _useIntl.formatDate;
34
+ var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
35
+ fireEvent = _useDatasourceAnalyti.fireEvent;
31
36
  var _useState = useState(selectedValue),
32
37
  _useState2 = _slicedToArray(_useState, 2),
33
38
  currentOption = _useState2[0],
@@ -40,11 +45,17 @@ export var DateRangePicker = function DateRangePicker(_ref) {
40
45
  _useState6 = _slicedToArray(_useState5, 2),
41
46
  customToDate = _useState6[0],
42
47
  setCustomToDate = _useState6[1];
43
- var _useState7 = useState(false),
48
+ var _useState7 = useState(undefined),
44
49
  _useState8 = _slicedToArray(_useState7, 2),
45
50
  isPickerOpen = _useState8[0],
46
51
  setIsPickerOpen = _useState8[1];
47
52
  var isCustomSelected = currentOption === 'custom';
53
+ var analyticsPayload = useMemo(function () {
54
+ return {
55
+ filterName: filterName,
56
+ selectionCount: (currentOption !== null && currentOption !== void 0 ? currentOption : defaultOptionValue) === defaultOptionValue ? 0 : 1
57
+ };
58
+ }, [filterName, currentOption]);
48
59
  var invalidDateRange = useInvalidDateRange(customFromDate, customToDate);
49
60
  var handleClickUpdateDateRange = function handleClickUpdateDateRange() {
50
61
  onSelectionChange({
@@ -71,10 +82,15 @@ export var DateRangePicker = function DateRangePicker(_ref) {
71
82
  return;
72
83
  }
73
84
  setIsPickerOpen(true);
74
- return;
85
+ fireEvent('ui.dropdown.opened.basicSearchDropdown', analyticsPayload);
75
86
  };
87
+ useEffect(function () {
88
+ if (isPickerOpen === false) {
89
+ fireEvent('ui.dropdown.closed.basicSearchDropdown', analyticsPayload);
90
+ }
91
+ }, [analyticsPayload, fireEvent, isPickerOpen]);
76
92
  return /*#__PURE__*/React.createElement(Popup, {
77
- isOpen: isPickerOpen,
93
+ isOpen: !!isPickerOpen,
78
94
  onClose: handlePickerToggle,
79
95
  popupComponent: PopupComponent,
80
96
  zIndex: layers.modal(),
@@ -154,7 +170,7 @@ export var DateRangePicker = function DateRangePicker(_ref) {
154
170
  placement: "bottom-start",
155
171
  trigger: function trigger(triggerProps) {
156
172
  var labelText = getCurrentOptionLabel(formatDate, formatMessage, selectedValue, toDate, fromDate);
157
- var isSelected = !!selectedValue || isPickerOpen;
173
+ var isSelected = !!selectedValue || !!isPickerOpen;
158
174
  return /*#__PURE__*/React.createElement(PopupTrigger, {
159
175
  triggerProps: triggerProps,
160
176
  isSelected: isSelected,
package/dist/esm/ui/confluence-search-modal/basic-filters/index.js CHANGED
@@ -39,7 +39,8 @@ var BasicFilterContainer = function BasicFilterContainer(_ref) {
39
39
  isHydrating: isHydrating
40
40
  }), /*#__PURE__*/React.createElement(DateRangePicker, {
41
41
  selection: lastModifiedSelection,
42
- onSelectionChange: onDateRangePickerChange
42
+ onSelectionChange: onDateRangePickerChange,
43
+ filterName: "clol-basic-filter-".concat(CLOLBasicFilters.lastModified)
43
44
  }));
44
45
  };
45
46
  export default BasicFilterContainer;
package/dist/types/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.d.ts CHANGED
@@ -4,6 +4,7 @@ export type DateRangeSelection = Pick<DateRangeOption, 'value' | 'from' | 'to'>;
4
4
  interface DateRangeProps {
5
5
  onSelectionChange: (options: DateRangeSelection) => void;
6
6
  selection?: DateRangeSelection;
7
+ filterName?: string;
7
8
  }
8
- export declare const DateRangePicker: ({ onSelectionChange, selection }: DateRangeProps) => JSX.Element;
9
+ export declare const DateRangePicker: ({ onSelectionChange, selection, filterName, }: DateRangeProps) => JSX.Element;
9
10
  export {};
package/dist/types-ts4.5/ui/confluence-search-modal/basic-filters/filters/date-range-picker/index.d.ts CHANGED
@@ -4,6 +4,7 @@ export type DateRangeSelection = Pick<DateRangeOption, 'value' | 'from' | 'to'>;
4
4
  interface DateRangeProps {
5
5
  onSelectionChange: (options: DateRangeSelection) => void;
6
6
  selection?: DateRangeSelection;
7
+ filterName?: string;
7
8
  }
8
- export declare const DateRangePicker: ({ onSelectionChange, selection }: DateRangeProps) => JSX.Element;
9
+ export declare const DateRangePicker: ({ onSelectionChange, selection, filterName, }: DateRangeProps) => JSX.Element;
9
10
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/link-datasource",
3
- "version": "2.4.0",
3
+ "version": "2.4.1",
4
4
  "description": "UI Components to support linking platform dataset feature",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",