quidproquo-web-admin 0.1.1 → 0.1.2

package/lib/commonjs/LogViewer/LogSummaryDetails.js

@@ -15,7 +15,9 @@ const runtimeTypeToCamelCase = (runtimeType) => runtimeType.toLowerCase().replac
 const LogSummaryDetails = ({ log }) => {
     const [expanded, setExpanded] = (0, react_1.useState)(false);
     const totalRuntime = new Date(log.finishedAt).getTime() - new Date(log.startedAt).getTime();
-    const functionKey = log.qpqFunctionRuntimeInfo ? (0, quidproquo_core_1.getUniqueKeyFromQpqFunctionRuntime)(log.qpqFunctionRuntimeInfo) : runtimeTypeToCamelCase(log.runtimeType);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { display: "flex", alignItems: "center", children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "h5", gutterBottom: true, children: [log.runtimeType, " - ", log.moduleName] }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: expanded ? 'Collapse' : 'Expand', children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "small", onClick: () => setExpanded(!expanded), children: expanded ? (0, jsx_runtime_1.jsx)(ExpandLess_1.default, {}) : (0, jsx_runtime_1.jsx)(ExpandMore_1.default, {}) }) })] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("pre", { style: AnyVariableView_1.genericFunctionRendererStyles.pre, children: [(0, jsx_runtime_1.jsxs)("div", { style: AnyVariableView_1.genericFunctionRendererStyles.commentBlock, children: [(0, jsx_runtime_1.jsx)("div", { children: "// //////////////////////////////////////////////////////" }), (0, jsx_runtime_1.jsxs)("div", { children: ["// src: ", functionKey] }), log.fromCorrelation && (0, jsx_runtime_1.jsxs)("div", { children: ["// Caller: ", log.fromCorrelation] }), (0, jsx_runtime_1.jsxs)("div", { children: ["// Total Runtime: ", (0, jsx_runtime_1.jsxs)("span", { style: AnyVariableView_1.genericFunctionRendererStyles.highlightComment, children: [totalRuntime, " ms"] })] }), (0, jsx_runtime_1.jsx)("div", { children: "// //////////////////////////////////////////////////////" })] }), (0, jsx_runtime_1.jsx)(AnyVariableView_1.GenericFunctionRenderer, { functionName: functionKey.split('::').pop() || 'unknown', args: log.input, expanded: expanded })] }) })] }));
+    const functionKey = log.qpqFunctionRuntimeInfo
+        ? (0, quidproquo_core_1.getUniqueKeyFromQpqFunctionRuntime)(log.qpqFunctionRuntimeInfo)
+        : runtimeTypeToCamelCase(log.runtimeType);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { alignItems: "center", display: "flex", children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, { gutterBottom: true, variant: "h5", children: [log.runtimeType, " - ", log.moduleName] }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: expanded ? 'Collapse' : 'Expand', children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => setExpanded(!expanded), size: "small", children: expanded ? (0, jsx_runtime_1.jsx)(ExpandLess_1.default, {}) : (0, jsx_runtime_1.jsx)(ExpandMore_1.default, {}) }) })] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("pre", { style: AnyVariableView_1.genericFunctionRendererStyles.pre, children: [(0, jsx_runtime_1.jsxs)("div", { style: AnyVariableView_1.genericFunctionRendererStyles.commentBlock, children: [(0, jsx_runtime_1.jsx)("div", { children: '// //////////////////////////////////////////////////////' }), (0, jsx_runtime_1.jsxs)("div", { children: ['// src: ', functionKey] }), log.fromCorrelation && ((0, jsx_runtime_1.jsxs)("div", { children: ['// Caller: ', log.fromCorrelation] })), (0, jsx_runtime_1.jsxs)("div", { children: ['// Total Runtime: ', (0, jsx_runtime_1.jsxs)("span", { style: AnyVariableView_1.genericFunctionRendererStyles.highlightComment, children: [totalRuntime, " ms"] })] }), (0, jsx_runtime_1.jsx)("div", { children: '// //////////////////////////////////////////////////////' })] }), (0, jsx_runtime_1.jsx)(AnyVariableView_1.GenericFunctionRenderer, { args: log.input, expanded: expanded, functionName: functionKey.split('::').pop() || 'unknown' })] }) })] }));
 };
 exports.LogSummaryDetails = LogSummaryDetails;

package/lib/commonjs/LogViewer/LogSummaryReturn.js

