feat(ui): add button to copy run number (#5640)

Signed-off-by: richardlt <[email protected]>
ovh · Jan 15, 2021 · 843cc5d · 843cc5d
1 parent 3fc30e4
commit 843cc5d
Show file tree

Hide file tree

Showing 9 changed files with 91 additions and 62 deletions.
diff --git a/ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.html b/ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.html
@@ -15,13 +15,18 @@
                 [class.never]="r.status === pipelineStatusEnum.NEVER_BUILT || r.status === pipelineStatusEnum.SKIPPED || r.status === pipelineStatusEnum.DISABLED">
                 <div class="content">
                     <div class="info">
-                        <div class="number">
-                            <span class="hash">#</span>
-                            <span class="count" title="{{r.version ? r.version : r.num}}"
-                                [class.success]="r.status === pipelineStatusEnum.SUCCESS"
-                                [class.waiting]="r.status === pipelineStatusEnum.BUILDING || r.status === pipelineStatusEnum.WAITING || r.status === pipelineStatusEnum.PENDING"
-                                [class.fail]="r.status === pipelineStatusEnum.FAIL || r.status === pipelineStatusEnum.STOPPED"
-                                [class.never]="r.status === pipelineStatusEnum.NEVER_BUILT || r.status === pipelineStatusEnum.SKIPPED || r.status === pipelineStatusEnum.DISABLED">{{r.version ? r.version : r.num}}</span>
+                        <div class="number-wrapper">
+                            <div class="number">
+                                <span class="hash">#</span>
+                                <span class="count" title="{{r.version ? r.version : r.num}}"
+                                    [class.success]="r.status === pipelineStatusEnum.SUCCESS"
+                                    [class.waiting]="r.status === pipelineStatusEnum.BUILDING || r.status === pipelineStatusEnum.WAITING || r.status === pipelineStatusEnum.PENDING"
+                                    [class.fail]="r.status === pipelineStatusEnum.FAIL || r.status === pipelineStatusEnum.STOPPED"
+                                    [class.never]="r.status === pipelineStatusEnum.NEVER_BUILT || r.status === pipelineStatusEnum.SKIPPED || r.status === pipelineStatusEnum.DISABLED">{{r.version
+                                    ? r.version : r.num}}</span>
+                            </div>
+                            <a title="Copy version" ngxClipboard [cbContent]="r.version ? r.version : r.num"
+                                (click)="confirmCopy();$event.stopPropagation();"><i class="copy outline icon"></i></a>
                         </div>
                         <ng-template let-popup #popupTemplate>
                             <div class="content">

diff --git a/ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.scss b/ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.scss
@@ -51,55 +51,77 @@
                     display: flex;
                     flex-direction: column;
 
-                    .number {
-                        white-space: nowrap;
-                        overflow: hidden;
-                        text-overflow: ellipsis;
+                    .number-wrapper {
+                        display: flex;
+                        flex-direction: row;
 
-                        .hash {
-                            font-size: 1.2em;
-                            line-height: 1em;
-                            color: $polar_grey_3;
-                            margin-right: 1px;
+                        &:hover {
+                            a {
+                                display: block;
+                            }
                         }
 
-                        .count {
-                            font-size: 1.3em;
-                            line-height: 1em;
-
+                        a {
+                            display: none;
+                            text-decoration: none;
+                            color: $polar_grey_1;
                             :host-context(.night) & {
-                                &.success {
-                                    color: $darkTheme_green;
+                                color: $darkTheme_grey_5;
+                            }
+
+                            &:hover {
+                                color: $polar_grey_3;
+                                :host-context(.night) & {
+                                    color: $polar_grey_5;
                                 }
+                            }
+                        }
 
-                                &.running {
-                                    color: $darkTheme_blue;
+                        .number {
+                            flex: 1;
+                            white-space: nowrap;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+
+                            .hash {
+                                font-size: 1.2em;
+                                line-height: 1em;
+                                color: $polar_grey_3;
+                                margin-right: 1px;
+                            }
+
+                            .count {
+                                font-size: 1.3em;
+                                line-height: 1em;
+
+                                :host-context(.night) & {
+                                    &.success {
+                                        color: $darkTheme_green;
+                                    }
+                                    &.running {
+                                        color: $darkTheme_blue;
+                                    }
+                                    &.fail {
+                                        color: $darkTheme_red;
+                                    }
+                                    &.waiting {
+                                        color: $darkTheme_blue;
+                                    }
                                 }
 
+                                &.success {
+                                    color: $cds_color_green;
+                                }
+                                &.running {
+                                    color: $cds_color_teal;
+                                }
                                 &.fail {
-                                    color: $darkTheme_red;
+                                    color: $cds_color_red;
                                 }
-
                                 &.waiting {
-                                    color: $darkTheme_blue;
+                                    color: $cds_color_teal;
                                 }
                             }
-
-                            &.success {
-                                color: $cds_color_green;
-                            }
-
-                            &.running {
-                                color: $cds_color_teal;
-                            }
-
-                            &.fail {
-                                color: $cds_color_red;
-                            }
-
-                            &.waiting {
-                                color: $cds_color_teal;
-                            }
                         }
                     }
 

diff --git a/ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.ts b/ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.ts
@@ -16,6 +16,7 @@ import { WorkflowRun, WorkflowRunSummary, WorkflowRunTags } from 'app/model/work
 import { WorkflowRunService } from 'app/service/workflow/run/workflow.run.service';
 import { AutoUnsubscribe } from 'app/shared/decorator/autoUnsubscribe';
 import { DurationService } from 'app/shared/duration/duration.service';
+import { ToastService } from 'app/shared/toast/ToastService';
 import { ProjectState } from 'app/store/project.state';
 import { CleanWorkflowRun, ClearListRuns, SetWorkflowRuns } from 'app/store/workflow.action';
 import { WorkflowState } from 'app/store/workflow.state';
@@ -52,8 +53,8 @@ export class WorkflowSidebarRunListComponent implements OnDestroy {
         }
     }
     get workflow() {
- return this._workflow;
-}
+        return this._workflow;
+    }
 
     @Select(WorkflowState.getSelectedWorkflowRun()) wrun$: Observable<WorkflowRun>
     wrunSub: Subscription;
@@ -75,14 +76,13 @@ export class WorkflowSidebarRunListComponent implements OnDestroy {
     durationMap: { [key: number]: string } = {};
 
     durationIntervalID: number;
-
     currentWorkflowRunNumber: number;
     offset = 0;
 
     constructor(
         private _workflowRunService: WorkflowRunService,
         private _router: Router,
-        private _routerActivated: ActivatedRoute,
+        private _toast: ToastService,
         private _store: Store,
         private _cd: ChangeDetectorRef
     ) {
@@ -262,4 +262,8 @@ export class WorkflowSidebarRunListComponent implements OnDestroy {
         let queryLowerCase = query.toLowerCase();
         return options.filter(o => o.toLowerCase().indexOf(queryLowerCase) !== -1);
     }
+
+    confirmCopy() {
+        this._toast.success('', 'Workflow run version copied!');
+    }
 }
diff --git a/ui/src/app/views/admin/worker-model-pattern/form/worker-model.pattern.form.component.ts b/ui/src/app/views/admin/worker-model-pattern/form/worker-model.pattern.form.component.ts
@@ -17,6 +17,10 @@ export class WorkerModelPatternFormComponent {
     @Input() loading: boolean;
 
     @Input() set pattern(p: ModelPattern) {
+        if (!p) {
+            return;
+        }
+
         this._pattern = p;
 
         this.envNames = [];
@@ -49,6 +53,7 @@ export class WorkerModelPatternFormComponent {
         this.currentUser = this._store.selectSnapshot(AuthenticationState.user);
 
         this.loadingPatterns = true;
+        this._cd.markForCheck();
         this._workerModelService.getTypes()
             .pipe(finalize(() => {
                 this.loadingPatterns = false;

diff --git a/ui/src/app/views/navbar/navbar.component.ts b/ui/src/app/views/navbar/navbar.component.ts
@@ -113,8 +113,8 @@ export class NavbarComponent implements OnInit, OnDestroy {
 
     ngOnInit() {
         // Listen list of nav project
-        this._store.selectOnce(AuthenticationState.user).subscribe(user => {
-            if (user) {
+        this._store.selectOnce(AuthenticationState.summary).subscribe(s => {
+            if (s) {
                 this.getData();
             }
         });

diff --git a/ui/src/app/views/settings/cdsctl/cdsctl.component.ts b/ui/src/app/views/settings/cdsctl/cdsctl.component.ts
@@ -1,7 +1,7 @@
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, } from '@angular/core';
 import { TranslateService } from '@ngx-translate/core';
 import { Store } from '@ngxs/store';
-import { AuthentifiedUser } from 'app/model/user.model';
+import { AuthSummary } from 'app/model/user.model';
 import { ConfigService } from 'app/service/config/config.service';
 import { ThemeStore } from 'app/service/theme/theme.store';
 import { PathItem } from 'app/shared/breadcrumb/breadcrumb.component';
@@ -27,7 +27,7 @@ export class CdsctlComponent implements OnInit, OnDestroy {
     @ViewChild('codemirror7') codemirror7: any;
     @ViewChild('codemirror8') codemirror8: any;
 
-    currentUser: AuthentifiedUser;
+    currentAuthSummary: AuthSummary;
     apiURL: string;
     arch: Array<string>;
     os: Array<string>;
@@ -96,7 +96,7 @@ export class CdsctlComponent implements OnInit, OnDestroy {
             this._cd.markForCheck();
         });
 
-        this.currentUser = this._store.selectSnapshot(AuthenticationState.user);
+        this.currentAuthSummary = this._store.selectSnapshot(AuthenticationState.summary);
 
         this.loading = true;
         this._configService.getConfig()
@@ -119,7 +119,7 @@ export class CdsctlComponent implements OnInit, OnDestroy {
         this.tutorials['part1'] = this._translate.instant('cdsctl_part_1',
             { apiURL: this.apiURL, osChoice: this.osChoice, archChoice: this.archChoice, variant });
         this.tutorials['part2'] = this._translate.instant('cdsctl_part_2',
-            { apiURL: this.apiURL, username: this.currentUser.username });
+            { apiURL: this.apiURL, username: this.currentAuthSummary.user.username });
         this.tutorials['part3'] = this._translate.instant('cdsctl_part_3');
         this.tutorials['part4'] = this._translate.instant('cdsctl_part_4');
         this.tutorials['part5'] = this._translate.instant('cdsctl_part_5');

diff --git a/ui/src/app/views/settings/cdsctl/cdsctl.html b/ui/src/app/views/settings/cdsctl/cdsctl.html
@@ -80,9 +80,9 @@ <h1>{{ 'cdsctl_title_2' | translate }}</h1>
             <div class="ui info message">
                 {{ 'cdsctl_notice' | translate }}
                 <ul>
-                    <li>{{ 'cdsctl_notice_2_1' | translate }} {{currentUser.username}}`</li>
+                    <li>{{ 'cdsctl_notice_2_1' | translate }} {{currentAuthSummary.user.username}}`</li>
                     <li>{{ 'cdsctl_notice_2_2' | translate }} `CDS_API_URL="{{apiURL}}"
-                        CDS_USER="{{currentUser.username}}" CDS_TOKEN="yourtoken" cdsctl [command]`</li>
+                        CDS_USER="{{currentAuthSummary.user.username}}" CDS_TOKEN="yourtoken" cdsctl [command]`</li>
                     <li>{{ 'cdsctl_notice_2_3' | translate }} `CDS_VERBOSE=true ./cdsctl [command]`</li>
                 </ul>
             </div>

diff --git a/ui/src/app/views/settings/user/consumer-create-modal/consumer-create-modal.component.ts b/ui/src/app/views/settings/user/consumer-create-modal/consumer-create-modal.component.ts
@@ -169,10 +169,6 @@ export class ConsumerCreateModalComponent {
             });
     }
 
-    confirmCopy() {
-        this._toast.success('', this._translate.instant('auth_value_copied'));
-    }
-
     filterGroups(f: string) {
         const lowerFilter = f.toLowerCase();
         return (g: Group) => g.name.toLowerCase().indexOf(lowerFilter) !== -1

diff --git a/ui/src/app/views/workflow/run/node/workflow.run.node.component.ts b/ui/src/app/views/workflow/run/node/workflow.run.node.component.ts
@@ -45,8 +45,6 @@ export class WorkflowNodeRunComponent implements OnInit, OnDestroy {
     nodeRunsHistory = new Array<WorkflowNodeRun>();
     selectedTab: string;
 
-    isAdmin: boolean;
-
     nbVuln = 0;
     deltaVul = 0;
 
@@ -61,7 +59,6 @@ export class WorkflowNodeRunComponent implements OnInit, OnDestroy {
         private _cd: ChangeDetectorRef
     ) {
         this.project = this._store.selectSnapshot(ProjectState.projectSnapshot);
-        this.isAdmin = this._store.selectSnapshot(AuthenticationState.user).ring === 'ADMIN';
 
         // Tab selection
         this._activatedRoute.queryParams.subscribe(q => {