React Component Hierarchy

Jump to bottom

Roots2D edited this page Dec 27, 2017 · 7 revisions

Functional Component Hierarchy

Root
- App
  - NavBar
  - MainPage
  - Footer

Auth

Components
- Session
  - SessionContainer
  - SessionForm
- User
  - NewUserContainer
  - NewUserForm
State
- Session, UserID

Live Chat

Components
- Channels Bar
  - Includes DMs and actual channels
  - Name of channel
  - DM shows amount of users and username
  - single DMs show user status
- Message Board
  - Username
  - User profile picture
  - Timestamp
  - Header showing channel name, active users, pins, ect...
- Message Input
  - Ability to add attachments
  - Send message to backend and dispersed in real time to all users within channel
State
- Channel ID, Message ID, User ID