@@ -12,6 +12,6 @@ const material_1 = require("@mui/material");
 const actionComponents_1 = require("./actionComponents");
 const LogSummaryReturn = ({ log }) => {
     const [expanded, setExpanded] = (0, react_1.useState)(false);
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { display: "flex", alignItems: "center", children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", gutterBottom: true, children: log.error ? 'Thrown Error' : 'Returned' }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: expanded ? 'Collapse' : 'Expand', children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "small", onClick: () => setExpanded(!expanded), children: expanded ? (0, jsx_runtime_1.jsx)(ExpandLess_1.default, {}) : (0, jsx_runtime_1.jsx)(ExpandMore_1.default, {}) }) })] }), (0, jsx_runtime_1.jsx)("pre", { style: { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }, children: (0, jsx_runtime_1.jsx)("pre", { style: actionComponents_1.genericFunctionRendererStyles.pre, children: log.error ? (0, jsx_runtime_1.jsx)(actionComponents_1.AnyVariableView, { value: log.error, expanded: expanded }) : (0, jsx_runtime_1.jsx)(actionComponents_1.AnyVariableView, { value: log.result, expanded: expanded }) }) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { alignItems: "center", display: "flex", children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { gutterBottom: true, variant: "h6", children: log.error ? 'Thrown Error' : 'Returned' }), (0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: expanded ? 'Collapse' : 'Expand', children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => setExpanded(!expanded), size: "small", children: expanded ? (0, jsx_runtime_1.jsx)(ExpandLess_1.default, {}) : (0, jsx_runtime_1.jsx)(ExpandMore_1.default, {}) }) })] }), (0, jsx_runtime_1.jsx)("pre", { style: { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }, children: (0, jsx_runtime_1.jsx)("pre", { style: actionComponents_1.genericFunctionRendererStyles.pre, children: log.error ? (0, jsx_runtime_1.jsx)(actionComponents_1.AnyVariableView, { expanded: expanded, value: log.error }) : (0, jsx_runtime_1.jsx)(actionComponents_1.AnyVariableView, { expanded: expanded, value: log.result }) }) })] }));
 };
 exports.LogSummaryReturn = LogSummaryReturn;

package/lib/commonjs/LogViewer/TopSection.js

@@ -35,20 +35,20 @@ function TopSection({ onSearch }) {
         updateStartAndEndTimeSpan(minutes);
         handleQuickTimeClose();
     };
-    return ((0, jsx_runtime_1.jsxs)(x_date_pickers_1.LocalizationProvider, { dateAdapter: AdapterDateFns_1.AdapterDateFns, children: [(0, jsx_runtime_1.jsxs)(Grid_1.default, { container: true, columns: 12, spacing: 2, children: [(0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsxs)(FormControl_1.default, { fullWidth: true, children: [(0, jsx_runtime_1.jsx)(InputLabel_1.default, { id: "runtime-select-label", children: "Runtime Type" }), (0, jsx_runtime_1.jsx)(Select_1.default, { labelId: "runtime-select-label", id: "demo-simple-select", value: runtimeType, label: "Runtime Type", onChange: handleRuntimeTypeOnChange, children: constants_1.RuntimeTypes.map((key) => ((0, jsx_runtime_1.jsx)(MenuItem_1.default, { value: key, children: key }, key))) })] }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { getOptionLabel: (option) => option.label, options: serviceOptions, value: serviceOptions.find((o) => o.value === service) || null, onChange: handleServiceOnChange, renderInput: (params) => ((0, jsx_runtime_1.jsx)(TextField_1.default, Object.assign({}, params, { label: "Service Name", InputLabelProps: {
+    return ((0, jsx_runtime_1.jsxs)(x_date_pickers_1.LocalizationProvider, { dateAdapter: AdapterDateFns_1.AdapterDateFns, children: [(0, jsx_runtime_1.jsxs)(Grid_1.default, { columns: 12, container: true, spacing: 2, children: [(0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsxs)(FormControl_1.default, { fullWidth: true, children: [(0, jsx_runtime_1.jsx)(InputLabel_1.default, { id: "runtime-select-label", children: "Runtime Type" }), (0, jsx_runtime_1.jsx)(Select_1.default, { id: "demo-simple-select", label: "Runtime Type", labelId: "runtime-select-label", onChange: handleRuntimeTypeOnChange, value: runtimeType, children: constants_1.RuntimeTypes.map((key) => ((0, jsx_runtime_1.jsx)(MenuItem_1.default, { value: key, children: key }, key))) })] }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { getOptionLabel: (option) => option.label, onChange: handleServiceOnChange, options: serviceOptions, renderInput: (params) => ((0, jsx_runtime_1.jsx)(TextField_1.default, Object.assign({}, params, { InputLabelProps: {
                                         shrink: true,
-                                    } }))) }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsxs)(system_1.Box, { position: "relative", children: [(0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePicker, { label: "Start DateTime", value: startDate, onChange: handleStartDateChange }) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { "aria-label": "quick time select", "aria-controls": "quick-time-menu", "aria-haspopup": "true", onClick: handleQuickTimeClick, sx: {
+                                    }, label: "Service Name" }))), value: serviceOptions.find((o) => o.value === service) || null }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsxs)(system_1.Box, { position: "relative", children: [(0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePicker, { label: "Start DateTime", onChange: handleStartDateChange, value: startDate }) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { "aria-controls": "quick-time-menu", "aria-haspopup": "true", "aria-label": "quick time select", onClick: handleQuickTimeClick, sx: {
                                         position: 'absolute',
                                         right: '-28px',
                                         top: '50%',
                                         transform: 'translateY(-50%)',
-                                    }, children: (0, jsx_runtime_1.jsx)(ExpandMore_1.default, {}) })] }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePicker, { label: "End DateTime", value: endDate, onChange: handleEndDateChange }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 4, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(TextField_1.default, { label: "User", value: user, onChange: handleUserOnChange, InputLabelProps: {
+                                    }, children: (0, jsx_runtime_1.jsx)(ExpandMore_1.default, {}) })] }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePicker, { label: "End DateTime", onChange: handleEndDateChange, value: endDate }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 4, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(TextField_1.default, { InputLabelProps: {
                                     shrink: true,
-                                } }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(TextField_1.default, { label: "Info", value: info, onChange: handleInfoOnChange, InputLabelProps: {
+                                }, label: "User", onChange: handleUserOnChange, value: user }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(TextField_1.default, { InputLabelProps: {
                                     shrink: true,
-                                } }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(TextField_1.default, { label: "Error Filter", value: error, onChange: handleErrorOnChange, InputLabelProps: {
+                                }, label: "Info", onChange: handleInfoOnChange, value: info }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(TextField_1.default, { InputLabelProps: {
                                     shrink: true,
-                                } }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 10, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(TextField_1.default, { label: "Deep Search", value: deep, onChange: handleDeepOnChange, placeholder: "Use with caution, reduce results with above fields first, this is a contains search on the log JSON, so it will be slow.", InputLabelProps: {
+                                }, label: "Error Filter", onChange: handleErrorOnChange, value: error }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 10, children: (0, jsx_runtime_1.jsx)(FormControl_1.default, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(TextField_1.default, { InputLabelProps: {
                                     shrink: true,
-                                } }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsx)(AsyncButton_1.AsyncButton, { onClick: () => onSearch(), children: "Search" }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Menu, { id: "quick-time-menu", anchorEl: anchorEl, keepMounted: true, open: Boolean(anchorEl), onClose: handleQuickTimeClose, children: [(0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(5), children: "Last 5 minutes" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(30), children: "Last 30 minutes" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(1 * 60), children: "Last hour" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(3 * 60), children: "Last 3 hours" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(8 * 60), children: "Last 8 hours" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(16 * 60), children: "Last 16 hours" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(24 * 60), children: "Last 24 hours" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(7 * 24 * 60), children: "Last 7 days" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(30 * 24 * 60), children: "Last month" })] })] }));
+                                }, label: "Deep Search", onChange: handleDeepOnChange, placeholder: "Use with caution, reduce results with above fields first, this is a contains search on the log JSON, so it will be slow.", value: deep }) }) }), (0, jsx_runtime_1.jsx)(Grid_1.default, { item: true, xs: 2, children: (0, jsx_runtime_1.jsx)(AsyncButton_1.AsyncButton, { onClick: () => onSearch(), children: "Search" }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Menu, { anchorEl: anchorEl, id: "quick-time-menu", keepMounted: true, onClose: handleQuickTimeClose, open: Boolean(anchorEl), children: [(0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(5), children: "Last 5 minutes" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(30), children: "Last 30 minutes" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(1 * 60), children: "Last hour" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(3 * 60), children: "Last 3 hours" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(8 * 60), children: "Last 8 hours" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(16 * 60), children: "Last 16 hours" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(24 * 60), children: "Last 24 hours" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(7 * 24 * 60), children: "Last 7 days" }), (0, jsx_runtime_1.jsx)(MenuItem_1.default, { onClick: () => handleQuickTimeSelect(30 * 24 * 60), children: "Last month" })] })] }));
 }

package/lib/commonjs/LogViewer/actionComponents/custom/CoreContextListCustomAction.js

@@ -5,6 +5,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const genericActionRenderer_1 = require("../genericActionRenderer");
 const CoreContextListCustomAction = ({ result, expanded, }) => {
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '100%', my: 1 }, children: (0, jsx_runtime_1.jsx)("pre", { style: genericActionRenderer_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(genericActionRenderer_1.AnyVariableView, { value: result, expanded: expanded }) }) }));
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '100%', my: 1 }, children: (0, jsx_runtime_1.jsx)("pre", { style: genericActionRenderer_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(genericActionRenderer_1.AnyVariableView, { expanded: expanded, value: result }) }) }));
 };
 exports.CoreContextListCustomAction = CoreContextListCustomAction;

package/lib/commonjs/LogViewer/actionComponents/custom/CoreLogCreateCustomAction.js

@@ -30,6 +30,6 @@ const CoreLogCreateCustomAction = ({ action, expanded }) => {
         return null;
     }
     const { logLevel, msg, data } = action.payload;
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '100%', my: 1 }, children: (0, jsx_runtime_1.jsxs)(Alert_1.default, { severity: getSeverity(logLevel), children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", fontWeight: "bold", children: (0, quidproquo_core_1.resolveLookupText)(logLevel, quidproquo_core_1.LogLevelEnum) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: msg }), data && ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", sx: { mt: 1, whiteSpace: 'pre-wrap' }, children: (0, jsx_runtime_1.jsx)("pre", { style: genericActionRenderer_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(genericActionRenderer_1.AnyVariableView, { value: data, expanded: expanded }) }) }))] }) }));
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '100%', my: 1 }, children: (0, jsx_runtime_1.jsxs)(Alert_1.default, { severity: getSeverity(logLevel), children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { fontWeight: "bold", variant: "body1", children: (0, quidproquo_core_1.resolveLookupText)(logLevel, quidproquo_core_1.LogLevelEnum) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: msg }), data && ((0, jsx_runtime_1.jsx)(material_1.Typography, { sx: { mt: 1, whiteSpace: 'pre-wrap' }, variant: "body2", children: (0, jsx_runtime_1.jsx)("pre", { style: genericActionRenderer_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(genericActionRenderer_1.AnyVariableView, { expanded: expanded, value: data }) }) }))] }) }));
 };
 exports.CoreLogCreateCustomAction = CoreLogCreateCustomAction;

