@gpa-gemstone/common-pages 0.0.112 → 0.0.113

package/lib/EventCharacteristicFilter.d.ts

@@ -20,8 +20,8 @@ interface IPhaseFilters {
     ABCG: boolean;
 }
 interface IEventCharacteristicFilters {
-    durationMin: number;
-    durationMax: number;
+    durationMin?: number;
+    durationMax?: number;
     phases: IPhaseFilters;
     transientMin?: number;
     transientMax?: number;

package/lib/EventCharacteristicFilter.js

@@ -41,12 +41,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 //
 //******************************************************************************************************
 var react_1 = __importDefault(require("react"));
+var lodash_1 = __importDefault(require("lodash"));
 var react_forms_1 = require("@gpa-gemstone/react-forms");
 var EventCharacteristicFilter = function (props) {
     var _a = react_1.default.useState(props.eventCharacteristicFilter), newEventCharacteristicFilter = _a[0], setNewEventCharacteristicFilter = _a[1];
-    var _b = react_1.default.useState([]), newTypeFilter = _b[0], setNewTypeFilter = _b[1];
-    var _c = react_1.default.useState([]), newPhases = _c[0], setNewPhases = _c[1];
-    react_1.default.useEffect(function () { setNewTypeFilter(props.eventTypeFilter); }, [props.eventTypeFilter]);
+    var _b = react_1.default.useState([]), newPhases = _b[0], setNewPhases = _b[1];
     react_1.default.useEffect(function () { setNewEventCharacteristicFilter(props.eventCharacteristicFilter); }, [props.eventCharacteristicFilter]);
     react_1.default.useEffect(function () {
         var setupPhases = [];
@@ -55,8 +54,9 @@ var EventCharacteristicFilter = function (props) {
     }, []);
     react_1.default.useEffect(function () {
         var characteristics = validEventCharacteristicsFilter() ? newEventCharacteristicFilter : undefined;
-        props.setEventFilters(characteristics, newTypeFilter);
-    }, [newEventCharacteristicFilter, newTypeFilter]);
+        if (!lodash_1.default.isEqual(characteristics, props.eventCharacteristicFilter))
+            props.setEventFilters(characteristics);
+    }, [newEventCharacteristicFilter]);
     function validEventCharacteristicsFilter() {
         var valid = newEventCharacteristicFilter != null;
         if (!valid)
@@ -102,10 +102,10 @@ var EventCharacteristicFilter = function (props) {
                 (NullOrNaN(filter.transientMin) || filter.transientMax >= filter.transientMin));
         return true;
     }
-    var sagsSelected = newTypeFilter.find(function (i) { var _a, _b; return (_b = i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Sag'; })) === null || _a === void 0 ? void 0 : _a.ID)) !== null && _b !== void 0 ? _b : -1; }) != null;
-    var swellsSelected = newTypeFilter.find(function (i) { var _a, _b; return (_b = i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Swell'; })) === null || _a === void 0 ? void 0 : _a.ID)) !== null && _b !== void 0 ? _b : -1; }) != null;
-    var transientsSelected = newTypeFilter.find(function (i) { var _a, _b; return (_b = i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Transient'; })) === null || _a === void 0 ? void 0 : _a.ID)) !== null && _b !== void 0 ? _b : -1; }) != null;
-    if (newEventCharacteristicFilter === null || newTypeFilter === null)
+    var sagsSelected = props.eventTypeFilter.find(function (i) { var _a, _b; return (_b = i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Sag'; })) === null || _a === void 0 ? void 0 : _a.ID)) !== null && _b !== void 0 ? _b : -1; }) != null;
+    var swellsSelected = props.eventTypeFilter.find(function (i) { var _a, _b; return (_b = i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Swell'; })) === null || _a === void 0 ? void 0 : _a.ID)) !== null && _b !== void 0 ? _b : -1; }) != null;
+    var transientsSelected = props.eventTypeFilter.find(function (i) { var _a, _b; return (_b = i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Transient'; })) === null || _a === void 0 ? void 0 : _a.ID)) !== null && _b !== void 0 ? _b : -1; }) != null;
+    if (newEventCharacteristicFilter === null || props.eventTypeFilter === null)
         return null;
     return (react_1.default.createElement("fieldset", { className: "border", style: { padding: '10px', height: '100%' } },
         react_1.default.createElement("legend", { className: "w-auto", style: { fontSize: 'large' } }, "Event Characteristics:"),

package/lib/NavBarFilterButton.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import 'moment';
+import { OpenXDA, SystemCenter } from '@gpa-gemstone/application-typings';
+type S = SystemCenter.Types.DetailedMeter | SystemCenter.Types.DetailedAsset | SystemCenter.Types.DetailedLocation | OpenXDA.Types.AssetGroup;
+interface IProps<S> {
+    Data: S[];
+    Type: ('Meter' | 'Asset' | 'AssetGroup' | 'Station');
+    OnClick: () => void;
+    AlternateColors?: {
+        normal: string;
+        selected: string;
+    };
+}
+declare function NavbarFilterButton(props: IProps<S>): React.JSX.Element;
+export default NavbarFilterButton;

package/lib/NavBarFilterButton.js

@@ -0,0 +1,140 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+//******************************************************************************************************
+//  NavBarFilterButton.tsx - Gbtc
+//
+//  Copyright © 2019, Grid Protection Alliance.  All Rights Reserved.
+//
+//  Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
+//  the NOTICE file distributed with this work for additional information regarding copyright ownership.
+//  The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
+//  file except in compliance with the License. You may obtain a copy of the License at:
+//
+//      http://opensource.org/licenses/MIT
+//
+//  Unless agreed to in writing, the subject software distributed under the License is distributed on an
+//  "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
+//  License for the specific language governing permissions and limitations.
+//
+//  Code Modification History:
+//  ----------------------------------------------------------------------------------------------------
+//  08/07/2024 - G. Santos
+//       Generated original version of source code.
+//
+//******************************************************************************************************
+var react_1 = __importDefault(require("react"));
+require("moment");
+function NavbarFilterButton(props) {
+    var _a = react_1.default.useState(false), hover = _a[0], setHover = _a[1];
+    var _b = react_1.default.useState([]), rows = _b[0], setRows = _b[1];
+    var _c = react_1.default.useState(null), header = _c[0], setHeader = _c[1];
+    var _d = react_1.default.useState({ marginBottom: 5 }), buttonStyle = _d[0], setButtonStyle = _d[1];
+    react_1.default.useEffect(function () {
+        switch (props.Type) {
+            case ('Meter'):
+                setHeader(react_1.default.createElement("tr", null,
+                    react_1.default.createElement("th", null, "Name"),
+                    react_1.default.createElement("th", null, "Key"),
+                    react_1.default.createElement("th", null, "Substation"),
+                    react_1.default.createElement("th", null, "Make"),
+                    react_1.default.createElement("th", null, "Model")));
+                break;
+            case ('Asset'):
+                setHeader(react_1.default.createElement("tr", null,
+                    react_1.default.createElement("th", null, "Key"),
+                    react_1.default.createElement("th", null, "Name"),
+                    react_1.default.createElement("th", null, "Asset Type"),
+                    react_1.default.createElement("th", null, "Voltage (kV)")));
+                break;
+            case ('AssetGroup'):
+                setHeader(react_1.default.createElement("tr", null,
+                    react_1.default.createElement("th", null, "Name"),
+                    react_1.default.createElement("th", null, "Assets"),
+                    react_1.default.createElement("th", null, "Meters")));
+                break;
+            default:
+                setHeader(react_1.default.createElement("tr", null,
+                    react_1.default.createElement("th", null, "Name"),
+                    react_1.default.createElement("th", null, "Key"),
+                    react_1.default.createElement("th", null, "Meters"),
+                    react_1.default.createElement("th", null, "Assets")));
+        }
+    }, [props.Type]);
+    react_1.default.useEffect(function () {
+        var _a, _b;
+        setButtonStyle(__assign(__assign({}, buttonStyle), { backgroundColor: (props.Data.length > 0 ? (_a = props.AlternateColors) === null || _a === void 0 ? void 0 : _a.selected : (_b = props.AlternateColors) === null || _b === void 0 ? void 0 : _b.normal) }));
+    }, [props.AlternateColors, props.Data.length]);
+    react_1.default.useEffect(function () {
+        switch (props.Type) {
+            case ('Meter'):
+                setRows(props.Data.filter(function (v, i) { return i < 10; }).map(function (d) { return react_1.default.createElement("tr", { key: d.ID },
+                    react_1.default.createElement("td", null, d['Name']),
+                    react_1.default.createElement("td", null, d['AssetKey']),
+                    react_1.default.createElement("td", null, d['Location']),
+                    react_1.default.createElement("td", null, d['Make']),
+                    react_1.default.createElement("td", null, d['Model'])); }));
+                break;
+            case ('Asset'):
+                setRows(props.Data.filter(function (v, i) { return i < 10; }).map(function (d) { return react_1.default.createElement("tr", { key: d.ID },
+                    react_1.default.createElement("td", null, d['AssetKey']),
+                    react_1.default.createElement("td", null, d['AssetName']),
+                    react_1.default.createElement("td", null, d['AssetType']),
+                    react_1.default.createElement("td", null, d['VoltageKV'])); }));
+                break;
+            case ('AssetGroup'):
+                setRows(props.Data.filter(function (v, i) { return i < 10; }).map(function (d) { return react_1.default.createElement("tr", { key: d.ID },
+                    react_1.default.createElement("td", null, d['Name']),
+                    react_1.default.createElement("td", null, d['Assets']),
+                    react_1.default.createElement("td", null, d['Meters'])); }));
+                break;
+            case ('Station'):
+                setRows(props.Data.filter(function (v, i) { return i < 10; }).map(function (d) { return react_1.default.createElement("tr", { key: d.ID },
+                    react_1.default.createElement("td", null, d['Name']),
+                    react_1.default.createElement("td", null, d['LocationKey']),
+                    react_1.default.createElement("td", null, d['Meters']),
+                    react_1.default.createElement("td", null, d['Assets'])); }));
+                break;
+            default:
+                setRows([]);
+                break;
+        }
+    }, [props.Data, props.Type]);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("button", { className: "btn btn-block btn-sm btn-" + (props.Data.length > 0 ? "warning" : "primary"), style: buttonStyle, onClick: function (evt) { evt.preventDefault(); props.OnClick(); }, onMouseEnter: function () { return setHover(true); }, onMouseLeave: function () { return setHover(false); } },
+            typeToString(props.Type),
+            " ",
+            props.Data.length > 0 ? ('(' + props.Data.length + ')') : ''),
+        react_1.default.createElement("div", { style: { width: window.innerWidth / 3, display: hover ? 'block' : 'none', position: 'absolute', backgroundColor: '#f1f1f1', boxShadow: '0px 8px 16px 0px rgba(0,0,0,0.2)', zIndex: 1, right: 0 }, onMouseEnter: function () { return setHover(true); }, onMouseLeave: function () { return setHover(false); } },
+            react_1.default.createElement("table", { className: 'table' },
+                react_1.default.createElement("thead", null, header),
+                react_1.default.createElement("tbody", null, rows)))));
+}
+function typeToString(Type) {
+    switch (Type) {
+        case 'Meter':
+            return 'Meter';
+        case 'Asset':
+            return 'Asset';
+        case 'AssetGroup':
+            return 'Asset Group';
+        case 'Station':
+            return 'Substation';
+        default:
+            return Type;
+    }
+}
+exports.default = NavbarFilterButton;

package/lib/index.d.ts

@@ -11,4 +11,5 @@ import ErrorBoundary from './ErrorBoundary';
 import TimeFilter from './TimeFilter';
 import EventTypeFilter from './EventTypeFilter';
 import EventCharacteristicFilter from './EventCharacteristicFilter';
-export { TimeFilter, EventTypeFilter, EventCharacteristicFilter, Setting, Note, ValueList, ByValueList, User, ByUser, DefaultSearch, SelectPopup, DefaultSelects, ErrorBoundary };
+import NavBarFilterButton from './NavBarFilterButton';
+export { TimeFilter, EventTypeFilter, EventCharacteristicFilter, NavBarFilterButton, Setting, Note, ValueList, ByValueList, User, ByUser, DefaultSearch, SelectPopup, DefaultSelects, ErrorBoundary };

package/lib/index.js

@@ -25,7 +25,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ErrorBoundary = exports.DefaultSelects = exports.SelectPopup = exports.DefaultSearch = exports.ByUser = exports.User = exports.ByValueList = exports.ValueList = exports.Note = exports.Setting = exports.EventCharacteristicFilter = exports.EventTypeFilter = exports.TimeFilter = void 0;
+exports.ErrorBoundary = exports.DefaultSelects = exports.SelectPopup = exports.DefaultSearch = exports.ByUser = exports.User = exports.ByValueList = exports.ValueList = exports.Note = exports.Setting = exports.NavBarFilterButton = exports.EventCharacteristicFilter = exports.EventTypeFilter = exports.TimeFilter = void 0;
 var Setting_1 = __importDefault(require("./Setting"));
 exports.Setting = Setting_1.default;
 var Note_1 = __importDefault(require("./Note"));
@@ -52,3 +52,5 @@ var EventTypeFilter_1 = __importDefault(require("./EventTypeFilter"));
 exports.EventTypeFilter = EventTypeFilter_1.default;
 var EventCharacteristicFilter_1 = __importDefault(require("./EventCharacteristicFilter"));
 exports.EventCharacteristicFilter = EventCharacteristicFilter_1.default;
+var NavBarFilterButton_1 = __importDefault(require("./NavBarFilterButton"));
+exports.NavBarFilterButton = NavBarFilterButton_1.default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gpa-gemstone/common-pages",
-  "version": "0.0.112",
+  "version": "0.0.113",
   "description": "Common UI pages for GPA products",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -44,12 +44,12 @@
     "typescript": "5.5.3"
   },
   "dependencies":   {
-    "@gpa-gemstone/application-typings": "0.0.74",
-    "@gpa-gemstone/gpa-symbols": "0.0.39",
-    "@gpa-gemstone/helper-functions": "0.0.32",
-    "@gpa-gemstone/react-forms": "1.1.67",
-    "@gpa-gemstone/react-interactive": "1.0.126",
-    "@gpa-gemstone/react-table": "1.2.49",
+    "@gpa-gemstone/application-typings": "0.0.75",
+    "@gpa-gemstone/gpa-symbols": "0.0.40",
+    "@gpa-gemstone/helper-functions": "0.0.33",
+    "@gpa-gemstone/react-forms": "1.1.68",
+    "@gpa-gemstone/react-interactive": "1.0.127",
+    "@gpa-gemstone/react-table": "1.2.50",
     "@reduxjs/toolkit": "1.8.3",
     "crypto-js": "4.0.0",
     "moment": "^2.29.4",