[GitHub] fabianmenges opened a new pull request #3449: Feature: Adding new exploration UI

[gi...@git.apache.org]

fabianmenges opened a new pull request #3449: Feature: Adding new exploration UI
URL: https://github.com/apache/incubator-superset/pull/3449
 
 
   ## Swivel, a new exploration interface for Superset
   
   Swivel is a new exploration interface with a primary design goal of fast and
   interactive data exploration.
   
   It currently only supports the following visualizations:
   * Table
   * Line Chart
   * Bar Chart
   * Area Chart
   
   The main features of Swivel are:
   
   * Drag and Drop support for `groupbys` and `filters`
   * Splitting query results into multiple charts
   ![charts](https://user-images.githubusercontent.com/3138343/30298640-21845614-971a-11e7-98b1-a72c0af2373a.gif)
   * Interactive range selection within charts
   * Full undo/redo history (ctrl/command + (shift) + z)
   ![undo_redo](https://user-images.githubusercontent.com/3138343/30298315-eca6fbc8-9718-11e7-861e-8f81204b3750.gif)
   * State stored in local storage (multiple tabs with history)
   ![local_storage](https://user-images.githubusercontent.com/3138343/30298298-e22d02b4-9718-11e7-9e53-132c0b29d1cd.gif)
   * Running in auto and manual query mode
   ![manual](https://user-images.githubusercontent.com/3138343/30298308-e85eb8d0-9718-11e7-9fcc-069a54313a58.gif)
   * Opening Swivel from existing explore view and vice versa.
   ![open_slice](https://user-images.githubusercontent.com/3138343/30298391-24ebd080-9719-11e7-8f4a-873012062936.gif)
   
   
   ### Swivel state design
   
   Swivel uses both redux-undo and redux-localstorage
   
   Redux-undo allows you access to a full history of your local state.
   This is specifically useful since its primary development goal was to allow
   fast interactive exploration of datasources.
   
   Redux-localstorage persist the state of your current state e.g. open new browser tabs that inherit
   the state of the previous tab. This is useful if you are planning on drilling down into
   specific parts of the data in parallel. It also brings you back to your last exploration state
   after you close a tab or accidentally close your browser.
   
   In order to efficiently use both redux-localstorage and redux-undo the following state
   structure was chosen:
   
   ```
   ?
   ??? settings (undoable)
   ?   ??? query
   ?   ??? viz
   ??? refData
   ??? control
   ```
   
   * `settings` contains the part of the state that is both "undoable" and is
   persisted to local storage.
    * `query` is the part of the state that contains all settings which require
   to run an updated query against the datasource.
    * `viz` is the part of the state that contains all settings that only
   require a re-rendering of the visualization without the need to run a query.
   * `refData` contains all reference data used by the Swivel. `refData` is not
   undoable nor is it persisted in local storage.
   * `control` The `control` part of the state contains the global state/settings of Swivel
   that are not required for the visualization. This includes, whether a query is in progress,
   an error occoured, etc... the control state is not undoable but persisted in local storage.
   
   Following the redux design guidelines there are reducers and actions for each of these partial states/stores.
   
   ### Separation of `query` and `viz` state and Listeners
   The `query` and the `viz` part of the `settings` state are separated to easily identify when a query needs to be rerun and when it is enough to rerender the the visualization.
   For this purpose I've chosen to use renderless React components that located in the `listeners` folder. I could have directly subscribed to the redux state changes but this seemed cleaner.
   
   These listeners will trigger the running of the updated query or rerendering the vizualization.
   
   The `viz` state (with its reducers and actions) is extremely incomplete and I can potentially reuse big parts of the current explore view including the related react component architecture to complete it.
   
   
   ### TODOs
   * Swivel depends partially on several of my other, open merge requests
   * Implement more query logic (except filter, not equal filters, having, ...)
   * Write unit tests
   * Make queries abortable, make filter autocompletes abortable, ...
   * Refactor SplitTile and FilterTile, reuse components from from the Explore view_menu
   * Port visualization settings and dialogs from the Explore view
   * Support more visualizations
   * Keyboard shortcuts for everything
   
   
   
 
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services