package/lib/commonjs/LogViewer/actionComponents/custom/CoreLogDisableEventHistoryCustomAction.js

@@ -12,6 +12,6 @@ const CoreLogDisableEventHistoryCustomAction = ({ action }) => {
         return null;
     }
     const { reason } = action.payload;
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '100%', my: 1 }, children: (0, jsx_runtime_1.jsx)(Alert_1.default, { severity: 'warning', children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", fontWeight: "bold", children: reason }) }) }));
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '100%', my: 1 }, children: (0, jsx_runtime_1.jsx)(Alert_1.default, { severity: 'warning', children: (0, jsx_runtime_1.jsx)(material_1.Typography, { fontWeight: "bold", variant: "body1", children: reason }) }) }));
 };
 exports.CoreLogDisableEventHistoryCustomAction = CoreLogDisableEventHistoryCustomAction;

package/lib/commonjs/LogViewer/actionComponents/custom/CoreLogTemplateLiteralCustomAction.js

@@ -13,6 +13,6 @@ const CoreLogTemplateLiteralCustomAction = ({ action, expanded }) => {
         return null;
     }
     const { messageParts: [strings, values], } = action.payload;
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '100%', my: 1 }, children: (0, jsx_runtime_1.jsx)(Alert_1.default, { severity: 'info', children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: values.reduce((preComp, value, index) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [preComp, (0, jsx_runtime_1.jsx)(genericActionRenderer_1.AnyVariableView, { value: value, expanded: expanded, hideStringQuotes: true }), (0, jsx_runtime_1.jsx)("span", { children: strings[index + 1] })] })), (0, jsx_runtime_1.jsx)("span", { children: strings[0] })) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: '100%', my: 1 }, children: (0, jsx_runtime_1.jsx)(Alert_1.default, { severity: 'info', children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", children: values.reduce((preComp, value, index) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [preComp, (0, jsx_runtime_1.jsx)(genericActionRenderer_1.AnyVariableView, { expanded: expanded, hideStringQuotes: true, value: value }), (0, jsx_runtime_1.jsx)("span", { children: strings[index + 1] })] })), (0, jsx_runtime_1.jsx)("span", { children: strings[0] })) }) }) }));
 };
 exports.CoreLogTemplateLiteralCustomAction = CoreLogTemplateLiteralCustomAction;

package/lib/commonjs/LogViewer/actionComponents/custom/CoreNetworkRequestCustomAction.js

@@ -11,7 +11,7 @@ const CoreNetworkRequestCustomAction = ({ action, result, expanded }) => {
     if (!action.payload) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("pre", { style: genericActionRenderer_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(genericActionRenderer_1.GenericFunctionRenderer, { functionName: 'askNetworkRequest', args: [
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("pre", { style: genericActionRenderer_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(genericActionRenderer_1.GenericFunctionRenderer, { args: [
                         action.payload.method,
                         action.payload.url,
                         {
@@ -21,6 +21,6 @@ const CoreNetworkRequestCustomAction = ({ action, result, expanded }) => {
                             params: action.payload.params,
                             responseType: action.payload.responseType,
                         },
-                    ], tooltipMap: ['method', 'url', 'httpRequestOptions'], expanded: expanded }) }), (0, jsx_runtime_1.jsx)(ActionResultDisplay_1.default, { action: action, result: result, expanded: expanded })] }));
+                    ], expanded: expanded, functionName: 'askNetworkRequest', tooltipMap: ['method', 'url', 'httpRequestOptions'] }) }), (0, jsx_runtime_1.jsx)(ActionResultDisplay_1.default, { action: action, expanded: expanded, result: result })] }));
 };
 exports.CoreNetworkRequestCustomAction = CoreNetworkRequestCustomAction;

package/lib/commonjs/LogViewer/actionComponents/genericActionRenderer/ActionResultDisplay.js

@@ -5,7 +5,7 @@ const AnyVariableView_1 = require("./AnyVariableView");
 const AnyVariableView_2 = require("./AnyVariableView");
 const ActionResultDisplay = ({ result, expanded }) => {
     const [successResult, errorResult] = result || [];
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [successResult !== undefined && !errorResult && ((0, jsx_runtime_1.jsxs)("pre", { style: AnyVariableView_1.genericFunctionRendererStyles.pre, children: [(0, jsx_runtime_1.jsx)("span", { children: "Result: " }), (0, jsx_runtime_1.jsx)(AnyVariableView_2.AnyVariableView, { value: successResult, expanded: expanded })] })), errorResult !== undefined && ((0, jsx_runtime_1.jsx)("pre", { style: AnyVariableView_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(AnyVariableView_2.AnyVariableView, { value: errorResult, expanded: expanded }) }))] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [successResult !== undefined && !errorResult && ((0, jsx_runtime_1.jsxs)("pre", { style: AnyVariableView_1.genericFunctionRendererStyles.pre, children: [(0, jsx_runtime_1.jsx)("span", { children: "Result: " }), (0, jsx_runtime_1.jsx)(AnyVariableView_2.AnyVariableView, { expanded: expanded, value: successResult })] })), errorResult !== undefined && ((0, jsx_runtime_1.jsx)("pre", { style: AnyVariableView_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(AnyVariableView_2.AnyVariableView, { expanded: expanded, value: errorResult }) }))] }));
 };
 // Make sure to export ActionResultDisplay if it's defined in a separate file
 exports.default = ActionResultDisplay;

package/lib/commonjs/LogViewer/actionComponents/genericActionRenderer/AnyVariableView/AnyVariableView.js

@@ -66,13 +66,13 @@ const tryDecodeBase64 = (text) => {
 const StringVariableView = ({ value, expanded, hideStringQuotes }) => {
     const asJson = tryParseJson(value);
     if (asJson.ok) {
-        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { style: exports.genericFunctionRendererStyles.jsonComment, children: ['<', "json", '>'] }), (0, jsx_runtime_1.jsx)(exports.AnyVariableView, { value: asJson.value, expanded: expanded })] }));
+        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { style: exports.genericFunctionRendererStyles.jsonComment, children: ['<', "json", '>'] }), (0, jsx_runtime_1.jsx)(exports.AnyVariableView, { expanded: expanded, value: asJson.value })] }));
     }
     const decoded = tryDecodeBase64(value);
     if (decoded !== undefined) {
         const asBase64Json = tryParseJson(decoded);
         if (asBase64Json.ok) {
-            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { style: exports.genericFunctionRendererStyles.jsonComment, children: ['<', "base64-json", '>'] }), (0, jsx_runtime_1.jsx)(exports.AnyVariableView, { value: asBase64Json.value, expanded: expanded })] }));
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { style: exports.genericFunctionRendererStyles.jsonComment, children: ['<', "base64-json", '>'] }), (0, jsx_runtime_1.jsx)(exports.AnyVariableView, { expanded: expanded, value: asBase64Json.value })] }));
         }
     }
     const trimmedValue = value.length > 25 && !expanded ? `${value.slice(0, 25)}...` : value;
