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

InspectedElementErrorsAndWarningsTree.js — react Source File

Architecture documentation for InspectedElementErrorsAndWarningsTree.js, a javascript file in the react codebase. 11 imports, 1 dependents.

File javascript BabelCompiler Validation 11 imports 1 dependents 4 functions

Entity Profile

Dependency Diagram

graph LR
  e489f60d_6c21_9c69_16d7_a97323c0790f["InspectedElementErrorsAndWarningsTree.js"]
  f9049b08_60f8_abce_a6a6_153f88447124["Button.js"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> f9049b08_60f8_abce_a6a6_153f88447124
  f71ee326_17f0_7db4_4178_2763fb1c2ad1["Button"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> f71ee326_17f0_7db4_4178_2763fb1c2ad1
  9f39024f_b905_9b0f_2fc7_e24785732638["ButtonIcon.js"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> 9f39024f_b905_9b0f_2fc7_e24785732638
  4690d9c0_cb81_9593_7817_f9e61a49f9e7["ButtonIcon"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> 4690d9c0_cb81_9593_7817_f9e61a49f9e7
  bba85af0_a356_d0c5_4d12_914508b89593["store.js"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> bba85af0_a356_d0c5_4d12_914508b89593
  2337051b_9399_908a_f16c_81724ab026b7["InspectedElementSharedStyles.css"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> 2337051b_9399_908a_f16c_81724ab026b7
  fdd9d671_beed_dd85_7158_2facd1484a95["InspectedElementErrorsAndWarningsTree.css"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> fdd9d671_beed_dd85_7158_2facd1484a95
  ac587885_e294_a1e9_b13f_5e7b920fdb42["react"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> ac587885_e294_a1e9_b13f_5e7b920fdb42
  ee975ccf_fc44_0272_3414_71bca1874ed1["backendAPI"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> ee975ccf_fc44_0272_3414_71bca1874ed1
  aec7978f_0a19_ba93_de9e_ac8cf5ddc74b["types"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> aec7978f_0a19_ba93_de9e_ac8cf5ddc74b
  4077b620_5c59_61c2_0910_273f565da757["bridge"]
  e489f60d_6c21_9c69_16d7_a97323c0790f --> 4077b620_5c59_61c2_0910_273f565da757
  d09ae4bb_9ed0_3257_c11b_1c199408288d["InspectedElementView.js"]
  d09ae4bb_9ed0_3257_c11b_1c199408288d --> e489f60d_6c21_9c69_16d7_a97323c0790f
  style e489f60d_6c21_9c69_16d7_a97323c0790f 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 {
  unstable_useCacheRefresh as useCacheRefresh,
  useTransition,
} from 'react';
import Button from '../Button';
import ButtonIcon from '../ButtonIcon';
import Store from '../../store';
import sharedStyles from './InspectedElementSharedStyles.css';
import styles from './InspectedElementErrorsAndWarningsTree.css';
import {
  clearErrorsForElement as clearErrorsForElementAPI,
  clearWarningsForElement as clearWarningsForElementAPI,
} from 'react-devtools-shared/src/backendAPI';

import type {InspectedElement} from 'react-devtools-shared/src/frontend/types';
import type {FrontendBridge} from 'react-devtools-shared/src/bridge';

type Props = {
  bridge: FrontendBridge,
  inspectedElement: InspectedElement,
  store: Store,
};

export default function InspectedElementErrorsAndWarningsTree({
  bridge,
  inspectedElement,
  store,
}: Props): React.Node {
  const refresh = useCacheRefresh();

  const [isErrorsTransitionPending, startClearErrorsTransition] =
    useTransition();
  const clearErrorsForInspectedElement = () => {
    const {id} = inspectedElement;
    const rendererID = store.getRendererIDForElement(id);
    if (rendererID !== null) {
      startClearErrorsTransition(() => {
        clearErrorsForElementAPI({
          bridge,
          id,
          rendererID,
        });
        refresh();
      });
    }
  };

  const [isWarningsTransitionPending, startClearWarningsTransition] =
    useTransition();
  const clearWarningsForInspectedElement = () => {
// ... (124 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does InspectedElementErrorsAndWarningsTree.js do?
InspectedElementErrorsAndWarningsTree.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 InspectedElementErrorsAndWarningsTree.js?
InspectedElementErrorsAndWarningsTree.js defines 4 function(s): ErrorOrWarningView, InspectedElementErrorsAndWarningsTree, Tree, TreeProps.clearMessages.
What does InspectedElementErrorsAndWarningsTree.js depend on?
InspectedElementErrorsAndWarningsTree.js imports 11 module(s): Button, Button.js, ButtonIcon, ButtonIcon.js, InspectedElementErrorsAndWarningsTree.css, InspectedElementSharedStyles.css, backendAPI, bridge, and 3 more.
What files import InspectedElementErrorsAndWarningsTree.js?
InspectedElementErrorsAndWarningsTree.js is imported by 1 file(s): InspectedElementView.js.
Where is InspectedElementErrorsAndWarningsTree.js in the architecture?
InspectedElementErrorsAndWarningsTree.js is located at packages/react-devtools-shared/src/devtools/views/Components/InspectedElementErrorsAndWarningsTree.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-devtools-shared/src/devtools/views/Components).

Analyze Your Own Codebase

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

Try Supermodel Free