@gpa-gemstone/common-pages 0.0.161 → 0.0.163

package/lib/TimeFilter/QuickSelects.d.ts

@@ -1,15 +1,16 @@
 import { DateTimeSetting, ITimeFilter } from './TimeFilter';
+import { Gemstone } from '@gpa-gemstone/application-typings';
 import { TimeUnit } from './TimeWindowUtils';
-export type DateUnit = ('datetime-local' | 'date' | 'time');
 interface IQuickSelect {
     label: string;
-    hideQuickPick: (format?: DateUnit) => boolean;
-    createFilter: (timeZone: string, format?: DateUnit) => ITimeFilter;
+    hideQuickPick: (quickSelectRange?: Gemstone.TSX.Types.QuickSelectRange) => boolean;
+    createFilter: (timeZone: string, format?: Gemstone.TSX.Types.DateUnit) => ITimeFilter;
 }
 interface IProps {
     DateTimeSetting: DateTimeSetting;
     Format?: "YYYY-MM-DD" | "HH:mm:ss.SSS" | "MM/DD/YYYY HH:mm:ss.SSS";
-    DateUnit?: DateUnit;
+    DateUnit?: Gemstone.TSX.Types.DateUnit;
+    QuickSelectRange?: Gemstone.TSX.Types.QuickSelectRange;
     Timezone: string;
     ActiveQP: number;
     SetActiveQP: (qp: number) => void;
@@ -19,5 +20,6 @@ interface IProps {
 }
 declare const QuickSelects: (props: IProps) => JSX.Element;
 export default QuickSelects;
-export declare function getFormat(format?: DateUnit): "MM/DD/YYYY HH:mm:ss.SSS" | "YYYY-MM-DD" | "HH:mm:ss.SSS";
+export declare function getFormat(format?: Gemstone.TSX.Types.DateUnit): "MM/DD/YYYY HH:mm:ss.SSS" | "YYYY-MM-DD" | "HH:mm:ss.SSS";
+export declare function getQuickSelectRange(dateUnit?: Gemstone.TSX.Types.DateUnit): "medium" | "long" | "full" | undefined;
 export declare const AvailableQuickSelects: IQuickSelect[];

package/lib/TimeFilter/QuickSelects.js

@@ -51,13 +51,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AvailableQuickSelects = void 0;
 exports.getFormat = getFormat;
+exports.getQuickSelectRange = getQuickSelectRange;
 var React = __importStar(require("react"));
 var TimeFilter_1 = require("./TimeFilter");
 var moment_1 = __importDefault(require("moment"));
 var moment_timezone_1 = __importDefault(require("moment-timezone"));
 var QuickSelects = function (props) {
     var _a;
-    var CurrentQuickSelects = React.useMemo(function () { return exports.AvailableQuickSelects.filter(function (qs) { return !qs.hideQuickPick(props.DateUnit); }); }, [props.DateUnit]);
+    var CurrentQuickSelects = React.useMemo(function () { return exports.AvailableQuickSelects.filter(function (qs) { var _a; return !qs.hideQuickPick((_a = props.QuickSelectRange) !== null && _a !== void 0 ? _a : getQuickSelectRange(props.DateUnit)); }); }, [props.QuickSelectRange, props.DateUnit]);
     return (React.createElement(Container, { AddRow: (_a = props.AddRowContainer) !== null && _a !== void 0 ? _a : true }, CurrentQuickSelects.map(function (qs, i) {
         var _a;
         if (i % 3 !== 0)
@@ -98,6 +99,14 @@ function getFormat(format) {
     else
         return 'MM/DD/YYYY HH:mm:ss.SSS';
 }
+function getQuickSelectRange(dateUnit) {
+    if (dateUnit === 'datetime-local')
+        return 'full';
+    if (dateUnit === 'time')
+        return 'medium';
+    if (dateUnit === 'date')
+        return 'long';
+}
 var getColSize = function (dateTimeSetting, splitSelects) {
     if (dateTimeSetting === 'startEnd') {
         if (splitSelects)
@@ -112,6 +121,174 @@ var getColSize = function (dateTimeSetting, splitSelects) {
 };
 //update all quick selects to use new timefilters
 exports.AvailableQuickSelects = [
+    {
+        label: 'Last 1 Second', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('second').subtract(1, 'second').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'second').startOf('second');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 's',
+                duration: 1,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 5 Seconds', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('second').subtract(5, 'seconds').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'seconds').startOf('second');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 's',
+                duration: 5,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 10 Seconds', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('second').subtract(10, 'seconds').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'seconds').startOf('second');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 's',
+                duration: 10,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 15 Seconds', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('second').subtract(15, 'seconds').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'seconds').startOf('second');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 's',
+                duration: 15,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 30 Seconds', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('second').subtract(30, 'seconds').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'seconds').startOf('second');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 's',
+                duration: 30,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 45 Seconds', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('second').subtract(45, 'seconds').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'seconds').startOf('second');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 's',
+                duration: 45,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 1 Minute', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('minute').subtract(1, 'minute').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'minutes').startOf('minute');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 'm',
+                duration: 1,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 5 Minutes', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('minute').subtract(5, 'minutes').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'minutes').startOf('minute');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 'm',
+                duration: 5,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 10 Minutes', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('minute').subtract(10, 'minutes').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'minutes').startOf('minute');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 'm',
+                duration: 10,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 15 Minutes', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('minute').subtract(15, 'minutes').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'minutes').startOf('minute');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 'm',
+                duration: 15,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 30 Minutes', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('minute').subtract(30, 'minutes').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'minutes').startOf('minute');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 'm',
+                duration: 30,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
+    {
+        label: 'Last 45 Minutes', createFilter: function (tz, format) {
+            var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('minute').subtract(45, 'minutes').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
+            var t = moment_1.default.utc().add(offset, 'minutes').startOf('minute');
+            return {
+                end: t.format(getFormat(format)),
+                unit: 'm',
+                duration: 45,
+            };
+        },
+        hideQuickPick: function (f) {
+            return f !== 'short';
+        }
+    },
     {
         label: 'This Hour', createFilter: function (tz, format) {
             var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('hour').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
@@ -122,7 +299,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'date';
+            return f == 'long';
         }
     },
     {
@@ -136,7 +313,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'date';
+            return f == 'long';
         }
     },
     {
@@ -150,7 +327,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'date';
+            return f == 'long';
         }
     },
     {
@@ -164,7 +341,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium';
         }
     },
     {
@@ -178,7 +355,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium';
         }
     },
     {
@@ -192,7 +369,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'date' || f == 'time';
+            return f == 'long' || f == 'medium';
         }
     },
     {
@@ -206,7 +383,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -220,7 +397,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -234,7 +411,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -248,7 +425,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -262,7 +439,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -276,7 +453,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -294,7 +471,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -312,7 +489,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -326,7 +503,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -340,7 +517,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -354,7 +531,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     },
     {
@@ -368,7 +545,7 @@ exports.AvailableQuickSelects = [
             };
         },
         hideQuickPick: function (f) {
-            return f == 'time';
+            return f == 'medium' || f == 'short';
         }
     }
 ];

package/lib/TimeFilter/StartEndFilter/DateFilter.js

@@ -43,15 +43,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = __importStar(require("react"));
 var react_forms_1 = require("@gpa-gemstone/react-forms");
 var TimeFilter_1 = require("../TimeFilter");
-var QuickSelects_1 = __importDefault(require("../QuickSelects"));
+var QuickSelects_1 = __importStar(require("../QuickSelects"));
 var DateFilter = function (props) {
+    var _a, _b;
     var FirstFallbackBreakpoint = 1050;
     var SecondFallbackBreakpoint = 541;
     var FirstFallbackBreakpointNoQS = 375;
@@ -82,7 +80,7 @@ var DateFilter = function (props) {
                 React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: props.DateUnit, Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
             props.ShowQuickSelects ?
                 React.createElement("div", { className: quickSelectClass },
-                    React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit })) : null));
+                    React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, QuickSelectRange: (_a = props.QuickSelectRange) !== null && _a !== void 0 ? _a : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) })) : null));
     else
         return (React.createElement(React.Fragment, null,
             React.createElement("div", { className: 'row m-0' },
@@ -92,6 +90,6 @@ var DateFilter = function (props) {
                     React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: props.DateUnit, Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy }))),
             props.ShowQuickSelects ?
                 React.createElement("div", { className: quickSelectClass },
-                    React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, SplitSelects: props.ContainerWidth < SecondFallbackBreakpoint })) : null));
+                    React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, SplitSelects: props.ContainerWidth < SecondFallbackBreakpoint, QuickSelectRange: (_b = props.QuickSelectRange) !== null && _b !== void 0 ? _b : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) })) : null));
 };
 exports.default = DateFilter;

