WIP fixing the explorer

mock/handlers.go

@@ -100,11 +100,17 @@ func (m *Handler) Explorations(ctx context.Context, params op.GetSourcesIDUsersU
 	}
 	res := &models.Explorations{}
 	for _, e := range exs {
+		rel := "self"
+		href := "/chronograf/v1/source/1/users/1/explorations/1"
 		res.Explorations = append(res.Explorations, &models.Exploration{
 			Data:      e.Data,
 			Name:      e.Name,
 			UpdatedAt: strfmt.DateTime(e.UpdatedAt),
 			CreatedAt: strfmt.DateTime(e.CreatedAt),
+			Link: &models.Link{
+				Rel:  &rel,
+				Href: &href,
+			},
 		},
 		)
 	}

mock/mock.go

@@ -19,10 +19,8 @@ func NewExplorationStore(nowFunc func() time.Time) mrfusion.ExplorationStore {
 		db:      map[int]mrfusion.Exploration{},
 	}
 	e.db[1] = mrfusion.Exploration{
-		ID:        1,
 		Name:      "Ferdinand Magellan",
-		UserID:    1,
+		Data:      "{\"panels\":{\"123\":{\"id\":\"123\",\"queryIds\":[\"456\"]}},\"queryConfigs\":{\"456\":{\"id\":\"456\",\"database\":null,\"measurement\":null,\"retentionPolicy\":null,\"fields\":[],\"tags\":{},\"groupBy\":{\"time\":null,\"tags\":[]},\"areTagsAccepted\":true,\"rawText\":null}}}",
-		Data:      `"{\"panels\":{\"123\":{\"id\":\"123\",\"queryIds\":[\"456\"]}},\"queryConfigs\":{\"456\":{\"id\":\"456\",\"database\":null,\"measurement\":null,\"retentionPolicy\":null,\"fields\":[],\"tags\":{},\"groupBy\":{\"time\":null,\"tags\":[]},\"areTagsAccepted\":true,\"rawText\":null}}}"`,
 		CreatedAt: nowFunc(),
 		UpdatedAt: nowFunc(),
 	}

models/exploration.go

@@ -15,7 +15,6 @@ import (
 swagger:model Exploration
 */
 type Exploration struct {
-
 	/* created at
 	 */
 	CreatedAt strfmt.DateTime `json:"created_at,omitempty"`

ui/src/CheckDataNodes.js

@@ -47,13 +47,13 @@ const CheckDataNodes = React.createClass({
     }
 
     const {source} = this.state;
-    if (!source || !source.links.proxy) {
+    if (!source) {
       // this should probably be changed....
       return <NoClusterError />;
     }
 
     return this.props.children && React.cloneElement(this.props.children, Object.assign({}, this.props, {
-      proxyLink: source.links.proxy,
+      source,
     }));
   },
 });

ui/src/chronograf/actions/view/index.js

@@ -231,16 +231,15 @@ export function fetchExplorers({sourceLink, userID, explorerID, push}) {
   return (dispatch) => {
     dispatch({type: 'FETCH_EXPLORERS'});
     AJAX({
-      url: `/chronograf/v1/sources/1/users/1/explorations`,
+      url: `${sourceLink}/users/${userID}/explorations`,
     }).then(({data: {explorations}}) => {
-      debugger;
       const explorers = explorations.map(parseRawExplorer);
       dispatch(loadExplorers(explorers));
 
       // Create a new explorer session for a user if they don't have any
       // saved (e.g. when they visit for the first time).
       if (!explorers.length) {
-        dispatch(createExplorer(clusterID, push));
+        dispatch(createExplorer(push));
         return;
       }
 
@@ -250,7 +249,7 @@ export function fetchExplorers({sourceLink, userID, explorerID, push}) {
       if (!explorerID) {
         const explorer = _.maxBy(explorers, (ex) => ex.updated_at);
         dispatch(loadExplorer(explorer));
-        push(`/chronograf/data_explorer/${explorer.id}`);
+        push(`/chronograf/data_explorer/${encodeURIComponent(explorer.link.href)}`);
         return;
       }
 

ui/src/chronograf/containers/App.js

@@ -6,7 +6,12 @@ import DataExplorer from './DataExplorer';
 
 const App = React.createClass({
   propTypes: {
-    proxyLink: PropTypes.string.isRequired,
+    source: PropTypes.shape({
+      links: PropTypes.shape({
+        proxy: PropTypes.string.isRequired,
+        self: PropTypes.string.isRequired,
+      }).isRequired,
+    }).isRequired,
     fetchExplorers: PropTypes.func.isRequired,
     router: PropTypes.shape({
       push: PropTypes.func.isRequired,
@@ -19,8 +24,8 @@ const App = React.createClass({
   componentDidMount() {
     const {explorerID} = this.props.params;
     this.props.fetchExplorers({
-      sourceLink: 'linkgoesheres', // source.links.self
+      sourceLink: this.props.source.links.self,
-      userID: 1, // userID
+      userID: 1, // TODO: get the userID
       explorerID: Number(explorerID),
       push: this.props.router.push,
     });
@@ -30,7 +35,7 @@ const App = React.createClass({
     const {explorerID} = this.props.params;
     return (
       <div className="data-explorer-container">
-        <DataExplorer proxyLink={this.props.proxyLink} explorerID={Number(explorerID)} />
+        <DataExplorer source={this.props.source} explorerID={Number(explorerID)} />
       </div>
     );
   },

ui/src/chronograf/containers/DataExplorer.js

@@ -16,14 +16,18 @@ import {
 
 const DataExplorer = React.createClass({
   propTypes: {
-    proxyLink: PropTypes.string.isRequired,
+    source: PropTypes.shape({
+      links: PropTypes.shape({
+        proxy: PropTypes.string.isRequired,
+        self: PropTypes.string.isRequired,
+      }).isRequired,
+    }).isRequired,
     timeRange: PropTypes.shape({
       upper: PropTypes.string,
       lower: PropTypes.string,
     }).isRequired,
     explorers: PropTypes.shape({}).isRequired,
     explorerID: PropTypes.number.isRequired,
-    clusterID: PropTypes.string.isRequired,
     setTimeRange: PropTypes.func.isRequired,
     createExplorer: PropTypes.func.isRequired,
     chooseExplorer: PropTypes.func.isRequired,
@@ -32,11 +36,16 @@ const DataExplorer = React.createClass({
   },
 
   childContextTypes: {
-    proxyLink: PropTypes.string,
+    source: PropTypes.shape({
+      links: PropTypes.shape({
+        proxy: PropTypes.string.isRequired,
+        self: PropTypes.string.isRequired,
+      }).isRequired,
+    }).isRequired,
   },
 
   getChildContext() {
-    return {proxyLink: this.props.proxyLink};
+    return {source: this.props.source};
   },
 
   getInitialState() {