@atlaskit/link-datasource 0.21.2 → 0.22.0

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

@@ -11,6 +11,8 @@ import Modal, { ModalBody, ModalFooter, ModalHeader, ModalTitle, ModalTransition
 import { B400, N0, N800 } from '@atlaskit/theme/colors';
 import { useDatasourceTableState } from '../../../hooks/useDatasourceTableState';
 import { getAvailableJiraSites } from '../../../services/getAvailableJiraSites';
+import { ModalLoadingError } from '../../common/error-state/modal-loading-error';
+import { NoResults } from '../../common/error-state/no-results';
 import { EmptyState, IssueLikeDataTableView } from '../../issue-like-table';
 import LinkRenderType from '../../issue-like-table/render-type/link';
 import { JiraSearchContainer } from '../jira-search-container';
@@ -22,6 +24,7 @@ var dropdownContainerStyles = css({
   gap: "var(--ds-space-100, 0.5rem)"
 });
 var contentContainerStyles = css({
+  display: 'grid',
   height: '420px',
   overflow: 'auto'
 });
@@ -37,6 +40,9 @@ var issueCountStyles = css({
   flex: 1,
   fontWeight: 600
 });
+var smartLinkContainerStyles = css({
+  paddingLeft: '1px'
+});
 export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
   var datasourceId = props.datasourceId,
     initialParameters = props.parameters,
@@ -84,12 +90,21 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
     defaultVisibleColumnKeys = _useDatasourceTableSt.defaultVisibleColumnKeys,
     loadDatasourceDetails = _useDatasourceTableSt.loadDatasourceDetails,
     totalCount = _useDatasourceTableSt.totalCount;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  var selectedJiraSite = useMemo(function () {
+    return availableSites.find(function (jiraSite) {
+      return jiraSite.cloudId === cloudId;
+    }) || availableSites[0];
+  }, [availableSites, cloudId]);
+  var resolvedWithNoResults = status === 'resolved' && !responseItems.length;
+  var jqlUrl = selectedJiraSite && jql && "".concat(selectedJiraSite.url, "/issues/?jql=").concat(encodeURI(jql));
+  var isDisabled = !isParametersSet || status === 'rejected' || status === 'loading' || resolvedWithNoResults;
+  var shouldShowIssueCount = !!totalCount && totalCount !== 1 && currentViewMode === 'issue';
   useEffect(function () {
     var newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [initialVisibleColumnKeys, defaultVisibleColumnKeys]);
-  var _useIntl = useIntl(),
-    formatMessage = _useIntl.formatMessage;
   useEffect(function () {
     var fetchSiteDisplayNames = /*#__PURE__*/function () {
       var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
@@ -114,6 +129,11 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
     }();
     void fetchSiteDisplayNames();
   }, []);
+  useEffect(function () {
+    if (!cloudId && selectedJiraSite) {
+      setCloudId(selectedJiraSite.cloudId);
+    }
+  }, [cloudId, selectedJiraSite]);
   var onSearch = useCallback(function (newParameters) {
     setJql(newParameters.jql);
     reset();
@@ -122,16 +142,6 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
     setCloudId(site.cloudId);
     reset();
   }, [reset]);
-  var selectedJiraSite = useMemo(function () {
-    return availableSites.find(function (jiraSite) {
-      return jiraSite.cloudId === cloudId;
-    }) || availableSites[0];
-  }, [availableSites, cloudId]);
-  useEffect(function () {
-    if (!cloudId && selectedJiraSite) {
-      setCloudId(selectedJiraSite.cloudId);
-    }
-  }, [cloudId, selectedJiraSite]);
   var retrieveUrlForSmartCardRender = useCallback(function () {
     var _data$key, _data$key$data;
     var _responseItems = _slicedToArray(responseItems, 1),
@@ -148,7 +158,7 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
       onInsert({
         type: 'inlineCard',
         attrs: {
-          url: "".concat(selectedJiraSite.url, "/issues/?jql=").concat(encodeURI(jql))
+          url: jqlUrl
         }
       });
     } else if (responseItems.length === 1 && firstIssueUrl) {
@@ -179,7 +189,7 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
         }
       });
     }
-  }, [isParametersSet, jql, selectedJiraSite, retrieveUrlForSmartCardRender, currentViewMode, responseItems.length, onInsert, datasourceId, cloudId, visibleColumnKeys]);
+  }, [isParametersSet, jql, jqlUrl, selectedJiraSite, retrieveUrlForSmartCardRender, currentViewMode, responseItems.length, onInsert, datasourceId, cloudId, visibleColumnKeys]);
   var handleViewModeChange = function handleViewModeChange(selectedMode) {
     setCurrentViewMode(selectedMode);
   };