package/lib/TimeFilter/StartEndFilter/DateTimeLocalFilter.js

@@ -43,20 +43,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = __importStar(require("react"));
 var react_forms_1 = require("@gpa-gemstone/react-forms");
 var TimeFilter_1 = require("../TimeFilter");
-var QuickSelects_1 = __importDefault(require("../QuickSelects"));
+var QuickSelects_1 = __importStar(require("../QuickSelects"));
 var react_interactive_1 = require("@gpa-gemstone/react-interactive");
 var DateTimeLocalFilter = function (props) {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     var FirstFallbackBreakpointQS = 1768;
     var SecondFallbackBreakpointQS = 612, FirstFallbacKBreakpointNoQS = 612;
-    var _g = React.useState(false), showQuickPickModal = _g[0], setShowQuickPickModal = _g[1];
+    var _k = React.useState(false), showQuickPickModal = _k[0], setShowQuickPickModal = _k[1];
     var handleSetTimeWindowFilter = React.useCallback(function (record) {
         var flt = (0, TimeFilter_1.getTimeWindowFromFilter)({ start: record.start, end: record.end }, props.Format);
         props.SetTimeWindowFilter(flt);
@@ -89,32 +86,32 @@ var DateTimeLocalFilter = function (props) {
                 React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: (_b = props.DateUnit) !== null && _b !== void 0 ? _b : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
             props.ShowQuickSelects ?
                 React.createElement("div", { className: quickSelectCol },
-                    React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit })) : null));
+                    React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, QuickSelectRange: (_c = props.QuickSelectRange) !== null && _c !== void 0 ? _c : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) })) : null));
     }
     else if (props.ContainerWidth > SecondFallbackBreakpointQS) {
         return (React.createElement("div", { className: 'row m-0' },
             React.createElement("div", { className: startEndCol },
-                React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "start", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'Start', Type: (_c = props.DateUnit) !== null && _c !== void 0 ? _c : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
+                React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "start", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'Start', Type: (_d = props.DateUnit) !== null && _d !== void 0 ? _d : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
             React.createElement("div", { className: startEndCol },
-                React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: (_d = props.DateUnit) !== null && _d !== void 0 ? _d : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
+                React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: (_e = props.DateUnit) !== null && _e !== void 0 ? _e : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
             React.createElement("div", { className: 'row m-0 w-100' }, props.ShowQuickSelects ?
                 React.createElement("div", { className: quickSelectCol },
-                    React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit }))
+                    React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, QuickSelectRange: (_f = props.QuickSelectRange) !== null && _f !== void 0 ? _f : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) }))
                 : null)));
     }
     else {
         return (React.createElement("div", { className: 'row m-0' },
             React.createElement("div", { className: startEndCol },
-                React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "start", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'Start', Type: (_e = props.DateUnit) !== null && _e !== void 0 ? _e : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
+                React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "start", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'Start', Type: (_g = props.DateUnit) !== null && _g !== void 0 ? _g : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
             React.createElement("div", { className: startEndCol },
-                React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: (_f = props.DateUnit) !== null && _f !== void 0 ? _f : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
+                React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: (_h = props.DateUnit) !== null && _h !== void 0 ? _h : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
             props.ShowQuickSelects ?
                 React.createElement("div", { className: 'row m-0 w-100' },
                     React.createElement("div", { className: 'col-12 d-flex align-items-center justify-content-center' },
                         React.createElement("button", { className: 'btn btn-primary  w-100', onClick: function () { return setShowQuickPickModal(true); } }, "Quick Selects")),
                     React.createElement(react_interactive_1.Modal, { Show: showQuickPickModal, Title: 'Quick Selects', CallBack: function () { return setShowQuickPickModal(false); }, ShowX: true, ShowCancel: false, ShowConfirm: false, Size: 'xlg' },
                         React.createElement("div", { className: quickSelectCol },
-                            React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit }))))
+                            React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, QuickSelectRange: (_j = props.QuickSelectRange) !== null && _j !== void 0 ? _j : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) }))))
                 : null));
     }
 };

