@eeacms/volto-cca-policy 1.0.34 → 1.0.35

package/CHANGELOG.md

@@ -4,7 +4,20 @@ 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).
 
-### [1.0.34](https://github.com/eea/volto-cca-policy/compare/1.0.33...1.0.34) - 5 October 2026
+### [1.0.35](https://github.com/eea/volto-cca-policy/compare/1.0.34...1.0.35) - 6 October 2026
+
+#### :bug: Bug Fixes
+
+- fix(test): add waitFor to image load assertions [kreafox - [`84eed2e`](https://github.com/eea/volto-cca-policy/commit/84eed2e15a911d9a8a4a1d20e7d29b3de261bb7d)]
+
+#### :nail_care: Enhancements
+
+- change(navigator): conditionally render result count based on selections [kreafox - [`0ed5449`](https://github.com/eea/volto-cca-policy/commit/0ed54490c16c9a5b4652fd1de47adbad8d2c8256)]
+- change(NavigatorGuide): implement sorting for guide options - refs #304612 [kreafox - [`4ffcbff`](https://github.com/eea/volto-cca-policy/commit/4ffcbff4f98a2c95b1c88dfc0f662c2906678c13)]
+- change(navigator): implement default sorting in guide me tools listing - refs #304612 [kreafox - [`a9f7fb3`](https://github.com/eea/volto-cca-policy/commit/a9f7fb31b276ed2c28d0fa24b800bebfd0ff5425)]
+- change(CatalogueChatView): remove CompareToolsPanel and update tests - refs #309337 [kreafox - [`a5bb420`](https://github.com/eea/volto-cca-policy/commit/a5bb420e8a3229b1a04fd38f36ee87266bb0e59d)]
+
+### [1.0.34](https://github.com/eea/volto-cca-policy/compare/1.0.33...1.0.34) - 6 October 2026
 
 #### :nail_care: Enhancements
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-cca-policy",
-  "version": "1.0.34",
+  "version": "1.0.35",
   "description": "@eeacms/volto-cca-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/src/components/Search/NavigatorGuide/NavigatorGuideContentView.jsx

@@ -5,11 +5,11 @@ import { useHistory } from 'react-router-dom';
 import { defineMessages, useIntl } from 'react-intl';
 import { Button, Checkbox, Icon, Loader, Message } from 'semantic-ui-react';
 import URLManager from '@elastic/search-ui/lib/cjs/URLManager';
-import { useSearchContext } from '@eeacms/search/lib/hocs';
+import { useSearchContext, useSearchDriver } from '@eeacms/search/lib/hocs';
 import ToolThumbnail from '@eeacms/volto-cca-policy/components/theme/ToolThumbnail/ToolThumbnail';
 import guideSteps from '../../../search/navigator_guide/guideSteps';
 import { navigatorGuideStepAtom } from '../../../state';
-import { mergeGuideOptions, sortAdaptationSteps } from './utils';
+import { mergeGuideOptions, sortGuideOptions } from './utils';
 import { rawValueAsArray } from '../NavigatorCatalogue/utils';
 import useGuideFacetOptions from './useGuideFacetOptions';
 import { getNavigatorCataloguePageURL } from '../../Search/NavigatorCatalogue/utils';
@@ -106,6 +106,7 @@ const NavigatorGuideContentView = ({ appConfig }) => {
   const history = useHistory();
   const currentLang = useSelector((state) => state.intl.locale || 'en');
   const searchContext = useSearchContext();
+  const driver = useSearchDriver();
   const {
     addFilter,
     facets,
@@ -113,8 +114,12 @@ const NavigatorGuideContentView = ({ appConfig }) => {
     isLoading,
     removeFilter,
     results,
+    searchTerm,
+    sortDirection,
+    sortField,
     totalResults,
   } = searchContext;
+  const defaultSortApplied = React.useRef(false);
   const steps = guideSteps;
   const allFacetOptions = useGuideFacetOptions(appConfig, steps);
   const [storedActiveStep, setActiveStep] = useAtom(navigatorGuideStepAtom);
@@ -137,10 +142,7 @@ const NavigatorGuideContentView = ({ appConfig }) => {
     selectedValues,
     hasSelections,
   );
-  const options =
-    step?.id === 'adaptationStage'
-      ? sortAdaptationSteps(mergedOptions)
-      : mergedOptions;
+  const options = sortGuideOptions(mergedOptions, step?.id, currentLang);
   const isLastStep = activeStep === steps.length - 1;
   const selectedStepLabels = steps
     .filter(({ field }) => isStepSelected(filters, field))
@@ -171,6 +173,23 @@ const NavigatorGuideContentView = ({ appConfig }) => {
     }
   }, [activeStep, setActiveStep, storedActiveStep]);
 
+  React.useEffect(() => {
+    if (!driver || defaultSortApplied.current) return;
+    defaultSortApplied.current = true;
+
+    if (
+      searchTerm?.trim() ||
+      sortField ||
+      sortDirection ||
+      !appConfig.defaultSort
+    ) {
+      return;
+    }
+
+    const [field, direction] = appConfig.defaultSort.split('|');
+    if (field && direction) driver.setSort(field, direction);
+  }, [appConfig.defaultSort, driver, searchTerm, sortDirection, sortField]);
+
   const toggleValue = (value) => {
     if (selectedValues.includes(value)) {
       removeFilter(step.field, value, step.filterType);
@@ -339,16 +358,18 @@ const NavigatorGuideContentView = ({ appConfig }) => {
               {intl.formatMessage(messages.livePreview)}
             </div>
           </div>
-          <div className="navigator-guide-result-count">
-            <span className="navigator-guide-result-count-value">
-              {isLoading ? '…' : totalResults || 0}
-            </span>
-            <p>
-              {intl.formatMessage(messages.toolsMatch, {
-                count: totalResults || 0,
-              })}
-            </p>
-          </div>
+          {hasSelections && (
+            <div className="navigator-guide-result-count">
+              <span className="navigator-guide-result-count-value">
+                {isLoading ? '…' : totalResults || 0}
+              </span>
+              <p>
+                {intl.formatMessage(messages.toolsMatch, {
+                  count: totalResults || 0,
+                })}
+              </p>
+            </div>
+          )}
           {selectedStepLabels.length > 0 && (
             <p className="navigator-guide-preview-refinements">
               {intl.formatMessage(messages.refinedBy, {

package/src/components/Search/NavigatorGuide/NavigatorGuideContentView.test.jsx

@@ -5,7 +5,7 @@ import { IntlProvider } from 'react-intl';
 import { useAtom } from 'jotai';
 import { useSelector } from 'react-redux';
 import { useHistory } from 'react-router-dom';
-import { useSearchContext } from '@eeacms/search/lib/hocs';
+import { useSearchContext, useSearchDriver } from '@eeacms/search/lib/hocs';
 import NavigatorGuideContentView from './NavigatorGuideContentView';
 import useGuideFacetOptions from './useGuideFacetOptions';
 
@@ -15,7 +15,10 @@ jest.mock('jotai', () => ({
 }));
 jest.mock('react-redux', () => ({ useSelector: jest.fn() }));
 jest.mock('react-router-dom', () => ({ useHistory: jest.fn() }));
-jest.mock('@eeacms/search/lib/hocs', () => ({ useSearchContext: jest.fn() }));
+jest.mock('@eeacms/search/lib/hocs', () => ({
+  useSearchContext: jest.fn(),
+  useSearchDriver: jest.fn(),
+}));
 jest.mock('./useGuideFacetOptions', () => ({
   __esModule: true,
   default: jest.fn(),
@@ -32,11 +35,20 @@ const renderGuide = (result, searchContext = {}) => {
   });
   return render(
     <IntlProvider locale="en">
-      <NavigatorGuideContentView appConfig={{ previewResultsLimit: 3 }} />
+      <NavigatorGuideContentView
+        appConfig={{
+          previewResultsLimit: 3,
+          defaultSort: 'title.index|asc',
+        }}
+      />
     </IntlProvider>,
   );
 };
 
+beforeEach(() => {
+  useSearchDriver.mockReturnValue(undefined);
+});
+
 describe('NavigatorGuideContentView thumbnails', () => {
   beforeEach(() => {
     jest.clearAllMocks();
@@ -94,6 +106,64 @@ describe('NavigatorGuideContentView thumbnails', () => {
   });
 });
 
+describe('NavigatorGuideContentView empty preview', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    useAtom.mockReturnValue([0, jest.fn()]);
+    useSelector.mockReturnValue('en');
+    useHistory.mockReturnValue({ push: jest.fn() });
+    useGuideFacetOptions.mockReturnValue({});
+  });
+
+  it('hides the result count while the preview empty state is visible', () => {
+    const { container } = renderGuide(
+      { title: 'Guide tool', href: '/tools/guide-tool' },
+      { filters: [] },
+    );
+
+    expect(
+      container.querySelector('.navigator-guide-preview-empty'),
+    ).toBeInTheDocument();
+    expect(
+      container.querySelector('.navigator-guide-result-count'),
+    ).not.toBeInTheDocument();
+  });
+});
+
+describe('NavigatorGuideContentView sorting', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    useAtom.mockReturnValue([0, jest.fn()]);
+    useSelector.mockReturnValue('en');
+    useHistory.mockReturnValue({ push: jest.fn() });
+    useGuideFacetOptions.mockReturnValue({});
+  });
+
+  it('starts with title A-Z when URL filters leave the sort unset', () => {
+    const driver = { setSort: jest.fn() };
+    useSearchDriver.mockReturnValue(driver);
+
+    renderGuide(
+      { title: 'Guide tool', href: '/tools/guide-tool' },
+      { searchTerm: '', sortField: '', sortDirection: '' },
+    );
+
+    expect(driver.setSort).toHaveBeenCalledWith('title.index', 'asc');
+  });
+
+  it('preserves an active sort', () => {
+    const driver = { setSort: jest.fn() };
+    useSearchDriver.mockReturnValue(driver);
+
+    renderGuide(
+      { title: 'Guide tool', href: '/tools/guide-tool' },
+      { sortField: 'title.index', sortDirection: 'desc' },
+    );
+
+    expect(driver.setSort).not.toHaveBeenCalled();
+  });
+});
+
 describe('NavigatorGuideContentView adaptation steps', () => {
   beforeEach(() => {
     jest.clearAllMocks();

package/src/components/Search/NavigatorGuide/utils.js

@@ -43,3 +43,10 @@ export const sortAdaptationSteps = (options) =>
     if (bStep) return 1;
     return a.value.localeCompare(b.value);
   });
+
+export const sortGuideOptions = (options, stepId, locale = 'en') =>
+  stepId === 'adaptationStage'
+    ? sortAdaptationSteps(options)
+    : [...options].sort((a, b) =>
+        a.value.localeCompare(b.value, locale, { sensitivity: 'base' }),
+      );

package/src/components/Search/NavigatorGuide/utils.test.js

@@ -1,4 +1,8 @@
-import { mergeGuideOptions, sortAdaptationSteps } from './utils';
+import {
+  mergeGuideOptions,
+  sortAdaptationSteps,
+  sortGuideOptions,
+} from './utils';
 
 describe('Navigator Guide utilities', () => {
   it('keeps unavailable values and marks them as disabled', () => {
@@ -54,4 +58,29 @@ describe('Navigator Guide utilities', () => {
     ]);
     expect(options[0].value).toBe('Step 10: Review');
   });
+
+  it('sorts regular guide options alphabetically without mutating them', () => {
+    const options = [
+      { value: 'Water', count: 3 },
+      { value: 'Agriculture', count: 8 },
+      { value: 'Biodiversity', count: 5 },
+    ];
+
+    expect(
+      sortGuideOptions(options, 'adaptationSectors').map(({ value }) => value),
+    ).toEqual(['Agriculture', 'Biodiversity', 'Water']);
+    expect(options[0].value).toBe('Water');
+  });
+
+  it('uses numeric cycle-step order for the adaptation stage', () => {
+    const options = [
+      { value: 'Step 10: Review', count: 3 },
+      { value: 'Step 2: Assess', count: 8 },
+      { value: 'Step 1: Prepare', count: 5 },
+    ];
+
+    expect(
+      sortGuideOptions(options, 'adaptationStage').map(({ value }) => value),
+    ).toEqual(['Step 1: Prepare', 'Step 2: Assess', 'Step 10: Review']);
+  });
 });

package/src/components/manage/Blocks/ChatbotCatalogue/CatalogueChatView.jsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { ChatWindow } from '@eeacms/volto-eea-chatbot/ChatBlock/chat';
-import { CompareToolsPanel } from '../../../theme/CompareTools/CompareToolsPanel';
 
 import { CcaDocCard } from './DocumentCard';
 import { remarkCcaDocCards } from './docCards';
@@ -33,24 +32,17 @@ const extraRemarkPlugins = [remarkCcaDocCards, remarkCcaNextSteps];
  *     turned into inline Navigator-style catalogue cards (`CcaDocCard`),
  *     and "Suggested next steps" sections are turned into styled callout boxes.
  *
- * It also renders `<CompareToolsPanel />` so that when users activate the
- * "Compare" checkbox on any document card, the floating comparison panel
- * appears and allows navigating to the side-by-side comparison view.
- *
  * `ChatBlockView` renders this as `<Presentation persona {...blockData} />`,
  * so all block fields arrive as top-level props and are forwarded unchanged.
  */
 function CatalogueChatView(props) {
   return (
-    <>
-      <ChatWindow
-        {...props}
-        hideSourcesTab
-        extraRemarkPlugins={extraRemarkPlugins}
-        extraMarkdownComponents={extraMarkdownComponents}
-      />
-      <CompareToolsPanel />
-    </>
+    <ChatWindow
+      {...props}
+      hideSourcesTab
+      extraRemarkPlugins={extraRemarkPlugins}
+      extraMarkdownComponents={extraMarkdownComponents}
+    />
   );
 }
 

package/src/components/manage/Blocks/ChatbotCatalogue/CatalogueChatView.test.jsx

@@ -17,10 +17,6 @@ jest.mock('@eeacms/volto-eea-chatbot/ChatBlock/chat', () => ({
   )),
 }));
 
-jest.mock('../../../theme/CompareTools/CompareToolsPanel', () => ({
-  CompareToolsPanel: jest.fn(() => <div data-testid="compare-tools-panel" />),
-}));
-
 describe('CatalogueChatView', () => {
   beforeEach(() => {
     ChatWindow.mockClear();
@@ -74,9 +70,4 @@ describe('CatalogueChatView', () => {
     expect(secondMd).toBe(firstMd);
     expect(secondPlugins).toBe(firstPlugins);
   });
-
-  it('renders the CompareToolsPanel alongside the chat window', () => {
-    const { getByTestId } = render(<CatalogueChatView persona={{}} />);
-    expect(getByTestId('compare-tools-panel')).toBeInTheDocument();
-  });
 });

package/src/components/theme/CompareTools/CompareToolsView.test.jsx

@@ -1,6 +1,12 @@
 import React from 'react';
 import '@testing-library/jest-dom';
-import { fireEvent, render, screen, within } from '@testing-library/react';
+import {
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+  within,
+} from '@testing-library/react';
 import { IntlProvider } from 'react-intl';
 import { useAtom } from 'jotai';
 import { useDispatch, useSelector } from 'react-redux';
@@ -210,8 +216,10 @@ describe('CompareToolsView', () => {
 
     fireEvent.load(img);
 
-    expect(img.style.display).toBe('');
-    expect(thumbnail.querySelector('.ri-file-line')).not.toBeInTheDocument();
+    await waitFor(() => {
+      expect(img.style.display).toBe('');
+      expect(thumbnail.querySelector('.ri-file-line')).not.toBeInTheDocument();
+    });
   });
 
   it('falls back to the file icon when the image fails', async () => {

package/src/search/navigator_guide/config.js

@@ -8,6 +8,7 @@ const previewResultsLimit = 3;
 
 const navigatorGuideConfig = {
   title: 'Navigator Guide',
+  defaultSort: 'title.index|asc',
   alwaysSearchOnInitialLoad: true,
   resultsPerPage: previewResultsLimit,
   previewResultsLimit,