diff --git a/src/App.js b/src/App.js
index 9e129a0..b6d397e 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,12 +1,12 @@
import React, {useState} from 'react';
-import { SearchState, SortingState, IntegratedSorting, TreeDataState, CustomTreeData, FilteringState, IntegratedFiltering, TableColumnVisibility } from '@devexpress/dx-react-grid';
-import { Grid, Table, TableHeaderRow, TableTreeColumn, TableFilterRow, SearchPanel, Toolbar, ColumnChooser } from '@devexpress/dx-react-grid-bootstrap4';
+import { SearchState, SortingState, IntegratedSorting, TreeDataState, CustomTreeData, FilteringState, IntegratedFiltering, TableColumnVisibility} from '@devexpress/dx-react-grid';
+import { Grid, Table, TableHeaderRow, TableTreeColumn, TableFilterRow, SearchPanel, Toolbar, ColumnChooser, TableColumnResizing, DragDropProvider, TableColumnReordering } from '@devexpress/dx-react-grid-bootstrap4';
import Convert from 'ansi-to-html';
import stripAnsi from 'strip-ansi';
import ReactJson from 'react-json-view';
import './App.css';
import Logs from './Logs.js';
-import {Button, Card, Collapse} from 'react-bootstrap';
+import {Button, Card, Collapse, Navbar, Nav, Container} from 'react-bootstrap';
import ReactBootstrapSlider from 'react-bootstrap-slider';
import all_data from './log.json'
@@ -20,8 +20,35 @@ let session_object = Object.values(all_data).find((x) => x.session === x.id)
let data = [session_object];
-function Section({title, children}) {
- const [open, setOpen] = useState(false);
+const ImportFromFileBodyComponent = () => {
+ let fileReader;
+
+ const handleFileRead = (e) => {
+ const content = fileReader.result;
+ console.log(content);
+ // … do something with the 'content' …
+ };
+
+ const handleFileChosen = (file) => {
+ if (!file) return;
+ fileReader = new FileReader();
+ fileReader.onloadend = handleFileRead;
+ fileReader.readAsText(file);
+ };
+
+ return
+ handleFileChosen(e.target.files[0])}
+ />
+
;
+};
+
+
+function Section({title, children, defaultOpen}) {
+ const [open, setOpen] = useState(defaultOpen);
return (
<>
@@ -54,6 +81,7 @@ class App extends React.PureComponent {
{ name: 'session', title: 'Session' },
{ name: 'parent_id', title: 'Parent' },
{ name: 'id', title: 'Id' },
+ { name: 'step', title: 'Step' },
{ name: 'name', title: 'Name' },
{ name: 'type', title: 'Type' },
{ name: 'timestamp', title: 'Timestamp' },
@@ -65,8 +93,23 @@ class App extends React.PureComponent {
tableColumnExtensions: [{ columnName: 'name', width: 300 }],
// defaultExpandedRowIds: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27]
defaultExpandedRowIds: [],
- defaultHiddenColumnNames: ['session', 'parent_id', 'id', 'error']
+ defaultHiddenColumnNames: ['session', 'parent_id', 'id', 'error'],
// defaultHiddenColumnNames: []
+ defaultColumnWidths: [
+ // { columnName: 'step', width: 10 },
+
+ { columnName: 'session', width: 200 },
+ { columnName: 'parent_id', width: 200 },
+ { columnName: 'id', width: 200 },
+ { columnName: 'step', width: 150 },
+ { columnName: 'name', width: 400 },
+ { columnName: 'type', width: 200 },
+ { columnName: 'timestamp', width: 200 },
+ // { name: 'error', width: 200 },
+ // { name: 'inputs', width: 200 },
+ { columnName: 'msg', width: 200 },
+ ],
+ defaultOrder: ['session', 'parent_id', 'id', 'step', 'name', 'type', 'timestamp', 'msg']
};
this.previousLog = () => {
@@ -76,6 +119,7 @@ class App extends React.PureComponent {
let newItem = all_data_ordered[this.state.current_index - 1]
data.pop();
nextLogs.pop()
+ newItem.step = this.state.current_index - 1
this.setState({
rows: nextRows,
current_index: (this.state.current_index - 1),
@@ -95,6 +139,7 @@ class App extends React.PureComponent {
nextLogs.push("") // easier to slice it after...
}
newItem.name = stripAnsi(newItem.name)
+ newItem.step = this.state.current_index + 1
data.push(newItem)
this.setState({
rows: nextRows,
@@ -117,6 +162,7 @@ class App extends React.PureComponent {
if (value < this.state.current_index) {
let diff = this.state.current_index - value;
for (let i=0; i this.state.current_index) {
let diff = value - this.state.current_index;
for (let i=0; i
- step: {this.state.current_index} id: {this.state.current_id}
-
-
-
-
+
+ {/* */}
+ StructLog
+
+ < inline>
+
+
+
+
+
+
+
-
+
{this.state.logs.map((item, i) => {
return (
@@ -151,7 +207,7 @@ class App extends React.PureComponent {
})}
-
+
@@ -160,11 +216,14 @@ class App extends React.PureComponent {
+
+
+
@@ -172,6 +231,7 @@ class App extends React.PureComponent {
+
);
}