refactor(ui): remove semantic from workflow/notification/workflowAdm

ui/src/app/shared/ascode/events/ascode.event.html

@@ -20,6 +20,9 @@
             </ul>
         </li>
     </ul>
-    <button class="ui right floated mini green button" [disabled]="loadingPopupButton"
-            [class.loading]="loadingPopupButton" (click)="resyncEvents()">{{'btn_resync_ascode_event' | translate }}</button>
+    <div class="footer">
+        <button nz-button nzType="primary" nzSize="small" [disabled]="loadingPopupButton"
+                [nzLoading]="loadingPopupButton" (click)="resyncEvents()">{{'btn_resync_ascode_event' | translate }}</button>
+    </div>
+
 </div>

ui/src/app/shared/ascode/events/ascode.event.scss

@@ -1,12 +1,14 @@
 .asCodeEvents {
-
   ul {
     li {
       ul {
         list-style: none;
       }
     }
   }
+  .footer {
+    text-align: right;
+  }
 }
 
 

ui/src/app/shared/shared.module.ts

@@ -124,7 +124,9 @@ import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm';
 import { en_US, NZ_I18N } from 'ng-zorro-antd/i18n';
 import { NzIconModule } from 'ng-zorro-antd/icon';
 import { IconDefinition } from '@ant-design/icons-angular';
-import { BellFill, BookOutline, CalendarOutline, CaretDownFill, CaretRightFill, CaretUpFill, CheckOutline, CopyOutline, DeleteOutline, DragOutline, EyeInvisibleOutline, EyeOutline, KeyOutline, HistoryOutline, InfoCircleOutline, PhoneFill, PlusOutline, PlusSquareOutline, QuestionOutline, QuestionCircleOutline, RestOutline, SaveOutline, SettingFill, ShareAltOutline, StarOutline, TableOutline, TagsOutline, ToolFill, UnlockFill, UnorderedListOutline, UploadOutline, WarningOutline } from '@ant-design/icons-angular/icons'
+import { ArrowDownOutline, ArrowRightOutline, BellFill, BookOutline, CalendarOutline, CaretDownFill, CaretRightFill, CaretUpFill, CheckOutline, CodeOutline, CopyOutline, DeleteOutline, DragOutline, EyeInvisibleOutline, EyeOutline, KeyOutline,
+    HistoryOutline, InfoCircleOutline, PhoneFill, PlusOutline, PlusSquareOutline, QuestionOutline, QuestionCircleOutline, RestOutline, SaveOutline, SettingFill, ShareAltOutline, StarOutline, StarFill, SyncOutline,
+    TableOutline, TagsOutline, ToolFill, UnlockFill, UnorderedListOutline, UploadOutline, UserOutline, WarningOutline } from '@ant-design/icons-angular/icons'
 import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
 import { NzTagModule } from 'ng-zorro-antd/tag';
 import { NzPopoverModule } from 'ng-zorro-antd/popover';
@@ -154,7 +156,9 @@ const ngZorroConfig: NzConfig = {
     icon: {nzTheme: "outline"}
 };
 
