Support large cards display mode

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

@@ -360,7 +360,8 @@
                       <label class="form-label" for="display_mode_{{view.id}}" i18n>Widget display</label>
                       <select class="form-select" formControlName="display_mode">
                         <option [ngValue]="DashboardViewMode.TABLE" i18n>Table</option>
-                        <option [ngValue]="DashboardViewMode.SMALL_CARDS" i18n>Cards</option>
+                        <option [ngValue]="DashboardViewMode.SMALL_CARDS" i18n>Small Cards</option>
+                        <option [ngValue]="DashboardViewMode.LARGE_CARDS" i18n>Large Cards</option>
                       </select>
                     </div>
                   }

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

@@ -104,6 +104,21 @@
         </pngx-document-card-small>
       }
     </div>
+  } @else if (documents.length && savedView.display_mode === DashboardViewMode.LARGE_CARDS) {
+    <div class="row my-n2">
+      @for (d of documents; track d.id) {
+        <pngx-document-card-large
+          (dblClickDocument)="openDocumentDetail(d)"
+          [document]="d"
+          [displayFields]="activeDisplayFields"
+          (clickTag)="clickTag($event)"
+          (clickCorrespondent)="clickCorrespondent($event)"
+          (clickStoragePath)="clickStoragePath($event)"
+          (clickDocumentType)="clickDocumentType($event)"
+          (clickMoreLike)="clickMoreLike(d.id)">
+        </pngx-document-card-large>
+      }
+    </div>
   } @else {
     <p i18n class="text-center text-muted mb-0 fst-italic">No documents</p>
   }

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

@@ -14,6 +14,7 @@ import { routes } from 'src/app/app-routing.module'
 import {
   FILTER_CORRESPONDENT,
   FILTER_DOCUMENT_TYPE,
+  FILTER_FULLTEXT_MORELIKE,
   FILTER_HAS_TAGS_ALL,
   FILTER_STORAGE_PATH,
 } from 'src/app/data/filter-rule-type'
@@ -322,6 +323,14 @@ describe('SavedViewWidgetComponent', () => {
     component.clickStoragePath(11) // coverage
   })
 
+  it('should navigate via quickfilter on click more like', () => {
+    const qfSpy = jest.spyOn(documentListViewService, 'quickFilter')
+    component.clickMoreLike(11)
+    expect(qfSpy).toHaveBeenCalledWith([
+      { rule_type: FILTER_FULLTEXT_MORELIKE, value: '11' },
+    ])
+  })
+
   it('should get correct column title', () => {
     expect(component.getColumnTitle(DocumentDisplayField.TITLE)).toEqual(
       'Title'

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

@@ -21,6 +21,7 @@ import { DocumentService } from 'src/app/services/rest/document.service'
 import {
   FILTER_CORRESPONDENT,
   FILTER_DOCUMENT_TYPE,
+  FILTER_FULLTEXT_MORELIKE,
   FILTER_HAS_TAGS_ALL,
   FILTER_STORAGE_PATH,
 } from 'src/app/data/filter-rule-type'
@@ -193,6 +194,12 @@ export class SavedViewWidgetComponent
     ])
   }
 
+  clickMoreLike(documentID: number) {
+    this.list.quickFilter([
+      { rule_type: FILTER_FULLTEXT_MORELIKE, value: documentID.toString() },
+    ])
+  }
+
   openDocumentDetail(document: Document) {
     this.router.navigate(['documents', document.id])
   }