Change node data being visualized

The only important fields of a node is its state, props, and rendering. Its and the parent node's ID's are less significant, and have been moved out of their own detailed cards to avoid cluttering up the info panel

Author: wenli-cai

workflow-trace-viewer/src/jvmMain/kotlin/com/squareup/workflow1/traceviewer/model/Node.kt

@@ -34,14 +34,11 @@ internal data class Node(
 
   companion object {
     fun getNodeFields(): List<String> {
-      return listOf("id", "parent", "parentId", "props", "state", "rendering")
+      return listOf("props", "state", "rendering")
     }
 
     fun getNodeData(node: Node, field: String): String {
       return when (field.lowercase()) {
-        "id" -> node.id
-        "parent" -> node.parent
-        "parentid" -> node.parentId
         "props" -> node.props
         "state" -> node.state
         "rendering" -> node.rendering

workflow-trace-viewer/src/jvmMain/kotlin/com/squareup/workflow1/traceviewer/ui/WorkflowInfoPanel.kt

@@ -98,9 +98,22 @@ private fun NodePanelDetails(
     }
     item {
       Text(
-        text = node.current.name,
-        style = MaterialTheme.typography.h6,
-        modifier = Modifier.padding(top = 8.dp, bottom = 8.dp),
+        text = "${node.current.parent} (ID: ${node.current.parentId})",
+        style = MaterialTheme.typography.subtitle2,
+        color = Color.Gray,
+        modifier = Modifier.padding(top = 8.dp)
+      )
+      Text(
+        text = "↳",
+        style = MaterialTheme.typography.subtitle1,
+        color = Color.Gray,
+        modifier = Modifier.padding(start = 8.dp)
+      )
+      Text(
+        text = "${node.current.name} (ID: ${node.current.id})",
+        style = MaterialTheme.typography.h5,
+        fontWeight = FontWeight.SemiBold,
+        modifier = Modifier.padding(8.dp),
         textAlign = TextAlign.Center
       )
     }