### Website or app

beta.reactjs.org (local development)

### Repro steps

1. https://github.com/reactjs/reactjs.org/tree/main/beta
2. `yarn dev`

"Reload and profile" is enabled for Flamegraph:

<img width="724" alt="Screenshot 2022-05-23 at 21 28 07" src="https://user-images.githubusercontent.com/810438/169900687-7c62d7c5-34ad-43c0-b1fa-ca45c8e16dba.png">

But disabled for Timeline:

<img width="671" alt="Screenshot 2022-05-23 at 21 28 12" src="https://user-images.githubusercontent.com/810438/169900693-ba60f1f4-3b37-4141-993a-70bac5647b01.png">

And yet I can "reload and profile" in Flamegraph, then switch to Timeline and it works. So this doesn't add up.

### How often does this bug happen?

Every time

### DevTools package (automated)

_No response_

### DevTools version (automated)

_No response_

### Error message (automated)

_No response_

### Error call stack (automated)

_No response_

### Error component stack (automated)

_No response_

### GitHub query string (automated)

_No response_
const {
    didRecordCommits,
    isProcessingData,
    isProfiling,
    selectedCommitIndex,
    selectedFiberID,
    selectedTabID,
    selectTab,
    supportsProfiling,
  } = useContext(ProfilerContext);
  const {file: timelineTraceEventData, searchInputContainerRef} = useContext(
    TimelineContext,
  );
  const {supportsTimeline} = useContext(StoreContext);
  const isLegacyProfilerSelected = selectedTabID !== 'timeline';
  let view = null;
  if (didRecordCommits || selectedTabID === 'timeline') {
    switch (selectedTabID) {
      case 'flame-chart':
        view = <CommitFlamegraph />;
        break;
      case 'ranked-chart':
        view = <CommitRanked />;
        break;
      case 'timeline':
        view = <Timeline />;