@retailcrm/datalens-ui 0.2.5 → 0.2.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@retailcrm/datalens-ui",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "description": "Datalens UI packed as library",
   "author": "RetailDriverLLC <integration@retailcrm.ru>",
   "contributors": [
@@ -23,24 +23,19 @@
     "@diplodoc/transform": "^4.60.3",
     "@floating-ui/react": "^0.27.13",
     "@gravity-ui/app-layout": "^2.1.0",
-    "@gravity-ui/browserslist-config": "^4.3.0",
     "@gravity-ui/chartkit": "^7.33.1",
     "@gravity-ui/components": "^4.11.0",
     "@gravity-ui/dashkit": "^9.3.1",
     "@gravity-ui/date-components": "^3.2.3",
     "@gravity-ui/date-utils": "^2.5.6",
-    "@gravity-ui/eslint-config": "^3.2.0",
     "@gravity-ui/expresskit": "^2.4.0",
     "@gravity-ui/gateway": "^4.10.4",
     "@gravity-ui/i18n": "^1.7.0",
     "@gravity-ui/icons": "^2.13.0",
     "@gravity-ui/navigation": "^3.8.0",
     "@gravity-ui/nodekit": "^2.4.1",
-    "@gravity-ui/prettier-config": "^1.1.0",
     "@gravity-ui/react-data-table": "^2.2.1",
     "@gravity-ui/sdk": "^1.5.1",
-    "@gravity-ui/stylelint-config": "^4.0.1",
-    "@gravity-ui/tsconfig": "^1.0.0",
     "@gravity-ui/ui-logger": "^1.1.0",
     "@gravity-ui/uikit": "^7.18.0",
     "@reduxjs/toolkit": "^1.8.3",

package/ui/components/DashKit/helpers.js

@@ -42,10 +42,10 @@ function getDashKitMenu(onRemoveItem) {
       handler: (configItem, params, state) => {
         const entryId = getEntryId(configItem, state);
         if (entryId) {
-          getRouter().open(
-            { pathname: `/navigate/${entryId}`, search: toSearchParams(params) },
-            "_blank"
-          );
+          getRouter().openTab({
+            pathname: `/navigate/${entryId}`,
+            search: toSearchParams(params)
+          });
         }
       },
       visible: (configItem) => {

package/ui/libs/DatalensChartkit/ChartKit/helpers/apply-hc-handlers.js

@@ -4,9 +4,31 @@ import get from "lodash/get";
 import has from "lodash/has";
 import merge from "lodash/merge";
 import set from "lodash/set";
+import "../../../../navigation/index.js";
 import { clearVmProp } from "../../modules/data-provider/charts/utils.js";
 import { handleChartLoadingForActionParams, handleSeriesClickForActionParams } from "./action-params-handlers.js";
 import { extractHcTypeFromData, getEscapedActionParams } from "./utils.js";
+import { getRouter } from "../../../../navigation/router.js";
+const openGoToUrl = (rawUrl, target) => {
+  if (typeof window === "undefined") {
+    return;
+  }
+  const windowTarget = target === "_self" ? "_self" : "_blank";
+  const sanitizedUrl = sanitizeUrl(rawUrl);
+  const parsedUrl = new URL(sanitizedUrl, window.location.origin);
+  if (parsedUrl.origin === window.location.origin) {
+    getRouter().open(
+      {
+        pathname: parsedUrl.pathname,
+        search: parsedUrl.search,
+        hash: parsedUrl.hash
+      },
+      windowTarget
+    );
+    return;
+  }
+  window.open(parsedUrl.toString(), windowTarget);
+};
 const fixPieTotals = (args) => {
   const { data } = args;
   const pathToSeriesEvents = "libraryConfig.plotOptions.series.events";
@@ -116,8 +138,7 @@ function handleSeriesClickForGoTo(args) {
     return;
   }
   try {
-    const url = sanitizeUrl(pointUrl);
-    window.open(url, target === "_self" ? "_self" : "_blank");
+    openGoToUrl(pointUrl, target);
   } catch (e) {
     console.error(e);
   }

package/ui/libs/DatalensChartkit/menu/MenuItems.js

@@ -12,16 +12,24 @@ import { isEnabledFeature } from "../../../utils/isEnabledFeature.js";
 import { getExportItem, isExportItemDisabled } from "../components/ChartKitBase/components/Header/components/Menu/Items/Export/Export.js";
 import getInspectorMenuitem from "../components/ChartKitBase/components/Header/components/Menu/Items/Inspector/Inspector.js";
 import ChartKitIcon_default from "../components/ChartKitIcon/ChartKitIcon.js";
+import { getRouter, getLocation } from "../../../navigation/router.js";
 import { Feature } from "../../../../shared/types/feature.js";
 import { MenuItemsIds } from "../../../../shared/types/menu.js";
 import { DL, URL_OPTIONS } from "../../../constants/common.js";
 import { WidgetKind } from "../../../../shared/types/widget.js";
 import { PREVIEW_ROUTE } from "../../../../shared/constants/entry.js";
-import { getLocation } from "../../../navigation/router.js";
 import { FOCUSED_WIDGET_PARAM_NAME } from "../../../../shared/constants/dash.js";
 const getExportMenuItem = getExportItem;
 const getInspectorMenuItem = getInspectorMenuitem;
 const alertI18n = I18n.keyset("component.chartkit-alerts.view");
+const openInternalUrlInNewTab = (rawUrl) => {
+  const url = new URL(rawUrl, window.location.origin);
+  getRouter().openTab({
+    pathname: url.pathname,
+    search: url.search,
+    hash: url.hash
+  });
+};
 const getAlertsMenuItem = ({
   chartsDataProvider,
   customConfig
@@ -89,7 +97,7 @@ const getNewWindowMenuItem = ({
         }
       )
     );
-    window.open(link);
+    openInternalUrlInNewTab(link.toString());
   })
 });
 const getEditMenuItem = ({
@@ -103,14 +111,15 @@ const getEditMenuItem = ({
   icon: customConfig?.icon || /* @__PURE__ */ jsx(ChartKitIcon_default, { data: Pencil }),
   isVisible: () => !DL.IS_MOBILE && (customConfig?.isVisible ? customConfig.isVisible() : true),
   action: customConfig?.action || (({ loadedData = {}, propsData, chartsDataProvider: dataProvider }) => {
-    window.open(
-      (dataProvider || chartsDataProvider)?.getGoAwayLink(
-        { loadedData, propsData },
-        {
-          idPrefix: "/navigate/"
-        }
-      )
+    const url = (dataProvider || chartsDataProvider)?.getGoAwayLink(
+      { loadedData, propsData },
+      {
+        idPrefix: "/navigate/"
+      }
     );
+    if (url) {
+      openInternalUrlInNewTab(url);
+    }
   })
 });
 const getOpenAsTableMenuItem = ({
@@ -131,15 +140,14 @@ const getOpenAsTableMenuItem = ({
     return Boolean(!isCriticalError && isExportAllowed && isChart && customIsVisible);
   },
   action: customConfig?.action || (({ loadedData, propsData, chartsDataProvider: dataProvider }) => {
-    window.open(
-      (dataProvider || chartsDataProvider).getGoAwayLink(
-        { loadedData, propsData },
-        {
-          extraParams: { _chart_type: "table" },
-          idPrefix: "/preview/"
-        }
-      )
+    const url = (dataProvider || chartsDataProvider).getGoAwayLink(
+      { loadedData, propsData },
+      {
+        extraParams: { _chart_type: "table" },
+        idPrefix: "/preview/"
+      }
     );
+    openInternalUrlInNewTab(url);
   })
 });
 const getLinkMenuItem = (customConfig) => ({

package/ui/libs/DatalensChartkit/modules/data-provider/charts/ui-sandbox.js

@@ -4,6 +4,7 @@ import get from "lodash/get";
 import merge from "lodash/merge";
 import set from "lodash/set";
 import { chartStorage } from "../../../ChartKit/plugins/chart-storage.js";
+import "../../../../../navigation/index.js";
 import "../../../../../../shared/index.js";
 import { wrapHtml } from "../../../../../../shared/utils/ui-sandbox.js";
 import { getRandomCKId } from "../../../ChartKit/helpers/getRandomCKId.js";
@@ -13,11 +14,32 @@ import { generateHtml } from "../../html-generator/index.js";
 import { getParseHtmlFn } from "../../html-generator/utils.js";
 import { UiSandboxRuntime } from "./ui-sandbox-runtime.js";
 import { clearVmProp } from "./utils.js";
+import { getRouter } from "../../../../../navigation/router.js";
 import { EditorType, LegacyEditorType } from "../../../../../../shared/types/widget.js";
 import { WRAPPED_FN_KEY } from "../../../../../../shared/constants/ui-sandbox.js";
 import { WRAPPED_HTML_KEY } from "../../../../../../shared/constants/chartkit-handlers.js";
 const UI_SANDBOX_TOTAL_TIME_LIMIT = 3e3;
 const UI_SANDBOX_FN_TIME_LIMIT = 100;
+const openSandboxUrl = (rawUrl, target) => {
+  if (typeof window === "undefined") {
+    return;
+  }
+  const windowTarget = target === "_self" ? "_self" : "_blank";
+  const href = sanitizeUrl(rawUrl);
+  const url = new URL(href, window.location.origin);
+  if (url.origin === window.location.origin) {
+    getRouter().open(
+      {
+        pathname: url.pathname,
+        search: url.search,
+        hash: url.hash
+      },
+      windowTarget
+    );
+    return;
+  }
+  window.open(url.toString(), windowTarget);
+};
 let uiSandbox;
 let getInterruptAfterDeadlineHandler;
 const getUISandbox = async () => {
@@ -196,8 +218,7 @@ async function getUnwrappedFunction(args) {
           window: {
             open: function(url, target) {
               try {
-                const href = sanitizeUrl(url);
-                window.open(href, target === "_self" ? "_self" : "_blank");
+                openSandboxUrl(url, target);
               } catch (e) {
                 console.error(e);
               }

package/ui/units/dash/components/DashActionPanel/DashActionPanel.d.ts

@@ -55,6 +55,7 @@ declare class DashActionPanel extends React.PureComponent<ActionPanelProps, Acti
     private getAdditionalEntryItems;
     private onSelectStateClick;
     private onValueTableOfContentsClick;
+    private isDashboardBreadcrumbEditingAccessible;
     private filterEntryContextMenuItems;
     private handleGoBack;
     private handleGoForward;

package/ui/units/dash/components/DashActionPanel/DashActionPanel.js

@@ -151,10 +151,11 @@ const _DashActionPanel = class _DashActionPanel extends React__default.PureCompo
     this.onValueTableOfContentsClick = () => {
       this.props.toggleTableOfContent();
     };
+    this.isDashboardBreadcrumbEditingAccessible = () => {
+      return capabilities.has(Capability.AccessibleDashboardBreadcrumbEditing);
+    };
     this.filterEntryContextMenuItems = ({ items }) => {
-      const isDashboardBreadcrumbEditingAccessible = capabilities.has(
-        Capability.AccessibleDashboardBreadcrumbEditing
-      );
+      const isDashboardBreadcrumbEditingAccessible = this.isDashboardBreadcrumbEditingAccessible();
       const shouldHideDashEditingItems = this.props.entry?.scope === EntryScope.Dash && !isDashboardBreadcrumbEditingAccessible;
       return items.filter((item) => {
         if (HIDDEN_DASH_ACTION_PANEL_CONTEXT_MENU_ITEMS.has(item.id)) {
@@ -272,7 +273,7 @@ const _DashActionPanel = class _DashActionPanel extends React__default.PureCompo
         canEdit: this.props.canEdit,
         progress: this.props.progress,
         isLoadingEditMode: this.props.isLoadingEditMode,
-        showEditButton: false,
+        showEditButton: this.isDashboardBreadcrumbEditingAccessible(),
         onEditClick: this.props.handlerEditClick,
         onAccessClick: this.openDialogAccess,
         entryDialoguesRef: this.props.entryDialoguesRef,

package/ui/units/ql/containers/QL/QLActionPanel/QLActionPanel.js

@@ -96,12 +96,21 @@ const QLActionPanel = (props) => {
         icon: /* @__PURE__ */ jsx(Icon, { data: SvgMonitoring, width: 16, height: 16 }),
         id: "sql-to-monitoring",
         action: () => {
-          window.open(redirectUrl, "_blank");
+          const url = new URL(redirectUrl, window.location.origin);
+          if (url.origin === window.location.origin) {
+            router.openTab({
+              pathname: url.pathname,
+              search: url.search,
+              hash: url.hash
+            });
+            return;
+          }
+          window.open(url.toString(), "_blank");
         }
       });
     }
     return items;
-  }, [redirectUrl]);
+  }, [redirectUrl, router]);
   const defaultChartName = React__default.useMemo(() => {
     if (connection === null) {
       return "";