feat: full-text advanced search field, in Bootstrap Dropdown (#1982)

* feat: video fulltext search * feat: replace API toggle with fulltext input * fix: request hits if fulltext queried * refactor: preserve fulltext query; stop preserving api query * chore: grammar * feat: add full-text advanced search field * chore: linting * fix: do not field blank metadata query * refactor: use bootstrap dropdown for adv search field * refactor: add aggregated fields to mixin * fix: update local field * chore: linting * style: increase height of adv search field dropdown * style: add class for search filter dropdown * chore: re-apply height increase * chore: style linting * feat: alert users to API toggle replacement * test: update specs * chore: deodorise code smells * style: set colours for info alerts * chore: remove redundant recordsPerPage * refactor: use computed properties for API params & options * chore: re-remove api param * refactor: loop over dropdown sections; l10n * Fix active styles secondary button and dropdown toggle * Clean up unused STANDARD_API_DEFAULT data prop * chore: supply required mock * Add placeholders for advanced search inputs * Use close icon for alert * chore: remove unused var * Style lint fixes * Revert date filter apply button styles to be defined in the component * feat: add custom rule validation with popover messages * refactor: use feedback validation * chore: linting * fix: use method name for watch handler * feat: apply validation state to form controls * refactor: add validation callback * chore: method ordering * Fix form validation styles * Fix invalid focus styles * test: spec rule validation and event handling * test: spec rule validation * refactor: dropdown for modifier; DRY up template * chore: move computed prop * feat: full-text in query, text in qf * fix: combine query into one qf, then concat to other qfs * chore: linting * refactor: move adv search rules to qf * test: update API param specs * test: add e2e test for full-text adv search * refactor: include parentheses around fulltext * refactor: derive qa parsing patterns * Update hover style dropdown group item * chore: remove redundant comment * chore: bump size limits * refactor: add adv search dropdown component * test: spec adv search dropdown component * l10n: update translations (#1998) Co-authored-by: lbiedinger <[email protected]> * l10n: update translations (#1999) Co-authored-by: lbiedinger <[email protected]> * Update reset button text and allow to wrap (#1994) * feat: disable scrollToZoom for mouse in mirador (#1995) * style: update account page styles (#1997) * Update account page background to white and buttons to secondary variant * Set xxl page styles * fix: revert unintended content type change * l10n: update translations (#2001) Co-authored-by: rwd <[email protected]> * chore: permit (invalid) https IIIF contexts * v1.116.0 * fix: invalid truthiness checks * chore: optimise portal DockerFile (#1991) * chore: move client-only deps to dev deps * chore: nuxtjs/i18n and lang files are build deps * chore: npm ci * chore: make vuedraggable client/dev dependency * chore: update nuxt to v2.17.0 (#2002) * fix: remove duplicate key --------- Co-authored-by: Leonie Peters <[email protected]> Co-authored-by: Europeana Foundation Development <[email protected]> Co-authored-by: lbiedinger <[email protected]> Co-authored-by: Leonie Peters <[email protected]> Co-authored-by: rwd <[email protected]>
europeana · Jul 24, 2023 · 23ccbb9 · 23ccbb9
1 parent 1e7141a
commit 23ccbb9
Show file tree

Hide file tree

Showing 32 changed files with 31,524 additions and 8,387 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/portal/.env.example b/packages/portal/.env.example
@@ -32,10 +32,10 @@ PORTAL_BASE_URL=https://www.europeana.eu
 
 # Europeana API keys
 # EUROPEANA_ANNOTATION_API_KEY="YOUR_API_KEY"
-# EUROPEANA_RECORD_API_KEY="YOUR_API_KEY"
 # EUROPEANA_ENTITY_API_KEY="YOUR_API_KEY"
+# EUROPEANA_FULLTEXT_API_KEY="YOUR_API_KEY"
+# EUROPEANA_RECORD_API_KEY="YOUR_API_KEY"
 # EUROPEANA_SET_API_KEY="YOUR_API_KEY"
-# EUROPEANA_NEWSPAPER_API_KEY="YOUR_API_KEY"
 
 # Europeana API URLs
 # EUROPEANA_ANNOTATION_API_URL=

diff --git a/packages/portal/src/components/search/SearchDateFilter.vue b/packages/portal/src/components/search/SearchDateFilter.vue
@@ -150,17 +150,16 @@
     height: 2.5rem;
     vertical-align: bottom;
     margin-left: 0.25rem;
-
     @at-root .xxl-page & {
       @media (min-width: $bp-4k) {
         height: calc(1.5 * 2.5rem);
         margin-left: calc(1.5 * 0.25rem);
       }
     }
   }
-
   .apply-icon {
     transform: rotate(-90deg);
     display: inline-block;
   }
+
 </style>
diff --git a/packages/portal/src/components/search/SearchFacetDropdown.vue b/packages/portal/src/components/search/SearchFacetDropdown.vue
@@ -56,6 +56,7 @@
             ref="dropdown"
             block
             no-flip
+            class="search-filter-dropdown"
             :data-qa="`${name} side facet dropdown button`"
             @show="prefetch"
             @shown="shownDropdown"

diff --git a/packages/portal/src/components/search/SearchFilters.vue b/packages/portal/src/components/search/SearchFilters.vue
@@ -36,18 +36,16 @@
               data-qa="search filters"
             >
               <div class="position-relative">
-                <SearchSwitchFilter
-                  v-if="enableApiFilter"
-                  :value="filters.api"
-                  name="api"
-                  :label="$t('facets.api.switch')"
-                  :tooltip="$t('facets.api.switchMoreInfo')"
-                  checked-value="fulltext"
-                  :unchecked-value="STANDARD_API_DEFAULT"
-                  :default-value="apiFilterDefaultValue"
-                  :collection="collection"
-                  @changed="changeFacet"
-                />
+                <b-alert
+                  v-for="fulltextCollection in ['newspaper', 'ww1']"
+                  :key="fulltextCollection"
+                  :show="showFulltextHasMovedAlert(fulltextCollection)"
+                  variant="info"
+                  dismissible
+                  @input="(show) => handleFulltextHasMovedAlertInput(show, fulltextCollection)"
+                >
+                  {{ $t('facets.alert.fulltextHasMoved') }}
+                </b-alert>
                 <SearchDateFilter
                   v-if="enableDateFilter"
                   :name="dateFilterField"
@@ -127,6 +125,7 @@
 </template>
 
 <script>
+  import { BAlert } from 'bootstrap-vue';
   import ClientOnly from 'vue-client-only';
   import isEqual from 'lodash/isEqual';
   import { rangeToQueryParam, rangeFromQueryParam, filtersFromQf } from '@/plugins/europeana/search';
@@ -138,6 +137,7 @@
     name: 'SearchFilters',
 
     components: {
+      BAlert,
       ClientOnly,
       SearchFacetDropdown,
       SearchDateFilter: () => import('./SearchDateFilter'),
@@ -202,7 +202,6 @@
           'proxy_dc_format.en',
           'proxy_dcterms_medium.en'
         ],
-        STANDARD_API_DEFAULT: 'metadata',
         hideFilterSheet: true,
         showAdditionalFilters: false
       };
