status-im
/
structlog-ui
mirror of https://github.com/status-im/structlog-ui.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

cleanup

This commit is contained in:
Iuri Matias 2019-11-02 09:58:30 -04:00
parent aa7a4a2197
commit 63d7df9893
1 changed files with 11 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
src/App.js
View File

@ -1,24 +1,9 @@
import React, { useState } from 'react';
import {
SearchState,
// IntegratedFiltering,
} from '@devexpress/dx-react-grid';
import {
SortingState,
IntegratedSorting,
} from '@devexpress/dx-react-grid'
import { TreeDataState, CustomTreeData, } from '@devexpress/dx-react-grid';
import { FilteringState, IntegratedFiltering } from '@devexpress/dx-react-grid';
import { RowDetailState } from '@devexpress/dx-react-grid';
import { Grid, Table, TableHeaderRow, TableRowDetail, TableTreeColumn, TableFilterRow, SearchPanel, Toolbar} from '@devexpress/dx-react-grid-bootstrap4';
// import logo from './logo.svg';
import React from 'react';
import { SearchState, SortingState, IntegratedSorting, TreeDataState, CustomTreeData, FilteringState, IntegratedFiltering } from '@devexpress/dx-react-grid';
import { Grid, Table, TableHeaderRow, TableTreeColumn, TableFilterRow, SearchPanel, Toolbar } from '@devexpress/dx-react-grid-bootstrap4';
import './App.css';
import all_data from './log.json'
import { objectMethod } from '@babel/types';
console.dir(all_data)
window.all_data = all_data;
let all_data_ordered = Object.values(all_data).sort((x) => x.timestamp)
let current_index = 0;
@ -28,30 +13,6 @@ let session_object = Object.values(all_data).find((x) => x.session === x.id)
let data = [session_object];
const RowDetail = ({ row }) => (
<div>
Inputs:
<br />
{JSON.stringify(row.inputs)}
<br />
Outputs:
<br />
{JSON.stringify(row.outputs)}
<br />
Error:
<br />
{JSON.stringify(row.error)}
<br />
{JSON.stringify(row.message)}
</div>
);
function expandRow(payload) {
console.dir(payload);
return true;
}
//function App() {
class App extends React.PureComponent {
constructor(props) {
@ -69,7 +30,6 @@ class App extends React.PureComponent {
// { name: 'inputs', title: 'Inputs' },
{ name: 'msg', title: 'Error' },
],
// rows: Object.values(data),
rows: [session_object],
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]
@ -79,7 +39,6 @@ class App extends React.PureComponent {
this.previousLog = () => {
if (current_index === 0) return;
const nextRows = this.state.rows.slice();
console.dir(nextRows)
data.pop();
current_index -= 1
this.setState({
@ -98,91 +57,31 @@ class App extends React.PureComponent {
};
this.getChildRows = (row, rootRows) => {
console.dir("--> request");
console.dir("row");
console.dir(JSON.stringify(row));
console.dir("rootRows");
console.dir(JSON.stringify(rootRows));
// prevents invalid records from crashing app
if (row && !row.id) {
return [];
}
let children
if (row) {
children = data.filter((x) => { return x.parent_id === row.id })
// children = Object.values(data).filter((x) => { return x.parent_id === row.id })
// children = []
console.dir("children Num")
console.dir(children.length)
}
return (row ? children : rootRows)
if (row && !row.id) return []; // prevents invalid records from crashing app
return (row ? data.filter((x) => { return x.parent_id === row.id }) : rootRows)
}
}
render() {
// const [columns] = useState([
// // { name: 'session', title: 'Session' },
// // { name: 'parent_id', title: 'Parent' },
// { name: 'id', title: 'Id' },
// { name: 'type', title: 'Type' },
// { name: 'name', title: 'Name' },
// { name: 'timestamp', title: 'Timestamp' },
// { name: 'error', title: 'Error' },
// ]);
// const [data] = useState(generateRows({
// columnValues: {
// id: ({ index }) => index,
// parentId: ({ index, random }) => (index > 0 ? Math.trunc((random() * index) / 2) : null),
// // ...defaultColumnValues,
// },
// length: 20,
// }));
// const getChildRows = (row, rootRows) => (row ? row.items : rootRows)
// const getChildRows = (row, rootRows) => (row ? [] : rootRows)
// const getChildRows = (row, rootRows) => { console.dir("--> request"); console.dir(row); return (row ? Object.values(data).filter((x) => { return x.parent_id === row.id }) : rootRows) }
// const getChildRows = (row, rootRows) => ([]);
return (
<div className="App">
<div className="card">
<button onClick={this.previousLog}>Previous</button>
<button onClick={this.nextLog}>Next</button>
<Grid
// rows={data}
// rows={Object.values(data)}
// rows={[session_object]}
rows={this.state.rows}
columns={this.state.columns}
>
<TreeDataState
defaultExpandedRowIds={this.state.defaultExpandedRowIds}
/>
<CustomTreeData
getChildRows={this.getChildRows}
/>
<Grid rows={this.state.rows} columns={this.state.columns} >
<TreeDataState defaultExpandedRowIds={this.state.defaultExpandedRowIds} />
<CustomTreeData getChildRows={this.getChildRows} />
<FilteringState defaultFilters={[]} />
<SearchState defaultValue="" />
<IntegratedFiltering />
<SortingState
defaultSorting={[{ columnName: 'Timestamp', direction: 'asc' }]}
/>
<SortingState defaultSorting={[{ columnName: 'Timestamp', direction: 'asc' }]} />
<IntegratedSorting />
<Table
columnExtensions={this.state.tableColumnExtensions}
/>
<Table columnExtensions={this.state.tableColumnExtensions} />
<TableHeaderRow showSortingControls />
<Toolbar />
<SearchPanel />
<TableFilterRow />
<TableTreeColumn
// for="id"
for="name"
/>
<TableTreeColumn for="name" />
</Grid>
</div>
</div>