@internetarchive/collection-browser 2.7.12 → 2.7.13-alpha1

package/src/collection-browser.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-duplicates */
 import {
   html,
   css,
@@ -220,11 +219,10 @@ export class CollectionBrowser
   @property({ type: String }) pageContext: CollectionBrowserContext = 'search';
 
   @property({ type: Object })
-  restorationStateHandler: RestorationStateHandlerInterface = new RestorationStateHandler(
-    {
+  restorationStateHandler: RestorationStateHandlerInterface =
+    new RestorationStateHandler({
       context: this.pageContext,
-    }
-  );
+    });
 
   @property({ type: Number }) mobileBreakpoint = 600;
 
@@ -242,7 +240,12 @@ export class CollectionBrowser
   /**
    * If item management UI active
    */
-  @property({ type: Boolean }) isManageView = false;
+  /**
+   * The current mode for item management UI:
+   * - 'initial': Initial mode activated through &manage=1 parameter
+   * - 'manual': Manual mode activated through user interaction eg. Manage|Remove items button
+   */
+  @property({ type: String }) manageViewMode: 'initial' | 'manual' | '' = '';
 
   @property({ type: String }) manageViewLabel = 'Select items to remove';
 
@@ -394,7 +397,7 @@ export class CollectionBrowser
 
       sessionStorage?.setItem('cb-session', newSessionId);
       return newSessionId;
-    } catch (err) {
+    } catch {
       // Either we can't generate the hash or we're restricted from accessing sessionStorage
       return '';
     }
