Architecture

Jump to bottom Edit New page

Twan Goosen edited this page Dec 30, 2015 · 1 revision

Component Registry front end design

React component structure

See below for a component diagram.

app (routing and rendering of Main)
- Main [AuthenticationStore, MessageStore]
  - AuthState
  - AlertsView
  - Routing child
    - Main/Browser [ItemsStore, SelectionStore, ComponentDetailsStore, AuthenticationStore, TeamStore]
      - DataGrid
        
        DataTablesWrapper
        
        DataTablesRow
      - DataGridFilter
      - SpaceSelector
      - BrowserMenuGroup
      - RssLink
      - ComponentInfo (modal alert)
      - ComponentDetailsPanel [ComponentDetailsStore]
        
        ComponentSpecView
        
        CMDComponentView -> CMDComponentMixin
        
        ActionButtons
        
        CMDComponentView
        
        CMDElementView
        
        CMDAttributeView
        
        CMDAttributeView
        
        XmlPanel
        
        Comments
        
        RssLink
    - Main/Editor [AuthenticationStore, ComponentDetailsStore, EditorStore, TeamStore]
      - EditorForm
        
        EditorMenuGroup
        
        ComponentSpecForm
        
        CMDComponentForm
        
        ActionButtons
        
        CMDComponentForm -> CMDComponentMixin
        
        CMDComponentView
        
        CMDElementForm
        
        CMDAttributeForm
        
        CMDAttributeForm
      - DataGrid
      - DataGridFilter
      - SpaceSelector

Component diagram

Original draw.io source