State Exploration 1

/*
  State Exploration 1.
  
  Playing with diferent ways to configure the data, based off our current application.
  Which is a large enterprise text analytics web applciation build in a single page with React.
  The application is in production use and cuurent uses vanilla Flux pattern mixed with custom
  specific logic.
  
  Below is an attempt to map out a `small` part of our data structure to see how different
  configurations work and could be structured with the reactive `tree` approach.
  
  Pros:
    - The state is split between model and view
    - The data is deeply nested and scoped
  
  Cons:
    - The data is deeply nested
    - no way to tell what is a Map or not
*/
   

var state = {

  // application data in model
  model: {
    users: {},
    projects: {},
    license: {},

    // location specific data
    location: {
      locations: {}, // list of locations
      schedules: {},
      services: {},
      crawlers: {},
    }

    // concept specific data
    concept: {
      concepts: {}, // list of concepts
      rules: {},
      ruleParameters: {},
    }

    reports: {
      // much more data ...
    }
  },

  // view data relates to view components
  // I chose to add Maps under view as they are not `raw` data but
  // pertain to specific view interaction.
  view: {
    currentUserId: null,
    currentUser: null, // Map

    selectedProjectId: null,
    selectedProject: null, // Map

    setup: {
      locations: {
        selectedLocationId: null,
        selectedLocation: null, // Map
        sortedLocations: null, // Map
        list: {
          sortType: 'ASC',
          sortBy: 'status'
        },
        detail: {

        }
      },
      concepts: { ... }
    }
  }
}