Skip to content

Commit 3cdeffe

Browse files
vish9812vish9812
committed
add context
1 parent ec6ead5 commit 3cdeffe

File tree

7 files changed

+252
-54
lines changed

7 files changed

+252
-54
lines changed

‎src/analyzer/gridService.ts‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import type { ICellRendererParams, ColDef } from "ag-grid-community";
22
import JSONCellRenderer from "../components/jsonCellRenderer";
3+
import FullDataCellRenderer from "../components/fullDataCellRenderer";
34
import Processor from "../models/processor";
45

56
const defaultColDef: ColDef = {
@@ -10,17 +11,21 @@ const defaultColDef: ColDef = {
1011

1112
function defaultCols(): ColDef[] {
1213
return [
14+
{
15+
field: Processor.logKeys.id,
16+
width: 100,
17+
sortable: true,
18+
sort: "asc",
19+
sortingOrder: ["asc", "desc"],
20+
},
1321
{
1422
field: Processor.logKeys.fullData,
15-
cellRenderer: JSONCellRenderer,
23+
cellRenderer: FullDataCellRenderer,
1624
flex: 2,
1725
},
1826
{
19-
field: "timestamp",
27+
field: Processor.logKeys.timestamp,
2028
width: 270,
21-
sortable: true,
22-
sort: "asc",
23-
sortingOrder: ["asc", "desc"],
2429
},
2530
];
2631
}
@@ -34,7 +39,7 @@ function getCol(field: string): ColDef {
3439
return {
3540
field: field,
3641
flex: 0.75,
37-
cellRenderer: (params: ICellRendererParams<any, any, any>) => {
42+
cellRenderer: (params: ICellRendererParams) => {
3843
const val =
3944
typeof params.value === "object"
4045
? JSONCellRenderer(params)

‎src/analyzer/index.tsx‎

Lines changed: 19 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import Filters from "../components/filters";
55
import gridService from "./gridService";
66
import comparer from "../models/comparer";
77
import { Select, createOptions } from "@thisbeyond/solid-select";
8-
import type { RowStyle, RowClassParams } from "ag-grid-community";
8+
import type { GridOptions } from "ag-grid-community";
99
import Processor, { type JSONLog } from "../models/processor";
1010

1111
function Analyzer() {
@@ -21,13 +21,24 @@ function Analyzer() {
2121
setInitialCols,
2222
timeJumps,
2323
handleTimeJump,
24+
handleContextClick,
2425
} = useViewModel();
2526

26-
function getRowStyle(params: RowClassParams<JSONLog>): RowStyle | undefined {
27-
return params.data && Processor.isErrorLog(params.data)
28-
? { background: "#FFBFBF" }
29-
: undefined;
30-
}
27+
const gridOptions = (): GridOptions<JSONLog> => ({
28+
enableCellTextSelection: true,
29+
suppressMaintainUnsortedOrder: true,
30+
defaultColDef: gridService.defaultColDef,
31+
context: {
32+
handleContextClick,
33+
},
34+
rowData: rows(),
35+
columnDefs: cols(),
36+
getRowId: (params) => params.data.id,
37+
getRowStyle: (params) =>
38+
params.data && Processor.isErrorLog(params.data)
39+
? { background: "#FFBFBF" }
40+
: undefined,
41+
});
3142

3243
return (
3344
<Grid container spacing={2}>
@@ -93,16 +104,8 @@ function Analyzer() {
93104
</Grid>
94105
</Grid>
95106
<Grid item xs={12}>
96-
<div style={{ height: "750px" }} class="ag-theme-alpine">
97-
<AgGridSolid
98-
ref={gridRef}
99-
defaultColDef={gridService.defaultColDef}
100-
rowData={rows()}
101-
columnDefs={cols()}
102-
getRowId={(params) => params.data.id}
103-
getRowStyle={getRowStyle}
104-
enableCellTextSelection={true}
105-
/>
107+
<div style={{ height: "900px" }} class="ag-theme-alpine">
108+
<AgGridSolid ref={gridRef} {...gridOptions()} />
106109
</div>
107110
</Grid>
108111
</Grid>

‎src/analyzer/useViewModel.test.tsx‎

Lines changed: 103 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -320,4 +320,107 @@ describe("useViewModel", () => {
320320
});
321321
});
322322
});
323+
324+
test("handleContextClick", () => {
325+
createRoot((dispose) => {
326+
comparer.last().logs = [
327+
{
328+
[Processor.logKeys.id]: "0",
329+
[Processor.logKeys.fullData]: "msg a",
330+
},
331+
{
332+
[Processor.logKeys.id]: "1",
333+
[Processor.logKeys.fullData]: "test b",
334+
},
335+
{
336+
[Processor.logKeys.id]: "2",
337+
[Processor.logKeys.fullData]: "msg c",
338+
},
339+
{
340+
[Processor.logKeys.id]: "3",
341+
[Processor.logKeys.fullData]: "test d",
342+
},
343+
{
344+
[Processor.logKeys.id]: "4",
345+
[Processor.logKeys.fullData]: "msg e",
346+
},
347+
{
348+
[Processor.logKeys.id]: "5",
349+
[Processor.logKeys.fullData]: "test f",
350+
},
351+
{
352+
[Processor.logKeys.id]: "6",
353+
[Processor.logKeys.fullData]: "msg g",
354+
},
355+
{
356+
[Processor.logKeys.id]: "7",
357+
[Processor.logKeys.fullData]: "test h",
358+
},
359+
{
360+
[Processor.logKeys.id]: "8",
361+
[Processor.logKeys.fullData]: "msg i",
362+
},
363+
];
364+
365+
const vm = useViewModel();
366+
const filtersData: FiltersData = {
367+
regex: "test",
368+
logs: [],
369+
} as any;
370+
vm.handleFiltersChange(filtersData);
371+
expect(vm.rows(), "rows: test filtered").toEqual([
372+
comparer.last().logs[1],
373+
comparer.last().logs[3],
374+
comparer.last().logs[5],
375+
comparer.last().logs[7],
376+
]);
377+
378+
const gridApi = {
379+
getRowNode: (i: number): boolean =>
380+
vm.rows().includes(comparer.last().logs[i]),
381+
};
382+
383+
vm.handleContextClick(gridApi as any, 1);
384+
385+
expect(vm.rows(), "rows: logID 1").toEqual([
386+
comparer.last().logs[1],
387+
comparer.last().logs[3],
388+
comparer.last().logs[5],
389+
comparer.last().logs[7],
390+
comparer.last().logs[0],
391+
comparer.last().logs[2],
392+
comparer.last().logs[4],
393+
comparer.last().logs[6],
394+
]);
395+
396+
vm.handleContextClick(gridApi as any, 1);
397+
398+
expect(vm.rows(), "rows: logID 1 again: no change").toEqual([
399+
comparer.last().logs[1],
400+
comparer.last().logs[3],
401+
comparer.last().logs[5],
402+
comparer.last().logs[7],
403+
comparer.last().logs[0],
404+
comparer.last().logs[2],
405+
comparer.last().logs[4],
406+
comparer.last().logs[6],
407+
]);
408+
409+
vm.handleContextClick(gridApi as any, 7);
410+
411+
expect(vm.rows(), "rows: logID 7").toEqual([
412+
comparer.last().logs[1],
413+
comparer.last().logs[3],
414+
comparer.last().logs[5],
415+
comparer.last().logs[7],
416+
comparer.last().logs[0],
417+
comparer.last().logs[2],
418+
comparer.last().logs[4],
419+
comparer.last().logs[6],
420+
comparer.last().logs[8],
421+
]);
422+
423+
dispose();
424+
});
425+
});
323426
});

‎src/analyzer/useViewModel.tsx‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import filesUtils from "../utils/files";
1010
import gridService from "./gridService";
1111
import timesUtils from "../utils/times";
1212
import { AgGridSolidRef } from "ag-grid-solid";
13+
import type { GridApi } from "ag-grid-community";
1314

1415
let zeroJump: string;
1516
let prevJumps: string[] = [];
@@ -139,6 +140,22 @@ function useViewModel() {
139140
}));
140141
}
141142

