Redirect to source page if we receive a bad source

ui/src/CheckDataNodes.js

@@ -1,5 +1,5 @@
 import React, {PropTypes} from 'react';
-import NoClusterError from 'shared/components/NoClusterError';
+import {withRouter} from 'react-router';
 import {getSources} from 'src/shared/apis';
 
 const {bool, number, string, node, func, shape} = PropTypes;
@@ -14,6 +14,9 @@ const CheckDataNodes = React.createClass({
     params: PropTypes.shape({
       sourceID: PropTypes.string,
     }).isRequired,
+    router: PropTypes.shape({
+      push: PropTypes.func.isRequired,
+    }).isRequired,
   },
 
   contextTypes: {
@@ -28,14 +31,21 @@ const CheckDataNodes = React.createClass({
   getInitialState() {
     return {
       isFetching: true,
-      sources: [],
+      source: null,
     };
   },
 
   componentDidMount() {
     getSources().then(({data: {sources}}) => {
+      const {sourceID} = this.props.params;
+      const source = sources.find((s) => s.id === sourceID);
+
+      if (!source) { // would be great to check source.status or similar here
+        return this.props.router.push(`/?error="bad id: ${sourceID}"`);
+      }
+
       this.setState({
-        sources,
+        source,
         isFetching: false,
       });
     }).catch((err) => {
@@ -49,19 +59,10 @@ const CheckDataNodes = React.createClass({
       return <div className="page-spinner" />;
     }
 
-    const {sourceID} = this.props.params;
-    const {sources} = this.state;
-    const source = sources.find((s) => s.id === sourceID);
-    if (!source) {
-      // the id in the address bar doesn't match a source we know about
-      // ask paul? go to source selection page?
-      return <NoClusterError />;
-    }
-
     return this.props.children && React.cloneElement(this.props.children, Object.assign({}, this.props, {
-      source,
+      source: this.state.source,
     }));
   },
 });
 
-export default CheckDataNodes;
+export default withRouter(CheckDataNodes);

ui/src/select_source/containers/SelectSourcePage.js

@@ -8,6 +8,11 @@ export const SelectSourcePage = React.createClass({
     router: PropTypes.shape({
       push: PropTypes.func.isRequired,
     }).isRequired,
+    location: PropTypes.shape({
+      query: PropTypes.shape({
+        error: PropTypes.string,
+      }).isRequired,
+    }).isRequired,
   },
 
   getInitialState() {
@@ -44,6 +49,7 @@ export const SelectSourcePage = React.createClass({
   },
 
   render() {
+    const error = !!this.props.location.query.error;
     return (
       <div id="select-source-page">
         <div className="container">
@@ -54,6 +60,7 @@ export const SelectSourcePage = React.createClass({
                   <h2 className="deluxe">Welcome to Chronograf</h2>
                 </div>
                 <div className="panel-body">
+                  {error ? <p className="alert alert-danger">bad id bro</p> : null}
                   <form onSubmit={this.handleSelectSource}>
                     <div className="form-group col-sm-12">
                       <h4>Select an InfluxDB server to connect to</h4>