handle cache being refreshed status

client/components/lookup/index.jsx

@@ -10,7 +10,6 @@ import {connect} from 'react-redux'
 import {replace} from 'react-router-redux'
 
 import {setLookupQueryValue} from './actions'
-import {makeSearchQueryProps} from './query'
 
 import LookupResults from './results'
 import SearchInput from 'components/search-input'
@@ -46,9 +45,15 @@ class Lookup extends React.Component {
   }
 
   doLookup(q) {
+    // Make path
+    const destination = {
+      pathname: "/search",
+      search: `?q=${q}`
+    };
+    
     // Set lookup params
     this.props.dispatch(setLookupQueryValue(q));
-    this.debouncedDispatch(replace(makeSearchQueryProps(q)));
+    this.debouncedDispatch(replace(destination));
   }
 
   componentDidMount() {

client/components/lookup/page.jsx

@@ -9,7 +9,7 @@ import LookupSummary from 'components/lookup/results-summary'
 
 import Content from 'components/content'
 
-class LookupView extends React.Component {
+class _LookupView extends React.Component {
   render() {
     if (this.props.enabled == false) {
       return null;
@@ -28,26 +28,24 @@ class LookupView extends React.Component {
   }
 }
 
-const LookupWidget = connect(
+const LookupView = connect(
   (state) => {
     return {
       enabled: state.config.prefix_lookup_enabled
     }
   }
-)(LookupView);
+)(_LookupView);
 
 
-export default class Welcome extends React.Component {
+export default class LookupPage extends React.Component {
   render() {
     return (
       <div className="welcome-page">
        <PageHeader></PageHeader>
        <p></p>
-       <LookupWidget />
-
+       <LookupView />
       </div>
     );
   }
 }
 
-

client/components/lookup/pagination.jsx

@@ -21,6 +21,7 @@ import {connect} from 'react-redux'
 import {Link} from 'react-router'
 import {push} from 'react-router-redux'
 
+
 /* 
  * Maybe this can be customized and injected into 
  * the PageLink component.

client/components/lookup/query.jsx

@@ -1,11 +0,0 @@
-
-import {urlEscape} from 'components/utils/query'
-
-export const makeSearchQueryProps = function(query) {
-  query = urlEscape(query); 
-  return {
-    pathname: '/search',
-    search: `?q=${query}`
-  }
-}
-

client/components/lookup/results-summary.jsx

@@ -1,8 +1,39 @@
 
 import React from 'react'
 import {connect} from 'react-redux'
+import moment from 'moment'
+
 import RelativeTime from 'components/relativetime'
 
+
+
+const RefreshState = function(props) {
+  if (!props.cachedAt || !props.cacheTtl) {
+    return null;
+  }
+
+  const cachedAt = moment.utc(props.cachedAt);
+  const cacheTtl = moment.utc(props.cacheTtl);
+
+  if (cacheTtl.isBefore(moment.utc())) {
+    // This means cache is currently being rebuilt
+    return (
+      <li>
+        Routes cache was built <b><RelativeTime value={cachedAt} /> </b>
+        and is currently being refreshed. 
+      </li>
+    );
+
+  }
+
+  return (
+    <li>
+      Routes cache was built <b><RelativeTime value={cachedAt} /> </b>
+      and will be refreshed <b><RelativeTime value={cacheTtl} /></b>.
+    </li>
+  );
+}
+
 class ResultsBox extends React.Component {
 
   render() {
@@ -23,9 +54,8 @@ class ResultsBox extends React.Component {
               and <b>{this.props.totalFiltered}</b> filtered routes.
             </li>
             <li>Query took <b>{queryDuration} ms</b> to complete.</li>
-            <li>Routes cache was built <b><RelativeTime value={cachedAt} /> </b>
-                and will be refreshed <b><RelativeTime value={cacheTtl} /></b>.
-            </li>
+            <RefreshState cachedAt={this.props.cachedAt}
+                          cacheTtl={this.props.cacheTtl} />
           </ul>
         </div>
       </div>