@atlaskit/link-datasource 3.22.6 → 4.0.0

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

@@ -1,190 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-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 { useDatasourceAnalyticsEvents } from '../../analytics';
-import { componentMetadata } from '../../analytics/constants';
-import { startUfoExperience } from '../../analytics/ufoExperiences';
-import { useColumnPickerRenderedFailedUfoExperience } from '../../analytics/ufoExperiences/hooks/useColumnPickerRenderedFailedUfoExperience';
-import { useDataRenderedUfoExperience } from '../../analytics/ufoExperiences/hooks/useDataRenderedUfoExperience';
-import { fetchMessagesForLocale } from '../../common/utils/locale/fetch-messages-for-locale';
-import { DatasourceExperienceIdProvider, useDatasourceExperienceId } from '../../contexts/datasource-experience-id';
-import { useDatasourceTableState } from '../../hooks/useDatasourceTableState';
-import i18nEN from '../../i18n/en';
-import { StoreContainer } from '../../state';
-import { ScrollableContainerHeight } from '../../ui/issue-like-table/styled';
-import { ASSETS_LIST_OF_LINKS_DATASOURCE_ID } from '../assets-modal';
-import { AccessRequired } from '../common/error-state/access-required';
-import { LoadingError } from '../common/error-state/loading-error';
-import { NoResults } from '../common/error-state/no-results';
-import { ProviderAuthRequired } from '../common/error-state/provider-auth-required';
-import { IssueLikeDataTableView } from '../issue-like-table';
-import EmptyState from '../issue-like-table/empty-state';
-import { TableFooter } from '../table-footer';
-var containerStyles = css({
-  borderRadius: 'inherit'
-});
-var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAnalytics(_ref) {
-  var datasourceId = _ref.datasourceId,
-    parameters = _ref.parameters,
-    visibleColumnKeys = _ref.visibleColumnKeys,
-    onVisibleColumnKeysChange = _ref.onVisibleColumnKeysChange,
-    url = _ref.url,
-    columnCustomSizes = _ref.columnCustomSizes,
-    onColumnResize = _ref.onColumnResize,
-    wrappedColumnKeys = _ref.wrappedColumnKeys,
-    onWrappedColumnChange = _ref.onWrappedColumnChange;
-  var _useDatasourceTableSt = useDatasourceTableState({
-      datasourceId: datasourceId,
-      parameters: parameters,
-      fieldKeys: visibleColumnKeys
-    }),
-    reset = _useDatasourceTableSt.reset,
-    status = _useDatasourceTableSt.status,
-    onNextPage = _useDatasourceTableSt.onNextPage,
-    responseItems = _useDatasourceTableSt.responseItems,
-    responseItemIds = _useDatasourceTableSt.responseItemIds,
-    hasNextPage = _useDatasourceTableSt.hasNextPage,
-    columns = _useDatasourceTableSt.columns,
-    defaultVisibleColumnKeys = _useDatasourceTableSt.defaultVisibleColumnKeys,
-    totalCount = _useDatasourceTableSt.totalCount,
-    loadDatasourceDetails = _useDatasourceTableSt.loadDatasourceDetails,
-    _useDatasourceTableSt2 = _useDatasourceTableSt.extensionKey,
-    extensionKey = _useDatasourceTableSt2 === void 0 ? null : _useDatasourceTableSt2,
-    providerName = _useDatasourceTableSt.providerName,
-    destinationObjectTypes = _useDatasourceTableSt.destinationObjectTypes,
-    authDetails = _useDatasourceTableSt.authDetails;
-  var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
-    fireEvent = _useDatasourceAnalyti.fireEvent;
-  var experienceId = useDatasourceExperienceId();
-  var visibleColumnCount = useRef((visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0);
-
-  /*  Need this to make sure that the datasource in the editor gets updated new info if any edits are made in the modal
-       But we don't want to call it on initial load. This screws up useDatasourceTableState's internal
-       mechanism of initial loading. Use of ref here makes it basically work as a `componentDidUpdate` but not `componentDidMount`
-    */
-  var isInitialRender = useRef(true);
-  var hasColumns = !!columns.length;
-  var isDataReady = hasColumns && responseItems.length > 0 && totalCount && totalCount > 0;
-  visibleColumnCount.current = (visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0;
-  useEffect(function () {
-    if (!isInitialRender.current) {
-      reset();
-    }
-    isInitialRender.current = false;
-  }, [reset, parameters]);
-  useEffect(function () {
-    if (onVisibleColumnKeysChange && (visibleColumnKeys || []).length === 0 && defaultVisibleColumnKeys.length > 0) {
-      onVisibleColumnKeysChange(defaultVisibleColumnKeys);
-    }
-  }, [visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange]);
-  useEffect(function () {
-    var isTableViewRenderedWithData = status === 'resolved' && isDataReady;
-    if (isTableViewRenderedWithData) {
-      fireEvent('ui.datasource.renderSuccess', {
-        extensionKey: extensionKey,
-        destinationObjectTypes: destinationObjectTypes,
-        totalItemCount: totalCount,
-        displayedColumnCount: visibleColumnCount.current,
-        display: 'table'
-      });
-    }
-  }, [totalCount, fireEvent, status, extensionKey, destinationObjectTypes, isDataReady]);
-  useEffect(function () {
-    var shouldStartUfoExperience = datasourceId && parameters && visibleColumnKeys && status === 'loading';
-    if (shouldStartUfoExperience) {
-      startUfoExperience({
-        name: 'datasource-rendered'
-      }, experienceId);
-    }
-  }, [datasourceId, parameters, status, experienceId, visibleColumnKeys]);
-  useColumnPickerRenderedFailedUfoExperience(status, experienceId);
-  useDataRenderedUfoExperience({
-    status: status,
-    experienceId: experienceId,
-    itemCount: responseItems.length,
-    extensionKey: extensionKey
-  });
-  var forcedReset = useCallback(function () {
-    reset({
-      shouldForceRequest: true,
-      shouldResetColumns: datasourceId === ASSETS_LIST_OF_LINKS_DATASOURCE_ID
-    });
-  }, [reset, datasourceId]);
-  var onRefresh = useCallback(function () {
-    fireEvent('ui.button.clicked.sync', {
-      extensionKey: extensionKey,
-      destinationObjectTypes: destinationObjectTypes
-    });
-    forcedReset();
-  }, [destinationObjectTypes, extensionKey, fireEvent, forcedReset]);
-  var handleErrorRefresh = useCallback(function () {
-    reset({
-      shouldForceRequest: true
-    });
-  }, [reset]);
-  if (status === 'resolved' && !responseItems.length || status === 'forbidden') {
-    return jsx(NoResults, {
-      onRefresh: handleErrorRefresh
-    });
-  }
-  if (status === 'unauthorized') {
-    return authDetails !== null && authDetails !== void 0 && authDetails.length && authDetails.length > 0 ? jsx(ProviderAuthRequired, {
-      auth: authDetails,
-      extensionKey: extensionKey,
-      providerName: providerName,
-      onAuthSuccess: forcedReset,
-      onAuthError: forcedReset,
-      datasourceId: datasourceId
-    }) : jsx(AccessRequired, {
-      url: url
-    });
-  }
-  if (status === 'rejected') {
-    return jsx(LoadingError, {
-      onRefresh: handleErrorRefresh
-    });
-  }
-  return jsx(IntlMessagesProvider, {
-    defaultMessages: i18nEN,
-    loaderFn: fetchMessagesForLocale
-  }, jsx("div", {
-    css: containerStyles,
-    className: "datasource-table"
-  }, hasColumns ? jsx(IssueLikeDataTableView, {
-    testId: 'datasource-table-view',
-    hasNextPage: hasNextPage,
-    items: responseItems,
-    itemIds: responseItemIds,
-    onNextPage: onNextPage,
-    onLoadDatasourceDetails: loadDatasourceDetails,
-    status: status,
-    columns: columns,
-    visibleColumnKeys: visibleColumnKeys || defaultVisibleColumnKeys,
-    onVisibleColumnKeysChange: onVisibleColumnKeysChange,
-    columnCustomSizes: columnCustomSizes,
-    onColumnResize: onColumnResize,
-    wrappedColumnKeys: wrappedColumnKeys,
-    onWrappedColumnChange: onWrappedColumnChange,
-    scrollableContainerHeight: ScrollableContainerHeight,
-    extensionKey: extensionKey
-  }) : jsx(EmptyState, {
-    testId: "datasource-table-view-skeleton",
-    isCompact: true
-  }), jsx(TableFooter, {
-    datasourceId: datasourceId,
-    itemCount: isDataReady ? totalCount : undefined,
-    onRefresh: onRefresh,
-    isLoading: !isDataReady || status === 'loading',
-    url: url
-  })));
-};
-export var DatasourceTableViewOld = withAnalyticsContext(componentMetadata.tableView)(function (props) {
-  return jsx(StoreContainer, null, jsx(DatasourceExperienceIdProvider, null, jsx(DatasourceTableViewWithoutAnalytics, props)));
-});

package/dist/esm/ui/issue-like-table/column-picker/column-picker-old.js

@@ -1,178 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-var _excluded = ["isOpen"];
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { useCallback, useEffect, useRef, useState } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
-import { useIntl } from 'react-intl-next';
-import Button from '@atlaskit/button/new';
-import BoardIcon from '@atlaskit/icon/core/migration/board';
-import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
-import { Box, xcss } from '@atlaskit/primitives';
-import { CheckboxOption, createFilter, PopupSelect } from '@atlaskit/select';
-import Tooltip from '@atlaskit/tooltip';
-import { succeedUfoExperience } from '../../../analytics/ufoExperiences';
-import { useDatasourceExperienceId } from '../../../contexts/datasource-experience-id';
-import { ConcatenatedMenuList } from './concatenated-menu-list';
-import { columnPickerMessages } from './messages';
-var chevronIconStyles = xcss({
-  display: 'flex',
-  alignItems: 'center'
-});
-export var ColumnPickerOld = function ColumnPickerOld(_ref) {
-  var columns = _ref.columns,
-    selectedColumnKeys = _ref.selectedColumnKeys,
-    onSelectedColumnKeysChange = _ref.onSelectedColumnKeysChange,
-    onOpen = _ref.onOpen;
-  var intl = useIntl();
-  var experienceId = useDatasourceExperienceId();
-  var _useState = useState([]),
-    _useState2 = _slicedToArray(_useState, 2),
-    allOptions = _useState2[0],
-    setAllOptions = _useState2[1];
-  var pickerRef = useRef(null);
-  var mapColumnToOption = useCallback(function (_ref2) {
-    var key = _ref2.key,
-      title = _ref2.title;
-    return {
-      label: title,
-      value: key
-    };
-  }, []);
-  var selectedOptions = columns.filter(function (_ref3) {
-    var key = _ref3.key;
-    return selectedColumnKeys.includes(key);
-  }).map(mapColumnToOption);
-  useEffect(function () {
-    setAllOptions(columns.filter(function (_ref4) {
-      var title = _ref4.title;
-      return title;
-    }).map(mapColumnToOption));
-  }, [columns, mapColumnToOption]);
-  var handleChange = useCallback(function (selectedOptions) {
-    var selectedValues = selectedOptions.map(function (_ref5) {
-      var value = _ref5.value;
-      return value;
-    });
-    selectedValues.sort(function (a, b) {
-      var indexB = columns.findIndex(function (_ref6) {
-        var key = _ref6.key;
-        return key === b;
-      });
-      var indexA = columns.findIndex(function (_ref7) {
-        var key = _ref7.key;
-        return key === a;
-      });
-      return indexA - indexB;
-    });
-    onSelectedColumnKeysChange(selectedValues);
-  }, [columns, onSelectedColumnKeysChange]);
-  var sortSelectedColumnsTop = useCallback(function () {
-    if (!allOptions.length) {
-      return;
-    }
-    var nonSelectedOptions = allOptions.filter(function (option) {
-      return !selectedOptions.find(function (selectedOption) {
-        return selectedOption.value === option.value;
-      });
-    });
-    var sortedOptions = [].concat(_toConsumableArray(selectedOptions), _toConsumableArray(nonSelectedOptions));
-    sortedOptions.length > 0 && setAllOptions(sortedOptions);
-  }, [allOptions, selectedOptions]);
-  var stopEscapePropagationWhenOpen = function stopEscapePropagationWhenOpen(e) {
-    if (e.key === 'Escape') {
-      e.stopPropagation();
-    }
-  };
-  var handleOpen = useCallback(function () {
-    onOpen && onOpen();
-    void sortSelectedColumnsTop();
-  }, [onOpen, sortSelectedColumnsTop]);
-
-  // If only 1 option is selected, disable it since we don't want user to uncheck everything
-  var handleIsOptionDisabled = function handleIsOptionDisabled(option, selectValue) {
-    return selectValue.length === 1 && selectValue.some(function (selectedValue) {
-      return selectedValue.value === option.value;
-    });
-  };
-  useEffect(function () {
-    if (allOptions.length) {
-      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.select) === null || _pickerRef$current === void 0 || (_pickerRef$current = _pickerRef$current.inputRef) === null || _pickerRef$current === void 0 || _pickerRef$current.focus();
-    }
-  }, [allOptions]);
-  useEffect(function () {
-    if (allOptions.length) {
-      if (experienceId) {
-        succeedUfoExperience({
-          name: 'column-picker-rendered'
-        }, experienceId);
-      }
-    }
-  }, [allOptions, experienceId]);
-  return jsx(PopupSelect, {
-    classNamePrefix: 'column-picker-popup',
-    testId: 'column-picker-popup',
-    components: {
-      Option: CheckboxOption,
-      MenuList: ConcatenatedMenuList
-    },
-    filterOption: createFilter({
-      ignoreAccents: false
-    }),
-    options: allOptions,
-    value: selectedOptions
-    // @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
-    ,
-    onOpen: handleOpen,
-    closeMenuOnSelect: false,
-    hideSelectedOptions: false,
-    id: 'column-picker-popup',
-    isMulti: true,
-    ref: pickerRef,
-    isOptionDisabled: handleIsOptionDisabled,
-    placeholder: intl.formatMessage(columnPickerMessages.search),
-    onKeyDown: stopEscapePropagationWhenOpen,
-    label: "Search for fields",
-    onChange: handleChange,
-    isLoading: allOptions.length === 0,
-    target: function target(_ref8) {
-      var isOpen = _ref8.isOpen,
-        triggerProps = _objectWithoutProperties(_ref8, _excluded);
-      return jsx(Tooltip, {
-        content: intl.formatMessage(columnPickerMessages.tooltip)
-      }, function (tooltipProps) {
-        return jsx(Button, _extends({}, tooltipProps, triggerProps, {
-          isSelected: isOpen,
-          spacing: "compact",
-          appearance: "subtle",
-          testId: "column-picker-trigger-button",
-          iconBefore: function iconBefore() {
-            return jsx(Box, {
-              as: "span",
-              xcss: chevronIconStyles
-            }, jsx(BoardIcon, {
-              color: "currentColor",
-              label: "board",
-              LEGACY_size: "medium",
-              spacing: "spacious",
-              LEGACY_margin: "0 0 0 4px"
-            }), jsx(ChevronDownIcon, {
-              color: "currentColor",
-              label: "down",
-              LEGACY_size: "medium"
-            }));
-          }
-        }), '');
-      });
-    }
-  });
-};

package/dist/esm/ui/issue-like-table/column-picker/concatenated-menu-list-old.js

@@ -1,43 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children"];
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import { FormattedMessage } from 'react-intl-next';
-import { components } from '@atlaskit/select';
-import { fontFallback } from '@atlaskit/theme/typography';
-import { columnPickerMessages } from './messages';
-export var SELECT_ITEMS_MAXIMUM_THRESHOLD = 200;
-var messageStyles = css({
-  color: "var(--ds-text-subtle, #44546F)",
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  font: "var(--ds-font-body-small, ".concat(fontFallback.body.small, ")"),
-  fontWeight: "var(--ds-font-weight-regular, 400)"
-});
-export var ConcatenatedMenuListOld = function ConcatenatedMenuListOld(_ref) {
-  var children = _ref.children,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var shouldUseDefaultMenuList = !children || !Array.isArray(children) || children.length <= SELECT_ITEMS_MAXIMUM_THRESHOLD;
-  if (shouldUseDefaultMenuList) {
-    return jsx(components.MenuList, props, children);
-  }
-  var optionStyle = {
-    padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-200, 16px)"),
-    height: 'auto'
-  };
-  var maximumLimitReachedMessage =
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
-  jsx("div", {
-    css: messageStyles,
-    style: optionStyle
-  }, jsx(FormattedMessage, _extends({
-    tagName: 'div'
-  }, columnPickerMessages.maximumItemsShownLine1)), jsx(FormattedMessage, _extends({
-    tagName: 'div'
-  }, columnPickerMessages.maximumItemsShownLine2)));
-  return jsx(components.MenuList, props, children.slice(0, SELECT_ITEMS_MAXIMUM_THRESHOLD), maximumLimitReachedMessage);
-};

