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

ProfilingImportExportButtons.js — react Source File

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

File javascript BabelCompiler Validation 16 imports 1 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1["ProfilingImportExportButtons.js"]
  6c4f87a5_052e_5ad2_3388_1e4392b92a53["ProfilerContext.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 6c4f87a5_052e_5ad2_3388_1e4392b92a53
  899cf357_78bc_8627_bd54_2c00e2c9fde2["ModalDialog.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 899cf357_78bc_8627_bd54_2c00e2c9fde2
  f9049b08_60f8_abce_a6a6_153f88447124["Button.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> f9049b08_60f8_abce_a6a6_153f88447124
  f71ee326_17f0_7db4_4178_2763fb1c2ad1["Button"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> f71ee326_17f0_7db4_4178_2763fb1c2ad1
  9f39024f_b905_9b0f_2fc7_e24785732638["ButtonIcon.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 9f39024f_b905_9b0f_2fc7_e24785732638
  4690d9c0_cb81_9593_7817_f9e61a49f9e7["ButtonIcon"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 4690d9c0_cb81_9593_7817_f9e61a49f9e7
  913bb343_55ea_f1b8_08f5_b75cb0a92b76["context.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 913bb343_55ea_f1b8_08f5_b75cb0a92b76
  0f941e70_3fdb_aa42_7939_2878d5d4125b["utils.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 0f941e70_3fdb_aa42_7939_2878d5d4125b
  d7b27d30_728f_ba37_ed97_d371fbd3de62["utils.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> d7b27d30_728f_ba37_ed97_d371fbd3de62
  03e3d573_f6a1_61a4_1749_cb4e0f3e2569["downloadFile"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 03e3d573_f6a1_61a4_1749_cb4e0f3e2569
  3709f562_d6a2_af9f_8e19_2b751884cf20["ProfilingImportExportButtons.css"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 3709f562_d6a2_af9f_8e19_2b751884cf20
  98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf["types.js"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 98e7cbed_f4b4_9f35_838e_6e7cf3e5edcf
  ac587885_e294_a1e9_b13f_5e7b920fdb42["react"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> ac587885_e294_a1e9_b13f_5e7b920fdb42
  02511792_3032_82be_67ac_e8a3f9d19220["TimelineContext"]
  b191034a_a94e_84c8_d9bb_fcdcfa226cc1 --> 02511792_3032_82be_67ac_e8a3f9d19220
  style b191034a_a94e_84c8_d9bb_fcdcfa226cc1 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 {Fragment, useContext, useCallback, useRef} from 'react';
import {ProfilerContext} from './ProfilerContext';
import {ModalDialogContext} from '../ModalDialog';
import Button from '../Button';
import ButtonIcon from '../ButtonIcon';
import {StoreContext} from '../context';
import {
  prepareProfilingDataExport,
  prepareProfilingDataFrontendFromExport,
} from './utils';
import {downloadFile} from '../utils';
import {TimelineContext} from 'react-devtools-timeline/src/TimelineContext';
import isArray from 'shared/isArray';
import hasOwnProperty from 'shared/hasOwnProperty';

import styles from './ProfilingImportExportButtons.css';

import type {ProfilingDataExport} from './types';

export default function ProfilingImportExportButtons(): React.Node {
  const {isProfiling, profilingData, rootID} = useContext(ProfilerContext);
  const {setFile} = useContext(TimelineContext);
  const store = useContext(StoreContext);
  const {profilerStore} = store;

  const inputRef = useRef<HTMLInputElement | null>(null);
  const downloadRef = useRef<HTMLAnchorElement | null>(null);

  const {dispatch: modalDialogDispatch} = useContext(ModalDialogContext);

  const doesHaveInMemoryData = profilerStore.didRecordCommits;

  const downloadData = useCallback(() => {
    if (rootID === null) {
      return;
    }

    const anchorElement = downloadRef.current;

    if (profilingData !== null && anchorElement !== null) {
      const profilingDataExport = prepareProfilingDataExport(profilingData);
      const date = new Date();
      const dateString = date
        .toLocaleDateString(undefined, {
          year: 'numeric',
          month: '2-digit',
          day: '2-digit',
        })
        .replace(/\//g, '-');
      const timeString = date
// ... (96 more lines)

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does ProfilingImportExportButtons.js do?
ProfilingImportExportButtons.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 ProfilingImportExportButtons.js?
ProfilingImportExportButtons.js defines 1 function(s): ProfilingImportExportButtons.
What does ProfilingImportExportButtons.js depend on?
ProfilingImportExportButtons.js imports 16 module(s): Button, Button.js, ButtonIcon, ButtonIcon.js, ModalDialog.js, ProfilerContext.js, ProfilingImportExportButtons.css, TimelineContext, and 8 more.
What files import ProfilingImportExportButtons.js?
ProfilingImportExportButtons.js is imported by 1 file(s): Profiler.js.
Where is ProfilingImportExportButtons.js in the architecture?
ProfilingImportExportButtons.js is located at packages/react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.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