diff --git a/client/app/scripts/actions/app-actions.js b/client/app/scripts/actions/app-actions.js index 755375af7..ebbfdaebd 100644 --- a/client/app/scripts/actions/app-actions.js +++ b/client/app/scripts/actions/app-actions.js @@ -1,5 +1,4 @@ import debug from 'debug'; -import { find } from 'lodash'; import { fromJS } from 'immutable'; import ActionTypes from '../constants/action-types'; @@ -827,30 +826,6 @@ export function shutdown() { }; } -export function getImagesForService(orgId, serviceId) { - return (dispatch, getState, { api }) => { - dispatch({ - type: ActionTypes.REQUEST_SERVICE_IMAGES, - serviceId - }); - - // Use the fluxv2 api - api.getFluxImages(orgId, serviceId) - .then((services) => { - dispatch({ - type: ActionTypes.RECEIVE_SERVICE_IMAGES, - service: find(services, s => s.ID === serviceId), - serviceId - }); - }, ({ errors }) => { - dispatch({ - type: ActionTypes.RECEIVE_SERVICE_IMAGES, - errors - }); - }); - }; -} - export function setMonitorState(monitor) { return { type: ActionTypes.MONITOR_STATE, diff --git a/client/app/scripts/components/app.js b/client/app/scripts/components/app.js index e3c0ccf64..233791066 100644 --- a/client/app/scripts/components/app.js +++ b/client/app/scripts/components/app.js @@ -201,7 +201,9 @@ class App extends React.Component { {showingTroubleshootingMenu && } - {showingDetails &&
} + {showingDetails &&
}
{timeTravelSupported && this.props.renderTimeTravel()} @@ -263,11 +265,13 @@ function mapStateToProps(state) { App.propTypes = { renderTimeTravel: PropTypes.func, + renderNodeDetailsExtras: PropTypes.func, monitor: PropTypes.bool, }; App.defaultProps = { renderTimeTravel: () => , + renderNodeDetailsExtras: () => null, monitor: false, }; diff --git a/client/app/scripts/components/details-card.js b/client/app/scripts/components/details-card.js index 106b24007..31974fa98 100644 --- a/client/app/scripts/components/details-card.js +++ b/client/app/scripts/components/details-card.js @@ -60,6 +60,7 @@ class DetailsCard extends React.Component { key={this.props.id} nodeId={this.props.id} mounted={this.state.mounted} + renderNodeDetailsExtras={this.props.renderNodeDetailsExtras} {...this.props} />
diff --git a/client/app/scripts/components/details.js b/client/app/scripts/components/details.js index b9eb99b75..ae442ad60 100644 --- a/client/app/scripts/components/details.js +++ b/client/app/scripts/components/details.js @@ -15,6 +15,7 @@ class Details extends React.Component { index={index} cardCount={details.size} nodeControlStatus={controlStatus.get(obj.id)} + renderNodeDetailsExtras={this.props.renderNodeDetailsExtras} {...obj} /> ))} diff --git a/client/app/scripts/components/node-details.js b/client/app/scripts/components/node-details.js index d1e0d043b..2a35795e7 100644 --- a/client/app/scripts/components/node-details.js +++ b/client/app/scripts/components/node-details.js @@ -19,8 +19,6 @@ import NodeDetailsInfo from './node-details/node-details-info'; import NodeDetailsRelatives from './node-details/node-details-relatives'; import NodeDetailsTable from './node-details/node-details-table'; import Warning from './warning'; -import CloudFeature from './cloud-feature'; -import NodeDetailsImageStatus from './node-details/node-details-image-status'; const log = debug('scope:node-details'); @@ -249,14 +247,7 @@ class NodeDetails extends React.Component { return null; })} - - - + {this.props.renderNodeDetailsExtras({ topologyId, details })} diff --git a/client/app/scripts/components/node-details/node-details-image-status.js b/client/app/scripts/components/node-details/node-details-image-status.js deleted file mode 100644 index bc51f57af..000000000 --- a/client/app/scripts/components/node-details/node-details-image-status.js +++ /dev/null @@ -1,126 +0,0 @@ -import React from 'react'; -import { connect } from 'react-redux'; -import find from 'lodash/find'; -import map from 'lodash/map'; -import { CircularProgress } from 'weaveworks-ui-components'; - -import { getImagesForService } from '../../actions/app-actions'; - -const topologyWhitelist = ['kube-controllers']; - -function newImagesAvailable(images, currentId) { - const current = find(images, i => i.ID === currentId); - - if (current) { - const timestamp = new Date(current.CreatedAt); - return Boolean(find(images, i => new Date(i.CreatedAt) > timestamp)); - } - - return false; -} - - -class NodeDetailsImageStatus extends React.PureComponent { - constructor(props, context) { - super(props, context); - - this.getImagesUrl = this.getImagesUrl.bind(this); - } - - componentDidMount() { - if (this.shouldRender() && this.props.serviceId) { - this.props.getImagesForService(this.props.params.orgId, this.props.serviceId); - } - } - - getImagesUrl() { - const { serviceId, params } = this.props; - return `/flux/${params.orgId}/services/${encodeURIComponent(serviceId)}`; - } - - shouldRender() { - const { pseudo, topologyId } = this.props; - return !pseudo && topologyId && topologyWhitelist.includes(topologyId); - } - - renderImages() { - const { errors, containers, isFetching } = this.props; - const error = !isFetching && errors; - - if (isFetching) { - return ( -
- ); - } - - if (error) { - return ( -

Error: {JSON.stringify(map(errors, 'message'))}

- ); - } - - if (!containers) { - return 'No service images found'; - } - - return ( -
- {containers.map((container) => { - const statusText = newImagesAvailable(container.Available, container.Current.ID) - ? New image(s) available - : 'Image up to date'; - - return ( -
-
{container.Name}
-
{statusText}
-
- ); - })} -
- ); - } - - render() { - const { containers } = this.props; - - if (!this.shouldRender()) { - return null; - } - - return ( -
-
- Container image status - {containers && - - } - -
- {this.renderImages()} -
- ); - } -} - -function mapStateToProps({ scope }, { metadata, name }) { - const namespace = find(metadata, d => d.id === 'kubernetes_namespace'); - const nodeType = find(metadata, d => d.id === 'kubernetes_node_type'); - const serviceId = (namespace && nodeType) ? `${namespace.value}:${nodeType.value.toLowerCase()}/${name}` : null; - const { containers, isFetching, errors } = scope.getIn(['serviceImages', serviceId]) || {}; - - return { - isFetching, - errors, - containers, - serviceId - }; -} - -export default connect(mapStateToProps, { getImagesForService })(NodeDetailsImageStatus); diff --git a/client/app/scripts/constants/action-types.js b/client/app/scripts/constants/action-types.js index f2931007d..3323c862c 100644 --- a/client/app/scripts/constants/action-types.js +++ b/client/app/scripts/constants/action-types.js @@ -48,9 +48,7 @@ const ACTION_TYPES = [ 'RECEIVE_NODES_FOR_TOPOLOGY', 'RECEIVE_NODES', 'RECEIVE_NOT_FOUND', - 'RECEIVE_SERVICE_IMAGES', 'RECEIVE_TOPOLOGIES', - 'REQUEST_SERVICE_IMAGES', 'RESET_LOCAL_VIEW_STATE', 'RESUME_TIME', 'ROUTE_TOPOLOGY', diff --git a/client/app/scripts/reducers/__tests__/root-test.js b/client/app/scripts/reducers/__tests__/root-test.js index ad58be14d..39d820232 100644 --- a/client/app/scripts/reducers/__tests__/root-test.js +++ b/client/app/scripts/reducers/__tests__/root-test.js @@ -731,37 +731,4 @@ describe('RootReducer', () => { constructEdgeId('def456', 'abc123') ]); }); - it('receives images for a service', () => { - const action = { - type: ActionTypes.RECEIVE_SERVICE_IMAGES, - serviceId: 'cortex/configs', - service: { - ID: 'cortex/configs', - Containers: [{ - Available: [{ - ID: 'quay.io/weaveworks/cortex-configs:master-1ca6274a', - CreatedAt: '2017-04-26T13:50:13.284736173Z' - }], - Current: { ID: 'quay.io/weaveworks/cortex-configs:master-1ca6274a' }, - Name: 'configs' - }] - } - }; - - const nextState = reducer(initialState, action); - expect(nextState.getIn(['serviceImages', 'cortex/configs'])).toEqual({ - isFetching: false, - errors: undefined, - containers: [{ - Name: 'configs', - Current: { - ID: 'quay.io/weaveworks/cortex-configs:master-1ca6274a' - }, - Available: [{ - ID: 'quay.io/weaveworks/cortex-configs:master-1ca6274a', - CreatedAt: '2017-04-26T13:50:13.284736173Z' - }] - }] - }); - }); }); diff --git a/client/app/scripts/reducers/root.js b/client/app/scripts/reducers/root.js index 823335dd2..7ebfee1b1 100644 --- a/client/app/scripts/reducers/root.js +++ b/client/app/scripts/reducers/root.js @@ -89,7 +89,6 @@ export const initialState = makeMap({ viewport: makeMap({ width: 0, height: 0 }), websocketClosed: false, zoomCache: makeMap(), - serviceImages: makeMap() }); function calcSelectType(topology) { @@ -749,22 +748,6 @@ export function rootReducer(state = initialState, action) { return clearNodes(state); } - case ActionTypes.REQUEST_SERVICE_IMAGES: { - return state.setIn(['serviceImages', action.serviceId], { - isFetching: true - }); - } - - case ActionTypes.RECEIVE_SERVICE_IMAGES: { - const { service, errors, serviceId } = action; - - return state.setIn(['serviceImages', serviceId], { - isFetching: false, - containers: service ? service.Containers : null, - errors - }); - } - case ActionTypes.MONITOR_STATE: { return state.set('monitor', action.monitor); }