Merge branch 'dev'

src-ui/src/app/components/admin/tasks/tasks.component.html

@@ -102,25 +102,34 @@
     </button>
   }
 
-  <ngb-pagination
-    [pageSize]="pageSize"
-    [collectionSize]="totalTasks()"
-    [page]="page"
-    [maxSize]="5"
-    [rotate]="true"
-    size="sm"
-    aria-label="Tasks pagination"
-    (pageChange)="setPage($event)">
-  </ngb-pagination>
+  @if (selectedSection !== TaskSection.All && totalTasks() > pageSize) {
+    <ngb-pagination
+      [pageSize]="pageSize"
+      [collectionSize]="totalTasks()"
+      [page]="page"
+      [maxSize]="5"
+      [rotate]="true"
+      size="sm"
+      aria-label="Tasks pagination"
+      (pageChange)="setPage($event)">
+    </ngb-pagination>
+  }
 </div>
 
 <ng-template let-tasks="tasks" let-section="section" #tasksTemplate>
-  <div class="section-header d-flex align-items-center justify-content-between mb-2">
-    <div>
-      <h5 class="mb-0">{{ sectionLabel(section) }}</h5>
-      <div class="small text-muted">
-        <ng-container i18n>{tasks.length, plural, =1 {1 task} other {{{tasks.length}} tasks}}</ng-container>
-      </div>
+  <div class="section-header mb-2">
+    <h5 class="mb-0">{{ sectionLabel(section) }}</h5>
+    @let count = sectionCount(section);
+    @let hasMore = selectedSection === TaskSection.All && count > tasks.length;
+    <div class="small text-muted">
+      @if (hasMore) {
+        <ng-container i18n>{{tasks.length}} of {{count}} tasks</ng-container>
+        <button class="btn btn-link show-all p-0 ms-2 align-baseline" type="button" (click)="setSection(section)">
+          <ng-container i18n>Show all</ng-container><i-bs class="ms-1" width="1em" height="1em" name="arrow-right"></i-bs>
+        </button>
+      } @else {
+        <ng-container i18n>{count, plural, =1 {1 task} other {{{count}} tasks}}</ng-container>
+      }
     </div>
   </div>
 
@@ -169,10 +178,9 @@
               <div>{{ taskDisplayName(task) }}</div>
               <div class="small text-muted">
                 @if (taskShowsSeparateTypeLabel(task)) {
-                  <span>{{ task.task_type_display }}</span>
-                  <span class="mx-1">&bull;</span>
+                  <span class="me-2">{{ task.task_type_display }}</span>
                 }
-                <span>{{ task.trigger_source_display }}</span>
+                <span class="text-nowrap"><i-bs class="me-1" width="1em" height="1em" name="box-arrow-in-right"></i-bs>{{ task.trigger_source_display }}</span>
               </div>
             </td>
             <td class="d-none d-lg-table-cell created-col">{{ task.date_created | customDate:'short' }}</td>

src-ui/src/app/components/admin/tasks/tasks.component.scss

