@atlaskit/link-datasource 4.21.6 → 4.22.0

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/link-datasource
 
+## 4.22.0
+
+### Minor Changes
+
+- [`64ec65231b4cf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/64ec65231b4cf) -
+  EDITOR-1568 bump adf-schema for afm
+
+## 4.21.7
+
+### Patch Changes
+
+- [`ec1eda37975bf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ec1eda37975bf) -
+  Deep comparison on DatasourceTable parameter changes before trigger reset
+- Updated dependencies
+
 ## 4.21.6
 
 ### Patch Changes

package/dist/cjs/hooks/useDeepEffect.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDeepEffect = void 0;
+var _react = require("react");
+var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
+var useDeepEffect = exports.useDeepEffect = function useDeepEffect(callback, dependencies) {
+  var prevDependencies = (0, _react.useRef)();
+  (0, _react.useEffect)(function () {
+    if (!(0, _isEqual.default)(dependencies, prevDependencies.current)) {
+      callback();
+      prevDependencies.current = dependencies;
+    }
+  }, [dependencies, callback]);
+};

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

@@ -22,6 +22,7 @@ var _useDataRenderedUfoExperience = require("../../analytics/ufoExperiences/hook
 var _fetchMessagesForLocale = require("../../common/utils/locale/fetch-messages-for-locale");
 var _datasourceExperienceId = require("../../contexts/datasource-experience-id");
 var _useDatasourceTableState = require("../../hooks/useDatasourceTableState");
+var _useDeepEffect = require("../../hooks/useDeepEffect");
 var _en = _interopRequireDefault(require("../../i18n/en"));
 var _state = require("../../state");
 var _assetsModal = require("../assets-modal");
@@ -80,12 +81,27 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
   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;
-  (0, _react.useEffect)(function () {
-    if (!isInitialRender.current) {
-      reset();
-    }
-    isInitialRender.current = false;
-  }, [reset, parameters]);
+  if ((0, _platformFeatureFlags.fg)('navx-1334-datasource-deep-compare-params')) {
+    // parameters is an object that we want to track, and when something inside it changes we want to
+    // call effect callback. Normal useEffect will not do deep comparison, but only reference one.
+    // This hook will do deep comparison making sure we don’t call reset() when only reference to an object
+    // has changed but not the content.
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    (0, _useDeepEffect.useDeepEffect)(function () {
+      if (!isInitialRender.current) {
+        reset();
+      }
+      isInitialRender.current = false;
+    }, [reset, parameters]);
+  } else {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    (0, _react.useEffect)(function () {
+      if (!isInitialRender.current) {
+        reset();
+      }
+      isInitialRender.current = false;
+    }, [reset, parameters]);
+  }
   (0, _react.useEffect)(function () {
     if (onVisibleColumnKeysChange && (visibleColumnKeys || []).length === 0 && defaultVisibleColumnKeys.length > 0) {
       onVisibleColumnKeysChange(defaultVisibleColumnKeys);

package/dist/es2019/hooks/useDeepEffect.js

@@ -0,0 +1,11 @@
+import { useEffect, useRef } from 'react';
+import isEqual from 'lodash/isEqual';
+export const useDeepEffect = (callback, dependencies) => {
+  const prevDependencies = useRef();
+  useEffect(() => {
+    if (!isEqual(dependencies, prevDependencies.current)) {
+      callback();
+      prevDependencies.current = dependencies;
+    }
+  }, [dependencies, callback]);
+};

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

@@ -14,6 +14,7 @@ import { useDataRenderedUfoExperience } from '../../analytics/ufoExperiences/hoo
 import { fetchMessagesForLocale } from '../../common/utils/locale/fetch-messages-for-locale';
 import { DatasourceExperienceIdProvider, useDatasourceExperienceId } from '../../contexts/datasource-experience-id';
 import { useDatasourceTableState } from '../../hooks/useDatasourceTableState';
+import { useDeepEffect } from '../../hooks/useDeepEffect';
 import i18nEN from '../../i18n/en';
 import { StoreContainer } from '../../state';
 import { ASSETS_LIST_OF_LINKS_DATASOURCE_ID } from '../assets-modal';
@@ -72,12 +73,27 @@ const DatasourceTableViewWithoutAnalytics = ({
   const hasColumns = !!columns.length;
   const isDataReady = hasColumns && responseItems.length > 0 && totalCount && totalCount > 0;
   visibleColumnCount.current = (visibleColumnKeys === null || visibleColumnKeys === void 0 ? void 0 : visibleColumnKeys.length) || 0;
-  useEffect(() => {
-    if (!isInitialRender.current) {
-      reset();
-    }
-    isInitialRender.current = false;
-  }, [reset, parameters]);
+  if (fg('navx-1334-datasource-deep-compare-params')) {
+    // parameters is an object that we want to track, and when something inside it changes we want to
+    // call effect callback. Normal useEffect will not do deep comparison, but only reference one.
+    // This hook will do deep comparison making sure we don’t call reset() when only reference to an object
+    // has changed but not the content.
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    useDeepEffect(() => {
+      if (!isInitialRender.current) {
+        reset();
+      }
+      isInitialRender.current = false;
+    }, [reset, parameters]);
+  } else {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    useEffect(() => {
+      if (!isInitialRender.current) {
+        reset();
+      }
+      isInitialRender.current = false;
+    }, [reset, parameters]);
+  }
   useEffect(() => {
     if (onVisibleColumnKeysChange && (visibleColumnKeys || []).length === 0 && defaultVisibleColumnKeys.length > 0) {
       onVisibleColumnKeysChange(defaultVisibleColumnKeys);

package/dist/esm/hooks/useDeepEffect.js

@@ -0,0 +1,11 @@
+import { useEffect, useRef } from 'react';
+import isEqual from 'lodash/isEqual';
+export var useDeepEffect = function useDeepEffect(callback, dependencies) {
+  var prevDependencies = useRef();
+  useEffect(function () {
+    if (!isEqual(dependencies, prevDependencies.current)) {
+      callback();
+      prevDependencies.current = dependencies;
+    }
+  }, [dependencies, callback]);
+};

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

@@ -14,6 +14,7 @@ import { useDataRenderedUfoExperience } from '../../analytics/ufoExperiences/hoo
 import { fetchMessagesForLocale } from '../../common/utils/locale/fetch-messages-for-locale';
 import { DatasourceExperienceIdProvider, useDatasourceExperienceId } from '../../contexts/datasource-experience-id';
 import { useDatasourceTableState } from '../../hooks/useDatasourceTableState';
+import { useDeepEffect } from '../../hooks/useDeepEffect';
 import i18nEN from '../../i18n/en';
 import { StoreContainer } from '../../state';
 import { ASSETS_LIST_OF_LINKS_DATASOURCE_ID } from '../assets-modal';
@@ -71,12 +72,27 @@ var DatasourceTableViewWithoutAnalytics = function DatasourceTableViewWithoutAna
   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]);
+  if (fg('navx-1334-datasource-deep-compare-params')) {
+    // parameters is an object that we want to track, and when something inside it changes we want to
+    // call effect callback. Normal useEffect will not do deep comparison, but only reference one.
+    // This hook will do deep comparison making sure we don’t call reset() when only reference to an object
+    // has changed but not the content.
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    useDeepEffect(function () {
+      if (!isInitialRender.current) {
+        reset();
+      }
+      isInitialRender.current = false;
+    }, [reset, parameters]);
+  } else {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    useEffect(function () {
+      if (!isInitialRender.current) {
+        reset();
+      }
+      isInitialRender.current = false;
+    }, [reset, parameters]);
+  }
   useEffect(function () {
     if (onVisibleColumnKeysChange && (visibleColumnKeys || []).length === 0 && defaultVisibleColumnKeys.length > 0) {
       onVisibleColumnKeysChange(defaultVisibleColumnKeys);

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

@@ -0,0 +1,2 @@
+import { type DependencyList, type EffectCallback } from 'react';
+export declare const useDeepEffect: (callback: EffectCallback, dependencies?: DependencyList) => void;

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

@@ -0,0 +1,2 @@
+import { type DependencyList, type EffectCallback } from 'react';
+export declare const useDeepEffect: (callback: EffectCallback, dependencies?: DependencyList) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "4.21.6",
+	"version": "4.22.0",
 	"description": "UI Components to support linking platform dataset feature",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -36,7 +36,7 @@
 		"ak-postbuild": "ls -d dist/* | xargs -n 1 copyfiles -u 1 -V src/**/*.{svg,png}"
 	},
 	"dependencies": {
-		"@atlaskit/adf-schema": "^51.0.0",
+		"@atlaskit/adf-schema": "^51.1.1",
 		"@atlaskit/analytics-next": "^11.1.0",
 		"@atlaskit/atlassian-context": "^0.5.0",
 		"@atlaskit/avatar": "^25.1.0",
@@ -78,12 +78,12 @@
 		"@atlaskit/primitives": "^14.14.0",
 		"@atlaskit/react-select": "^3.5.0",
 		"@atlaskit/select": "^21.2.0",
-		"@atlaskit/smart-card": "^40.21.0",
+		"@atlaskit/smart-card": "^40.22.0",
 		"@atlaskit/smart-user-picker": "^8.2.0",
 		"@atlaskit/spinner": "^19.0.0",
 		"@atlaskit/tag": "^14.1.0",
 		"@atlaskit/textfield": "^8.0.0",
-		"@atlaskit/theme": "^20.0.0",
+		"@atlaskit/theme": "^21.0.0",
 		"@atlaskit/tokens": "^6.3.0",
 		"@atlaskit/tooltip": "^20.4.0",
 		"@atlaskit/ufo": "^0.4.0",
@@ -184,6 +184,9 @@
 		},
 		"navx-1483-a11y-close-button-in-modal-updates": {
 			"type": "boolean"
+		},
+		"navx-1334-datasource-deep-compare-params": {
+			"type": "boolean"
 		}
 	},
 	"compassUnitTestMetricSourceId": "ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:metric-source/c5751cc6-3513-4070-9deb-af31e86aed34/9c893299-a527-4457-9b46-f3bc4c828766"