@internetarchive/collection-browser 2.7.14-alpha-webdev7002.4 → 2.7.14-alpha-webdev7397.1

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

@@ -0,0 +1,191 @@
+import type {
+  SmartQueryHeuristic,
+  KeywordFacetMap,
+  SmartFacet,
+} from '../models';
+
+// If wikidata describes the top query result as X, recommend facet Y, e.g.:
+// X              Y
+// written work   mt:texts
+// film           mt:movies
+// author         mt:texts and creator:<query>
+// filmmaker      mt:movies and creator:<query>
+// photographer   mt:image and creator:<query>
+// visual artist  mt:image and creator:<query>
+// etc.
+export class WikidataHeuristic implements SmartQueryHeuristic {
+  private static readonly ENTITIES: KeywordFacetMap = {
+    'written work': [
+      { facets: [{ facetType: 'mediatype', bucketKey: 'texts' }] },
+    ],
+    literature: [{ facets: [{ facetType: 'mediatype', bucketKey: 'texts' }] }],
+    book: [{ facets: [{ facetType: 'mediatype', bucketKey: 'texts' }] }],
+    novel: [{ facets: [{ facetType: 'mediatype', bucketKey: 'texts' }] }],
+    filmmaker: [
+      {
+        label: 'Films by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'movies' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    author: [
+      {
+        label: 'Writing by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'texts' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    writer: [
+      {
+        label: 'Writing by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'texts' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    poet: [
+      {
+        label: 'Writing by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'texts' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    photographer: [
+      {
+        label: 'Images by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'image' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    painter: [
+      {
+        label: 'Images by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'image' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    'visual artist': [
+      {
+        label: 'Images by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'image' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    'graphic artist': [
+      {
+        label: 'Images by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'image' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    singer: [
+      {
+        label: 'Music by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'audio' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    songwriter: [
+      {
+        label: 'Music by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'audio' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    musician: [
+      {
+        label: 'Music by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'audio' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    composer: [
+      {
+        label: 'Music by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'audio' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+    pianist: [
+      {
+        label: 'Music by __QUERY',
+        facets: [
+          { facetType: 'mediatype', bucketKey: 'audio' },
+          { facetType: 'creator', bucketKey: '__QUERY' },
+        ],
+      },
+    ],
+  };
+
+  async getRecommendedFacets(query: string): Promise<SmartFacet[]> {
+    const recommendations: SmartFacet[] = [];
+
+    try {
+      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`,
+      );
+      const searchResults = await wikidataResponse.json();
+
+      for (const [keyword, facets] of Object.entries(
+        WikidataHeuristic.ENTITIES,
+      )) {
+        const keywordRegex = new RegExp(`\\b${keyword}\\b`);
+        if (keywordRegex.test(searchResults.search[0]?.description)) {
+          const entityName = searchResults.search[0].label;
+          recommendations.push(
+            ...facets.map(
+              sf =>
+                ({
+                  label: sf.label?.replace('__QUERY', entityName),
+                  facets: sf.facets.map(f => {
+                    const replaced = {
+                      ...f,
+                      bucketKey: f.bucketKey.replace('__QUERY', query),
+                    };
+
+                    if (f.displayText) {
+                      replaced.displayText = replaced.displayText?.replace(
+                        '__QUERY',
+                        entityName,
+                      );
+                    }
+
+                    return replaced;
+                  }),
+                }) as SmartFacet,
+            ),
+          );
+        }
+      }
+
+      return recommendations;
+    } 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,
           })),
         },
-      })
+      }),
     );
   }
 

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

@@ -67,7 +67,7 @@ export class SmartFacetDropdown extends LitElement {
   private get activeDropdownOption(): optionInterface | undefined {
     if (!this.activeFacetRef) return undefined;
     return this.dropdownOptions.find(
-      opt => opt.id === this.activeFacetRef?.bucketKey
+      opt => opt.id === this.activeFacetRef?.bucketKey,
     );
   }
 
@@ -77,7 +77,7 @@ export class SmartFacetDropdown extends LitElement {
     let selectedSmartFacet;
     for (const smartFacet of this.facetInfo) {
       const selectedRef = smartFacet.facets.find(
-        b => b.bucketKey === e.detail.option.id
+        b => b.bucketKey === e.detail.option.id,
       );
       if (selectedRef) {
         this.activeFacetRef = selectedRef;
@@ -103,14 +103,14 @@ export class SmartFacetDropdown extends LitElement {
             },
           ],
         },
-      })
+      }),
     );
   }
 
   private onDropdownClick(): void {
     log('smart dropdown: onDropdownClick', this);
     this.dispatchEvent(
-      new CustomEvent<SmartFacetDropdown>('dropdownClick', { detail: this })
+      new CustomEvent<SmartFacetDropdown>('dropdownClick', { detail: this }),
     );
   }
 

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

@@ -1,24 +1,19 @@
 import { dedupe } from './dedupe';
-import { BrowserLanguageHeuristic } from './heuristics/browser-language/browser-language-heuristic';
-import { QueryKeywordsHeuristic } from './heuristics/query-keywords/query-keywords-heuristic';
-import { WikidataHeuristic } from './heuristics/wikidata/wikidata-heuristic';
+import { BrowserLanguageHeuristic } from './heuristics/browser-language-heuristic';
+import { QueryKeywordsHeuristic } from './heuristics/query-keywords-heuristic';
+import { WikidataHeuristic } from './heuristics/wikidata-heuristic';
 import type { SmartFacet, SmartQueryHeuristic } from './models';
 
 export class SmartQueryHeuristicGroup implements SmartQueryHeuristic {
-  // Avoid collapsing the array onto one line
-  // prettier-ignore
-  private static readonly DEFAULT_HEURISTICS: (new () => SmartQueryHeuristic)[] = [
+  private static readonly HEURISTICS = [
     QueryKeywordsHeuristic,
     WikidataHeuristic,
-    BrowserLanguageHeuristic
+    BrowserLanguageHeuristic,
   ];
 
-  async getRecommendedFacets(
-    query: string,
-    heuristics = SmartQueryHeuristicGroup.DEFAULT_HEURISTICS
-  ): Promise<SmartFacet[]> {
-    const promises = heuristics.map(HeuristicCtor =>
-      new HeuristicCtor().getRecommendedFacets(query)
+  async getRecommendedFacets(query: string): Promise<SmartFacet[]> {
+    const promises = SmartQueryHeuristicGroup.HEURISTICS.map(HeuristicCtor =>
+      new HeuristicCtor().getRecommendedFacets(query),
     );
 
     return dedupe((await Promise.all(promises)).flat());

package/src/collection-facets/toggle-switch.ts

@@ -84,8 +84,8 @@ export class ToggleSwitch extends LitElement {
    */
   get selectedLabel(): string {
     return this.side === 'left'
-      ? this.leftLabel ?? this.leftValue
-      : this.rightLabel ?? this.rightValue;
+      ? (this.leftLabel ?? this.leftValue)
+      : (this.rightLabel ?? this.rightValue);
   }
 
   private handleClick(): void {

package/src/collection-facets.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-duplicates */
 import {
   css,
   html,
@@ -171,7 +170,7 @@ export class CollectionFacets extends LitElement {
           : nothing}
         ${this.collectionPartOfTemplate}
         ${this.mergedFacets.map(facetGroup =>
-          this.getFacetGroupTemplate(facetGroup)
+          this.getFacetGroupTemplate(facetGroup),
         )}
       </div>
     `;
@@ -349,7 +348,7 @@ export class CollectionFacets extends LitElement {
     e: CustomEvent<{
       minDate: string;
       maxDate: string;
-    }>
+    }>,
   ): void => {
     const { minDate, maxDate } = e.detail;
     const event = new CustomEvent('histogramDateRangeUpdated', {
@@ -366,10 +365,10 @@ export class CollectionFacets extends LitElement {
 
     facetDisplayOrder.forEach(facetKey => {
       const selectedFacetGroup = this.selectedFacetGroups.find(
-        group => group.key === facetKey
+        group => group.key === facetKey,
       );
       const aggregateFacetGroup = this.aggregationFacetGroups.find(
-        group => group.key === facetKey
+        group => group.key === facetKey,
       );
 
       // if the user selected a facet, but it's not in the aggregation, we add it as-is
@@ -388,7 +387,7 @@ export class CollectionFacets extends LitElement {
       let bucketsWithCount =
         selectedFacetGroup?.buckets.map(bucket => {
           const selectedBucket = aggregateFacetGroup.buckets.find(
-            b => b.key === bucket.key
+            b => b.key === bucket.key,
           );
           return selectedBucket
             ? {
@@ -412,7 +411,7 @@ export class CollectionFacets extends LitElement {
        * - additionally want to show all items (selected/suppressed) in page facet area
        */
       let allowedFacetCount = Object.keys(
-        (selectedFacetGroup?.buckets as []) || []
+        (selectedFacetGroup?.buckets as []) || [],
       )?.length;
       if (allowedFacetCount < this.allowedFacetCount) {
         allowedFacetCount = this.allowedFacetCount; // splice start index from 0th
@@ -421,7 +420,7 @@ export class CollectionFacets extends LitElement {
       // For lending facets, only include a specific subset of buckets
       if (facetKey === 'lending') {
         bucketsWithCount = bucketsWithCount.filter(
-          bucket => lendingFacetKeysVisibility[bucket.key as LendingFacetKey]
+          bucket => lendingFacetKeysVisibility[bucket.key as LendingFacetKey],
         );
       }
 
@@ -431,13 +430,13 @@ export class CollectionFacets extends LitElement {
       // For mediatype facets, ensure the collection bucket is always shown if present
       if (facetKey === 'mediatype') {
         const collectionIndex = bucketsWithCount.findIndex(
-          bucket => bucket.key === 'collection'
+          bucket => bucket.key === 'collection',
         );
 
         if (collectionIndex >= allowedFacetCount) {
           const [collectionBucket] = bucketsWithCount.splice(
             collectionIndex,
-            1
+            1,
           );
 
           // If we're showing lots of selected facets, ensure we're not cutting off the last one
@@ -484,7 +483,7 @@ export class CollectionFacets extends LitElement {
               count: facetData.count,
               state: facetData.state,
             };
-          }
+          },
         );
 
         return {
@@ -492,7 +491,7 @@ export class CollectionFacets extends LitElement {
           key: option,
           buckets,
         };
-      }
+      },
     );
 
     return facetGroups;
@@ -512,7 +511,7 @@ export class CollectionFacets extends LitElement {
       if (!title) return;
 
       let castedBuckets = aggregation.getSortedBuckets(
-        defaultFacetSort[option]
+        defaultFacetSort[option],
       ) as Bucket[];
 
       if (option === 'collection') {
@@ -556,7 +555,7 @@ export class CollectionFacets extends LitElement {
    * chevron for the mobile view
    */
   private getFacetGroupTemplate(
-    facetGroup: FacetGroup
+    facetGroup: FacetGroup,
   ): TemplateResult | typeof nothing {
     if (!this.facetsLoading && facetGroup.buckets.length === 0) return nothing;
 
@@ -611,7 +610,7 @@ export class CollectionFacets extends LitElement {
     return html`
       ${map(
         Array(5).fill(null),
-        () => html`<facet-tombstone-row></facet-tombstone-row>`
+        () => html`<facet-tombstone-row></facet-tombstone-row>`,
       )}
     `;
   }
@@ -622,7 +621,7 @@ export class CollectionFacets extends LitElement {
    * TODO: want to fire analytics?
    */
   private searchMoreFacetsLink(
-    facetGroup: FacetGroup
+    facetGroup: FacetGroup,
   ): TemplateResult | typeof nothing {
     // Don't render More... links for FTS searches
     if (!this.moreLinksVisible) {
@@ -654,7 +653,7 @@ export class CollectionFacets extends LitElement {
           label: facetGroup.key,
         });
         this.dispatchEvent(
-          new CustomEvent('showMoreFacets', { detail: facetGroup.key })
+          new CustomEvent('showMoreFacets', { detail: facetGroup.key }),
         );
       }}
       data-testid="more-link-btn"
@@ -665,7 +664,7 @@ export class CollectionFacets extends LitElement {
 
   async showMoreFacetsModal(
     facetGroup: FacetGroup,
-    sortedBy: AggregationSortType
+    sortedBy: AggregationSortType,
   ): Promise<void> {
     const customModalContent = html`
       <more-facets-content
@@ -724,7 +723,7 @@ export class CollectionFacets extends LitElement {
             this.selectedFacets,
             facetGroup.key,
             e.detail.bucket,
-            true
+            true,
           );
 
           const event = new CustomEvent<SelectedFacets>('facetsChanged', {

package/src/data-source/collection-browser-data-source-interface.ts

@@ -285,7 +285,11 @@ export interface CollectionBrowserDataSourceInterface
    * @param callback A callback function to apply on each tile model, as with Array.map
    */
   map(
-    callback: (model: TileModel, index: number, array: TileModel[]) => TileModel
+    callback: (
+      model: TileModel,
+      index: number,
+      array: TileModel[],
+    ) => TileModel,
   ): void;
 
   /**