@@ -87,17 +87,17 @@ const ArrayVariableView = ({ value, expanded }) => {
         return !expanded ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: "[" }), (0, jsx_runtime_1.jsx)("span", { style: exports.genericFunctionRendererStyles.emptyObject, children: "Empty Array" }), (0, jsx_runtime_1.jsx)("span", { children: "]" })] })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "[]" }));
     }
     if (expanded) {
-        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: "[" }), (0, jsx_runtime_1.jsx)("div", { style: { paddingLeft: 10 }, children: value.map((item, index) => ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(exports.AnyVariableView, { value: item, expanded: expanded }), ","] }, index))) }), (0, jsx_runtime_1.jsx)("span", { children: "]" })] }));
+        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: "[" }), (0, jsx_runtime_1.jsx)("div", { style: { paddingLeft: 10 }, children: value.map((item, index) => ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(exports.AnyVariableView, { expanded: expanded, value: item }), ","] }, index))) }), (0, jsx_runtime_1.jsx)("span", { children: "]" })] }));
     }
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: "[ " }), (0, jsx_runtime_1.jsxs)("span", { style: exports.genericFunctionRendererStyles.arrayItems, children: [value.length, " items"] }), (0, jsx_runtime_1.jsx)("span", { children: " ]" })] }));
 };
 exports.ArrayVariableView = ArrayVariableView;
 const KvsQueryConditionVariableView = ({ value, expanded }) => {
-    return (0, jsx_runtime_1.jsx)(exports.GenericFunctionRenderer, { functionName: `kvs${value.operation}`, args: [value.key, value.valueA], expanded: expanded });
+    return (0, jsx_runtime_1.jsx)(exports.GenericFunctionRenderer, { args: [value.key, value.valueA], expanded: expanded, functionName: `kvs${value.operation}` });
 };
 exports.KvsQueryConditionVariableView = KvsQueryConditionVariableView;
 const KvsLogicalOperatorVariableView = ({ value, expanded }) => {
-    return (0, jsx_runtime_1.jsx)(exports.GenericFunctionRenderer, { functionName: `kvs${value.operation}`, args: [value.conditions], expanded: expanded });
+    return (0, jsx_runtime_1.jsx)(exports.GenericFunctionRenderer, { args: [value.conditions], expanded: expanded, functionName: `kvs${value.operation}` });
 };
 exports.KvsLogicalOperatorVariableView = KvsLogicalOperatorVariableView;
 const EmptyObjectVariableView = ({ value, expanded }) => {
@@ -105,29 +105,29 @@ const EmptyObjectVariableView = ({ value, expanded }) => {
 };
 exports.EmptyObjectVariableView = EmptyObjectVariableView;
 const QpqBinaryDataVariableView = ({ value, expanded }) => {
-    return ((0, jsx_runtime_1.jsx)("img", { src: `data:${value.mimeType || 'image/jpeg'};base64,${value.base64Data}`, alt: "Binary Data", style: { width: '100px', height: 'auto' } }));
+    return ((0, jsx_runtime_1.jsx)("img", { alt: "Binary Data", src: `data:${value.mimeType || 'image/jpeg'};base64,${value.base64Data}`, style: { width: '100px', height: 'auto' } }));
 };
 exports.QpqBinaryDataVariableView = QpqBinaryDataVariableView;
 const ObjectVariableView = ({ value, expanded }) => {
     if (Array.isArray(value)) {
-        return (0, jsx_runtime_1.jsx)(exports.ArrayVariableView, { value: value, expanded: expanded });
+        return (0, jsx_runtime_1.jsx)(exports.ArrayVariableView, { expanded: expanded, value: value });
     }
     const objectKeys = Object.keys(value);
     if (value.operation && value.key && objectKeys.length <= 4) {
-        return (0, jsx_runtime_1.jsx)(exports.KvsQueryConditionVariableView, { value: value, expanded: expanded });
+        return (0, jsx_runtime_1.jsx)(exports.KvsQueryConditionVariableView, { expanded: expanded, value: value });
     }
     else if (value.operation && value.conditions && objectKeys.length == 2) {
-        return (0, jsx_runtime_1.jsx)(exports.KvsLogicalOperatorVariableView, { value: value, expanded: expanded });
+        return (0, jsx_runtime_1.jsx)(exports.KvsLogicalOperatorVariableView, { expanded: expanded, value: value });
     }
     else if (objectKeys.length == 0) {
-        return (0, jsx_runtime_1.jsx)(exports.EmptyObjectVariableView, { value: value, expanded: expanded });
+        return (0, jsx_runtime_1.jsx)(exports.EmptyObjectVariableView, { expanded: expanded, value: value });
     }
     else if (value.base64Data && value.filename) {
-        return (0, jsx_runtime_1.jsx)(exports.QpqBinaryDataVariableView, { value: value, expanded: expanded });
+        return (0, jsx_runtime_1.jsx)(exports.QpqBinaryDataVariableView, { expanded: expanded, value: value });
     }
     const cleanObject = JSON.parse(JSON.stringify(value));
     const cleanObjectKeys = Object.keys(cleanObject);
-    return !expanded ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: '{ ' }), cleanObjectKeys.map((key, index) => ((0, jsx_runtime_1.jsxs)("span", { children: [key, Array.isArray(cleanObject[key]) && !expanded && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: ":" }), " ", (0, jsx_runtime_1.jsx)(exports.ArrayVariableView, { value: cleanObject[key], expanded: false })] })), index < cleanObjectKeys.length - 1 && ', '] }, key))), (0, jsx_runtime_1.jsx)("span", { children: ' }' })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: '{ ' }), (0, jsx_runtime_1.jsx)("div", { style: { paddingLeft: 10 }, children: cleanObjectKeys.map((key, index) => ((0, jsx_runtime_1.jsxs)("div", { children: [key, ": ", (0, jsx_runtime_1.jsx)(exports.AnyVariableView, { value: cleanObject[key], expanded: expanded }), ","] }, key))) }), (0, jsx_runtime_1.jsx)("span", { children: '}' })] }));
+    return !expanded ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: '{ ' }), cleanObjectKeys.map((key, index) => ((0, jsx_runtime_1.jsxs)("span", { children: [key, Array.isArray(cleanObject[key]) && !expanded && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: ":" }), " ", (0, jsx_runtime_1.jsx)(exports.ArrayVariableView, { expanded: false, value: cleanObject[key] })] })), index < cleanObjectKeys.length - 1 && ', '] }, key))), (0, jsx_runtime_1.jsx)("span", { children: ' }' })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: '{ ' }), (0, jsx_runtime_1.jsx)("div", { style: { paddingLeft: 10 }, children: cleanObjectKeys.map((key, index) => ((0, jsx_runtime_1.jsxs)("div", { children: [key, ": ", (0, jsx_runtime_1.jsx)(exports.AnyVariableView, { expanded: expanded, value: cleanObject[key] }), ","] }, key))) }), (0, jsx_runtime_1.jsx)("span", { children: '}' })] }));
 };
 exports.ObjectVariableView = ObjectVariableView;
 // Helper function to style values based on their type