package/lib/TimeFilter/StartEndFilter/StartEndFilter.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { ITimeWindow } from "../TimeFilter";
-import { DateUnit } from '../QuickSelects';
 import { Gemstone } from '@gpa-gemstone/application-typings';
 import { TimeUnit } from '../TimeWindowUtils';
 export interface IFilterProps {
@@ -8,7 +7,8 @@ export interface IFilterProps {
     SetTimeWindowFilter: React.Dispatch<React.SetStateAction<ITimeWindow>>;
     HelpMessage?: string;
     Format: "YYYY-MM-DD" | "HH:mm:ss.SSS" | "MM/DD/YYYY HH:mm:ss.SSS";
-    DateUnit: DateUnit;
+    DateUnit: Gemstone.TSX.Types.DateUnit;
+    QuickSelectRange?: Gemstone.TSX.Types.QuickSelectRange;
     Timezone: string;
     Accuracy?: Gemstone.TSX.Types.Accuracy;
     ActiveQP: number;

package/lib/TimeFilter/StartEndFilter/TimeFilter.js

@@ -43,15 +43,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = __importStar(require("react"));
 var react_forms_1 = require("@gpa-gemstone/react-forms");
 var TimeFilter_1 = require("../TimeFilter");
-var QuickSelects_1 = __importDefault(require("../QuickSelects"));
+var QuickSelects_1 = __importStar(require("../QuickSelects"));
 var TimeFilter = function (props) {
+    var _a, _b;
     var FirstFallback_BreakpointQS = 634;
     var FirstFallback_BreakpointNoQS = 454;
     var handleSetTimeWindowFilter = React.useCallback(function (record) {
@@ -77,7 +75,7 @@ var TimeFilter = function (props) {
             React.createElement("div", { className: startEndCol },
                 React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: props.DateUnit, Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
             props.ShowQuickSelects ?
-                React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, AddRowContainer: false })
+                React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, AddRowContainer: false, QuickSelectRange: (_a = props.QuickSelectRange) !== null && _a !== void 0 ? _a : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) })
                 : null));
     else
         return (React.createElement(React.Fragment, null,
@@ -87,7 +85,7 @@ var TimeFilter = function (props) {
                 React.createElement("div", { className: startEndCol },
                     React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: "end", Help: props.HelpMessage, Setter: handleSetTimeWindowFilter, Label: 'End', Type: props.DateUnit, Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy }))),
             props.ShowQuickSelects ?
