add notification

larscom · Dec 22, 2024 · 2713920 · 2713920
1 parent 942c751
commit 2713920
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 14 deletions.
diff --git a/...bs/feature-tabs/components/download-artifacts-icon/download-artifacts-icon.component.html b/...bs/feature-tabs/components/download-artifacts-icon/download-artifacts-icon.component.html
@@ -16,7 +16,7 @@
       <li nz-menu-item>
         <button
           [nzLoading]="loading()"
-          (click)="download(job)"
+          (click)="download($event, job)"
           [style.color]="job.status | statusColor"
           nz-button
           nzType="link"

diff --git a/...tabs/feature-tabs/components/download-artifacts-icon/download-artifacts-icon.component.ts b/...tabs/feature-tabs/components/download-artifacts-icon/download-artifacts-icon.component.ts
@@ -2,15 +2,16 @@ import { Job } from '$groups/model/job'
 import { PipelineId } from '$groups/model/pipeline'
 import { ProjectId } from '$groups/model/project'
 import { CommonModule } from '@angular/common'
-import { HttpClient } from '@angular/common/http'
+import { HttpClient, HttpErrorResponse, HttpStatusCode } from '@angular/common/http'
 import { ChangeDetectionStrategy, Component, HostListener, inject, Injector, input, signal } from '@angular/core'
 import { toObservable, toSignal } from '@angular/core/rxjs-interop'
 import FileSaver from 'file-saver'
 import { NzButtonModule } from 'ng-zorro-antd/button'
 import { NzDropDownModule } from 'ng-zorro-antd/dropdown'
 import { NzIconModule } from 'ng-zorro-antd/icon'
+import { NzNotificationService } from 'ng-zorro-antd/notification'
 import { NzToolTipModule } from 'ng-zorro-antd/tooltip'
-import { combineLatest, switchMap } from 'rxjs'
+import { combineLatest, finalize, switchMap } from 'rxjs'
 import { StatusColorPipe } from '../../pipes/status-color.pipe'
 
 @Component({
@@ -23,6 +24,7 @@ import { StatusColorPipe } from '../../pipes/status-color.pipe'
 export class DownloadArtifactsIconComponent {
   private http = inject(HttpClient)
   private injector = inject(Injector)
+  private notification = inject(NzNotificationService)
 
   projectId = input.required<ProjectId>()
   pipelineId = input.required<PipelineId>()
@@ -47,24 +49,29 @@ export class DownloadArtifactsIconComponent {
     { initialValue: [] }
   )
 
-  download({ id, name }: Job) {
+  download(e: MouseEvent, { id, name }: Job) {
+    e.stopPropagation()
+
     const params = {
       project_id: this.projectId(),
       job_id: id
     }
 
     this.loading.set(true)
 
-    this.http.get('/api/artifacts', { params, responseType: 'blob' }).subscribe({
-      next: (blob) => {
-        this.loading.set(false)
-        FileSaver.saveAs(blob, `${name}_${id}.zip`)
-      },
-      error: (e) => {
-        this.loading.set(false)
-        console.error('error download file', e)
-      }
-    })
+    this.http
+      .get('/api/artifacts', { params, responseType: 'blob' })
+      .pipe(finalize(() => this.loading.set(false)))
+      .subscribe({
+        next: (blob) => FileSaver.saveAs(blob, `${name}_${id}.zip`),
+        error: ({ status, error }: HttpErrorResponse) => {
+          if (status === HttpStatusCode.NotFound) {
+            this.notification.error('Not Found', `Failed to download artifact, it's missing from the server`)
+          } else {
+            this.notification.error(`Error ${status}`, error ? error.message : 'Failed to download artifact')
+          }
+        }
+      })
   }
 
   @HostListener('click', ['$event']) onClick(e: MouseEvent) {