feat(core): adds ability to define a dockerInsight link (#4994)

app/scripts/modules/core/src/config/settings.ts

@@ -42,6 +42,11 @@ export interface IFeatures {
   [key: string]: any;
 }
 
+export interface IDockerInsightSettings {
+  enabled: boolean;
+  url: string;
+}
+
 export interface ISpinnakerSettings {
   [key: string]: any;
 
@@ -83,6 +88,7 @@ export interface ISpinnakerSettings {
   resetToOriginal: () => void;
   searchVersion: 1 | 2;
   triggerTypes: string[];
+  dockerInsights: IDockerInsightSettings;
 }
 
 export const SETTINGS: ISpinnakerSettings = (<any>window).spinnakerSettings;
@@ -92,6 +98,7 @@ SETTINGS.feature = SETTINGS.feature || {};
 SETTINGS.analytics = SETTINGS.analytics || {};
 SETTINGS.providers = SETTINGS.providers || {};
 SETTINGS.defaultTimeZone = SETTINGS.defaultTimeZone || 'America/Los_Angeles';
+SETTINGS.dockerInsights = SETTINGS.dockerInsights || {enabled:false, url:''};
 
 // A helper to make resetting settings to steady state after running tests easier
 const originalSettings: ISpinnakerSettings = cloneDeep(SETTINGS);

app/scripts/modules/core/src/serverGroup/ServerGroup.tsx

@@ -14,12 +14,19 @@ import { ScrollToService } from 'core/utils';
 import { ISortFilter } from 'core/filterModel';
 
 import { ServerGroupHeader } from './ServerGroupHeader';
+import { SETTINGS } from 'core';
 
 export interface JenkinsViewModel {
   number: number;
   href?: string;
 }
 
+export interface DockerViewModel {
+  image: string;
+  tag: string;
+  href?: string;
+}
+
 export interface IServerGroupProps {
   cluster: string;
   serverGroup: IServerGroup;
@@ -31,6 +38,7 @@ export interface IServerGroupProps {
 
 export interface IServerGroupState {
   jenkins: JenkinsViewModel;
+  docker: DockerViewModel;
   instances: IInstance[];
   images?: string;
 
@@ -54,9 +62,11 @@ export class ServerGroup extends React.Component<IServerGroupProps, IServerGroup
     const isSelected = this.isSelected(serverGroup);
     const isMultiSelected = this.isMultiSelected(props.sortFilter.multiselect, serverGroup);
     const jenkinsConfig = serverGroup.buildInfo && serverGroup.buildInfo.jenkins;
+    const dockerConfig = serverGroup.buildInfo && serverGroup.buildInfo.docker;
 
     let jenkins: JenkinsViewModel = null;
     let images: string = null;
+    let docker: DockerViewModel = null;
 
     if (jenkinsConfig && (jenkinsConfig.host || jenkinsConfig.fullUrl || serverGroup.buildInfo.buildInfoUrl)) {
       const fromHost = jenkinsConfig.host && [jenkinsConfig.host + 'job', jenkinsConfig.name, jenkinsConfig.number, ''].join('/');
@@ -67,6 +77,12 @@ export class ServerGroup extends React.Component<IServerGroupProps, IServerGroup
         number: jenkinsConfig.number,
         href: fromBuildInfo || fromFullUrl || fromHost,
       };
+    } else if(SETTINGS.dockerInsights.enabled && dockerConfig){
+      docker = {
+        tag: dockerConfig.tag,
+        image: dockerConfig.image,
+        href: SETTINGS.dockerInsights.url + 'image/' + encodeURIComponent(dockerConfig.image) + '/tag/' + dockerConfig.tag
+      };
     } else if (has(serverGroup, 'buildInfo.images')) {
       images = serverGroup.buildInfo.images.join(', ');
     }
@@ -75,6 +91,7 @@ export class ServerGroup extends React.Component<IServerGroupProps, IServerGroup
       jenkins,
       instances,
       images,
+      docker,
       isSelected,
       isMultiSelected,
     };
@@ -141,7 +158,7 @@ export class ServerGroup extends React.Component<IServerGroupProps, IServerGroup
   }
 
   public render() {
-    const { instances, images, jenkins, isSelected, isMultiSelected } = this.state;
+    const { instances, images, jenkins, docker, isSelected, isMultiSelected } = this.state;
     const { serverGroup, application, sortFilter, hasDiscovery, hasLoadBalancers } = this.props;
     const { account, region, name } = serverGroup;
     const { showAllInstances, listInstances } = sortFilter;
@@ -166,6 +183,7 @@ export class ServerGroup extends React.Component<IServerGroupProps, IServerGroup
             jenkins={jenkins}
             serverGroup={serverGroup}
             sortFilter={sortFilter}
+            docker={docker}
           />
 
           {showAllInstances && (

app/scripts/modules/core/src/serverGroup/ServerGroupHeader.tsx

@@ -4,7 +4,7 @@ import { get } from 'lodash';
 import { NgReact, ReactInjector } from 'core/reactShims';
 import { Application } from 'core/application';
 import { IServerGroup } from 'core/domain';
-import { JenkinsViewModel } from 'core/serverGroup/ServerGroup';
+import { JenkinsViewModel, DockerViewModel } from 'core/serverGroup/ServerGroup';
 import { EntityNotifications } from 'core/entityTag/notifications/EntityNotifications';
 import { HealthCounts } from 'core/healthCounts';
 import { CloudProviderLogo } from 'core/cloudProvider';
@@ -18,6 +18,7 @@ export interface IServerGroupHeaderProps {
   images?: string;
   isMultiSelected: boolean;
   jenkins: JenkinsViewModel;
+  docker: DockerViewModel;
   serverGroup: IServerGroup;
   sortFilter: ISortFilter;
 }
@@ -48,13 +49,14 @@ export class CloudProviderIcon extends React.Component<IServerGroupHeaderProps>
 
 export class SequenceAndBuildAndImages extends React.Component<IServerGroupHeaderProps> {
   public render() {
-    const { serverGroup, jenkins, images } = this.props;
+    const { serverGroup, jenkins, images, docker} = this.props;
     const serverGroupSequence = ReactInjector.namingService.getSequence(serverGroup.moniker.sequence);
     return (
       <div>
         {!!serverGroupSequence && <span className="server-group-sequence"> {serverGroupSequence}</span>}
         {(!!serverGroupSequence && (!!jenkins || !!images)) && <span>: </span>}
         {!!jenkins && <a className="build-link" href={jenkins.href} target="_blank">Build: #{jenkins.number}</a>}
+        {!!docker && <a className="build-link" href={docker.href} target="_blank">{docker.image}:{docker.tag}</a>}
         {!!images && <span>{images}</span>}
       </div>
     );