@@ -145,10 +145,10 @@ const AnyVariableView = ({ value, expanded, hideStringQuotes }) => {
         return (0, jsx_runtime_1.jsx)("span", { style: exports.genericFunctionRendererStyles.numberValue, children: value });
     }
     else if (typeof value === 'string') {
-        return (0, jsx_runtime_1.jsx)(exports.StringVariableView, { value: value, expanded: expanded, hideStringQuotes: hideStringQuotes });
+        return (0, jsx_runtime_1.jsx)(exports.StringVariableView, { expanded: expanded, hideStringQuotes: hideStringQuotes, value: value });
     }
     else if (typeof value === 'object') {
-        return (0, jsx_runtime_1.jsx)(exports.ObjectVariableView, { value: value, expanded: expanded });
+        return (0, jsx_runtime_1.jsx)(exports.ObjectVariableView, { expanded: expanded, value: value });
     }
     // Fallback for other types, using normal text color
     return (0, jsx_runtime_1.jsx)("span", { children: value.toString() });
@@ -156,7 +156,7 @@ const AnyVariableView = ({ value, expanded, hideStringQuotes }) => {
 exports.AnyVariableView = AnyVariableView;
 const renderBasicArg = (arg, value, index, expanded, tooltip) => {
     const tooltipText = `${tooltip || arg}\n\nvalue: ${JSON.stringify(value, null, 2)}`;
-    return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsx)("span", { title: tooltipText, children: (0, jsx_runtime_1.jsx)(exports.AnyVariableView, { value: value, expanded: expanded }) }) }, arg));
+    return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsx)("span", { title: tooltipText, children: (0, jsx_runtime_1.jsx)(exports.AnyVariableView, { expanded: expanded, value: value }) }) }, arg));
 };
 const GenericFunctionRenderer = ({ functionName, args, expanded, tooltipMap = [], argRenderer = renderBasicArg, }) => {
     // Convert args object to an array of key-value pairs and map each to a span element with dynamic styling and optional tooltip

package/lib/commonjs/LogViewer/actionComponents/genericActionRenderer/getGenericActionRenderer.js

@@ -7,9 +7,12 @@ exports.getGenericActionRenderer = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ActionResultDisplay_1 = __importDefault(require("./ActionResultDisplay"));
 const AnyVariableView_1 = require("./AnyVariableView"); // Assuming this is the correct path
-const getGenericActionRenderer = (functionName, argMap, tooltipMap = argMap) => ({ action, expanded, result }) => {
-    const anyPayload = action.payload;
-    const args = argMap.reduce((acc, arg) => (Object.assign(Object.assign({}, acc), { [arg]: anyPayload[arg] })), {});
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("pre", { style: AnyVariableView_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(AnyVariableView_1.GenericFunctionRenderer, { functionName: functionName, args: args, tooltipMap: tooltipMap, expanded: expanded }) }), (0, jsx_runtime_1.jsx)(ActionResultDisplay_1.default, { action: action, result: result, expanded: expanded })] }));
+const getGenericActionRenderer = (functionName, argMap, tooltipMap = argMap) => {
+    const GenericActionRenderer = ({ action, expanded, result }) => {
+        const anyPayload = action.payload;
+        const args = argMap.reduce((acc, arg) => (Object.assign(Object.assign({}, acc), { [arg]: anyPayload[arg] })), {});
+        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("pre", { style: AnyVariableView_1.genericFunctionRendererStyles.pre, children: (0, jsx_runtime_1.jsx)(AnyVariableView_1.GenericFunctionRenderer, { args: args, expanded: expanded, functionName: functionName, tooltipMap: tooltipMap }) }), (0, jsx_runtime_1.jsx)(ActionResultDisplay_1.default, { action: action, expanded: expanded, result: result })] }));
+    };
+    return GenericActionRenderer;
 };
 exports.getGenericActionRenderer = getGenericActionRenderer;

package/lib/commonjs/LogViewer/charts/CostPerService.js

@@ -28,6 +28,6 @@ const CostPerService = ({ logs }) => {
         }))
             .sort((a, b) => b.cost - a.cost);
     }, [logs]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h5", gutterBottom: true, children: "Cost per Service" }), (0, jsx_runtime_1.jsx)(material_1.TableContainer, { component: material_1.Paper, children: (0, jsx_runtime_1.jsxs)(material_1.Table, { children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { children: "Service" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: "Executions" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: "Runtime (ms)" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: "Cost ($)" })] }) }), (0, jsx_runtime_1.jsx)(material_1.TableBody, { children: data.map((row) => ((0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { component: "th", scope: "row", children: row.service }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: row.executions }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: row.runtime }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: row.cost.toFixed(8) })] }, row.service))) })] }) })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { gutterBottom: true, variant: "h5", children: "Cost per Service" }), (0, jsx_runtime_1.jsx)(material_1.TableContainer, { component: material_1.Paper, children: (0, jsx_runtime_1.jsxs)(material_1.Table, { children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { children: "Service" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: "Executions" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: "Runtime (ms)" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: "Cost ($)" })] }) }), (0, jsx_runtime_1.jsx)(material_1.TableBody, { children: data.map((row) => ((0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { component: "th", scope: "row", children: row.service }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: row.executions }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: row.runtime }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: row.cost.toFixed(8) })] }, row.service))) })] }) })] }));
 };
 exports.CostPerService = CostPerService;

package/lib/commonjs/LogViewer/charts/ErrorsByType.js

@@ -7,6 +7,6 @@ const material_1 = require("@mui/material");
 const useErrorsByType_1 = require("../hooks/useErrorsByType");
 const ErrorsByType = ({ logs }) => {
     const data = (0, useErrorsByType_1.useErrorsByType)(logs);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h5", gutterBottom: true, children: "Errors by Type" }), (0, jsx_runtime_1.jsxs)(recharts_1.BarChart, { width: 1200, height: 300, data: data, children: [(0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: "3 3" }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: "errorText" }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, {}), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, {}), (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), (0, jsx_runtime_1.jsx)(recharts_1.Bar, { dataKey: "count", fill: "#8884d8" })] }), (0, jsx_runtime_1.jsx)(material_1.TableContainer, { component: material_1.Paper, children: (0, jsx_runtime_1.jsxs)(material_1.Table, { children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { children: "Error Type" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: "Count" })] }) }), (0, jsx_runtime_1.jsx)(material_1.TableBody, { children: data.map((row) => ((0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { component: "th", scope: "row", children: row.errorText }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: row.count })] }, row.errorText))) })] }) })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { gutterBottom: true, variant: "h5", children: "Errors by Type" }), (0, jsx_runtime_1.jsxs)(recharts_1.BarChart, { data: data, height: 300, width: 1200, children: [(0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: "3 3" }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: "errorText" }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, {}), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, {}), (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), (0, jsx_runtime_1.jsx)(recharts_1.Bar, { dataKey: "count", fill: "#8884d8" })] }), (0, jsx_runtime_1.jsx)(material_1.TableContainer, { component: material_1.Paper, children: (0, jsx_runtime_1.jsxs)(material_1.Table, { children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { children: "Error Type" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: "Count" })] }) }), (0, jsx_runtime_1.jsx)(material_1.TableBody, { children: data.map((row) => ((0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { component: "th", scope: "row", children: row.errorText }), (0, jsx_runtime_1.jsx)(material_1.TableCell, { align: "right", children: row.count })] }, row.errorText))) })] }) })] }));
 };
 exports.ErrorsByType = ErrorsByType;

package/lib/commonjs/LogViewer/charts/ErrorsOverTime.js