@@ -222,10 +221,6 @@
           filters['REUSABILITY'] = this.userParams.reusability.split(',');
         }
 
-        if (this.apiParams?.api) {
-          filters['api'] = this.apiParams.api;
-        }
-
         return filters;
       },
       resettableFilters() {
@@ -236,9 +231,6 @@
         if (this.contentTierFacetSwitch && this.filters.contentTier) {
           filters.push('contentTier');
         }
-        if (this.enableApiFilter && (this.filters.api !== this.STANDARD_API_DEFAULT)) {
-          filters.push('api');
-        }
         if (this.enableDateFilter && this.filters[this.dateFilterField]) {
           filters.push(this.dateFilterField);
         }
@@ -306,9 +298,6 @@
       reusability() {
         return this.userParams.reusability;
       },
-      api() {
-        return this.userParams.api;
-      },
       view() {
         return this.userParams.view;
       },
@@ -319,12 +308,6 @@
         // This is a workaround
         return Number(this.$route.query.page || 1);
       },
-      enableApiFilter() {
-        return !!this.theme?.filters?.api;
-      },
-      apiFilterDefaultValue() {
-        return this.theme?.filters?.api?.default || null;
-      },
       enableDateFilter() {
         return !!this.theme?.filters?.date;
       },
@@ -375,8 +358,18 @@
       this.$store.commit('search/setShowFiltersToggle', false);
     },
     methods: {
+      showFulltextHasMovedAlert(collection) {
+        return process.client &&
+          (collection === this.collection) &&
+          (localStorage.getItem(`fulltextHasMovedAlertDismissed.${this.collection}`) !== 'true');
+      },
+      handleFulltextHasMovedAlertInput(show, collection) {
+        if (show === false) {
+          localStorage.setItem(`fulltextHasMovedAlertDismissed.${collection}`, 'true');
+        }
+      },
       facetDropdownType(name) {
-        return name === this.COLLECTION_FACET_NAME || name === 'api' ? 'radio' : 'checkbox';
+        return name === this.COLLECTION_FACET_NAME ? 'radio' : 'checkbox';
       },
       changeFacet(name, selected) {
         if (typeof this.filters[name] === 'undefined') {
@@ -422,16 +415,10 @@
         };
 
         for (const name in filters) {
-          switch (name) {
-          case 'REUSABILITY':
+          if (name === 'REUSABILITY') {
             // `reusability` has its own API parameter and can not be queried in `qf`
             queryUpdates.reusability = (filters[name]?.length || 0) > 0 ? filters[name].join(',') : null;
-            break;
-          case 'api':
-            // `api` is an option to /plugins/europeana/search/search()
-            queryUpdates.api = filters[name];
-            break;
-          default:
+          } else {
             // Everything else goes in `qf`
             queryUpdates.qf = queryUpdates.qf.concat(this.queryUpdatesForFilter(name, filters[name]));
           }
@@ -463,8 +450,7 @@
           qf: this.qf,
           query: this.query,
           reusability: this.reusability,
-          view: this.view,
-          api: this.api
+          view: this.view
         };
 
         const updated = { ...current, ...updates };
@@ -482,7 +468,6 @@
         this.rerouteSearch({
           page: 1,
           qf: null,
-          api: null,
           reusability: null
         });
       },
@@ -654,4 +639,8 @@
   .form-group {
     margin-bottom: 1.5rem;
   }
+
+  .alert {
+    font-size: $font-size-extrasmall;
+  }
 </style>
diff --git a/packages/portal/src/components/search/SearchForm.vue b/packages/portal/src/components/search/SearchForm.vue
@@ -320,12 +320,11 @@
       linkGen(queryTerm, path) {
         const query = {
           boost: this.$route?.query?.boost,
-          query: queryTerm || '',
-          view: this.view,
-          api: this.$route?.query?.api,
           qa: this.$route?.query?.qa,
           qf: this.$route?.query?.qf,
-          reusability: this.$route?.query?.reusability
+          query: queryTerm || '',
+          reusability: this.$route?.query?.reusability,
+          view: this.view
         };
         return {
           path: path || this.localePath({