-                React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit })
+                React.createElement(QuickSelects_1.default, { DateTimeSetting: 'startEnd', Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, QuickSelectRange: (_b = props.QuickSelectRange) !== null && _b !== void 0 ? _b : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) })
                 : null));
 };
 exports.default = TimeFilter;

package/lib/TimeFilter/TimeFilter.d.ts

@@ -1,5 +1,4 @@
 import { IStartEnd, IStartDuration, IEndDuration, TimeUnit } from './TimeWindowUtils';
-import { DateUnit } from './QuickSelects';
 import { Gemstone } from '@gpa-gemstone/application-typings';
 export interface ITimeWindow {
     start: string;
@@ -38,7 +37,7 @@ interface IProps {
     /**
      * Format for date/time input
      */
-    format?: DateUnit;
+    format?: Gemstone.TSX.Types.DateUnit;
     /**
      * Accuracy of the time input
      */
@@ -47,6 +46,10 @@ interface IProps {
      * Flag to toggle usage of helper message
      */
     showHelpMessage?: boolean;
+    /**
+    * Optional choice of QuickSelect buttons
+    */
+    quickSelectRange?: Gemstone.TSX.Types.QuickSelectRange;
     /**
      * Optional Flag to enable collapsing of TimeFilter
      */

package/lib/TimeFilter/TimeFilter.js

@@ -100,11 +100,11 @@ var TimeFilter = function (props) {
                     React.createElement("button", { type: "button", className: "btn p-0 ml-auto", onClick: function () { return setCollapsed(function (x) { return !x; }); } }, collapsed ? React.createElement(gpa_symbols_1.ReactIcons.ArrowDropDown, null) : React.createElement(gpa_symbols_1.ReactIcons.ArrowDropUp, null)) : null)),
         collapsed ? null :
             props.dateTimeSetting === 'startEnd' ?
-                React.createElement(StartEndFilter_1.default, { TimeWindowFilter: filter, SetTimeWindowFilter: setFilter, Timezone: props.timeZone, ActiveQP: activeQuickSelect, SetActiveQP: setActiveQuickSelect, SetFilter: props.setFilter, Accuracy: props.accuracy, Format: format, DateUnit: (_c = props.format) !== null && _c !== void 0 ? _c : 'datetime-local', ShowQuickSelects: props.showQuickSelect, ContainerWidth: width, HelpMessage: helpMessaage })
+                React.createElement(StartEndFilter_1.default, { TimeWindowFilter: filter, SetTimeWindowFilter: setFilter, Timezone: props.timeZone, ActiveQP: activeQuickSelect, SetActiveQP: setActiveQuickSelect, SetFilter: props.setFilter, Accuracy: props.accuracy, Format: format, DateUnit: (_c = props.format) !== null && _c !== void 0 ? _c : 'datetime-local', ShowQuickSelects: props.showQuickSelect, ContainerWidth: width, HelpMessage: helpMessaage, QuickSelectRange: props.quickSelectRange })
                 : props.dateTimeSetting === 'startWindow' ?
-                    React.createElement(WindowFilter_1.default, { TimeWindowFilter: filter, SetTimeWindowFilter: setFilter, Timezone: props.timeZone, ActiveQP: activeQuickSelect, SetActiveQP: setActiveQuickSelect, SetFilter: props.setFilter, Accuracy: props.accuracy, Format: format, DateUnit: (_d = props.format) !== null && _d !== void 0 ? _d : 'datetime-local', ShowQuickSelects: props.showQuickSelect, ContainerWidth: width, HelpMessage: helpMessaage, Window: 'start' })
+                    React.createElement(WindowFilter_1.default, { TimeWindowFilter: filter, SetTimeWindowFilter: setFilter, Timezone: props.timeZone, ActiveQP: activeQuickSelect, SetActiveQP: setActiveQuickSelect, SetFilter: props.setFilter, Accuracy: props.accuracy, Format: format, DateUnit: (_d = props.format) !== null && _d !== void 0 ? _d : 'datetime-local', ShowQuickSelects: props.showQuickSelect, ContainerWidth: width, HelpMessage: helpMessaage, Window: 'start', QuickSelectRange: props.quickSelectRange })
                     :
-                        React.createElement(WindowFilter_1.default, { TimeWindowFilter: filter, SetTimeWindowFilter: setFilter, Timezone: props.timeZone, ActiveQP: activeQuickSelect, SetActiveQP: setActiveQuickSelect, SetFilter: props.setFilter, Accuracy: props.accuracy, Format: format, DateUnit: (_e = props.format) !== null && _e !== void 0 ? _e : 'datetime-local', ShowQuickSelects: props.showQuickSelect, ContainerWidth: width, HelpMessage: helpMessaage, Window: 'end' })));
+                        React.createElement(WindowFilter_1.default, { TimeWindowFilter: filter, SetTimeWindowFilter: setFilter, Timezone: props.timeZone, ActiveQP: activeQuickSelect, SetActiveQP: setActiveQuickSelect, SetFilter: props.setFilter, Accuracy: props.accuracy, Format: format, DateUnit: (_e = props.format) !== null && _e !== void 0 ? _e : 'datetime-local', ShowQuickSelects: props.showQuickSelect, ContainerWidth: width, HelpMessage: helpMessaage, Window: 'end', QuickSelectRange: props.quickSelectRange })));
 };
 // Converts ITimeFilter to an ITimeWindow filter
 function getTimeWindowFromFilter(flt, format) {

package/lib/TimeFilter/WindowFilter/WindowFilter.js

@@ -50,12 +50,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_forms_1 = require("@gpa-gemstone/react-forms");
 var React = __importStar(require("react"));
 var TimeFilter_1 = require("../TimeFilter");
-var QuickSelects_1 = __importDefault(require("../QuickSelects"));
+var QuickSelects_1 = __importStar(require("../QuickSelects"));
 var WindowForm_1 = __importDefault(require("./WindowForm"));
 var WINDOW_FirstFallbackBreakpoint = 898;
 var WINDOW_SecondFallbackBreakpoint = 611;
 var WindowFilter = function (props) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e, _f, _g;
     var DatePickerField = props.Window;
     var DatePickerLabel = props.Window.charAt(0).toUpperCase() + props.Window.slice(1);
     var filterType = props.Window === 'start' ? 'startWindow' : 'endWindow';
@@ -83,29 +83,29 @@ var WindowFilter = function (props) {
                 React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: DatePickerField, Help: props.HelpMessage, Setter: setter, Label: DatePickerLabel, Type: (_b = props.DateUnit) !== null && _b !== void 0 ? _b : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy }),
                 React.createElement(WindowForm_1.default, { Filter: props.TimeWindowFilter, SetFilter: props.SetTimeWindowFilter, SetActiveQP: props.SetActiveQP, Format: props.Format, ShowQuickSelect: props.ShowQuickSelects, Window: props.Window })),
             React.createElement("div", { className: 'col-8 pt-3' },
-                React.createElement(QuickSelects_1.default, { DateTimeSetting: filterType, Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit }))));
+                React.createElement(QuickSelects_1.default, { DateTimeSetting: filterType, Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, QuickSelectRange: (_c = props.QuickSelectRange) !== null && _c !== void 0 ? _c : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) }))));
     else if (props.ContainerWidth > WINDOW_SecondFallbackBreakpoint) {
         return (React.createElement(React.Fragment, null,
             React.createElement("div", { className: 'row m-0' },
                 React.createElement("div", { className: 'col-6' },
-                    React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: DatePickerField, Help: props.HelpMessage, Setter: setter, Label: DatePickerLabel, Type: (_c = props.DateUnit) !== null && _c !== void 0 ? _c : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
+                    React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: DatePickerField, Help: props.HelpMessage, Setter: setter, Label: DatePickerLabel, Type: (_d = props.DateUnit) !== null && _d !== void 0 ? _d : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy })),
                 React.createElement("div", { className: 'col-6' },
                     React.createElement(WindowForm_1.default, { Filter: props.TimeWindowFilter, SetFilter: props.SetTimeWindowFilter, SetActiveQP: props.SetActiveQP, Format: props.Format, ShowQuickSelect: props.ShowQuickSelects, Window: props.Window }))),
             React.createElement("div", { className: 'row m-0' },
                 React.createElement("div", { className: 'col-12' },
-                    React.createElement(QuickSelects_1.default, { DateTimeSetting: filterType, Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit })))));
+                    React.createElement(QuickSelects_1.default, { DateTimeSetting: filterType, Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, QuickSelectRange: (_e = props.QuickSelectRange) !== null && _e !== void 0 ? _e : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) })))));
     }
     else {
         return (React.createElement(React.Fragment, null,
             React.createElement("div", { className: 'row m-0' },
                 React.createElement("div", { className: 'col-12' },
-                    React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: DatePickerField, Help: props.HelpMessage, Setter: setter, Label: DatePickerLabel, Type: (_d = props.DateUnit) !== null && _d !== void 0 ? _d : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy }))),
+                    React.createElement(react_forms_1.DatePicker, { Record: props.TimeWindowFilter, Field: DatePickerField, Help: props.HelpMessage, Setter: setter, Label: DatePickerLabel, Type: (_f = props.DateUnit) !== null && _f !== void 0 ? _f : 'datetime-local', Valid: function () { return true; }, Format: props.Format, Accuracy: props.Accuracy }))),
             React.createElement("div", { className: 'row m-0' },
                 React.createElement("div", { className: 'col-12' },
                     React.createElement(WindowForm_1.default, { Filter: props.TimeWindowFilter, SetFilter: props.SetTimeWindowFilter, SetActiveQP: props.SetActiveQP, Format: props.Format, ShowQuickSelect: props.ShowQuickSelects, Window: props.Window }))),
             React.createElement("div", { className: 'row m-0' },
                 React.createElement("div", { className: 'col-12' },
-                    React.createElement(QuickSelects_1.default, { DateTimeSetting: filterType, Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit })))));
+                    React.createElement(QuickSelects_1.default, { DateTimeSetting: filterType, Timezone: props.Timezone, ActiveQP: props.ActiveQP, SetActiveQP: props.SetActiveQP, SetFilter: props.SetFilter, Format: props.Format, DateUnit: props.DateUnit, QuickSelectRange: (_g = props.QuickSelectRange) !== null && _g !== void 0 ? _g : (0, QuickSelects_1.getQuickSelectRange)(props.DateUnit) })))));
     }
 };
 exports.default = WindowFilter;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gpa-gemstone/common-pages",
-  "version": "0.0.161",
+  "version": "0.0.163",
   "description": "Common UI pages for GPA products",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -46,12 +46,12 @@
     "typescript": "5.5.3"
   },
   "dependencies":   {
-    "@gpa-gemstone/application-typings": "0.0.93",
+    "@gpa-gemstone/application-typings": "0.0.94",
     "@gpa-gemstone/gpa-symbols": "0.0.58",
-    "@gpa-gemstone/helper-functions": "0.0.52",
-    "@gpa-gemstone/react-forms": "1.1.108",
-    "@gpa-gemstone/react-interactive": "1.0.172",
-    "@gpa-gemstone/react-table": "1.2.95",
+    "@gpa-gemstone/helper-functions": "0.0.53",
+    "@gpa-gemstone/react-forms": "1.1.109",
+    "@gpa-gemstone/react-interactive": "1.0.173",
+    "@gpa-gemstone/react-table": "1.2.96",
     "@reduxjs/toolkit": "1.8.3",
     "crypto-js": "^4.2.0",
     "moment": "^2.29.4",