@atlaskit/link-datasource 1.15.2 → 1.15.4

package/dist/cjs/ui/assets-modal/search-container/index.js

@@ -36,7 +36,7 @@ var AssetsSearchContainer = exports.AssetsSearchContainer = function AssetsSearc
   return (0, _react.jsx)(_form.default, {
     onSubmit: onFormSubmit
   }, function (_ref) {
-    var _initialSearchData$ob, _initialSearchData$aq;
+    var _initialSearchData$ob, _initialSearchData$ob2, _initialSearchData$aq;
     var formProps = _ref.formProps;
     return (0, _react.jsx)(_styled.FormContainer, (0, _extends2.default)({}, formProps, {
       id: SEARCH_FORM_ID
@@ -45,6 +45,7 @@ var AssetsSearchContainer = exports.AssetsSearchContainer = function AssetsSearc
     }, modalTitle, (0, _react.jsx)(_styled.SchemaSelectContainer, null, (0, _react.jsx)(_objectSchemaSelect.AssetsObjectSchemaSelect, {
       value: (_initialSearchData$ob = initialSearchData.objectSchema) !== null && _initialSearchData$ob !== void 0 ? _initialSearchData$ob : undefined,
       workspaceId: workspaceId,
+      initialObjectSchemas: (_initialSearchData$ob2 = initialSearchData.objectSchemas) !== null && _initialSearchData$ob2 !== void 0 ? _initialSearchData$ob2 : undefined,
       classNamePrefix: "assets-datasource-modal--object-schema-select"
     }))), (0, _react.jsx)(_styled.FormRowContainer, null, (0, _react.jsx)(_aqlSearchInput.AqlSearchInput, {
       value: (_initialSearchData$aq = initialSearchData.aql) !== null && _initialSearchData$aq !== void 0 ? _initialSearchData$aq : DEFAULT_AQL_QUERY,

package/dist/cjs/ui/assets-modal/search-container/object-schema-select/index.js

@@ -9,16 +9,13 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("react");
-var _react2 = require("@emotion/react");
+var _react = require("@emotion/react");
 var _debouncePromise = _interopRequireDefault(require("debounce-promise"));
 var _reactIntlNext = require("react-intl-next");
 var _form = require("@atlaskit/form");
 var _select = require("@atlaskit/select");
 var _constants = require("@atlaskit/theme/constants");
-var _analytics = require("../../../../analytics");
 var _useObjectSchemas2 = require("../../../../hooks/useObjectSchemas");
 var _types = require("../../../../types/assets/types");
 var _styled = require("../styled");
@@ -51,74 +48,35 @@ var selectInAModalStyleFixProps = exports.selectInAModalStyleFixProps = {
 var AssetsObjectSchemaSelect = exports.AssetsObjectSchemaSelect = function AssetsObjectSchemaSelect(_ref) {
   var value = _ref.value,
     workspaceId = _ref.workspaceId,
+    initialObjectSchemas = _ref.initialObjectSchemas,
     _ref$classNamePrefix = _ref.classNamePrefix,
     classNamePrefix = _ref$classNamePrefix === void 0 ? 'assets-datasource-modal--object-schema-select' : _ref$classNamePrefix;
-  var _useState = (0, _react.useState)(null),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    defaultOptions = _useState2[0],
-    setDefaultOptions = _useState2[1];
-  var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
-    fireEvent = _useDatasourceAnalyti.fireEvent;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
   var _useObjectSchemas = (0, _useObjectSchemas2.useObjectSchemas)(workspaceId),
     fetchObjectSchemas = _useObjectSchemas.fetchObjectSchemas,
     objectSchemasLoading = _useObjectSchemas.objectSchemasLoading;
   var selectedObjectSchema = value ? (0, _utils.objectSchemaToSelectOption)(value) : undefined;
-  (0, _react.useEffect)(function () {
-    var fetchInitialData = /*#__PURE__*/function () {
-      var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-        var _yield$fetchObjectSch, objectSchemas, totalObjectSchemas;
-        return _regenerator.default.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              _context.next = 2;
-              return fetchObjectSchemas('');
-            case 2:
-              _yield$fetchObjectSch = _context.sent;
-              objectSchemas = _yield$fetchObjectSch.objectSchemas;
-              totalObjectSchemas = _yield$fetchObjectSch.totalObjectSchemas;
-              // We only want to send modal ready event once after we've fetched the schema count
-              fireEvent('ui.modal.ready.datasource', {
-                schemasCount: totalObjectSchemas !== null && totalObjectSchemas !== void 0 ? totalObjectSchemas : 0,
-                instancesCount: null
-              });
-              setDefaultOptions(mapObjectSchemasToOptions(objectSchemas));
-            case 7:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-      return function fetchInitialData() {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-    if (defaultOptions === null) {
-      fetchInitialData();
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
   var loadOptions = /*#__PURE__*/function () {
-    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(inputValue) {
-      var _yield$fetchObjectSch2, objectSchemas;
-      return _regenerator.default.wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(inputValue) {
+      var _yield$fetchObjectSch, objectSchemas;
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
           case 0:
-            _context2.next = 2;
+            _context.next = 2;
             return fetchObjectSchemas(inputValue);
           case 2:
-            _yield$fetchObjectSch2 = _context2.sent;
-            objectSchemas = _yield$fetchObjectSch2.objectSchemas;
-            return _context2.abrupt("return", mapObjectSchemasToOptions(objectSchemas));
+            _yield$fetchObjectSch = _context.sent;
+            objectSchemas = _yield$fetchObjectSch.objectSchemas;
+            return _context.abrupt("return", mapObjectSchemasToOptions(objectSchemas));
           case 5:
           case "end":
-            return _context2.stop();
+            return _context.stop();
         }
-      }, _callee2);
+      }, _callee);
     }));
     return function loadOptions(_x) {
-      return _ref3.apply(this, arguments);
+      return _ref2.apply(this, arguments);
     };
   }();
   var debouncedLoadOptions = (0, _debouncePromise.default)(loadOptions, SEARCH_DEBOUNCE_MS);
@@ -128,22 +86,22 @@ var AssetsObjectSchemaSelect = exports.AssetsObjectSchemaSelect = function Asset
     }
     return undefined;
   };
-  return (0, _react2.jsx)(_styled.FieldContainer, null, (0, _react2.jsx)(_form.Field, {
+  return (0, _react.jsx)(_styled.FieldContainer, null, (0, _react.jsx)(_form.Field, {
     name: _types.objectSchemaKey,
     defaultValue: selectedObjectSchema,
     validate: function validate(value) {
       return validateSchema(value);
     }
-  }, function (_ref4) {
-    var _ref4$fieldProps = _ref4.fieldProps,
-      _onChange = _ref4$fieldProps.onChange,
-      onFocus = _ref4$fieldProps.onFocus,
-      restFieldProps = (0, _objectWithoutProperties2.default)(_ref4$fieldProps, _excluded);
-    return (0, _react2.jsx)(_select.AsyncSelect, (0, _extends2.default)({
+  }, function (_ref3) {
+    var _ref3$fieldProps = _ref3.fieldProps,
+      _onChange = _ref3$fieldProps.onChange,
+      onFocus = _ref3$fieldProps.onFocus,
+      restFieldProps = (0, _objectWithoutProperties2.default)(_ref3$fieldProps, _excluded);
+    return (0, _react.jsx)(_select.AsyncSelect, (0, _extends2.default)({
       autoFocus: true,
       classNamePrefix: classNamePrefix,
       isLoading: objectSchemasLoading,
-      defaultOptions: defaultOptions !== null && defaultOptions !== void 0 ? defaultOptions : [],
+      defaultOptions: mapObjectSchemasToOptions(initialObjectSchemas),
       isSearchable: true,
       loadOptions: debouncedLoadOptions,
       placeholder: formatMessage(_messages.objectSchemaSelectMessages.placeholder),

package/dist/cjs/ui/issue-like-table/render-type/date-time/index.js

@@ -32,8 +32,14 @@ var DateTimeRenderType = function DateTimeRenderType(_ref) {
     testId = _ref$testId === void 0 ? DATETIME_TYPE_TEST_ID : _ref$testId,
     _ref$display = _ref.display,
     display = _ref$display === void 0 ? 'datetime' : _ref$display;
-  var date = new Date(value);
   var intl = (0, _reactIntlNext.useIntl)();
+  /* In some cases we get a value of `2023-12-20` which when parsed by JS assumes meantime timezone, causing the date
+    to be one day off in some timezones. We want it to display the date without converting timezones and a solution
+   is to replace the hyphens with slashes. So it should be 20th Dec regardless of the timezone in this case.
+    See https://stackoverflow.com/a/31732581
+   */
+  var dateValue = /^\d{4}-\d{2}-\d{2}$/.exec(value) ? value.replace(/-/g, '/') : value;
+  var date = new Date(dateValue);
   if (!value || isNaN(date.getTime())) {
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
   }

package/dist/es2019/analytics/constants.js

@@ -1,5 +1,5 @@
 export const EVENT_CHANNEL = 'media';
 export const packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.15.2"
+  packageVersion: "1.15.4"
 };

package/dist/es2019/hooks/useAssetsClient.js

@@ -1,32 +1,52 @@
 import { useEffect, useState } from 'react';
-import { fetchObjectSchema, getWorkspaceId } from '../services/cmdbService';
+import { fetchObjectSchema, fetchObjectSchemas, getWorkspaceId } from '../services/cmdbService';
+const handleAssetsClientErrors = (errorSetter, error) => {
+  if (error instanceof Error) {
+    errorSetter(error);
+  } else {
+    errorSetter(new Error('Unexpected error occured'));
+  }
+};
 export const useAssetsClient = initialParameters => {
   const [loading, setLoading] = useState(false);
   const [workspaceId, setWorkspaceId] = useState();
-  const [objectSchema, setObjectSchema] = useState();
-  const [error, setError] = useState();
+  const [workspaceError, setWorkspaceError] = useState();
+  const [existingObjectSchema, setExistingObjectSchema] = useState();
+  const [existingObjectSchemaError, setExistingObjectSchemaError] = useState();
+  const [objectSchemas, setObjectSchemas] = useState();
+  const [totalObjectSchemas, setTotalObjectSchemas] = useState();
+  const [objectSchemasError, setObjectSchemasError] = useState();
+
+  /*
+   * We wrap this in nested try/catch blocks because we want to handle
+   * workspaceError/existingObjectSchemaError/objectSchemasError differently
+   * if we need to implement more initial data fetching/errors we should look at a store
+   */
   useEffect(() => {
     (async () => {
       setLoading(true);
-      setError(undefined);
+      setWorkspaceError(undefined);
       try {
         const workspaceId = await getWorkspaceId();
         setWorkspaceId(workspaceId);
-        // Check schema from initial parameters still exists and fetch name for schema select
+        // Check schema from initial parameters still exists and fetch name/permissions for schema select
         if (initialParameters !== null && initialParameters !== void 0 && initialParameters.schemaId) {
           try {
             const fetchedObjectSchema = await fetchObjectSchema(workspaceId, initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.schemaId);
-            setObjectSchema(fetchedObjectSchema);
-          } catch {
-            // Could update this to check if status is 404 and set objectSchemaError
+            setExistingObjectSchema(fetchedObjectSchema);
+          } catch (fetchObjectSchemaError) {
+            handleAssetsClientErrors(setExistingObjectSchemaError, fetchObjectSchemaError);
           }
         }
-      } catch (err) {
-        if (err instanceof Error) {
-          setError(err);
-        } else {
-          setError(new Error('Unexpected error occured'));
+        try {
+          const fetchedObjectSchemasResponse = await fetchObjectSchemas(workspaceId);
+          setObjectSchemas(fetchedObjectSchemasResponse.values);
+          setTotalObjectSchemas(fetchedObjectSchemasResponse.total);
+        } catch (fetchObjectSchemasError) {
+          handleAssetsClientErrors(setObjectSchemasError, fetchObjectSchemasError);
         }
+      } catch (getWorkspaceIdError) {
+        handleAssetsClientErrors(setWorkspaceError, getWorkspaceIdError);
       } finally {
         setLoading(false);
       }
@@ -34,8 +54,12 @@ export const useAssetsClient = initialParameters => {
   }, [initialParameters]);
   return {
     workspaceId,
-    workspaceError: error,
-    objectSchema,
+    workspaceError,
+    existingObjectSchema,
+    existingObjectSchemaError,
+    objectSchemas,
+    totalObjectSchemas,
+    objectSchemasError,
     assetsClientLoading: loading
   };
 };

package/dist/es2019/services/cmdbService.js

@@ -1,29 +1,75 @@
 import { request } from '@atlaskit/linking-common';
+import { FetchError, getStatusCodeGroup, mapFetchErrors, PermissionError } from './cmdbService.utils';
 export const getWorkspaceId = async () => {
-  var _workspaceDetailsResp;
   const url = '/rest/servicedesk/cmdb/latest/workspace';
-  const workspaceDetailsResponse = await request('get', url, undefined, undefined, [200, 201, 202, 203, 204]);
-  if (!((_workspaceDetailsResp = workspaceDetailsResponse.results) !== null && _workspaceDetailsResp !== void 0 && _workspaceDetailsResp.length)) {
-    throw new Error('No workspace results found');
+  try {
+    var _workspaceDetailsResp;
+    const workspaceDetailsResponse = await request('get', url, undefined, undefined, [200, 201, 202, 203, 204]);
+    if (!((_workspaceDetailsResp = workspaceDetailsResponse.results) !== null && _workspaceDetailsResp !== void 0 && _workspaceDetailsResp.length)) {
+      throw new PermissionError('No workspace results found');
+    }
+    return workspaceDetailsResponse.results[0].id;
+  } catch (err) {
+    let error = mapFetchErrors(err);
+    if (error instanceof FetchError) {
+      // TODO Fire error operational event for workspace here before remapping to PermissionError
+      // Only 429 and 5xx errors will be treated as FetchErrors otherwise PermissionError
+      if (getStatusCodeGroup(error) !== '5xx' && error.statusCode !== 429) {
+        error = new PermissionError('Failed to fetch workspace');
+      }
+    }
+    throw error;
   }
-  return workspaceDetailsResponse.results[0].id;
 };
-export const validateAql = (workspaceId, data) => {
+export const validateAql = async (workspaceId, data) => {
   const url = `/gateway/api/jsm/assets/workspace/${workspaceId}/v1/aql/validate`;
-  return request('post', url, {
-    qlQuery: data.qlQuery,
-    context: 'SMART_LINKS'
-  }, undefined, [200, 201, 202, 203, 204]);
+  try {
+    return await request('post', url, {
+      qlQuery: data.qlQuery,
+      context: 'SMART_LINKS'
+    }, undefined, [200, 201, 202, 203, 204]);
+  } catch (err) {
+    let error = mapFetchErrors(err);
+    if (error instanceof FetchError) {
+      // TODO Fire error operational event for aql here before remapping to PermissionError
+      if (error.statusCode === 401 || error.statusCode === 403) {
+        error = new PermissionError('Failed to fetch object schemas');
+      }
+    }
+    throw error;
+  }
 };
-export const fetchObjectSchema = (workspaceId, schemaId) => {
+export const fetchObjectSchema = async (workspaceId, schemaId) => {
   const url = `/gateway/api/jsm/assets/workspace/${workspaceId}/v1/objectschema/${schemaId}`;
-  return request('get', url, undefined, undefined, [200, 201, 202, 203, 204]);
+  try {
+    return await request('get', url, undefined, undefined, [200, 201, 202, 203, 204]);
+  } catch (err) {
+    let error = mapFetchErrors(err);
+    if (error instanceof FetchError) {
+      // TODO Fire error operational event for object schema here before remapping to PermissionError
+      if (error.statusCode === 401 || error.statusCode === 403) {
+        error = new PermissionError('Failed to fetch object schemas');
+      }
+    }
+    throw error;
+  }
 };
-export const fetchObjectSchemas = (workspaceId, query) => {
+export const fetchObjectSchemas = async (workspaceId, query) => {
   const queryParams = new URLSearchParams();
   queryParams.set('maxResults', '20');
   queryParams.set('includeCounts', 'false');
   query && queryParams.set('query', query);
   const url = `/gateway/api/jsm/assets/workspace/${workspaceId}/v1/objectschema/list?${queryParams}`;
-  return request('get', url, undefined, undefined, [200, 201, 202, 203, 204]);
+  try {
+    return await request('get', url, undefined, undefined, [200, 201, 202, 203, 204]);
+  } catch (err) {
+    let error = mapFetchErrors(err);
+    if (error instanceof FetchError) {
+      // TODO Fire error operational event for object schemas here before remapping to PermissionError
+      if (error.statusCode === 401 || error.statusCode === 403) {
+        error = new PermissionError('Failed to fetch object schemas');
+      }
+    }
+    throw error;
+  }
 };

package/dist/es2019/services/cmdbService.utils.js

@@ -0,0 +1,39 @@
+export const mapFetchErrors = error => {
+  if (error instanceof Response && !error.ok) {
+    return new FetchError(error.status, `Error server response: ${error.status}`);
+  }
+  return error;
+};
+export const getStatusCodeGroup = error => {
+  if (error instanceof FetchError) {
+    const {
+      statusCode
+    } = error;
+    if (statusCode >= 100 && statusCode < 200) {
+      return '1xx';
+    }
+    if (statusCode >= 300 && statusCode < 400) {
+      return '3xx';
+    }
+    if (statusCode >= 400 && statusCode < 500) {
+      return '4xx';
+    }
+    if (statusCode >= 500 && statusCode < 600) {
+      return '5xx';
+    }
+  }
+  return 'unknown';
+};
+export class PermissionError extends Error {
+  constructor(message) {
+    super(message);
+    this.name = 'PermissionError';
+  }
+}
+export class FetchError extends Error {
+  constructor(statusCode, message) {
+    super(message || `Fetch call failed with status code: ${statusCode}`);
+    this.name = 'FetchError';
+    this.statusCode = statusCode;
+  }
+}

package/dist/es2019/ui/assets-modal/modal/index.js

@@ -18,6 +18,8 @@ import { fetchMessagesForLocale } from '../../../common/utils/locale/fetch-messa
 import { useAssetsClient } from '../../../hooks/useAssetsClient';
 import { useDatasourceTableState } from '../../../hooks/useDatasourceTableState';
 import i18nEN from '../../../i18n/en';
+import { PermissionError } from '../../../services/cmdbService.utils';
+import { AccessRequired } from '../../../ui/common/error-state/access-required';
 import { ModalLoadingError } from '../../common/error-state/modal-loading-error';
 import { AssetsSearchContainer } from '../search-container';
 import { AssetsSearchContainerLoading } from '../search-container/loading-state';
@@ -28,6 +30,9 @@ const modalBodyWrapperStyles = css({
   height: '420px',
   overflow: 'auto'
 });
+const modalBodyErrorWrapperStyles = css({
+  alignItems: 'center'
+});
 const AssetsModalTitle = jsx(ModalTitle, null, jsx(FormattedMessage, modalMessages.insertObjectsTitle));
 const PlainAssetsConfigModal = props => {
   const {
@@ -41,20 +46,53 @@ const PlainAssetsConfigModal = props => {
   const [schemaId, setSchemaId] = useState(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.schemaId);
   const [visibleColumnKeys, setVisibleColumnKeys] = useState(initialVisibleColumnKeys);
   const [isNewSearch, setIsNewSearch] = useState(false);
+  const [errorState, setErrorState] = useState();
   const {
     fireEvent
   } = useDatasourceAnalyticsEvents();
   const {
     current: modalRenderInstanceId
   } = useRef(uuidv4());
-
-  // If a workspaceError occurs this is a critical error
   const {
     workspaceId,
     workspaceError,
-    objectSchema,
+    existingObjectSchema,
+    existingObjectSchemaError,
+    objectSchemas,
+    objectSchemasError,
+    totalObjectSchemas,
     assetsClientLoading
   } = useAssetsClient(initialParameters);
+
+  /* ------------------------------ PERMISSIONS ------------------------------ */
+  useEffect(() => {
+    if (workspaceError) {
+      // If a workspaceError occurs this is a critical error
+      if (workspaceError instanceof PermissionError) {
+        setErrorState('permission');
+      } else {
+        setErrorState('network');
+      }
+    }
+  }, [workspaceError]);
+  useEffect(() => {
+    if (objectSchemasError) {
+      // We only care about permission errors for objectSchemas fetching as the user can retry this action
+      if (objectSchemasError instanceof PermissionError) {
+        setErrorState('permission');
+      }
+    }
+  }, [objectSchemasError]);
+  useEffect(() => {
+    if (existingObjectSchemaError) {
+      // We only care about permission errors for existingObjectSchema fetching as the user can retry this action
+      if (existingObjectSchemaError instanceof PermissionError) {
+        setErrorState('permission');
+      }
+    }
+  }, [existingObjectSchemaError]);
+  /* ------------------------------ END PERMISSIONS ------------------------------ */
+
   const parameters = useMemo(() => ({
     aql: aql || '',
     schemaId: schemaId || '',
@@ -90,6 +128,15 @@ const PlainAssetsConfigModal = props => {
       destinationObjectTypes: destinationObjectTypes
     };
   }, [destinationObjectTypes, extensionKey]);
+  useEffect(() => {
+    // We only want to send modal ready event once after we've fetched the schema count
+    if (totalObjectSchemas !== undefined) {
+      fireEvent('ui.modal.ready.datasource', {
+        schemasCount: totalObjectSchemas,
+        instancesCount: null
+      });
+    }
+  }, [fireEvent, totalObjectSchemas]);
   useEffect(() => {
     fireEvent('screen.datasourceModalDialog.viewed', {});
   }, [fireEvent]);
@@ -144,7 +191,7 @@ const PlainAssetsConfigModal = props => {
       setVisibleColumnKeys(defaultVisibleColumnKeys);
     }
   }, [defaultVisibleColumnKeys, isNewSearch]);
-  const isDisabled = !!workspaceError || status !== 'resolved' || assetsClientLoading || !aql || !schemaId;
+  const isDisabled = !!errorState || status !== 'resolved' || assetsClientLoading || !aql || !schemaId;
   const retrieveUrlForSmartCardRender = useCallback(() => {
     var _data$key, _data$key$data;
     const [data] = responseItems;
@@ -232,8 +279,20 @@ const PlainAssetsConfigModal = props => {
       setIsNewSearch(true);
     }
   }, [aql, reset, schemaId, status]);
+  const renderErrorState = useCallback(() => {
+    if (errorState) {
+      switch (errorState) {
+        case 'permission':
+          return jsx(AccessRequired, null);
+        case 'network':
+          return jsx(ModalLoadingError, null);
+        default:
+          return jsx(ModalLoadingError, null);
+      }
+    }
+  }, [errorState]);
   const renderModalTitleContent = useCallback(() => {
-    if (workspaceError) {
+    if (errorState) {
       return undefined;
     } else {
       if (!workspaceId || assetsClientLoading) {
@@ -245,14 +304,15 @@ const PlainAssetsConfigModal = props => {
         workspaceId: workspaceId,
         initialSearchData: {
           aql,
-          objectSchema
+          objectSchema: existingObjectSchema,
+          objectSchemas
         },
         onSearch: handleOnSearch,
         modalTitle: AssetsModalTitle,
         isSearching: status === 'loading'
       });
     }
-  }, [aql, assetsClientLoading, handleOnSearch, objectSchema, status, workspaceError, workspaceId]);
+  }, [errorState, workspaceId, assetsClientLoading, aql, existingObjectSchema, objectSchemas, handleOnSearch, status]);
   return jsx(IntlMessagesProvider, {
     defaultMessages: i18nEN,
     loaderFn: fetchMessagesForLocale
@@ -263,8 +323,9 @@ const PlainAssetsConfigModal = props => {
     shouldScrollInViewport: true,
     shouldCloseOnOverlayClick: false
   }, jsx(ModalHeader, null, renderModalTitleContent()), jsx(ModalBody, null, jsx("div", {
-    css: modalBodyWrapperStyles
-  }, workspaceError ? jsx(ModalLoadingError, null) : jsx(RenderAssetsContent, {
+    css: [modalBodyWrapperStyles, errorState && modalBodyErrorWrapperStyles]
+  }, errorState ? renderErrorState() : jsx(RenderAssetsContent, {
+    isFetchingInitialData: assetsClientLoading,
     status: status,
     responseItems: responseItems,
     visibleColumnKeys: visibleColumnKeys,

package/dist/es2019/ui/assets-modal/modal/render-assets-content/index.js

@@ -1,9 +1,16 @@
-import React, { useMemo } from 'react';
+/** @jsx jsx */
+import { useMemo } from 'react';
+import { css, jsx } from '@emotion/react';
 import { AccessRequired } from '../../../common/error-state/access-required';
 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 { InitialStateView } from './initial-state-view';
+// This is to prevent y scrollbar when initially fetching data
+const emptyStateOverrideStyles = css({
+  height: '420px',
+  overflow: 'hidden'
+});
 export const RenderAssetsContent = props => {
   const {
     status,
@@ -15,10 +22,11 @@ export const RenderAssetsContent = props => {
     columns,
     defaultVisibleColumnKeys,
     onVisibleColumnKeysChange,
-    modalRenderInstanceId
+    modalRenderInstanceId,
+    isFetchingInitialData
   } = props;
   const resolvedWithNoResults = status === 'resolved' && !responseItems.length;
-  const issueLikeDataTableView = useMemo(() => /*#__PURE__*/React.createElement(IssueLikeDataTableView, {
+  const issueLikeDataTableView = useMemo(() => jsx(IssueLikeDataTableView, {
     testId: "asset-datasource-table",
     status: status,
     columns: columns,
@@ -30,16 +38,23 @@ export const RenderAssetsContent = props => {
     onVisibleColumnKeysChange: onVisibleColumnKeysChange,
     parentContainerRenderInstanceId: modalRenderInstanceId
   }), [columns, defaultVisibleColumnKeys, hasNextPage, loadDatasourceDetails, onNextPage, onVisibleColumnKeysChange, responseItems, status, visibleColumnKeys, modalRenderInstanceId]);
-  if (status === 'rejected') {
-    return /*#__PURE__*/React.createElement(ModalLoadingError, null);
+  if (isFetchingInitialData) {
+    // Placing this check first as it's a priority before all others
+    return jsx("div", {
+      css: emptyStateOverrideStyles
+    }, jsx(EmptyState, {
+      testId: "assets-aql-datasource-modal--loading-state"
+    }));
+  } else if (status === 'rejected') {
+    return jsx(ModalLoadingError, null);
   } else if (status === 'unauthorized') {
-    return /*#__PURE__*/React.createElement(AccessRequired, null);
+    return jsx(AccessRequired, null);
   } else if (status === 'empty') {
-    return /*#__PURE__*/React.createElement(InitialStateView, null);
+    return jsx(InitialStateView, null);
   } else if (resolvedWithNoResults) {
-    return /*#__PURE__*/React.createElement(NoResults, null);
+    return jsx(NoResults, null);
   } else if (status === 'loading' && !columns.length) {
-    return /*#__PURE__*/React.createElement(EmptyState, {
+    return jsx(EmptyState, {
       testId: "assets-aql-datasource-modal--loading-state"
     });
   }

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

@@ -35,7 +35,7 @@ export const AssetsSearchContainer = props => {
   }, ({
     formProps
   }) => {
-    var _initialSearchData$ob, _initialSearchData$aq;
+    var _initialSearchData$ob, _initialSearchData$ob2, _initialSearchData$aq;
     return jsx(FormContainer, _extends({}, formProps, {
       id: SEARCH_FORM_ID
     }), jsx(FormRowContainer, {
@@ -43,6 +43,7 @@ export const AssetsSearchContainer = props => {
     }, modalTitle, jsx(SchemaSelectContainer, null, jsx(AssetsObjectSchemaSelect, {
       value: (_initialSearchData$ob = initialSearchData.objectSchema) !== null && _initialSearchData$ob !== void 0 ? _initialSearchData$ob : undefined,
       workspaceId: workspaceId,
+      initialObjectSchemas: (_initialSearchData$ob2 = initialSearchData.objectSchemas) !== null && _initialSearchData$ob2 !== void 0 ? _initialSearchData$ob2 : undefined,
       classNamePrefix: "assets-datasource-modal--object-schema-select"
     }))), jsx(FormRowContainer, null, jsx(AqlSearchInput, {
       value: (_initialSearchData$aq = initialSearchData.aql) !== null && _initialSearchData$aq !== void 0 ? _initialSearchData$aq : DEFAULT_AQL_QUERY,