@@ -7,6 +7,6 @@ const material_1 = require("@mui/material");
 const useErrorsOverTime_1 = require("../hooks/useErrorsOverTime");
 const ErrorsOverTime = ({ logs, searchParams }) => {
     const data = (0, useErrorsOverTime_1.useErrorsOverTime)(logs, searchParams);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h5", gutterBottom: true, children: "Errors Over Time" }), (0, jsx_runtime_1.jsxs)(recharts_1.LineChart, { width: 1200, height: 300, data: data, children: [(0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: "3 3" }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: "time" }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, {}), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, {}), (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), (0, jsx_runtime_1.jsx)(recharts_1.Line, { type: "monotone", dataKey: "errors", stroke: "#8884d8", activeDot: { r: 8 } })] })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { gutterBottom: true, variant: "h5", children: "Errors Over Time" }), (0, jsx_runtime_1.jsxs)(recharts_1.LineChart, { data: data, height: 300, width: 1200, children: [(0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: "3 3" }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: "time" }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, {}), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, {}), (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), (0, jsx_runtime_1.jsx)(recharts_1.Line, { activeDot: { r: 8 }, dataKey: "errors", stroke: "#8884d8", type: "monotone" })] })] }));
 };
 exports.ErrorsOverTime = ErrorsOverTime;

package/lib/commonjs/LogViewer/charts/RequestsByService.js

@@ -7,8 +7,8 @@ const material_1 = require("@mui/material");
 const useRequestsByService_1 = require("../hooks/useRequestsByService");
 const RequestsByService = ({ logs, searchParams }) => {
     const data = (0, useRequestsByService_1.useRequestsByService)(logs, searchParams);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h5", gutterBottom: true, children: "Requests by Service" }), (0, jsx_runtime_1.jsxs)(recharts_1.LineChart, { width: 1200, height: 300, data: data, children: [(0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: "3 3" }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: "time" }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, {}), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, {}), (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), Object.keys(data[0] || {})
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { gutterBottom: true, variant: "h5", children: "Requests by Service" }), (0, jsx_runtime_1.jsxs)(recharts_1.LineChart, { data: data, height: 300, width: 1200, children: [(0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: "3 3" }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: "time" }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, {}), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, {}), (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), Object.keys(data[0] || {})
                         .filter((key) => key !== 'time')
-                        .map((service) => ((0, jsx_runtime_1.jsx)(recharts_1.Line, { type: "monotone", dataKey: service, stroke: `#${Math.floor(Math.random() * 16777215).toString(16)}` }, service)))] })] }));
+                        .map((service) => ((0, jsx_runtime_1.jsx)(recharts_1.Line, { dataKey: service, stroke: `#${Math.floor(Math.random() * 16777215).toString(16)}`, type: "monotone" }, service)))] })] }));
 };
 exports.RequestsByService = RequestsByService;

package/lib/commonjs/LogViewer/hooks/useLogManagement.js

@@ -13,7 +13,7 @@ const useLogManagement = () => {
         window.viewLog = (log) => {
             setCorrelation(log.correlation);
         };
-    }, [logs]);
+    }, [logs, setCorrelation]);
     (0, react_1.useEffect)(() => {
         console.log('logs attached to window, try: viewLog(logs[0])');
     }, []);

package/lib/commonjs/LogViewer/hooks/useLogTreeData.js

@@ -42,20 +42,23 @@ const useLogTreeData = (correlationId, hideQpqActions = false) => {
         }
         setIsLoading(false);
     });
+    // Stable identity so the effect below can list it as a dependency while
+    // still only re-running when a correlation id appears or disappears.
+    const fetchTreeData = (0, quidproquo_web_react_1.useEffectCallback)(() => __awaiter(void 0, void 0, void 0, function* () {
+        setIsLoading(true);
+        console.log('correlationId: ', correlationId);
+        const logHierarchy = yield (0, logic_1.getLogHierarchy)(baseUrlResolvers.getApiUrl(), correlationId, false, accessToken);
+        if (logHierarchy) {
+            setTreeData([logHierarchy]);
+        }
+        setIsLoading(false);
+    }));
+    const hasCorrelationId = !!correlationId;
     (0, react_1.useEffect)(() => {
-        const fetchTreeData = () => __awaiter(void 0, void 0, void 0, function* () {
-            setIsLoading(true);
-            console.log('correlationId: ', correlationId);
-            const logHierarchy = yield (0, logic_1.getLogHierarchy)(baseUrlResolvers.getApiUrl(), correlationId, false, accessToken);
-            if (logHierarchy) {
-                setTreeData([logHierarchy]);
-            }
-            setIsLoading(false);
-        });
-        if (correlationId) {
+        if (hasCorrelationId) {
             fetchTreeData();
         }
-    }, [!!correlationId]);
+    }, [hasCorrelationId, fetchTreeData]);
     const result = {
         isLoading,
         refreshTreeData: refreshTreeData,

package/lib/commonjs/LogViewer/hooks/useServiceNames.js

@@ -17,13 +17,14 @@ const useServiceNames = () => {
     const [serviceNames, setServiceNames] = (0, react_1.useState)(['All']);
     const accessToken = (0, quidproquo_web_react_1.useAuthAccessToken)();
     const baseUrlResolvers = (0, quidproquo_web_react_1.useBaseUrlResolvers)();
+    // Stable identity so the mount-only effect below can list it as a dependency.
+    const fetchData = (0, quidproquo_web_react_1.useEffectCallback)(() => __awaiter(void 0, void 0, void 0, function* () {
+        const updatedServiceNames = yield (0, logic_1.getServiceNames)(baseUrlResolvers.getApiUrl(), accessToken);
+        setServiceNames(updatedServiceNames);
+    }));
     (0, react_1.useEffect)(() => {
-        const fetchData = () => __awaiter(void 0, void 0, void 0, function* () {
-            const updatedServiceNames = yield (0, logic_1.getServiceNames)(baseUrlResolvers.getApiUrl(), accessToken);
-            setServiceNames(updatedServiceNames);
-        });
         fetchData();
-    }, []);
+    }, [fetchData]);
     const serviceOptions = (0, react_1.useMemo)(() => serviceNames.map((s) => ({
         label: s
             .split('-')

package/lib/commonjs/components/AdminDialog.js

@@ -24,14 +24,14 @@ const AdminDialog = ({ open, handleClose, title, selectedTab, onSelectTab, tabs,
     const handleTabChange = (event, newValue) => {
         onSelectTab(tabs[newValue]);
     };
-    return ((0, jsx_runtime_1.jsxs)(material_1.Dialog, { open: open, scroll: 'paper', "aria-labelledby": "scroll-dialog-title", "aria-describedby": "scroll-dialog-description", onClose: handleClose, maxWidth: false, fullWidth: true, PaperProps: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Dialog, { "aria-describedby": "scroll-dialog-description", "aria-labelledby": "scroll-dialog-title", fullWidth: true, maxWidth: false, onClose: handleClose, open: open, PaperProps: {
             style: {
                 width: '90%',
                 height: '90%',
                 maxHeight: '90%',
                 maxWidth: '90%',
             },
-        }, children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, { id: "scroll-dialog-title", children: title }), tabs.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.AppBar, { position: "sticky", color: "primary", children: (0, jsx_runtime_1.jsx)(material_1.Tabs, { value: selectedTabIndex, onChange: handleTabChange, textColor: "inherit", indicatorColor: "secondary", children: tabs.map((t) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: t }, t))) }) })), (0, jsx_runtime_1.jsx)(material_1.DialogContent, { dividers: true, sx: {
+        }, scroll: 'paper', children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, { id: "scroll-dialog-title", children: title }), tabs.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.AppBar, { color: "primary", position: "sticky", children: (0, jsx_runtime_1.jsx)(material_1.Tabs, { indicatorColor: "secondary", onChange: handleTabChange, textColor: "inherit", value: selectedTabIndex, children: tabs.map((t) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: t }, t))) }) })), (0, jsx_runtime_1.jsx)(material_1.DialogContent, { dividers: true, sx: {
                     minHeight: '150px',
                     overflowY: 'scroll',
                 }, children: children }), buttons.length > 0 && ((0, jsx_runtime_1.jsx)(material_1.DialogActions, { children: buttons.map((b) => ((0, jsx_runtime_1.jsx)(material_1.Button, { disabled: b.disabled, onClick: b.onClick, children: b.text }, b.text))) }))] }));

