From e86bdf8b18e1d0ea622d7397e68def0d958e588d Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Tue, 13 May 2025 12:35:56 -0700 Subject: [PATCH 01/18] Update styling of smart bubbles/dropdowns --- .../smart-facets/smart-facet-button.ts | 12 +++++++----- .../smart-facets/smart-facet-dropdown.ts | 9 +++++---- 2 files changed, 12 insertions(+), 9 deletions(-) diff --git a/src/collection-facets/smart-facets/smart-facet-button.ts b/src/collection-facets/smart-facets/smart-facet-button.ts index dc7200c67..cacf26d07 100644 --- a/src/collection-facets/smart-facets/smart-facet-button.ts +++ b/src/collection-facets/smart-facets/smart-facet-button.ts @@ -102,17 +102,19 @@ export class SmartFacetButton extends LitElement { return css` .smart-facet-button { padding: 5px 10px; - border-radius: 15px; - background: #194880; - color: white; - font-size: 1.6rem; + border-radius: 5px; + background: white; + color: #2c2c2c; + border: 1px solid #194880; + font-size: 1.4rem; font-family: inherit; text-decoration: none; box-shadow: 1px 1px rgba(0, 0, 0, 0.4); } .smart-facet-button.selected { - background: #4c76aa; + background: #194880; + color: white; } .smart-facet-button > svg { diff --git a/src/collection-facets/smart-facets/smart-facet-dropdown.ts b/src/collection-facets/smart-facets/smart-facet-dropdown.ts index 55540176b..7720f1aae 100644 --- a/src/collection-facets/smart-facets/smart-facet-dropdown.ts +++ b/src/collection-facets/smart-facets/smart-facet-dropdown.ts @@ -129,15 +129,16 @@ export class SmartFacetDropdown extends LitElement { .dropdown-container { padding: 5px 8px; border-radius: 5px; - background: #194880; - color: white; - font-size: 1.6rem; + background: white; + color: #2c2c2c; + border: 1px solid #194880; + font-size: 1.4rem; font-family: inherit; box-shadow: 1px 1px rgba(0, 0, 0, 0.4); } .dropdown-label { - font-size: 1.6rem; + font-size: 1.4rem; font-family: inherit; } From 317e204bf3d22f7096d47dffe423241ef9499db7 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 14 May 2025 10:52:14 -0700 Subject: [PATCH 02/18] Further styling changes --- src/assets/img/icons/close-circle-dark.ts | 5 ++++ .../smart-facets/smart-facet-bar.ts | 23 +++++++++++-------- .../smart-facets/smart-facet-button.ts | 17 ++++++++++---- .../smart-facets/smart-facet-dropdown.ts | 9 ++++++-- 4 files changed, 38 insertions(+), 16 deletions(-) create mode 100644 src/assets/img/icons/close-circle-dark.ts diff --git a/src/assets/img/icons/close-circle-dark.ts b/src/assets/img/icons/close-circle-dark.ts new file mode 100644 index 000000000..9f65d6566 --- /dev/null +++ b/src/assets/img/icons/close-circle-dark.ts @@ -0,0 +1,5 @@ +import { svg } from 'lit'; + +export default svg` + +`; diff --git a/src/collection-facets/smart-facets/smart-facet-bar.ts b/src/collection-facets/smart-facets/smart-facet-bar.ts index dcf2d6bb2..ce035889c 100644 --- a/src/collection-facets/smart-facets/smart-facet-bar.ts +++ b/src/collection-facets/smart-facets/smart-facet-bar.ts @@ -327,26 +327,29 @@ export class SmartFacetBar extends LitElement { #filters-toggle { margin: 0; border: 0; - padding: 5px 10px; - border-radius: 15px; - background: #194880; - color: white; - font-size: 1.6rem; + padding: 5px 8px; + border-radius: 50%; + background: white; + color: #2c2c2c; + border: 1px solid #194880; + font-size: 1.4rem; font-family: inherit; text-decoration: none; - box-shadow: 1px 1px rgba(0, 0, 0, 0.4); cursor: pointer; } #filters-toggle.active { - background: #09294d; - box-shadow: -1px -1px rgba(0, 0, 0, 0.1); + background: #194880; + color: white; } #filters-toggle > svg { - width: 15px; + width: 12px; + filter: invert(0.16667); + } + + #filters-toggle.active > svg { filter: invert(1); - vertical-align: text-bottom; } `; } diff --git a/src/collection-facets/smart-facets/smart-facet-button.ts b/src/collection-facets/smart-facets/smart-facet-button.ts index cacf26d07..98af3ac48 100644 --- a/src/collection-facets/smart-facets/smart-facet-button.ts +++ b/src/collection-facets/smart-facets/smart-facet-button.ts @@ -3,6 +3,8 @@ import { customElement, property } from 'lit/decorators.js'; import { mediatypeConfig } from '../../mediatype/mediatype-config'; import type { SmartFacet, SmartFacetEvent } from './models'; +import closeCircleDark from '../../assets/img/icons/close-circle-dark'; + function capitalize(str?: string): string | undefined { if (!str) return str; return str.charAt(0).toLocaleUpperCase() + str.slice(1); @@ -47,7 +49,9 @@ export class SmartFacetButton extends LitElement { > ${icon} ${displayText} ${this.selected - ? html`×` + ? html`${closeCircleDark}` : nothing} `; @@ -109,7 +113,6 @@ export class SmartFacetButton extends LitElement { font-size: 1.4rem; font-family: inherit; text-decoration: none; - box-shadow: 1px 1px rgba(0, 0, 0, 0.4); } .smart-facet-button.selected { @@ -117,10 +120,16 @@ export class SmartFacetButton extends LitElement { color: white; } + .smart-facet-button .unselect { + } + .smart-facet-button > svg { - width: 15px; + width: 12px; + filter: invert(0.16667); + } + + .smart-facet-button.selected > svg { filter: invert(1); - vertical-align: text-top; } `; } diff --git a/src/collection-facets/smart-facets/smart-facet-dropdown.ts b/src/collection-facets/smart-facets/smart-facet-dropdown.ts index 7720f1aae..f2e0176c0 100644 --- a/src/collection-facets/smart-facets/smart-facet-dropdown.ts +++ b/src/collection-facets/smart-facets/smart-facet-dropdown.ts @@ -134,7 +134,6 @@ export class SmartFacetDropdown extends LitElement { border: 1px solid #194880; font-size: 1.4rem; font-family: inherit; - box-shadow: 1px 1px rgba(0, 0, 0, 0.4); } .dropdown-label { @@ -144,7 +143,13 @@ export class SmartFacetDropdown extends LitElement { .dropdown { --dropdownBorderWidth: 5px; - --dropdownBorderColor: transparent; + --dropdownBorderColor: #194880; + --dropdownBorderWidth: 1px; + --dropdownBgColor: white; + --dropdownTextColor: #2c2c2c; + --dropdownHoverTextColor: #2c2c2c; + --dropdownCaretColor: #2c2c2c; + --dropdownWhiteSpace: nowrap; --caretWidth: 14px; --caretHeight: 14px; } From 533e161acbb8e85aff9fd075160b352c0d5e3158 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 14 May 2025 12:26:03 -0700 Subject: [PATCH 03/18] Add more close attrs to dropdowns --- .../smart-facets/smart-facet-bar.ts | 3 ++- .../smart-facets/smart-facet-button.ts | 16 +++++++++++----- .../smart-facets/smart-facet-dropdown.ts | 6 ++++-- 3 files changed, 17 insertions(+), 8 deletions(-) diff --git a/src/collection-facets/smart-facets/smart-facet-bar.ts b/src/collection-facets/smart-facets/smart-facet-bar.ts index ce035889c..691ea4586 100644 --- a/src/collection-facets/smart-facets/smart-facet-bar.ts +++ b/src/collection-facets/smart-facets/smart-facet-bar.ts @@ -320,7 +320,7 @@ export class SmartFacetBar extends LitElement { display: flex; align-items: center; flex-wrap: wrap; - gap: 5px; + gap: 5px 10px; padding: 10px 0; } @@ -346,6 +346,7 @@ export class SmartFacetBar extends LitElement { #filters-toggle > svg { width: 12px; filter: invert(0.16667); + vertical-align: -1px; } #filters-toggle.active > svg { diff --git a/src/collection-facets/smart-facets/smart-facet-button.ts b/src/collection-facets/smart-facets/smart-facet-button.ts index 98af3ac48..e108eb953 100644 --- a/src/collection-facets/smart-facets/smart-facet-button.ts +++ b/src/collection-facets/smart-facets/smart-facet-button.ts @@ -49,9 +49,7 @@ export class SmartFacetButton extends LitElement { > ${icon} ${displayText} ${this.selected - ? html`${closeCircleDark}` + ? html`${closeCircleDark}` : nothing} `; @@ -105,13 +103,17 @@ export class SmartFacetButton extends LitElement { static get styles(): CSSResultGroup { return css` .smart-facet-button { - padding: 5px 10px; + display: inline-flex; + align-items: center; + column-gap: 5px; + padding: 5px 5px; border-radius: 5px; background: white; color: #2c2c2c; border: 1px solid #194880; font-size: 1.4rem; font-family: inherit; + line-height: normal; text-decoration: none; } @@ -120,11 +122,15 @@ export class SmartFacetButton extends LitElement { color: white; } - .smart-facet-button .unselect { + .unselect-button > svg { + width: 10px; + height: 10px; + filter: invert(1); } .smart-facet-button > svg { width: 12px; + height: 12px; filter: invert(0.16667); } diff --git a/src/collection-facets/smart-facets/smart-facet-dropdown.ts b/src/collection-facets/smart-facets/smart-facet-dropdown.ts index f2e0176c0..2b2a8097b 100644 --- a/src/collection-facets/smart-facets/smart-facet-dropdown.ts +++ b/src/collection-facets/smart-facets/smart-facet-dropdown.ts @@ -33,6 +33,8 @@ export class SmartFacetDropdown extends LitElement { displayCaret openViaButton closeOnSelect + closeOnEscape + closeOnBackdropClick includeSelectedOption .options=${this.dropdownOptions} .selectedOption=${this.activeDropdownOption} @@ -127,7 +129,7 @@ export class SmartFacetDropdown extends LitElement { static get styles(): CSSResultGroup { return css` .dropdown-container { - padding: 5px 8px; + padding: 5px 5px; border-radius: 5px; background: white; color: #2c2c2c; @@ -142,10 +144,10 @@ export class SmartFacetDropdown extends LitElement { } .dropdown { - --dropdownBorderWidth: 5px; --dropdownBorderColor: #194880; --dropdownBorderWidth: 1px; --dropdownBgColor: white; + --dropdownHoverBgColor: #f8f8f8; --dropdownTextColor: #2c2c2c; --dropdownHoverTextColor: #2c2c2c; --dropdownCaretColor: #2c2c2c; From c15d860787fbacc9ea9baa7a78c69678e17f4b04 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 14 May 2025 15:38:10 -0700 Subject: [PATCH 04/18] Lowercase creator heuristic bucket keys --- .../smart-facets/heuristics/wikidata/wikidata-heuristic.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/collection-facets/smart-facets/heuristics/wikidata/wikidata-heuristic.ts b/src/collection-facets/smart-facets/heuristics/wikidata/wikidata-heuristic.ts index c776be2f9..5cf964b5d 100644 --- a/src/collection-facets/smart-facets/heuristics/wikidata/wikidata-heuristic.ts +++ b/src/collection-facets/smart-facets/heuristics/wikidata/wikidata-heuristic.ts @@ -44,7 +44,10 @@ export class WikidataHeuristic implements SmartQueryHeuristic { facets: smartFacet.facets.map(facet => { const replaced = { ...facet, - bucketKey: facet.bucketKey.replace('__QUERY', query), + bucketKey: facet.bucketKey.replace( + '__QUERY', + query.toLowerCase(), + ), }; if (facet.displayText) { From 35a786ccf387074001de1032e420017ef7a6544f Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Mon, 2 Jun 2025 13:59:47 -0700 Subject: [PATCH 05/18] Add results header property --- src/collection-browser.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/collection-browser.ts b/src/collection-browser.ts index 63a073536..0d60c4323 100644 --- a/src/collection-browser.ts +++ b/src/collection-browser.ts @@ -250,6 +250,8 @@ export class CollectionBrowser /** Whether to display a smart results carousel above the full results */ @property({ type: Boolean, reflect: true }) showSmartResults = false; + @property({ type: String }) resultsHeader?: string; + /** * The maximum number of pages we will load when a privileged user clicks * the "Manage" button on the search page. Limited to 15 pages. @@ -693,7 +695,7 @@ export class CollectionBrowser
${this.showSmartResults ? html`

- ${msg('All results')} + ${this.resultsHeader ?? msg('All results')}

` : nothing}
From 5827a52d4f71d5e19099f426756b7aa490159adf Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Mon, 2 Jun 2025 14:01:50 -0700 Subject: [PATCH 06/18] Omit mediatype smart facets --- src/collection-facets/smart-facets/smart-facet-bar.ts | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/collection-facets/smart-facets/smart-facet-bar.ts b/src/collection-facets/smart-facets/smart-facet-bar.ts index 691ea4586..0dfb4dea7 100644 --- a/src/collection-facets/smart-facets/smart-facet-bar.ts +++ b/src/collection-facets/smart-facets/smart-facet-bar.ts @@ -206,10 +206,12 @@ export class SmartFacetBar extends LitElement { }); if (facetType === 'mediatype') { - facets.push( - [this.toSmartFacet(facetType, [unusedBuckets[0]])], - [this.toSmartFacet(facetType, [unusedBuckets[1]])], - ); + continue; + // Don't include mediatype bubbles + // facets.push( + // [this.toSmartFacet(facetType, [unusedBuckets[0]])], + // [this.toSmartFacet(facetType, [unusedBuckets[1]])], + // ); } else if (facetType === 'collection' || facetType === 'subject') { const topBuckets = unusedBuckets.slice(0, 5); facets.push(topBuckets.map(b => this.toSmartFacet(facetType, [b]))); From 8bb96b3044a0e8083e1166a0a45b23ff147bada9 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Mon, 2 Jun 2025 14:04:05 -0700 Subject: [PATCH 07/18] Add label to smart bubbles --- src/collection-facets/smart-facets/smart-facet-bar.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/collection-facets/smart-facets/smart-facet-bar.ts b/src/collection-facets/smart-facets/smart-facet-bar.ts index 0dfb4dea7..c67942adf 100644 --- a/src/collection-facets/smart-facets/smart-facet-bar.ts +++ b/src/collection-facets/smart-facets/smart-facet-bar.ts @@ -9,6 +9,7 @@ import { } from 'lit'; import { repeat } from 'lit/directives/repeat.js'; import { customElement, property, state } from 'lit/decorators.js'; +import { msg } from '@lit/localize'; import type { Aggregation, Bucket } from '@internetarchive/search-service'; import type { CollectionTitles } from '../../data-source/models'; import type { FacetOption, SelectedFacets } from '../../models'; @@ -18,11 +19,11 @@ import type { SmartFacetDropdown } from './smart-facet-dropdown'; import type { SmartFacet, SmartFacetEvent } from './models'; import { smartFacetEquals } from './smart-facet-equals'; import { dedupe } from './dedupe'; +import { log } from '../../utils/log'; import filterIcon from '../../assets/img/icons/filter'; import './smart-facet-button'; import './smart-facet-dropdown'; -import { log } from '../../utils/log'; const fieldPrefixes: Partial> = { collection: 'Collection: ', @@ -62,6 +63,7 @@ export class SmartFacetBar extends LitElement { return html`
${this.filtersToggleTemplate} +

${msg('Insights:')}

${repeat( this.smartFacets, f => @@ -354,6 +356,11 @@ export class SmartFacetBar extends LitElement { #filters-toggle.active > svg { filter: invert(1); } + + #filters-label { + font-weight: bold; + margin-right: -5px; + } `; } } From 3bee177cd69f3f2f5e1f8ea549a6ee8d9540bc47 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Mon, 2 Jun 2025 17:09:58 -0700 Subject: [PATCH 08/18] Only show label when there are > 0 smart facets --- src/collection-facets/smart-facets/smart-facet-bar.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/collection-facets/smart-facets/smart-facet-bar.ts b/src/collection-facets/smart-facets/smart-facet-bar.ts index c67942adf..e6a76abff 100644 --- a/src/collection-facets/smart-facets/smart-facet-bar.ts +++ b/src/collection-facets/smart-facets/smart-facet-bar.ts @@ -63,7 +63,9 @@ export class SmartFacetBar extends LitElement { return html`
${this.filtersToggleTemplate} -

${msg('Insights:')}

+ ${this.smartFacets.length > 0 + ? html`

${msg('Insights:')}

` + : nothing} ${repeat( this.smartFacets, f => From 29b997c412a1fb26ec629277f2f0caaad8dd7b1c Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Mon, 2 Jun 2025 17:24:34 -0700 Subject: [PATCH 09/18] Hide smart facets if query is cleared --- src/collection-browser.ts | 2 +- src/collection-facets/smart-facets/smart-facet-bar.ts | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/collection-browser.ts b/src/collection-browser.ts index 0d60c4323..159763303 100644 --- a/src/collection-browser.ts +++ b/src/collection-browser.ts @@ -509,7 +509,7 @@ export class CollectionBrowser render() { return html` ${this.showSmartFacetBar - ? html` ${this.filtersToggleTemplate} From 75beaa603806be091b63dd8778a1ca4669b1b852 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Tue, 3 Jun 2025 11:57:19 -0700 Subject: [PATCH 10/18] Upgrade search-service to alpha version --- package.json | 4 ++-- yarn.lock | 39 +++++++-------------------------------- 2 files changed, 9 insertions(+), 34 deletions(-) diff --git a/package.json b/package.json index 3331195bc..ef9e09960 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "description": "The Internet Archive Collection Browser.", "license": "AGPL-3.0-only", "author": "Internet Archive", - "version": "2.10.0", + "version": "2.10.1-alpha-webdev7090.22", "main": "dist/index.js", "module": "dist/index.js", "scripts": { @@ -32,7 +32,7 @@ "@internetarchive/iaux-item-metadata": "^1.0.4", "@internetarchive/infinite-scroller": "^1.0.1", "@internetarchive/modal-manager": "^2.0.1", - "@internetarchive/search-service": "^2.0.0", + "@internetarchive/search-service": "2.0.1-alpha-webdev7090.1", "@internetarchive/shared-resize-observer": "^0.2.0", "@lit/localize": "^0.12.2", "dompurify": "^3.2.4", diff --git a/yarn.lock b/yarn.lock index 8e0b9e44e..f5bf11daa 100644 --- a/yarn.lock +++ b/yarn.lock @@ -407,10 +407,10 @@ resolved "https://registry.yarnpkg.com/@internetarchive/result-type/-/result-type-0.0.1.tgz#a1bda4428dc557cc644a67783f1b8d5944ae4d54" integrity sha512-sWahff5oP1xAK1CwAu1/5GTG2RXsdx/sQKn4SSOWH0r0vU2QoX9kAom/jSXeBsmgK0IjTc+9Ty9407SMORi+nQ== -"@internetarchive/search-service@^2.0.0": - version "2.0.0" - resolved "https://registry.yarnpkg.com/@internetarchive/search-service/-/search-service-2.0.0.tgz#fd2a1a4fd1c344b7c34591faf2c85d1002251e1d" - integrity sha512-SyaJZv49nGoaqWVLuhHA9Xmrr75WoQ3FkBwMs6PfJlxx3OudSX1iLsgHp7Ib00IK97byOZgPTrmHMTk5YJ8WOw== +"@internetarchive/search-service@2.0.1-alpha-webdev7090.1": + version "2.0.1-alpha-webdev7090.1" + resolved "https://registry.yarnpkg.com/@internetarchive/search-service/-/search-service-2.0.1-alpha-webdev7090.1.tgz#8443e2f3317016ccc99738c865e5b9ba85906946" + integrity sha512-flHZsLBxG+Rvau/hNiNhkCKyK48gjjtFR+2daupNlgiZAZeL83W7en+nleC0+qkyUTfuqpsFxJorteqbGH2VIQ== dependencies: "@internetarchive/iaux-item-metadata" "^1.0.4" "@internetarchive/result-type" "^0.0.1" @@ -5061,16 +5061,7 @@ streamx@^2.15.0, streamx@^2.21.0: optionalDependencies: bare-events "^2.2.0" -"string-width-cjs@npm:string-width@^4.2.0": - version "4.2.3" - resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" - integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== - dependencies: - emoji-regex "^8.0.0" - is-fullwidth-code-point "^3.0.0" - strip-ansi "^6.0.1" - -string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: +"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -5136,14 +5127,7 @@ stringify-object@^3.2.1: is-obj "^1.0.1" is-regexp "^1.0.0" -"strip-ansi-cjs@npm:strip-ansi@^6.0.1": - version "6.0.1" - resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" - integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== - dependencies: - ansi-regex "^5.0.1" - -strip-ansi@^6.0.0, strip-ansi@^6.0.1: +"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== @@ -5592,7 +5576,7 @@ wordwrapjs@^5.1.0: resolved "https://registry.yarnpkg.com/wordwrapjs/-/wordwrapjs-5.1.0.tgz#4c4d20446dcc670b14fa115ef4f8fd9947af2b3a" integrity sha512-JNjcULU2e4KJwUNv6CHgI46UvDGitb6dGryHajXTDiLgg1/RiGoPSDw4kZfYnwGtEXf2ZMeIewDQgFGzkCB2Sg== -"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0": +"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== @@ -5610,15 +5594,6 @@ wrap-ansi@^6.2.0: string-width "^4.1.0" strip-ansi "^6.0.0" -wrap-ansi@^7.0.0: - version "7.0.0" - resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" - integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== - dependencies: - ansi-styles "^4.0.0" - string-width "^4.1.0" - strip-ansi "^6.0.0" - wrap-ansi@^8.1.0: version "8.1.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214" From f9f7bb9d3c9ed174dfc0514e3c8306bff318a832 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Tue, 3 Jun 2025 13:02:53 -0700 Subject: [PATCH 11/18] Add method to refresh smart facets --- src/collection-browser.ts | 7 +++++++ src/collection-facets/smart-facets/smart-facet-bar.ts | 4 ++++ 2 files changed, 11 insertions(+) diff --git a/src/collection-browser.ts b/src/collection-browser.ts index 159763303..77fb5f86b 100644 --- a/src/collection-browser.ts +++ b/src/collection-browser.ts @@ -67,6 +67,7 @@ import { sha1 } from './utils/sha1'; import { log } from './utils/log'; import type { PlaceholderType } from './empty-placeholder'; import type { ManageBar } from './manage/manage-bar'; +import type { SmartFacetBar } from './collection-facets/smart-facets/smart-facet-bar'; import './empty-placeholder'; import './tiles/tile-dispatcher'; @@ -306,6 +307,8 @@ export class CollectionBrowser @query('manage-bar') private manageBar?: ManageBar; + @query('smart-facet-bar') private smartFacetBar?: SmartFacetBar; + @property({ type: Object, attribute: false }) analyticsHandler?: AnalyticsManagerInterface; @@ -843,6 +846,10 @@ export class CollectionBrowser ); } + refreshSmartFacets(): void { + this.smartFacetBar?.refresh(); + } + /** * Handler to show processing modal while removing item */ diff --git a/src/collection-facets/smart-facets/smart-facet-bar.ts b/src/collection-facets/smart-facets/smart-facet-bar.ts index fd0fe614b..79ccc9965 100644 --- a/src/collection-facets/smart-facets/smart-facet-bar.ts +++ b/src/collection-facets/smart-facets/smart-facet-bar.ts @@ -104,6 +104,10 @@ export class SmartFacetBar extends LitElement { } } + refresh(): void { + this.updateSmartFacets(); + } + private async updateSmartFacets(): Promise { log('updating smart facets'); if (this.query) { From 5ecb67bd10a001642277361690ac2f2fd82bc27b Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 4 Jun 2025 10:21:14 -0700 Subject: [PATCH 12/18] Fix alignment/padding on dropdown entries --- src/collection-facets/smart-facets/smart-facet-dropdown.ts | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/collection-facets/smart-facets/smart-facet-dropdown.ts b/src/collection-facets/smart-facets/smart-facet-dropdown.ts index 2b2a8097b..7df850f21 100644 --- a/src/collection-facets/smart-facets/smart-facet-dropdown.ts +++ b/src/collection-facets/smart-facets/smart-facet-dropdown.ts @@ -59,8 +59,11 @@ export class SmartFacetDropdown extends LitElement { const firstFacet = smartFacet.facets[0]; return { id: firstFacet.bucketKey, - label: - smartFacet.label ?? firstFacet.displayText ?? firstFacet.bucketKey, + label: html` + ${smartFacet.label ?? + firstFacet.displayText ?? + firstFacet.bucketKey} + `, }; }) ?? [] ); From 3f07b56311834b3030f1ec70df5fbc012fc71ec9 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 4 Jun 2025 10:21:54 -0700 Subject: [PATCH 13/18] Version fix --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index ef9e09960..fa397ca01 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "description": "The Internet Archive Collection Browser.", "license": "AGPL-3.0-only", "author": "Internet Archive", - "version": "2.10.1-alpha-webdev7090.22", + "version": "2.10.0", "main": "dist/index.js", "module": "dist/index.js", "scripts": { From cbbb5d4bb3f88ad81bc02921ace102d423d47931 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 4 Jun 2025 19:10:20 -0700 Subject: [PATCH 14/18] Adjust smart facet bar styling & update cycle --- src/collection-facets/smart-facets/smart-facet-bar.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/collection-facets/smart-facets/smart-facet-bar.ts b/src/collection-facets/smart-facets/smart-facet-bar.ts index 79ccc9965..614bd5e79 100644 --- a/src/collection-facets/smart-facets/smart-facet-bar.ts +++ b/src/collection-facets/smart-facets/smart-facet-bar.ts @@ -105,6 +105,7 @@ export class SmartFacetBar extends LitElement { } refresh(): void { + this.lastAggregations = this.aggregations; this.updateSmartFacets(); } @@ -367,7 +368,7 @@ export class SmartFacetBar extends LitElement { #filters-label { font-weight: bold; - margin-right: -5px; + margin: 0 -5px 0 0; } `; } From 3479c2daf3f3c86e16d7285e87395c7f1b76276c Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 4 Jun 2025 19:11:09 -0700 Subject: [PATCH 15/18] Emit event when facet pane visibility changes --- src/collection-browser.ts | 29 ++++++++++++++++++++++++----- 1 file changed, 24 insertions(+), 5 deletions(-) diff --git a/src/collection-browser.ts b/src/collection-browser.ts index 77fb5f86b..37e5c0e92 100644 --- a/src/collection-browser.ts +++ b/src/collection-browser.ts @@ -521,6 +521,7 @@ export class CollectionBrowser @facetsChanged=${this.facetsChanged} @filtersToggled=${() => { this.facetPaneVisible = !this.facetPaneVisible; + this.emitFacetPaneVisibilityChanged(); }} >` : nothing} @@ -687,11 +688,14 @@ export class CollectionBrowser * tiles and sort/filter bar are shown. */ private get rightColumnTemplate(): TemplateResult { + const rightColumnClasses = classMap({ + column: true, + 'full-width': this.showSmartFacetBar && !this.facetPaneVisible, + 'smart-results-spacing': !!this.showSmartResults, + }); + return html` -
+
${this.showSmartResults ? html`` : nothing} @@ -1672,6 +1676,18 @@ export class CollectionBrowser ); } + /** + * Emits a `facetPaneVisibilityChanged` event indicating that the facet pane has + * been toggled open or closed. + */ + private emitFacetPaneVisibilityChanged(): void { + this.dispatchEvent( + new CustomEvent('facetPaneVisibilityChanged', { + detail: this.facetPaneVisible, + }), + ); + } + /** * Emits a `queryStateChanged` event indicating that one or more of this component's * properties have changed in a way that could affect the set of search results. @@ -2216,13 +2232,16 @@ export class CollectionBrowser flex: 1; position: relative; min-height: 90vh; - border-left: 1px solid rgb(232, 232, 232); border-right: 1px solid rgb(232, 232, 232); margin-top: var(--rightColumnMarginTop, 0); padding-top: 2rem; background: #fff; } + #left-column:not([hidden]) + #right-column { + border-left: 1px solid rgb(232, 232, 232); + } + #right-column.smart-results-spacing { padding-top: 0.5rem; border-right: none; From 8f64f6e1ef61ceb7758836b9f14ee80db2411eef Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Thu, 5 Jun 2025 12:46:21 -0700 Subject: [PATCH 16/18] Suppress mediatype-only facets from heuristics --- src/collection-facets/smart-facets/smart-facet-bar.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/collection-facets/smart-facets/smart-facet-bar.ts b/src/collection-facets/smart-facets/smart-facet-bar.ts index 614bd5e79..afb91fe11 100644 --- a/src/collection-facets/smart-facets/smart-facet-bar.ts +++ b/src/collection-facets/smart-facets/smart-facet-bar.ts @@ -175,6 +175,10 @@ export class SmartFacetBar extends LitElement { if (this.heuristicRecs.length > 0) { for (const rec of this.heuristicRecs) { + // Suppress mediatype-only facets for now. + if (rec.facets.length === 1 && rec.facets[0].facetType === 'mediatype') + continue; + facets.push([rec]); } } @@ -219,10 +223,6 @@ export class SmartFacetBar extends LitElement { if (facetType === 'mediatype') { continue; // Don't include mediatype bubbles - // facets.push( - // [this.toSmartFacet(facetType, [unusedBuckets[0]])], - // [this.toSmartFacet(facetType, [unusedBuckets[1]])], - // ); } else if (facetType === 'collection' || facetType === 'subject') { const topBuckets = unusedBuckets.slice(0, 5); facets.push(topBuckets.map(b => this.toSmartFacet(facetType, [b]))); From e2debb11eea03235014db081ea5d0a0689dd3e31 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 11 Jun 2025 17:05:11 -0700 Subject: [PATCH 17/18] Add missing unit test --- test/collection-browser.test.ts | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/test/collection-browser.test.ts b/test/collection-browser.test.ts index 42a1a4ad2..c5224b248 100644 --- a/test/collection-browser.test.ts +++ b/test/collection-browser.test.ts @@ -2044,4 +2044,23 @@ describe('Collection Browser', () => { const initialResults = el.dataSource.getAllPages(); expect(Object.keys(initialResults).length).to.deep.equal(numberOfPages); }); + + it('renders provided results header instead of default, when showing smart results', async () => { + const searchService = new MockSearchService(); + + const el = await fixture( + html``, + ); + + el.baseQuery = 'foo'; + await el.updateComplete; + await nextTick(); + + const header = el.shadowRoot?.querySelector('.results-section-heading'); + expect(header?.textContent?.trim()).to.equal('Foo Bar'); + }); }); From 2e618250ab0dcb072e77e22fb3f58be052b7dcd4 Mon Sep 17 00:00:00 2001 From: Laton Vermette <1619661+latonv@users.noreply.github.com> Date: Wed, 11 Jun 2025 17:48:02 -0700 Subject: [PATCH 18/18] Upgrade off alpha search-service --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index fa397ca01..60cc553ce 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "@internetarchive/iaux-item-metadata": "^1.0.4", "@internetarchive/infinite-scroller": "^1.0.1", "@internetarchive/modal-manager": "^2.0.1", - "@internetarchive/search-service": "2.0.1-alpha-webdev7090.1", + "@internetarchive/search-service": "^2.1.0", "@internetarchive/shared-resize-observer": "^0.2.0", "@lit/localize": "^0.12.2", "dompurify": "^3.2.4", diff --git a/yarn.lock b/yarn.lock index f5bf11daa..c81b4d197 100644 --- a/yarn.lock +++ b/yarn.lock @@ -407,10 +407,10 @@ resolved "https://registry.yarnpkg.com/@internetarchive/result-type/-/result-type-0.0.1.tgz#a1bda4428dc557cc644a67783f1b8d5944ae4d54" integrity sha512-sWahff5oP1xAK1CwAu1/5GTG2RXsdx/sQKn4SSOWH0r0vU2QoX9kAom/jSXeBsmgK0IjTc+9Ty9407SMORi+nQ== -"@internetarchive/search-service@2.0.1-alpha-webdev7090.1": - version "2.0.1-alpha-webdev7090.1" - resolved "https://registry.yarnpkg.com/@internetarchive/search-service/-/search-service-2.0.1-alpha-webdev7090.1.tgz#8443e2f3317016ccc99738c865e5b9ba85906946" - integrity sha512-flHZsLBxG+Rvau/hNiNhkCKyK48gjjtFR+2daupNlgiZAZeL83W7en+nleC0+qkyUTfuqpsFxJorteqbGH2VIQ== +"@internetarchive/search-service@^2.1.0": + version "2.1.0" + resolved "https://registry.yarnpkg.com/@internetarchive/search-service/-/search-service-2.1.0.tgz#7cceac2ff0055904a47c21248c95142865f37337" + integrity sha512-amEwRNvEgOcxPvgDLuQPWKeJIH68c7cWxtijAesWIwav4cH3K7ZR8LCJXzFMCx4Y1FWq8zrYx33jn5lvgCSUjg== dependencies: "@internetarchive/iaux-item-metadata" "^1.0.4" "@internetarchive/result-type" "^0.0.1"