@@ -554,7 +557,7 @@ export class CollectionBrowser
 
     if (!hasQuery && !isCollection && !isProfile) {
       this.placeholderType = 'empty-query';
-    } else if (noResults) {
+    } else if (noResults && this.manageViewMode !== 'initial') {
       // Within a collection, no query + no results means the collection simply has no viewable items.
       // Otherwise, we must have a user query that produced 0 results.
       this.placeholderType =
@@ -701,7 +704,7 @@ export class CollectionBrowser
           <div id="cb-top-view">
             <slot name="cb-top-slot"></slot>
           </div>
-          ${this.isManageView
+          ${this.manageViewMode
             ? this.manageBarTemplate
             : this.sortFilterBarTemplate}
           <slot name="cb-results"></slot>
@@ -801,7 +804,7 @@ export class CollectionBrowser
         @selectAll=${() => this.dataSource.checkAllTiles()}
         @unselectAll=${() => this.dataSource.uncheckAllTiles()}
         @cancel=${() => {
-          this.isManageView = false;
+          this.manageViewMode = '';
           this.dataSource.uncheckAllTiles();
           if (this.searchResultsLoading) this.dataSource.resetPages();
         }}
@@ -815,13 +818,13 @@ export class CollectionBrowser
    */
   private handleRemoveItems(): void {
     this.dispatchEvent(
-      new CustomEvent<{ items: String[] }>('itemRemovalRequested', {
+      new CustomEvent<{ items: string[] }>('itemRemovalRequested', {
         detail: {
           items: this.dataSource.checkedTileModels.map(model =>
-            model?.identifier ? model.identifier : ''
+            model?.identifier ? model.identifier : '',
           ),
         },
-      })
+      }),
     );
   }
 
@@ -830,13 +833,13 @@ export class CollectionBrowser
    */
   private handleManageItems(): void {
     this.dispatchEvent(
-      new CustomEvent<{ items: String[] }>('itemManagerRequested', {
+      new CustomEvent<{ items: string[] }>('itemManagerRequested', {
         detail: {
           items: this.dataSource.checkedTileModels.map(model =>
-            model?.identifier ? model.identifier : ''
+            model?.identifier ? model.identifier : '',
           ),
         },
-      })
+      }),
     );
   }
 
@@ -869,7 +872,7 @@ export class CollectionBrowser
     e: CustomEvent<{
       selectedSort: SortField;
       sortDirection: SortDirection | null;
-    }>
+    }>,
   ) {
     const { selectedSort, sortDirection } = e.detail;
     this.selectedSort = selectedSort;
@@ -943,7 +946,7 @@ export class CollectionBrowser
    * Handler for when the display mode option is changed (grid/list/compact-list views).
    */
   private displayModeChanged(
-    e: CustomEvent<{ displayMode?: CollectionDisplayMode }>
+    e: CustomEvent<{ displayMode?: CollectionDisplayMode }>,
   ): void {
     this.displayMode = e.detail.displayMode;
 
@@ -1000,7 +1003,7 @@ export class CollectionBrowser
    * labels: 'start-<ToLetter>' | 'clear-<FromLetter>' | '<FromLetter>-<ToLetter>'
    */
   private sendFilterByCreatorAnalytics(
-    prevSelectedLetter: string | null
+    prevSelectedLetter: string | null,
   ): void {
     if (!prevSelectedLetter && !this.selectedCreatorFilter) {
       return;
@@ -1020,7 +1023,7 @@ export class CollectionBrowser
    * Handler for changes to which letter is selected in the title alphabet bar.
    */
   private titleLetterSelected(
-    e: CustomEvent<{ selectedLetter: string | null }>
+    e: CustomEvent<{ selectedLetter: string | null }>,
   ): void {
     this.selectedCreatorFilter = null;
     this.selectedTitleFilter = e.detail.selectedLetter;
@@ -1030,7 +1033,7 @@ export class CollectionBrowser
    * Handler for changes to which letter is selected in the creator alphabet bar.
    */
   private creatorLetterSelected(
-    e: CustomEvent<{ selectedLetter: string | null }>
+    e: CustomEvent<{ selectedLetter: string | null }>,
   ): void {
     this.selectedTitleFilter = null;
     this.selectedCreatorFilter = e.detail.selectedLetter;
@@ -1105,7 +1108,7 @@ export class CollectionBrowser
         .contentWidth=${this.contentWidth}
         .query=${this.baseQuery}
         .filterMap=${this.dataSource.filterMap}
-        .isManageView=${this.isManageView}
+        .isManageView=${!!this.manageViewMode}
         .modalManager=${this.modalManager}
         ?collapsableFacets=${this.mobileView}
         ?facetsLoading=${this.facetsLoading}
@@ -1151,7 +1154,7 @@ export class CollectionBrowser
    * @param mobile Whether to style/shorten the button for mobile view
    */
   private clearFiltersBtnTemplate(
-    mobile: boolean
+    mobile: boolean,
   ): TemplateResult | typeof nothing {
     if (!this.hasActiveFilters) return nothing;
 
@@ -1200,7 +1203,7 @@ export class CollectionBrowser
     e: CustomEvent<{
       minDate: string;
       maxDate: string;
-    }>
+    }>,
   ) {
     const { minDate, maxDate } = e.detail;
     [this.minSelectedDate, this.maxSelectedDate] = [minDate, maxDate];
@@ -1228,9 +1231,9 @@ export class CollectionBrowser
    */
   private emitManageModeChangedEvent(): void {
     this.dispatchEvent(
-      new CustomEvent<boolean>('manageModeChanged', {
-        detail: this.isManageView,
-      })
+      new CustomEvent<string>('manageModeChanged', {
+        detail: this.manageViewMode,
+      }),
     );
   }
 
@@ -1249,7 +1252,7 @@ export class CollectionBrowser
    */
   async installDataSourceAndQueryState(
     dataSource: CollectionBrowserDataSourceInterface,
-    queryState: CollectionBrowserQueryState
+    queryState: CollectionBrowserQueryState,
   ): Promise<void> {
     log('Installing data source & query state in CB:', dataSource, queryState);
     if (this.dataSource) this.removeController(this.dataSource);
@@ -1408,12 +1411,12 @@ export class CollectionBrowser
 
     if (changed.has('selectedTitleFilter')) {
       this.sendFilterByTitleAnalytics(
-        changed.get('selectedTitleFilter') as string
+        changed.get('selectedTitleFilter') as string,
       );
     }
     if (changed.has('selectedCreatorFilter')) {
       this.sendFilterByCreatorAnalytics(
-        changed.get('selectedCreatorFilter') as string
+        changed.get('selectedCreatorFilter') as string,
       );
     }
 
@@ -1456,8 +1459,12 @@ export class CollectionBrowser
       }
     }
 
-    if (changed.has('isManageView')) {
-      if (this.isManageView) {
+    if (changed.has('manageViewMode')) {
+      console.log('here1');
+      if (this.infiniteScroller)
+        this.infiniteScroller.itemCount = this.estimatedTileCount;
+
+      if (this.manageViewMode) {
         this.displayMode = 'grid';
         this.fetchManagableSearchResults();
       } else if (this.pageContext === 'search') this.infiniteScroller?.reload();
@@ -1468,10 +1475,10 @@ export class CollectionBrowser
 
     if (changed.has('resizeObserver')) {
       const oldObserver = changed.get(
-        'resizeObserver'
+        'resizeObserver',
       ) as SharedResizeObserverInterface;
       if (oldObserver) this.disconnectResizeObserver(oldObserver);
-      this.setupResizeObserver();
+      // this.setupResizeObserver();
     }
 
     this.ensureAvailableTilesDisplayed();
@@ -1525,7 +1532,7 @@ export class CollectionBrowser
       this.setTileCount(
         this.dataSource.endOfDataReached
           ? this.dataSource.size
-          : this.estimatedTileCount
+          : this.estimatedTileCount,
       );
     }
   }
@@ -1546,7 +1553,7 @@ export class CollectionBrowser
     // In desktop view, we are always ready to load facets *unless* we are using one of the
     // `opt-in` strategies and have not opted in (whether by login or UI interaction).
     const usingOptInStrategy = ['opt-in', 'opt-in-or-login'].includes(
-      this.facetLoadStrategy
+      this.facetLoadStrategy,
     );
     const desktopFacetsReady =
       !this.mobileView && (!usingOptInStrategy || optedIn);
@@ -1556,7 +1563,7 @@ export class CollectionBrowser
     const mobileFacetsReady = this.mobileView && optedIn;
 
     this.dataSource.handleFacetReadinessChange(
-      desktopFacetsReady || mobileFacetsReady
+      desktopFacetsReady || mobileFacetsReady,
     );
   }
 
@@ -1569,14 +1576,14 @@ export class CollectionBrowser
     // match the _available_ viewport height. This should generally be more
     // performant than listening to scroll events on the page or column.
     const leftColumnSentinel = this.shadowRoot?.querySelector(
-      '#left-column-scroll-sentinel'
+      '#left-column-scroll-sentinel',
     );
     if (leftColumnSentinel) {
       this.leftColIntersectionObserver = new IntersectionObserver(
         this.updateLeftColumnHeight,
         {
           threshold: [...Array(201).keys()].map(n => n / 200), // Threshold every 0.5%
-        }
+        },
       );
       this.leftColIntersectionObserver.observe(leftColumnSentinel);
     }
@@ -1593,11 +1600,11 @@ export class CollectionBrowser
    */
   private setupFacetsScrollListeners(): void {
     const facetsSentinel = this.shadowRoot?.querySelector(
-      '#facets-scroll-sentinel'
+      '#facets-scroll-sentinel',
     );
     if (facetsSentinel) {
       this.facetsIntersectionObserver = new IntersectionObserver(
-        this.updateFacetFadeOut
+        this.updateFacetFadeOut,
       );
       this.facetsIntersectionObserver.observe(facetsSentinel);
     }
@@ -1642,7 +1649,7 @@ export class CollectionBrowser
         detail: {
           baseQuery: this.baseQuery,
         },
-      })
+      }),
     );
   }
 