@@ -72,3 +72,7 @@ pre {
 tbody tr:nth-last-child(2) td {
     border-bottom: none !important;
 }
+
+.section-header .show-all {
+    font-size: inherit;
+}

src-ui/src/app/components/admin/tasks/tasks.component.spec.ts

@@ -223,16 +223,6 @@ describe('TasksComponent', () => {
       )
       .flush(paginatedTasks)
 
-    httpTestingController
-      .expectOne(
-        (req) =>
-          req.url === `${environment.apiBaseUrl}tasks/` &&
-          req.params.get('acknowledged') === 'false' &&
-          req.params.get('page_size') === '25' &&
-          req.params.get('page') === '1'
-      )
-      .flush(paginatedTasks)
-
     httpTestingController
       .expectOne(
         (req) =>
@@ -241,8 +231,30 @@ describe('TasksComponent', () => {
           !req.params.has('status')
       )
       .flush(sectionCountResponse)
+
+    flushTaskLists(10)
   })
 
+  // answers task list requests with the fixture tasks matching their status filter
+  function flushTaskLists(pageSize: number, count?: number) {
+    httpTestingController
+      .match(
+        (req) =>
+          req.url === `${environment.apiBaseUrl}tasks/` &&
+          req.params.get('page_size') === `${pageSize}`
+      )
+      .forEach((req) => {
+        const statuses = req.request.params.getAll('status')
+        const results = tasks.filter((task) => statuses.includes(task.status))
+        req.flush({ count: count ?? results.length, results })
+      })
+  }
+
+  function selectSection(section: TaskSection, count: number) {
+    component.setSection(section)
+    flushTaskLists(25, count)
+  }
+
   it('should display task sections with counts', () => {
     expect(component.selectedSection).toBe(TaskSection.All)
     expect(component.selectedTaskType).toBeNull()
@@ -338,6 +350,7 @@ describe('TasksComponent', () => {
   })
 
   it('should render pagination controls next to the task filter', () => {
+    selectSection(TaskSection.Completed, 30)
     fixture.detectChanges()
 
     const controls = fixture.debugElement.query(By.css('.task-controls'))
@@ -348,6 +361,51 @@ describe('TasksComponent', () => {
     expect(pagination).not.toBeNull()
   })
 
+  it('should only paginate a section with more than one page of tasks', () => {
+    const pagination = () =>
+      fixture.debugElement.query(By.css('ngb-pagination'))
+
+    fixture.detectChanges()
+    expect(pagination()).toBeNull()
+
+    selectSection(TaskSection.Completed, 2)
+    fixture.detectChanges()
+    expect(pagination()).toBeNull()
+  })
+
+  it('should load the all tasks overview one section at a time', () => {
+    expect(component.tasksForSection(TaskSection.NeedsAttention)).toHaveLength(
+      2
+    )
+    expect(component.tasksForSection(TaskSection.InProgress)).toHaveLength(3)
+    expect(component.tasksForSection(TaskSection.Completed)).toHaveLength(2)
+    expect(component.totalTasks()).toBe(7)
+  })
+
+  it('should show section totals and link truncated sections to their full list', () => {
+    component.sectionCounts.update((counts) => ({
+      ...counts,
+      [TaskSection.Completed]: 27,
+    }))
+    fixture.detectChanges()
+
+    const header = (label: string) =>
+      fixture.debugElement
+        .queryAll(By.css('.section-header'))
+        .find((h) => h.nativeElement.textContent.includes(label))
+
+    expect(header('Needs attention').nativeElement.textContent).toContain(
+      '2 tasks'
+    )
+    expect(header('Needs attention').query(By.css('button'))).toBeNull()
+
+    expect(header('Recently completed').nativeElement.textContent).toContain(
+      '2 of 27 tasks'
+    )
+    header('Recently completed').query(By.css('button')).nativeElement.click()
+    expect(component.selectedSection).toBe(TaskSection.Completed)
+  })
+
   it('should apply the selected section to the server-side task query', () => {
     component.setSection(TaskSection.NeedsAttention)
 
@@ -368,55 +426,56 @@ describe('TasksComponent', () => {
   it('should apply task type and trigger source filters to the server-side task query', () => {
     component.setTaskType(PaperlessTaskType.SanityCheck)
 
-    httpTestingController
-      .expectOne(
+    expect(
+      httpTestingController.match(
         (request) =>
           request.url === `${environment.apiBaseUrl}tasks/` &&
-          request.params.get('page_size') === '25' &&
+          request.params.get('page_size') === '10' &&
           request.params.get('task_type') === PaperlessTaskType.SanityCheck
       )
-      .flush({ count: 1, results: [tasks[6]] })
+    ).toHaveLength(3)
 
     component.setTriggerSource(PaperlessTaskTriggerSource.System)
 
-    httpTestingController
-      .expectOne(
+    expect(
+      httpTestingController.match(
         (request) =>
           request.url === `${environment.apiBaseUrl}tasks/` &&
-          request.params.get('page_size') === '25' &&
+          request.params.get('page_size') === '10' &&
           request.params.get('task_type') === PaperlessTaskType.SanityCheck &&
           request.params.get('trigger_source') ===
             PaperlessTaskTriggerSource.System
       )
-      .flush({ count: 1, results: [tasks[6]] })
+    ).toHaveLength(3)
   })
 
   it('should apply text filters to the server-side task query', () => {
     component.filterText = 'invoice'
     jest.advanceTimersByTime(150)
 
-    httpTestingController
-      .expectOne(
+    expect(
+      httpTestingController.match(
         (request) =>
           request.url === `${environment.apiBaseUrl}tasks/` &&
-          request.params.get('page_size') === '25' &&
+          request.params.get('page_size') === '10' &&
           request.params.get('name') === 'invoice'
       )
-      .flush({ count: 1, results: [tasks[0]] })
+    ).toHaveLength(3)
 
     component.setFilterTarget(TaskFilterTargetID.Result)
 
-    httpTestingController
-      .expectOne(
+    expect(
+      httpTestingController.match(
         (request) =>
           request.url === `${environment.apiBaseUrl}tasks/` &&
-          request.params.get('page_size') === '25' &&
+          request.params.get('page_size') === '10' &&
           request.params.get('result') === 'invoice'
       )
-      .flush({ count: 0, results: [] })
+    ).toHaveLength(3)
   })
 
   it('should load a different task page when pagination changes', () => {
+    selectSection(TaskSection.Completed, 30)
     component.setPage(2)
 
     const pageTwoTasks = {
@@ -440,6 +499,7 @@ describe('TasksComponent', () => {
   })
 
   it('should not replace section counts with current-page counts', () => {
+    selectSection(TaskSection.Completed, 30)
     component.setPage(2)
 
     httpTestingController
@@ -455,11 +515,21 @@ describe('TasksComponent', () => {
         results: [tasks[0]],
       })
 
+    expect(component.sectionCount(TaskSection.All)).toBe(7)
     expect(component.sectionCount(TaskSection.NeedsAttention)).toBe(2)
     expect(component.sectionCount(TaskSection.InProgress)).toBe(3)
     expect(component.sectionCount(TaskSection.Completed)).toBe(2)
   })
 
+  it('should stop loading when the overview fails to load', () => {
+    component.setSection(TaskSection.All)
+    httpTestingController
+      .match((req) => req.params.get('page_size') === '10')[0]
+      .flush('', { status: 500, statusText: 'Error' })
+
+    expect(component.loading()).toBe(false)
+  })
+
   it('should expose stable task type options and disable empty ones', () => {
     expect(component.taskTypeOptions.map((option) => option.value)).toContain(
       PaperlessTaskType.TrainClassifier

src-ui/src/app/components/admin/tasks/tasks.component.ts

@@ -15,6 +15,9 @@ import {
   distinctUntilChanged,
   filter,
   first,
+  forkJoin,
+  map,
+  Observable,
   Subject,
   takeUntil,
   timer,
@@ -25,6 +28,7 @@ import {
   PaperlessTaskTriggerSource,
   PaperlessTaskType,
 } from 'src/app/data/paperless-task'
+import { Results } from 'src/app/data/results'
 import { IfPermissionsDirective } from 'src/app/directives/if-permissions.directive'
 import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
 import { TasksService } from 'src/app/services/tasks.service'
@@ -169,6 +173,7 @@ export class TasksComponent
   public expandedTask: number
   public autoRefreshEnabled: boolean = true
   public readonly pageSize = 25
+  public readonly overviewSize = 10
   public page: number = 1
   readonly totalTasks = signal(0)
   readonly sectionCounts = signal<Record<TaskSection, number>>({
@@ -484,13 +489,6 @@ export class TasksComponent
     return this.sectionCounts()[section]
   }
 
-  private setSectionCount(section: TaskSection, count: number) {
-    this.sectionCounts.update((counts) => ({
-      ...counts,
-      [section]: count,
-    }))
-  }
-
   sectionShowsResults(section: TaskSection): boolean {
     return section !== TaskSection.InProgress
   }
@@ -737,21 +735,12 @@ export class TasksComponent
     this.reloadSectionCounts()
 
     this.loading.set(true)
-    this.tasksService
-      .list(
-        this.page,
-        this.pageSize,
-        this.getParamsForSection(this.selectedSection)
-      )
+    this.listTasks()
       .pipe(first(), takeUntil(this.unsubscribeNotifier))
       .subscribe({
         next: (result) => {
           this.pagedTasks.set(result.results)
           this.totalTasks.set(result.count)
-          this.setSectionCount(TaskSection.All, result.count)
-          if (this.selectedSection !== TaskSection.All) {
-            this.setSectionCount(this.selectedSection, result.count)
-          }
           this.loading.set(false)
           if (
             this.page > 1 &&
@@ -767,4 +756,30 @@ export class TasksComponent
         },
       })
   }
+
+  private listTasks(): Observable<Results<PaperlessTask>> {
+    if (this.selectedSection !== TaskSection.All) {
+      return this.tasksService.list(
+        this.page,
+        this.pageSize,
+        this.getParamsForSection(this.selectedSection)
+      )
+    }
+
+    // All is an overview of each section to avoid splitting sections across pages
+    return forkJoin(
+      this.sections.map((section) =>
+        this.tasksService.list(
+          1,
+          this.overviewSize,
+          this.getParamsForSection(section)
+        )
+      )
+    ).pipe(
+      map((results) => ({
+        count: results.reduce((sum, result) => sum + result.count, 0),
+        results: results.flatMap((result) => result.results),
+      }))
+    )
+  }
 }

src-ui/src/app/components/admin/users-groups/users-groups.component.spec.ts

@@ -154,6 +154,31 @@ describe('UsersAndGroupsComponent', () => {
     jest.useRealTimers()
   })
 
+  it('should logout current user under base href if password changed', () => {
+    jest.useFakeTimers()
+    const base = document.createElement('base')
+    base.href = '/paperless/'
+    document.head.appendChild(base)
+    completeSetup()
+    let modal: NgbModalRef
+    modalService.activeInstances.subscribe((refs) => (modal = refs[0]))
+    component.editUser(users[0])
+    const navSpy = jest
+      .spyOn(navUtils, 'setLocationHref')
+      .mockImplementation(() => {})
+    const editDialog = modal.componentInstance as UserEditDialogComponent
+    editDialog.passwordIsSet = true
+    settingsService.currentUser.set(users[0]) // simulate logged in as same user
+    editDialog.succeeded.emit(users[0])
+    fixture.detectChanges()
+    jest.advanceTimersByTime(2600)
+    expect(navSpy).toHaveBeenCalledWith(
+      `${window.location.origin}/paperless/accounts/logout/?next=/paperless/accounts/login/?next=/paperless/`
+    )
+    base.remove()
+    jest.useRealTimers()
+  })
+
   it('should support edit / create group, show error if needed', () => {
     completeSetup()
     let modal: NgbModalRef

src-ui/src/app/components/admin/users-groups/users-groups.component.ts

@@ -116,8 +116,9 @@ export class UsersAndGroupsComponent
             $localize`Password has been changed, you will be logged out momentarily.`
           )
           setTimeout(() => {
+            const basePath = new URL(document.baseURI).pathname
             setLocationHref(
-              `${window.location.origin}/accounts/logout/?next=/accounts/login/?next=/`
+              `${window.location.origin}${basePath}accounts/logout/?next=${basePath}accounts/login/?next=${basePath}`
             )
           }, 2500)
         } else {

src-ui/src/app/components/app-frame/app-frame.component.scss

@@ -66,6 +66,7 @@
 }
 
 .search-container {
+  min-width: 0;
   padding-left: 1rem;
   padding-right: 1rem;
 }
@@ -499,6 +500,11 @@ main {
 
 // true center the search with equal flex widths
 @media (min-width: 768px) {
+  .search-container {
+    // Prevent input padding and the conditional search button from resizing
+    flex-basis: 55rem;
+  }
+
   .navbar-brand-container,
   .navbar > ul {
     display: flex; // so the brand link stays as wide as its contents

src-ui/src/app/components/app-frame/global-search/global-search.component.scss

@@ -70,6 +70,17 @@ form {
   max-height: 75vh;
 }
 
+.dropdown.show {
+  // Hide the search icon when the dropdown is shown
+  i-bs[name="search"] {
+    display: none !important;
+  }
+
+  .form-control {
+    padding-left: 0.5rem;
+  }
+}
+
 .dropdown-item {
   &:has(button:focus) {
     background-color: var(--pngx-bg-darker);

src-ui/src/app/components/common/profile-edit-dialog/profile-edit-dialog.component.spec.ts

@@ -218,6 +218,38 @@ describe('ProfileEditDialogComponent', () => {
     jest.useRealTimers()
   })
 
+  it('should logout under base href on save if password changed', () => {
+    jest.useFakeTimers()
+    const base = document.createElement('base')
+    base.href = '/paperless/'
+    document.head.appendChild(base)
+    const getSpy = jest.spyOn(profileService, 'get')
+    getSpy.mockReturnValue(of(profile))
+    const getProvidersSpy = jest.spyOn(
+      profileService,
+      'getSocialAccountProviders'
+    )
+    getProvidersSpy.mockReturnValue(of(socialAccountProviders))
+    component.ngOnInit()
+    component['newPassword'] = 'new*pass'
+    component.form.get('password').patchValue('new*pass')
+    component.form.get('password_confirm').patchValue('new*pass')
+
+    const updateSpy = jest.spyOn(profileService, 'update')
+    updateSpy.mockReturnValue(of(null))
+    const navSpy = jest
+      .spyOn(navUtils, 'setLocationHref')
+      .mockImplementation(() => {})
+    component.save()
+    expect(updateSpy).toHaveBeenCalled()
+    jest.advanceTimersByTime(2600)
+    expect(navSpy).toHaveBeenCalledWith(
+      `${window.location.origin}/paperless/accounts/logout/?next=/paperless/accounts/login/?next=/paperless/`
+    )
+    base.remove()
+    jest.useRealTimers()
+  })
+
   it('should support auth token copy', () => {
     jest.useFakeTimers()
     const getSpy = jest.spyOn(profileService, 'get')

src-ui/src/app/components/common/profile-edit-dialog/profile-edit-dialog.component.ts

@@ -210,8 +210,9 @@ export class ProfileEditDialogComponent
               $localize`Password has been changed, you will be logged out momentarily.`
             )
             setTimeout(() => {
+              const basePath = new URL(document.baseURI).pathname
               setLocationHref(
-                `${window.location.origin}/accounts/logout/?next=/accounts/login/?next=/`
+                `${window.location.origin}${basePath}accounts/logout/?next=${basePath}accounts/login/?next=${basePath}`
               )
             }, 2500)
           }

src-ui/src/app/components/common/suggestions-dropdown/suggestions-dropdown.component.html

@@ -1,6 +1,6 @@
 <div class="d-flex align-items-center">
   <div class="btn-group">
-    <button type="button" class="btn btn-sm btn-outline-primary" (click)="clickSuggest()" [disabled]="disabled() || loading() || (suggestions() && !aiEnabled())" [aria-label]="noSuggestions ? 'No suggestions' : 'Suggest'" i18n-aria-label>
+    <button type="button" class="btn btn-sm btn-outline-primary" (click)="clickSuggest()" [disabled]="disabled() || loading()" [aria-label]="noSuggestions ? 'No suggestions' : 'Suggest'" i18n-aria-label>
       @if (loading()) {
         <div class="spinner-border spinner-border-sm" role="status"></div>
       } @else if (noSuggestions) {
@@ -18,46 +18,44 @@
       }
     </button>
 
-    @if (aiEnabled()) {
-      <div class="btn-group" ngbDropdown #dropdown="ngbDropdown" [popperOptions]="popperOptions">
-        <button type="button" class="btn btn-sm btn-outline-primary" ngbDropdownToggle [disabled]="disabled() || loading() || !suggestions()" aria-expanded="false" aria-controls="suggestionsDropdown" aria-label="Suggestions dropdown">
-          <span class="visually-hidden" i18n>Show suggestions</span>
-        </button>
+    <div class="btn-group" ngbDropdown #dropdown="ngbDropdown" [popperOptions]="popperOptions">
+      <button type="button" class="btn btn-sm btn-outline-primary" ngbDropdownToggle [disabled]="disabled() || loading() || !suggestions()" aria-expanded="false" aria-controls="suggestionsDropdown" aria-label="Suggestions dropdown">
+        <span class="visually-hidden" i18n>Show suggestions</span>
+      </button>
 
-        <div ngbDropdownMenu aria-labelledby="suggestionsDropdown" class="shadow suggestions-dropdown">
-          <div class="list-group list-group-flush small pb-0">
-            @if (novelSuggestions === 0 && fieldSuggestions === 0) {
-              <div class="list-group-item text-muted fst-italic">
-                <small class="text-muted small fst-italic" i18n>No novel suggestions</small>
-              </div>
+      <div ngbDropdownMenu aria-labelledby="suggestionsDropdown" class="shadow suggestions-dropdown">
+        <div class="list-group list-group-flush small pb-0">
+          @if (novelSuggestions === 0 && fieldSuggestions === 0) {
+            <div class="list-group-item text-muted fst-italic">
+              <small class="text-muted small fst-italic" i18n>No novel suggestions</small>
+            </div>
+          }
+          @if (suggestions()?.suggested_tags?.length > 0) {
+            <small class="list-group-item text-uppercase text-muted small"><i-bs class="me-2" name="tags"></i-bs><ng-container i18n>Tags</ng-container></small>
+            @for (tag of suggestions().suggested_tags; track tag) {
+              <button type="button" class="list-group-item list-group-item-action bg-light" (click)="addTag.emit(tag)">{{ tag }}</button>
             }
-            @if (suggestions()?.suggested_tags?.length > 0) {
-              <small class="list-group-item text-uppercase text-muted small"><i-bs class="me-2" name="tags"></i-bs><ng-container i18n>Tags</ng-container></small>
-              @for (tag of suggestions().suggested_tags; track tag) {
-                <button type="button" class="list-group-item list-group-item-action bg-light" (click)="addTag.emit(tag)">{{ tag }}</button>
-              }
+          }
+          @if (suggestions()?.suggested_document_types?.length > 0) {
+            <div class="list-group-item text-uppercase text-muted small"><i-bs class="me-2" name="hash"></i-bs><ng-container i18n>Document Types</ng-container></div>
+            @for (type of suggestions().suggested_document_types; track type) {
+              <button type="button" class="list-group-item list-group-item-action bg-light" (click)="addDocumentType.emit(type)">{{ type }}</button>
             }
-            @if (suggestions()?.suggested_document_types?.length > 0) {
-              <div class="list-group-item text-uppercase text-muted small"><i-bs class="me-2" name="hash"></i-bs><ng-container i18n>Document Types</ng-container></div>
-              @for (type of suggestions().suggested_document_types; track type) {
-                <button type="button" class="list-group-item list-group-item-action bg-light" (click)="addDocumentType.emit(type)">{{ type }}</button>
-              }
+          }
+          @if (suggestions()?.suggested_correspondents?.length > 0) {
+            <div class="list-group-item text-uppercase text-muted small"><i-bs class="me-2" name="person"></i-bs><ng-container i18n>Correspondents</ng-container></div>
+            @for (correspondent of suggestions().suggested_correspondents; track correspondent) {
+              <button type="button" class="list-group-item list-group-item-action bg-light" (click)="addCorrespondent.emit(correspondent)">{{ correspondent }}</button>
             }
-            @if (suggestions()?.suggested_correspondents?.length > 0) {
-              <div class="list-group-item text-uppercase text-muted small"><i-bs class="me-2" name="person"></i-bs><ng-container i18n>Correspondents</ng-container></div>
-              @for (correspondent of suggestions().suggested_correspondents; track correspondent) {
-                <button type="button" class="list-group-item list-group-item-action bg-light" (click)="addCorrespondent.emit(correspondent)">{{ correspondent }}</button>
-              }
-            }
-            @if (fieldSuggestions > 0) {
-              <div class="list-group-item text-muted fst-italic">
-                <small class="text-muted small fst-italic" i18n>{fieldSuggestions, plural, =1 {1 suggestion available below} other {{{fieldSuggestions}} suggestions available below}}</small>
-              </div>
-            }
-          </div>
+          }
+          @if (fieldSuggestions > 0) {
+            <div class="list-group-item text-muted fst-italic">
+              <small class="text-muted small fst-italic" i18n>{fieldSuggestions, plural, =1 {1 suggestion available below} other {{{fieldSuggestions}} suggestions available below}}</small>
+            </div>
+          }
         </div>
       </div>
-    }
+    </div>
   </div>
 
   @if (aiEnabled()) {

src-ui/src/app/components/common/suggestions-dropdown/suggestions-dropdown.component.spec.ts

@@ -251,6 +251,37 @@ describe('SuggestionsDropdownComponent', () => {
     expect(fixture.nativeElement.textContent).toContain('No novel suggestions')
   })
 
+  it('should open ML date suggestions with AI disabled', () => {
+    const getSuggestions = jest.spyOn(component.getSuggestions, 'emit')
+    fixture.componentRef.setInput('aiEnabled', false)
+    fixture.componentRef.setInput('fetchedSources', [SuggestionSource.ML])
+    fixture.componentRef.setInput('suggestions', {
+      dates: ['2026-01-04', '2026-02-01'],
+    })
+    fixture.componentRef.setInput('appliedCreated', '2026-01-04')
+    fixture.detectChanges()
+
+    const button = fixture.nativeElement.querySelector('button')
+    expect(button.disabled).toBeFalsy()
+    expect(button.querySelector('.badge').textContent.trim()).toBe('1')
+
+    button.click()
+    fixture.detectChanges()
+
+    expect(component.dropdown.isOpen()).toBeTruthy()
+    expect(fixture.nativeElement.textContent).toContain(
+      '1 suggestion available below'
+    )
+    expect(getSuggestions).not.toHaveBeenCalled()
+    expect(
+      fixture.nativeElement.querySelector('button[title="Suggestion options"]')
+    ).toBeNull()
+
+    button.click()
+    fixture.detectChanges()
+    expect(component.dropdown.isOpen()).toBeFalsy()
+  })
+
   it('should fetch unfetched sources and show existing suggestions', () => {
     jest.spyOn(component.getSuggestions, 'emit')
     fixture.componentRef.setInput('aiEnabled', true)

src-ui/src/app/components/common/suggestions-dropdown/suggestions-dropdown.component.ts

@@ -53,11 +53,7 @@ export class SuggestionsDropdownComponent {
   addCorrespondent: EventEmitter<string> = new EventEmitter()
 
   public clickSuggest(): void {
-    if (
-      this.disabled() ||
-      this.loading() ||
-      (this.suggestions() && !this.aiEnabled())
-    ) {
+    if (this.disabled() || this.loading()) {
       return
     }
 

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

@@ -25,6 +25,8 @@
             @if (displayFields().includes(field)) {
               <th
                 scope="col"
+                class="text-truncate"
+                [title]="getColumnTitle(field)"
                 [ngClass]="{
                   'd-none d-md-table-cell': i > 1,
                   'w-25': field === DisplayField.CREATED || field === DisplayField.ADDED

src-ui/src/app/components/manage/document-attributes/management-list/management-list.component.html

@@ -11,7 +11,7 @@
       <div class="input-group input-group-sm w-auto d-none d-md-flex">
         <label class="input-group-text bg-transparent border-0" for="managementPageSize" i18n>Show:</label>
       </div>
-      <div class="input-group input-group-sm w-auto me-3">
+      <div class="input-group input-group-sm w-auto">
         <select id="managementPageSize" class="form-select form-select-sm small" [(ngModel)]="pageSize">
           <option [ngValue]="25">25</option>
           <option [ngValue]="50">50</option>
@@ -19,7 +19,9 @@
         </select>
         <span class="input-group-text text-muted d-none d-md-flex" i18n>per page</span>
       </div>
-      <ngb-pagination [pageSize]="pageSize" [collectionSize]="collectionSize()" [page]="page()" [maxSize]="5" (pageChange)="page.set($event); reloadData()" size="sm" aria-label="Pagination"></ngb-pagination>
+      @if (collectionSize() > pageSize) {
+        <ngb-pagination [pageSize]="pageSize" [collectionSize]="collectionSize()" [page]="page()" [maxSize]="5" (pageChange)="page.set($event); reloadData()" class="ms-3" size="sm" aria-label="Pagination"></ngb-pagination>
+      }
     </div>
   </div>
 
@@ -70,7 +72,7 @@
         }
       </div>
     }
-    @if (collectionSize() > 20) {
+    @if (collectionSize() > pageSize) {
       <ngb-pagination class="ms-auto" [pageSize]="pageSize" [collectionSize]="collectionSize()" [page]="page()" [maxSize]="5" (pageChange)="page.set($event); reloadData()" size="sm" aria-label="Pagination"></ngb-pagination>
     }
   </div>

src-ui/src/app/components/manage/mail/processed-mail-dialog/processed-mail-dialog.component.html

@@ -93,15 +93,17 @@
         [disabled]="selectedMailIds().size === 0"
         (confirm)="deleteSelected()">
       </pngx-confirm-button>
-      <div class="ms-auto">
-        <ngb-pagination
-          [collectionSize]="processedMails().length"
-          [(page)]="page"
-          [pageSize]="50"
-          [maxSize]="5"
-          (pageChange)="loadProcessedMails()">
-        </ngb-pagination>
-      </div>
+      @if (processedMails().length > 50) {
+        <div class="ms-auto">
+          <ngb-pagination
+            [collectionSize]="processedMails().length"
+            [(page)]="page"
+            [pageSize]="50"
+            [maxSize]="5"
+            (pageChange)="loadProcessedMails()">
+          </ngb-pagination>
+        </div>
+      }
     </div>
   }
 </div>

src-ui/src/main.ts

@@ -41,6 +41,7 @@ import {
   bell,
   bodyText,
   bookmark,
+  boxArrowInRight,
   boxArrowUp,
   boxArrowUpRight,
   boxes,
@@ -293,6 +294,7 @@ const icons = {
   braces,
   bodyText,
   bookmark,
+  boxArrowInRight,
   boxArrowUp,
   boxArrowUpRight,
   boxes,