logitude-dashboard-library 3.2.57 → 3.2.58

package/dist/assets/styles/dl-dashboard.scss

@@ -1363,4 +1363,50 @@ $dark-grey: #717585;
         opacity: 1;
         transform: translateY(0);
     }
+}
+
+.dl-views-chart-container {
+    overflow: auto;
+    position: absolute;
+    top: 0;
+    right: 0;
+    left: 0;
+    bottom: 0;
+    height: 100%;
+    width: 100%;
+    padding: 8px 12px 12px;
+}
+
+.dl-views-widget-list {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+}
+
+.dl-views-widget-row {
+    text-align: left;
+}
+
+.dl-views-widget-link {
+    background: none;
+    border: none;
+    padding: 0;
+    margin: 0;
+    cursor: pointer;
+    color: #0c64c0;
+    font-size: 13px;
+    line-height: 18px;
+    text-align: left;
+    font-family: "Manrope", sans-serif;
+}
+
+.dl-views-widget-link:hover {
+    text-decoration: underline;
+}
+
+.dl-views-widget-empty {
+    padding: 12px;
+    color: #6e7072;
+    font-size: 13px;
+    font-family: "Manrope", sans-serif;
 }

package/dist/features/Dashboard/ChartsComponents/CustomCharts/ViewsChart.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { CustomChartProps } from "./CustomChart";
+declare const ViewsChart: (props: {
+    customChartProps: CustomChartProps;
+}) => React.JSX.Element;
+export default ViewsChart;

package/dist/index.js

@@ -1845,7 +1845,7 @@ var TableChart = function TableChart(props) {
       rowDate = null;
     }
 
-    return fieldCode == "ShipmentNumber" && objectTableName == "Shipment" || IsShipmentMasterFieldClickable(fieldCode, rowDate) || fieldCode == "InvoiceNumber" && objectTableName == "APInvoice" || fieldCode == "InvoiceNumber" && objectTableName == "ARInvoice" || fieldCode == "ContainerNumber" && objectTableName == "Container" || fieldCode == "QuoteNumber" && objectTableName == "Quote" || fieldCode == "Subject" && objectTableName == "Opportunity" || fieldCode == "EnglishName" && objectTableName == "Customer" || fieldCode == "TaskNumber" && objectTableName == "Task" || fieldCode == "Subject" && objectTableName == "Activity" || fieldCode == "TicketNumber" && objectTableName == "Ticket";
+    return fieldCode == "ShipmentNumber" && objectTableName == "Shipment" || IsShipmentMasterFieldClickable(fieldCode, rowDate) || fieldCode == "InvoiceNumber" && objectTableName == "APInvoice" || fieldCode == "InvoiceNumber" && objectTableName == "ARInvoice" || fieldCode == "ContainerNumber" && objectTableName == "Container" || fieldCode == "QuoteNumber" && objectTableName == "Quote" || fieldCode == "Subject" && objectTableName == "Opportunity" || fieldCode == "EnglishName" && objectTableName == "Customer" || fieldCode == "TaskNumber" && objectTableName == "Task" || fieldCode == "Subject" && objectTableName == "Activity" || fieldCode == "TicketNumber" && objectTableName == "Ticket" || fieldCode == "ReleaseNumber" && objectTableName == "WarehouseRelease";
   };
 
   var IsShipmentMasterFieldClickable = function IsShipmentMasterFieldClickable(fieldCode, rowData) {
@@ -2348,8 +2348,70 @@ var PivotTable = React.forwardRef(function (props, comRef) {
   })));
 });
 
