TimelineContext.js — react Source File

Source Code

/**
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * @flow
 */

import type {ReactContext, RefObject} from 'shared/ReactTypes';

import * as React from 'react';
import {
  createContext,
  useContext,
  useMemo,
  useRef,
  useState,
  useSyncExternalStore,
} from 'react';
import {StoreContext} from 'react-devtools-shared/src/devtools/views/context';

import type {
  HorizontalScrollStateChangeCallback,
  TimelineData,
  SearchRegExpStateChangeCallback,
  ViewState,
  ReactEventInfo,
} from './types';

export type Context = {
  file: File | null,
  inMemoryTimelineData: Array<TimelineData> | null,
  isPerformanceTracksSupported: boolean,
  isTimelineSupported: boolean,
  searchInputContainerRef: RefObject,
  setFile: (file: File | null) => void,
  viewState: ViewState,
  selectEvent: ReactEventInfo => void,
  selectedEvent: ReactEventInfo,
};

const TimelineContext: ReactContext<Context> = createContext<Context>(
  ((null: any): Context),
);
TimelineContext.displayName = 'TimelineContext';

type Props = {
  children: React$Node,
};

function TimelineContextController({children}: Props): React.Node {
  const searchInputContainerRef = useRef(null);
  const [file, setFile] = useState<string | null>(null);

  const store = useContext(StoreContext);

  const isTimelineSupported = useSyncExternalStore<boolean>(
    function subscribe(callback) {
      store.addListener('rootSupportsTimelineProfiling', callback);
// ... (119 more lines)