-const icons: IconDefinition[] = [ BellFill, BookOutline, CalendarOutline, CaretDownFill, CaretRightFill, CaretUpFill, CheckOutline, CopyOutline, DeleteOutline, DragOutline, EyeInvisibleOutline, EyeOutline, KeyOutline, HistoryOutline, InfoCircleOutline, PhoneFill, PlusOutline, PlusSquareOutline, QuestionOutline, QuestionCircleOutline, RestOutline, SaveOutline, SettingFill, ShareAltOutline, StarOutline, TableOutline, TagsOutline, ToolFill, UnlockFill, UnorderedListOutline, UploadOutline, WarningOutline ];
+const icons: IconDefinition[] = [ ArrowDownOutline, ArrowRightOutline, BellFill, BookOutline, CalendarOutline, CaretDownFill, CaretRightFill, CaretUpFill, CheckOutline, CodeOutline, CopyOutline, DeleteOutline, DragOutline,
+    EyeInvisibleOutline, EyeOutline, KeyOutline, HistoryOutline, InfoCircleOutline, PhoneFill, PlusOutline, PlusSquareOutline, QuestionOutline, QuestionCircleOutline,
+    RestOutline, SaveOutline, SettingFill, ShareAltOutline, StarOutline, StarFill, SyncOutline, TableOutline, TagsOutline, ToolFill, UnlockFill, UnorderedListOutline, UploadOutline, UserOutline, WarningOutline ];
 
 @NgModule({
     imports: [

ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.html

@@ -1,9 +1,7 @@
 <ng-container *ngIf="ready">
-    <sui-multi-select class="selection" [(ngModel)]="selectedTags" [options]="tagsSelectable" [isSearchable]="true"
-        (ngModelChange)="filterRuns()" [optionsFilter]="filterTags" #multiSelect>
-        <sui-select-option *ngFor="let option of multiSelect.filteredOptions" [value]="option">
-        </sui-select-option>
-    </sui-multi-select>
+    <nz-select nzShowSearch nzMode="multiple" [(ngModel)]="selectedTags" (ngModelChange)="filterRuns()" nzPlaceHolder="Filter...">
+        <nz-option *ngFor="let o of tagsSelectable" [nzLabel]="o" [nzValue]="o"></nz-option>
+    </nz-select>
     <div class="runs" #tagsList infiniteScroll [infiniteScrollDistance]="2" [infiniteScrollThrottle]="50"
         [scrollWindow]="false" (scrolled)="scroll()">
         <ng-container *ngIf="workflowRuns.length > 0">

ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.scss

@@ -213,4 +213,7 @@
             }
         }
     }
+  nz-select {
+    padding: 5px 10px 5px 5px;
+  }
 }

ui/src/app/shared/workflow/sidebar/run-list/workflow.sidebar.run.component.ts

@@ -252,17 +252,6 @@ export class WorkflowSidebarRunListComponent implements OnDestroy {
         }
     }
 
-    filterTags(options: Array<string>, query: string): Array<string> | false {
-        if (!options) {
-            return false;
-        }
-        if (!query || query.length < 3) {
-            return options.slice(0, 100);
-        }
-        let queryLowerCase = query.toLowerCase();
-        return options.filter(o => o.toLowerCase().indexOf(queryLowerCase) !== -1);
-    }
-
     confirmCopy() {
         this._toast.success('', 'Workflow run version copied!');
     }

ui/src/app/store/workflow.state.ts

@@ -356,6 +356,7 @@ export class WorkflowState {
             return;
         }
 
