useCommitFilteringAndNavigation() — react Function Reference

Source Code

packages/react-devtools-shared/src/devtools/views/Profiler/useCommitFilteringAndNavigation.js lines 34–77

export function useCommitFilteringAndNavigation(
  commitData: Array<CommitDataFrontend>,
): CommitFilteringAndNavigation {
  // Filter settings persisted to localStorage
  const [isCommitFilterEnabled, setIsCommitFilterEnabledValue] =
    useLocalStorage<boolean>('React::DevTools::isCommitFilterEnabled', false);
  const [minCommitDuration, setMinCommitDurationValue] =
    useLocalStorage<number>('minCommitDuration', 0);

  // Currently selected commit index (in the unfiltered list)
  const [selectedCommitIndex, selectCommitIndex] = useState<number | null>(
    null,
  );

  // Reset commit index when commitData changes (e.g., when switching roots).
  const [previousCommitData, setPreviousCommitData] =
    useState<Array<CommitDataFrontend>>(commitData);
  if (previousCommitData !== commitData) {
    setPreviousCommitData(commitData);
    selectCommitIndex(commitData.length > 0 ? 0 : null);
  }

  const calculateFilteredIndices = useCallback(
    (enabled: boolean, minDuration: number): Array<number> => {
      return commitData.reduce((reduced: Array<number>, commitDatum, index) => {
        if (!enabled || commitDatum.duration >= minDuration) {
          reduced.push(index);
        }
        return reduced;
      }, ([]: Array<number>));
    },
    [commitData],
  );

  const findFilteredIndex = useCallback(
    (commitIndex: number | null, filtered: Array<number>): number | null => {
      if (commitIndex === null) return null;
      for (let i = 0; i < filtered.length; i++) {
        if (filtered[i] === commitIndex) {
          return i;
        }
      }
      return null;
    },