@@ -199,31 +209,43 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
   var renderCountModeContent = useCallback(function () {
     var url = selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.url;
     if (status === 'empty' || !jql || !url) {
-      return jsx("span", {
+      return jsx("div", {
+        css: smartLinkContainerStyles
+      }, jsx("span", {
         "data-testid": "jira-jql-datasource-modal--smart-card-placeholder",
         css: placeholderSmartLinkStyles
-      }, jsx(FormattedMessage, modalMessages.issuesCountSmartCardPlaceholderText));
+      }, jsx(FormattedMessage, modalMessages.issuesCountSmartCardPlaceholderText)));
     } else {
       var urlWithEncodedJql = "".concat(url, "/issues/?jql=").concat(encodeURI(jql));
-      return jsx(LinkRenderType, {
+      return jsx("div", {
+        css: smartLinkContainerStyles
+      }, jsx(LinkRenderType, {
         url: urlWithEncodedJql
-      });
+      }));
     }
   }, [jql, selectedJiraSite === null || selectedJiraSite === void 0 ? void 0 : selectedJiraSite.url, status]);
   var renderIssuesModeContent = useCallback(function () {
-    if (status === 'empty' || columns.length === 0) {
+    if (status === 'empty') {
       return jsx(EmptyState, {
         testId: "jira-jql-datasource-modal--empty-state"
       });
+    } else if (resolvedWithNoResults) {
+      return jsx(NoResults, null);
+    } else if (status === 'rejected' && jqlUrl) {
+      return jsx(ModalLoadingError, {
+        url: jqlUrl
+      });
     }
     var firstIssueUrl = retrieveUrlForSmartCardRender();
     if (responseItems.length === 1 && firstIssueUrl) {
-      return jsx(LinkRenderType, {
+      return jsx("div", {
+        css: smartLinkContainerStyles
+      }, jsx(LinkRenderType, {
         url: firstIssueUrl
-      });
+      }));
     }
     return issueLikeDataTableView;
-  }, [columns.length, issueLikeDataTableView, responseItems.length, retrieveUrlForSmartCardRender, status]);
+  }, [issueLikeDataTableView, jqlUrl, responseItems.length, resolvedWithNoResults, retrieveUrlForSmartCardRender, status]);
   return jsx(IntlProvider, {
     locale: "en"
   }, jsx(ModalTransition, null, jsx(Modal, {
@@ -258,7 +280,7 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
     onSearch: onSearch
   }), jsx("div", {
     css: contentContainerStyles
-  }, currentViewMode === 'count' ? renderCountModeContent() : renderIssuesModeContent())), jsx(ModalFooter, null, !!totalCount && currentViewMode === 'issue' && jsx("div", {
+  }, currentViewMode === 'count' ? renderCountModeContent() : renderIssuesModeContent())), jsx(ModalFooter, null, shouldShowIssueCount && jsx("div", {
     "data-testid": "jira-jql-datasource-modal-total-issues-count",
     css: issueCountStyles
   }, jsx(FormattedNumber, {
@@ -273,7 +295,7 @@ export var JiraIssuesConfigModal = function JiraIssuesConfigModal(props) {
   }, jsx(FormattedMessage, modalMessages.cancelButtonText)), jsx(Button, {
     appearance: "primary",
     onClick: onInsertPressed,
-    isDisabled: !isParametersSet || status === 'loading',
+    isDisabled: isDisabled,
     testId: 'jira-jql-datasource-modal--insert-button'
   }, jsx(FormattedMessage, modalMessages.insertIssuesButtonText))))));
 };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "0.21.2",
+	"version": "0.22.0",
 	"sideEffects": false
 }

package/dist/types/ui/common/error-state/loading-error-svg.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const LoadingErrorSVG: () => JSX.Element;

package/dist/types/ui/common/error-state/loading-error.d.ts

@@ -0,0 +1,7 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+interface LoadingErrorProps {
+    onRefresh?: () => void;
+}
+export declare const LoadingError: ({ onRefresh }: LoadingErrorProps) => jsx.JSX.Element;
+export {};

package/dist/types/ui/common/error-state/messages.d.ts

@@ -0,0 +1,37 @@
+export declare const loadingErrorMessages: {
+    checkConnection: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    checkConnectionWithSource: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    noResultsFound: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    openInProject: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    refresh: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    unableToLoadIssues: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    unableToLoadResults: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+};

package/dist/types/ui/common/error-state/modal-loading-error.d.ts

@@ -0,0 +1,7 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+interface ModalLoadingErrorProps {
+    url: string;
+}
+export declare const ModalLoadingError: ({ url }: ModalLoadingErrorProps) => jsx.JSX.Element;
+export {};

package/dist/types/ui/common/error-state/no-results.d.ts

@@ -0,0 +1,7 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+interface NoResultsProps {
+    onRefresh?: () => void;
+}
+export declare const NoResults: ({ onRefresh }: NoResultsProps) => jsx.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/common/error-state/loading-error-svg.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const LoadingErrorSVG: () => JSX.Element;

package/dist/types-ts4.5/ui/common/error-state/loading-error.d.ts

@@ -0,0 +1,7 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+interface LoadingErrorProps {
+    onRefresh?: () => void;
+}
+export declare const LoadingError: ({ onRefresh }: LoadingErrorProps) => jsx.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/common/error-state/messages.d.ts

@@ -0,0 +1,37 @@
+export declare const loadingErrorMessages: {
+    checkConnection: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    checkConnectionWithSource: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    noResultsFound: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    openInProject: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    refresh: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    unableToLoadIssues: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+    unableToLoadResults: {
+        id: string;
+        description: string;
+        defaultMessage: string;
+    };
+};

package/dist/types-ts4.5/ui/common/error-state/modal-loading-error.d.ts

@@ -0,0 +1,7 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+interface ModalLoadingErrorProps {
+    url: string;
+}
+export declare const ModalLoadingError: ({ url }: ModalLoadingErrorProps) => jsx.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/common/error-state/no-results.d.ts

@@ -0,0 +1,7 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+interface NoResultsProps {
+    onRefresh?: () => void;
+}
+export declare const NoResults: ({ onRefresh }: NoResultsProps) => jsx.JSX.Element;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-datasource",
-  "version": "0.21.2",
+  "version": "0.22.0",
   "description": "UI Components to support linking platform dataset feature",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"