package/lib/commonjs/components/AsyncButton.js

@@ -32,5 +32,5 @@ function AsyncButton({ onClick, children, disabled, type }) {
             setLoading(false);
         }
     });
-    return ((0, jsx_runtime_1.jsx)(Button_1.default, { onClick: handleLogin, fullWidth: true, variant: "contained", color: "primary", disabled: loading || disabled, style: { maxHeight: '100%', height: '4em' }, type: type, children: loading ? (0, jsx_runtime_1.jsx)(CircularProgress_1.default, { size: 24 }) : children }));
+    return ((0, jsx_runtime_1.jsx)(Button_1.default, { color: "primary", disabled: loading || disabled, fullWidth: true, onClick: handleLogin, style: { maxHeight: '100%', height: '4em' }, type: type, variant: "contained", children: loading ? (0, jsx_runtime_1.jsx)(CircularProgress_1.default, { size: 24 }) : children }));
 }

package/lib/commonjs/components/AutocompleteInput.js

@@ -8,8 +8,8 @@ const AutocompleteInput = ({ label, value, options, onChange }) => {
         onChange(newValue ? newValue.value : '');
     };
     const selectedValue = options.find((option) => option.value === value) || null;
-    return ((0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { options: options, getOptionLabel: (option) => option.label, value: selectedValue, onChange: handleChange, renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { label: label, InputLabelProps: {
+    return ((0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { getOptionLabel: (option) => option.label, onChange: handleChange, options: options, renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { InputLabelProps: {
                     shrink: true,
-                } }))) }) }));
+                }, label: label }))), value: selectedValue }) }));
 };
 exports.AutocompleteInput = AutocompleteInput;

package/lib/commonjs/components/DataGrid.js

@@ -16,6 +16,6 @@ const DataGrid = ({ items, columns, onRowClick }) => {
         valueGetter: 'valueGetter' in col ? (params) => col.valueGetter(params.row, params) : undefined,
         renderCell: (params) => { var _a; return (_a = col.renderCell) === null || _a === void 0 ? void 0 : _a.call(col, params.row, params); },
     }));
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { height: '100%', width: '100%' }, children: (0, jsx_runtime_1.jsx)(x_data_grid_1.DataGrid, { rows: items, columns: muiColumns, onRowClick: handleRowClick }) }));
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { height: '100%', width: '100%' }, children: (0, jsx_runtime_1.jsx)(x_data_grid_1.DataGrid, { columns: muiColumns, onRowClick: handleRowClick, rows: items }) }));
 };
 exports.DataGrid = DataGrid;

package/lib/commonjs/components/DataGridPagination/DataGridPagination.js

@@ -11,5 +11,5 @@ function DataGridPagination() {
     const apiRef = (0, x_data_grid_1.useGridApiContext)();
     const page = (0, x_data_grid_1.useGridSelector)(apiRef, x_data_grid_1.gridPageSelector);
     const pageCount = (0, x_data_grid_1.useGridSelector)(apiRef, x_data_grid_1.gridPageCountSelector);
-    return (0, jsx_runtime_1.jsx)(Pagination_1.default, { color: "primary", count: pageCount, page: page + 1, onChange: (event, value) => apiRef.current.setPage(value - 1) });
+    return (0, jsx_runtime_1.jsx)(Pagination_1.default, { color: "primary", count: pageCount, onChange: (event, value) => apiRef.current.setPage(value - 1), page: page + 1 });
 }

package/lib/commonjs/components/DateCell/DateCell.js

@@ -18,6 +18,6 @@ const DateCell = (props) => {
         month: '2-digit',
         year: '2-digit',
     });
-    return ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsxs)(Typography_1.default, { variant: "body2", component: "span", children: [formattedDate, " ", formattedTime] }), (0, jsx_runtime_1.jsx)(LastSeen_1.default, { isoTime: date.toISOString(), timeStyle: "twitter" })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsxs)(Typography_1.default, { component: "span", variant: "body2", children: [formattedDate, " ", formattedTime] }), (0, jsx_runtime_1.jsx)(LastSeen_1.default, { isoTime: date.toISOString(), timeStyle: "twitter" })] }));
 };
 exports.DateCell = DateCell;

package/lib/commonjs/components/DateRangePicker.js

@@ -36,11 +36,11 @@ const DateRangePicker = ({ startIsoDateTime, endIsoDateTime, setStartIsoDateTime
     const handleQuickTimeClose = () => {
         setAnchorEl(null);
     };
-    return ((0, jsx_runtime_1.jsxs)(x_date_pickers_1.LocalizationProvider, { dateAdapter: AdapterDateFns_1.AdapterDateFns, children: [(0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, spacing: 2, children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(material_1.Box, { position: "relative", children: (0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePicker, { label: "Start DateTime", value: new Date(startIsoDateTime), onChange: handleStartDateChange }) }) }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 6, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { position: "relative", children: [(0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePicker, { label: "End DateTime", value: new Date(endIsoDateTime), onChange: handleEndDateChange }) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { "aria-label": "quick time select", "aria-controls": "quick-time-menu", "aria-haspopup": "true", onClick: handleQuickTimeClick, sx: {
+    return ((0, jsx_runtime_1.jsxs)(x_date_pickers_1.LocalizationProvider, { dateAdapter: AdapterDateFns_1.AdapterDateFns, children: [(0, jsx_runtime_1.jsxs)(material_1.Grid, { container: true, spacing: 2, children: [(0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 6, children: (0, jsx_runtime_1.jsx)(material_1.Box, { position: "relative", children: (0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePicker, { label: "Start DateTime", onChange: handleStartDateChange, value: new Date(startIsoDateTime) }) }) }) }), (0, jsx_runtime_1.jsx)(material_1.Grid, { item: true, xs: 6, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { position: "relative", children: [(0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePicker, { label: "End DateTime", onChange: handleEndDateChange, value: new Date(endIsoDateTime) }) }), (0, jsx_runtime_1.jsx)(material_1.IconButton, { "aria-controls": "quick-time-menu", "aria-haspopup": "true", "aria-label": "quick time select", onClick: handleQuickTimeClick, sx: {
                                         position: 'absolute',
                                         right: '-28px',
                                         top: '50%',
                                         transform: 'translateY(-50%)',
-                                    }, children: (0, jsx_runtime_1.jsx)(ExpandMore_1.default, {}) })] }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Menu, { id: "quick-time-menu", anchorEl: anchorEl, keepMounted: true, open: Boolean(anchorEl), onClose: handleQuickTimeClose, children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(5), children: "Last 5 minutes" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(30), children: "Last 30 minutes" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(1 * 60), children: "Last hour" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(3 * 60), children: "Last 3 hours" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(8 * 60), children: "Last 8 hours" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(16 * 60), children: "Last 16 hours" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(24 * 60), children: "Last 24 hours" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(7 * 24 * 60), children: "Last 7 days" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(30 * 24 * 60), children: "Last month" })] })] }));
+                                    }, children: (0, jsx_runtime_1.jsx)(ExpandMore_1.default, {}) })] }) })] }), (0, jsx_runtime_1.jsxs)(material_1.Menu, { anchorEl: anchorEl, id: "quick-time-menu", keepMounted: true, onClose: handleQuickTimeClose, open: Boolean(anchorEl), children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(5), children: "Last 5 minutes" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(30), children: "Last 30 minutes" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(1 * 60), children: "Last hour" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(3 * 60), children: "Last 3 hours" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(8 * 60), children: "Last 8 hours" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(16 * 60), children: "Last 16 hours" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(24 * 60), children: "Last 24 hours" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(7 * 24 * 60), children: "Last 7 days" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { onClick: () => handleQuickTimeSelect(30 * 24 * 60), children: "Last month" })] })] }));
 };
 exports.DateRangePicker = DateRangePicker;