package/dist/esm/ui/issue-like-table/drag-column-preview-old.js

@@ -1,58 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import React from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-import { N40 } from '@atlaskit/theme/colors';
-import { fontFallback } from '@atlaskit/theme/typography';
-import { TableHeading } from './styled';
-var maxWidth = '200px';
-var firstLastChildOverride = "\n  &:first-of-type, &:last-of-type {\n    padding-left: ".concat("var(--ds-space-100, 8px)", ";\n    padding-right: ", "var(--ds-space-100, 8px)", ";\n  }\n");
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
-var TablePreviewHeading = styled(TableHeading)({
-  overflow: 'hidden',
-  textOverflow: 'ellipsis',
-  whiteSpace: 'nowrap',
-  background: "var(--ds-background-disabled, #091E4224)",
-  maxWidth: maxWidth
-},
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-firstLastChildOverride);
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
-var TablePreviewCell = styled.td({
-  overflow: 'hidden',
-  textOverflow: 'ellipsis',
-  whiteSpace: 'nowrap',
-  maxWidth: maxWidth,
-  padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-100, 8px)"),
-  boxSizing: 'border-box',
-  borderBottom: "0.5px solid ".concat("var(--ds-border, ".concat(N40, ")")),
-  height: '30px'
-},
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-firstLastChildOverride);
-var tableStyles = css({
-  background: "var(--ds-surface, #FFF)",
-  borderCollapse: 'separate',
-  borderSpacing: 0,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  font: "var(--ds-font-body, ".concat(fontFallback.body.medium, ")"),
-  maxWidth: maxWidth
-});
-export var DragColumnPreviewOld = function DragColumnPreviewOld(_ref) {
-  var title = _ref.title,
-    rows = _ref.rows;
-  return jsx("table", {
-    css: tableStyles
-  }, jsx("thead", null, jsx("tr", null, jsx(TablePreviewHeading, null, title))), jsx("tbody", null, rows.map(function (data, i) {
-    return jsx("tr", {
-      key: i
-    }, jsx(TablePreviewCell, null, data));
-  }), jsx("tr", null, jsx(TablePreviewCell, null, "..."))));
-};