Merge pull request #130 from eea/develop

Release
eea · Mar 25, 2024 · b6af714 · b6af714
2 parents 93f39af + 2b92a5d
commit b6af714
Show file tree

Hide file tree

Showing 10 changed files with 114 additions and 109 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,11 +4,19 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
-### [0.9.1](https://github.com/eea/volto-searchlib/compare/0.9.0...0.9.1) - 20 March 2024
+### [0.9.2](https://github.com/eea/volto-searchlib/compare/0.9.1...0.9.2) - 25 March 2024
+
+#### :bug: Bug Fixes
 
-#### :rocket: New Features
+- fix: filters selection on mobile [kreafox - [`04ee9fe`](https://github.com/eea/volto-searchlib/commit/04ee9fe7b8b1c34dcefae2821ddd3762f58fd437)]
+- fix: remove unused import [kreafox - [`0a60a99`](https://github.com/eea/volto-searchlib/commit/0a60a9900b7df578697de3dd4439d252d5a5bb22)]
 
-- feat: possibility to hide active filters and remove filter icon [laszlocseh - [`9ca61d1`](https://github.com/eea/volto-searchlib/commit/9ca61d1665e351783e27e958e5b3da0763a0f6fd)]
+#### :nail_care: Enhancements
+
+- change: use loader in modal facet [kreafox - [`80650d5`](https://github.com/eea/volto-searchlib/commit/80650d56a92fd54a0458e02eb12089a1e94a790e)]
+- change: disable search phrases [kreafox - [`d9a0fbf`](https://github.com/eea/volto-searchlib/commit/d9a0fbf839d4fb7366169e7e1124e25843c65a06)]
+
+### [0.9.1](https://github.com/eea/volto-searchlib/compare/0.9.0...0.9.1) - 20 March 2024
 
 ### [0.9.0](https://github.com/eea/volto-searchlib/compare/0.8.0...0.9.0) - 18 March 2024
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-searchlib",
-  "version": "0.9.1",
+  "version": "0.9.2",
   "description": "@eeacms/volto-searchlib: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

diff --git a/searchlib/components/Facets/SidebarFacetsList.jsx b/searchlib/components/Facets/SidebarFacetsList.jsx
@@ -68,8 +68,8 @@ export default function SidebarFacetsList(props) {
             {facets.map((facetInfo, i) => (
               <FacetResolver
                 key={i}
-                {...searchContext}
                 {...facetInfo}
+                {...searchContext}
                 wrapper="AccordionFacetWrapper"
               />
             ))}

diff --git a/searchlib/components/Facets/Wrappers/DropdownFacetWrapper.jsx b/searchlib/components/Facets/Wrappers/DropdownFacetWrapper.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { connect } from 'react-redux';
+import { useSelector } from 'react-redux';
 import {
   useAppConfig,
   useProxiedSearchContext,
@@ -32,8 +32,8 @@ const DropdownFacetWrapper = (props) => {
     sortedOptions,
     filterType,
     isLoading,
-    token,
   } = props;
+  const token = useSelector((state) => state.userSession.token);
   const rawSearchContext = useSearchContext();
   const {
     searchContext: facetSearchContext,
@@ -99,15 +99,13 @@ const DropdownFacetWrapper = (props) => {
             </Modal.Header>
             <Modal.Content>
               <SearchContext.Provider value={facetSearchContext}>
-                {isLoading && <Dimmer active></Dimmer>}
                 <SUIFacet
                   {...props}
                   active={isOpen}
                   filterType={localFilterType}
                   onChangeFilterType={setLocalFilterType}
                 />
               </SearchContext.Provider>
-
               {!hideActiveFilters && (
                 <ActiveFilters
                   sortedOptions={sortedOptions}
@@ -207,6 +205,4 @@ const DropdownFacetWrapper = (props) => {
   );
 };
 
-export default connect((state) => ({
-  token: state.userSession?.token,
-}))(DropdownFacetWrapper);
+export default DropdownFacetWrapper;
diff --git a/searchlib/components/SearchApp/SearchInputApp.jsx b/searchlib/components/SearchApp/SearchInputApp.jsx
@@ -35,7 +35,7 @@ const BootstrapSearchInputView = (props) => {
       autocompleteResults={appConfig.autocomplete.results}
       autocompleteSuggestions={appConfig.autocomplete.suggestions}
       shouldClearFilters={false}
-      useSearchPhrases={appConfig.useSearchPhrases}
+      // useSearchPhrases={appConfig.useSearchPhrases}
       inputView={
         appConfig.searchBoxInputComponent
           ? registry.resolve[appConfig.searchBoxInputComponent].component

diff --git a/searchlib/components/SearchApp/request.js b/searchlib/components/SearchApp/request.js
@@ -81,14 +81,14 @@ export function removeFilter(name, value, type) {
   let updatedFilters = [...(filters || [])];
 
   if (!value && type) {
-    if (!filter.missing) {
+    if (!filter?.missing) {
       updatedFilters = filters.filter(
         (filter) => !(filter.field === name && filter.type === type),
       );
     } else {
       updatedFilters = [
         ...filters.filter((filter) => filter.field !== name),
-        { ...filter.missing, field: name },
+        { ...filter?.missing, field: name },
       ];
     }
   } else if (value) {

diff --git a/searchlib/components/SearchBox/SearchBox.jsx b/searchlib/components/SearchBox/SearchBox.jsx
@@ -74,24 +74,27 @@ export class SearchBoxContainer extends Component {
   };
 
   completeSuggestion = (suggestedTerm) => {
-    const { shouldClearFilters, setSearchTerm } = this.props;
+    const {
+      // shouldClearFilters,
+      setSearchTerm,
+    } = this.props;
 
-    if (this.props.useSearchPhrases) {
-      let searchPhrases = this.props.searchTerm.split('|');
-      searchPhrases.pop();
-      searchPhrases.push(suggestedTerm);
+    // if (this.props.useSearchPhrases) {
+    //   let searchPhrases = this.props.searchTerm.split('|');
+    //   searchPhrases.pop();
+    //   searchPhrases.push(suggestedTerm);
 
-      setSearchTerm(`${searchPhrases.join('|')}|`, {
-        shouldClearFilters,
-      });
-    } else {
-      const { searchContext, appConfig } = this.props;
-      if (!searchContext.filters?.length)
-        resetFiltersToDefault(searchContext, appConfig);
-      setSearchTerm(suggestedTerm, {
-        shouldClearFilters: false,
-      });
-    }
+    //   setSearchTerm(`${searchPhrases.join('|')}|`, {
+    //     shouldClearFilters,
+    //   });
+    // } else {
+    // }
+    const { searchContext, appConfig } = this.props;
+    if (!searchContext.filters?.length)
+      resetFiltersToDefault(searchContext, appConfig);
+    setSearchTerm(suggestedTerm, {
+      shouldClearFilters: false,
+    });
   };
 
   handleSubmit = (e, submittedSearchTerm, options = {}) => {
@@ -116,10 +119,10 @@ export class SearchBoxContainer extends Component {
       searchTerm = submittedSearchTerm ?? this.props.searchTerm;
     }
 
-    if (this.props.useSearchPhrases) {
-      if (!!searchTerm && !searchTerm.endsWith('|'))
-        searchTerm = `${searchTerm}|`;
-    }
+    // if (this.props.useSearchPhrases) {
+    //   if (!!searchTerm && !searchTerm.endsWith('|'))
+    //     searchTerm = `${searchTerm}|`;
+    // }
 
     e && e.preventDefault();
     setSearchTerm(searchTerm, {

diff --git a/searchlib/components/SearchInput/SearchInput.jsx b/searchlib/components/SearchInput/SearchInput.jsx
@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { Icon, Image, Button } from 'semantic-ui-react';
+import { Icon, Image } from 'semantic-ui-react';
 
 import { useAtom } from 'jotai';
 import { showExtraFacetsAtom } from './state';
@@ -46,8 +46,8 @@ function SearchInput({
   const { filters, addFilter, setFilter, ...domProps } = inputProps;
   const searchTerm = inputProps.value;
 
-  const searchPhrases = inputProps.value.split('|') || []; //.filter((p) => !!p);
-  const currentTerm = searchPhrases.pop();
+  // const searchPhrases = inputProps.value.split('|') || []; //.filter((p) => !!p);
+  // const currentTerm = searchPhrases.pop();
 
   const inpRef = React.useRef();
   const [, setShowExtraFacets] = useAtom(showExtraFacetsAtom);
@@ -60,77 +60,73 @@ function SearchInput({
     <>
       <div className="search-input">
         <div className="terms-box">
-          {searchPhrases.length === 0 ? (
-            <input
-              {...domProps}
-              enterKeyHint="search"
-              value={currentTerm}
-              ref={inpRef}
-              className=""
-              placeholder={searchPhrases?.length ? null : domProps.placeholder}
-              onChange={(event) => {
-                setShowExtraFacets(false);
-                let {
-                  target: { value },
-                } = event;
-                value = [...searchPhrases, value].join('|');
-                inputProps.onChange({ target: { value } });
-              }}
-              onKeyDown={(ev) => {
-                if (ev.key === 'Home' || ev.key === 'End') {
-                  ev.preventDefault();
-                  const {
-                    selectionStart,
-                    selectionEnd,
-                    selectionDirection,
-                  } = ev.currentTarget;
-                  let from = ev.key === 'Home' ? 0 : 10000;
-                  let to = ev.key === 'Home' ? 0 : 10000;
-                  let direction = 'forward';
-                  if (ev.shiftKey) {
-                    if (ev.key === 'Home') {
-                      from = 0;
-                      to = selectionEnd;
-                      if (selectionDirection === 'forward') {
-                        to = selectionStart;
-                      }
-                      direction = 'backward';
-                    }
-                    if (ev.key === 'End') {
-                      from = selectionStart;
-                      to = 10000;
-                      if (selectionDirection === 'backward') {
-                        from = selectionEnd;
-                      }
-                      direction = 'forward';
+          <input
+            {...domProps}
+            enterKeyHint="search"
+            value={searchTerm}
+            ref={inpRef}
+            className=""
+            placeholder={domProps.placeholder}
+            onChange={(event) => {
+              setShowExtraFacets(false);
+              let {
+                target: { value },
+              } = event;
+              // value = [...searchPhrases, value].join('|');
+              inputProps.onChange({ target: { value } });
+            }}
+            onKeyDown={(ev) => {
+              if (ev.key === 'Home' || ev.key === 'End') {
+                ev.preventDefault();
+                const {
+                  selectionStart,
+                  selectionEnd,
+                  selectionDirection,
+                } = ev.currentTarget;
+                let from = ev.key === 'Home' ? 0 : 10000;
+                let to = ev.key === 'Home' ? 0 : 10000;
+                let direction = 'forward';
+                if (ev.shiftKey) {
+                  if (ev.key === 'Home') {
+                    from = 0;
+                    to = selectionEnd;
+                    if (selectionDirection === 'forward') {
+                      to = selectionStart;
                     }
+                    direction = 'backward';
                   }
-                  ev.currentTarget.setSelectionRange(from, to, direction);
-                  return;
-                }
-                if (ev.key === 'Backspace') {
-                  if (currentTerm === '' && searchPhrases.length > 0) {
-                    const lastPhrase = searchPhrases[searchPhrases.length - 1];
-                    const fakeEvent = {
-                      target: {
-                        value: `${searchPhrases
-                          .slice(0, searchPhrases.length - 1)
-                          .join('|')}|${lastPhrase}`,
-                      },
-                    };
-                    ev.preventDefault();
-                    inputProps.onChange(fakeEvent);
-                    return;
+                  if (ev.key === 'End') {
+                    from = selectionStart;
+                    to = 10000;
+                    if (selectionDirection === 'backward') {
+                      from = selectionEnd;
+                    }
+                    direction = 'forward';
                   }
                 }
-
-                return inputProps.onKeyDown(ev);
-              }}
-              onBlur={() => {}}
-            />
-          ) : (
-            ''
-          )}
+                ev.currentTarget.setSelectionRange(from, to, direction);
+                return;
+              }
+              // if (ev.key === 'Backspace') {
+              //   if (currentTerm === '' && searchPhrases.length > 0) {
+              //     const lastPhrase = searchPhrases[searchPhrases.length - 1];
+              //     const fakeEvent = {
+              //       target: {
+              //         value: `${searchPhrases
+              //           .slice(0, searchPhrases.length - 1)
+              //           .join('|')}|${lastPhrase}`,
+              //       },
+              //     };
+              //     ev.preventDefault();
+              //     inputProps.onChange(fakeEvent);
+              //     return;
+              //   }
+              // }
+
+              return inputProps.onKeyDown(ev);
+            }}
+            onBlur={() => {}}
+          />
 
           <div className="terms-box-left">
             <div className="input-controls">
@@ -174,11 +170,11 @@ function SearchInput({
               role="button"
               className="search-icon"
               onClick={() => {
-                setSearchTerm(currentTerm, { shouldClearFilters: false });
+                setSearchTerm(searchTerm, { shouldClearFilters: false });
               }}
               onKeyDown={(e) => {
                 if (e.key === 'Enter') {
-                  setSearchTerm(currentTerm, { shouldClearFilters: false });
+                  setSearchTerm(searchTerm, { shouldClearFilters: false });
                 }
               }}
             >

diff --git a/searchlib/components/SearchView/SearchView.jsx b/searchlib/components/SearchView/SearchView.jsx
@@ -114,7 +114,7 @@ export const SearchView = (props) => {
               autocompleteResults={appConfig.autocomplete.results}
               autocompleteSuggestions={appConfig.autocomplete.suggestions}
               shouldClearFilters={false}
-              useSearchPhrases={appConfig.useSearchPhrases}
+              // useSearchPhrases={appConfig.useSearchPhrases}
               inputView={
                 appConfig.searchBoxInputComponent
                   ? registry.resolve[appConfig.searchBoxInputComponent]

diff --git a/searchlib/registry.js b/searchlib/registry.js
@@ -267,7 +267,9 @@ const config = {
       // the "content" layout, everything below the search input
       contentBodyComponent: 'DefaultContentView',
 
-      useSearchPhrases: true,
+      // disable search phrases for now, maybe it will be enabled in the future
+      // but that requires further development
+      // useSearchPhrases: true,
 
       // when entering in search view, this will be the default search text
       defaultSearchText: '',