Use firstSeenConnectAt for earliestTimestamp in Time Travel.

client/app/scripts/actions/app-actions.js

@@ -618,14 +618,15 @@ export function receiveNodes(nodes) {
 
 export function jumpToTime(timestamp) {
   return (dispatch, getState) => {
+    const getScopeState = () => getState().scope || getState();
     dispatch({
       type: ActionTypes.JUMP_TO_TIME,
       timestamp,
     });
-    getTopologies(getState, dispatch);
-    getNodes(getState, dispatch);
-    if (isResourceViewModeSelector(getState())) {
-      getResourceViewNodesSnapshot(getState(), dispatch);
+    getNodes(getScopeState, dispatch);
+    getTopologies(getScopeState, dispatch);
+    if (isResourceViewModeSelector(getScopeState())) {
+      getResourceViewNodesSnapshot(getScopeState(), dispatch);
     }
   };
 }
@@ -640,14 +641,15 @@ export function receiveNodesForTopology(nodes, topologyId) {
 
 export function receiveTopologies(topologies) {
   return (dispatch, getState) => {
-    const firstLoad = !getState().get('topologiesLoaded');
+    const getScopeState = () => getState().scope || getState();
+    const firstLoad = !getScopeState().get('topologiesLoaded');
     dispatch({
       type: ActionTypes.RECEIVE_TOPOLOGIES,
       topologies
     });
-    getNodes(getState, dispatch);
+    getNodes(getScopeState, dispatch);
     // Populate search matches on first load
-    const state = getState();
+    const state = getScopeState();
     if (firstLoad && state.get('searchQuery')) {
       dispatch(focusSearch());
     }

client/app/scripts/components/app.js

@@ -11,6 +11,7 @@ import Logo from './logo';
 import Footer from './footer';
 import Sidebar from './sidebar';
 import HelpPanel from './help-panel';
+import CloudFeature from './cloud-feature';
 import TroubleshootingMenu from './troubleshooting-menu';
 import Search from './search';
 import Status from './status';
@@ -191,7 +192,10 @@ class App extends React.Component {
           {showingDetails && <Details />}
 
           <div className="header">
-            <TimeTravelWrapper />
+            <CloudFeature alwaysShow>
+              <TimeTravelWrapper />
+            </CloudFeature>
+
             <div className="selectors">
               <div className="logo">
                 {!isIframe &&

client/app/scripts/components/time-travel-wrapper.js

@@ -62,7 +62,8 @@ class TimeTravelWrapper extends React.Component {
       <TimeTravel
         visible={visible}
         timestamp={timestamp || moment()}
-        onChange={this.changeTimestamp}
+        earliestTimestamp={this.props.earliestTimestamp}
+        onChangeTimestamp={this.changeTimestamp}
         onTimestampInputEdit={this.trackTimestampEdit}
         onTimestampLabelClick={this.trackTimelineClick}
         onTimelineZoom={this.trackTimelineZoom}
@@ -72,12 +73,24 @@ class TimeTravelWrapper extends React.Component {
   }
 }
 
-function mapStateToProps(state) {
+function mapStateToProps(state, { params }) {
+  const scopeState = state.scope || state;
+  let firstSeenConnectedAt;
+
+  // If we're in the Weave Cloud context, use firstSeeConnectedAt as the earliest timestamp.
+  if (state.root && state.root.instances) {
+    const serviceInstance = state.root.instances[params && params.orgId];
+    if (serviceInstance && serviceInstance.firstSeenConnectedAt) {
+      firstSeenConnectedAt = moment(serviceInstance.firstSeenConnectedAt);
+    }
+  }
+
   return {
-    visible: state.get('showingTimeTravel'),
-    topologyViewMode: state.get('topologyViewMode'),
-    currentTopology: state.get('currentTopology'),
-    timestamp: state.get('pausedAt'),
+    visible: scopeState.get('showingTimeTravel'),
+    topologyViewMode: scopeState.get('topologyViewMode'),
+    currentTopology: scopeState.get('currentTopology'),
+    earliestTimestamp: firstSeenConnectedAt,
+    timestamp: scopeState.get('pausedAt'),
   };
 }
 

client/package.json

@@ -44,7 +44,7 @@
     "reselect": "3.0.1",
     "reselect-map": "1.0.3",
     "styled-components": "^2.2.1",
-    "weaveworks-ui-components": "git+https://github.com/weaveworks/ui-components.git#v0.1.47",
+    "weaveworks-ui-components": "git+https://github.com/weaveworks/ui-components.git#v0.1.51",
     "whatwg-fetch": "2.0.3",
     "xterm": "2.9.2"
   },

client/yarn.lock

@@ -6666,9 +6666,9 @@ wd@^0.4.0:
     underscore.string "~3.0.3"
     vargs "~0.1.0"
 
-"weaveworks-ui-components@git+https://github.com/weaveworks/ui-components.git#v0.1.47":
-  version "0.1.47"
-  resolved "git+https://github.com/weaveworks/ui-components.git#1a112eef36f282d754502f77ab798381f5d3a995"
+"weaveworks-ui-components@git+https://github.com/weaveworks/ui-components.git#v0.1.51":
+  version "0.1.51"
+  resolved "git+https://github.com/weaveworks/ui-components.git#a08ea6a026f4cd58c66d4965838cf04d074604a4"
   dependencies:
     babel-cli "^6.18.0"
     babel-plugin-transform-export-extensions "6.8.0"