Save tour completion, hide welcome widget

src-ui/src/app/components/dashboard/dashboard.component.html

@@ -21,22 +21,20 @@
 
 <div class="row">
   <div class="col-lg-8">
-    <ng-container *ngIf="savedViewService.loading">
-      <div class="spinner-border spinner-border-sm me-2" role="status"></div>
-      <ng-container i18n>Loading...</ng-container>
-    </ng-container>
-
-    <app-welcome-widget *ngIf="settingsService.offerTour()" tourAnchor="tour.dashboard"></app-welcome-widget>
-
-    <div *appIfPermissions="{ action: PermissionAction.View, type: PermissionType.SavedView }">
-      <ng-container *ngFor="let v of savedViewService.dashboardViews; first as isFirst">
-        <app-saved-view-widget *ngIf="isFirst; else noTour" [savedView]="v" tourAnchor="tour.dashboard"></app-saved-view-widget>
-        <ng-template #noTour>
-          <app-saved-view-widget [savedView]="v"></app-saved-view-widget>
-        </ng-template>
+    <div tourAnchor="tour.dashboard">
+      <ng-container *ngIf="savedViewService.loading">
+        <div class="spinner-border spinner-border-sm me-2" role="status"></div>
+        <ng-container i18n>Loading...</ng-container>
       </ng-container>
-    </div>
 
+      <app-welcome-widget *ngIf="settingsService.offerTour()" (dismiss)="completeTour()"></app-welcome-widget>
+
+      <div *appIfPermissions="{ action: PermissionAction.View, type: PermissionType.SavedView }">
+        <ng-container *ngFor="let v of savedViewService.dashboardViews; first as isFirst">
+          <app-saved-view-widget [savedView]="v"></app-saved-view-widget>
+        </ng-container>
+      </div>
+    </div>
   </div>
   <div class="col-lg-4">
 

src-ui/src/app/components/dashboard/dashboard.component.ts

@@ -2,6 +2,7 @@ import { Component } from '@angular/core'
 import { SavedViewService } from 'src/app/services/rest/saved-view.service'
 import { SettingsService } from 'src/app/services/settings.service'
 import { ComponentWithPermissions } from '../with-permissions/with-permissions.component'
+import { TourService } from 'ngx-ui-tour-ng-bootstrap'
 
 @Component({
   selector: 'app-dashboard',
@@ -11,7 +12,8 @@ import { ComponentWithPermissions } from '../with-permissions/with-permissions.c
 export class DashboardComponent extends ComponentWithPermissions {
   constructor(
     public settingsService: SettingsService,
-    public savedViewService: SavedViewService
+    public savedViewService: SavedViewService,
+    private tourService: TourService
   ) {
     super()
   }
@@ -23,4 +25,12 @@ export class DashboardComponent extends ComponentWithPermissions {
       return $localize`Welcome to Paperless-ngx`
     }
   }
+
+  completeTour() {
+    if (this.tourService.getStatus() !== 0) {
+      this.tourService.end() // will call settingsService.completeTour()
+    } else {
+      this.settingsService.completeTour()
+    }
+  }
 }

src-ui/src/app/components/dashboard/widgets/welcome-widget/welcome-widget.component.html

@@ -1,5 +1,4 @@
-<ngb-alert type="primary" [dismissible]="false">
-  <!-- [dismissible]="isFinished(status)" (closed)="dismiss(status)" -->
+<ngb-alert class="pe-3" type="primary" [dismissible]="true" (closed)="dismiss.emit(true)">
   <h4 class="alert-heading"><ng-container i18n>Paperless-ngx is running!</ng-container> 🎉</h4>
   <p i18n>You're ready to start uploading documents! Explore the various features of this web app on your own, or start a quick tour using the button below.</p>
   <p i18n>More detail on how to use and configure Paperless-ngx is always available in the <a href="https://docs.paperless-ngx.com" target="_blank">documentation</a>.</p>

src-ui/src/app/components/dashboard/widgets/welcome-widget/welcome-widget.component.ts

@@ -1,4 +1,4 @@
-import { Component } from '@angular/core'
+import { Component, EventEmitter, Output } from '@angular/core'
 import { TourService } from 'ngx-ui-tour-ng-bootstrap'
 
 @Component({
@@ -8,4 +8,7 @@ import { TourService } from 'ngx-ui-tour-ng-bootstrap'
 })
 export class WelcomeWidgetComponent {
   constructor(public readonly tourService: TourService) {}
+
+  @Output()
+  dismiss: EventEmitter<boolean> = new EventEmitter()
 }