143+
function handleContextClick(gridApi: GridApi, logID: number) {
144+
const contextLogs: JSONLogs = [];
145+
const limit = 5;
146+
const currIdx = logID;
147+
const firstIdx = Math.max(currIdx - limit, 0);
148+
const lastIdx = Math.min(currIdx + limit, comparer.last().logs.length - 1);
149+
150+
for (let i = firstIdx; i <= lastIdx; i++) {
151+
if (!gridApi.getRowNode(i.toString())) {
152+
contextLogs.push(comparer.last().logs[i]);
153+
}
154+
}
155+
156+
setRows((pre) => [...pre, ...contextLogs]);
157+
}
158+
142159
return {
143160
handleFiltersChange,
144161
handleColsChange,
@@ -149,6 +166,7 @@ function useViewModel() {
149166
setInitialCols,
150167
timeJumps,
151168
handleTimeJump,
169+
handleContextClick,
152170
};
153171
}
154172

‎src/components/fullDataCellRenderer/index.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import type { ICellRendererParams } from "ag-grid-community";
2+
import JSONCellRenderer from "../jsonCellRenderer";
3+
import { Button } from "@suid/material";
4+
5+
function FullDataCellRenderer(props: ICellRendererParams) {
6+
return (
7+
<>
8+
{JSONCellRenderer(props)}
9+
<Button
10+
onClick={() =>
11+
props.context.handleContextClick(props.api, props.data.id)
12+
}
13+
>
14+
Context
15+
</Button>
16+
</>
17+
);
18+
}
19+
20+
export default FullDataCellRenderer;

0 commit comments

Comments
 (0)