add extra fields to data

src/App.js

@@ -30,10 +30,15 @@ class App extends React.PureComponent {
         { name: 'session', title: 'Session', hidden: true },
         { name: 'parent_id', title: 'Parent', hidden: true },
         { name: 'id', title: 'Id', hidden: true },
-        { name: 'step', title: 'Step' },
-        { name: 'name', title: 'Name', width: 600 },
+        { name: 'step', title: 'Step', width: 100 },
+        { name: 'timepassed', title: 'Time', width: 100 },
+        { name: 'parent', title: 'ParentName'},
+        { name: 'summary', title: 'Log', width: 600, hidden: true },
         { name: 'type', title: 'Type' },
-        { name: 'timestamp', title: 'Timestamp' },
+        { name: 'name', title: 'Name', width: 350},
+        { name: 'inputs_preview', title: 'Inputs'},
+        { name: 'outputs_preview', title: 'Outputs'},
+        { name: 'timestamp', title: 'Timestamp', hidden: true },
         // { name: 'error', title: 'Error' },
         // { name: 'inputs', title: 'Inputs' },
         { name: 'msg', title: 'Error', hidden: true },
@@ -91,7 +96,8 @@ class App extends React.PureComponent {
       return () => {
         const {step} = value.row;
 
-        let item = logManager.getStep(step)
+        let item = logManager.getStep(step);
+        if (!item) return;
 
         this.setState({
           modalTitle: "step " + item.step,

src/DataManager.js

@@ -3,16 +3,83 @@ class LogManager {
 
   constructor(all_data) {
     this.currentStep = 0;
-    this.all_data_ordered = Object.values(all_data).sort((x) => x.timestamp)
+    this.all_data_ordered = this.getData(all_data);
     this.maxStep = this.all_data_ordered.length - 1;
 
     let session_object = Object.values(all_data).find((x) => x.session === x.id)
-    // should be list of sessions instead
-
     this.data = [session_object];
     this.logs = [];
   }
 
+  getData(data) {
+    let session = Object.values(data).find((x) => x.session === x.id)
+
+    return Object.values(data).sort((x) => x.timestamp).map((x) => {
+      x.timepassed = (x.timestamp - session.timestamp) / 1000.0;
+      if (data[x.parent_id]) {
+        if (x.parent_id === session.id && x.module) {
+          x.parent = x.module;
+        } else {
+          x.parent = data[x.parent_id].name;
+        }
+      }
+
+      if (x.inputs) {
+        let params = []
+        if (Array.isArray(x.inputs)) {
+          for (let i of x.inputs) {
+            if (typeof (i) === 'string') {
+              let value = `"${i.slice(0, 90)}"`
+              if (i.length > 90) {
+                value += "..."
+              }
+              params.push(value)
+            } else if (i === null || i === undefined) {
+              params.push(i)
+            } else if (typeof (i) === 'object') {
+              let value = `${JSON.stringify(i).slice(0, 90)}`
+              params.push(value)
+            } else {
+              params.push(typeof (i))
+            }
+          }
+        } else if (typeof (x.inputs) === 'object') {
+          let value = `${JSON.stringify(x.inputs).slice(0, 90)}`
+          params = [value]
+        }
+        x.inputs_preview = `(${params.join(', ')})`;
+      }
+
+      if (x.outputs) {
+        let params = []
+        if (Array.isArray(x.outputs)) {
+          for (let i of x.outputs) {
+            if (typeof (i) === 'string') {
+              let value = `"${i.slice(0, 90)}"`
+              if (i.length > 90) {
+                value += "..."
+              }
+              params.push(value)
+            } else if (i === null || i === undefined) {
+              params.push(i)
+            } else if (typeof (i) === 'object') {
+              let value = `${JSON.stringify(i).slice(0, 90)}`
+              params.push(value)
+            } else {
+              params.push(typeof (i))
+            }
+          }
+        } else if (typeof (x.outputs) === 'object') {
+          let value = `${JSON.stringify(x.outputs).slice(0, 90)}`
+          params = [value]
+        }
+        x.outputs_preview = `(${params.join(', ')})`;
+      }
+
+      return x;
+    });
+  }
+
   getCurrentStep() {
     return this.all_data_ordered[this.currentStep];
   }

src/LogsSection.js

@@ -25,7 +25,7 @@ function LogsSection({title, open, isStructured, defaultSorting, cols, rows, vie
   return (
     <Section title={title} defaultOpen={open}>
       <Grid rows={rows} columns={columns} >
-        <LogTypeProvider for={["name"]} onClick={viewRow} />
+        <LogTypeProvider for={["name", "summary"]} onClick={viewRow} />
         <StepTypeProvider for={["step"]} onClick={viewRow} availableFilterOperations={numberFilterOperations} />
         <TreeDataState defaultExpandedRowIds={[]} />
         {isStructured &&