@dexteel/mesf-core 7.9.0 → 7.10.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/index.esm.js CHANGED
@@ -59,7 +59,7 @@ import { DateTimePicker as DateTimePicker$1 } from '@mui/x-date-pickers/DateTime
59
59
  import ClearAllIcon from '@mui/icons-material/ClearAll';
60
60
  import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
61
61
  import axios from 'axios';
62
- import { Group as Group$1, Panel, Separator } from 'react-resizable-panels';
62
+ import { Group as Group$1, Panel, Separator, useDefaultLayout } from 'react-resizable-panels';
63
63
  import { LocalizationProvider as LocalizationProvider$1 } from '@mui/x-date-pickers/LocalizationProvider';
64
64
  import InsertChartIcon from '@mui/icons-material/InsertChart';
65
65
  import ReactECharts from 'echarts-for-react';
@@ -15908,7 +15908,7 @@ var TrendingChartV2 = function (_a) {
15908
15908
  }); }), true);
15909
15909
  })(),
15910
15910
  dataZoom: __spreadArray([
15911
- __assign({ type: "inside", xAxisIndex: useSeparateGrids ? [0, 1] : [0], zoomOnMouseWheel: true, moveOnMouseMove: true, moveOnMouseWheel: true, preventDefaultMouseMove: false }, (zoomState ? { start: zoomState.start, end: zoomState.end } : {}))
15911
+ __assign({ type: "inside", xAxisIndex: useSeparateGrids ? [0, 1] : [0], zoomOnMouseWheel: false, moveOnMouseMove: true, moveOnMouseWheel: false, preventDefaultMouseMove: false }, (zoomState ? { start: zoomState.start, end: zoomState.end } : {}))
15912
15912
  ], ([
15913
15913
  __assign({ type: "slider", xAxisIndex: useSeparateGrids ? [0, 1] : [0], bottom: 3, height: 19, handleSize: "80%", showDetail: true, filterMode: "none" }, (zoomState
15914
15914
  ? { start: zoomState.start, end: zoomState.end }
@@ -16164,8 +16164,8 @@ var TrendingChartV2 = function (_a) {
16164
16164
  return;
16165
16165
  var handleKeyDown = function (e) {
16166
16166
  var range = timeScopeEnd.getTime() - timeScopeStart.getTime();
16167
- var smallStep = range * 0.01; // 1% of range
16168
- var largeStep = range * 0.05; // 5% of range
16167
+ var smallStep = range * 0.01;
16168
+ var largeStep = range * 0.05;
16169
16169
  var step = e.shiftKey ? largeStep : smallStep;
16170
16170
  switch (e.key) {
16171
16171
  case "ArrowLeft":
@@ -16192,7 +16192,6 @@ var TrendingChartV2 = function (_a) {
16192
16192
  break;
16193
16193
  case "Tab":
16194
16194
  e.preventDefault();
16195
- // Switch between cursors
16196
16195
  setSelectedCursor(selectedCursor === "cursor1" ? "cursor2" : "cursor1");
16197
16196
  break;
16198
16197
  }
@@ -16209,6 +16208,66 @@ var TrendingChartV2 = function (_a) {
16209
16208
  updateCursor2Time,
16210
16209
  setSelectedCursor,
16211
16210
  ]);
16211
+ // Custom wheel zoom handler to correctly anchor zoom to mouse cursor position
16212
+ // ECharts' built-in zoom has a bug with multiple grids - it always uses the first grid's coordinates
16213
+ useEffect(function () {
16214
+ var _a;
16215
+ var echartsInstance = (_a = chartRef.current) === null || _a === void 0 ? void 0 : _a.getEchartsInstance();
16216
+ if (!echartsInstance || !chartArea)
16217
+ return;
16218
+ var zr = echartsInstance.getZr();
16219
+ if (!zr)
16220
+ return;
16221
+ var handleWheel = function (e) {
16222
+ var _a, _b;
16223
+ var wheelEvent = e.event;
16224
+ var mouseX = e.offsetX;
16225
+ if (mouseX < chartArea.left || mouseX > chartArea.right)
16226
+ return;
16227
+ wheelEvent.preventDefault();
16228
+ wheelEvent.stopPropagation();
16229
+ var option = echartsInstance.getOption();
16230
+ var dataZoomArray = option.dataZoom;
16231
+ if (!dataZoomArray || dataZoomArray.length === 0)
16232
+ return;
16233
+ var currentStart = (_a = dataZoomArray[0].start) !== null && _a !== void 0 ? _a : 0;
16234
+ var currentEnd = (_b = dataZoomArray[0].end) !== null && _b !== void 0 ? _b : 100;
16235
+ var fullRangeStart = timeScopeStart.getTime();
16236
+ var fullRangeEnd = timeScopeEnd.getTime();
16237
+ var fullRange = fullRangeEnd - fullRangeStart;
16238
+ var visibleStart = fullRangeStart + (fullRange * currentStart) / 100;
16239
+ var visibleEnd = fullRangeStart + (fullRange * currentEnd) / 100;
16240
+ var visibleRange = visibleEnd - visibleStart;
16241
+ var chartWidth = chartArea.right - chartArea.left;
16242
+ var mouseProgress = (mouseX - chartArea.left) / chartWidth;
16243
+ var mouseTimestamp = visibleStart + visibleRange * mouseProgress;
16244
+ var zoomFactor = wheelEvent.deltaY > 0 ? 1.2 : 1 / 1.2;
16245
+ var newVisibleRange = visibleRange * zoomFactor;
16246
+ var newVisibleStart = mouseTimestamp - newVisibleRange * mouseProgress;
16247
+ var newVisibleEnd = mouseTimestamp + newVisibleRange * (1 - mouseProgress);
16248
+ var newStart = ((newVisibleStart - fullRangeStart) / fullRange) * 100;
16249
+ var newEnd = ((newVisibleEnd - fullRangeStart) / fullRange) * 100;
16250
+ if (newStart < 0) {
16251
+ newEnd -= newStart;
16252
+ newStart = 0;
16253
+ }
16254
+ if (newEnd > 100) {
16255
+ newStart -= newEnd - 100;
16256
+ newEnd = 100;
16257
+ }
16258
+ newStart = Math.max(0, newStart);
16259
+ newEnd = Math.min(100, newEnd);
16260
+ echartsInstance.dispatchAction({
16261
+ type: "dataZoom",
16262
+ start: newStart,
16263
+ end: newEnd,
16264
+ });
16265
+ };
16266
+ zr.on("mousewheel", handleWheel);
16267
+ return function () {
16268
+ zr.off("mousewheel", handleWheel);
16269
+ };
16270
+ }, [chartArea, timeScopeStart, timeScopeEnd, chartInstance]);
16212
16271
  return (React__default.createElement(Paper, { sx: { height: "100%", p: 1, position: "relative" } },
16213
16272
  isLoading && (React__default.createElement("div", { style: {
16214
16273
  position: "absolute",
@@ -21047,6 +21106,8 @@ var Filters$3 = function (_a) {
21047
21106
  };
21048
21107
 
21049
21108
  var moment$a = getMomentTz();
21109
+ // Default layout matching original Grid md:5 / md:7 ratio (41.67% / 58.33%)
21110
+ var DEFAULT_LAYOUT$3 = { left: 42, right: 58 };
21050
21111
  var Logbook$3 = function () {
21051
21112
  var entry = useLogbookSettings().entry;
21052
21113
  var defaultAreaId = useUserContext().state.defaultAreaId;
@@ -21076,10 +21137,17 @@ var Logbook$3 = function () {
21076
21137
  var _f = useState(null), selectedRowData = _f[0], setSelectedRowData = _f[1];
21077
21138
  var _g = useState(false), showRemoveDialog = _g[0], setShowRemoveDialog = _g[1];
21078
21139
  var _h = useContextMenuMESF(), registerConfig = _h.registerConfig, showContextMenu = _h.showContextMenu;
21079
- var _j = useEntries$1({
21140
+ // Resizable panels layout persistence
21141
+ var _j = useDefaultLayout({
21142
+ id: "logbook-entry-v2",
21143
+ storage: localStorage,
21144
+ }), savedLayout = _j.defaultLayout, onLayoutChange = _j.onLayoutChange;
21145
+ // Use saved layout or default to avoid flash on initial render
21146
+ var resolvedLayout = savedLayout !== null && savedLayout !== void 0 ? savedLayout : DEFAULT_LAYOUT$3;
21147
+ var _k = useEntries$1({
21080
21148
  shiftId: shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId,
21081
21149
  assetId: withAssetFilter ? assetId : undefined,
21082
- }), rows = _j.data, isLoading = _j.isLoading, e = _j.error, isError = _j.isError, refetch = _j.refetch;
21150
+ }), rows = _k.data, isLoading = _k.isLoading, e = _k.error, isError = _k.isError, refetch = _k.refetch;
21083
21151
  var columnDefs = useTableData$3({
21084
21152
  showContextMenu: showContextMenu,
21085
21153
  allowAttachments: allowAttachments,
@@ -21276,21 +21344,29 @@ var Logbook$3 = function () {
21276
21344
  }); })();
21277
21345
  }
21278
21346
  }, []);
21279
- return (React__default.createElement(React__default.Fragment, null,
21280
- React__default.createElement(Grid2, { container: true, size: {
21281
- xs: 12,
21282
- }, spacing: 2, justifyContent: "flex-start" },
21283
- React__default.createElement(Grid2, { size: { md: 12, xs: 12 } },
21284
- React__default.createElement(Typography$1, { variant: "h5", style: {
21285
- fontWeight: 600,
21286
- userSelect: "none",
21287
- } }, "LOGBOOK")),
21288
- React__default.createElement(Grid2, { container: true, size: { xs: 12, md: 5 }, spacing: 1 },
21289
- React__default.createElement(Grid2, { size: { xs: 12 } },
21290
- React__default.createElement(Filters$3, { withAssetFilter: withAssetFilter, filterAssets: filterAssets, quickFilter: quickFilter, onQuickFilterChange: onQuickFilterChange, assetId: assetId, setAssetId: setAssetId })),
21291
- React__default.createElement(Grid2, { size: { xs: 12 } },
21347
+ return (React__default.createElement(Box, { sx: {
21348
+ width: "100%",
21349
+ height: "calc(100vh - 130px)",
21350
+ display: "flex",
21351
+ flexDirection: "column",
21352
+ } },
21353
+ React__default.createElement(Box, { sx: { mb: 2 } },
21354
+ React__default.createElement(Typography$1, { variant: "h5", style: {
21355
+ fontWeight: 600,
21356
+ userSelect: "none",
21357
+ } }, "LOGBOOK")),
21358
+ React__default.createElement(Group$1, { id: "logbook-entry-group", orientation: "horizontal", defaultLayout: resolvedLayout, onLayoutChange: onLayoutChange, style: { flex: 1, width: "100%" } },
21359
+ React__default.createElement(Panel, { id: "left", defaultSize: 42, minSize: 25, style: { paddingBottom: 5 } },
21360
+ React__default.createElement(Box, { sx: {
21361
+ display: "flex",
21362
+ flexDirection: "column",
21363
+ gap: 1,
21364
+ height: "100%",
21365
+ pr: 1,
21366
+ } },
21367
+ React__default.createElement(Filters$3, { withAssetFilter: withAssetFilter, filterAssets: filterAssets, quickFilter: quickFilter, onQuickFilterChange: onQuickFilterChange, assetId: assetId, setAssetId: setAssetId }),
21292
21368
  React__default.createElement(Paper, { elevation: 1, style: {
21293
- height: "62vh",
21369
+ flex: 1,
21294
21370
  width: "100%",
21295
21371
  } },
21296
21372
  React__default.createElement(AgGridReact, { loading: isLoading, rowData: rows, columnDefs: columnDefs, defaultColDef: defaultColDef, rowHeight: 38, headerHeight: 42, loadingOverlayComponent: CenteredLazyLoading, animateRows: true, getContextMenuItems: getContextMenuItems, onRowClicked: rowClicked, onCellKeyDown: onCellKeyDown, onGridReady: function (params) { return (gridApiRef.current = params.api); }, getRowId: function (params) { return "".concat(params.data.EntryId); }, gridOptions: {
@@ -21319,80 +21395,111 @@ var Logbook$3 = function () {
21319
21395
  ],
21320
21396
  },
21321
21397
  } })))),
21322
- React__default.createElement(Grid2, { size: { xs: 12, md: 7 } },
21323
- React__default.createElement(EntryViewer$3, { entry: selectedRowData, show: show, onChangeShow: function () {
21324
- var newShow = show === "view" ? "edit" : "view";
21325
- setShow(newShow);
21326
- if (entryId && entryId !== "new") {
21327
- var targetUrl = newShow === "edit"
21328
- ? "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=edit")
21329
- : "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=view");
21330
- navigate(targetUrl);
21331
- }
21332
- }, preselectedAssetId: assetId, withAssetFilter: withAssetFilter, canEditAsset: canEditAsset, canEditShift: canEditShift, filterAssets: filterAssets, allowAttachments: allowAttachments, shiftsRange: shiftsRange, onHide: function (entryId, shouldStayInEditMode) { return __awaiter(void 0, void 0, void 0, function () {
21333
- var targetUrl;
21334
- var _a;
21335
- return __generator(this, function (_b) {
21336
- switch (_b.label) {
21337
- case 0:
21338
- if (!entryId) return [3 /*break*/, 2];
21339
- // First refetch to ensure we have the latest data
21340
- return [4 /*yield*/, refetch()];
21341
- case 1:
21342
- // First refetch to ensure we have the latest data
21343
- _b.sent();
21344
- targetUrl = shouldStayInEditMode
21345
- ? "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=edit")
21346
- : "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=view");
21347
- navigate(targetUrl);
21348
- setShow(shouldStayInEditMode ? "edit" : "view");
21349
- // Additional delay to allow navigation and state updates to complete
21350
- setTimeout(function () {
21351
- var _a, _b;
21352
- var rowNode = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getRowNode(entryId.toString());
21353
- if (rowNode) {
21354
- (_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.ensureNodeVisible(rowNode);
21355
- rowNode.setSelected(true);
21356
- setSelectedRowData(rowNode.data);
21357
- }
21358
- else {
21359
- // If still not found, try one more refetch
21360
- setTimeout(function () { return __awaiter(void 0, void 0, void 0, function () {
21361
- var retryRowNode;
21362
- var _a, _b, _c;
21363
- return __generator(this, function (_d) {
21364
- switch (_d.label) {
21365
- case 0: return [4 /*yield*/, refetch()];
21366
- case 1:
21367
- _d.sent();
21368
- retryRowNode = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getRowNode(entryId.toString());
21369
- if (retryRowNode) {
21370
- (_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.ensureNodeVisible(retryRowNode);
21371
- retryRowNode.setSelected(true);
21372
- setSelectedRowData(retryRowNode.data);
21373
- }
21374
- else {
21375
- setShow("");
21376
- setSelectedRowData(null);
21377
- (_c = gridApiRef.current) === null || _c === void 0 ? void 0 : _c.deselectAll();
21378
- }
21379
- return [2 /*return*/];
21380
- }
21381
- });
21382
- }); }, 500);
21383
- }
21384
- }, 200);
21385
- return [3 /*break*/, 3];
21386
- case 2:
21387
- setShow("");
21388
- setSelectedRowData(null);
21389
- (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.deselectAll();
21390
- navigate("".concat(routeLogbookEntry$1, "/").concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId)));
21391
- _b.label = 3;
21392
- case 3: return [2 /*return*/];
21398
+ React__default.createElement(Separator, { style: {
21399
+ display: "flex",
21400
+ alignItems: "center",
21401
+ justifyContent: "center",
21402
+ cursor: "col-resize",
21403
+ } },
21404
+ React__default.createElement(Box, { sx: {
21405
+ width: 8,
21406
+ height: 48,
21407
+ borderRadius: 1,
21408
+ backgroundColor: "#e0e0e0",
21409
+ display: "flex",
21410
+ flexDirection: "column",
21411
+ alignItems: "center",
21412
+ justifyContent: "center",
21413
+ gap: "3px",
21414
+ transition: "background-color 0.2s",
21415
+ "&:hover": {
21416
+ backgroundColor: "primary.main",
21417
+ "& .grip-dot": {
21418
+ backgroundColor: "#fff",
21419
+ },
21420
+ },
21421
+ } }, __spreadArray([], Array(5), true).map(function (_, i) { return (React__default.createElement(Box, { key: i, className: "grip-dot", sx: {
21422
+ width: 4,
21423
+ height: 4,
21424
+ borderRadius: "50%",
21425
+ backgroundColor: "#9e9e9e",
21426
+ transition: "background-color 0.2s",
21427
+ } })); }))),
21428
+ React__default.createElement(Panel, { id: "right", defaultSize: 58, minSize: 30, style: { paddingBottom: 5 } },
21429
+ React__default.createElement(Box, { sx: { pl: 1, height: "100%" } },
21430
+ React__default.createElement(EntryViewer$3, { entry: selectedRowData, show: show, onChangeShow: function () {
21431
+ var newShow = show === "view" ? "edit" : "view";
21432
+ setShow(newShow);
21433
+ if (entryId && entryId !== "new") {
21434
+ var targetUrl = newShow === "edit"
21435
+ ? "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=edit")
21436
+ : "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=view");
21437
+ navigate(targetUrl);
21393
21438
  }
21394
- });
21395
- }); } }))),
21439
+ }, preselectedAssetId: assetId, withAssetFilter: withAssetFilter, canEditAsset: canEditAsset, canEditShift: canEditShift, filterAssets: filterAssets, allowAttachments: allowAttachments, shiftsRange: shiftsRange, onHide: function (entryId, shouldStayInEditMode) { return __awaiter(void 0, void 0, void 0, function () {
21440
+ var targetUrl;
21441
+ var _a;
21442
+ return __generator(this, function (_b) {
21443
+ switch (_b.label) {
21444
+ case 0:
21445
+ if (!entryId) return [3 /*break*/, 2];
21446
+ // First refetch to ensure we have the latest data
21447
+ return [4 /*yield*/, refetch()];
21448
+ case 1:
21449
+ // First refetch to ensure we have the latest data
21450
+ _b.sent();
21451
+ targetUrl = shouldStayInEditMode
21452
+ ? "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=edit")
21453
+ : "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=view");
21454
+ navigate(targetUrl);
21455
+ setShow(shouldStayInEditMode ? "edit" : "view");
21456
+ // Additional delay to allow navigation and state updates to complete
21457
+ setTimeout(function () {
21458
+ var _a, _b;
21459
+ var rowNode = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getRowNode(entryId.toString());
21460
+ if (rowNode) {
21461
+ (_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.ensureNodeVisible(rowNode);
21462
+ rowNode.setSelected(true);
21463
+ setSelectedRowData(rowNode.data);
21464
+ }
21465
+ else {
21466
+ // If still not found, try one more refetch
21467
+ setTimeout(function () { return __awaiter(void 0, void 0, void 0, function () {
21468
+ var retryRowNode;
21469
+ var _a, _b, _c;
21470
+ return __generator(this, function (_d) {
21471
+ switch (_d.label) {
21472
+ case 0: return [4 /*yield*/, refetch()];
21473
+ case 1:
21474
+ _d.sent();
21475
+ retryRowNode = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getRowNode(entryId.toString());
21476
+ if (retryRowNode) {
21477
+ (_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.ensureNodeVisible(retryRowNode);
21478
+ retryRowNode.setSelected(true);
21479
+ setSelectedRowData(retryRowNode.data);
21480
+ }
21481
+ else {
21482
+ setShow("");
21483
+ setSelectedRowData(null);
21484
+ (_c = gridApiRef.current) === null || _c === void 0 ? void 0 : _c.deselectAll();
21485
+ }
21486
+ return [2 /*return*/];
21487
+ }
21488
+ });
21489
+ }); }, 500);
21490
+ }
21491
+ }, 200);
21492
+ return [3 /*break*/, 3];
21493
+ case 2:
21494
+ setShow("");
21495
+ setSelectedRowData(null);
21496
+ (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.deselectAll();
21497
+ navigate("".concat(routeLogbookEntry$1, "/").concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId)));
21498
+ _b.label = 3;
21499
+ case 3: return [2 /*return*/];
21500
+ }
21501
+ });
21502
+ }); } })))),
21396
21503
  React__default.createElement(RemoveEntryDialog$1, { entry: selectedRowData, show: showRemoveDialog, onHide: function (shouldUpdate) {
21397
21504
  if (shouldUpdate) {
21398
21505
  refetch();
@@ -21712,6 +21819,8 @@ var Filters$2 = function (_a) {
21712
21819
  };
21713
21820
 
21714
21821
  var moment$7 = getMomentTz();
21822
+ // Default layout matching original Grid md:5 / md:7 ratio (41.67% / 58.33%)
21823
+ var DEFAULT_LAYOUT$2 = { left: 42, right: 58 };
21715
21824
  var Logbook$2 = function () {
21716
21825
  var report = useLogbookSettings().report;
21717
21826
  var defaultAreaId = useUserContext().state.defaultAreaId;
@@ -21778,6 +21887,13 @@ var Logbook$2 = function () {
21778
21887
  showShiftCrew: showShiftCrew,
21779
21888
  }).columnDefs;
21780
21889
  var defaultColDef = useGridDefinitions$1({}).defaultColDef;
21890
+ // Resizable panels layout persistence
21891
+ var _j = useDefaultLayout({
21892
+ id: "logbook-report-v2",
21893
+ storage: localStorage,
21894
+ }), savedLayout = _j.defaultLayout, onLayoutChange = _j.onLayoutChange;
21895
+ // Use saved layout or default to avoid flash on initial render
21896
+ var resolvedLayout = savedLayout !== null && savedLayout !== void 0 ? savedLayout : DEFAULT_LAYOUT$2;
21781
21897
  var onQuickFilterChange = function (text) {
21782
21898
  var _a;
21783
21899
  setQuickFilter(text);
@@ -21898,17 +22014,26 @@ var Logbook$2 = function () {
21898
22014
  }); })();
21899
22015
  }
21900
22016
  }, [shiftPeriod.StartShiftId, shiftPeriod.EndShiftId]);
21901
- return (React__default.createElement(React__default.Fragment, null,
21902
- React__default.createElement(Grid2, { container: true, size: {
21903
- xs: 12,
21904
- }, spacing: 2, justifyContent: "flex-start" },
21905
- React__default.createElement(Grid2, { size: { md: 12, xs: 12 } },
21906
- React__default.createElement(Typography$1, { variant: "h5", style: {
21907
- fontWeight: 600,
21908
- userSelect: "none",
21909
- } }, "LOGBOOK REPORT")),
21910
- React__default.createElement(Grid2, { container: true, size: { xs: 12, md: 5 }, spacing: 1 },
21911
- React__default.createElement(Grid2, { size: { xs: 12 } },
22017
+ return (React__default.createElement(Box, { sx: {
22018
+ width: "100%",
22019
+ height: "calc(100vh - 130px)",
22020
+ display: "flex",
22021
+ flexDirection: "column",
22022
+ } },
22023
+ React__default.createElement(Box, { sx: { mb: 2 } },
22024
+ React__default.createElement(Typography$1, { variant: "h5", style: {
22025
+ fontWeight: 600,
22026
+ userSelect: "none",
22027
+ } }, "LOGBOOK REPORT")),
22028
+ React__default.createElement(Group$1, { id: "logbook-report-group", orientation: "horizontal", defaultLayout: resolvedLayout, onLayoutChange: onLayoutChange, style: { flex: 1, width: "100%" } },
22029
+ React__default.createElement(Panel, { id: "left", defaultSize: 42, minSize: 25, style: { paddingBottom: 5 } },
22030
+ React__default.createElement(Box, { sx: {
22031
+ display: "flex",
22032
+ flexDirection: "column",
22033
+ gap: 1,
22034
+ height: "100%",
22035
+ pr: 1,
22036
+ } },
21912
22037
  React__default.createElement(Filters$2, { withAssetFilter: withAssetFilter, filterAssets: filterAssets, quickFilter: quickFilter, onQuickFilterChange: onQuickFilterChange, assetId: assetId, setAssetId: function (value) { return setAssetId(value); }, shiftPeriod: shiftPeriod, onChangeShiftPeriod: function (value, period) {
21913
22038
  setShiftPeriod(value);
21914
22039
  updateUrl({
@@ -21917,10 +22042,9 @@ var Logbook$2 = function () {
21917
22042
  period: period,
21918
22043
  entryId: searchParams.get("entryId"),
21919
22044
  });
21920
- }, actualPeriod: searchParams.get("period") })),
21921
- React__default.createElement(Grid2, { size: { xs: 12 } },
22045
+ }, actualPeriod: searchParams.get("period") }),
21922
22046
  React__default.createElement(Paper, { elevation: 1, style: {
21923
- height: "62vh",
22047
+ flex: 1,
21924
22048
  width: "100%",
21925
22049
  } },
21926
22050
  React__default.createElement(AgGridReact, { loading: isLoading, rowData: rows, columnDefs: columnDefs, defaultColDef: defaultColDef, rowHeight: 38, headerHeight: 42, loadingOverlayComponent: CenteredLazyLoading, animateRows: true, onRowClicked: rowClicked, onCellKeyDown: onCellKeyDown, onGridReady: function (params) { return (gridApiRef.current = params.api); }, getRowId: function (params) { return "".concat(params.data.EntryId); }, gridOptions: {
@@ -21946,14 +22070,45 @@ var Logbook$2 = function () {
21946
22070
  ],
21947
22071
  },
21948
22072
  } })))),
21949
- React__default.createElement(Grid2, { size: { xs: 12, md: 7 } },
21950
- React__default.createElement(EntryViewer$2, { entry: selectedRowData, show: show, onChangeShow: function () { return setShow(show === "view" ? "edit" : "view"); }, onHide: function () {
21951
- var _a;
21952
- setShow("");
21953
- setSelectedRowData(null);
21954
- (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.deselectAll();
21955
- updateUrl({ entryId: null });
21956
- }, filterAssets: filterAssets, showAsset: showAsset, showAttachments: showAttachments }))),
22073
+ React__default.createElement(Separator, { style: {
22074
+ display: "flex",
22075
+ alignItems: "center",
22076
+ justifyContent: "center",
22077
+ cursor: "col-resize",
22078
+ } },
22079
+ React__default.createElement(Box, { sx: {
22080
+ width: 8,
22081
+ height: 48,
22082
+ borderRadius: 1,
22083
+ backgroundColor: "#e0e0e0",
22084
+ display: "flex",
22085
+ flexDirection: "column",
22086
+ alignItems: "center",
22087
+ justifyContent: "center",
22088
+ gap: "3px",
22089
+ transition: "background-color 0.2s",
22090
+ "&:hover": {
22091
+ backgroundColor: "primary.main",
22092
+ "& .grip-dot": {
22093
+ backgroundColor: "#fff",
22094
+ },
22095
+ },
22096
+ } }, __spreadArray([], Array(5), true).map(function (_, i) { return (React__default.createElement(Box, { key: i, className: "grip-dot", sx: {
22097
+ width: 4,
22098
+ height: 4,
22099
+ borderRadius: "50%",
22100
+ backgroundColor: "#9e9e9e",
22101
+ transition: "background-color 0.2s",
22102
+ } })); }))),
22103
+ React__default.createElement(Panel, { id: "right", defaultSize: 58, minSize: 30, style: { paddingBottom: 5 } },
22104
+ React__default.createElement(Box, { sx: { pl: 1, height: "100%" } },
22105
+ React__default.createElement(EntryViewer$2, { entry: selectedRowData, show: show, onChangeShow: function () { return setShow(show === "view" ? "edit" : "view"); }, onHide: function () {
22106
+ var _a;
22107
+ setShow("");
22108
+ setSelectedRowData(null);
22109
+ (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.deselectAll();
22110
+ updateUrl({ entryId: null });
22111
+ }, filterAssets: filterAssets, showAsset: showAsset, showAttachments: showAttachments })))),
21957
22112
  React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
21958
22113
  };
21959
22114
 
@@ -23670,6 +23825,8 @@ var Filters$1 = function (_a) {
23670
23825
  };
23671
23826
 
23672
23827
  var moment$3 = getMomentTz();
23828
+ // Default layout matching original Grid md:5 / md:7 ratio (41.67% / 58.33%)
23829
+ var DEFAULT_LAYOUT$1 = { left: 42, right: 58 };
23673
23830
  var Logbook$1 = function () {
23674
23831
  var entry = useLogbookSettings().entry;
23675
23832
  var allowAttachments = entry.allowAttachments;
@@ -23698,10 +23855,17 @@ var Logbook$1 = function () {
23698
23855
  var _f = useState(null), selectedRowData = _f[0], setSelectedRowData = _f[1];
23699
23856
  var _g = useState(false), showRemoveDialog = _g[0], setShowRemoveDialog = _g[1];
23700
23857
  var _h = useContextMenuMESF(), registerConfig = _h.registerConfig, showContextMenu = _h.showContextMenu;
23701
- var _j = useEntries({
23858
+ // Resizable panels layout persistence
23859
+ var _j = useDefaultLayout({
23860
+ id: "section-logbook-entry-v2",
23861
+ storage: localStorage,
23862
+ }), savedLayout = _j.defaultLayout, onLayoutChange = _j.onLayoutChange;
23863
+ // Use saved layout or default to avoid flash on initial render
23864
+ var resolvedLayout = savedLayout !== null && savedLayout !== void 0 ? savedLayout : DEFAULT_LAYOUT$1;
23865
+ var _k = useEntries({
23702
23866
  shiftId: shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId,
23703
23867
  sectionIds: filterSections.map(function (s) { return s.SectionId; }),
23704
- }), rows = _j.data, isLoading = _j.isLoading, e = _j.error, isError = _j.isError, refetch = _j.refetch;
23868
+ }), rows = _k.data, isLoading = _k.isLoading, e = _k.error, isError = _k.isError, refetch = _k.refetch;
23705
23869
  var columnDefs = useTableData$1({
23706
23870
  showContextMenu: showContextMenu,
23707
23871
  allowAttachments: allowAttachments,
@@ -23888,21 +24052,29 @@ var Logbook$1 = function () {
23888
24052
  }); })();
23889
24053
  }
23890
24054
  }, []);
23891
- return (React__default.createElement(React__default.Fragment, null,
23892
- React__default.createElement(Grid2, { container: true, size: {
23893
- xs: 12,
23894
- }, spacing: 2, justifyContent: "flex-start" },
23895
- React__default.createElement(Grid2, { size: { md: 12, xs: 12 } },
23896
- React__default.createElement(Typography$1, { variant: "h5", style: {
23897
- fontWeight: 600,
23898
- userSelect: "none",
23899
- } }, "LOGBOOK")),
23900
- React__default.createElement(Grid2, { container: true, size: { xs: 12, md: 5 }, spacing: 1 },
23901
- React__default.createElement(Grid2, { size: { xs: 12 } },
23902
- React__default.createElement(Filters$1, { quickFilter: quickFilter, onQuickFilterChange: onQuickFilterChange, selectedSections: filterSections, onSectionsChange: setFilterSections })),
23903
- React__default.createElement(Grid2, { size: { xs: 12 } },
24055
+ return (React__default.createElement(Box, { sx: {
24056
+ width: "100%",
24057
+ height: "calc(100vh - 130px)",
24058
+ display: "flex",
24059
+ flexDirection: "column",
24060
+ } },
24061
+ React__default.createElement(Box, { sx: { mb: 2 } },
24062
+ React__default.createElement(Typography$1, { variant: "h5", style: {
24063
+ fontWeight: 600,
24064
+ userSelect: "none",
24065
+ } }, "LOGBOOK")),
24066
+ React__default.createElement(Group$1, { id: "section-logbook-entry-group", orientation: "horizontal", defaultLayout: resolvedLayout, onLayoutChange: onLayoutChange, style: { flex: 1, width: "100%" } },
24067
+ React__default.createElement(Panel, { id: "left", defaultSize: 42, minSize: 25, style: { paddingBottom: 5 } },
24068
+ React__default.createElement(Box, { sx: {
24069
+ display: "flex",
24070
+ flexDirection: "column",
24071
+ gap: 1,
24072
+ height: "100%",
24073
+ pr: 1,
24074
+ } },
24075
+ React__default.createElement(Filters$1, { quickFilter: quickFilter, onQuickFilterChange: onQuickFilterChange, selectedSections: filterSections, onSectionsChange: setFilterSections }),
23904
24076
  React__default.createElement(Paper, { elevation: 1, style: {
23905
- height: "62vh",
24077
+ flex: 1,
23906
24078
  width: "100%",
23907
24079
  } },
23908
24080
  React__default.createElement(AgGridReact, { loading: isLoading, rowData: rows, columnDefs: columnDefs, defaultColDef: defaultColDef, rowHeight: 38, headerHeight: 42, loadingOverlayComponent: CenteredLazyLoading, animateRows: true, getContextMenuItems: getContextMenuItems, onRowClicked: rowClicked, onCellKeyDown: onCellKeyDown, onGridReady: function (params) { return (gridApiRef.current = params.api); }, getRowId: function (params) { return "".concat(params.data.EntryId); }, gridOptions: {
@@ -23931,80 +24103,111 @@ var Logbook$1 = function () {
23931
24103
  ],
23932
24104
  },
23933
24105
  } })))),
23934
- React__default.createElement(Grid2, { size: { xs: 12, md: 7 } },
23935
- React__default.createElement(EntryViewer$1, { entry: selectedRowData, show: show, onChangeShow: function () {
23936
- var newShow = show === "view" ? "edit" : "view";
23937
- setShow(newShow);
23938
- if (entryId && entryId !== "new") {
23939
- var targetUrl = newShow === "edit"
23940
- ? "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=edit")
23941
- : "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=view");
23942
- navigate(targetUrl);
23943
- }
23944
- }, canEditShift: canEditShift, allowAttachments: allowAttachments, shiftsRange: shiftsRange, withAssetFilter: withAssetFilter, canEditAsset: canEditAsset, filterAssets: filterAssets, onHide: function (entryId, shouldStayInEditMode) { return __awaiter(void 0, void 0, void 0, function () {
23945
- var targetUrl;
23946
- var _a;
23947
- return __generator(this, function (_b) {
23948
- switch (_b.label) {
23949
- case 0:
23950
- if (!entryId) return [3 /*break*/, 2];
23951
- // First refetch to ensure we have the latest data
23952
- return [4 /*yield*/, refetch()];
23953
- case 1:
23954
- // First refetch to ensure we have the latest data
23955
- _b.sent();
23956
- targetUrl = shouldStayInEditMode
23957
- ? "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=edit")
23958
- : "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=view");
23959
- navigate(targetUrl);
23960
- setShow(shouldStayInEditMode ? "edit" : "view");
23961
- // Additional delay to allow navigation and state updates to complete
23962
- setTimeout(function () {
23963
- var _a, _b;
23964
- var rowNode = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getRowNode(entryId.toString());
23965
- if (rowNode) {
23966
- (_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.ensureNodeVisible(rowNode);
23967
- rowNode.setSelected(true);
23968
- setSelectedRowData(rowNode.data);
23969
- }
23970
- else {
23971
- // If still not found, try one more refetch
23972
- setTimeout(function () { return __awaiter(void 0, void 0, void 0, function () {
23973
- var retryRowNode;
23974
- var _a, _b, _c;
23975
- return __generator(this, function (_d) {
23976
- switch (_d.label) {
23977
- case 0: return [4 /*yield*/, refetch()];
23978
- case 1:
23979
- _d.sent();
23980
- retryRowNode = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getRowNode(entryId.toString());
23981
- if (retryRowNode) {
23982
- (_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.ensureNodeVisible(retryRowNode);
23983
- retryRowNode.setSelected(true);
23984
- setSelectedRowData(retryRowNode.data);
23985
- }
23986
- else {
23987
- setShow("");
23988
- setSelectedRowData(null);
23989
- (_c = gridApiRef.current) === null || _c === void 0 ? void 0 : _c.deselectAll();
23990
- }
23991
- return [2 /*return*/];
23992
- }
23993
- });
23994
- }); }, 500);
23995
- }
23996
- }, 200);
23997
- return [3 /*break*/, 3];
23998
- case 2:
23999
- setShow("");
24000
- setSelectedRowData(null);
24001
- (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.deselectAll();
24002
- navigate("".concat(routeLogbookEntry, "/").concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId)));
24003
- _b.label = 3;
24004
- case 3: return [2 /*return*/];
24106
+ React__default.createElement(Separator, { style: {
24107
+ display: "flex",
24108
+ alignItems: "center",
24109
+ justifyContent: "center",
24110
+ cursor: "col-resize",
24111
+ } },
24112
+ React__default.createElement(Box, { sx: {
24113
+ width: 8,
24114
+ height: 48,
24115
+ borderRadius: 1,
24116
+ backgroundColor: "#e0e0e0",
24117
+ display: "flex",
24118
+ flexDirection: "column",
24119
+ alignItems: "center",
24120
+ justifyContent: "center",
24121
+ gap: "3px",
24122
+ transition: "background-color 0.2s",
24123
+ "&:hover": {
24124
+ backgroundColor: "primary.main",
24125
+ "& .grip-dot": {
24126
+ backgroundColor: "#fff",
24127
+ },
24128
+ },
24129
+ } }, __spreadArray([], Array(5), true).map(function (_, i) { return (React__default.createElement(Box, { key: i, className: "grip-dot", sx: {
24130
+ width: 4,
24131
+ height: 4,
24132
+ borderRadius: "50%",
24133
+ backgroundColor: "#9e9e9e",
24134
+ transition: "background-color 0.2s",
24135
+ } })); }))),
24136
+ React__default.createElement(Panel, { id: "right", defaultSize: 58, minSize: 30, style: { paddingBottom: 5 } },
24137
+ React__default.createElement(Box, { sx: { pl: 1, height: "100%" } },
24138
+ React__default.createElement(EntryViewer$1, { entry: selectedRowData, show: show, onChangeShow: function () {
24139
+ var newShow = show === "view" ? "edit" : "view";
24140
+ setShow(newShow);
24141
+ if (entryId && entryId !== "new") {
24142
+ var targetUrl = newShow === "edit"
24143
+ ? "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=edit")
24144
+ : "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=view");
24145
+ navigate(targetUrl);
24005
24146
  }
24006
- });
24007
- }); } }))),
24147
+ }, canEditShift: canEditShift, allowAttachments: allowAttachments, shiftsRange: shiftsRange, withAssetFilter: withAssetFilter, canEditAsset: canEditAsset, filterAssets: filterAssets, onHide: function (entryId, shouldStayInEditMode) { return __awaiter(void 0, void 0, void 0, function () {
24148
+ var targetUrl;
24149
+ var _a;
24150
+ return __generator(this, function (_b) {
24151
+ switch (_b.label) {
24152
+ case 0:
24153
+ if (!entryId) return [3 /*break*/, 2];
24154
+ // First refetch to ensure we have the latest data
24155
+ return [4 /*yield*/, refetch()];
24156
+ case 1:
24157
+ // First refetch to ensure we have the latest data
24158
+ _b.sent();
24159
+ targetUrl = shouldStayInEditMode
24160
+ ? "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=edit")
24161
+ : "/logbook/entry/".concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId), "?entryId=").concat(entryId, "&action=view");
24162
+ navigate(targetUrl);
24163
+ setShow(shouldStayInEditMode ? "edit" : "view");
24164
+ // Additional delay to allow navigation and state updates to complete
24165
+ setTimeout(function () {
24166
+ var _a, _b;
24167
+ var rowNode = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getRowNode(entryId.toString());
24168
+ if (rowNode) {
24169
+ (_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.ensureNodeVisible(rowNode);
24170
+ rowNode.setSelected(true);
24171
+ setSelectedRowData(rowNode.data);
24172
+ }
24173
+ else {
24174
+ // If still not found, try one more refetch
24175
+ setTimeout(function () { return __awaiter(void 0, void 0, void 0, function () {
24176
+ var retryRowNode;
24177
+ var _a, _b, _c;
24178
+ return __generator(this, function (_d) {
24179
+ switch (_d.label) {
24180
+ case 0: return [4 /*yield*/, refetch()];
24181
+ case 1:
24182
+ _d.sent();
24183
+ retryRowNode = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getRowNode(entryId.toString());
24184
+ if (retryRowNode) {
24185
+ (_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.ensureNodeVisible(retryRowNode);
24186
+ retryRowNode.setSelected(true);
24187
+ setSelectedRowData(retryRowNode.data);
24188
+ }
24189
+ else {
24190
+ setShow("");
24191
+ setSelectedRowData(null);
24192
+ (_c = gridApiRef.current) === null || _c === void 0 ? void 0 : _c.deselectAll();
24193
+ }
24194
+ return [2 /*return*/];
24195
+ }
24196
+ });
24197
+ }); }, 500);
24198
+ }
24199
+ }, 200);
24200
+ return [3 /*break*/, 3];
24201
+ case 2:
24202
+ setShow("");
24203
+ setSelectedRowData(null);
24204
+ (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.deselectAll();
24205
+ navigate("".concat(routeLogbookEntry, "/").concat(shiftId || (shiftInfo === null || shiftInfo === void 0 ? void 0 : shiftInfo.CurrentShiftId)));
24206
+ _b.label = 3;
24207
+ case 3: return [2 /*return*/];
24208
+ }
24209
+ });
24210
+ }); } })))),
24008
24211
  React__default.createElement(RemoveEntryDialog, { entry: selectedRowData, show: showRemoveDialog, onHide: function (shouldUpdate) {
24009
24212
  if (shouldUpdate) {
24010
24213
  refetch();
@@ -24300,6 +24503,8 @@ var Filters = function (_a) {
24300
24503
  };
24301
24504
 
24302
24505
  var moment = getMomentTz();
24506
+ // Default layout matching original Grid md:5 / md:7 ratio (41.67% / 58.33%)
24507
+ var DEFAULT_LAYOUT = { left: 42, right: 58 };
24303
24508
  var Logbook = function () {
24304
24509
  var report = useLogbookSettings().report;
24305
24510
  var showAttachments = report.showAttachments;
@@ -24364,6 +24569,13 @@ var Logbook = function () {
24364
24569
  showShiftCrew: showShiftCrew,
24365
24570
  }).columnDefs;
24366
24571
  var defaultColDef = useGridDefinitions({}).defaultColDef;
24572
+ // Resizable panels layout persistence
24573
+ var _j = useDefaultLayout({
24574
+ id: "section-logbook-report-v2",
24575
+ storage: localStorage,
24576
+ }), savedLayout = _j.defaultLayout, onLayoutChange = _j.onLayoutChange;
24577
+ // Use saved layout or default to avoid flash on initial render
24578
+ var resolvedLayout = savedLayout !== null && savedLayout !== void 0 ? savedLayout : DEFAULT_LAYOUT;
24367
24579
  var onQuickFilterChange = function (text) {
24368
24580
  var _a;
24369
24581
  setQuickFilter(text);
@@ -24477,17 +24689,26 @@ var Logbook = function () {
24477
24689
  }); })();
24478
24690
  }
24479
24691
  }, [shiftPeriod.StartShiftId, shiftPeriod.EndShiftId]);
24480
- return (React__default.createElement(React__default.Fragment, null,
24481
- React__default.createElement(Grid2, { container: true, size: {
24482
- xs: 12,
24483
- }, spacing: 2, justifyContent: "flex-start" },
24484
- React__default.createElement(Grid2, { size: { md: 12, xs: 12 } },
24485
- React__default.createElement(Typography$1, { variant: "h5", style: {
24486
- fontWeight: 600,
24487
- userSelect: "none",
24488
- } }, "LOGBOOK REPORT")),
24489
- React__default.createElement(Grid2, { container: true, size: { xs: 12, md: 5 }, spacing: 1 },
24490
- React__default.createElement(Grid2, { size: { xs: 12 } },
24692
+ return (React__default.createElement(Box, { sx: {
24693
+ width: "100%",
24694
+ height: "calc(100vh - 130px)",
24695
+ display: "flex",
24696
+ flexDirection: "column",
24697
+ } },
24698
+ React__default.createElement(Box, { sx: { mb: 2 } },
24699
+ React__default.createElement(Typography$1, { variant: "h5", style: {
24700
+ fontWeight: 600,
24701
+ userSelect: "none",
24702
+ } }, "LOGBOOK REPORT")),
24703
+ React__default.createElement(Group$1, { id: "section-logbook-report-group", orientation: "horizontal", defaultLayout: resolvedLayout, onLayoutChange: onLayoutChange, style: { flex: 1, width: "100%" } },
24704
+ React__default.createElement(Panel, { id: "left", defaultSize: 42, minSize: 25, style: { paddingBottom: 5 } },
24705
+ React__default.createElement(Box, { sx: {
24706
+ display: "flex",
24707
+ flexDirection: "column",
24708
+ gap: 1,
24709
+ height: "100%",
24710
+ pr: 1,
24711
+ } },
24491
24712
  React__default.createElement(Filters, { quickFilter: quickFilter, onQuickFilterChange: onQuickFilterChange, shiftPeriod: shiftPeriod, onChangeShiftPeriod: function (value, period) {
24492
24713
  setShiftPeriod(value);
24493
24714
  updateUrl({
@@ -24496,10 +24717,9 @@ var Logbook = function () {
24496
24717
  period: period,
24497
24718
  entryId: searchParams.get("entryId"),
24498
24719
  });
24499
- }, actualPeriod: searchParams.get("period"), selectedSections: filterSections, onSectionsChange: setFilterSections })),
24500
- React__default.createElement(Grid2, { size: { xs: 12 } },
24720
+ }, actualPeriod: searchParams.get("period"), selectedSections: filterSections, onSectionsChange: setFilterSections }),
24501
24721
  React__default.createElement(Paper, { elevation: 1, style: {
24502
- height: "62vh",
24722
+ flex: 1,
24503
24723
  width: "100%",
24504
24724
  } },
24505
24725
  React__default.createElement(AgGridReact, { loading: isLoading, rowData: rows, columnDefs: columnDefs, defaultColDef: defaultColDef, rowHeight: 38, headerHeight: 42, loadingOverlayComponent: CenteredLazyLoading, animateRows: true, onRowClicked: rowClicked, onCellKeyDown: onCellKeyDown, onGridReady: function (params) { return (gridApiRef.current = params.api); }, getRowId: function (params) { return "".concat(params.data.EntryId); }, gridOptions: {
@@ -24525,14 +24745,45 @@ var Logbook = function () {
24525
24745
  ],
24526
24746
  },
24527
24747
  } })))),
24528
- React__default.createElement(Grid2, { size: { xs: 12, md: 7 } },
24529
- React__default.createElement(EntryViewer, { entry: selectedRowData, show: show, onChangeShow: function () { return setShow(show === "view" ? "edit" : "view"); }, onHide: function () {
24530
- var _a;
24531
- setShow("");
24532
- setSelectedRowData(null);
24533
- (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.deselectAll();
24534
- updateUrl({ entryId: null });
24535
- }, showAsset: showAsset, showAttachments: showAttachments, showSection: true }))),
24748
+ React__default.createElement(Separator, { style: {
24749
+ display: "flex",
24750
+ alignItems: "center",
24751
+ justifyContent: "center",
24752
+ cursor: "col-resize",
24753
+ } },
24754
+ React__default.createElement(Box, { sx: {
24755
+ width: 8,
24756
+ height: 48,
24757
+ borderRadius: 1,
24758
+ backgroundColor: "#e0e0e0",
24759
+ display: "flex",
24760
+ flexDirection: "column",
24761
+ alignItems: "center",
24762
+ justifyContent: "center",
24763
+ gap: "3px",
24764
+ transition: "background-color 0.2s",
24765
+ "&:hover": {
24766
+ backgroundColor: "primary.main",
24767
+ "& .grip-dot": {
24768
+ backgroundColor: "#fff",
24769
+ },
24770
+ },
24771
+ } }, __spreadArray([], Array(5), true).map(function (_, i) { return (React__default.createElement(Box, { key: i, className: "grip-dot", sx: {
24772
+ width: 4,
24773
+ height: 4,
24774
+ borderRadius: "50%",
24775
+ backgroundColor: "#9e9e9e",
24776
+ transition: "background-color 0.2s",
24777
+ } })); }))),
24778
+ React__default.createElement(Panel, { id: "right", defaultSize: 58, minSize: 30, style: { paddingBottom: 5 } },
24779
+ React__default.createElement(Box, { sx: { pl: 1, height: "100%" } },
24780
+ React__default.createElement(EntryViewer, { entry: selectedRowData, show: show, onChangeShow: function () { return setShow(show === "view" ? "edit" : "view"); }, onHide: function () {
24781
+ var _a;
24782
+ setShow("");
24783
+ setSelectedRowData(null);
24784
+ (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.deselectAll();
24785
+ updateUrl({ entryId: null });
24786
+ }, showAsset: showAsset, showAttachments: showAttachments, showSection: true })))),
24536
24787
  React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
24537
24788
  };
24538
24789