react Architecture Docs
Home / File/ nested-optional-chains.ts — react Source File

nested-optional-chains.ts — react Source File

Architecture documentation for nested-optional-chains.ts, a typescript file in the react codebase. 1 imports, 0 dependents.

File typescript TestingUtilities Fixtures 1 imports 1 functions

Entity Profile

Dependency Diagram

graph LR
  58e5a3b5_0138_e51d_189a_5e27b7b2e45e["nested-optional-chains.ts"]
  006eec3d_77a9_4a47_e6c1_a96d7a6c9c05["shared-runtime"]
  58e5a3b5_0138_e51d_189a_5e27b7b2e45e --> 006eec3d_77a9_4a47_e6c1_a96d7a6c9c05
  style 58e5a3b5_0138_e51d_189a_5e27b7b2e45e fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

// @enablePropagateDepsInHIR

import {identity} from 'shared-runtime';

/**
 * identity(...)?.toString() is the outer optional, and prop?.value is the inner
 * one.
 * Note that prop?.
 */
function useFoo({
  prop1,
  prop2,
  prop3,
  prop4,
  prop5,
  prop6,
}: {
  prop1: null | {value: number};
  prop2: null | {inner: {value: number}};
  prop3: null | {fn: (val: any) => NonNullable<object>};
  prop4: null | {inner: {value: number}};
  prop5: null | {fn: (val: any) => NonNullable<object>};
  prop6: null | {inner: {value: number}};
}) {
  // prop1?.value should be hoisted as the dependency of x
  const x = identity(prop1?.value)?.toString();

  // prop2?.inner.value should be hoisted as the dependency of y
  const y = identity(prop2?.inner.value)?.toString();

  // prop3 and prop4?.inner should be hoisted as the dependency of z
  const z = prop3?.fn(prop4?.inner.value).toString();

  // prop5 and prop6?.inner should be hoisted as the dependency of zz
  const zz = prop5?.fn(prop6?.inner.value)?.toString();
  return [x, y, z, zz];
}

export const FIXTURE_ENTRYPOINT = {
  fn: useFoo,
  params: [
    {
      prop1: null,
      prop2: null,
      prop3: null,
      prop4: null,
      prop5: null,
      prop6: null,
    },
  ],
  sequentialRenders: [
    {
      prop1: null,
      prop2: null,
      prop3: null,
      prop4: null,
      prop5: null,
      prop6: null,
    },
    {
      prop1: {value: 2},
      prop2: {inner: {value: 3}},
      prop3: {fn: identity},
      prop4: {inner: {value: 4}},
      prop5: {fn: identity},
      prop6: {inner: {value: 4}},
    },
    {
      prop1: {value: 2},
      prop2: {inner: {value: 3}},
      prop3: {fn: identity},
      prop4: {inner: {value: 4}},
      prop5: {fn: identity},
      prop6: {inner: {value: undefined}},
    },
    {
      prop1: {value: 2},
      prop2: {inner: {value: undefined}},
      prop3: {fn: identity},
      prop4: {inner: {value: undefined}},
      prop5: {fn: identity},
      prop6: {inner: {value: undefined}},
    },
    {
      prop1: {value: 2},
      prop2: {},
      prop3: {fn: identity},
      prop4: {},
      prop5: {fn: identity},
      prop6: {inner: {value: undefined}},
    },
  ],
};

Domain

Subdomains

Functions

Dependencies

  • shared-runtime

Source

Frequently Asked Questions

What does nested-optional-chains.ts do?
nested-optional-chains.ts is a source file in the react codebase, written in typescript. It belongs to the TestingUtilities domain, Fixtures subdomain.
What functions are defined in nested-optional-chains.ts?
nested-optional-chains.ts defines 1 function(s): useFoo.
What does nested-optional-chains.ts depend on?
nested-optional-chains.ts imports 1 module(s): shared-runtime.
Where is nested-optional-chains.ts in the architecture?
nested-optional-chains.ts is located at compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/nested-optional-chains.ts (domain: TestingUtilities, subdomain: Fixtures, directory: compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork).

Analyze Your Own Codebase

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

Try Supermodel Free