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

Greeting.js — react Source File

Architecture documentation for Greeting.js, a javascript file in the react codebase. 7 imports, 0 dependents.

File javascript BabelCompiler Entrypoint 7 imports 1 functions 1 classes

Entity Profile

Dependency Diagram

graph LR
  a6a6a8e0_8122_7056_d5f1_e0953f56c3c9["Greeting.js"]
  e9e7b3e6_4275_acdb_c5b3_61ea066365d4["store.js"]
  a6a6a8e0_8122_7056_d5f1_e0953f56c3c9 --> e9e7b3e6_4275_acdb_c5b3_61ea066365d4
  bfdecbd0_e0a7_079b_e1a6_8c19bbba4ba4["./shared/ThemeContext"]
  a6a6a8e0_8122_7056_d5f1_e0953f56c3c9 --> bfdecbd0_e0a7_079b_e1a6_8c19bbba4ba4
  d5a45d42_d956_cc43_b98c_b0e936e7d5a5["./shared/Clock"]
  a6a6a8e0_8122_7056_d5f1_e0953f56c3c9 --> d5a45d42_d956_cc43_b98c_b0e936e7d5a5
  ac587885_e294_a1e9_b13f_5e7b920fdb42["react"]
  a6a6a8e0_8122_7056_d5f1_e0953f56c3c9 --> ac587885_e294_a1e9_b13f_5e7b920fdb42
  4d0c4ccc_5970_e7f9_458f_15f0290099b1["react-dom"]
  a6a6a8e0_8122_7056_d5f1_e0953f56c3c9 --> 4d0c4ccc_5970_e7f9_458f_15f0290099b1
  8cf8b705_304d_a1e9_84ae_9f2ae5e546b6["react-router-dom"]
  a6a6a8e0_8122_7056_d5f1_e0953f56c3c9 --> 8cf8b705_304d_a1e9_84ae_9f2ae5e546b6
  56a19847_52ab_03d1_31e4_30711218e0ad["react-redux"]
  a6a6a8e0_8122_7056_d5f1_e0953f56c3c9 --> 56a19847_52ab_03d1_31e4_30711218e0ad
  style a6a6a8e0_8122_7056_d5f1_e0953f56c3c9 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import React from 'react';
import {Component} from 'react';
import {findDOMNode} from 'react-dom';
import {Link} from 'react-router-dom';
import {connect} from 'react-redux';
import {store} from '../store';

import ThemeContext from './shared/ThemeContext';
import Clock from './shared/Clock';

store.subscribe(() => {
  console.log('Counter:', store.getState());
});

class AboutSection extends Component {
  componentDidMount() {
    // The modern app is wrapped in StrictMode,
    // but the legacy bits can still use old APIs.
    findDOMNode(this);
  }
  render() {
    return (
      <ThemeContext.Consumer>
        {theme => (
          <div style={{border: '1px dashed black', padding: 20}}>
            <h3>src/legacy/Greeting.js</h3>
            <h4 style={{color: theme}}>
              This component is rendered by the nested React ({React.version}).
            </h4>
            <Clock />
            <p>
              Counter: {this.props.counter}{' '}
              <button onClick={() => this.props.dispatch({type: 'increment'})}>
                +
              </button>
            </p>
            <b>
              <Link to="/">Go to Home</Link>
            </b>
          </div>
        )}
      </ThemeContext.Consumer>
    );
  }
}

function mapStateToProps(state) {
  return {counter: state};
}

export default connect(mapStateToProps)(AboutSection);

Domain

Subdomains

Functions

Classes

Dependencies

  • ./shared/Clock
  • ./shared/ThemeContext
  • react
  • react-dom
  • react-redux
  • react-router-dom
  • store.js

Source

Frequently Asked Questions

What does Greeting.js do?
Greeting.js is a source file in the react codebase, written in javascript. It belongs to the BabelCompiler domain, Entrypoint subdomain.
What functions are defined in Greeting.js?
Greeting.js defines 1 function(s): mapStateToProps.
What does Greeting.js depend on?
Greeting.js imports 7 module(s): ./shared/Clock, ./shared/ThemeContext, react, react-dom, react-redux, react-router-dom, store.js.
Where is Greeting.js in the architecture?
Greeting.js is located at fixtures/nesting/src/legacy/Greeting.js (domain: BabelCompiler, subdomain: Entrypoint, directory: fixtures/nesting/src/legacy).

Analyze Your Own Codebase

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

Try Supermodel Free