package/lib/commonjs/components/MainLayout/MainLayout.js

@@ -27,7 +27,7 @@ function MainLayout() {
                     pb: '56px', // <— prevent content from being hidden behind bottom nav
                 }, children: tabs
                     .filter((t, index) => index === tab)
-                    .map((tab) => ((0, jsx_runtime_1.jsx)(tab.View, {}, tab.name))) }), (0, jsx_runtime_1.jsxs)(material_1.BottomNavigation, { value: tab, onChange: (event, newValue) => {
+                    .map((tab) => ((0, jsx_runtime_1.jsx)(tab.View, {}, tab.name))) }), (0, jsx_runtime_1.jsxs)(material_1.BottomNavigation, { onChange: (event, newValue) => {
                     // The trailing Logout / Loading actions are not tabs
                     if (newValue < tabs.length) {
                         handleTabOnChange(event, newValue);
@@ -41,5 +41,5 @@ function MainLayout() {
                     borderTop: 1,
                     borderColor: 'divider',
                     bgcolor: 'background.paper',
-                }, children: [tabs.map((t) => ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { label: t.name, icon: t.icon }, t.name))), loading && (0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { label: "Loading", icon: (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 18 }), disabled: true }), (0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { label: "Logout", icon: (0, jsx_runtime_1.jsx)(Logout_1.default, {}), onClick: () => authApi.authLogout() })] })] }));
+                }, value: tab, children: [tabs.map((t) => ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { icon: t.icon, label: t.name }, t.name))), loading && (0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { disabled: true, icon: (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 18 }), label: "Loading" }), (0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { icon: (0, jsx_runtime_1.jsx)(Logout_1.default, {}), label: "Logout", onClick: () => authApi.authLogout() })] })] }));
 }

package/lib/commonjs/components/TextInput.js

@@ -7,8 +7,8 @@ const TextInput = ({ label, value, onChange }) => {
     const handleChange = (event) => {
         onChange(event.target.value);
     };
-    return ((0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(material_1.TextField, { label: label, value: value || '', onChange: handleChange, InputLabelProps: {
+    return ((0, jsx_runtime_1.jsx)(material_1.FormControl, { fullWidth: true, children: (0, jsx_runtime_1.jsx)(material_1.TextField, { InputLabelProps: {
                 shrink: true,
-            } }) }));
+            }, label: label, onChange: handleChange, value: value || '' }) }));
 };
 exports.TextInput = TextInput;

package/lib/commonjs/tmp/RandomView.js

@@ -47,6 +47,6 @@ const columns = [
 ];
 const AdminView = () => {
     const accessToken = (0, quidproquo_web_react_1.useAuthAccessToken)();
-    return ((0, jsx_runtime_1.jsx)(components_1.TabViewBox, { header: () => ((0, jsx_runtime_1.jsxs)(components_1.GridContainer, { spacing: 2, xs: 12, children: [(0, jsx_runtime_1.jsx)(components_1.GridItem, { xs: 6, children: (0, jsx_runtime_1.jsx)(components_1.DateRangePicker, { startIsoDateTime: new Date().toISOString(), endIsoDateTime: new Date().toISOString(), setStartIsoDateTime: () => { }, setEndIsoDateTime: () => { } }) }), (0, jsx_runtime_1.jsx)(components_1.GridItem, { xs: 4, children: (0, jsx_runtime_1.jsx)(components_1.TextInput, { label: "Email", onChange: () => { }, value: "" }) }), (0, jsx_runtime_1.jsx)(components_1.GridItem, { xs: 2, children: (0, jsx_runtime_1.jsx)(components_1.AsyncButton, { onClick: () => __awaiter(void 0, void 0, void 0, function* () { }), children: "Search" }) })] })), body: () => (0, jsx_runtime_1.jsx)(components_1.DataGrid, { items: [], columns: columns }) }));
+    return ((0, jsx_runtime_1.jsx)(components_1.TabViewBox, { body: () => (0, jsx_runtime_1.jsx)(components_1.DataGrid, { columns: columns, items: [] }), header: () => ((0, jsx_runtime_1.jsxs)(components_1.GridContainer, { spacing: 2, xs: 12, children: [(0, jsx_runtime_1.jsx)(components_1.GridItem, { xs: 6, children: (0, jsx_runtime_1.jsx)(components_1.DateRangePicker, { endIsoDateTime: new Date().toISOString(), setEndIsoDateTime: () => { }, setStartIsoDateTime: () => { }, startIsoDateTime: new Date().toISOString() }) }), (0, jsx_runtime_1.jsx)(components_1.GridItem, { xs: 4, children: (0, jsx_runtime_1.jsx)(components_1.TextInput, { label: "Email", onChange: () => { }, value: "" }) }), (0, jsx_runtime_1.jsx)(components_1.GridItem, { xs: 2, children: (0, jsx_runtime_1.jsx)(components_1.AsyncButton, { onClick: () => __awaiter(void 0, void 0, void 0, function* () { }), children: "Search" }) })] })) }));
 };
 exports.default = (0, react_1.memo)(AdminView);

package/lib/commonjs/useFederatedAddon.js

@@ -19,12 +19,13 @@ function useFederatedAddon() {
     const accessToken = (0, quidproquo_web_react_1.useAuthAccessToken)();
     const baseUrlResolvers = (0, quidproquo_web_react_1.useBaseUrlResolvers)();
     const loadAddons = (0, FederatedAddonProvider_1.useLoadFederatedAddons)();
+    // Stable identity so the mount-only effect below can list it as a dependency.
+    const doAsyncWork = (0, quidproquo_web_react_1.useEffectCallback)(() => __awaiter(this, void 0, void 0, function* () {
+        setLoading(true);
+        const addons = yield loadAddons({ baseUrlResolvers, accessToken });
+        setFederatedAddons(addons);
+    }));
     (0, react_1.useEffect)(() => {
-        const doAsyncWork = () => __awaiter(this, void 0, void 0, function* () {
-            setLoading(true);
-            const addons = yield loadAddons({ baseUrlResolvers, accessToken });
-            setFederatedAddons(addons);
-        });
         doAsyncWork()
             .catch((e) => {
             console.log(e);
@@ -33,7 +34,7 @@ function useFederatedAddon() {
             .finally(() => {
             setLoading(false);
         });
-    }, []);
+    }, [doAsyncWork]);
     return {
         addons: federatedAddons,
         loading,