Home / Function/ getFunctionName() — react Function Reference

getFunctionName() — react Function Reference

Architecture documentation for the getFunctionName() function in RulesOfHooks.ts from the react codebase.

Entity Profile

Dependency Diagram

graph TD
  8602459e_8564_b68b_f89f_016bed3c8ea4["getFunctionName()"]
  47fb9f02_49dd_1d0d_5027_9353a6a77f1e["RulesOfHooks.ts"]
  8602459e_8564_b68b_f89f_016bed3c8ea4 -->|defined in| 47fb9f02_49dd_1d0d_5027_9353a6a77f1e
  e33d7f9c_2333_764f_8ca1_79868b065cbf["isInsideComponentOrHook()"]
  e33d7f9c_2333_764f_8ca1_79868b065cbf -->|calls| 8602459e_8564_b68b_f89f_016bed3c8ea4
  be7612d8_31aa_c40a_35d5_89fd476ab28a["rule.create()"]
  be7612d8_31aa_c40a_35d5_89fd476ab28a -->|calls| 8602459e_8564_b68b_f89f_016bed3c8ea4
  style 8602459e_8564_b68b_f89f_016bed3c8ea4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/eslint-plugin-react-hooks/src/rules/RulesOfHooks.ts lines 860–925

function getFunctionName(node: Node) {
  if (
    // @ts-expect-error parser-hermes produces these node types
    node.type === 'ComponentDeclaration' ||
    // @ts-expect-error parser-hermes produces these node types
    node.type === 'HookDeclaration' ||
    node.type === 'FunctionDeclaration' ||
    (node.type === 'FunctionExpression' && node.id)
  ) {
    // function useHook() {}
    // const whatever = function useHook() {};
    //
    // Function declaration or function expression names win over any
    // assignment statements or other renames.
    return node.id;
  } else if (
    node.type === 'FunctionExpression' ||
    node.type === 'ArrowFunctionExpression'
  ) {
    if (
      node.parent?.type === 'VariableDeclarator' &&
      node.parent.init === node
    ) {
      // const useHook = () => {};
      return node.parent.id;
    } else if (
      node.parent?.type === 'AssignmentExpression' &&
      node.parent.right === node &&
      node.parent.operator === '='
    ) {
      // useHook = () => {};
      return node.parent.left;
    } else if (
      node.parent?.type === 'Property' &&
      node.parent.value === node &&
      !node.parent.computed
    ) {
      // {useHook: () => {}}
      // {useHook() {}}
      return node.parent.key;

      // NOTE: We could also support `ClassProperty` and `MethodDefinition`
      // here to be pedantic. However, hooks in a class are an anti-pattern. So
      // we don't allow it to error early.
      //
      // class {useHook = () => {}}
      // class {useHook() {}}
    } else if (
      node.parent?.type === 'AssignmentPattern' &&
      node.parent.right === node &&
      // @ts-expect-error Property computed does not exist on type `AssignmentPattern`.
      !node.parent.computed
    ) {
      // const {useHook = () => {}} = {};
      // ({useHook = () => {}} = {});
      //
      // Kinda clowny, but we'd said we'd follow spec convention for
      // `IsAnonymousFunctionDefinition()` usage.
      return node.parent.left;
    } else {
      return undefined;
    }
  } else {
    return undefined;
  }
}

Domain

Subdomains

Frequently Asked Questions

What does getFunctionName() do?
getFunctionName() is a function in the react codebase, defined in packages/eslint-plugin-react-hooks/src/rules/RulesOfHooks.ts.
Where is getFunctionName() defined?
getFunctionName() is defined in packages/eslint-plugin-react-hooks/src/rules/RulesOfHooks.ts at line 860.
What calls getFunctionName()?
getFunctionName() is called by 2 function(s): isInsideComponentOrHook, rule.create.

Analyze Your Own Codebase

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

Try Supermodel Free