fix(trace viewer): do not render invisble tabs (#5322)

microsoft · Feb 5, 2021 · 9c0609b · 9c0609b
1 parent de30ee0
commit 9c0609b
Showing 1 changed file with 8 additions and 8 deletions.
diff --git a/src/web/traceViewer/ui/propertiesTabbedPane.tsx b/src/web/traceViewer/ui/propertiesTabbedPane.tsx
@@ -52,18 +52,18 @@ export const PropertiesTabbedPane: React.FunctionComponent<{
           </div>
         </div>
       </div>
-      <div className='properties-tab-content' style={{ display: selected === 'snapshot' ? 'flex' : 'none' }}>
+      { selected === 'snapshot' && <div className='properties-tab-content'>
         <SnapshotTab actionEntry={actionEntry} snapshotSize={snapshotSize} selectedTime={selectedTime} boundaries={boundaries} />
-      </div>
-      <div className='properties-tab-content' style={{ display: selected === 'source' ? 'flex' : 'none' }}>
+      </div> }
+      { selected === 'source' && <div className='properties-tab-content'>
         <SourceTab actionEntry={actionEntry} />
-      </div>
-      <div className='properties-tab-content' style={{ display: selected === 'network' ? 'flex' : 'none' }}>
+      </div> }
+      { selected === 'network' && <div className='properties-tab-content'>
         <NetworkTab actionEntry={actionEntry} />
-      </div>
-      <div className='properties-tab-content' style={{ display: selected === 'logs' ? 'flex' : 'none' }}>
+      </div> }
+      { selected === 'logs' && <div className='properties-tab-content'>
         <LogsTab actionEntry={actionEntry} />
-      </div>
+      </div> }
     </div>
   </div>;
 };