+var parseSelectedQueries = function parseSelectedQueries(widgetJson) {
+  if (!widgetJson) {
+    return [];
+  }
+
+  try {
+    var parsed = JSON.parse(widgetJson);
+
+    if (parsed && Array.isArray(parsed.SelectedQueries)) {
+      return parsed.SelectedQueries;
+    }
+  } catch (_unused) {}
+
+  return [];
+};
+
+var ViewsChart = function ViewsChart(props) {
+  var widget = props.customChartProps.widget;
+  var objectTableName = widget === null || widget === void 0 ? void 0 : widget.ViewsWidgetObjectTableName;
+  var entries = React.useMemo(function () {
+    return parseSelectedQueries(widget === null || widget === void 0 ? void 0 : widget.WidgetJson);
+  }, [widget]);
+
+  var handleClick = function handleClick(uniqueCode) {
+    if (!objectTableName || !uniqueCode) {
+      return;
+    }
+
+    var selection = {
+      Widget: widget,
+      ViewsNavigation: {
+        ObjectTableName: objectTableName,
+        QueryUniqueCode: uniqueCode
+      }
+    };
+    props.customChartProps.onSelectDataPoint(selection);
+  };
+
+  if (!entries.length) {
+    return React__default.createElement("div", {
+      className: "dl-views-widget-empty"
+    }, React__default.createElement("span", {
+      className: "dl-views-widget-empty-text"
+    }, "No views configured"));
+  }
+
+  return React__default.createElement("div", {
+    className: "dl-views-widget-list"
+  }, entries.map(function (row) {
+    return React__default.createElement("div", {
+      key: row.UniqueCode,
+      className: "dl-views-widget-row"
+    }, React__default.createElement("button", {
+      type: "button",
+      className: "dl-views-widget-link",
+      onClick: function onClick() {
+        return handleClick(row.UniqueCode);
+      }
+    }, row.DisplayLabel || row.UniqueCode));
+  }));
+};
+
 var CustomChart = function CustomChart(props) {
-  var _props$widget2, _props$widget3;
+  var _props$widget2, _props$widget3, _props$widget4;
 
   var project = function project() {
     var _props$widget;
@@ -2370,13 +2432,18 @@ var CustomChart = function CustomChart(props) {
           customChartProps: props
         });
 
+      case "views":
+        return React__default.createElement(ViewsChart, {
+          customChartProps: props
+        });
+
       default:
         return React__default.createElement("div", null, "Invalid Type");
     }
   };
 
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-    className: "dl-custom-chart-container " + (props.widget && ((_props$widget2 = props.widget) === null || _props$widget2 === void 0 ? void 0 : _props$widget2.TypeCode) == 'table' ? 'dl-table-chart-container' : '') + " " + (props.widget && ((_props$widget3 = props.widget) === null || _props$widget3 === void 0 ? void 0 : _props$widget3.TypeCode) == 'pivot' ? 'dl-pivot-chart-container' : '')
+    className: "dl-custom-chart-container " + (props.widget && ((_props$widget2 = props.widget) === null || _props$widget2 === void 0 ? void 0 : _props$widget2.TypeCode) == 'table' ? 'dl-table-chart-container' : '') + " " + (props.widget && ((_props$widget3 = props.widget) === null || _props$widget3 === void 0 ? void 0 : _props$widget3.TypeCode) == 'pivot' ? 'dl-pivot-chart-container' : '') + " " + (props.widget && ((_props$widget4 = props.widget) === null || _props$widget4 === void 0 ? void 0 : _props$widget4.TypeCode) == 'views' ? 'dl-views-chart-container' : '')
   }, project()));
 };
 
