TimelineDataDescription optional properties

Summary: Make properties optional. Additionally, only show them if found.

Reviewed By: mweststrate

Differential Revision: D43948493

fbshipit-source-id: 0aa77a725663b456f069c717b4ea051008516c9e

desktop/flipper-plugin/src/ui/data-inspector/TimelineDataDescription.tsx

@@ -19,7 +19,7 @@ type TimePoint = {
   display: string;
   color: string;
   key: string;
-  properties: {[key: string]: string};
+  properties?: {[key: string]: string};
 };
 
 type Timeline = {
@@ -54,6 +54,10 @@ export class TimelineDataDescription extends Component<Props, State> {
         value.color,
       key: value.key,
     }));
+    const properties = this.props.timeline.time.find(
+      (value) => value.key === this.state.selected,
+    )?.properties;
+
     return (
       <>
         {this.props.canSetCurrent && (
@@ -73,15 +77,7 @@ export class TimelineDataDescription extends Component<Props, State> {
             selected={this.state.selected}
           />
         </div>
-        <div>
+        {properties && <DataInspector data={properties} />}
-          <DataInspector
-            data={
-              this.props.timeline.time.find(
-                (value) => value.key === this.state.selected,
-              )?.properties ?? {}
-            }
-          />
-        </div>
       </>
     );
   }