From 2d83de99c5c17b78422837b07b9deeae1129b8d0 Mon Sep 17 00:00:00 2001
From: Chaiwat Ekkaewnumchai <cekkaewnumchai@fb.com>
Date: Thu, 5 Sep 2019 02:58:16 -0700
Subject: [PATCH] MarketTimeline

Summary: _typescript_

Reviewed By: danielbuechele

Differential Revision: D17180745

fbshipit-source-id: 0a42d5deba70ed0dfe5cd344dd5da6d2fd572999
---
 src/ui/components/MarkerTimeline.tsx | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/ui/components/MarkerTimeline.tsx b/src/ui/components/MarkerTimeline.tsx
index 8c546a252..c9637fb23 100644
--- a/src/ui/components/MarkerTimeline.tsx
+++ b/src/ui/components/MarkerTimeline.tsx
@@ -45,8 +45,8 @@ const Markers = styled('div')((props: {totalTime: number}) => ({
 const Point = styled(FlexRow)(
   (props: {
     positionY: number;
-    onClick: Function;
-    number: number;
+    onClick: Function | undefined;
+    number: number | undefined;
     threadColor: string;
     selected: boolean;
     cut: boolean;
@@ -86,10 +86,10 @@ const Point = styled(FlexRow)(
       zIndex: 3,
       boxShadow: props.selected
         ? `0 0 0 2px ${colors.macOSTitleBarIconSelected}`
-        : null,
+        : undefined,
     },
     '::after': {
-      content: props.cut ? '""' : null,
+      content: props.cut ? '""' : undefined,
       position: 'absolute',
       width: 11,
       top: -20,
@@ -215,8 +215,14 @@ export default class MarkerTimeline extends Component<Props, State> {
               cut={p.isCut}
               positionY={p.positionY}
               onClick={onClick ? () => onClick(p.markerKeys) : undefined}
-              selected={p.markerKeys.includes(this.props.selected)}
-              number={p.markerNames.length > 1 ? p.markerNames.length : null}>
+              selected={
+                this.props.selected
+                  ? p.markerKeys.includes(this.props.selected)
+                  : false
+              }
+              number={
+                p.markerNames.length > 1 ? p.markerNames.length : undefined
+              }>
               <Time>{p.timestamp}ms</Time>{' '}
               <Code code>{p.markerNames.join(', ')}</Code>
             </Point>