@@ -1654,7 +1661,7 @@ export class CollectionBrowser
     this.dispatchEvent(
       new CustomEvent<SearchType>('searchTypeChanged', {
         detail: this.searchType,
-      })
+      }),
     );
   }
 
@@ -1679,7 +1686,7 @@ export class CollectionBrowser
           selectedTitleFilter: this.selectedTitleFilter,
           selectedCreatorFilter: this.selectedCreatorFilter,
         },
-      })
+      }),
     );
   }
 
@@ -1692,7 +1699,7 @@ export class CollectionBrowser
   }
 
   private disconnectResizeObserver(
-    resizeObserver: SharedResizeObserverInterface
+    resizeObserver: SharedResizeObserverInterface,
   ) {
     resizeObserver.removeObserver({
       target: this.contentContainer,
@@ -1716,7 +1723,7 @@ export class CollectionBrowser
    * @returns
    */
   private visibleCellsChanged(
-    e: CustomEvent<{ visibleCellIndices: number[] }>
+    e: CustomEvent<{ visibleCellIndices: number[] }>,
   ) {
     if (this.isScrollingToCell) return;
     const { visibleCellIndices } = e.detail;
@@ -1864,7 +1871,7 @@ export class CollectionBrowser
     };
     this.restorationStateHandler.persistState(
       restorationState,
-      this.dataSourceInstallInProgress
+      this.dataSourceInstallInProgress,
     );
   }
 
@@ -1878,7 +1885,7 @@ export class CollectionBrowser
         detail: {
           loading: this.searchResultsLoading,
         },
-      })
+      }),
     );
   }
 