+
         // Update Non as code workflow
         return this._http.put<Workflow>(
             `/project/${action.payload.projectKey}/workflows/${action.payload.workflowName}`,
@@ -389,7 +390,6 @@ export class WorkflowState {
                 ctx.dispatch(new UpdateModal({ workflow: wf }));
             } else {
                 let wfUpdated: Workflow = {
-                    ...state.workflow,
                     ...wf,
                     preview: null
                 };

ui/src/app/views/application/show/admin/application.admin.html

@@ -1,5 +1,5 @@
 <div id="ApplicationAdmin">
-    <nz-card nzTitle="Settings">
+    <nz-card nzTitle="Settings" class="coloredTitle">
         <form nz-form #applicationUpdateFrom="ngForm">
             <nz-form-item>
                 <nz-form-label [nzSpan]="3">Name</nz-form-label>
@@ -36,11 +36,11 @@
         </form>
     </nz-card>
 
-    <nz-card nzTitle="Repository">
+    <nz-card nzTitle="Repository" class="coloredTitle">
         <app-application-repo [project]="project" [application]="application" [editMode]="editMode"></app-application-repo>
     </nz-card>
 
-    <nz-card nzTitle="Integrations">
+    <nz-card nzTitle="Integrations" class="coloredTitle">
         <ng-container *ngIf="project.integrations && project.integrations.length > 0">
             <app-application-deployment [project]="project" [application]="application" [editMode]="editMode"></app-application-deployment>
         </ng-container>
@@ -49,7 +49,7 @@
         </ng-container>
     </nz-card>
 
-    <nz-card nzTitle="Danger zone">
+    <nz-card nzTitle="Danger zone" class="redTitle">
         <nz-row>
             <nz-col [nzSpan]="12">
                 <div class="title">Delete application</div>

ui/src/app/views/environment/show/advanced/environment.advanced.html

@@ -1,5 +1,5 @@
 <div id="EnvironmentAdmin">
-    <nz-card nzTitle="Configuration">
+    <nz-card nzTitle="Settings" class="coloredTitle">
         <form nz-form #environmentUpdateFrom="ngForm">
             <nz-form-item>
                 <nz-form-label>Name</nz-form-label>
@@ -23,7 +23,7 @@
             </nz-form-item>
         </form>
     </nz-card>
-    <nz-card nzTitle="Danger zone">
+    <nz-card nzTitle="Danger zone" class="redTitle">
         <nz-row>
             <nz-col [nzSpan]="12">
                 <div class="title">{{ 'environment_delete_label' | translate}}</div>

ui/src/app/views/pipeline/show/admin/pipeline.admin.html

@@ -1,5 +1,5 @@
 <div class="pipelineAdmin">
-    <app-zone header="{{ 'pipeline_administration' | translate }}">
+    <app-zone header="{{ 'pipeline_administration' | translate }}" >
         <app-zone-content>
             <form class="ui form" (ngSubmit)="updatePipeline()" #projectUpdateFrom="ngForm">
                 <div class="eight wide field">

ui/src/app/views/project/show/admin/project.admin.html

@@ -1,5 +1,5 @@
 <div id="projectAdmin">
-    <nz-card nzTitle="Project configuration" >
+    <nz-card nzTitle="Settings" class="coloredTitle">
         <form nz-form (ngSubmit)="onSubmitProjectUpdate()" #projectUpdateFrom="ngForm">
             <nz-form-item>
                 <nz-form-label [nzSpan]="3">Project name</nz-form-label>
@@ -40,13 +40,13 @@
             </nz-form-item>
         </form>
     </nz-card>
-    <nz-card nzTitle="Link to a repository manager">
+    <nz-card nzTitle="Link to a repository manager" class="coloredTitle">
         <app-repomanager-form [project]="project"></app-repomanager-form>
         <app-project-repomanager-list *ngIf="project.vcs_servers && project.vcs_servers.length > 0"
                                       [project]="project" [reposmanagers]="project.vcs_servers"
         ></app-project-repomanager-list>
     </nz-card>
-    <nz-card nzTitle="Danger zone">
+    <nz-card nzTitle="Danger zone" class="redTitle">
         <nz-row>
             <nz-col [nzSpan]="12">
                 <div class="title">Delete project</div>

ui/src/app/views/workflow/graph/workflow.graph.component.ts

@@ -99,7 +99,7 @@ export class WorkflowGraphComponent implements AfterViewInit, OnDestroy {
         // https://github.com/cpettitt/dagre/wiki#configuring-the-layout
         this.g = new dagreD3.graphlib.Graph().setGraph({ rankdir: this.direction, nodesep: 10, ranksep: 15, edgesep: 5 });
         // Create all nodes
-        if (this.workflow.workflow_data && this.workflow.workflow_data.node && this.workflow.workflow_data.node.id > 0) {
+        if (this.workflow.workflow_data && this.workflow.workflow_data.node) {
             this.createNode(this.workflow.workflow_data.node);
         }
         if (this.workflow.workflow_data && this.workflow.workflow_data.joins) {