From d669fd08e5881d830c34c2e186dfdf8e4b017846 Mon Sep 17 00:00:00 2001
From: Lorenzo Blasa <lblasa@meta.com>
Date: Fri, 10 Mar 2023 06:18:21 -0800
Subject: [PATCH] TimelineDataDescription optional properties

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

Reviewed By: mweststrate

Differential Revision: D43948493

fbshipit-source-id: 0aa77a725663b456f069c717b4ea051008516c9e
---
 .../data-inspector/TimelineDataDescription.tsx   | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

diff --git a/desktop/flipper-plugin/src/ui/data-inspector/TimelineDataDescription.tsx b/desktop/flipper-plugin/src/ui/data-inspector/TimelineDataDescription.tsx
index 24fb34fb1..8c7139830 100644
--- a/desktop/flipper-plugin/src/ui/data-inspector/TimelineDataDescription.tsx
+++ b/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>
-          <DataInspector
-            data={
-              this.props.timeline.time.find(
-                (value) => value.key === this.state.selected,
-              )?.properties ?? {}
-            }
-          />
-        </div>
+        {properties && <DataInspector data={properties} />}
       </>
     );
   }