dce-reactkit 3.6.27 → 3.7.1-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +156 -468
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/Tooltip.d.ts +1 -6
- package/dist/esm/index.js +157 -469
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/Tooltip.d.ts +1 -6
- package/dist/index.d.ts +1 -5
- package/package.json +2 -1
- package/src/components/Tooltip.tsx +28 -498
- package/src/helpers/genRouteHandler.ts +7 -1
package/dist/cjs/index.js
CHANGED
|
@@ -6,6 +6,7 @@ var React = require('react');
|
|
|
6
6
|
var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
|
|
7
7
|
var reactFontawesome = require('@fortawesome/react-fontawesome');
|
|
8
8
|
var freeRegularSvgIcons = require('@fortawesome/free-regular-svg-icons');
|
|
9
|
+
var bootstrap = require('bootstrap');
|
|
9
10
|
|
|
10
11
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
11
12
|
|
|
@@ -412,7 +413,7 @@ const getModalButtonTypeToLabelAndVariant = () => {
|
|
|
412
413
|
/*------------------------------------------------------------------------*/
|
|
413
414
|
/* -------------------------------- Style ------------------------------- */
|
|
414
415
|
/*------------------------------------------------------------------------*/
|
|
415
|
-
const style$
|
|
416
|
+
const style$a = `
|
|
416
417
|
.Modal-backdrop {
|
|
417
418
|
position: fixed;
|
|
418
419
|
top: 0;
|
|
@@ -581,7 +582,7 @@ const Modal = (props) => {
|
|
|
581
582
|
left: 0,
|
|
582
583
|
right: 0,
|
|
583
584
|
} },
|
|
584
|
-
React__default["default"].createElement("style", null, style$
|
|
585
|
+
React__default["default"].createElement("style", null, style$a),
|
|
585
586
|
React__default["default"].createElement("div", { className: `Modal-backdrop ${backdropAnimationClass}`, style: {
|
|
586
587
|
zIndex: 5000000003,
|
|
587
588
|
}, onClick: () => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -1081,7 +1082,7 @@ const showSessionExpiredMessage = () => __awaiter(void 0, void 0, void 0, functi
|
|
|
1081
1082
|
/*------------------------------------------------------------------------*/
|
|
1082
1083
|
/* -------------------------------- Style ------------------------------- */
|
|
1083
1084
|
/*------------------------------------------------------------------------*/
|
|
1084
|
-
const style$
|
|
1085
|
+
const style$9 = `
|
|
1085
1086
|
.AppWrapper-leave-to-url-notice {
|
|
1086
1087
|
opacity: 0;
|
|
1087
1088
|
|
|
@@ -1219,7 +1220,7 @@ const AppWrapper = (props) => {
|
|
|
1219
1220
|
/* --------------- Main UI -------------- */
|
|
1220
1221
|
/*----------------------------------------*/
|
|
1221
1222
|
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1222
|
-
React__default["default"].createElement("style", null, style$
|
|
1223
|
+
React__default["default"].createElement("style", null, style$9),
|
|
1223
1224
|
modal,
|
|
1224
1225
|
body));
|
|
1225
1226
|
};
|
|
@@ -1231,7 +1232,7 @@ const AppWrapper = (props) => {
|
|
|
1231
1232
|
/*------------------------------------------------------------------------*/
|
|
1232
1233
|
/* -------------------------------- Style ------------------------------- */
|
|
1233
1234
|
/*------------------------------------------------------------------------*/
|
|
1234
|
-
const style$
|
|
1235
|
+
const style$8 = `
|
|
1235
1236
|
/* Container fades in */
|
|
1236
1237
|
.LoadingSpinner-container {
|
|
1237
1238
|
animation-name: LoadingSpinner-container-fade-in;
|
|
@@ -1309,7 +1310,7 @@ const LoadingSpinner = () => {
|
|
|
1309
1310
|
/*------------------------------------------------------------------------*/
|
|
1310
1311
|
// Add all four blips to a container
|
|
1311
1312
|
return (React__default["default"].createElement("div", { className: "text-center LoadingSpinner LoadingSpinner-container" },
|
|
1312
|
-
React__default["default"].createElement("style", null, style$
|
|
1313
|
+
React__default["default"].createElement("style", null, style$8),
|
|
1313
1314
|
React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-1 me-1" }),
|
|
1314
1315
|
React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-2 me-1" }),
|
|
1315
1316
|
React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCircle, className: "LoadingSpinner-blip-3 me-1" }),
|
|
@@ -1323,7 +1324,7 @@ const LoadingSpinner = () => {
|
|
|
1323
1324
|
/*------------------------------------------------------------------------*/
|
|
1324
1325
|
/* -------------------------------- Style ------------------------------- */
|
|
1325
1326
|
/*------------------------------------------------------------------------*/
|
|
1326
|
-
const style$
|
|
1327
|
+
const style$7 = `
|
|
1327
1328
|
/* Tab Box */
|
|
1328
1329
|
.TabBox-box {
|
|
1329
1330
|
/* Light Border */
|
|
@@ -1403,7 +1404,7 @@ const TabBox = (props) => {
|
|
|
1403
1404
|
/*----------------------------------------*/
|
|
1404
1405
|
// Full UI
|
|
1405
1406
|
return (React__default["default"].createElement("div", { className: `TabBox-container ${noBottomMargin ? '' : 'mb-2'}` },
|
|
1406
|
-
React__default["default"].createElement("style", null, style$
|
|
1407
|
+
React__default["default"].createElement("style", null, style$7),
|
|
1407
1408
|
React__default["default"].createElement("div", { className: "TabBox-title-container" },
|
|
1408
1409
|
React__default["default"].createElement("div", { className: "TabBox-title" }, title)),
|
|
1409
1410
|
React__default["default"].createElement("div", { className: `TabBox-box ps-2 pt-2 pe-2 ${noBottomPadding ? '' : 'pb-2'}` },
|
|
@@ -1732,7 +1733,7 @@ const SimpleDateChooser = (props) => {
|
|
|
1732
1733
|
/*------------------------------------------------------------------------*/
|
|
1733
1734
|
/* -------------------------------- Style ------------------------------- */
|
|
1734
1735
|
/*------------------------------------------------------------------------*/
|
|
1735
|
-
const style$
|
|
1736
|
+
const style$6 = `
|
|
1736
1737
|
.Drawer-container {
|
|
1737
1738
|
margin-left: 1rem;
|
|
1738
1739
|
margin-right: 1rem;
|
|
@@ -1766,7 +1767,7 @@ const Drawer = (props) => {
|
|
|
1766
1767
|
return (React__default["default"].createElement("div", { className: "Drawer-container", style: {
|
|
1767
1768
|
backgroundColor: (customBackgroundColor !== null && customBackgroundColor !== void 0 ? customBackgroundColor : undefined),
|
|
1768
1769
|
} },
|
|
1769
|
-
React__default["default"].createElement("style", null, style$
|
|
1770
|
+
React__default["default"].createElement("style", null, style$6),
|
|
1770
1771
|
children));
|
|
1771
1772
|
};
|
|
1772
1773
|
|
|
@@ -1777,7 +1778,7 @@ const Drawer = (props) => {
|
|
|
1777
1778
|
/*------------------------------------------------------------------------*/
|
|
1778
1779
|
/* -------------------------------- Style ------------------------------- */
|
|
1779
1780
|
/*------------------------------------------------------------------------*/
|
|
1780
|
-
const style$
|
|
1781
|
+
const style$5 = `
|
|
1781
1782
|
.PopSuccessMark-outer-container {
|
|
1782
1783
|
position: relative;
|
|
1783
1784
|
display: inline-block;
|
|
@@ -1882,7 +1883,7 @@ const PopSuccessMark = (props) => {
|
|
|
1882
1883
|
width: `${sizeRem}rem`,
|
|
1883
1884
|
height: `${sizeRem}rem`,
|
|
1884
1885
|
}, "aria-label": "checkmark indicating success" },
|
|
1885
|
-
React__default["default"].createElement("style", null, style$
|
|
1886
|
+
React__default["default"].createElement("style", null, style$5),
|
|
1886
1887
|
React__default["default"].createElement("div", { className: `PopSuccessMark-check-stroke-1 bg-${checkVariant}`, style: {
|
|
1887
1888
|
borderRadius: `${sizeRem / 5}rem`,
|
|
1888
1889
|
} }),
|
|
@@ -1898,7 +1899,7 @@ const PopSuccessMark = (props) => {
|
|
|
1898
1899
|
/*------------------------------------------------------------------------*/
|
|
1899
1900
|
/* -------------------------------- Style ------------------------------- */
|
|
1900
1901
|
/*------------------------------------------------------------------------*/
|
|
1901
|
-
const style$
|
|
1902
|
+
const style$4 = `
|
|
1902
1903
|
.PopFailureMark-outer-container {
|
|
1903
1904
|
position: relative;
|
|
1904
1905
|
display: inline-block;
|
|
@@ -2002,7 +2003,7 @@ const PopFailureMark = (props) => {
|
|
|
2002
2003
|
width: `${sizeRem}rem`,
|
|
2003
2004
|
height: `${sizeRem}rem`,
|
|
2004
2005
|
}, "aria-label": "mark indicating failure" },
|
|
2005
|
-
React__default["default"].createElement("style", null, style$
|
|
2006
|
+
React__default["default"].createElement("style", null, style$4),
|
|
2006
2007
|
React__default["default"].createElement("div", { className: `PopFailureMark-x-stroke-1 bg-${xVariant}`, style: {
|
|
2007
2008
|
borderRadius: `${sizeRem / 5}rem`,
|
|
2008
2009
|
} }),
|
|
@@ -2018,7 +2019,7 @@ const PopFailureMark = (props) => {
|
|
|
2018
2019
|
/*------------------------------------------------------------------------*/
|
|
2019
2020
|
/* -------------------------------- Style ------------------------------- */
|
|
2020
2021
|
/*------------------------------------------------------------------------*/
|
|
2021
|
-
const style$
|
|
2022
|
+
const style$3 = `
|
|
2022
2023
|
.PopPendingMark-outer-container {
|
|
2023
2024
|
position: relative;
|
|
2024
2025
|
display: inline-block;
|
|
@@ -2091,7 +2092,7 @@ const PopPendingMark = (props) => {
|
|
|
2091
2092
|
width: `${sizeRem}rem`,
|
|
2092
2093
|
height: `${sizeRem}rem`,
|
|
2093
2094
|
}, "aria-label": "mark indicating that the item is pending" },
|
|
2094
|
-
React__default["default"].createElement("style", null, style$
|
|
2095
|
+
React__default["default"].createElement("style", null, style$3),
|
|
2095
2096
|
React__default["default"].createElement("div", null,
|
|
2096
2097
|
React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faHourglass, className: `PopPendingMark-hourglass text-${hourglassVariant}`, style: {
|
|
2097
2098
|
fontSize: `${sizeRem * 0.6}rem`,
|
|
@@ -2104,27 +2105,27 @@ const PopPendingMark = (props) => {
|
|
|
2104
2105
|
*/
|
|
2105
2106
|
/* ------------- Actions ------------ */
|
|
2106
2107
|
// Types of actions
|
|
2107
|
-
var ActionType$
|
|
2108
|
+
var ActionType$8;
|
|
2108
2109
|
(function (ActionType) {
|
|
2109
2110
|
// Indicate that the text was recently copied
|
|
2110
2111
|
ActionType["IndicateRecentlyCopied"] = "indicate-recently-copied";
|
|
2111
2112
|
// Clear the status
|
|
2112
2113
|
ActionType["ClearRecentlyCopiedStatus"] = "clear-recently-copied-status";
|
|
2113
|
-
})(ActionType$
|
|
2114
|
+
})(ActionType$8 || (ActionType$8 = {}));
|
|
2114
2115
|
/**
|
|
2115
2116
|
* Reducer that executes actions
|
|
2116
2117
|
* @author Gabe Abrams
|
|
2117
2118
|
* @param state current state
|
|
2118
2119
|
* @param action action to execute
|
|
2119
2120
|
*/
|
|
2120
|
-
const reducer$
|
|
2121
|
+
const reducer$9 = (state, action) => {
|
|
2121
2122
|
switch (action.type) {
|
|
2122
|
-
case ActionType$
|
|
2123
|
+
case ActionType$8.IndicateRecentlyCopied: {
|
|
2123
2124
|
return {
|
|
2124
2125
|
recentlyCopied: true,
|
|
2125
2126
|
};
|
|
2126
2127
|
}
|
|
2127
|
-
case ActionType$
|
|
2128
|
+
case ActionType$8.ClearRecentlyCopiedStatus: {
|
|
2128
2129
|
return {
|
|
2129
2130
|
recentlyCopied: false,
|
|
2130
2131
|
};
|
|
@@ -2150,7 +2151,7 @@ const CopiableBox = (props) => {
|
|
|
2150
2151
|
recentlyCopied: false,
|
|
2151
2152
|
};
|
|
2152
2153
|
// Initialize state
|
|
2153
|
-
const [state, dispatch] = React.useReducer(reducer$
|
|
2154
|
+
const [state, dispatch] = React.useReducer(reducer$9, initialState);
|
|
2154
2155
|
// Destructure common state
|
|
2155
2156
|
const { recentlyCopied, } = state;
|
|
2156
2157
|
/*------------------------------------------------------------------------*/
|
|
@@ -2170,13 +2171,13 @@ const CopiableBox = (props) => {
|
|
|
2170
2171
|
}
|
|
2171
2172
|
// Show copied notice
|
|
2172
2173
|
dispatch({
|
|
2173
|
-
type: ActionType$
|
|
2174
|
+
type: ActionType$8.IndicateRecentlyCopied,
|
|
2174
2175
|
});
|
|
2175
2176
|
// Wait a moment
|
|
2176
2177
|
yield waitMs(4000);
|
|
2177
2178
|
// Hide copied notice
|
|
2178
2179
|
dispatch({
|
|
2179
|
-
type: ActionType$
|
|
2180
|
+
type: ActionType$8.ClearRecentlyCopiedStatus,
|
|
2180
2181
|
});
|
|
2181
2182
|
});
|
|
2182
2183
|
/*------------------------------------------------------------------------*/
|
|
@@ -2232,20 +2233,20 @@ const CopiableBox = (props) => {
|
|
|
2232
2233
|
*/
|
|
2233
2234
|
/* ------------- Actions ------------ */
|
|
2234
2235
|
// Types of actions
|
|
2235
|
-
var ActionType$
|
|
2236
|
+
var ActionType$7;
|
|
2236
2237
|
(function (ActionType) {
|
|
2237
2238
|
// Toggle whether a child are being shown
|
|
2238
2239
|
ActionType["ToggleChild"] = "toggle-child";
|
|
2239
|
-
})(ActionType$
|
|
2240
|
+
})(ActionType$7 || (ActionType$7 = {}));
|
|
2240
2241
|
/**
|
|
2241
2242
|
* Reducer that executes actions
|
|
2242
2243
|
* @author Gabe Abrams
|
|
2243
2244
|
* @param state current state
|
|
2244
2245
|
* @param action action to execute
|
|
2245
2246
|
*/
|
|
2246
|
-
const reducer$
|
|
2247
|
+
const reducer$8 = (state, action) => {
|
|
2247
2248
|
switch (action.type) {
|
|
2248
|
-
case ActionType$
|
|
2249
|
+
case ActionType$7.ToggleChild: {
|
|
2249
2250
|
return Object.assign(Object.assign({}, state), { childExpanded: Object.assign(Object.assign({}, state.childExpanded), { [String(action.id)]: !state.childExpanded[String(action.id)] }) });
|
|
2250
2251
|
}
|
|
2251
2252
|
default: {
|
|
@@ -2274,7 +2275,7 @@ const NestableItemList = (props) => {
|
|
|
2274
2275
|
childExpanded: initChildExpanded,
|
|
2275
2276
|
};
|
|
2276
2277
|
// Initialize state
|
|
2277
|
-
const [state, dispatch] = React.useReducer(reducer$
|
|
2278
|
+
const [state, dispatch] = React.useReducer(reducer$8, initialState);
|
|
2278
2279
|
// Destructure common state
|
|
2279
2280
|
const { childExpanded, } = state;
|
|
2280
2281
|
/*------------------------------------------------------------------------*/
|
|
@@ -2364,7 +2365,7 @@ const NestableItemList = (props) => {
|
|
|
2364
2365
|
backgroundColor: 'transparent',
|
|
2365
2366
|
}, type: "button", onClick: () => {
|
|
2366
2367
|
dispatch({
|
|
2367
|
-
type: ActionType$
|
|
2368
|
+
type: ActionType$7.ToggleChild,
|
|
2368
2369
|
id: item.id,
|
|
2369
2370
|
});
|
|
2370
2371
|
}, "aria-label": `${childExpanded[item.id] ? 'Hide' : 'Show'} items in ${item.name}` },
|
|
@@ -2648,7 +2649,7 @@ var SortType;
|
|
|
2648
2649
|
})(SortType || (SortType = {}));
|
|
2649
2650
|
/* ------------- Actions ------------ */
|
|
2650
2651
|
// Types of actions
|
|
2651
|
-
var ActionType$
|
|
2652
|
+
var ActionType$6;
|
|
2652
2653
|
(function (ActionType) {
|
|
2653
2654
|
// Toggle sort column param
|
|
2654
2655
|
ActionType["ToggleSortColumn"] = "toggle-sort-column";
|
|
@@ -2660,16 +2661,16 @@ var ActionType$7;
|
|
|
2660
2661
|
ActionType["ShowAllColumns"] = "show-all-columns";
|
|
2661
2662
|
// Hide all columns
|
|
2662
2663
|
ActionType["HideAllColumns"] = "hide-all-columns";
|
|
2663
|
-
})(ActionType$
|
|
2664
|
+
})(ActionType$6 || (ActionType$6 = {}));
|
|
2664
2665
|
/**
|
|
2665
2666
|
* Reducer that executes actions
|
|
2666
2667
|
* @author Gabe Abrams
|
|
2667
2668
|
* @param state current state
|
|
2668
2669
|
* @param action action to execute
|
|
2669
2670
|
*/
|
|
2670
|
-
const reducer$
|
|
2671
|
+
const reducer$7 = (state, action) => {
|
|
2671
2672
|
switch (action.type) {
|
|
2672
|
-
case ActionType$
|
|
2673
|
+
case ActionType$6.ToggleSortColumn: {
|
|
2673
2674
|
if (action.param !== state.sortColumnParam) {
|
|
2674
2675
|
// Different column param
|
|
2675
2676
|
return Object.assign(Object.assign({}, state), { sortColumnParam: action.param, sortType: SortType.Ascending });
|
|
@@ -2681,22 +2682,22 @@ const reducer$8 = (state, action) => {
|
|
|
2681
2682
|
// Stop sorting by column
|
|
2682
2683
|
return Object.assign(Object.assign({}, state), { sortColumnParam: undefined, sortType: SortType.Ascending });
|
|
2683
2684
|
}
|
|
2684
|
-
case ActionType$
|
|
2685
|
+
case ActionType$6.UpdateColumnVisibility: {
|
|
2685
2686
|
const { columnVisibilityMap } = state;
|
|
2686
2687
|
columnVisibilityMap[action.param] = action.visible;
|
|
2687
2688
|
return Object.assign(Object.assign({}, state), { columnVisibilityMap });
|
|
2688
2689
|
}
|
|
2689
|
-
case ActionType$
|
|
2690
|
+
case ActionType$6.ToggleColVisCusModalVisibility: {
|
|
2690
2691
|
return Object.assign(Object.assign({}, state), { columnVisibilityCustomizationModalVisible: !state.columnVisibilityCustomizationModalVisible });
|
|
2691
2692
|
}
|
|
2692
|
-
case ActionType$
|
|
2693
|
+
case ActionType$6.ShowAllColumns: {
|
|
2693
2694
|
const { columnVisibilityMap } = state;
|
|
2694
2695
|
Object.keys(columnVisibilityMap).forEach((param) => {
|
|
2695
2696
|
columnVisibilityMap[param] = true;
|
|
2696
2697
|
});
|
|
2697
2698
|
return Object.assign(Object.assign({}, state), { columnVisibilityMap });
|
|
2698
2699
|
}
|
|
2699
|
-
case ActionType$
|
|
2700
|
+
case ActionType$6.HideAllColumns: {
|
|
2700
2701
|
const { columnVisibilityMap } = state;
|
|
2701
2702
|
Object.keys(columnVisibilityMap).forEach((param) => {
|
|
2702
2703
|
columnVisibilityMap[param] = false;
|
|
@@ -2743,7 +2744,7 @@ const IntelliTable = (props) => {
|
|
|
2743
2744
|
columnVisibilityCustomizationModalVisible: false,
|
|
2744
2745
|
};
|
|
2745
2746
|
// Initialize state
|
|
2746
|
-
const [state, dispatch] = React.useReducer(reducer$
|
|
2747
|
+
const [state, dispatch] = React.useReducer(reducer$7, initialState);
|
|
2747
2748
|
// Destructure common state
|
|
2748
2749
|
const { sortColumnParam, sortType, columnVisibilityMap, columnVisibilityCustomizationModalVisible, } = state;
|
|
2749
2750
|
/*------------------------------------------------------------------------*/
|
|
@@ -2766,13 +2767,13 @@ const IntelliTable = (props) => {
|
|
|
2766
2767
|
return alert('Choose at least one column', 'To continue, you have to choose at least one column to show');
|
|
2767
2768
|
}
|
|
2768
2769
|
dispatch({
|
|
2769
|
-
type: ActionType$
|
|
2770
|
+
type: ActionType$6.ToggleColVisCusModalVisibility,
|
|
2770
2771
|
});
|
|
2771
2772
|
}, okayVariant: Variant$1.Light },
|
|
2772
2773
|
columns.map((column) => {
|
|
2773
2774
|
return (React__default["default"].createElement(CheckboxButton, { key: column.param, id: `IntelliTable-${id}-toggle-visibility-${column.param}`, className: "mb-2", text: column.title, onChanged: (checked) => {
|
|
2774
2775
|
dispatch({
|
|
2775
|
-
type: ActionType$
|
|
2776
|
+
type: ActionType$6.UpdateColumnVisibility,
|
|
2776
2777
|
param: column.param,
|
|
2777
2778
|
visible: checked,
|
|
2778
2779
|
});
|
|
@@ -2781,12 +2782,12 @@ const IntelliTable = (props) => {
|
|
|
2781
2782
|
React__default["default"].createElement("div", { className: "mt-3" }, "Or you can:"),
|
|
2782
2783
|
React__default["default"].createElement("button", { type: "button", id: `IntelliTable-${id}-select-all-columns`, className: "btn btn-secondary me-2", "aria-label": `show all columns in the ${title} table`, onClick: () => {
|
|
2783
2784
|
dispatch({
|
|
2784
|
-
type: ActionType$
|
|
2785
|
+
type: ActionType$6.ShowAllColumns,
|
|
2785
2786
|
});
|
|
2786
2787
|
} }, "Select All"),
|
|
2787
2788
|
React__default["default"].createElement("button", { type: "button", id: `IntelliTable-${id}-select-none-columns`, className: "btn btn-secondary", "aria-label": `hide all columns in the ${title} table`, onClick: () => {
|
|
2788
2789
|
dispatch({
|
|
2789
|
-
type: ActionType$
|
|
2790
|
+
type: ActionType$6.HideAllColumns,
|
|
2790
2791
|
});
|
|
2791
2792
|
} }, "Deselect All")));
|
|
2792
2793
|
}
|
|
@@ -2837,7 +2838,7 @@ const IntelliTable = (props) => {
|
|
|
2837
2838
|
React__default["default"].createElement("div", null,
|
|
2838
2839
|
React__default["default"].createElement("button", { type: "button", id: `IntelliTable-${id}-sort-by-${column.param}-button`, className: `btn btn-${sortingByThisColumn ? 'light' : 'secondary'} btn-sm ms-1 ps-1 pe-1 pt-0 pb-0`, "aria-label": sortButtonAriaLabel, onClick: () => {
|
|
2839
2840
|
dispatch({
|
|
2840
|
-
type: ActionType$
|
|
2841
|
+
type: ActionType$6.ToggleSortColumn,
|
|
2841
2842
|
param: column.param,
|
|
2842
2843
|
});
|
|
2843
2844
|
} },
|
|
@@ -3026,7 +3027,7 @@ const IntelliTable = (props) => {
|
|
|
3026
3027
|
React__default["default"].createElement(CSVDownloadButton, { "aria-label": `download data as csv for ${title}`, id: `IntelliTable-${id}-download-as-csv`, filename: filename, csv: csv }),
|
|
3027
3028
|
React__default["default"].createElement("button", { type: "button", className: "btn btn-secondary ms-2", "aria-label": `show panel for customizing which columns show in table ${title}`, id: `IntelliTable-${id}-show-column-customization-modal`, onClick: () => {
|
|
3028
3029
|
dispatch({
|
|
3029
|
-
type: ActionType$
|
|
3030
|
+
type: ActionType$6.ToggleColVisCusModalVisibility,
|
|
3030
3031
|
});
|
|
3031
3032
|
} },
|
|
3032
3033
|
"Show/Hide Cols",
|
|
@@ -3058,7 +3059,7 @@ var FilterDrawer;
|
|
|
3058
3059
|
/*------------------------------------------------------------------------*/
|
|
3059
3060
|
/* -------------------------------- Style ------------------------------- */
|
|
3060
3061
|
/*------------------------------------------------------------------------*/
|
|
3061
|
-
const style$
|
|
3062
|
+
const style$2 = `
|
|
3062
3063
|
.LogReviewer-outer-container {
|
|
3063
3064
|
/* Full Screen */
|
|
3064
3065
|
display: inline-block;
|
|
@@ -3392,7 +3393,7 @@ const genHumanReadableName = (machineReadableName) => {
|
|
|
3392
3393
|
};
|
|
3393
3394
|
/* ------------- Actions ------------ */
|
|
3394
3395
|
// Types of actions
|
|
3395
|
-
var ActionType$
|
|
3396
|
+
var ActionType$5;
|
|
3396
3397
|
(function (ActionType) {
|
|
3397
3398
|
// Show the loading bar
|
|
3398
3399
|
ActionType["StartLoading"] = "start-loading";
|
|
@@ -3414,45 +3415,45 @@ var ActionType$6;
|
|
|
3414
3415
|
ActionType["UpdateActionErrorFilterState"] = "update-action-error-filter-state";
|
|
3415
3416
|
// Update the advanced filter state
|
|
3416
3417
|
ActionType["UpdateAdvancedFilterState"] = "update-advanced-filter-state";
|
|
3417
|
-
})(ActionType$
|
|
3418
|
+
})(ActionType$5 || (ActionType$5 = {}));
|
|
3418
3419
|
/**
|
|
3419
3420
|
* Reducer that executes actions
|
|
3420
3421
|
* @author Gabe Abrams
|
|
3421
3422
|
* @param state current state
|
|
3422
3423
|
* @param action action to execute
|
|
3423
3424
|
*/
|
|
3424
|
-
const reducer$
|
|
3425
|
+
const reducer$6 = (state, action) => {
|
|
3425
3426
|
switch (action.type) {
|
|
3426
|
-
case ActionType$
|
|
3427
|
+
case ActionType$5.StartLoading: {
|
|
3427
3428
|
return Object.assign(Object.assign({}, state), { loading: true });
|
|
3428
3429
|
}
|
|
3429
|
-
case ActionType$
|
|
3430
|
+
case ActionType$5.FinishLoading: {
|
|
3430
3431
|
return Object.assign(Object.assign({}, state), { loading: false, logMap: action.logMap });
|
|
3431
3432
|
}
|
|
3432
|
-
case ActionType$
|
|
3433
|
+
case ActionType$5.ToggleFilterDrawer: {
|
|
3433
3434
|
return Object.assign(Object.assign({}, state), { expandedFilterDrawer: (state.expandedFilterDrawer === action.filterDrawer
|
|
3434
3435
|
? undefined // hide
|
|
3435
3436
|
: action.filterDrawer) });
|
|
3436
3437
|
}
|
|
3437
|
-
case ActionType$
|
|
3438
|
+
case ActionType$5.HideFilterDrawer: {
|
|
3438
3439
|
return Object.assign(Object.assign({}, state), { expandedFilterDrawer: undefined });
|
|
3439
3440
|
}
|
|
3440
|
-
case ActionType$
|
|
3441
|
+
case ActionType$5.ResetFilters: {
|
|
3441
3442
|
return Object.assign(Object.assign({}, state), { dateFilterState: action.initDateFilterState, contextFilterState: action.initContextFilterState, tagFilterState: action.initTagFilterState, actionErrorFilterState: action.initActionErrorFilterState, advancedFilterState: action.initAdvancedFilterState });
|
|
3442
3443
|
}
|
|
3443
|
-
case ActionType$
|
|
3444
|
+
case ActionType$5.UpdateDateFilterState: {
|
|
3444
3445
|
return Object.assign(Object.assign({}, state), { dateFilterState: action.dateFilterState });
|
|
3445
3446
|
}
|
|
3446
|
-
case ActionType$
|
|
3447
|
+
case ActionType$5.UpdateContextFilterState: {
|
|
3447
3448
|
return Object.assign(Object.assign({}, state), { contextFilterState: action.contextFilterState });
|
|
3448
3449
|
}
|
|
3449
|
-
case ActionType$
|
|
3450
|
+
case ActionType$5.UpdateTagFilterState: {
|
|
3450
3451
|
return Object.assign(Object.assign({}, state), { tagFilterState: action.tagFilterState });
|
|
3451
3452
|
}
|
|
3452
|
-
case ActionType$
|
|
3453
|
+
case ActionType$5.UpdateActionErrorFilterState: {
|
|
3453
3454
|
return Object.assign(Object.assign({}, state), { actionErrorFilterState: action.actionErrorFilterState });
|
|
3454
3455
|
}
|
|
3455
|
-
case ActionType$
|
|
3456
|
+
case ActionType$5.UpdateAdvancedFilterState: {
|
|
3456
3457
|
return Object.assign(Object.assign({}, state), { advancedFilterState: action.advancedFilterState });
|
|
3457
3458
|
}
|
|
3458
3459
|
default: {
|
|
@@ -3581,7 +3582,7 @@ const LogReviewer = (props) => {
|
|
|
3581
3582
|
advancedFilterState: initAdvancedFilterState,
|
|
3582
3583
|
};
|
|
3583
3584
|
// Initialize state
|
|
3584
|
-
const [state, dispatch] = React.useReducer(reducer$
|
|
3585
|
+
const [state, dispatch] = React.useReducer(reducer$6, initialState);
|
|
3585
3586
|
// Destructure common state
|
|
3586
3587
|
const { loading, logMap, expandedFilterDrawer, dateFilterState, contextFilterState, tagFilterState, actionErrorFilterState, advancedFilterState, } = state;
|
|
3587
3588
|
/*------------------------------------------------------------------------*/
|
|
@@ -3631,7 +3632,7 @@ const LogReviewer = (props) => {
|
|
|
3631
3632
|
const handleDateRangeUpdated = (newDateFilterState) => __awaiter(void 0, void 0, void 0, function* () {
|
|
3632
3633
|
// Update state
|
|
3633
3634
|
dispatch({
|
|
3634
|
-
type: ActionType$
|
|
3635
|
+
type: ActionType$5.UpdateDateFilterState,
|
|
3635
3636
|
dateFilterState: newDateFilterState,
|
|
3636
3637
|
});
|
|
3637
3638
|
// Check which year/month combos we need to load
|
|
@@ -3642,7 +3643,7 @@ const LogReviewer = (props) => {
|
|
|
3642
3643
|
}
|
|
3643
3644
|
// Start loading
|
|
3644
3645
|
dispatch({
|
|
3645
|
-
type: ActionType$
|
|
3646
|
+
type: ActionType$5.StartLoading,
|
|
3646
3647
|
});
|
|
3647
3648
|
// Load required months
|
|
3648
3649
|
try {
|
|
@@ -3666,7 +3667,7 @@ const LogReviewer = (props) => {
|
|
|
3666
3667
|
}
|
|
3667
3668
|
// Finish loading
|
|
3668
3669
|
dispatch({
|
|
3669
|
-
type: ActionType$
|
|
3670
|
+
type: ActionType$5.FinishLoading,
|
|
3670
3671
|
logMap,
|
|
3671
3672
|
});
|
|
3672
3673
|
});
|
|
@@ -3705,7 +3706,7 @@ const LogReviewer = (props) => {
|
|
|
3705
3706
|
React__default["default"].createElement("div", { className: "LogReviewer-filter-toggle-buttons alert alert-secondary p-2 m-0" },
|
|
3706
3707
|
React__default["default"].createElement("button", { type: "button", id: "LogReviewer-toggle-date-filter-drawer", className: `btn btn-${FilterDrawer.Date === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle date filter drawer", onClick: () => {
|
|
3707
3708
|
dispatch({
|
|
3708
|
-
type: ActionType$
|
|
3709
|
+
type: ActionType$5.ToggleFilterDrawer,
|
|
3709
3710
|
filterDrawer: FilterDrawer.Date,
|
|
3710
3711
|
});
|
|
3711
3712
|
} },
|
|
@@ -3713,7 +3714,7 @@ const LogReviewer = (props) => {
|
|
|
3713
3714
|
"Date"),
|
|
3714
3715
|
React__default["default"].createElement("button", { type: "button", id: "LogReviewer-toggle-context-filter-drawer", className: `btn btn-${FilterDrawer.Context === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle context filter drawer", onClick: () => {
|
|
3715
3716
|
dispatch({
|
|
3716
|
-
type: ActionType$
|
|
3717
|
+
type: ActionType$5.ToggleFilterDrawer,
|
|
3717
3718
|
filterDrawer: FilterDrawer.Context,
|
|
3718
3719
|
});
|
|
3719
3720
|
} },
|
|
@@ -3721,7 +3722,7 @@ const LogReviewer = (props) => {
|
|
|
3721
3722
|
"Context"),
|
|
3722
3723
|
(LogMetadata.Tag && Object.keys(LogMetadata.Tag).length > 0) && (React__default["default"].createElement("button", { type: "button", id: "LogReviewer-toggle-tag-filter-drawer", className: `btn btn-${FilterDrawer.Tag === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle tag filter drawer", onClick: () => {
|
|
3723
3724
|
dispatch({
|
|
3724
|
-
type: ActionType$
|
|
3725
|
+
type: ActionType$5.ToggleFilterDrawer,
|
|
3725
3726
|
filterDrawer: FilterDrawer.Tag,
|
|
3726
3727
|
});
|
|
3727
3728
|
} },
|
|
@@ -3729,7 +3730,7 @@ const LogReviewer = (props) => {
|
|
|
3729
3730
|
"Tag")),
|
|
3730
3731
|
React__default["default"].createElement("button", { type: "button", id: "LogReviewer-toggle-action-filter-drawer", className: `btn btn-${FilterDrawer.Action === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle action and error filter drawer", onClick: () => {
|
|
3731
3732
|
dispatch({
|
|
3732
|
-
type: ActionType$
|
|
3733
|
+
type: ActionType$5.ToggleFilterDrawer,
|
|
3733
3734
|
filterDrawer: FilterDrawer.Action,
|
|
3734
3735
|
});
|
|
3735
3736
|
} },
|
|
@@ -3737,7 +3738,7 @@ const LogReviewer = (props) => {
|
|
|
3737
3738
|
"Action"),
|
|
3738
3739
|
React__default["default"].createElement("button", { type: "button", id: "LogReviewer-toggle-advanced-filter-drawer", className: `btn btn-${FilterDrawer.Advanced === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle advanced filter drawer", onClick: () => {
|
|
3739
3740
|
dispatch({
|
|
3740
|
-
type: ActionType$
|
|
3741
|
+
type: ActionType$5.ToggleFilterDrawer,
|
|
3741
3742
|
filterDrawer: FilterDrawer.Advanced,
|
|
3742
3743
|
});
|
|
3743
3744
|
} },
|
|
@@ -3745,7 +3746,7 @@ const LogReviewer = (props) => {
|
|
|
3745
3746
|
"Advanced"),
|
|
3746
3747
|
React__default["default"].createElement("button", { type: "button", id: "LogReviewer-reset-filters-button", className: "btn btn-light", "aria-label": "reset filters", onClick: () => {
|
|
3747
3748
|
dispatch({
|
|
3748
|
-
type: ActionType$
|
|
3749
|
+
type: ActionType$5.ResetFilters,
|
|
3749
3750
|
initActionErrorFilterState,
|
|
3750
3751
|
initAdvancedFilterState,
|
|
3751
3752
|
initContextFilterState,
|
|
@@ -3867,7 +3868,7 @@ const LogReviewer = (props) => {
|
|
|
3867
3868
|
}
|
|
3868
3869
|
});
|
|
3869
3870
|
dispatch({
|
|
3870
|
-
type: ActionType$
|
|
3871
|
+
type: ActionType$5.UpdateContextFilterState,
|
|
3871
3872
|
contextFilterState,
|
|
3872
3873
|
});
|
|
3873
3874
|
} }));
|
|
@@ -3882,7 +3883,7 @@ const LogReviewer = (props) => {
|
|
|
3882
3883
|
return (React__default["default"].createElement(CheckboxButton, { key: tag, id: `LogReviewer-tag-${tag}-checkbox`, text: description, ariaLabel: `require that logs be tagged with "${description}" or any other selected tag`, checked: tagFilterState[tag], onChanged: (checked) => {
|
|
3883
3884
|
tagFilterState[tag] = checked;
|
|
3884
3885
|
dispatch({
|
|
3885
|
-
type: ActionType$
|
|
3886
|
+
type: ActionType$5.UpdateTagFilterState,
|
|
3886
3887
|
tagFilterState,
|
|
3887
3888
|
});
|
|
3888
3889
|
} }));
|
|
@@ -3895,21 +3896,21 @@ const LogReviewer = (props) => {
|
|
|
3895
3896
|
React__default["default"].createElement(RadioButton, { id: "LogReviewer-type-all", text: "All Logs", onSelected: () => {
|
|
3896
3897
|
actionErrorFilterState.type = undefined;
|
|
3897
3898
|
dispatch({
|
|
3898
|
-
type: ActionType$
|
|
3899
|
+
type: ActionType$5.UpdateActionErrorFilterState,
|
|
3899
3900
|
actionErrorFilterState,
|
|
3900
3901
|
});
|
|
3901
3902
|
}, ariaLabel: "show logs of all types", selected: actionErrorFilterState.type === undefined }),
|
|
3902
3903
|
React__default["default"].createElement(RadioButton, { id: "LogReviewer-type-action-only", text: "Action Logs Only", onSelected: () => {
|
|
3903
3904
|
actionErrorFilterState.type = LogType$1.Action;
|
|
3904
3905
|
dispatch({
|
|
3905
|
-
type: ActionType$
|
|
3906
|
+
type: ActionType$5.UpdateActionErrorFilterState,
|
|
3906
3907
|
actionErrorFilterState,
|
|
3907
3908
|
});
|
|
3908
3909
|
}, ariaLabel: "only show action logs", selected: actionErrorFilterState.type === LogType$1.Action }),
|
|
3909
3910
|
React__default["default"].createElement(RadioButton, { id: "LogReviewer-type-error-only", text: "Action Error Only", onSelected: () => {
|
|
3910
3911
|
actionErrorFilterState.type = LogType$1.Error;
|
|
3911
3912
|
dispatch({
|
|
3912
|
-
type: ActionType$
|
|
3913
|
+
type: ActionType$5.UpdateActionErrorFilterState,
|
|
3913
3914
|
actionErrorFilterState,
|
|
3914
3915
|
});
|
|
3915
3916
|
}, ariaLabel: "only show error logs", selected: actionErrorFilterState.type === LogType$1.Error, noMarginOnRight: true })),
|
|
@@ -3921,7 +3922,7 @@ const LogReviewer = (props) => {
|
|
|
3921
3922
|
return (React__default["default"].createElement(CheckboxButton, { key: action, id: `LogReviewer-action-${action}-checkbox`, text: description, ariaLabel: `include logs with action type "${description}" in results`, noMarginOnRight: true, checked: actionErrorFilterState.action[action], onChanged: (checked) => {
|
|
3922
3923
|
actionErrorFilterState.action[action] = checked;
|
|
3923
3924
|
dispatch({
|
|
3924
|
-
type: ActionType$
|
|
3925
|
+
type: ActionType$5.UpdateActionErrorFilterState,
|
|
3925
3926
|
actionErrorFilterState,
|
|
3926
3927
|
});
|
|
3927
3928
|
} }));
|
|
@@ -3932,7 +3933,7 @@ const LogReviewer = (props) => {
|
|
|
3932
3933
|
return (React__default["default"].createElement(CheckboxButton, { key: target, id: `LogReviewer-target-${target}-checkbox`, text: description, ariaLabel: `include logs with target "${description}" in results`, checked: actionErrorFilterState.target[target], noMarginOnRight: true, onChanged: (checked) => {
|
|
3933
3934
|
actionErrorFilterState.target[target] = checked;
|
|
3934
3935
|
dispatch({
|
|
3935
|
-
type: ActionType$
|
|
3936
|
+
type: ActionType$5.UpdateActionErrorFilterState,
|
|
3936
3937
|
actionErrorFilterState,
|
|
3937
3938
|
});
|
|
3938
3939
|
} }));
|
|
@@ -3944,7 +3945,7 @@ const LogReviewer = (props) => {
|
|
|
3944
3945
|
React__default["default"].createElement("input", { type: "text", className: "form-control", "aria-label": "query for error message", value: actionErrorFilterState.errorMessage, placeholder: "e.g. undefined is not a function", onChange: (e) => {
|
|
3945
3946
|
actionErrorFilterState.errorMessage = e.target.value;
|
|
3946
3947
|
dispatch({
|
|
3947
|
-
type: ActionType$
|
|
3948
|
+
type: ActionType$5.UpdateActionErrorFilterState,
|
|
3948
3949
|
actionErrorFilterState,
|
|
3949
3950
|
});
|
|
3950
3951
|
} })),
|
|
@@ -3955,7 +3956,7 @@ const LogReviewer = (props) => {
|
|
|
3955
3956
|
.trim()
|
|
3956
3957
|
.toUpperCase());
|
|
3957
3958
|
dispatch({
|
|
3958
|
-
type: ActionType$
|
|
3959
|
+
type: ActionType$5.UpdateActionErrorFilterState,
|
|
3959
3960
|
actionErrorFilterState,
|
|
3960
3961
|
});
|
|
3961
3962
|
} }))))));
|
|
@@ -3969,7 +3970,7 @@ const LogReviewer = (props) => {
|
|
|
3969
3970
|
React__default["default"].createElement("input", { type: "text", className: "form-control", "aria-label": "query for user first name", value: advancedFilterState.userFirstName, placeholder: "e.g. Divardo", onChange: (e) => {
|
|
3970
3971
|
advancedFilterState.userFirstName = e.target.value;
|
|
3971
3972
|
dispatch({
|
|
3972
|
-
type: ActionType$
|
|
3973
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
3973
3974
|
advancedFilterState,
|
|
3974
3975
|
});
|
|
3975
3976
|
} })),
|
|
@@ -3978,7 +3979,7 @@ const LogReviewer = (props) => {
|
|
|
3978
3979
|
React__default["default"].createElement("input", { type: "text", className: "form-control", "aria-label": "query for user last name", value: advancedFilterState.userLastName, placeholder: "e.g. Calicci", onChange: (e) => {
|
|
3979
3980
|
advancedFilterState.userLastName = e.target.value;
|
|
3980
3981
|
dispatch({
|
|
3981
|
-
type: ActionType$
|
|
3982
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
3982
3983
|
advancedFilterState,
|
|
3983
3984
|
});
|
|
3984
3985
|
} })),
|
|
@@ -3988,7 +3989,7 @@ const LogReviewer = (props) => {
|
|
|
3988
3989
|
advancedFilterState.userEmail = ((e.target.value)
|
|
3989
3990
|
.trim());
|
|
3990
3991
|
dispatch({
|
|
3991
|
-
type: ActionType$
|
|
3992
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
3992
3993
|
advancedFilterState,
|
|
3993
3994
|
});
|
|
3994
3995
|
} })),
|
|
@@ -4002,7 +4003,7 @@ const LogReviewer = (props) => {
|
|
|
4002
4003
|
.trim());
|
|
4003
4004
|
}
|
|
4004
4005
|
dispatch({
|
|
4005
|
-
type: ActionType$
|
|
4006
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4006
4007
|
advancedFilterState,
|
|
4007
4008
|
});
|
|
4008
4009
|
} })),
|
|
@@ -4010,21 +4011,21 @@ const LogReviewer = (props) => {
|
|
|
4010
4011
|
React__default["default"].createElement(CheckboxButton, { text: "Students", onChanged: (checked) => {
|
|
4011
4012
|
advancedFilterState.includeLearners = checked;
|
|
4012
4013
|
dispatch({
|
|
4013
|
-
type: ActionType$
|
|
4014
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4014
4015
|
advancedFilterState,
|
|
4015
4016
|
});
|
|
4016
4017
|
}, checked: advancedFilterState.includeLearners, ariaLabel: "show logs from students" }),
|
|
4017
4018
|
React__default["default"].createElement(CheckboxButton, { text: "Teaching Team Members", onChanged: (checked) => {
|
|
4018
4019
|
advancedFilterState.includeTTMs = checked;
|
|
4019
4020
|
dispatch({
|
|
4020
|
-
type: ActionType$
|
|
4021
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4021
4022
|
advancedFilterState,
|
|
4022
4023
|
});
|
|
4023
4024
|
}, checked: advancedFilterState.includeTTMs, ariaLabel: "show logs from teaching team members" }),
|
|
4024
4025
|
React__default["default"].createElement(CheckboxButton, { text: "Admins", onChanged: (checked) => {
|
|
4025
4026
|
advancedFilterState.includeAdmins = checked;
|
|
4026
4027
|
dispatch({
|
|
4027
|
-
type: ActionType$
|
|
4028
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4028
4029
|
advancedFilterState,
|
|
4029
4030
|
});
|
|
4030
4031
|
}, checked: advancedFilterState.includeAdmins, ariaLabel: "show logs from admins" }))),
|
|
@@ -4034,7 +4035,7 @@ const LogReviewer = (props) => {
|
|
|
4034
4035
|
React__default["default"].createElement("input", { type: "text", className: "form-control", "aria-label": "query for course name", value: advancedFilterState.courseName, placeholder: "e.g. GLC 200", onChange: (e) => {
|
|
4035
4036
|
advancedFilterState.courseName = e.target.value;
|
|
4036
4037
|
dispatch({
|
|
4037
|
-
type: ActionType$
|
|
4038
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4038
4039
|
advancedFilterState,
|
|
4039
4040
|
});
|
|
4040
4041
|
} })),
|
|
@@ -4048,7 +4049,7 @@ const LogReviewer = (props) => {
|
|
|
4048
4049
|
.trim());
|
|
4049
4050
|
}
|
|
4050
4051
|
dispatch({
|
|
4051
|
-
type: ActionType$
|
|
4052
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4052
4053
|
advancedFilterState,
|
|
4053
4054
|
});
|
|
4054
4055
|
} }))),
|
|
@@ -4057,21 +4058,21 @@ const LogReviewer = (props) => {
|
|
|
4057
4058
|
React__default["default"].createElement(RadioButton, { text: "All Devices", ariaLabel: "show logs from all devices", selected: advancedFilterState.isMobile === undefined, onSelected: () => {
|
|
4058
4059
|
advancedFilterState.isMobile = undefined;
|
|
4059
4060
|
dispatch({
|
|
4060
|
-
type: ActionType$
|
|
4061
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4061
4062
|
advancedFilterState,
|
|
4062
4063
|
});
|
|
4063
4064
|
} }),
|
|
4064
4065
|
React__default["default"].createElement(RadioButton, { text: "Mobile Only", ariaLabel: "show logs from mobile devices", selected: advancedFilterState.isMobile === true, onSelected: () => {
|
|
4065
4066
|
advancedFilterState.isMobile = true;
|
|
4066
4067
|
dispatch({
|
|
4067
|
-
type: ActionType$
|
|
4068
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4068
4069
|
advancedFilterState,
|
|
4069
4070
|
});
|
|
4070
4071
|
} }),
|
|
4071
4072
|
React__default["default"].createElement(RadioButton, { text: "Desktop Only", ariaLabel: "show logs from desktop devices", selected: advancedFilterState.isMobile === false, onSelected: () => {
|
|
4072
4073
|
advancedFilterState.isMobile = false;
|
|
4073
4074
|
dispatch({
|
|
4074
|
-
type: ActionType$
|
|
4075
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4075
4076
|
advancedFilterState,
|
|
4076
4077
|
});
|
|
4077
4078
|
}, noMarginOnRight: true }))),
|
|
@@ -4080,21 +4081,21 @@ const LogReviewer = (props) => {
|
|
|
4080
4081
|
React__default["default"].createElement(RadioButton, { text: "Both", ariaLabel: "show logs from all sources", selected: advancedFilterState.source === undefined, onSelected: () => {
|
|
4081
4082
|
advancedFilterState.source = undefined;
|
|
4082
4083
|
dispatch({
|
|
4083
|
-
type: ActionType$
|
|
4084
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4084
4085
|
advancedFilterState,
|
|
4085
4086
|
});
|
|
4086
4087
|
} }),
|
|
4087
4088
|
React__default["default"].createElement(RadioButton, { text: "Client Only", ariaLabel: "show logs from client source", selected: advancedFilterState.source === LogSource$1.Client, onSelected: () => {
|
|
4088
4089
|
advancedFilterState.source = LogSource$1.Client;
|
|
4089
4090
|
dispatch({
|
|
4090
|
-
type: ActionType$
|
|
4091
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4091
4092
|
advancedFilterState,
|
|
4092
4093
|
});
|
|
4093
4094
|
} }),
|
|
4094
4095
|
React__default["default"].createElement(RadioButton, { text: "Server Only", ariaLabel: "show logs from server source", selected: advancedFilterState.source === LogSource$1.Server, onSelected: () => {
|
|
4095
4096
|
advancedFilterState.source = LogSource$1.Server;
|
|
4096
4097
|
dispatch({
|
|
4097
|
-
type: ActionType$
|
|
4098
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4098
4099
|
advancedFilterState,
|
|
4099
4100
|
});
|
|
4100
4101
|
}, noMarginOnRight: true })),
|
|
@@ -4105,7 +4106,7 @@ const LogReviewer = (props) => {
|
|
|
4105
4106
|
advancedFilterState.courseName = ((e.target.value)
|
|
4106
4107
|
.trim());
|
|
4107
4108
|
dispatch({
|
|
4108
|
-
type: ActionType$
|
|
4109
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4109
4110
|
advancedFilterState,
|
|
4110
4111
|
});
|
|
4111
4112
|
} })),
|
|
@@ -4115,7 +4116,7 @@ const LogReviewer = (props) => {
|
|
|
4115
4116
|
advancedFilterState.courseName = ((e.target.value)
|
|
4116
4117
|
.trim());
|
|
4117
4118
|
dispatch({
|
|
4118
|
-
type: ActionType$
|
|
4119
|
+
type: ActionType$5.UpdateAdvancedFilterState,
|
|
4119
4120
|
advancedFilterState,
|
|
4120
4121
|
});
|
|
4121
4122
|
} })))))));
|
|
@@ -4394,7 +4395,7 @@ const LogReviewer = (props) => {
|
|
|
4394
4395
|
}
|
|
4395
4396
|
/* ---------- Wrap in Modal --------- */
|
|
4396
4397
|
return (React__default["default"].createElement("div", { className: "LogReviewer-outer-container" },
|
|
4397
|
-
React__default["default"].createElement("style", null, style$
|
|
4398
|
+
React__default["default"].createElement("style", null, style$2),
|
|
4398
4399
|
React__default["default"].createElement("div", { className: "LogReviewer-inner-container" },
|
|
4399
4400
|
React__default["default"].createElement("div", { className: "LogReviewer-header" },
|
|
4400
4401
|
React__default["default"].createElement("div", { className: "LogReviewer-header-title" },
|
|
@@ -39720,11 +39721,11 @@ var CreatableSelect$1 = CreatableSelect;
|
|
|
39720
39721
|
*/
|
|
39721
39722
|
/* ------------- Actions ------------ */
|
|
39722
39723
|
// Types of actions
|
|
39723
|
-
var ActionType$
|
|
39724
|
+
var ActionType$4;
|
|
39724
39725
|
(function (ActionType) {
|
|
39725
39726
|
// Update the input value
|
|
39726
39727
|
ActionType["SetInputValue"] = "SetInputValue";
|
|
39727
|
-
})(ActionType$
|
|
39728
|
+
})(ActionType$4 || (ActionType$4 = {}));
|
|
39728
39729
|
/**
|
|
39729
39730
|
* Reducer that executes actions
|
|
39730
39731
|
* @author Yuen Ler Chow
|
|
@@ -39732,9 +39733,9 @@ var ActionType$5;
|
|
|
39732
39733
|
* @param action action to execute
|
|
39733
39734
|
* @returns updated state
|
|
39734
39735
|
*/
|
|
39735
|
-
const reducer$
|
|
39736
|
+
const reducer$5 = (state, action) => {
|
|
39736
39737
|
switch (action.type) {
|
|
39737
|
-
case ActionType$
|
|
39738
|
+
case ActionType$4.SetInputValue: {
|
|
39738
39739
|
return Object.assign(Object.assign({}, state), { inputValue: action.value });
|
|
39739
39740
|
}
|
|
39740
39741
|
default: {
|
|
@@ -39754,7 +39755,7 @@ const CreatableMultiselect = (props) => {
|
|
|
39754
39755
|
inputValue: '',
|
|
39755
39756
|
};
|
|
39756
39757
|
// Initialize state
|
|
39757
|
-
const [state, dispatch] = React.useReducer(reducer$
|
|
39758
|
+
const [state, dispatch] = React.useReducer(reducer$5, initialState);
|
|
39758
39759
|
// Destructure common state
|
|
39759
39760
|
const { inputValue } = state;
|
|
39760
39761
|
/*------------------------------------------------------------------------*/
|
|
@@ -39831,7 +39832,7 @@ const CreatableMultiselect = (props) => {
|
|
|
39831
39832
|
}
|
|
39832
39833
|
// Reset text field to empty because the values have been added
|
|
39833
39834
|
dispatch({
|
|
39834
|
-
type: ActionType$
|
|
39835
|
+
type: ActionType$4.SetInputValue,
|
|
39835
39836
|
value: '',
|
|
39836
39837
|
});
|
|
39837
39838
|
};
|
|
@@ -39870,7 +39871,7 @@ const CreatableMultiselect = (props) => {
|
|
|
39870
39871
|
else {
|
|
39871
39872
|
// simply update the input value to the new input value
|
|
39872
39873
|
dispatch({
|
|
39873
|
-
type: ActionType$
|
|
39874
|
+
type: ActionType$4.SetInputValue,
|
|
39874
39875
|
value: newValue,
|
|
39875
39876
|
});
|
|
39876
39877
|
}
|
|
@@ -39915,20 +39916,20 @@ const CreatableMultiselect = (props) => {
|
|
|
39915
39916
|
/*------------------------------------------------------------------------*/
|
|
39916
39917
|
/* -------------------------------- Style ------------------------------- */
|
|
39917
39918
|
/*------------------------------------------------------------------------*/
|
|
39918
|
-
const style$
|
|
39919
|
+
const style$1 = `
|
|
39919
39920
|
.AddOrEditDBEntry-input-label {
|
|
39920
39921
|
min-width: 7rem;
|
|
39921
39922
|
}
|
|
39922
39923
|
`;
|
|
39923
39924
|
/* ------------- Actions ------------ */
|
|
39924
39925
|
// Types of actions
|
|
39925
|
-
var ActionType$
|
|
39926
|
+
var ActionType$3;
|
|
39926
39927
|
(function (ActionType) {
|
|
39927
39928
|
// Update the DBEntry
|
|
39928
39929
|
ActionType["UpdateDBEntry"] = "UpdateDBEntry";
|
|
39929
39930
|
// Start the save spinner
|
|
39930
39931
|
ActionType["StartSave"] = "StartSave";
|
|
39931
|
-
})(ActionType$
|
|
39932
|
+
})(ActionType$3 || (ActionType$3 = {}));
|
|
39932
39933
|
/**
|
|
39933
39934
|
* Reducer that executes actions
|
|
39934
39935
|
* @author Yuen Ler Chow
|
|
@@ -39936,12 +39937,12 @@ var ActionType$4;
|
|
|
39936
39937
|
* @param action action to execute
|
|
39937
39938
|
* @returns updated state
|
|
39938
39939
|
*/
|
|
39939
|
-
const reducer$
|
|
39940
|
+
const reducer$4 = (state, action) => {
|
|
39940
39941
|
switch (action.type) {
|
|
39941
|
-
case ActionType$
|
|
39942
|
+
case ActionType$3.UpdateDBEntry: {
|
|
39942
39943
|
return Object.assign(Object.assign({}, state), { entry: action.dbEntry });
|
|
39943
39944
|
}
|
|
39944
|
-
case ActionType$
|
|
39945
|
+
case ActionType$3.StartSave: {
|
|
39945
39946
|
return Object.assign(Object.assign({}, state), { saving: true });
|
|
39946
39947
|
}
|
|
39947
39948
|
default: {
|
|
@@ -39966,7 +39967,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
39966
39967
|
saving: false,
|
|
39967
39968
|
};
|
|
39968
39969
|
// Initialize state
|
|
39969
|
-
const [state, dispatch] = React.useReducer(reducer$
|
|
39970
|
+
const [state, dispatch] = React.useReducer(reducer$4, initialState);
|
|
39970
39971
|
// Destructure common state
|
|
39971
39972
|
const { entry, saving, } = state;
|
|
39972
39973
|
/*------------------------------------------------------------------------*/
|
|
@@ -39978,7 +39979,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
39978
39979
|
*/
|
|
39979
39980
|
const save = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
39980
39981
|
// Start the save loading indicator
|
|
39981
|
-
dispatch({ type: ActionType$
|
|
39982
|
+
dispatch({ type: ActionType$3.StartSave });
|
|
39982
39983
|
// add all default values to the entry
|
|
39983
39984
|
entryFields.forEach((field) => {
|
|
39984
39985
|
if (field.defaultValue && !entry[field.objectKey]) {
|
|
@@ -40161,7 +40162,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
40161
40162
|
return (React__default["default"].createElement(RadioButton, { key: choice.value, text: choice.title, selected: entry[field.objectKey] === choice.value, onSelected: () => {
|
|
40162
40163
|
entry[field.objectKey] = choice.value;
|
|
40163
40164
|
dispatch({
|
|
40164
|
-
type: ActionType$
|
|
40165
|
+
type: ActionType$3.UpdateDBEntry,
|
|
40165
40166
|
dbEntry: entry,
|
|
40166
40167
|
});
|
|
40167
40168
|
}, ariaLabel: choice.title }));
|
|
@@ -40173,7 +40174,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
40173
40174
|
React__default["default"].createElement("input", { disabled: disabled, type: "text", className: "form-control", placeholder: field.placeholder, "aria-describedby": "AddOrEditDBEntry-form-name-label", value: entry[field.objectKey] || '', onChange: (e) => {
|
|
40174
40175
|
entry[field.objectKey] = (e.target.value);
|
|
40175
40176
|
dispatch({
|
|
40176
|
-
type: ActionType$
|
|
40177
|
+
type: ActionType$3.UpdateDBEntry,
|
|
40177
40178
|
dbEntry: entry,
|
|
40178
40179
|
});
|
|
40179
40180
|
} }))));
|
|
@@ -40186,7 +40187,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
40186
40187
|
entry[field.objectKey] = (e.target.value
|
|
40187
40188
|
.replace(/[^0-9]/g, ''));
|
|
40188
40189
|
dispatch({
|
|
40189
|
-
type: ActionType$
|
|
40190
|
+
type: ActionType$3.UpdateDBEntry,
|
|
40190
40191
|
dbEntry: entry,
|
|
40191
40192
|
});
|
|
40192
40193
|
} }))));
|
|
@@ -40216,7 +40217,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
40216
40217
|
}
|
|
40217
40218
|
// Save
|
|
40218
40219
|
dispatch({
|
|
40219
|
-
type: ActionType$
|
|
40220
|
+
type: ActionType$3.UpdateDBEntry,
|
|
40220
40221
|
dbEntry: entry,
|
|
40221
40222
|
});
|
|
40222
40223
|
}, ariaLabel: choice.title }));
|
|
@@ -40231,7 +40232,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
40231
40232
|
// Update entry and save
|
|
40232
40233
|
entry[field.objectKey] = values;
|
|
40233
40234
|
dispatch({
|
|
40234
|
-
type: ActionType$
|
|
40235
|
+
type: ActionType$3.UpdateDBEntry,
|
|
40235
40236
|
dbEntry: entry,
|
|
40236
40237
|
});
|
|
40237
40238
|
} })))));
|
|
@@ -40244,7 +40245,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
40244
40245
|
React__default["default"].createElement(CreatableMultiselect, { disabled: disabled, type: DBEntryFieldType$1.NumberArray, values: entry[field.objectKey] || [], onChange: (values) => {
|
|
40245
40246
|
entry[field.objectKey] = values;
|
|
40246
40247
|
dispatch({
|
|
40247
|
-
type: ActionType$
|
|
40248
|
+
type: ActionType$3.UpdateDBEntry,
|
|
40248
40249
|
dbEntry: entry,
|
|
40249
40250
|
});
|
|
40250
40251
|
} })))));
|
|
@@ -40293,7 +40294,7 @@ const AddOrEditDBEntry = (props) => {
|
|
|
40293
40294
|
/* --------------- Main UI -------------- */
|
|
40294
40295
|
/*----------------------------------------*/
|
|
40295
40296
|
return (React__default["default"].createElement("div", { className: "alert alert-light text-black" },
|
|
40296
|
-
React__default["default"].createElement("style", null, style$
|
|
40297
|
+
React__default["default"].createElement("style", null, style$1),
|
|
40297
40298
|
body));
|
|
40298
40299
|
};
|
|
40299
40300
|
|
|
@@ -40318,7 +40319,7 @@ const generateEndpointPath = (collectionName, adminsOnly) => {
|
|
|
40318
40319
|
*/
|
|
40319
40320
|
/* ------------- Actions ------------ */
|
|
40320
40321
|
// Types of actions
|
|
40321
|
-
var ActionType$
|
|
40322
|
+
var ActionType$2;
|
|
40322
40323
|
(function (ActionType) {
|
|
40323
40324
|
// Show adder
|
|
40324
40325
|
ActionType["ShowAdder"] = "ShowAdder";
|
|
@@ -40332,7 +40333,7 @@ var ActionType$3;
|
|
|
40332
40333
|
ActionType["StartDelete"] = "StartDelete";
|
|
40333
40334
|
// Finish deletion process
|
|
40334
40335
|
ActionType["FinishDelete"] = "FinishDelete";
|
|
40335
|
-
})(ActionType$
|
|
40336
|
+
})(ActionType$2 || (ActionType$2 = {}));
|
|
40336
40337
|
/**
|
|
40337
40338
|
* Reducer that executes actions
|
|
40338
40339
|
* @author Yuen Ler Chow
|
|
@@ -40340,18 +40341,18 @@ var ActionType$3;
|
|
|
40340
40341
|
* @param action action to execute
|
|
40341
40342
|
* @returns updated state
|
|
40342
40343
|
*/
|
|
40343
|
-
const reducer$
|
|
40344
|
+
const reducer$3 = (state, action) => {
|
|
40344
40345
|
switch (action.type) {
|
|
40345
|
-
case ActionType$
|
|
40346
|
+
case ActionType$2.FinishLoading: {
|
|
40346
40347
|
return Object.assign(Object.assign({}, state), { loading: false, dbEntries: action.dbEntries });
|
|
40347
40348
|
}
|
|
40348
|
-
case ActionType$
|
|
40349
|
+
case ActionType$2.ShowAdder: {
|
|
40349
40350
|
return Object.assign(Object.assign({}, state), { adding: true, dbEntryToEdit: undefined });
|
|
40350
40351
|
}
|
|
40351
|
-
case ActionType$
|
|
40352
|
+
case ActionType$2.ShowEditor: {
|
|
40352
40353
|
return Object.assign(Object.assign({}, state), { adding: false, dbEntryToEdit: action.dbEntry });
|
|
40353
40354
|
}
|
|
40354
|
-
case ActionType$
|
|
40355
|
+
case ActionType$2.FinishAdd: {
|
|
40355
40356
|
// Handle cancel
|
|
40356
40357
|
const finishedEntry = action.dbEntry;
|
|
40357
40358
|
if (!finishedEntry) {
|
|
@@ -40375,10 +40376,10 @@ const reducer$4 = (state, action) => {
|
|
|
40375
40376
|
// Update the state
|
|
40376
40377
|
return Object.assign(Object.assign({}, state), { adding: false, dbEntryToEdit: undefined, dbEntries: updatedDbEntries });
|
|
40377
40378
|
}
|
|
40378
|
-
case ActionType$
|
|
40379
|
+
case ActionType$2.StartDelete: {
|
|
40379
40380
|
return Object.assign(Object.assign({}, state), { loading: true });
|
|
40380
40381
|
}
|
|
40381
|
-
case ActionType$
|
|
40382
|
+
case ActionType$2.FinishDelete: {
|
|
40382
40383
|
return Object.assign(Object.assign({}, state), { loading: false,
|
|
40383
40384
|
// Remove the deleted entry from the list
|
|
40384
40385
|
dbEntries: state.dbEntries.filter((entry) => {
|
|
@@ -40404,7 +40405,7 @@ const DBEntryManagerPanel = (props) => {
|
|
|
40404
40405
|
loading: true,
|
|
40405
40406
|
};
|
|
40406
40407
|
// Initialize state
|
|
40407
|
-
const [state, dispatch] = React.useReducer(reducer$
|
|
40408
|
+
const [state, dispatch] = React.useReducer(reducer$3, initialState);
|
|
40408
40409
|
// Destructure common state
|
|
40409
40410
|
const { adding, dbEntryToEdit, dbEntries, loading, } = state;
|
|
40410
40411
|
/*------------------------------------------------------------------------*/
|
|
@@ -40430,7 +40431,7 @@ const DBEntryManagerPanel = (props) => {
|
|
|
40430
40431
|
try {
|
|
40431
40432
|
// Start loader
|
|
40432
40433
|
dispatch({
|
|
40433
|
-
type: ActionType$
|
|
40434
|
+
type: ActionType$2.StartDelete,
|
|
40434
40435
|
});
|
|
40435
40436
|
// Perform deletion
|
|
40436
40437
|
yield visitServerEndpoint({
|
|
@@ -40439,7 +40440,7 @@ const DBEntryManagerPanel = (props) => {
|
|
|
40439
40440
|
});
|
|
40440
40441
|
// Finish loader
|
|
40441
40442
|
dispatch({
|
|
40442
|
-
type: ActionType$
|
|
40443
|
+
type: ActionType$2.FinishDelete,
|
|
40443
40444
|
dbEntry: entry,
|
|
40444
40445
|
idPropName,
|
|
40445
40446
|
});
|
|
@@ -40468,7 +40469,7 @@ const DBEntryManagerPanel = (props) => {
|
|
|
40468
40469
|
});
|
|
40469
40470
|
// Save loaded data
|
|
40470
40471
|
dispatch({
|
|
40471
|
-
type: ActionType$
|
|
40472
|
+
type: ActionType$2.FinishLoading,
|
|
40472
40473
|
dbEntries: data,
|
|
40473
40474
|
});
|
|
40474
40475
|
}
|
|
@@ -40511,7 +40512,7 @@ const DBEntryManagerPanel = (props) => {
|
|
|
40511
40512
|
React__default["default"].createElement("span", { className: "d-none d-md-inline ms-1" }, "Remove")),
|
|
40512
40513
|
!disableEdit && (React__default["default"].createElement("button", { type: "button", id: `DBEntryManagerPanel-edit-with-id-${entry[idPropName]}`, className: "btn btn-primary", "aria-label": `edit db entry: ${entry[titlePropName]}`, onClick: () => {
|
|
40513
40514
|
dispatch({
|
|
40514
|
-
type: ActionType$
|
|
40515
|
+
type: ActionType$2.ShowEditor,
|
|
40515
40516
|
dbEntry: entry,
|
|
40516
40517
|
});
|
|
40517
40518
|
} },
|
|
@@ -40521,7 +40522,7 @@ const DBEntryManagerPanel = (props) => {
|
|
|
40521
40522
|
React__default["default"].createElement("div", { className: "d-grid" },
|
|
40522
40523
|
React__default["default"].createElement("button", { type: "button", id: "DBEntryManagerPanel-add-entry", className: "btn btn-lg btn-primary", "aria-label": `add a new ${itemName} entry to the list of entries`, onClick: () => {
|
|
40523
40524
|
dispatch({
|
|
40524
|
-
type: ActionType$
|
|
40525
|
+
type: ActionType$2.ShowAdder,
|
|
40525
40526
|
});
|
|
40526
40527
|
} },
|
|
40527
40528
|
React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faPlus, className: "me-2" }),
|
|
@@ -40533,7 +40534,7 @@ const DBEntryManagerPanel = (props) => {
|
|
|
40533
40534
|
if (!loading && (adding || dbEntryToEdit)) {
|
|
40534
40535
|
body = (React__default["default"].createElement(AddOrEditDBEntry, { saveEndpointPath: endpoint, validateEntry: validateEntry, modifyEntry: modifyEntry, entryFields: entryFields, dbEntryToEdit: dbEntryToEdit, idPropName: idPropName, entries: dbEntries, itemName: itemName, onFinished: (entry) => {
|
|
40535
40536
|
dispatch({
|
|
40536
|
-
type: ActionType$
|
|
40537
|
+
type: ActionType$2.FinishAdd,
|
|
40537
40538
|
dbEntry: entry,
|
|
40538
40539
|
idPropName,
|
|
40539
40540
|
});
|
|
@@ -40550,228 +40551,6 @@ const DBEntryManagerPanel = (props) => {
|
|
|
40550
40551
|
* @author Gabe Abrams
|
|
40551
40552
|
*/
|
|
40552
40553
|
/*------------------------------------------------------------------------*/
|
|
40553
|
-
/* ------------------------------ Constants ----------------------------- */
|
|
40554
|
-
/*------------------------------------------------------------------------*/
|
|
40555
|
-
// Tooltip widths
|
|
40556
|
-
const TOOLTIP_WIDTH_THIN_REM = 5;
|
|
40557
|
-
const TOOLTIP_WIDTH_NORMAL_REM = 7;
|
|
40558
|
-
const TOOLTIP_WIDTH_WIDE_REM = 10;
|
|
40559
|
-
// Tooltip border radius
|
|
40560
|
-
const TOOLTIP_BORDER_RADIUS_REM = 0.3;
|
|
40561
|
-
/*------------------------------------------------------------------------*/
|
|
40562
|
-
/* -------------------------------- Style ------------------------------- */
|
|
40563
|
-
/*------------------------------------------------------------------------*/
|
|
40564
|
-
const style$1 = `
|
|
40565
|
-
/* Container for contents and tooltip */
|
|
40566
|
-
.Tooltip-outer-container {
|
|
40567
|
-
position: relative;
|
|
40568
|
-
}
|
|
40569
|
-
|
|
40570
|
-
/* Container for just tooltip */
|
|
40571
|
-
.Tooltip-tooltip-container {
|
|
40572
|
-
/* Position in middle but take no space */
|
|
40573
|
-
/* (so layout of page is unaffected) */
|
|
40574
|
-
position: absolute;
|
|
40575
|
-
display: inline-block;
|
|
40576
|
-
top: 0;
|
|
40577
|
-
left: 50%;
|
|
40578
|
-
height: 0;
|
|
40579
|
-
width: 0;
|
|
40580
|
-
overflow: visible;
|
|
40581
|
-
}
|
|
40582
|
-
|
|
40583
|
-
/* Tooltip */
|
|
40584
|
-
.Tooltip-tooltip {
|
|
40585
|
-
/* Position above item */
|
|
40586
|
-
display: inline-block;
|
|
40587
|
-
position: absolute;
|
|
40588
|
-
top: -2.3rem;
|
|
40589
|
-
height: 1.8rem;
|
|
40590
|
-
z-index: 1;
|
|
40591
|
-
|
|
40592
|
-
/* Use standard black font */
|
|
40593
|
-
font-size: 1rem;
|
|
40594
|
-
color: black;
|
|
40595
|
-
|
|
40596
|
-
/* Non-interactive */
|
|
40597
|
-
pointer-events: none;
|
|
40598
|
-
}
|
|
40599
|
-
|
|
40600
|
-
/* Tooltip box (the rectangle surrounding the text) */
|
|
40601
|
-
.Tooltip-box,
|
|
40602
|
-
.Tooltip-box-shadow,
|
|
40603
|
-
.Tooltip-box-highlight {
|
|
40604
|
-
/* Fill all space with rectangle */
|
|
40605
|
-
position: absolute;
|
|
40606
|
-
left: 0;
|
|
40607
|
-
top: 0;
|
|
40608
|
-
display: inline-block;
|
|
40609
|
-
width: 100%;
|
|
40610
|
-
height: 100%;
|
|
40611
|
-
|
|
40612
|
-
/* Rounded border */
|
|
40613
|
-
border: 0.15rem solid black;
|
|
40614
|
-
border-radius: ${TOOLTIP_BORDER_RADIUS_REM}rem;
|
|
40615
|
-
}
|
|
40616
|
-
|
|
40617
|
-
/* Tooltip highlight (the bright background to the text) */
|
|
40618
|
-
.Tooltip-box-highlight {
|
|
40619
|
-
/* Bootstrap warning variant background */
|
|
40620
|
-
background-color: rgb(255, 193, 7);
|
|
40621
|
-
border-radius: ${TOOLTIP_BORDER_RADIUS_REM}rem;
|
|
40622
|
-
|
|
40623
|
-
/* Place on top */
|
|
40624
|
-
z-index: -1;
|
|
40625
|
-
}
|
|
40626
|
-
|
|
40627
|
-
/* Tooltip box (the black rectangle) */
|
|
40628
|
-
.Tooltip-box {
|
|
40629
|
-
/* Plain black background */
|
|
40630
|
-
background-color: black;
|
|
40631
|
-
|
|
40632
|
-
/* Place in middle */
|
|
40633
|
-
z-index: -2;
|
|
40634
|
-
}
|
|
40635
|
-
|
|
40636
|
-
/* Tooltip box shadow (the white shadow beneath the box) */
|
|
40637
|
-
.Tooltip-box-shadow {
|
|
40638
|
-
/* White shadow */
|
|
40639
|
-
box-shadow: 0 0 0.3rem white;
|
|
40640
|
-
|
|
40641
|
-
/* Place beneath */
|
|
40642
|
-
z-index: -3;
|
|
40643
|
-
}
|
|
40644
|
-
|
|
40645
|
-
/* Tooltip contents (the text and icon) */
|
|
40646
|
-
.Tooltip-contents {
|
|
40647
|
-
/* Center text, don't allow overflow */
|
|
40648
|
-
white-space: nowrap;
|
|
40649
|
-
overflow: hidden;
|
|
40650
|
-
text-align: center;
|
|
40651
|
-
text-overflow: ellipsis;
|
|
40652
|
-
display: flex;
|
|
40653
|
-
align-items: center;
|
|
40654
|
-
justify-content: center;
|
|
40655
|
-
|
|
40656
|
-
/* Space within parent */
|
|
40657
|
-
z-index: 1;
|
|
40658
|
-
padding-left: 0.2rem;
|
|
40659
|
-
padding-right: 0.2rem;
|
|
40660
|
-
height: 100%;
|
|
40661
|
-
}
|
|
40662
|
-
|
|
40663
|
-
/* Tooltip text */
|
|
40664
|
-
.Tooltip-text {
|
|
40665
|
-
/* Center text, add ellipsis */
|
|
40666
|
-
overflow: hidden;
|
|
40667
|
-
text-align: center;
|
|
40668
|
-
text-overflow: ellipsis;
|
|
40669
|
-
}
|
|
40670
|
-
|
|
40671
|
-
/* Classes to switch between tooltip visible/hidden */
|
|
40672
|
-
.Tooltip-tooltip-visible-true {
|
|
40673
|
-
opacity: 1;
|
|
40674
|
-
}
|
|
40675
|
-
.Tooltip-tooltip-visible-false {
|
|
40676
|
-
opacity: 0;
|
|
40677
|
-
}
|
|
40678
|
-
|
|
40679
|
-
/* Classes to switch between tooltip sizes */
|
|
40680
|
-
.Tooltip-size-thin {
|
|
40681
|
-
width: ${TOOLTIP_WIDTH_THIN_REM}rem;
|
|
40682
|
-
left: calc(50% - ${TOOLTIP_WIDTH_THIN_REM / 2}rem);
|
|
40683
|
-
}
|
|
40684
|
-
.Tooltip-size-normal {
|
|
40685
|
-
width: ${TOOLTIP_WIDTH_NORMAL_REM}rem;
|
|
40686
|
-
left: calc(50% - ${TOOLTIP_WIDTH_NORMAL_REM / 2}rem);
|
|
40687
|
-
}
|
|
40688
|
-
.Tooltip-size-wide {
|
|
40689
|
-
width: ${TOOLTIP_WIDTH_WIDE_REM}rem;
|
|
40690
|
-
left: calc(50% - ${TOOLTIP_WIDTH_WIDE_REM / 2}rem);
|
|
40691
|
-
}
|
|
40692
|
-
|
|
40693
|
-
/* Arrow (beneath tooltip) */
|
|
40694
|
-
.Tooltip-arrow,
|
|
40695
|
-
.Tooltip-arrow-shadow {
|
|
40696
|
-
/* Position beneath tooltip */
|
|
40697
|
-
position: absolute;
|
|
40698
|
-
top: -1.5rem;
|
|
40699
|
-
font-size: 1.5rem;
|
|
40700
|
-
left: calc(50% - 0.5rem);
|
|
40701
|
-
width: 0;
|
|
40702
|
-
display: inline-block;
|
|
40703
|
-
|
|
40704
|
-
/* Non-interactive */
|
|
40705
|
-
pointer-events: none;
|
|
40706
|
-
}
|
|
40707
|
-
|
|
40708
|
-
/* Arrow itself */
|
|
40709
|
-
.Tooltip-arrow {
|
|
40710
|
-
color: black;
|
|
40711
|
-
z-index: 4;
|
|
40712
|
-
}
|
|
40713
|
-
|
|
40714
|
-
/* Arrow shadow */
|
|
40715
|
-
.Tooltip-arrow-shadow {
|
|
40716
|
-
z-index: -1;
|
|
40717
|
-
|
|
40718
|
-
/* Blur a white version of the caret as a shadow */
|
|
40719
|
-
color: white;
|
|
40720
|
-
filter: blur(0.2rem);
|
|
40721
|
-
}
|
|
40722
|
-
|
|
40723
|
-
/* Classes to switch between arrow visible/hidden */
|
|
40724
|
-
.Tooltip-arrow-visible-true {
|
|
40725
|
-
opacity: 1;
|
|
40726
|
-
}
|
|
40727
|
-
.Tooltip-arrow-visible-false {
|
|
40728
|
-
opacity: 0;
|
|
40729
|
-
}
|
|
40730
|
-
`;
|
|
40731
|
-
/* ------------- Actions ------------ */
|
|
40732
|
-
// Types of actions
|
|
40733
|
-
var ActionType$2;
|
|
40734
|
-
(function (ActionType) {
|
|
40735
|
-
// Make the tooltip visible
|
|
40736
|
-
ActionType["Show"] = "Show";
|
|
40737
|
-
// Make the tooltip invisible
|
|
40738
|
-
ActionType["Hide"] = "Hide";
|
|
40739
|
-
// Set nudge pixels
|
|
40740
|
-
ActionType["SetNudgePx"] = "SetNudgePx";
|
|
40741
|
-
// Set whether bottom left corner should be square
|
|
40742
|
-
ActionType["SetSquareBottomLeft"] = "SetSquareBottomLeft";
|
|
40743
|
-
// Set whether bottom right corner should be square
|
|
40744
|
-
ActionType["SetSquareBottomRight"] = "SetSquareBottomRight";
|
|
40745
|
-
})(ActionType$2 || (ActionType$2 = {}));
|
|
40746
|
-
/**
|
|
40747
|
-
* Reducer that executes actions
|
|
40748
|
-
* @author Gabe Abrams
|
|
40749
|
-
* @param state current state
|
|
40750
|
-
* @param action action to execute
|
|
40751
|
-
*/
|
|
40752
|
-
const reducer$3 = (state, action) => {
|
|
40753
|
-
switch (action.type) {
|
|
40754
|
-
case ActionType$2.Show: {
|
|
40755
|
-
return Object.assign(Object.assign({}, state), { isVisible: true });
|
|
40756
|
-
}
|
|
40757
|
-
case ActionType$2.Hide: {
|
|
40758
|
-
return Object.assign(Object.assign({}, state), { isVisible: false, nudgePx: 0 });
|
|
40759
|
-
}
|
|
40760
|
-
case ActionType$2.SetNudgePx: {
|
|
40761
|
-
return Object.assign(Object.assign({}, state), { nudgePx: action.nudgePx });
|
|
40762
|
-
}
|
|
40763
|
-
case ActionType$2.SetSquareBottomLeft: {
|
|
40764
|
-
return Object.assign(Object.assign({}, state), { squareBottomLeft: action.squareBottomLeft });
|
|
40765
|
-
}
|
|
40766
|
-
case ActionType$2.SetSquareBottomRight: {
|
|
40767
|
-
return Object.assign(Object.assign({}, state), { squareBottomRight: action.squareBottomRight });
|
|
40768
|
-
}
|
|
40769
|
-
default: {
|
|
40770
|
-
return state;
|
|
40771
|
-
}
|
|
40772
|
-
}
|
|
40773
|
-
};
|
|
40774
|
-
/*------------------------------------------------------------------------*/
|
|
40775
40554
|
/* ------------------------------ Component ----------------------------- */
|
|
40776
40555
|
/*------------------------------------------------------------------------*/
|
|
40777
40556
|
const Tooltip = (props) => {
|
|
@@ -40780,21 +40559,10 @@ const Tooltip = (props) => {
|
|
|
40780
40559
|
/*------------------------------------------------------------------------*/
|
|
40781
40560
|
/* -------------- Props ------------- */
|
|
40782
40561
|
// Destructure all props
|
|
40783
|
-
const {
|
|
40784
|
-
/* -------------- State ------------- */
|
|
40785
|
-
// Initial state
|
|
40786
|
-
const initialState = {
|
|
40787
|
-
isVisible: false,
|
|
40788
|
-
nudgePx: 0,
|
|
40789
|
-
};
|
|
40790
|
-
// Initialize state
|
|
40791
|
-
const [state, dispatch] = React.useReducer(reducer$3, initialState);
|
|
40792
|
-
// Destructure common state
|
|
40793
|
-
const { isVisible, nudgePx, squareBottomLeft, squareBottomRight, } = state;
|
|
40562
|
+
const { text, children, } = props;
|
|
40794
40563
|
/* -------------- Refs -------------- */
|
|
40795
|
-
//
|
|
40796
|
-
const
|
|
40797
|
-
const arrowElement = React.useRef(null);
|
|
40564
|
+
// Child ref
|
|
40565
|
+
const childRef = React.useRef(undefined);
|
|
40798
40566
|
/*------------------------------------------------------------------------*/
|
|
40799
40567
|
/* ------------------------- Lifecycle Functions ------------------------ */
|
|
40800
40568
|
/*------------------------------------------------------------------------*/
|
|
@@ -40803,109 +40571,29 @@ const Tooltip = (props) => {
|
|
|
40803
40571
|
* @author Gabe Abrams
|
|
40804
40572
|
*/
|
|
40805
40573
|
React.useEffect(() => {
|
|
40806
|
-
//
|
|
40807
|
-
if (
|
|
40808
|
-
|
|
40809
|
-
const tooltipContainerRect = (tooltipContainer
|
|
40810
|
-
.current
|
|
40811
|
-
.getBoundingClientRect());
|
|
40812
|
-
// Get the window width
|
|
40813
|
-
const windowWidth = window.innerWidth;
|
|
40814
|
-
// Calculate new nudge value
|
|
40815
|
-
let newNudgePx;
|
|
40816
|
-
if (tooltipContainerRect.left < 0) {
|
|
40817
|
-
// Tooltip is off the left side of the screen
|
|
40818
|
-
newNudgePx = -1 * tooltipContainerRect.left;
|
|
40819
|
-
}
|
|
40820
|
-
else if (tooltipContainerRect.right > windowWidth) {
|
|
40821
|
-
// Tooltip is off the right side of the screen
|
|
40822
|
-
newNudgePx = -1 * (tooltipContainerRect.right - windowWidth);
|
|
40823
|
-
}
|
|
40824
|
-
else {
|
|
40825
|
-
// Tooltip is in the middle of the screen
|
|
40826
|
-
newNudgePx = 0;
|
|
40827
|
-
}
|
|
40828
|
-
// Update state
|
|
40829
|
-
dispatch({
|
|
40830
|
-
type: ActionType$2.SetNudgePx,
|
|
40831
|
-
nudgePx: newNudgePx,
|
|
40832
|
-
});
|
|
40833
|
-
}
|
|
40834
|
-
// Update border rounding
|
|
40835
|
-
if (arrowElement.current && isVisible) {
|
|
40836
|
-
// Get the arrow location
|
|
40837
|
-
const arrowRect = (arrowElement
|
|
40838
|
-
.current
|
|
40839
|
-
.getBoundingClientRect());
|
|
40840
|
-
// REM in pixels given font size
|
|
40841
|
-
const remInPixels = Number.parseInt(getComputedStyle(document.documentElement).fontSize, 10);
|
|
40842
|
-
// Set bottom left corner rounding
|
|
40843
|
-
dispatch({
|
|
40844
|
-
type: ActionType$2.SetSquareBottomLeft,
|
|
40845
|
-
squareBottomLeft: (arrowRect.left < (TOOLTIP_BORDER_RADIUS_REM * remInPixels)),
|
|
40846
|
-
});
|
|
40847
|
-
// Set bottom right corner rounding
|
|
40848
|
-
dispatch({
|
|
40849
|
-
type: ActionType$2.SetSquareBottomRight,
|
|
40850
|
-
squareBottomRight: (arrowRect.right
|
|
40851
|
-
> window.innerWidth - (TOOLTIP_BORDER_RADIUS_REM * remInPixels)),
|
|
40852
|
-
});
|
|
40574
|
+
// Skip if no child
|
|
40575
|
+
if (!childRef.current) {
|
|
40576
|
+
return;
|
|
40853
40577
|
}
|
|
40854
|
-
|
|
40578
|
+
// Initialize tooltip
|
|
40579
|
+
const t = new bootstrap.Tooltip(childRef.current, {
|
|
40580
|
+
title: text,
|
|
40581
|
+
placement: 'top',
|
|
40582
|
+
trigger: 'hover',
|
|
40583
|
+
});
|
|
40584
|
+
// Clean up tooltip
|
|
40585
|
+
return () => {
|
|
40586
|
+
t.dispose();
|
|
40587
|
+
};
|
|
40588
|
+
}, [text]);
|
|
40855
40589
|
/*------------------------------------------------------------------------*/
|
|
40856
40590
|
/* ------------------------------- Render ------------------------------- */
|
|
40857
40591
|
/*------------------------------------------------------------------------*/
|
|
40858
40592
|
/*----------------------------------------*/
|
|
40859
40593
|
/* --------------- Main UI -------------- */
|
|
40860
40594
|
/*----------------------------------------*/
|
|
40861
|
-
//
|
|
40862
|
-
|
|
40863
|
-
if (wide) {
|
|
40864
|
-
size = 'wide';
|
|
40865
|
-
}
|
|
40866
|
-
else if (thin) {
|
|
40867
|
-
size = 'thin';
|
|
40868
|
-
}
|
|
40869
|
-
// Render
|
|
40870
|
-
return (React__default["default"].createElement("div", { className: `Tooltip-outer-container ${containerIsDisplayBlock ? 'd-block' : 'd-inline-block'}}`, "aria-label": text, onMouseEnter: () => {
|
|
40871
|
-
dispatch({
|
|
40872
|
-
type: ActionType$2.Show,
|
|
40873
|
-
});
|
|
40874
|
-
}, onMouseLeave: () => {
|
|
40875
|
-
dispatch({
|
|
40876
|
-
type: ActionType$2.Hide,
|
|
40877
|
-
});
|
|
40878
|
-
}, onFocus: () => {
|
|
40879
|
-
dispatch({
|
|
40880
|
-
type: ActionType$2.Show,
|
|
40881
|
-
});
|
|
40882
|
-
}, onBlur: () => {
|
|
40883
|
-
dispatch({
|
|
40884
|
-
type: ActionType$2.Hide,
|
|
40885
|
-
});
|
|
40886
|
-
} },
|
|
40887
|
-
React__default["default"].createElement("style", null, style$1),
|
|
40888
|
-
children,
|
|
40889
|
-
React__default["default"].createElement("div", { className: `Tooltip-arrow Tooltip-arrow-visible-${isVisible ? 'true' : 'false'}`, ref: arrowElement },
|
|
40890
|
-
React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCaretDown })),
|
|
40891
|
-
React__default["default"].createElement("div", { className: `Tooltip-arrow-shadow Tooltip-arrow-visible-${isVisible ? 'true' : 'false'}` },
|
|
40892
|
-
React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: freeSolidSvgIcons.faCaretDown })),
|
|
40893
|
-
React__default["default"].createElement("div", { className: "Tooltip-tooltip-container" },
|
|
40894
|
-
React__default["default"].createElement("div", { className: `Tooltip-tooltip Tooltip-tooltip-visible-${isVisible ? 'true' : 'false'} Tooltip-size-${size}`, role: "tooltip", ref: tooltipContainer, style: {
|
|
40895
|
-
transform: `translateX(${nudgePx}px)`,
|
|
40896
|
-
} },
|
|
40897
|
-
React__default["default"].createElement("div", { className: "Tooltip-box-highlight" }),
|
|
40898
|
-
React__default["default"].createElement("div", { className: "Tooltip-box", style: {
|
|
40899
|
-
borderBottomLeftRadius: squareBottomLeft ? 0 : undefined,
|
|
40900
|
-
borderBottomRightRadius: squareBottomRight ? 0 : undefined,
|
|
40901
|
-
} }),
|
|
40902
|
-
React__default["default"].createElement("div", { className: "Tooltip-box-shadow", style: {
|
|
40903
|
-
borderBottomLeftRadius: squareBottomLeft ? 0 : undefined,
|
|
40904
|
-
borderBottomRightRadius: squareBottomRight ? 0 : undefined,
|
|
40905
|
-
} }),
|
|
40906
|
-
React__default["default"].createElement("div", { className: "Tooltip-contents" },
|
|
40907
|
-
icon && (React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, { icon: icon, className: "me-1" })),
|
|
40908
|
-
React__default["default"].createElement("span", { className: "Tooltip-text" }, text))))));
|
|
40595
|
+
// Clone child and add ref
|
|
40596
|
+
return React__default["default"].cloneElement(children, { ref: childRef });
|
|
40909
40597
|
};
|
|
40910
40598
|
|
|
40911
40599
|
/**
|
|
@@ -42590,7 +42278,7 @@ const genRouteHandler = (opts) => {
|
|
|
42590
42278
|
* @author Gabe Abrams
|
|
42591
42279
|
*/
|
|
42592
42280
|
const logServerEvent = (logOpts) => __awaiter(void 0, void 0, void 0, function* () {
|
|
42593
|
-
var _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
42281
|
+
var _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
42594
42282
|
// NOTE: internally, we slip through an opts.overrideAsClientEvent boolean
|
|
42595
42283
|
// that indicates that this is actually a client event, but we don't
|
|
42596
42284
|
// include that in the LogFunction type because this is internal and
|
|
@@ -42674,7 +42362,7 @@ const genRouteHandler = (opts) => {
|
|
|
42674
42362
|
catch (err) {
|
|
42675
42363
|
// Print because we cannot store the error
|
|
42676
42364
|
// eslint-disable-next-line no-console
|
|
42677
|
-
console.error('Could not log the following:',
|
|
42365
|
+
console.error('Could not log the following:', logOpts, 'due to this error:', ((_q = err) !== null && _q !== void 0 ? _q : {}).message, ((_r = err) !== null && _r !== void 0 ? _r : {}).stack);
|
|
42678
42366
|
// Create a dummy log to return
|
|
42679
42367
|
const dummyMainInfo = {
|
|
42680
42368
|
id: '-1',
|