@@ -2042,7 +2049,7 @@ export class CollectionBrowser
    * Callback when a result is selected
    */
   resultSelected(event: CustomEvent<TileModel>): void {
-    if (this.isManageView) {
+    if (this.manageViewMode) {
       // Checked/unchecked state change -- rerender to ensure it propagates
       // this.mapDataSource(model => ({ ...model }));
       const cellIndex = this.dataSource.indexOf(event.detail);
@@ -2082,7 +2089,7 @@ export class CollectionBrowser
         .creatorFilter=${this.selectedCreatorFilter}
         .mobileBreakpoint=${this.mobileBreakpoint}
         .loggedIn=${this.loggedIn}
-        .isManageView=${this.isManageView}
+        .isManageView=${!!this.manageViewMode}
         ?enableHoverPane=${true}
         @resultSelected=${(e: CustomEvent) => this.resultSelected(e)}
       >
@@ -2112,10 +2119,12 @@ export class CollectionBrowser
    */
   private fetchManagableSearchResults(): void {
     if (
-      this.pageContext === 'search' &&
-      this.dataSource.totalResults > 100 &&
-      !this.searchResultsLoading
+      (this.pageContext === 'search' &&
+        this.dataSource.totalResults > 100 &&
+        !this.searchResultsLoading) ||
+      this.manageViewMode === 'initial'
     ) {
+      console.log('here22');
       this.dataSource.resetPages();
       this.dataSource.fetchPage(1, this.maxPagesToManage);
       this.infiniteScroller?.reload();

package/src/collection-facets/facets-template.ts

@@ -44,12 +44,13 @@ export class FacetsTemplate extends LitElement {
         ${repeat(
           facetBuckets,
           bucket => `${facetGroup.key}:${bucket.key}`,
-          bucket => html`<facet-row
-            .facetType=${facetGroup.key}
-            .bucket=${bucket}
-            .collectionTitles=${this.collectionTitles}
-            @facetClick=${this.facetClicked}
-          ></facet-row>`
+          bucket =>
+            html`<facet-row
+              .facetType=${facetGroup.key}
+              .bucket=${bucket}
+              .collectionTitles=${this.collectionTitles}
+              @facetClick=${this.facetClicked}
+            ></facet-row>`,
         )}
       </div>
     `;

package/src/collection-facets/more-facets-content.ts

@@ -1,5 +1,3 @@
-/* eslint-disable dot-notation */
-/* eslint-disable lit-a11y/click-events-have-key-events */
 import {
   css,
   CSSResultGroup,
@@ -39,7 +37,7 @@ import type {
   CollectionTitles,
   PageSpecifierParams,
 } from '../data-source/models';
-import '@internetarchive/ia-activity-indicator/ia-activity-indicator';
+import '@internetarchive/ia-activity-indicator';
 import './more-facets-pagination';
 import './facets-template';
 import {
@@ -247,7 +245,7 @@ export class MoreFacetsContent extends LitElement {
     const bucketsWithCount =
       selectedFacetGroup?.buckets.map(bucket => {
         const selectedBucket = aggregationFacetGroup.buckets.find(
-          b => b.key === bucket.key
+          b => b.key === bucket.key,
         );
         return selectedBucket
           ? {
@@ -265,7 +263,7 @@ export class MoreFacetsContent extends LitElement {
     // Append any additional buckets that were not selected
     aggregationFacetGroup.buckets.forEach(bucket => {
       const existingBucket = selectedFacetGroup?.buckets.find(
-        b => b.key === bucket.key
+        b => b.key === bucket.key,
       );
       if (existingBucket) return;
       bucketsWithCount.push(bucket);
@@ -305,7 +303,7 @@ export class MoreFacetsContent extends LitElement {
           count: data?.count,
           state: data?.state,
         };
-      }
+      },
     );
 
     return {
@@ -329,7 +327,7 @@ export class MoreFacetsContent extends LitElement {
 
     // Order the facets according to the current sort option
     let sortedBuckets = currentAggregation.getSortedBuckets(
-      this.sortedBy
+      this.sortedBy,
     ) as Bucket[];
 
     if (this.facetKey === 'collection') {
@@ -371,7 +369,7 @@ export class MoreFacetsContent extends LitElement {
     const firstBucketIndexOnPage = (this.pageNumber - 1) * this.facetsPerPage;
     const truncatedBuckets = facetGroup.buckets.slice(
       firstBucketIndexOnPage,
-      firstBucketIndexOnPage + this.facetsPerPage
+      firstBucketIndexOnPage + this.facetsPerPage,
     );
 
     return {
@@ -391,7 +389,7 @@ export class MoreFacetsContent extends LitElement {
             this.unappliedFacetChanges = updateSelectedFacetBucket(
               this.unappliedFacetChanges,
               this.facetKey,
-              e.detail.bucket
+              e.detail.bucket,
             );
           }
         }}
@@ -454,7 +452,7 @@ export class MoreFacetsContent extends LitElement {
   private sortFacetAggregation(facetSortType: AggregationSortType) {
     this.sortedBy = facetSortType;
     this.dispatchEvent(
-      new CustomEvent('sortedFacets', { detail: this.sortedBy })
+      new CustomEvent('sortedFacets', { detail: this.sortedBy }),
     );
   }
 
@@ -475,11 +473,11 @@ export class MoreFacetsContent extends LitElement {
               leftValue=${AggregationSortType.COUNT}
               leftLabel="Count"
               rightValue=${valueFacetSort[this.facetKey]}
-              rightLabel=${this.facetGroup?.title}
+              .rightLabel=${this.facetGroup?.title}
               side=${defaultSwitchSide}
               @change=${(e: CustomEvent<string>) => {
                 this.sortFacetAggregation(
-                  Number(e.detail) as AggregationSortType
+                  Number(e.detail) as AggregationSortType,
                 );
               }}
             ></toggle-switch>`
@@ -504,7 +502,7 @@ export class MoreFacetsContent extends LitElement {
   private applySearchFacetsClicked() {
     const mergedSelections = mergeSelectedFacets(
       this.selectedFacets,
-      this.unappliedFacetChanges
+      this.unappliedFacetChanges,
     );
 
     const event = new CustomEvent<SelectedFacets>('facetsChanged', {

package/src/collection-facets/more-facets-pagination.ts

@@ -31,6 +31,7 @@ export class MoreFacetsPagination extends LitElement {
     this.observePageCount();
   }
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   override updated(changed: Map<string, any>) {
     if (changed.has('size')) {
       this.observePageCount();
@@ -175,7 +176,7 @@ export class MoreFacetsPagination extends LitElement {
         detail: { page: this.currentPage },
         bubbles: true,
         composed: true,
-      })
+      }),
     );
   }
 
@@ -219,7 +220,7 @@ export class MoreFacetsPagination extends LitElement {
         page =>
           html`${page !== 0
             ? this.getPageTemplate(page)
-            : this.getEllipsisTemplate}`
+            : this.getEllipsisTemplate}`,
       )}
     `;
   }

package/src/collection-facets/smart-facets/dedupe.ts

@@ -16,7 +16,7 @@ export function dedupe<T extends SmartFacet[] | SmartFacet[][]>(facets: T): T {
     let result: SmartFacet[] = [...facetsUnnested];
     for (const curFacet of facetsUnnested) {
       result = result.filter(
-        sf => curFacet === sf || !smartFacetEquals(curFacet, sf)
+        sf => curFacet === sf || !smartFacetEquals(curFacet, sf),
       );
     }
 
@@ -30,7 +30,7 @@ export function dedupe<T extends SmartFacet[] | SmartFacet[][]>(facets: T): T {
     const subresult: SmartFacet[] = [];
     for (const curFacet of curFacetArray) {
       const existing = result.find(sfa =>
-        sfa.find(sf => smartFacetEquals(curFacet, sf))
+        sfa.find(sf => smartFacetEquals(curFacet, sf)),
       );
       if (!existing) subresult.push(curFacet);
     }

package/src/collection-facets/smart-facets/heuristics/query-keywords-heuristic.ts

@@ -43,7 +43,7 @@ export class QueryKeywordsHeuristic implements SmartQueryHeuristic {
     const recommendations: SmartFacet[] = [];
 
     for (const [keyword, facets] of Object.entries(
-      QueryKeywordsHeuristic.KEYWORDS
+      QueryKeywordsHeuristic.KEYWORDS,
     )) {
       if (query.includes(keyword)) {
         recommendations.push(...facets);

package/src/collection-facets/smart-facets/heuristics/wikidata-heuristic.ts

@@ -147,12 +147,12 @@ export class WikidataHeuristic implements SmartQueryHeuristic {
       const urlQuery = encodeURIComponent(query);
 
       const wikidataResponse = await fetch(
-        `https://www.wikidata.org/w/api.php?action=wbsearchentities&search=${urlQuery}&format=json&language=en&uselang=en&origin=*&type=item&limit=5`
+        `https://www.wikidata.org/w/api.php?action=wbsearchentities&search=${urlQuery}&format=json&language=en&uselang=en&origin=*&type=item&limit=5`,
       );
       const searchResults = await wikidataResponse.json();
 
       for (const [keyword, facets] of Object.entries(
-        WikidataHeuristic.ENTITIES
+        WikidataHeuristic.ENTITIES,
       )) {
         const keywordRegex = new RegExp(`\\b${keyword}\\b`);
         if (keywordRegex.test(searchResults.search[0]?.description)) {
@@ -171,20 +171,20 @@ export class WikidataHeuristic implements SmartQueryHeuristic {
                     if (f.displayText) {
                       replaced.displayText = replaced.displayText?.replace(
                         '__QUERY',
-                        entityName
+                        entityName,
                       );
                     }
 
                     return replaced;
                   }),
-                } as SmartFacet)
-            )
+                }) as SmartFacet,
+            ),
           );
         }
       }
 
       return recommendations;
-    } catch (err) {
+    } catch {
       return [];
     }
   }

package/src/collection-facets/smart-facets/smart-facet-bar.ts

@@ -1,5 +1,3 @@
-/* eslint-disable no-continue */
-
 import {
   css,
   html,
@@ -68,7 +66,7 @@ export class SmartFacetBar extends LitElement {
           this.smartFacets,
           f =>
             `${f[0].label}|${f[0].facets[0].facetType}|${f[0].facets[0].bucketKey}`,
-          facet => this.makeSmartFacet(facet)
+          facet => this.makeSmartFacet(facet),
         )}
       </div>
     `;
@@ -190,7 +188,7 @@ export class SmartFacetBar extends LitElement {
           key === 'mediatype' &&
           this.selectedFacets &&
           Object.values(this.selectedFacets.mediatype).some(
-            bucket => bucket.state !== 'none'
+            bucket => bucket.state !== 'none',
           )
         ) {
           continue;
@@ -210,7 +208,7 @@ export class SmartFacetBar extends LitElement {
         if (facetType === 'mediatype') {
           facets.push(
             [this.toSmartFacet(facetType, [unusedBuckets[0]])],
-            [this.toSmartFacet(facetType, [unusedBuckets[1]])]
+            [this.toSmartFacet(facetType, [unusedBuckets[1]])],
           );
         } else if (facetType === 'collection' || facetType === 'subject') {
           const topBuckets = unusedBuckets.slice(0, 5);
@@ -226,7 +224,7 @@ export class SmartFacetBar extends LitElement {
 
   private toSmartFacet(
     facetType: FacetOption,
-    buckets: Bucket[]
+    buckets: Bucket[],
     // prefix = true
   ): SmartFacet {
     return {
@@ -259,7 +257,7 @@ export class SmartFacetBar extends LitElement {
         this.selectedFacets,
         facet.facetType,
         facet.bucket,
-        true
+        true,
       );
     }
 
@@ -286,7 +284,7 @@ export class SmartFacetBar extends LitElement {
         this.selectedFacets,
         facet.facetType,
         facet.bucket,
-        true
+        true,
       );
     }
 

package/src/collection-facets/smart-facets/smart-facet-button.ts

@@ -28,7 +28,9 @@ export class SmartFacetButton extends LitElement {
 
     const displayText = capitalize(
       (this.labelPrefix ? `${this.labelPrefix} ` : '') +
-        (this.facetInfo.label ?? firstFacet.displayText ?? firstFacet.bucketKey)
+        (this.facetInfo.label ??
+          firstFacet.displayText ??
+          firstFacet.bucketKey),
     );
     if (!displayText) return nothing;
 
@@ -61,7 +63,7 @@ export class SmartFacetButton extends LitElement {
       for (const facet of this.facetInfo.facets) {
         url.searchParams.append(
           'and[]',
-          encodeURIComponent(`${facet.facetType}:"${facet.bucketKey}"`)
+          encodeURIComponent(`${facet.facetType}:"${facet.bucketKey}"`),
         );
       }
     }
@@ -88,7 +90,7 @@ export class SmartFacetButton extends LitElement {
             negative: false,
           })),
         },
-      })
+      }),
     );
   }