fix tour placement issues, basic offerTour method

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

@@ -121,6 +121,7 @@ export class AppComponent implements OnInit, OnDestroy {
         anchorId: 'tour.dashboard',
         content: $localize`The dashboard can be used to show saved views, such as an 'Inbox'. Those settings are found under Settings > Saved Views once you have created some.`,
         route: '/dashboard',
+        placement: 'bottom',
       },
       {
         anchorId: 'tour.upload-widget',
@@ -130,20 +131,20 @@ export class AppComponent implements OnInit, OnDestroy {
       {
         anchorId: 'tour.documents',
         content: $localize`The documents list shows all of your documents and allows for filtering as well as bulk-editing. There are three different view styles: list, small cards and large cards. A list of documents currently opened for editing is shown in the sidebar.`,
-        route: '/documents',
+        route: '/documents?sort=created&reverse=1&page=1',
         delayAfterNavigation: 500,
         placement: 'bottom',
       },
       {
         anchorId: 'tour.documents-filter-editor',
         content: $localize`The filtering tools allow you to quickly find documents using various searches, dates, tags, etc.`,
-        route: '/documents',
+        route: '/documents?sort=created&reverse=1&page=1',
         placement: 'bottom',
       },
       {
         anchorId: 'tour.documents-views',
         content: $localize`Any combination of filters can be saved as a 'view' which can then be displayed on the dashboard and / or sidebar.`,
-        route: '/documents',
+        route: '/documents?sort=created&reverse=1&page=1',
       },
       {
         anchorId: 'tour.tags',

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

@@ -19,7 +19,9 @@
   </svg>
 </app-page-header>
 
-<div class='row'>
+<div tourAnchor="tour.dashboard"></div>
+
+<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>

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

@@ -1,4 +1,4 @@
-<ngb-alert type="primary" [dismissible]="false" tourAnchor="tour.dashboard">
+<ngb-alert type="primary" [dismissible]="false">
   <!-- [dismissible]="isFinished(status)" (closed)="dismiss(status)" -->
   <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>

src-ui/src/app/components/document-list/document-list.component.html

@@ -98,6 +98,7 @@
   </div>
 </ng-template>
 
+<div tourAnchor="tour.documents"></div>
 <ng-container *ngTemplateOutlet="pagination"></ng-container>
 
 <ng-container *ngIf="list.error ; else documentListNoError">
@@ -105,7 +106,6 @@
 </ng-container>
 
 <ng-template #documentListNoError>
-  <div tourAnchor="tour.documents"></div>
   <div *ngIf="displayMode == 'largeCards'">
     <app-document-card-large [selected]="list.isSelected(d)" (toggleSelected)="toggleSelected(d, $event)" *ngFor="let d of list.documents; trackBy: trackByDocumentId" [document]="d" (clickTag)="clickTag($event)" (clickCorrespondent)="clickCorrespondent($event)" (clickDocumentType)="clickDocumentType($event)" (clickStoragePath)="clickStoragePath($event)" (clickMoreLike)="clickMoreLike(d.id)">
     </app-document-card-large>

src-ui/src/app/components/document-list/popover-preview/popover-preview.scss

@@ -1,4 +1,4 @@
-::ng-deep .popover {
+::ng-deep app-document-list .popover {
   max-width: 40rem;
 
   .preview {

src-ui/src/app/services/settings.service.ts

@@ -23,6 +23,7 @@ import {
   SETTINGS,
   SETTINGS_KEYS,
 } from '../data/paperless-uisettings'
+import { SavedViewService } from './rest/saved-view.service'
 import { ToastService } from './toast.service'
 
 export interface LanguageOption {
@@ -56,7 +57,8 @@ export class SettingsService {
     private meta: Meta,
     @Inject(LOCALE_ID) private localeId: string,
     protected http: HttpClient,
-    private toastService: ToastService
+    private toastService: ToastService,
+    private savedViewService: SavedViewService
   ) {
     this.renderer = rendererFactory.createRenderer(null, null)
   }
@@ -448,7 +450,9 @@ export class SettingsService {
   }
 
   offerTour(): boolean {
-    return true
-    // !savedViewService.loading && savedViewService.dashboardViews.length == 0
+    return (
+      !this.savedViewService.loading &&
+      this.savedViewService.dashboardViews.length == 0
+    )
   }
 }