add NOT filter mode for excluding books by filter values (#3099)

Author: acx10

booklore-ui/src/app/features/book/components/book-browser/book-filter/book-filter.component.html

@@ -42,7 +42,8 @@
                       *cdkVirtualFor="let filter of filters; trackBy: trackByFilter"
                       class="filter-row"
                       [ngClass]="{
-                    'active': activeFilters[filterType]?.includes(getFilterValueId(filter))
+                    'active': activeFilters[filterType]?.includes(getFilterValueId(filter)),
+                    'active-not': activeFilters[filterType]?.includes(getFilterValueId(filter)) && selectedFilterMode === 'not'
                   }"
                       (click)="handleFilterClick(filterType, getFilterValueId(filter))">
                       <span class="filter-value-text">{{ getFilterValueDisplay(filter) }}</span>

booklore-ui/src/app/features/book/components/book-browser/book-filter/book-filter.component.scss

@@ -3,7 +3,7 @@
 }
 
 :host ::ng-deep .p-togglebutton {
-  --p-togglebutton-content-padding: 0.25rem 0.5rem;
+  --p-togglebutton-content-padding: 0.25rem 0.35rem;
 }
 
 :host ::ng-deep .cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper {
@@ -34,7 +34,11 @@
 }
 
 .filter-mode-select {
-  font-size: 0.875rem;
+  font-size: 0.75rem;
+}
+
+:host ::ng-deep .filter-mode-select .p-togglebutton-label {
+  font-size: 0.75rem;
 }
 
 .filter-content {
@@ -84,6 +88,11 @@
   &.active {
     color: var(--primary-color);
   }
+
+  &.active-not {
+    color: var(--p-red-400);
+    text-decoration: line-through;
+  }
 }
 
 .filter-value-text {

booklore-ui/src/app/features/book/components/book-browser/book-filter/book-filter.component.ts

@@ -67,6 +67,7 @@ export class BookFilterComponent implements OnInit, OnDestroy {
   readonly filterModeOptions: FilterModeOption[] = [
     {label: 'AND', value: 'and'},
     {label: 'OR', value: 'or'},
+    {label: 'NOT', value: 'not'},
     {label: '1', value: 'single'}
   ];
 

booklore-ui/src/app/features/book/components/book-browser/filters/sidebar-filter.ts

@@ -60,17 +60,19 @@ export function doesBookMatchFilter(
     return mode === 'or';
   }
 
+  const effectiveMode = mode === 'not' ? 'or' : mode;
+
   switch (filterType) {
     case 'author':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.authors?.includes(val as string))
         : filterValues.every(val => book.metadata?.authors?.includes(val as string));
     case 'category':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.categories?.includes(val as string))
         : filterValues.every(val => book.metadata?.categories?.includes(val as string));
     case 'series':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.seriesName?.trim() === val)
         : filterValues.every(val => book.metadata?.seriesName?.trim() === val);
     case 'bookType':
@@ -80,24 +82,24 @@ export function doesBookMatchFilter(
     case 'personalRating':
       return filterValues.some(range => isRatingInRange10(book.personalRating, range as string | number));
     case 'publisher':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.publisher === val)
         : filterValues.every(val => book.metadata?.publisher === val);
     case 'matchScore':
       return filterValues.some(range => isMatchScoreInRange(book.metadataMatchScore, range as string | number));
     case 'library':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => val == book.libraryId)
         : filterValues.every(val => val == book.libraryId);
     case 'shelf':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.shelves?.some(s => s.id == val))
         : filterValues.every(val => book.shelves?.some(s => s.id == val));
     case 'shelfStatus':
       const shelved = book.shelves && book.shelves.length > 0 ? 'shelved' : 'unshelved';
       return filterValues.includes(shelved);
     case 'tag':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.tags?.includes(val as string))
         : filterValues.every(val => book.metadata?.tags?.includes(val as string));
     case 'publishedDate':
@@ -118,7 +120,7 @@ export function doesBookMatchFilter(
     case 'pageCount':
       return filterValues.some(range => isPageCountInRange(book.metadata?.pageCount!, range as string | number));
     case 'mood':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.moods?.includes(val as string))
         : filterValues.every(val => book.metadata?.moods?.includes(val as string));
     case 'ageRating':
@@ -131,15 +133,15 @@ export function doesBookMatchFilter(
     case 'narrator':
       return filterValues.includes(book.metadata?.narrator);
     case 'comicCharacter':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.comicMetadata?.characters?.includes(val as string))
         : filterValues.every(val => book.metadata?.comicMetadata?.characters?.includes(val as string));
     case 'comicTeam':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.comicMetadata?.teams?.includes(val as string))
         : filterValues.every(val => book.metadata?.comicMetadata?.teams?.includes(val as string));
     case 'comicLocation':
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => book.metadata?.comicMetadata?.locations?.includes(val as string))
         : filterValues.every(val => book.metadata?.comicMetadata?.locations?.includes(val as string));
     case 'comicCreator': {
@@ -161,7 +163,7 @@ export function doesBookMatchFilter(
           }
         }
       }
-      return mode === 'or'
+      return effectiveMode === 'or'
         ? filterValues.some(val => allCreators.includes(val as string))
         : filterValues.every(val => allCreators.includes(val as string));
     }
@@ -187,6 +189,7 @@ export function filterBooksByFilters(
     const matches = filterEntries.map(([filterType, filterValues]) =>
       doesBookMatchFilter(book, filterType, filterValues, mode)
     );
+    if (mode === 'not') return matches.every(m => !m);
     return mode === 'or' ? matches.some(m => m) : matches.every(m => m);
   });
 }

booklore-ui/src/app/features/settings/user-management/user.service.ts

@@ -56,7 +56,7 @@ export interface PerBookSetting {
 }
 
 export type PageSpread = 'off' | 'even' | 'odd';
-export type BookFilterMode = 'and' | 'or' | 'single';
+export type BookFilterMode = 'and' | 'or' | 'single' | 'not';
 
 
 export enum CbxPageViewMode {