@atlaskit/link-datasource 1.0.9 → 1.0.10

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/link-datasource
 
+## 1.0.10
+
+### Patch Changes
+
+- [`4994b59823e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4994b59823e) - [ux] Fix assets modal columns to reset when changing schema
+
 ## 1.0.9
 
 ### Patch Changes

package/dist/cjs/hooks/useDatasourceTableState.js

@@ -203,15 +203,17 @@ var useDatasourceTableState = function useDatasourceTableState(_ref) {
       }
     }, _callee2, null, [[8, 30]]);
   })), [parameters, fieldKeys, getDatasourceData, datasourceId, nextCursor, applySchemaProperties]);
-  var reset = (0, _react.useCallback)(function () {
-    var shouldForceRequest = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  var reset = (0, _react.useCallback)(function (options) {
     setStatus('empty');
     setResponseItems([]);
     setHasNextPage(true);
     setNextCursor(undefined);
     setTotalCount(undefined);
     setLastRequestedFieldKeys([]);
-    setShouldForceRequest(shouldForceRequest);
+    setShouldForceRequest((options === null || options === void 0 ? void 0 : options.shouldForceRequest) || false);
+    if (options !== null && options !== void 0 && options.shouldResetColumns) {
+      setColumns([]);
+    }
   }, []);
 
   // this takes care of requesting /data initally

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

@@ -48,6 +48,10 @@ var AssetsConfigModal = function AssetsConfigModal(props) {
     _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
     visibleColumnKeys = _useState6[0],
     setVisibleColumnKeys = _useState6[1];
+  var _useState7 = (0, _react.useState)(false),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    isNewSearch = _useState8[0],
+    setIsNewSearch = _useState8[1];
 
   // If a workspaceError occurs this is a critical error
   var _useAssetsClient = (0, _useAssetsClient2.useAssetsClient)(initialParameters),
@@ -66,7 +70,7 @@ var AssetsConfigModal = function AssetsConfigModal(props) {
   var _useDatasourceTableSt = (0, _useDatasourceTableState.useDatasourceTableState)({
       datasourceId: datasourceId,
       parameters: isParametersSet ? parameters : undefined,
-      fieldKeys: visibleColumnKeys
+      fieldKeys: isNewSearch ? [] : visibleColumnKeys
     }),
     status = _useDatasourceTableSt.status,
     onNextPage = _useDatasourceTableSt.onNextPage,
@@ -78,16 +82,28 @@ var AssetsConfigModal = function AssetsConfigModal(props) {
     defaultVisibleColumnKeys = _useDatasourceTableSt.defaultVisibleColumnKeys;
   var onVisibleColumnKeysChange = (0, _react.useCallback)(function (visibleColumnKeys) {
     setVisibleColumnKeys(visibleColumnKeys);
+    setIsNewSearch(false);
   }, []);
   (0, _react.useEffect)(function () {
     var newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [initialVisibleColumnKeys, defaultVisibleColumnKeys]);
+  (0, _react.useEffect)(function () {
+    var _responseItems = (0, _slicedToArray2.default)(responseItems, 1),
+      data = _responseItems[0];
+    if (data && isNewSearch) {
+      setVisibleColumnKeys(Object.keys(data));
+    } else if (data && (visibleColumnKeys || []).length) {
+      setVisibleColumnKeys(visibleColumnKeys);
+    }
+    // Purposely not included 'visibleColumnKeys' as a dependency to prevent infinite loop
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [responseItems, isNewSearch]);
   var isDisabled = !!workspaceError || status === 'rejected' || status === 'loading' || status === 'empty' || !!workspaceError || assetsClientLoading || !aql || !schemaId;
   var retrieveUrlForSmartCardRender = (0, _react.useCallback)(function () {
     var _data$key, _data$key$data;
-    var _responseItems = (0, _slicedToArray2.default)(responseItems, 1),
-      data = _responseItems[0];
+    var _responseItems2 = (0, _slicedToArray2.default)(responseItems, 1),
+      data = _responseItems2[0];
     // agreement with BE that we will use `key` for rendering smartlink
     return data === null || data === void 0 ? void 0 : (_data$key = data.key) === null || _data$key === void 0 ? void 0 : (_data$key$data = _data$key.data) === null || _data$key$data === void 0 ? void 0 : _data$key$data.url;
   }, [responseItems]);
@@ -129,11 +145,22 @@ var AssetsConfigModal = function AssetsConfigModal(props) {
       });
     }
   }, [aql, schemaId, workspaceId, retrieveUrlForSmartCardRender, responseItems.length, onInsert, datasourceId, visibleColumnKeys]);
-  var handleOnSearch = (0, _react.useCallback)(function (aql, schemaId) {
-    reset();
-    setAql(aql);
-    setSchemaId(schemaId);
-  }, [reset]);
+  var handleOnSearch = (0, _react.useCallback)(function (searchAql, searchSchemaId) {
+    if (schemaId !== searchSchemaId) {
+      reset({
+        shouldResetColumns: true
+      });
+      setAql(searchAql);
+      setSchemaId(searchSchemaId);
+      setIsNewSearch(true);
+      loadDatasourceDetails();
+    }
+    if (aql !== searchAql) {
+      reset();
+      setAql(searchAql);
+      setSchemaId(searchSchemaId);
+    }
+  }, [aql, loadDatasourceDetails, reset, schemaId]);
   var renderModalTitleContent = (0, _react.useCallback)(function () {
     if (workspaceError) {
       return undefined;

package/dist/cjs/ui/datasource-table-view/datasourceTableView.js

@@ -53,7 +53,9 @@ var DatasourceTableView = function DatasourceTableView(_ref) {
     }
   }, [visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange]);
   var forcedReset = (0, _react.useCallback)(function () {
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   if (status === 'resolved' && !responseItems.length) {
     return (0, _react2.jsx)(_noResults.NoResults, {

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

@@ -160,11 +160,15 @@ var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(props) {
   }, [cloudId, selectedJiraSite]);
   var onSearch = (0, _react.useCallback)(function (newParameters) {
     setJql(newParameters.jql);
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   var onSiteSelection = (0, _react.useCallback)(function (site) {
     setCloudId(site.cloudId);
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   var retrieveUrlForSmartCardRender = (0, _react.useCallback)(function () {
     var _data$key, _data$key$data;
@@ -344,7 +348,7 @@ var analyticsContextAttributes = {
 };
 var analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.0.9",
+  packageVersion: "1.0.10",
   source: 'datasourceConfigModal'
 };
 var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {

package/dist/es2019/hooks/useDatasourceTableState.js

@@ -116,14 +116,17 @@ export const useDatasourceTableState = ({
       setStatus('rejected');
     }
   }, [parameters, fieldKeys, getDatasourceData, datasourceId, nextCursor, applySchemaProperties]);
-  const reset = useCallback((shouldForceRequest = false) => {
+  const reset = useCallback(options => {
     setStatus('empty');
     setResponseItems([]);
     setHasNextPage(true);
     setNextCursor(undefined);
     setTotalCount(undefined);
     setLastRequestedFieldKeys([]);
-    setShouldForceRequest(shouldForceRequest);
+    setShouldForceRequest((options === null || options === void 0 ? void 0 : options.shouldForceRequest) || false);
+    if (options !== null && options !== void 0 && options.shouldResetColumns) {
+      setColumns([]);
+    }
   }, []);
 
   // this takes care of requesting /data initally

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

@@ -29,6 +29,7 @@ export const AssetsConfigModal = props => {
   const [aql, setAql] = useState(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.aql);
   const [schemaId, setSchemaId] = useState(initialParameters === null || initialParameters === void 0 ? void 0 : initialParameters.schemaId);
   const [visibleColumnKeys, setVisibleColumnKeys] = useState(initialVisibleColumnKeys);
+  const [isNewSearch, setIsNewSearch] = useState(false);
 
   // If a workspaceError occurs this is a critical error
   const {
@@ -55,15 +56,26 @@ export const AssetsConfigModal = props => {
   } = useDatasourceTableState({
     datasourceId,
     parameters: isParametersSet ? parameters : undefined,
-    fieldKeys: visibleColumnKeys
+    fieldKeys: isNewSearch ? [] : visibleColumnKeys
   });
   const onVisibleColumnKeysChange = useCallback(visibleColumnKeys => {
     setVisibleColumnKeys(visibleColumnKeys);
+    setIsNewSearch(false);
   }, []);
   useEffect(() => {
     const newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [initialVisibleColumnKeys, defaultVisibleColumnKeys]);
+  useEffect(() => {
+    const [data] = responseItems;
+    if (data && isNewSearch) {
+      setVisibleColumnKeys(Object.keys(data));
+    } else if (data && (visibleColumnKeys || []).length) {
+      setVisibleColumnKeys(visibleColumnKeys);
+    }
+    // Purposely not included 'visibleColumnKeys' as a dependency to prevent infinite loop
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [responseItems, isNewSearch]);
   const isDisabled = !!workspaceError || status === 'rejected' || status === 'loading' || status === 'empty' || !!workspaceError || assetsClientLoading || !aql || !schemaId;
   const retrieveUrlForSmartCardRender = useCallback(() => {
     var _data$key, _data$key$data;
@@ -107,11 +119,22 @@ export const AssetsConfigModal = props => {
       });
     }
   }, [aql, schemaId, workspaceId, retrieveUrlForSmartCardRender, responseItems.length, onInsert, datasourceId, visibleColumnKeys]);
-  const handleOnSearch = useCallback((aql, schemaId) => {
-    reset();
-    setAql(aql);
-    setSchemaId(schemaId);
-  }, [reset]);
+  const handleOnSearch = useCallback((searchAql, searchSchemaId) => {
+    if (schemaId !== searchSchemaId) {
+      reset({
+        shouldResetColumns: true
+      });
+      setAql(searchAql);
+      setSchemaId(searchSchemaId);
+      setIsNewSearch(true);
+      loadDatasourceDetails();
+    }
+    if (aql !== searchAql) {
+      reset();
+      setAql(searchAql);
+      setSchemaId(searchSchemaId);
+    }
+  }, [aql, loadDatasourceDetails, reset, schemaId]);
   const renderModalTitleContent = useCallback(() => {
     if (workspaceError) {
       return undefined;

package/dist/es2019/ui/datasource-table-view/datasourceTableView.js

@@ -47,7 +47,9 @@ export const DatasourceTableView = ({
     }
   }, [visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange]);
   const forcedReset = useCallback(() => {
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   if (status === 'resolved' && !responseItems.length) {
     return jsx(NoResults, {

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

@@ -112,11 +112,15 @@ export const PlainJiraIssuesConfigModal = props => {
   }, [cloudId, selectedJiraSite]);
   const onSearch = useCallback(newParameters => {
     setJql(newParameters.jql);
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   const onSiteSelection = useCallback(site => {
     setCloudId(site.cloudId);
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   const retrieveUrlForSmartCardRender = useCallback(() => {
     var _data$key, _data$key$data;
@@ -290,7 +294,7 @@ const analyticsContextAttributes = {
 };
 const analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.0.9",
+  packageVersion: "1.0.10",
   source: 'datasourceConfigModal'
 };
 const contextData = {

package/dist/esm/hooks/useDatasourceTableState.js

@@ -196,15 +196,17 @@ export var useDatasourceTableState = function useDatasourceTableState(_ref) {
       }
     }, _callee2, null, [[8, 30]]);
   })), [parameters, fieldKeys, getDatasourceData, datasourceId, nextCursor, applySchemaProperties]);
-  var reset = useCallback(function () {
-    var shouldForceRequest = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  var reset = useCallback(function (options) {
     setStatus('empty');
     setResponseItems([]);
     setHasNextPage(true);
     setNextCursor(undefined);
     setTotalCount(undefined);
     setLastRequestedFieldKeys([]);
-    setShouldForceRequest(shouldForceRequest);
+    setShouldForceRequest((options === null || options === void 0 ? void 0 : options.shouldForceRequest) || false);
+    if (options !== null && options !== void 0 && options.shouldResetColumns) {
+      setColumns([]);
+    }
   }, []);
 
   // this takes care of requesting /data initally

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

@@ -37,6 +37,10 @@ export var AssetsConfigModal = function AssetsConfigModal(props) {
     _useState6 = _slicedToArray(_useState5, 2),
     visibleColumnKeys = _useState6[0],
     setVisibleColumnKeys = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    isNewSearch = _useState8[0],
+    setIsNewSearch = _useState8[1];
 
   // If a workspaceError occurs this is a critical error
   var _useAssetsClient = useAssetsClient(initialParameters),
@@ -55,7 +59,7 @@ export var AssetsConfigModal = function AssetsConfigModal(props) {
   var _useDatasourceTableSt = useDatasourceTableState({
       datasourceId: datasourceId,
       parameters: isParametersSet ? parameters : undefined,
-      fieldKeys: visibleColumnKeys
+      fieldKeys: isNewSearch ? [] : visibleColumnKeys
     }),
     status = _useDatasourceTableSt.status,
     onNextPage = _useDatasourceTableSt.onNextPage,
@@ -67,16 +71,28 @@ export var AssetsConfigModal = function AssetsConfigModal(props) {
     defaultVisibleColumnKeys = _useDatasourceTableSt.defaultVisibleColumnKeys;
   var onVisibleColumnKeysChange = useCallback(function (visibleColumnKeys) {
     setVisibleColumnKeys(visibleColumnKeys);
+    setIsNewSearch(false);
   }, []);
   useEffect(function () {
     var newVisibleColumnKeys = !initialVisibleColumnKeys || (initialVisibleColumnKeys || []).length === 0 ? defaultVisibleColumnKeys : initialVisibleColumnKeys;
     setVisibleColumnKeys(newVisibleColumnKeys);
   }, [initialVisibleColumnKeys, defaultVisibleColumnKeys]);
+  useEffect(function () {
+    var _responseItems = _slicedToArray(responseItems, 1),
+      data = _responseItems[0];
+    if (data && isNewSearch) {
+      setVisibleColumnKeys(Object.keys(data));
+    } else if (data && (visibleColumnKeys || []).length) {
+      setVisibleColumnKeys(visibleColumnKeys);
+    }
+    // Purposely not included 'visibleColumnKeys' as a dependency to prevent infinite loop
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [responseItems, isNewSearch]);
   var isDisabled = !!workspaceError || status === 'rejected' || status === 'loading' || status === 'empty' || !!workspaceError || assetsClientLoading || !aql || !schemaId;
   var retrieveUrlForSmartCardRender = useCallback(function () {
     var _data$key, _data$key$data;
-    var _responseItems = _slicedToArray(responseItems, 1),
-      data = _responseItems[0];
+    var _responseItems2 = _slicedToArray(responseItems, 1),
+      data = _responseItems2[0];
     // agreement with BE that we will use `key` for rendering smartlink
     return data === null || data === void 0 ? void 0 : (_data$key = data.key) === null || _data$key === void 0 ? void 0 : (_data$key$data = _data$key.data) === null || _data$key$data === void 0 ? void 0 : _data$key$data.url;
   }, [responseItems]);
@@ -118,11 +134,22 @@ export var AssetsConfigModal = function AssetsConfigModal(props) {
       });
     }
   }, [aql, schemaId, workspaceId, retrieveUrlForSmartCardRender, responseItems.length, onInsert, datasourceId, visibleColumnKeys]);
-  var handleOnSearch = useCallback(function (aql, schemaId) {
-    reset();
-    setAql(aql);
-    setSchemaId(schemaId);
-  }, [reset]);
+  var handleOnSearch = useCallback(function (searchAql, searchSchemaId) {
+    if (schemaId !== searchSchemaId) {
+      reset({
+        shouldResetColumns: true
+      });
+      setAql(searchAql);
+      setSchemaId(searchSchemaId);
+      setIsNewSearch(true);
+      loadDatasourceDetails();
+    }
+    if (aql !== searchAql) {
+      reset();
+      setAql(searchAql);
+      setSchemaId(searchSchemaId);
+    }
+  }, [aql, loadDatasourceDetails, reset, schemaId]);
   var renderModalTitleContent = useCallback(function () {
     if (workspaceError) {
       return undefined;

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

@@ -45,7 +45,9 @@ export var DatasourceTableView = function DatasourceTableView(_ref) {
     }
   }, [visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange]);
   var forcedReset = useCallback(function () {
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   if (status === 'resolved' && !responseItems.length) {
     return jsx(NoResults, {

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

@@ -151,11 +151,15 @@ export var PlainJiraIssuesConfigModal = function PlainJiraIssuesConfigModal(prop
   }, [cloudId, selectedJiraSite]);
   var onSearch = useCallback(function (newParameters) {
     setJql(newParameters.jql);
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   var onSiteSelection = useCallback(function (site) {
     setCloudId(site.cloudId);
-    reset(true);
+    reset({
+      shouldForceRequest: true
+    });
   }, [reset]);
   var retrieveUrlForSmartCardRender = useCallback(function () {
     var _data$key, _data$key$data;
@@ -334,7 +338,7 @@ var analyticsContextAttributes = {
 };
 var analyticsContextData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.0.9",
+  packageVersion: "1.0.10",
   source: 'datasourceConfigModal'
 };
 var contextData = _objectSpread(_objectSpread({}, analyticsContextData), {}, {

package/dist/types/hooks/useDatasourceTableState.d.ts

@@ -5,10 +5,14 @@ export interface onNextPageProps {
     shouldForceRequest?: boolean;
 }
 export type NextPageType = (requestInfo?: onNextPageProps) => void;
+interface ResetOptions {
+    shouldForceRequest?: boolean;
+    shouldResetColumns?: boolean;
+}
 export interface DatasourceTableState {
     status: DatasourceTableStatusType;
     onNextPage: NextPageType;
-    reset: (shouldForceRequest?: boolean) => void;
+    reset: (options?: ResetOptions) => void;
     loadDatasourceDetails: () => void;
     responseItems: DatasourceDataResponseItem[];
     hasNextPage: boolean;
@@ -22,3 +26,4 @@ export interface DatasourceTableStateProps {
     fieldKeys?: string[];
 }
 export declare const useDatasourceTableState: ({ datasourceId, parameters, fieldKeys, }: DatasourceTableStateProps) => DatasourceTableState;
+export {};

package/dist/types-ts4.5/hooks/useDatasourceTableState.d.ts

@@ -5,10 +5,14 @@ export interface onNextPageProps {
     shouldForceRequest?: boolean;
 }
 export type NextPageType = (requestInfo?: onNextPageProps) => void;
+interface ResetOptions {
+    shouldForceRequest?: boolean;
+    shouldResetColumns?: boolean;
+}
 export interface DatasourceTableState {
     status: DatasourceTableStatusType;
     onNextPage: NextPageType;
-    reset: (shouldForceRequest?: boolean) => void;
+    reset: (options?: ResetOptions) => void;
     loadDatasourceDetails: () => void;
     responseItems: DatasourceDataResponseItem[];
     hasNextPage: boolean;
@@ -22,3 +26,4 @@ export interface DatasourceTableStateProps {
     fieldKeys?: string[];
 }
 export declare const useDatasourceTableState: ({ datasourceId, parameters, fieldKeys, }: DatasourceTableStateProps) => DatasourceTableState;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-datasource",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "description": "UI Components to support linking platform dataset feature",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -58,7 +58,7 @@
     "@atlaskit/tag": "^11.5.0",
     "@atlaskit/textfield": "5.6.5",
     "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.15.0",
+    "@atlaskit/tokens": "^1.17.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@atlassianlabs/jql-editor": "^2.0.1",
     "@babel/runtime": "^7.0.0",