Component Hierarchy

Jump to bottom

Porfirio A Matias edited this page Sep 19, 2017 · 1 revision

React Component Hierarchy

Functional Component Hierarchy

Root
- App
  - Navigation Bar
  - Sidebar
    - Projects
    - Teams
  - Osonoview
    - Tasks
    - Projects
    - User Profile

Session

SessionFormContainer + SessionForm
Route: /#/login and /#/signup
State: errors.login

Navigation Bar

Navigation Bar

Components:
- SessionButtonContainer, SessionButton
- State: session
- TaskIndexContainer, TaskIndex
- state: ui, tasks, user[id]
- Route: /#/tasks

Sidebar

Sidebar

Components:
- ProjectIndexContainer, ProjectIndex
- State: ui, projects[id], users[id]
- Route: /#/projects/
- TeamsIndexContainer, TeamsIndex
- State: ui, teams[id], users[id]
- Route: /#/teams/

Osonoview:

ProjectShowContainer, ProjectShow
State: ui, projects[id], users[id]
Route: /#/projects/:id
TaskDetailContainer, TaskDetail
State: ui, tasks[id], users[id]
Route: /#/tasks/:id
UserProfileContainer, UserProfile
State: ui, users[id]
Route: /#/users/:id