@@ -4094,7 +4161,7 @@ var FusionChart$1 = React.forwardRef(function (props, comRef) {
 });
 
 var WidgetCard = React.forwardRef(function (props, comRef) {
-  var _widget$current15, _widget$current16, _widget$current17, _widget$current18;
+  var _widget$current16, _widget$current17, _widget$current18, _widget$current19;
 
   var widget = React.useRef();
 
@@ -4198,7 +4265,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
   };
 
   var GetChartComponent = function GetChartComponent() {
-    var _widget$current6, _widget$current7, _widget$current8, _widget$current9, _widget$current10;
+    var _widget$current6, _widget$current7, _widget$current8, _widget$current9, _widget$current10, _widget$current11;
 
     if (isLoading || !((_widget$current6 = widget.current) !== null && _widget$current6 !== void 0 && _widget$current6.TypeCode)) return "";
     if (((_widget$current7 = widget.current) === null || _widget$current7 === void 0 ? void 0 : _widget$current7.TypeCode) == "kpi") return React__default.createElement(CustomChart, {
@@ -4212,7 +4279,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
         return showErrorMsg(errorMsg);
       }
     });
-    if (((_widget$current8 = widget.current) === null || _widget$current8 === void 0 ? void 0 : _widget$current8.TypeCode) == "table" || ((_widget$current9 = widget.current) === null || _widget$current9 === void 0 ? void 0 : _widget$current9.TypeCode) == "pivot") return React__default.createElement(CustomChart, {
+    if (((_widget$current8 = widget.current) === null || _widget$current8 === void 0 ? void 0 : _widget$current8.TypeCode) == "table" || ((_widget$current9 = widget.current) === null || _widget$current9 === void 0 ? void 0 : _widget$current9.TypeCode) == "pivot" || ((_widget$current10 = widget.current) === null || _widget$current10 === void 0 ? void 0 : _widget$current10.TypeCode) == "views") return React__default.createElement(CustomChart, {
       isInEditMode: props.isInEditMode,
       isPreviewModeActive: props.isPreviewModeActive,
       dataBinding: props.dataBinding,
@@ -4220,7 +4287,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
       widgetRef: props.widgetRef,
       onSelectDataPoint: props.onSelectDataPoint
     });
-    if (((_widget$current10 = widget.current) === null || _widget$current10 === void 0 ? void 0 : _widget$current10.TypeCode) == "gauge") return React__default.createElement(FusionChart$1, {
+    if (((_widget$current11 = widget.current) === null || _widget$current11 === void 0 ? void 0 : _widget$current11.TypeCode) == "gauge") return React__default.createElement(FusionChart$1, {
       ref: fusionChartRef,
       dataBinding: props.dataBinding,
       widget: widget.current,
@@ -4279,15 +4346,15 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
   };
 
   var isThereTitle = function isThereTitle() {
-    var _widget$current11, _widget$current12;
+    var _widget$current12, _widget$current13;
 
-    return ((_widget$current11 = widget.current) === null || _widget$current11 === void 0 ? void 0 : _widget$current11.Title) && ((_widget$current12 = widget.current) === null || _widget$current12 === void 0 ? void 0 : _widget$current12.Title.length) > 0;
+    return ((_widget$current12 = widget.current) === null || _widget$current12 === void 0 ? void 0 : _widget$current12.Title) && ((_widget$current13 = widget.current) === null || _widget$current13 === void 0 ? void 0 : _widget$current13.Title.length) > 0;
   };
 
   var isThereSubtitle = function isThereSubtitle() {
-    var _widget$current13, _widget$current14;
+    var _widget$current14, _widget$current15;
 
-    return ((_widget$current13 = widget.current) === null || _widget$current13 === void 0 ? void 0 : _widget$current13.Subtitle) && ((_widget$current14 = widget.current) === null || _widget$current14 === void 0 ? void 0 : _widget$current14.Subtitle.length) > 0;
+    return ((_widget$current14 = widget.current) === null || _widget$current14 === void 0 ? void 0 : _widget$current14.Subtitle) && ((_widget$current15 = widget.current) === null || _widget$current15 === void 0 ? void 0 : _widget$current15.Subtitle.length) > 0;
   };
 
   var tableHintMessage = function tableHintMessage() {
@@ -4336,7 +4403,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
         color: getCSSPropertyValue(widget.current, 'TitleFontColor', ''),
         textAlign: getCSSPropertyValue(widget === null || widget === void 0 ? void 0 : widget.current, 'TitleAlignment', '', undefined)
       }
-    }, (_widget$current15 = widget.current) === null || _widget$current15 === void 0 ? void 0 : _widget$current15.Title),
+    }, (_widget$current16 = widget.current) === null || _widget$current16 === void 0 ? void 0 : _widget$current16.Title),
     position: ['top center'],
     arrowStyle: {
       color: '#19395C'
@@ -4345,7 +4412,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
     on: ['hover', 'focus']
   }, React__default.createElement("span", {
     className: "widget-title-tooltip-text"
-  }, (_widget$current16 = widget.current) === null || _widget$current16 === void 0 ? void 0 : _widget$current16.Title))), isTableOrPivotWidget() && isThereTitle() && isThereSubtitle() && React__default.createElement("div", {
+  }, (_widget$current17 = widget.current) === null || _widget$current17 === void 0 ? void 0 : _widget$current17.Title))), isTableOrPivotWidget() && isThereTitle() && isThereSubtitle() && React__default.createElement("div", {
     className: "titles-vertical-seeparator"
   }), React__default.createElement("div", {
     className: isThereSubtitle() ? "subtitle" : "subtitle margin-top-4",
@@ -4355,7 +4422,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
       color: getCSSPropertyValue(widget.current, 'SubtitleFontColor', ''),
       minWidth: isThereSubtitle() && isTableOrPivotWidget() ? '5%' : undefined
     }
-  }, (_widget$current17 = widget.current) === null || _widget$current17 === void 0 ? void 0 : _widget$current17.Subtitle)), !isTitleAligmentRight() && isTableOrPivotWidget() && tableHintMessage(), props.isInEditMode && React__default.createElement("div", {
+  }, (_widget$current18 = widget.current) === null || _widget$current18 === void 0 ? void 0 : _widget$current18.Subtitle)), !isTitleAligmentRight() && isTableOrPivotWidget() && tableHintMessage(), props.isInEditMode && React__default.createElement("div", {
     className: isThereTitle() ? "widget-options-container" : "widget-options-container margin-top-6"
   }, React__default.createElement("div", null, " ", React__default.createElement(SvgEditIcon, {
     className: "widget-card-edit-icon",
@@ -4403,7 +4470,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
     className: "widget-copied-notification-check"
   }, "\u2713"), React__default.createElement("span", {
     className: "widget-copied-notification-title"
-  }, (_widget$current18 = widget.current) === null || _widget$current18 === void 0 ? void 0 : _widget$current18.Title), React__default.createElement("span", {
+  }, (_widget$current19 = widget.current) === null || _widget$current19 === void 0 ? void 0 : _widget$current19.Title), React__default.createElement("span", {
     className: "widget-copied-notification-text"
   }, "widget copied")), !props.isInEditMode && showHeaderErrorMessages && React__default.createElement("div", {
     className: "header-message-error"