react Architecture Docs
Home / File/ CommitRanked.js — react Source File

CommitRanked.js — react Source File

Architecture documentation for CommitRanked.js, a javascript file in the react codebase. 19 imports, 2 dependents.

File javascript BabelCompiler Validation 19 imports 2 dependents 5 functions

Entity Profile

Dependency Diagram

graph LR
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0["CommitRanked.js"]
  6c4f87a5_052e_5ad2_3388_1e4392b92a53["ProfilerContext.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 6c4f87a5_052e_5ad2_3388_1e4392b92a53
  c15c0dcd_3042_bfe0_e269_e206def64f45["NoCommitData.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> c15c0dcd_3042_bfe0_e269_e206def64f45
  30159f77_ec92_2e22_ad1c_4d1ec303aaff["NoCommitData"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 30159f77_ec92_2e22_ad1c_4d1ec303aaff
  89b916c8_640c_20f1_5b9e_9022ade373b8["CommitRankedListItem.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 89b916c8_640c_20f1_5b9e_9022ade373b8
  bb5ba7dd_ac69_1751_9057_760848df67b4["CommitRankedListItem"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> bb5ba7dd_ac69_1751_9057_760848df67b4
  38d38257_86b3_3154_4c21_7fbaf41be1cb["HoveredFiberInfo.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 38d38257_86b3_3154_4c21_7fbaf41be1cb
  26286214_bfec_a4fc_1a0f_5f10283eb543["HoveredFiberInfo"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 26286214_bfec_a4fc_1a0f_5f10283eb543
  0f941e70_3fdb_aa42_7939_2878d5d4125b["utils.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 0f941e70_3fdb_aa42_7939_2878d5d4125b
  913bb343_55ea_f1b8_08f5_b75cb0a92b76["context.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 913bb343_55ea_f1b8_08f5_b75cb0a92b76
  5996f1e4_af81_a51b_84bc_175bfba4f818["SettingsContext.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 5996f1e4_af81_a51b_84bc_175bfba4f818
  315baf50_1028_51ca_a9c1_679c6a17ed98["hooks.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 315baf50_1028_51ca_a9c1_679c6a17ed98
  67a53ff5_5364_e0e2_039c_5bb44dfc1bd6["Tooltip.js"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 67a53ff5_5364_e0e2_039c_5bb44dfc1bd6
  18091250_4636_e404_3b72_076fbd80ff67["Tooltip"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 18091250_4636_e404_3b72_076fbd80ff67
  63805ad8_f162_5605_772f_a060c74d934a["CommitRanked.css"]
  0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 --> 63805ad8_f162_5605_772f_a060c74d934a
  style 0ad6c6d5_5d6d_2d8a_d957_e1433af66ea0 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

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 * as React from 'react';
import {useCallback, useContext, useMemo, useState} from 'react';
import AutoSizer from 'react-virtualized-auto-sizer';
import {FixedSizeList} from 'react-window';
import {ProfilerContext} from './ProfilerContext';
import NoCommitData from './NoCommitData';
import CommitRankedListItem from './CommitRankedListItem';
import HoveredFiberInfo from './HoveredFiberInfo';
import {scale} from './utils';
import {StoreContext} from '../context';
import {SettingsContext} from '../Settings/SettingsContext';
import {useHighlightHostInstance} from '../hooks';
import Tooltip from './Tooltip';

import styles from './CommitRanked.css';

import type {TooltipFiberData} from './HoveredFiberInfo';
import type {ChartData} from './RankedChartBuilder';
import type {CommitTree} from './types';

export type ItemData = {
  chartData: ChartData,
  onElementMouseEnter: (fiberData: TooltipFiberData) => void,
  onElementMouseLeave: () => void,
  scaleX: (value: number, fallbackValue: number) => number,
  selectedFiberID: number | null,
  selectedFiberIndex: number,
  selectFiber: (id: number | null, name: string | null) => void,
  width: number,
};

export default function CommitRankedAutoSizer(_: {}): React.Node {
  const {profilerStore} = useContext(StoreContext);
  const {rootID, selectedCommitIndex, selectFiber} =
    useContext(ProfilerContext);
  const {profilingCache} = profilerStore;

  const deselectCurrentFiber = useCallback(
    (event: $FlowFixMe) => {
      event.stopPropagation();
      selectFiber(null, null);
    },
    [selectFiber],
  );

  let commitTree: CommitTree | null = null;
  let chartData: ChartData | null = null;
  if (selectedCommitIndex !== null) {
    commitTree = profilingCache.getCommitTree({
      commitIndex: selectedCommitIndex,
      rootID: ((rootID: any): number),
// ... (121 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does CommitRanked.js do?
CommitRanked.js is a source file in the react codebase, written in javascript. It belongs to the BabelCompiler domain, Validation subdomain.
What functions are defined in CommitRanked.js?
CommitRanked.js defines 5 function(s): CommitRanked, CommitRankedAutoSizer, ItemData.onElementMouseEnter, ItemData.onElementMouseLeave, getNodeIndex.
What does CommitRanked.js depend on?
CommitRanked.js imports 19 module(s): CommitRanked.css, CommitRankedListItem, CommitRankedListItem.js, HoveredFiberInfo, HoveredFiberInfo.js, NoCommitData, NoCommitData.js, ProfilerContext.js, and 11 more.
What files import CommitRanked.js?
CommitRanked.js is imported by 2 file(s): CommitRankedListItem.js, Profiler.js.
Where is CommitRanked.js in the architecture?
CommitRanked.js is located at packages/react-devtools-shared/src/devtools/views/Profiler/CommitRanked.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-devtools-shared/src/devtools/views/Profiler).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free