fix(core): Remove configure button and setup redirect for mptv2 pipel…

…ine (#6644)

* fix(core): Remove configure button and setup redirect for mptv2 pipeline

app/scripts/modules/core/src/domain/IExecution.ts

@@ -3,6 +3,7 @@ import { IOrchestratedItem } from './IOrchestratedItem';
 import { IExecutionTrigger } from './IExecutionTrigger';
 import { IExecutionStage, IExecutionStageSummary } from './IExecutionStage';
 import { IAuthentication } from './IAuthentication';
+import { IPipeline } from './IPipeline';
 
 export interface IExecution extends IOrchestratedItem {
   appConfig?: any;
@@ -23,6 +24,7 @@ export interface IExecution extends IOrchestratedItem {
   isStrategy?: boolean;
   name?: string;
   pipelineConfigId?: string;
+  pipelineConfig?: IPipeline;
   searchField?: string;
   stageSummaries?: IExecutionStageSummary[]; // added by transformer
   stageWidth?: string; // added by transformer

app/scripts/modules/core/src/domain/IPipeline.ts

@@ -16,6 +16,7 @@ export interface IPipeline {
   limitConcurrent: boolean;
   name: string;
   respectQuietPeriod?: boolean;
+  schema?: string;
   stages: IStage[];
   strategy: boolean;
   triggers: ITrigger[];

app/scripts/modules/core/src/pipeline/config/CreatePipeline.tsx

@@ -4,6 +4,8 @@ import { get } from 'lodash';
 import { Dropdown } from 'react-bootstrap';
 
 import { Application } from 'core/application';
+import { IPipeline } from 'core/domain';
+import { PipelineTemplateV2Service } from 'core/pipeline';
 import { ReactInjector } from 'core/reactShims';
 import { Tooltip } from 'core/presentation/Tooltip';
 
@@ -20,7 +22,12 @@ export class CreatePipeline extends React.Component<ICreatePipelineProps> {
 
   public render() {
     const { application } = this.props;
-    const hasPipelineConfigs = get(application, 'pipelineConfigs.data', []).length > 0;
+
+    const pipelineConfigs = get(application, 'pipelineConfigs.data', []).filter(
+      (pipelineConfig: IPipeline) => !PipelineTemplateV2Service.isV2PipelineConfig(pipelineConfig),
+    );
+    const hasPipelineConfigs = pipelineConfigs.length > 0;
+
     const hasStrategyConfigs = get(application, 'strategyConfigs.data', []).length > 0;
     const header = !(hasPipelineConfigs || hasStrategyConfigs) ? (
       <li className="dropdown-header" style={{ marginTop: 0 }}>
@@ -56,10 +63,9 @@ export class CreatePipeline extends React.Component<ICreatePipelineProps> {
         </Dropdown.Toggle>
         <Dropdown.Menu className="dropdown-menu">
           {header}
-          {hasPipelineConfigs &&
-            application.pipelineConfigs.data.map((pipeline: any) => (
-              <Pipeline key={pipeline.id} pipeline={pipeline} type="pipeline" />
-            ))}
+          {pipelineConfigs.map((pipeline: IPipeline) => (
+            <Pipeline key={pipeline.id} pipeline={pipeline} type="pipeline" />
+          ))}
           {hasStrategyConfigs &&
             application.strategyConfigs.data.map((pipeline: any) => (
               <Pipeline key={pipeline.id} pipeline={pipeline} type="strategy" />

app/scripts/modules/core/src/pipeline/config/actions/templateJson/ShowPipelineTemplateJsonModal.tsx

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { IModalComponentProps, JsonEditor } from 'core/presentation';
 import { IPipeline, IPipelineTemplateV2 } from 'core/domain';
 import { CopyToClipboard, noop, JsonUtils } from 'core/utils';
-import { PipelineTemplateV2Service } from 'core/pipeline/config/templates/v2/pipelineTemplateV2.service';
+import { PipelineTemplateV2Service } from 'core/pipeline';
 
 import './ShowPipelineTemplateJsonModal.less';
 

app/scripts/modules/core/src/pipeline/config/pipelineConfig.controller.js

@@ -4,16 +4,18 @@ import _ from 'lodash';
 import { hri as HumanReadableIds } from 'human-readable-ids';
 
 import { PipelineTemplateReader } from './templates/PipelineTemplateReader';
+import { PipelineTemplateV2Service } from 'core/pipeline';
 
 const angular = require('angular');
 
 module.exports = angular
   .module('spinnaker.core.pipeline.config.controller', [require('@uirouter/angularjs').default])
   .controller('PipelineConfigCtrl', [
     '$scope',
+    '$state',
     '$stateParams',
     'app',
-    function($scope, $stateParams, app) {
+    function($scope, $state, $stateParams, app) {
       this.application = app;
       this.state = {
         pipelinesLoaded: false,
@@ -24,6 +26,10 @@ module.exports = angular
       this.initialize = () => {
         this.pipelineConfig = _.find(app.pipelineConfigs.data, { id: $stateParams.pipelineId });
 
+        if (this.pipelineConfig && PipelineTemplateV2Service.isV2PipelineConfig(this.pipelineConfig)) {
+          return $state.go('home.applications.application.pipelines.executions', null, { location: 'replace' });
+        }
+
         if (this.pipelineConfig && this.pipelineConfig.expectedArtifacts) {
           for (const artifact of this.pipelineConfig.expectedArtifacts) {
             if (!artifact.displayName || artifact.displayName.length === 0) {

app/scripts/modules/core/src/pipeline/config/templates/v2/pipelineTemplateV2.service.ts

@@ -22,4 +22,8 @@ export class PipelineTemplateV2Service {
       variables: [],
     };
   }
+
+  public static isV2PipelineConfig(pipelineConfig: IPipeline): boolean {
+    return pipelineConfig.schema === 'v2';
+  }
 }

app/scripts/modules/core/src/pipeline/details/SingleExecutionDetails.tsx

@@ -1,12 +1,14 @@
 import * as React from 'react';
+import { get } from 'lodash';
 import * as ReactGA from 'react-ga';
 import { Subscription } from 'rxjs';
 import { UISref } from '@uirouter/react';
 
 import { Application } from 'core/application/application.model';
-import { IExecution } from 'core/domain';
+import { IExecution, IPipeline } from 'core/domain';
 import { Execution } from 'core/pipeline/executions/execution/Execution';
 import { IScheduler, SchedulerFactory } from 'core/scheduler';
+import { PipelineTemplateV2Service } from 'core/pipeline';
 import { ReactInjector, IStateChange } from 'core/reactShims';
 import { Tooltip } from 'core/presentation';
 import { ISortFilter } from 'core/filterModel';
@@ -131,6 +133,11 @@ export class SingleExecutionDetails extends React.Component<
 
     const defaultExecutionParams = { application: app.name, executionId: execution ? execution.id : '' };
     const executionParams = ReactInjector.$state.params.executionParams || defaultExecutionParams;
+    const isFromMPTV2Pipeline = PipelineTemplateV2Service.isV2PipelineConfig(get(
+      execution,
+      'pipelineConfig',
+      {},
+    ) as IPipeline);
 
     return (
       <div style={{ width: '100%', paddingTop: 0 }}>
@@ -160,21 +167,22 @@ export class SingleExecutionDetails extends React.Component<
                       <span> stage durations</span>
                     </label>
                   </div>
-                  <Tooltip value="Navigate to Pipeline Configuration">
-                    <UISref
-                      to="^.pipelineConfig"
-                      params={{ application: this.props.app.name, pipelineId: this.state.execution.pipelineConfigId }}
-                    >
-                      <button
-                        className="btn btn-sm btn-default"
-                        onClick={this.handleConfigureClicked}
-                        style={{ marginRight: '5px' }}
+                  {!isFromMPTV2Pipeline && (
+                    <Tooltip value="Navigate to Pipeline Configuration">
+                      <UISref
+                        to="^.pipelineConfig"
+                        params={{ application: this.props.app.name, pipelineId: this.state.execution.pipelineConfigId }}
                       >
-                        <span className="glyphicon glyphicon-cog" />
-                        <span className="visible-md-inline visible-lg-inline"> Configure</span>
-                      </button>
-                    </UISref>
-                  </Tooltip>
+                        <button
+                          className="btn btn-sm btn-default single-execution-details__configure"
+                          onClick={this.handleConfigureClicked}
+                        >
+                          <span className="glyphicon glyphicon-cog" />
+                          <span className="visible-md-inline visible-lg-inline"> Configure</span>
+                        </button>
+                      </UISref>
+                    </Tooltip>
+                  )}
                 </div>
               </div>
             </div>

app/scripts/modules/core/src/pipeline/details/singleExecutionDetails.less

@@ -1,5 +1,3 @@
-.single-execution-details {
-  .checkbox {
-    padding: 0 1em;
-  }
+.single-execution-details__configure {
+  margin: 0 5px 0 1em;
 }

app/scripts/modules/core/src/pipeline/executions/executionGroup/ExecutionGroup.tsx

@@ -17,6 +17,7 @@ import { IRetryablePromise } from 'core/utils/retryablePromise';
 import { TriggersTag } from 'core/pipeline/triggers/TriggersTag';
 import { AccountTag } from 'core/account';
 import { ModalInjector, ReactInjector } from 'core/reactShims';
+import { PipelineTemplateV2Service } from 'core/pipeline';
 import { Spinner } from 'core/widgets/spinners/Spinner';
 
 import './executionGroup.less';
@@ -55,6 +56,8 @@ export class ExecutionGroup extends React.Component<IExecutionGroupProps, IExecu
     const pipelineConfig = find(this.props.application.pipelineConfigs.data, {
       name: this.props.group.heading,
     }) as IPipeline;
+
+    const hasNonMPTV2PipelineConfig = pipelineConfig && !PipelineTemplateV2Service.isV2PipelineConfig(pipelineConfig);
     const sectionCacheKey = this.getSectionCacheKey();
 
     this.state = {
@@ -66,7 +69,7 @@ export class ExecutionGroup extends React.Component<IExecutionGroupProps, IExecu
         CollapsibleSectionStateCache.isExpanded(sectionCacheKey),
       poll: null,
       canTriggerPipelineManually: !!pipelineConfig,
-      canConfigure: !!(pipelineConfig || strategyConfig),
+      canConfigure: !!(hasNonMPTV2PipelineConfig || strategyConfig),
       showAccounts: ExecutionState.filterModel.asFilterModel.sortFilter.groupBy === 'name',
       pipelineConfig,
       showOverflowAccountTags: false,

app/scripts/modules/core/src/pipeline/index.ts

@@ -5,6 +5,7 @@ export * from './config/stages/stageConstants';
 export * from './config/PipelineRegistry';
 export * from './config/stages/templates';
 export * from './config/services/PipelineConfigService';
+export * from './config/templates/v2/pipelineTemplateV2.service';
 export * from './config/triggers/ITriggerConfigProps';
 export * from './config/triggers/RunAsUser';
 export * from './config/validation/PipelineConfigValidator';

app/scripts/modules/core/src/pipeline/service/execution.service.ts

@@ -104,8 +104,18 @@ export class ExecutionService {
     return API.one('pipelines', executionId)
       .get()
       .then((execution: IExecution) => {
+        const { application, name } = execution;
         execution.hydrated = true;
         this.cleanExecutionForDiffing(execution);
+        if (application && name) {
+          return API.one('applications', application, 'pipelineConfigs', name)
+            .get()
+            .then((pipelineConfig: IPipeline) => {
+              execution.pipelineConfig = pipelineConfig;
+              return execution;
+            })
+            .catch(() => execution);
+        }
         return execution;
       });
   }