From 85ad05af5a9326e9db5e98e38b22a292d1303c24 Mon Sep 17 00:00:00 2001 From: Justin Reynolds Date: Mon, 16 Oct 2017 14:03:07 -0700 Subject: [PATCH] refactor(core): Convert executionDetailsSectionNav, executionStepDetails, statusGlyph to react (#4273) --- .../core/src/delivery/delivery.module.js | 3 +- .../details/ExecutionDetailsSectionNav.tsx | 36 ++++++++++++++ .../executionDetailsSectionNav.component.ts | 8 ++++ .../executionDetailsSectionNav.directive.js | 15 ------ .../details/executionDetailsSectionNav.html | 10 ---- .../stageFailureMessage.component.ts | 5 +- .../core/src/domain/IExecutionStage.ts | 4 +- .../modules/core/src/domain/IStageStep.ts | 5 -- .../modules/core/src/domain/ITaskStep.ts | 4 +- app/scripts/modules/core/src/domain/index.ts | 1 - .../checkPreconditionsStage.module.js | 4 +- .../cloneServerGroupStage.module.js | 4 +- .../stages/core/ExecutionStepDetails.tsx | 38 +++++++++++++++ .../core/executionStepDetails.component.ts | 8 ++++ .../stages/core/executionStepDetails.html | 18 ------- .../stages/core/executionSteps.directive.js | 24 ---------- .../config/stages/core/stage.core.module.js | 9 ---- .../config/stages/core/stage.core.module.ts | 11 +++++ .../stages/deploy/deployStage.module.js | 6 ++- .../executionWindowsStage.module.js | 3 +- .../findImageFromTagsStage.module.js | 4 +- .../stages/jenkins/jenkinsStage.module.js | 8 ++-- .../manualJudgmentStage.module.js | 4 +- .../stages/tagImage/tagImageStage.module.js | 4 +- .../stages/travis/travisStage.module.ts | 13 ++--- .../stages/webhook/webhookStage.module.ts | 15 +++--- .../core/src/pipeline/pipelines.module.js | 3 +- .../robotToHumanFilter/robotToHuman.filter.ts | 48 ++++++++++--------- .../modules/core/src/task/StatusGlyph.tsx | 32 +++++++++++++ .../core/src/task/displayableTasks.filter.ts | 20 ++++---- .../core/src/task/statusGlyph.component.ts | 8 ++++ .../core/src/task/statusGlyph.directive.js | 16 ------- .../modules/core/src/task/statusGlyph.html | 9 ---- .../modules/core/src/task/task.module.js | 3 +- 34 files changed, 229 insertions(+), 174 deletions(-) create mode 100644 app/scripts/modules/core/src/delivery/details/ExecutionDetailsSectionNav.tsx create mode 100644 app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.component.ts delete mode 100644 app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.directive.js delete mode 100644 app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.html delete mode 100644 app/scripts/modules/core/src/domain/IStageStep.ts create mode 100644 app/scripts/modules/core/src/pipeline/config/stages/core/ExecutionStepDetails.tsx create mode 100644 app/scripts/modules/core/src/pipeline/config/stages/core/executionStepDetails.component.ts delete mode 100644 app/scripts/modules/core/src/pipeline/config/stages/core/executionStepDetails.html delete mode 100644 app/scripts/modules/core/src/pipeline/config/stages/core/executionSteps.directive.js delete mode 100644 app/scripts/modules/core/src/pipeline/config/stages/core/stage.core.module.js create mode 100644 app/scripts/modules/core/src/pipeline/config/stages/core/stage.core.module.ts create mode 100644 app/scripts/modules/core/src/task/StatusGlyph.tsx create mode 100644 app/scripts/modules/core/src/task/statusGlyph.component.ts delete mode 100644 app/scripts/modules/core/src/task/statusGlyph.directive.js delete mode 100644 app/scripts/modules/core/src/task/statusGlyph.html diff --git a/app/scripts/modules/core/src/delivery/delivery.module.js b/app/scripts/modules/core/src/delivery/delivery.module.js index e2fbe1e880c..f3f4d8fccd2 100644 --- a/app/scripts/modules/core/src/delivery/delivery.module.js +++ b/app/scripts/modules/core/src/delivery/delivery.module.js @@ -7,6 +7,7 @@ import { EXECUTION_DETAILS_COMPONENT } from './details/executionDetails.componen import { EXECUTION_DETAILS_CONTROLLER } from './details/executionDetails.controller'; import { BUILD_DISPLAY_NAME_FILTER } from './executionBuild/buildDisplayName.filter'; import { EXECUTION_COMPONENT } from './executionGroup/execution/execution.component'; +import { EXECUTION_DETAILS_SECTION_NAV } from './details/executionDetailsSectionNav.component'; import { STAGE_FAILURE_MESSAGE_COMPONENT } from './stageFailureMessage/stageFailureMessage.component'; import { CORE_DELIVERY_DETAILS_SINGLEEXECUTIONDETAILS } from './details/singleExecutionDetails.component'; @@ -16,7 +17,7 @@ module.exports = angular.module('spinnaker.delivery', [ CORE_DELIVERY_DETAILS_SINGLEEXECUTIONDETAILS, EXECUTION_COMPONENT, EXECUTION_DETAILS_COMPONENT, - require('./details/executionDetailsSectionNav.directive.js').name, + EXECUTION_DETAILS_SECTION_NAV, BUILD_DISPLAY_NAME_FILTER, diff --git a/app/scripts/modules/core/src/delivery/details/ExecutionDetailsSectionNav.tsx b/app/scripts/modules/core/src/delivery/details/ExecutionDetailsSectionNav.tsx new file mode 100644 index 00000000000..270a211a3c1 --- /dev/null +++ b/app/scripts/modules/core/src/delivery/details/ExecutionDetailsSectionNav.tsx @@ -0,0 +1,36 @@ +import * as React from 'react'; +import * as ReactGA from 'react-ga'; +import { UISref, UISrefActive } from '@uirouter/react'; +import { UIRouterContext } from '@uirouter/react-hybrid'; + +import { robotToHuman } from 'core/presentation/robotToHumanFilter/robotToHuman.filter'; + +export interface IExecutionDetailsSectionNavProps { + sections: string[]; +} + +@UIRouterContext +export class ExecutionDetailsSectionNav extends React.Component { + public render() { + return ( + + ); + } +} + +const Section = (props: { section: string }): JSX.Element => { + const clicked = () => { + ReactGA.event({category: 'Pipeline', action: 'Execution details section selected', label: props.section}); + } + return ( +
  • + + + {robotToHuman(props.section)} + + +
    • + ); +} diff --git a/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.component.ts b/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.component.ts new file mode 100644 index 00000000000..7a0377a259a --- /dev/null +++ b/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.component.ts @@ -0,0 +1,8 @@ +import { module } from 'angular'; +import { react2angular } from 'react2angular'; + +import { ExecutionDetailsSectionNav } from './ExecutionDetailsSectionNav'; + +export const EXECUTION_DETAILS_SECTION_NAV = 'spinnaker.core.delivery.details.executionDetailsSectionNav'; +module(EXECUTION_DETAILS_SECTION_NAV, []) + .component('executionDetailsSectionNav', react2angular(ExecutionDetailsSectionNav, ['sections'])); diff --git a/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.directive.js b/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.directive.js deleted file mode 100644 index 26351397875..00000000000 --- a/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.directive.js +++ /dev/null @@ -1,15 +0,0 @@ -'use strict'; - -const angular = require('angular'); - -module.exports = angular.module('spinnaker.executionDetails.section.nav.directive', [ -]) - .directive('executionDetailsSectionNav', function() { - return { - restrict: 'E', - templateUrl: require('./executionDetailsSectionNav.html'), - scope: { - sections: '=', - } - }; - }); diff --git a/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.html b/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.html deleted file mode 100644 index d16d654f937..00000000000 --- a/app/scripts/modules/core/src/delivery/details/executionDetailsSectionNav.html +++ /dev/null @@ -1,10 +0,0 @@ - diff --git a/app/scripts/modules/core/src/delivery/stageFailureMessage/stageFailureMessage.component.ts b/app/scripts/modules/core/src/delivery/stageFailureMessage/stageFailureMessage.component.ts index e44f03a63ba..450572f3292 100644 --- a/app/scripts/modules/core/src/delivery/stageFailureMessage/stageFailureMessage.component.ts +++ b/app/scripts/modules/core/src/delivery/stageFailureMessage/stageFailureMessage.component.ts @@ -1,7 +1,6 @@ import { IController, module } from 'angular'; -import { IStageStep } from 'core/domain/IStageStep'; -import { IExecutionStage } from 'core/domain/IExecutionStage'; +import { IExecutionStage, ITaskStep } from 'core/domain'; interface IFailureOnChanges extends ng.IOnChangesObject { isFailed: ng.IChangesObject; @@ -14,7 +13,7 @@ class StageFailureMessageCtrl implements IController { public message: string; public messages: string[]; public stage: IExecutionStage; - public failedTask: IStageStep; + public failedTask: ITaskStep; public $onInit(): void { if (this.stage && (this.stage.isFailed || this.stage.isStopped)) { diff --git a/app/scripts/modules/core/src/domain/IExecutionStage.ts b/app/scripts/modules/core/src/domain/IExecutionStage.ts index 2b60092e867..c286c621084 100644 --- a/app/scripts/modules/core/src/domain/IExecutionStage.ts +++ b/app/scripts/modules/core/src/domain/IExecutionStage.ts @@ -3,7 +3,7 @@ import { Application } from 'core/application/application.model'; import { IExecution } from './IExecution'; import { IOrchestratedItem } from './IOrchestratedItem'; import { IStage } from './IStage'; -import { IStageStep } from './IStageStep'; +import { ITaskStep } from './ITaskStep'; export interface IRestartDetails { restartedBy: string; @@ -24,7 +24,7 @@ export interface IExecutionStage extends IOrchestratedItem, IStage { before?: IExecutionStage[]; context: IExecutionContext; id: string; - tasks: IStageStep[]; + tasks: ITaskStep[]; } export interface IExecutionStageLabelComponentProps { diff --git a/app/scripts/modules/core/src/domain/IStageStep.ts b/app/scripts/modules/core/src/domain/IStageStep.ts deleted file mode 100644 index f55df92582a..00000000000 --- a/app/scripts/modules/core/src/domain/IStageStep.ts +++ /dev/null @@ -1,5 +0,0 @@ -export interface IStageStep { - startTime: number; - endTime: number; - status: string; -} diff --git a/app/scripts/modules/core/src/domain/ITaskStep.ts b/app/scripts/modules/core/src/domain/ITaskStep.ts index 40d367461a5..f179b638675 100644 --- a/app/scripts/modules/core/src/domain/ITaskStep.ts +++ b/app/scripts/modules/core/src/domain/ITaskStep.ts @@ -1,6 +1,6 @@ -import {ITimedItem} from './IOrchestratedItem'; +import { IOrchestratedItem } from './IOrchestratedItem'; -export interface ITaskStep extends ITimedItem { +export interface ITaskStep extends IOrchestratedItem { name: string; status: string; } diff --git a/app/scripts/modules/core/src/domain/index.ts b/app/scripts/modules/core/src/domain/index.ts index 7a03aabc314..63ac72de0ff 100644 --- a/app/scripts/modules/core/src/domain/index.ts +++ b/app/scripts/modules/core/src/domain/index.ts @@ -43,7 +43,6 @@ export * from './IServerGroup'; export * from './IStage'; export * from './IStageContext'; export * from './IStageOrTriggerTypeConfig'; -export * from './IStageStep'; export * from './IStageTypeConfig'; export * from './IStrategy' export * from './ISubnet'; diff --git a/app/scripts/modules/core/src/pipeline/config/stages/checkPreconditions/checkPreconditionsStage.module.js b/app/scripts/modules/core/src/pipeline/config/stages/checkPreconditions/checkPreconditionsStage.module.js index 56825f0680f..74b7303a6b3 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/checkPreconditions/checkPreconditionsStage.module.js +++ b/app/scripts/modules/core/src/pipeline/config/stages/checkPreconditions/checkPreconditionsStage.module.js @@ -2,8 +2,10 @@ const angular = require('angular'); +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; + module.exports = angular.module('spinnaker.pipelines.stage.checkPreconditions', [ require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, require('./checkPreconditionsStage.js').name, ]); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/cloneServerGroup/cloneServerGroupStage.module.js b/app/scripts/modules/core/src/pipeline/config/stages/cloneServerGroup/cloneServerGroupStage.module.js index 9c2d21a16c6..c41eb79581a 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/cloneServerGroup/cloneServerGroupStage.module.js +++ b/app/scripts/modules/core/src/pipeline/config/stages/cloneServerGroup/cloneServerGroupStage.module.js @@ -2,8 +2,10 @@ const angular = require('angular'); +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; + module.exports = angular.module('spinnaker.core.pipeline.stage.cloneServerGroup', [ require('./cloneServerGroupStage.js').name, require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, ]); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/core/ExecutionStepDetails.tsx b/app/scripts/modules/core/src/pipeline/config/stages/core/ExecutionStepDetails.tsx new file mode 100644 index 00000000000..cd7707d08af --- /dev/null +++ b/app/scripts/modules/core/src/pipeline/config/stages/core/ExecutionStepDetails.tsx @@ -0,0 +1,38 @@ +import * as React from 'react'; + +import { IExecutionStage } from 'core/domain'; +import { StatusGlyph } from 'core/task/StatusGlyph'; +import { displayableTasks } from 'core/task/displayableTasks.filter'; +import { duration } from 'core/utils/timeFormatters'; +import { robotToHuman } from 'core/presentation/robotToHumanFilter/robotToHuman.filter'; + +export interface IExecutionStepDetailsProps { + stage: IExecutionStage; +} + +export class ExecutionStepDetails extends React.Component { + public render() { + return ( +
    +
    +
    + Task +
    +
    + Duration +
    +
    + { displayableTasks(this.props.stage.tasks).map((task) => ( +
    +
    + {robotToHuman(task.name)} +
    +
    + {duration(task.runningTimeInMs)} +
    +
    + ))} +
    + ); + } +} diff --git a/app/scripts/modules/core/src/pipeline/config/stages/core/executionStepDetails.component.ts b/app/scripts/modules/core/src/pipeline/config/stages/core/executionStepDetails.component.ts new file mode 100644 index 00000000000..3b2c441bbd6 --- /dev/null +++ b/app/scripts/modules/core/src/pipeline/config/stages/core/executionStepDetails.component.ts @@ -0,0 +1,8 @@ +import { module } from 'angular'; +import { react2angular } from 'react2angular'; + +import { ExecutionStepDetails } from './ExecutionStepDetails'; + +export const EXECUTION_STEP_DETAILS_COMPONENT = 'spinnaker.core.pipeline.config.stages.core.executionStepDetails.component'; +module(EXECUTION_STEP_DETAILS_COMPONENT, []) + .component('executionStepDetails', react2angular(ExecutionStepDetails, ['stage'])); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/core/executionStepDetails.html b/app/scripts/modules/core/src/pipeline/config/stages/core/executionStepDetails.html deleted file mode 100644 index 743c1947d1f..00000000000 --- a/app/scripts/modules/core/src/pipeline/config/stages/core/executionStepDetails.html +++ /dev/null @@ -1,18 +0,0 @@ -
    -
    -
    - Task -
    -
    - Duration -
    -
    -
    -
    - {{task.name | robotToHuman }} -
    -
    - {{task.runningTimeInMs | duration }} -
    -
    -
    diff --git a/app/scripts/modules/core/src/pipeline/config/stages/core/executionSteps.directive.js b/app/scripts/modules/core/src/pipeline/config/stages/core/executionSteps.directive.js deleted file mode 100644 index 64cee34e41e..00000000000 --- a/app/scripts/modules/core/src/pipeline/config/stages/core/executionSteps.directive.js +++ /dev/null @@ -1,24 +0,0 @@ -'use strict'; - -import {PIPELINE_CONFIG_PROVIDER} from 'core/pipeline/config/pipelineConfigProvider'; - -const angular = require('angular'); - -module.exports = angular.module('spinnaker.core.pipeline.stages.core.executionStepDetails', [ - PIPELINE_CONFIG_PROVIDER, -]) - .directive('executionStepDetails', function() { - return { - restrict: 'E', - scope: { - item: '=' - }, - templateUrl: require('./executionStepDetails.html'), - controller: 'ExecutionStepDetailsCtrl', - controllerAs: 'executionStepDetailsCtrl' - }; - }) - .controller('ExecutionStepDetailsCtrl', function() { - - }); - diff --git a/app/scripts/modules/core/src/pipeline/config/stages/core/stage.core.module.js b/app/scripts/modules/core/src/pipeline/config/stages/core/stage.core.module.js deleted file mode 100644 index 864ec1fdb6b..00000000000 --- a/app/scripts/modules/core/src/pipeline/config/stages/core/stage.core.module.js +++ /dev/null @@ -1,9 +0,0 @@ -'use strict'; -import {DISPLAYABLE_TASKS_FILTER} from 'core/task/displayableTasks.filter'; - -const angular = require('angular'); - -module.exports = angular.module('spinnaker.core.pipeline.stage.core', [ - require('./executionSteps.directive.js').name, - DISPLAYABLE_TASKS_FILTER -]); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/core/stage.core.module.ts b/app/scripts/modules/core/src/pipeline/config/stages/core/stage.core.module.ts new file mode 100644 index 00000000000..336288646eb --- /dev/null +++ b/app/scripts/modules/core/src/pipeline/config/stages/core/stage.core.module.ts @@ -0,0 +1,11 @@ +import { module } from 'angular'; + +import { DISPLAYABLE_TASKS_FILTER } from 'core/task/displayableTasks.filter'; +import { EXECUTION_STEP_DETAILS_COMPONENT } from './executionStepDetails.component'; + +export const STAGE_CORE_MODULE = 'spinnaker.core.pipeline.stage.core'; + +module(STAGE_CORE_MODULE, [ + EXECUTION_STEP_DETAILS_COMPONENT, + DISPLAYABLE_TASKS_FILTER, +]); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/deploy/deployStage.module.js b/app/scripts/modules/core/src/pipeline/config/stages/deploy/deployStage.module.js index 30f435a8796..f62e4b906ae 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/deploy/deployStage.module.js +++ b/app/scripts/modules/core/src/pipeline/config/stages/deploy/deployStage.module.js @@ -1,14 +1,16 @@ 'use strict'; -import {CLUSTER_NAME_FILTER} from './clusterName.filter'; const angular = require('angular'); +import { CLUSTER_NAME_FILTER } from './clusterName.filter'; +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; + module.exports = angular.module('spinnaker.core.pipeline.stage.deploy', [ require('./deployStage.js').name, require('./deployStage.transformer.js').name, require('./deployExecutionDetails.controller.js').name, CLUSTER_NAME_FILTER, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, ]) .run(function(pipelineConfig, deployStageTransformer) { pipelineConfig.registerTransformer(deployStageTransformer); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/executionWindows/executionWindowsStage.module.js b/app/scripts/modules/core/src/pipeline/config/stages/executionWindows/executionWindowsStage.module.js index 06d7e9a13f9..223b9bbaca2 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/executionWindows/executionWindowsStage.module.js +++ b/app/scripts/modules/core/src/pipeline/config/stages/executionWindows/executionWindowsStage.module.js @@ -3,6 +3,7 @@ const angular = require('angular'); import { EXECUTION_WINDOW_ACTIONS_COMPONENT } from './executionWindowActions.component'; +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; import './executionWindows.less'; @@ -12,5 +13,5 @@ module.exports = angular.module('spinnaker.core.pipeline.stage.executionWindows' require('./executionWindows.directive.js').name, EXECUTION_WINDOW_ACTIONS_COMPONENT, require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, ]); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/findImageFromTags/findImageFromTagsStage.module.js b/app/scripts/modules/core/src/pipeline/config/stages/findImageFromTags/findImageFromTagsStage.module.js index 6f6236ae16e..7ed4a059d86 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/findImageFromTags/findImageFromTagsStage.module.js +++ b/app/scripts/modules/core/src/pipeline/config/stages/findImageFromTags/findImageFromTagsStage.module.js @@ -2,8 +2,10 @@ const angular = require('angular'); +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; + module.exports = angular.module('spinnaker.core.pipeline.stage.findImageFromTags', [ require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, require('./findImageFromTagsStage.js').name, ]); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/jenkins/jenkinsStage.module.js b/app/scripts/modules/core/src/pipeline/config/stages/jenkins/jenkinsStage.module.js index 000a76b1733..31584757336 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/jenkins/jenkinsStage.module.js +++ b/app/scripts/modules/core/src/pipeline/config/stages/jenkins/jenkinsStage.module.js @@ -1,13 +1,15 @@ 'use strict'; const angular = require('angular'); -import {IGOR_SERVICE} from 'core/ci/igor.service'; -import {TIME_FORMATTERS} from 'core/utils/timeFormatters'; + +import { IGOR_SERVICE } from 'core/ci/igor.service'; +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; +import { TIME_FORMATTERS } from 'core/utils/timeFormatters'; module.exports = angular.module('spinnaker.core.pipeline.stage.jenkins', [ require('./jenkinsStage.js').name, require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, TIME_FORMATTERS, IGOR_SERVICE, require('./jenkinsExecutionDetails.controller.js').name, diff --git a/app/scripts/modules/core/src/pipeline/config/stages/manualJudgment/manualJudgmentStage.module.js b/app/scripts/modules/core/src/pipeline/config/stages/manualJudgment/manualJudgmentStage.module.js index 7e30f1d2082..f5ecf3bc203 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/manualJudgment/manualJudgmentStage.module.js +++ b/app/scripts/modules/core/src/pipeline/config/stages/manualJudgment/manualJudgmentStage.module.js @@ -2,11 +2,13 @@ const angular = require('angular'); +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; + import './manualJudgmentExecutionDetails.less'; module.exports = angular.module('spinnaker.core.pipeline.stage.manualJudgment', [ require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, require('./manualJudgmentExecutionDetails.controller.js').name, require('./manualJudgmentStage.js').name, require('../../../../notification/modal/editNotification.controller.modal.js').name, diff --git a/app/scripts/modules/core/src/pipeline/config/stages/tagImage/tagImageStage.module.js b/app/scripts/modules/core/src/pipeline/config/stages/tagImage/tagImageStage.module.js index 1b0cda6bbec..008e540fd13 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/tagImage/tagImageStage.module.js +++ b/app/scripts/modules/core/src/pipeline/config/stages/tagImage/tagImageStage.module.js @@ -2,8 +2,10 @@ const angular = require('angular'); +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; + module.exports = angular.module('spinnaker.core.pipeline.stage.tagImage', [ require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, require('./tagImageStage.js').name, ]); diff --git a/app/scripts/modules/core/src/pipeline/config/stages/travis/travisStage.module.ts b/app/scripts/modules/core/src/pipeline/config/stages/travis/travisStage.module.ts index 6827694c24f..0c77a5556c5 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/travis/travisStage.module.ts +++ b/app/scripts/modules/core/src/pipeline/config/stages/travis/travisStage.module.ts @@ -1,15 +1,16 @@ -import {module} from 'angular'; +import { module } from 'angular'; -import {TRAVIS_STAGE} from './travisStage'; -import {IGOR_SERVICE} from 'core/ci/igor.service'; -import {TIME_FORMATTERS} from 'core/utils/timeFormatters'; -import {TRAVIS_EXECUTION_DETAILS_CONTROLLER} from './travisExecutionDetails.controller'; +import { TRAVIS_STAGE } from './travisStage'; +import { IGOR_SERVICE } from 'core/ci/igor.service'; +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; +import { TIME_FORMATTERS } from 'core/utils/timeFormatters'; +import { TRAVIS_EXECUTION_DETAILS_CONTROLLER } from './travisExecutionDetails.controller'; export const TRAVIS_STAGE_MODULE = 'spinnaker.core.pipeline.stage.travis'; module(TRAVIS_STAGE_MODULE, [ TRAVIS_STAGE, require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, TIME_FORMATTERS, IGOR_SERVICE, TRAVIS_EXECUTION_DETAILS_CONTROLLER, diff --git a/app/scripts/modules/core/src/pipeline/config/stages/webhook/webhookStage.module.ts b/app/scripts/modules/core/src/pipeline/config/stages/webhook/webhookStage.module.ts index 13ddc4b68d2..87610a4cb05 100644 --- a/app/scripts/modules/core/src/pipeline/config/stages/webhook/webhookStage.module.ts +++ b/app/scripts/modules/core/src/pipeline/config/stages/webhook/webhookStage.module.ts @@ -1,16 +1,17 @@ -import {module} from 'angular'; +import { module } from 'angular'; -import {WEBHOOK_STAGE} from './webhookStage'; -import {IGOR_SERVICE} from 'core/ci/igor.service'; -import {TIME_FORMATTERS} from 'core/utils/timeFormatters'; -import {WEBHOOK_EXECUTION_DETAILS_CONTROLLER} from './webhookExecutionDetails.controller'; -import {WEBHOOK_STAGE_ADD_CUSTOM_HEADER_MODAL_CONTROLLER} from './modal/addCustomHeader.controller.modal'; +import { WEBHOOK_STAGE } from './webhookStage'; +import { IGOR_SERVICE } from 'core/ci/igor.service'; +import { STAGE_CORE_MODULE } from '../core/stage.core.module'; +import { TIME_FORMATTERS } from 'core/utils/timeFormatters'; +import { WEBHOOK_EXECUTION_DETAILS_CONTROLLER } from './webhookExecutionDetails.controller'; +import { WEBHOOK_STAGE_ADD_CUSTOM_HEADER_MODAL_CONTROLLER } from './modal/addCustomHeader.controller.modal'; export const WEBHOOK_STAGE_MODULE = 'spinnaker.core.pipeline.stage.webhook'; module(WEBHOOK_STAGE_MODULE, [ WEBHOOK_STAGE, require('../stage.module.js').name, - require('../core/stage.core.module.js').name, + STAGE_CORE_MODULE, TIME_FORMATTERS, IGOR_SERVICE, WEBHOOK_EXECUTION_DETAILS_CONTROLLER, diff --git a/app/scripts/modules/core/src/pipeline/pipelines.module.js b/app/scripts/modules/core/src/pipeline/pipelines.module.js index 89e4fef1c10..e656f79dd17 100644 --- a/app/scripts/modules/core/src/pipeline/pipelines.module.js +++ b/app/scripts/modules/core/src/pipeline/pipelines.module.js @@ -4,6 +4,7 @@ const angular = require('angular'); import { COPY_STAGE_MODAL_CONTROLLER } from './config/copyStage/copyStage.modal.controller'; import { GROUP_STAGE_MODULE } from './config/stages/group/groupStage.module'; +import { STAGE_CORE_MODULE } from './config/stages/core/stage.core.module'; import { TRAVIS_STAGE_MODULE } from './config/stages/travis/travisStage.module'; import { UNMATCHED_STAGE_TYPE_STAGE } from './config/stages/unmatchedStageTypeStage/unmatchedStageTypeStage'; import { WEBHOOK_STAGE_MODULE } from './config/stages/webhook/webhookStage.module'; @@ -22,7 +23,7 @@ module.exports = angular.module('spinnaker.core.pipeline', [ require('./config/stages/bake/bakeStage.module').name, require('./config/stages/checkPreconditions/checkPreconditionsStage.module').name, require('./config/stages/cloneServerGroup/cloneServerGroupStage.module').name, - require('./config/stages/core/stage.core.module').name, + STAGE_CORE_MODULE, require('./config/stages/deploy/deployStage.module').name, require('./config/stages/destroyAsg/destroyAsgStage.module').name, require('./config/stages/disableAsg/disableAsgStage.module').name, diff --git a/app/scripts/modules/core/src/presentation/robotToHumanFilter/robotToHuman.filter.ts b/app/scripts/modules/core/src/presentation/robotToHumanFilter/robotToHuman.filter.ts index e4a34ed6008..18e314c12a4 100644 --- a/app/scripts/modules/core/src/presentation/robotToHumanFilter/robotToHuman.filter.ts +++ b/app/scripts/modules/core/src/presentation/robotToHumanFilter/robotToHuman.filter.ts @@ -1,35 +1,37 @@ import { module } from 'angular'; -export function robotToHuman() { - return function(input: string): string { - if (!input) { - return ''; - } - let formattedInput = input.charAt(0).toUpperCase() + input.substr(1); +export function robotToHuman(input: string): string { + if (!input) { + return ''; + } + let formattedInput = input.charAt(0).toUpperCase() + input.substr(1); - if (/\s/g.test(formattedInput)) { - return formattedInput; - } + if (/\s/g.test(formattedInput)) { + return formattedInput; + } - // clear camel case. - formattedInput = formattedInput.replace(/[A-Z]/g, ' $&'); + // clear camel case. + formattedInput = formattedInput.replace(/[A-Z]/g, ' $&'); - // clear snake case - formattedInput = formattedInput.replace(/_[a-z]/g, function (str) { - return ' ' + str.charAt(1).toUpperCase() + str.substr(2); - }); + // clear snake case + formattedInput = formattedInput.replace(/_[a-z]/g, function (str) { + return ' ' + str.charAt(1).toUpperCase() + str.substr(2); + }); - // then clear dash case - formattedInput = formattedInput.replace(/-[a-z]/g, function (str) { - return ' ' + str.charAt(1).toUpperCase() + str.substr(2); - }); + // then clear dash case + formattedInput = formattedInput.replace(/-[a-z]/g, function (str) { + return ' ' + str.charAt(1).toUpperCase() + str.substr(2); + }); - formattedInput = formattedInput.replace(/([A-Z])\s([A-Z])\s/g, '$1$2'); + formattedInput = formattedInput.replace(/([A-Z])\s([A-Z])\s/g, '$1$2'); - return formattedInput; - } + return formattedInput; +} + +export function robotToHumanFilter() { + return robotToHuman; } export const ROBOT_TO_HUMAN_FILTER = 'spinnaker.core.presentation.robotToHuman.filter'; module(ROBOT_TO_HUMAN_FILTER, []) - .filter('robotToHuman', robotToHuman); + .filter('robotToHuman', robotToHumanFilter); diff --git a/app/scripts/modules/core/src/task/StatusGlyph.tsx b/app/scripts/modules/core/src/task/StatusGlyph.tsx new file mode 100644 index 00000000000..5a58138ac4e --- /dev/null +++ b/app/scripts/modules/core/src/task/StatusGlyph.tsx @@ -0,0 +1,32 @@ +import * as React from 'react'; +import * as classNames from 'classnames'; + +import { ITaskStep } from 'core/domain'; + +export interface IStatusGlyphProps { + item: ITaskStep; +} + +export class StatusGlyph extends React.Component { + public render() { + const { item } = this.props; + const className = classNames( + [ + 'glyphicon', + 'status-glyph', + { + 'glyphicon-time': item.hasNotStarted, + 'glyphicon-play': item.isRunning, + 'fa fa-check': item.isCompleted, + 'fa fa-exclamation-triangle': item.isFailed || item.status === 'TERMINATED', + 'glyphicon-stop': item.isCanceled, + 'glyphicon-pause': item.isSuspended || item.isPaused, + } + ] + ); + + return ( + + ); + } +} diff --git a/app/scripts/modules/core/src/task/displayableTasks.filter.ts b/app/scripts/modules/core/src/task/displayableTasks.filter.ts index 7c5973dd030..396a4e05076 100644 --- a/app/scripts/modules/core/src/task/displayableTasks.filter.ts +++ b/app/scripts/modules/core/src/task/displayableTasks.filter.ts @@ -2,20 +2,20 @@ import { module } from 'angular'; import { ITaskStep } from 'core/domain'; -export function displayableTaskFilter() { +export function displayableTasks(input: ITaskStep[]): ITaskStep[] { const blacklist = [ 'stageStart', 'stageEnd', 'determineTargetServerGroup' ]; - return function (input: ITaskStep[]): ITaskStep[] { - let result: ITaskStep[] = []; - if (input) { - result = input.filter((test: ITaskStep) => { - return !blacklist.includes(test.name) || test.status === 'TERMINAL'; - }); - } - return result; - }; + let result: ITaskStep[] = []; + if (input) { + result = input.filter((test: ITaskStep) => !blacklist.includes(test.name) || test.status === 'TERMINAL'); + } + + return result; +} +export function displayableTaskFilter() { + return displayableTasks; } export const DISPLAYABLE_TASKS_FILTER = 'spinnaker.pipelines.stages.core.displayableTasks.filter'; diff --git a/app/scripts/modules/core/src/task/statusGlyph.component.ts b/app/scripts/modules/core/src/task/statusGlyph.component.ts new file mode 100644 index 00000000000..738cdbb3737 --- /dev/null +++ b/app/scripts/modules/core/src/task/statusGlyph.component.ts @@ -0,0 +1,8 @@ +import { module } from 'angular'; +import { react2angular } from 'react2angular'; + +import { StatusGlyph } from './StatusGlyph'; + +export const STATUS_GLYPH_COMPONENT = 'spinnaker.core.task.statusGlyph.component'; +module(STATUS_GLYPH_COMPONENT, []) + .component('statusGlyph', react2angular(StatusGlyph, ['item'])); diff --git a/app/scripts/modules/core/src/task/statusGlyph.directive.js b/app/scripts/modules/core/src/task/statusGlyph.directive.js deleted file mode 100644 index 2ba49422ce9..00000000000 --- a/app/scripts/modules/core/src/task/statusGlyph.directive.js +++ /dev/null @@ -1,16 +0,0 @@ -'use strict'; - -const angular = require('angular'); - -module.exports = angular.module('spinnaker.core.task.statusGlyph.directive', []) - .directive('statusGlyph', function() { - return { - restrict: 'E', - replace: true, - scope: { - item: '=', - }, - templateUrl: require('./statusGlyph.html'), - }; - - }); diff --git a/app/scripts/modules/core/src/task/statusGlyph.html b/app/scripts/modules/core/src/task/statusGlyph.html deleted file mode 100644 index d21e77f0c77..00000000000 --- a/app/scripts/modules/core/src/task/statusGlyph.html +++ /dev/null @@ -1,9 +0,0 @@ - diff --git a/app/scripts/modules/core/src/task/task.module.js b/app/scripts/modules/core/src/task/task.module.js index 0a3f5d6a65f..022c811196c 100644 --- a/app/scripts/modules/core/src/task/task.module.js +++ b/app/scripts/modules/core/src/task/task.module.js @@ -3,6 +3,7 @@ const angular = require('angular'); import { PLATFORM_HEALTH_OVERRIDE_MESSAGE } from './platformHealthOverrideMessage.component'; +import { STATUS_GLYPH_COMPONENT } from 'core/task/statusGlyph.component'; import { TASK_STATES } from './task.states'; import './tasks.less'; @@ -12,7 +13,7 @@ module.exports = angular require('./verification/userVerification.directive.js').name, require('./modal/reason.directive').name, require('./monitor/taskMonitor.module.js').name, - require('./statusGlyph.directive.js').name, + STATUS_GLYPH_COMPONENT, require('./tasks.controller.js').name, require('./task.dataSource').name, TASK_STATES,